#coming_soon { margin-top: -35px; } #coming_soon .head{ background: url("../img/backgrounds/color-splash.jpg") no-repeat; display: block; padding-top: 160px; height: 288px; width: 100%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #coming_soon .head .line{ margin-left: 0; } #coming_soon .text h4{ margin: 0 0 35px 0; color: #fff; font-size: 35px; font-weight: normal; line-height: 38px; text-shadow: 1px 1px 0px #2A284D; } #coming_soon .text p{ color: #fff; font-size: 16px; font-style: italic; line-height: 24px; } #coming_soon .text p span{ font-style: normal; text-transform: uppercase; } #coming_soon .count{ margin: 0; float: right; } #coming_soon .count .box{ text-align: center; float: right; margin-left: -10px; } #coming_soon .count .first{ margin: 0 0 0 90px; } #coming_soon .count .circle{ height: 98px; width: 98px; text-align: center; border-radius: 100%; margin-bottom: 8px; background: rgba(0,0,0,0.5); } #coming_soon .count .circle span{ color: #fff; display: inline-block; font-size: 33px; margin-top: 36px; font-weight: bold; } #coming_soon .count p{ color: #fff; margin: 0; text-transform: uppercase; font-size: 13px; } #coming_soon .email_wrapp .wrapp{ background: #fff; width: 98%; margin: 0 auto 60px; padding: 32px 0 21px; height: 50px; float: none; border-radius: 0 0 4px 4px; box-shadow: 1px 1px 2px 0px rgb(206, 206, 206); } #coming_soon .email_wrapp .line{ margin-left: 0; } #coming_soon .email_wrapp .wrapp p{ float: left; font-size: 17px; margin: 8px 0px 0px 48px; } #coming_soon .email_wrapp .wrapp input[type="text"]{ float: left; font-size: 16px; border-radius: 3px; height: 27px; margin-bottom: 0; width: 31.5%; margin-left: 30px; } #coming_soon .email_wrapp .wrapp a.send{ text-transform: uppercase; color: #fff; border: 0 none; box-shadow: none; margin: 0px 70px 0 0; background: #1189D9; font-weight: bold; text-shadow: none; padding: 8px 10px; font-size: 14px; float: right; -webkit-transition: background linear .2s, box-shadow linear .2s; -moz-transition: background linear .2s, box-shadow linear .2s; -o-transition: background linear .2s, box-shadow linear .2s; transition: background linear .2s, box-shadow linear .2s; } #coming_soon .email_wrapp .wrapp a.send:hover{ background: #252528; } #coming_soon .social{ text-align: center; margin: 0px; } #coming_soon .social p{ display: inline-block; font-weight: bold; font-size: 21px; margin: 0 10px 0 0; bottom: 9px; position: relative; } #coming_soon .social a { margin-left: 10px; display: inline-block; } #coming_soon .social a span{ display: inline-block; width: 33px; height: 33px; } #coming_soon .social span.ico1, #coming_soon .social span.ico1h{ background-position: 0px 0px; } #coming_soon .social span.ico2, #coming_soon .social span.ico2h{ background-position: -37px 0px; } #coming_soon .social span.ico3, #coming_soon .social span.ico3h{ background-position: -75px 0px; } #coming_soon .social span.ico4, #coming_soon .social span.ico4h{ background-position: -112px -1px; } #coming_soon .social span.ico5, #coming_soon .social span.ico5h{ background-position: -151px 0px; } #coming_soon .social span.ico6, #coming_soon .social span.ico6h{ background-position: -188px -1px; } #coming_soon .social span.ico7, #coming_soon .social span.ico7h{ background-position: -226px 0px; } #coming_soon .social a:hover span.icons{ display: none; } #coming_soon .social a:hover span.iconsh{ display: inline-block; } #coming_soon .social span.iconsh{ display: none; } #coming_soon .icons{ background: url('../img/socialicons2.png') no-repeat; width: 265px; height: 36px; } #coming_soon .iconsh{ background: url('../img/socialicons_h.png') no-repeat; width: 265px; height: 36px; } /* Responsive -------------------------------------------------- */ /* Large desktop */ @media (min-width: 1200px) { } @media (min-width: 980px) { } @media (max-width: 979px) { } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 979px) { #coming_soon .head{ padding-top: 80px; height: 310px; } #coming_soon .count{ text-align: center; width: 37%; } #coming_soon .count .box{ margin: 0 0 13px 0; } #coming_soon .count .first{ margin: 0; } #coming_soon .count .circle{ float: none; display: inline-block; } #coming_soon .email_wrapp .wrapp{ text-align: center; height: auto; padding: 30px 0 30px; } #coming_soon .email_wrapp .wrapp p{ float: none; margin: 0 0 19px 0; } #coming_soon .email_wrapp .wrapp input[type="text"]{ float: none; width: 43%; margin: 0 1px 0 0; } #coming_soon .email_wrapp .wrapp a.send{ float: none; margin: 0 0 0 7px; } } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { #coming_soon .head{ text-align: center; background: none; margin-bottom: 80px; padding-top: 70px; height: auto; } #coming_soon .text{ margin-bottom: 20px; } #coming_soon .text h4{ color: #333; text-shadow:none; } #coming_soon .text p{ color: #333; } #coming_soon .count .first{ margin: 0; } #coming_soon .count .box{ float: none; display: inline-block; } #coming_soon .count .circle{ background: rgba(0,0,0,0.8); width: 100px; height: 100px; } #coming_soon .count .circle span{ font-size: 35px; margin-top: 39px; } #coming_soon .count p{ color: #333; } #coming_soon .email_wrapp .wrapp{ background: transparent; box-shadow: none; padding: 0; width: 100%; } #coming_soon .email_wrapp .wrapp p{ float: none; margin: 0 0 20px 0; } #coming_soon .email_wrapp .wrapp input[type="text"]{ float: left; width: 77%; margin-left: 0; } #coming_soon .email_wrapp .wrapp a.send{ float: left; margin-left: 22px; margin-right: 0; } } /* Landscape phones and down */ @media (max-width: 480px) { #coming_soon .count .circle{ height: 73px; width: 73px; } #coming_soon .count .circle span{ margin-top: 26px; font-size: 30px; } #coming_soon .email_wrapp .wrapp input[type="text"]{ width: 70%; } #coming_soon .social p{ display: block; margin: 16px 0 3px 0; } #coming_soon .social a{ margin-left: 0px; } }