body .site_wrapper{
width: 100%;
}
.comingsoon_page {
float: left;
width: 100%;
}
.topcontsoon {
float: left;
width: 100%;
position: relative;
text-align: center;
margin-bottom: 59px;
}
.topcontsoon h5 {
color: #e3e3e3;
margin: 35px 0px 0px 0px;
text-transform: uppercase;
}
.socialiconssoon {
width: 40%;
position: relative;
text-align: center;
margin: 25px auto 0 auto;
padding-top: 40px;
border-top: 1px solid rgba(255,255,255,.2);
}
.socialiconssoon i {
color: #fff;
background: rgba(255,255,255,.3);
width: 34px;
height: 34px;
margin: 0px 2px;
text-align: center;
vertical-align: middle;
line-height: 35px;
border-radius: 100%;
transition: all 0.3s ease;
}
.socialiconssoon i:hover {
background: rgba(255,255,255,.5);
}
.countdown_dashboard {
height: 70px;
margin: 90px 0px 0px 320px;
font-family: 'Roboto', sans-serif;
}
.countdown_dashboard .dash {
height: 59px;
position: relative;
float: left;
*zoom:1;
margin: 0px 50px 0px 0px;
font-size: 35px;
font-weight: 300;
text-align: center;
color: #fff;
font-weight: bold;
border-right: 1px solid rgba(255,255,255,.2);
padding-right: 50px;
}
.countdown_dashboard .dash.last {
border-right: 0px solid #fff;
}
.countdown_dashboard .dash .digit {
width: 27px;
height: 50px;
text-align: center;
float: left;
margin-right: 0px;
}
.countdown_dashboard .dash span {
width: 50px;
position: absolute;
left: 0;
bottom: -8px;
font-size: 14px;
padding-top: 3px;
padding-left: 17px;
font-weight: normal;
text-transform: uppercase;
text-align: left;
}
#bg-body {
background: none repeat scroll 0 0 #181818;
height: 200%;
left: -50%;
position: fixed;
top: -50%;
width: 200%;
}
#bg-body img {
bottom: 0;
left: 0;
margin: auto;
min-height: 50%;
min-width: 50%;
position: absolute;
right: 0;
top: 0;
}
#wrapper {
position:relative;
width:980px;
height:600px;
margin:0 auto;
}
#info {
position:absolute;
width:400px;
height:auto;
bottom:0;
right:0;
background:#ccc;
border-radius:20px;
padding:15px;
box-shadow:10px 10px 20px #333;
}
#info h1 {
margin:10px 0;
color:#5d5d5d;
font-size:22px;
}
#info p {
margin:0 0 7px 0;
color:#5d5d5d;
font-size:15px;
}
.comingsoon_page .newslesoon {
float: left;
width: 80%;
padding: 10px 20px;
border: 1px solid rgba(255, 255, 255, 0.3);
background: none;
color: #999;
}
.comingsoon_page .newslesubmit {
float: left;
padding: 10px 20px;
border: 1px solid #727272;
background: rgba(255, 255, 255, 0.3);
color: #fff;
cursor: pointer;
transition: all 0.3s ease;
}
.comingsoon_page .newslesubmit:hover {
background: rgba(255, 255, 255, 0.4);
}
.comming-socials li{
display: inline;
}
.comingsoon_page .container:before, .comingsoon_page .container:after{
display:none;
}
@-webkit-keyframes flipTop {
0% {
-webkit-transform: perspective(400px) rotateX(0deg); }
100% {
-webkit-transform: perspective(400px) rotateX(-90deg); } }
@-webkit-keyframes flipBottom {
0% {
-webkit-transform: perspective(400px) rotateX(90deg); }
100% {
-webkit-transform: perspective(400px) rotateX(0deg); } }
@-moz-keyframes flipTop {
0% {
-moz-transform: perspective(400px) rotateX(0deg); }
100% {
-moz-transform: perspective(400px) rotateX(-90deg); } }
@-moz-keyframes flipBottom {
0% {
-moz-transform: perspective(400px) rotateX(90deg); }
100% {
-moz-transform: perspective(400px) rotateX(0deg); } }
@-ms-keyframes flipTop {
0% {
-ms-transform: perspective(400px) rotateX(0deg); }
100% {
-ms-transform: perspective(400px) rotateX(-90deg); } }
@-ms-keyframes flipBottom {
0% {
-ms-transform: perspective(400px) rotateX(90deg); }
100% {
-ms-transform: perspective(400px) rotateX(0deg); } }
@-keyframes flipTop {
0% {
transform: perspective(400px) rotateX(0deg); }
100% {
transform: perspective(400px) rotateX(-90deg); } }
@-keyframes flipBottom {
0% {
transform: perspective(400px) rotateX(90deg); }
100% {
transform: perspective(400px) rotateX(0deg); } }
.flipTimer {
color: #FFF;
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 45px;
font-weight: bold;
line-height: 50px;
height: 50px;
}
.flipTimer div {
margin-right: 30px;
}
.fttext {
float: left;
width: 98px;
text-align: center;
color: #eee;
font-size: 16px;
text-transform: uppercase;
font-weight: 300;
z-index: 9999;
position: relative;
padding-right: 12px;
}
.flipTimer .seperator {
vertical-align: top;
margin: 0 -20px;
display: inline;
}
.flipTimer .seconds,
.flipTimer .minutes,
.flipTimer .hours,
.flipTimer .days {
height: 100%;
display: inline;
}
.flipTimer .digit-set {
border-radius: 0px;
box-shadow: 0 1px 0px rgba(0, 0, 0, 0.8);
border: 1px solid #111111;
width: 45px;
height: 100%;
display: inline-block;
position: relative;
margin: 0 1px;
}
.flipTimer .digit {
position: absolute;
height: 100%;
}
.flipTimer .digit > div {
position: absolute;
left: 0;
overflow: hidden;
height: 50%;
padding: 0 10px;
}
.flipTimer .digit > div.digit-top, .flipTimer .digit > div.shadow-top {
background-color: #333;
border-bottom: 1px solid #333;
box-sizing: border-box;
top: 0;
z-index: 0;
border-radius: 0px 0px 0 0;
}
.flipTimer .digit > div.digit-top:before, .flipTimer .digit > div.shadow-top:before {
content: "";
box-shadow: inset 0 10px 25px rgba(0, 0, 0, 0.4);
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
.flipTimer .digit > div.shadow-top {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0, 0, 0, 0)), to(black));
width: 45px;
opacity: 0;
-webkit-transition: opacity 0.3s ease-in;
}
.flipTimer .digit > div.digit-bottom, .flipTimer .digit > div.shadow-bottom {
background-color: #333;
bottom: 0;
z-index: 0;
border-radius: 0 0 0px 0px;
}
.flipTimer .digit > div.digit-bottom .digit-wrap, .flipTimer .digit > div.shadow-bottom .digit-wrap {
display: block;
margin-top: -100%;
}
.flipTimer .digit > div.digit-bottom:before, .flipTimer .digit > div.shadow-bottom:before {
content: "";
box-shadow: inset 0 10px 25px rgba(0, 0, 0, 0.3);
border-radius: 0 0 0px 0px;
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
.flipTimer .digit > div.shadow-bottom {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(black), to(rgba(0, 0, 0, 0)));
width: 25px;
opacity: 0;
-webkit-transition: opacity 0.3s ease-in;
}
.flipTimer .digit.previous .digit-top,
.flipTimer .digit.previous .shadow-top {
opacity: 1;
z-index: 2;
-webkit-transform-origin: 50% 100%;
-webkit-animation: flipTop 0.3s ease-in both;
-moz-transform-origin: 50% 100%;
-moz-animation: flipTop 0.3s ease-in both;
-ms-transform-origin: 50% 100%;
-ms-animation: flipTop 0.3s ease-in both;
transform-origin: 50% 100%;
animation: flipTop 0.3s ease-in both;
}
.flipTimer .digit.previous .digit-bottom,
.flipTimer .digit.previous .shadow-bottom {
z-index: 1;
opacity: 1;
}
.flipTimer .digit.active .digit-top {
z-index: 1;
}
.flipTimer .digit.active .digit-bottom {
z-index: 2;
-webkit-transform-origin: 50% 0%;
-webkit-animation: flipBottom 0.3s 0.3s ease-out both;
-moz-transform-origin: 50% 0%;
-moz-animation: flipBottom 0.3s 0.3s ease-out both;
-ms-transform-origin: 50% 0%;
-ms-animation: flipBottom 0.3s 0.3s ease-out both;
transform-origin: 50% 0%;
animation: flipBottom 0.3s 0.3s ease-out both;
}
@media only screen and (min-width: 1000px) and (max-width: 1169px){
.countdown_dashboard {
margin: 70px 0px 0px 235px;
}
.socialiconssoon ul {
width: 74%;
}
.topcontsoon {
margin-bottom: 39px;
}
.topcontsoon h5 {
margin: 25px 0px 0px 0px;
}
.socialiconssoon {
margin: 45px auto 0 auto;
padding-top: 30px;
}
.socialiconssoon ul {
margin: 30px auto 0 auto;
}
.comingsoon_page .newslesoon {
width: 65%;
}
}
@media only screen and (min-width: 768px) and (max-width: 999px){
.countdown_dashboard {
margin: 59px 0px 0px 120px;
}
.socialiconssoon ul {
width: 74%;
}
.topcontsoon {
margin-bottom: 39px;
}
.topcontsoon h5 {
margin: 25px 0px 0px 0px;
}
.socialiconssoon {
margin: 45px auto 0 auto;
padding-top: 30px;
width: 54%;
}
.socialiconssoon ul {
margin: 30px auto 0 auto;
}
.comingsoon_page .newslesoon {
width: 66%;
}
}
@media only screen and (min-width: 480px) and (max-width: 767px){
.countdown_dashboard {
margin: 50px 0px 0px 25px;
}
.countdown_dashboard .dash {
margin: 0px 20px 0px 0px;
padding-right: 20px;
}
.socialiconssoon ul {
width: 72%;
}
.topcontsoon {
margin-bottom: 39px;
}
.topcontsoon h5 {
margin: 25px 0px 0px 0px;
}
.socialiconssoon {
margin: 45px auto 0 auto;
padding-top: 30px;
width: 100%;
}
.socialiconssoon ul {
margin: 30px auto 0 auto;
}
.comingsoon_page .newslesoon {
width: 65%;
}
.flipTimer {
font-size: 25px;
line-height: 27px;
height: 27px;
}
.flipTimer div {
margin-right: 18px;
}
.fttext {
width: 80px;
font-size: 14px;
padding-right: 4px;
}
.flipTimer .digit-set {
width: 35px;
}
.flipTimer .digit > div.shadow-top {
width: 35px;
}
.flipTimer .digit > div.shadow-bottom {
width: 10px;
}
}
@media only screen and (max-width: 479px){
.countdown_dashboard {
margin: 50px 0px 0px 0px;
}
.countdown_dashboard .dash {
margin: 0px 0px 14px 0px;
padding-right: 13px;
}
.socialiconssoon ul {
width: 90%;
}
.socialiconssoon li {
margin: 0px 2px;
}
.topcontsoon {
margin-bottom: 30px;
}
.topcontsoon h5 {
margin: 25px 0px 0px 0px;
}
.socialiconssoon {
margin: 25px auto 0 auto;
padding-top: 25px;
width: 100%;
}
.socialiconssoon ul {
margin: 30px auto 0 auto;
}
.socialiconssoon li {
margin-bottom: 10px;
}
.comingsoon_page .newslesoon {
width: 54%;
}
.flipTimer {
font-size: 18px;
line-height: 30px;
height: 30px;
}
.flipTimer div {
margin-right: 4px;
}
.fttext {
width: 61px;
font-size: 11px;
padding-right: 10px;
padding-top: 4px;
}
.flipTimer .digit-set {
width: 30px;
}
.flipTimer .digit > div.shadow-top {
width: 20px;
}
.flipTimer .digit > div.shadow-bottom {
width: 10px;
}
.flipTimer .digit > div {
padding: 5px 10px;
}
}