@charset "utf-8";

@media (min-width:1201px) {
.container { width: 1100px }
}

@media (max-width:1200px) {
.banner { padding-top: 50px; }
.old-practices { padding-top: 30px; padding-bottom: 0px; }
.mobile-first { padding-top: 30px; padding-bottom: 30px; }
.mobile-first p { margin-bottom: 30px; }
.imagery { padding-bottom: 30px; padding-top: 30px; }
.imagery h2 { margin-bottom: 35px; font-size: 30px; }
.imagery h2 strong { line-height: 30px; }
.imagery .imagery-blog p { margin-bottom: 20px; }
.imagery .btm-border::after { margin-bottom: 30px; }
.mobile-first p br { display: none; }
.email-on-hand ul { max-width: 970px; width: 100%; }
.popcorn-tips .popcorn-img { width: 300px; margin-left: -150px }
.popcorn-tips p { padding-left: 0; margin-bottom: 30px; }
.popcorn-tips h2 { font-size: 30px; margin-bottom: 30px }
.em-tidy h2 { font-size: 30px; margin-bottom: 30px }
.mobile-first h2 { font-size: 30px; }
.mobile-first h2 i { line-height: 30px; }
.em-tidy { padding: 30px 0 }
.code-page .center-text { padding-top: 20px; padding-bottom: 12px; }
.popcorn-tips { padding: 30px 0 }
.pre-header h2 { font-size: 30px; margin-bottom: 30px; }
.pre-header h2 span { line-height: 30px; }
.pre-header { padding-top: 30px; padding-bottom: 30px; }
.tablet-bg { margin-top: 30px; }
}

@media (max-width:991px) {
.practices-block { width: auto }
.practices-img { padding: 10px; }
.old-practices h2 { font-size: 16px; margin-bottom: 20px; }
.old-practices p { margin-bottom: 30px; }
.old-practices p br { display: none; }
.practices-img img { width: 100%; }
.envelope-bg h1 { font-size: 50px; line-height: normal; padding-top: 30px; }
.envelope-bg h1 span { font-size: 30px; line-height: normal; margin-top: 0; width: 250px }
.envelope-bg h1 i { line-height: normal; font-size: 30px; }
.envelope-bg { background-size: contain; background-position: center bottom; }
.mobile-block { width: auto; }
.mobile-block { padding: 30px 0 }
.mobile-text { padding: 20px 20px 20px 130px; }
.imagery .imagery-blog { width: auto }
.imagery .imagery-blog img { width: 100%; }
.imagery .imagery-blog p.gif-text { padding-top: 0 }
.pre-header p { padding-top: 30px; }
.popcorn-tips .popcorn-img { display: none }
.popcorn-tips p { text-align: left }
.tablet-bg { width: auto; padding: 40px; background-position: center 10px; }
.tablet-bg .chat-bg { padding: 20px 20px 75px }
.tablet-bg .top-menu { padding: 6px 20px 9px; background-position: 20px 12px; }
.popcorn-tips p br { display: none; }
.mobile-right .mobile-text { padding: 20px 130px 20px 20px }
.imagery .btm-border::after { width: auto }
.email-on-hand ul { max-width: auto }
.email-on-hand li { width: 100%; }
.email-on-hand li:first-child p { width: auto; padding-top: 30px; text-align: center; margin-bottom: 20px; }
.email-on-hand li:last-child { padding-top: 30px; margin-bottom: 20px; }
.code-page { width: auto }
}

@media (max-width:767px) {
.mobile-first h2 br, .code-page .center-text p br, .btm-ftr ul { display: none }
.mobile-img{ text-align:center; position:static;}

.practices-block { display: block; text-align: center }
.old-practices { padding-top: 15px; }
.old-practices p { margin-bottom: 20px; font-size: 16px; line-height: normal }
.mobile-first h2 { font-size: 22px; }
.mobile-first h2 i { line-height: normal }
.mobile-first { padding: 20px 0 }
.mobile-first p { margin-bottom: 20px; font-size: 16px; line-height: normal }
.mobile-block { padding: 0; margin-bottom: 20px; min-height: 0px }
.mobile-text > p { font-size: 14px; }
.mobile-text { padding: 15px !important; text-align: center !important; min-height: 0 }
.imagery .imagery-blog { display: block }
.pre-header .text-right { text-align: center }
.code-page .center-text p { width: auto; padding: 8px; margin: 10px; }
.imagery h2 { font-size: 22px; margin-bottom: 20px; }
.imagery h2 strong { line-height: normal }
.imagery { padding: 20px 0 }
.imagery .imagery-blog img { margin-bottom: 15px; }
.imagery .imagery-blog p { font-size: 14px; line-height: normal; margin-bottom: 15px; }
.pre-header h2 { margin-bottom: 20px; line-height: normal; font-size: 22px; }
.pre-header h2 br { display: none }
.code-page { margin: 0 10px; }
.code-page .top-head::before { margin-top: 14px; }
.btm-ftr::before { margin-top: 14px; }
.em-tidy h2 { font-size: 20px; margin-bottom: 20px; line-height: normal }
.em-tidy { padding: 20px 0 }
.popcorn-tips { padding: 20px 0 }
.popcorn-tips h2 { font-size: 22px; margin-bottom: 20px; }
.popcorn-tips h2 br { display: none }
.popcorn-tips p { margin-bottom: 20px; line-height: normal; font-size: 14px; }
.tablet-bg { padding: 30px 25px; }
.tablet-bg .chat-bg { padding: 20px 10px 40px }
.tablet-bg { background-position: center 7px; }
.tablet-bg .chat-bg li .user-chat p { padding: 14px 10px 12px }
.tablet-bg .chat-bg .btn-bottom img { width: 50px; }
.tablet-bg .chat-bg .btn-bottom { padding-top: 10px; }
.envelope-bg { background: url(https://email.uplers.com/infographics/new-age-email-design-best-practices/images/mobile-evelope.png) no-repeat center bottom; }
.banner { padding-top: 20px }
.envelope-bg h1 { padding-top: 25; margin-top: 0; font-size: 22px; }
.envelope-bg h1 span { font-size: 22px; width: 160px; }
.envelope-bg h1 i { font-size: 22px; }
.envelope-bg { height: 250px; }
.about-emailmonks p br{ display:none}
.email-on-hand li:last-child{ padding-left:0}

.imagery .imagery-blog p,.popcorn-tips p,.email-on-hand li:last-child p{ text-align:center}
}