Modular Template Patterns body, height: 100% !important; margin: 0; padding: 0; width: 100% !important; } table { border-collapse: collapse; } img, a img { border: 0; outline: none; text-decoration: none; } h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; } p { margin: 1em 0; } .ReadMsgBody { width: 100%; } .ExternalClass { width: 100%; } /* Force Hotmail/Outlook.com to display emails at full width. */ .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div { line-height: 100%; } /* Force Hotmail/Outlook.com to display line heights normally. */ table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; } /* Remove spacing between tables in Outlook 2007 and up. */ padding: 0; } /* Force Outlook 2007 and up to provide a "view in browser" message. */ img { -ms-interpolation-mode: bicubic; } /* Force IE to smoothly render resized images. */ body, table, td, p, a, li, blockquote { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } /* Prevent Windows- and Webkit-based mobile platforms from changing declared text sizes. */ .flexibleContainerCell { padding-top: 20px; padding-Right: 20px; padding-Left: 20px; } .flexibleImage { height: auto; } .bottomShim { padding-bottom: 20px; } .imageContent, .imageContentLast { padding-bottom: 20px; } .nestedContainerCell { padding-top: 20px; padding-Right: 20px; padding-Left: 20px; } body, background-color: } padding-top: 40px; padding-bottom: 20px; } background-color: border: 1px solid border-collapse: separate; border-radius: 4px; } h1, h2, h3, h4, h5, h6 { color: font-family: Helvetica; font-size: 20px; line-height: 125%; text-align: Left; } .textContent, .textContentLast { color: font-family: Helvetica; font-size: 16px; line-height: 125%; text-align: Left; padding-bottom: 20px; } .textContent a, .textContentLast a { color: text-decoration: underline; } .nestedContainer { background-color: border: 1px solid } .emailButton { background-color: border-collapse: separate; border-radius: 4px; } .buttonContent { color: font-family: Helvetica; font-size: 18px; font-weight: bold; line-height: 100%; padding: 15px; text-align: center; } .buttonContent a { color: display: block; text-decoration: none; } .emailCalendar { background-color: border: 1px solid } .emailCalendarMonth { background-color: color: font-family: Helvetica, Arial, sans-serif; font-size: 16px; font-weight: bold; padding-top: 10px; padding-bottom: 10px; text-align: center; } .emailCalendarDay { color: font-family: Helvetica, Arial, sans-serif; font-size: 60px; font-weight: bold; line-height: 100%; padding-top: 20px; padding-bottom: 20px; text-align: center; } @media only screen and (max-width: 480px) { body { width: 100% !important; min-width: 100% !important; } table[id="emailBody"], table[id="templateContainer"], table[class="flexibleContainer"] { width: 100% !important; } img[class="flexibleImage"] { height: auto !important; width: 100% !important; } table[class="emailButton"] { width: 100% !important; } td[class="buttonContent"] { padding: 0 !important; } td[class="buttonContent"] a { padding: 15px !important; } td[class="textContentLast"], td[class="imageContentLast"] { padding-top: 20px !important; } /*////// GENERAL STYLES //////*/ td[id="bodyCell"] { padding-top: 10px !important; padding-Right: 10px !important; padding-Left: 10px !important; } } <
