default.css (4619B)
1 /* Base */ 2 3 body, 4 body *:not(html):not(style):not(br):not(tr):not(code) { 5 box-sizing: border-box; 6 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 7 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; 8 position: relative; 9 } 10 11 body { 12 -webkit-text-size-adjust: none; 13 background-color: #ffffff; 14 color: #718096; 15 height: 100%; 16 line-height: 1.4; 17 margin: 0; 18 padding: 0; 19 width: 100% !important; 20 } 21 22 p, 23 ul, 24 ol, 25 blockquote { 26 line-height: 1.4; 27 text-align: left; 28 } 29 30 a { 31 color: #3869d4; 32 } 33 34 a img { 35 border: none; 36 } 37 38 /* Typography */ 39 40 h1 { 41 color: #3d4852; 42 font-size: 18px; 43 font-weight: bold; 44 margin-top: 0; 45 text-align: left; 46 } 47 48 h2 { 49 font-size: 16px; 50 font-weight: bold; 51 margin-top: 0; 52 text-align: left; 53 } 54 55 h3 { 56 font-size: 14px; 57 font-weight: bold; 58 margin-top: 0; 59 text-align: left; 60 } 61 62 p { 63 font-size: 16px; 64 line-height: 1.5em; 65 margin-top: 0; 66 text-align: left; 67 } 68 69 p.sub { 70 font-size: 12px; 71 } 72 73 img { 74 max-width: 100%; 75 } 76 77 /* Layout */ 78 79 .wrapper { 80 -premailer-cellpadding: 0; 81 -premailer-cellspacing: 0; 82 -premailer-width: 100%; 83 background-color: #edf2f7; 84 margin: 0; 85 padding: 0; 86 width: 100%; 87 } 88 89 .content { 90 -premailer-cellpadding: 0; 91 -premailer-cellspacing: 0; 92 -premailer-width: 100%; 93 margin: 0; 94 padding: 0; 95 width: 100%; 96 } 97 98 /* Header */ 99 100 .header { 101 padding: 25px 0; 102 text-align: center; 103 } 104 105 .header a { 106 color: #3d4852; 107 font-size: 19px; 108 font-weight: bold; 109 text-decoration: none; 110 } 111 112 /* Logo */ 113 114 .logo { 115 height: 75px; 116 max-height: 75px; 117 width: 75px; 118 } 119 120 /* Body */ 121 122 .body { 123 -premailer-cellpadding: 0; 124 -premailer-cellspacing: 0; 125 -premailer-width: 100%; 126 background-color: #edf2f7; 127 border-bottom: 1px solid #edf2f7; 128 border-top: 1px solid #edf2f7; 129 margin: 0; 130 padding: 0; 131 width: 100%; 132 } 133 134 .inner-body { 135 -premailer-cellpadding: 0; 136 -premailer-cellspacing: 0; 137 -premailer-width: 570px; 138 background-color: #ffffff; 139 border-color: #e8e5ef; 140 border-radius: 2px; 141 border-width: 1px; 142 box-shadow: 0 2px 0 rgba(0, 0, 150, 0.025), 2px 4px 0 rgba(0, 0, 150, 0.015); 143 margin: 0 auto; 144 padding: 0; 145 width: 570px; 146 } 147 148 /* Subcopy */ 149 150 .subcopy { 151 border-top: 1px solid #e8e5ef; 152 margin-top: 25px; 153 padding-top: 25px; 154 } 155 156 .subcopy p { 157 font-size: 14px; 158 } 159 160 /* Footer */ 161 162 .footer { 163 -premailer-cellpadding: 0; 164 -premailer-cellspacing: 0; 165 -premailer-width: 570px; 166 margin: 0 auto; 167 padding: 0; 168 text-align: center; 169 width: 570px; 170 } 171 172 .footer p { 173 color: #b0adc5; 174 font-size: 12px; 175 text-align: center; 176 } 177 178 .footer a { 179 color: #b0adc5; 180 text-decoration: underline; 181 } 182 183 /* Tables */ 184 185 .table table { 186 -premailer-cellpadding: 0; 187 -premailer-cellspacing: 0; 188 -premailer-width: 100%; 189 margin: 30px auto; 190 width: 100%; 191 } 192 193 .table th { 194 border-bottom: 1px solid #edeff2; 195 margin: 0; 196 padding-bottom: 8px; 197 } 198 199 .table td { 200 color: #74787e; 201 font-size: 15px; 202 line-height: 18px; 203 margin: 0; 204 padding: 10px 0; 205 } 206 207 .content-cell { 208 max-width: 100vw; 209 padding: 32px; 210 } 211 212 /* Buttons */ 213 214 .action { 215 -premailer-cellpadding: 0; 216 -premailer-cellspacing: 0; 217 -premailer-width: 100%; 218 margin: 30px auto; 219 padding: 0; 220 text-align: center; 221 width: 100%; 222 } 223 224 .button { 225 -webkit-text-size-adjust: none; 226 border-radius: 4px; 227 color: #fff; 228 display: inline-block; 229 overflow: hidden; 230 text-decoration: none; 231 } 232 233 .button-blue, 234 .button-primary { 235 background-color: #2d3748; 236 border-bottom: 8px solid #2d3748; 237 border-left: 18px solid #2d3748; 238 border-right: 18px solid #2d3748; 239 border-top: 8px solid #2d3748; 240 } 241 242 .button-green, 243 .button-success { 244 background-color: #48bb78; 245 border-bottom: 8px solid #48bb78; 246 border-left: 18px solid #48bb78; 247 border-right: 18px solid #48bb78; 248 border-top: 8px solid #48bb78; 249 } 250 251 .button-red, 252 .button-error { 253 background-color: #e53e3e; 254 border-bottom: 8px solid #e53e3e; 255 border-left: 18px solid #e53e3e; 256 border-right: 18px solid #e53e3e; 257 border-top: 8px solid #e53e3e; 258 } 259 260 /* Panels */ 261 262 .panel { 263 border-left: #2d3748 solid 4px; 264 margin: 21px 0; 265 } 266 267 .panel-content { 268 background-color: #edf2f7; 269 color: #718096; 270 padding: 16px; 271 } 272 273 .panel-content p { 274 color: #718096; 275 } 276 277 .panel-item { 278 padding: 0; 279 } 280 281 .panel-item p:last-of-type { 282 margin-bottom: 0; 283 padding-bottom: 0; 284 } 285 286 /* Utilities */ 287 288 .break-all { 289 word-break: break-all; 290 }