@charset "utf-8";

/* CSS Document */



/* 	-----------------------------------------------------

        ------------------- General Styles ------------------

        ----------------------------------------------------- */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {display:block;}

audio, canvas, video {display:inline-block; *display:inline; *zoom:1;}

audio:not([controls]) {display:none;}



* {margin:0; padding:0; outline:none;



   -webkit-box-sizing: border-box;

   -moz-box-sizing: border-box;

   box-sizing: border-box;

}

*:before,

*:after {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}

html, body, div, span, applet, object, iframe, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; background:transparent;}



blockquote, q {quotes:none;}

blockquote:before, blockquote:after, q:before, q:after,  {content:''; content:none;}

:focus {outline:0;}

ins {text-decoration:none;}

del {text-decoration:line-through;}

table {border-collapse:collapse; border-spacing:0;}





a, a:hover, a:active, a:focus {outline:none; outline-style:none; outline-width:0; }



img {width:auto\9; height:auto; max-width:100%; vertical-align:middle; border:0; -ms-interpolation-mode:bicubic;}

button, html input[type="button"], input[type="reset"], input[type="submit"] {cursor:pointer; -webkit-appearance:button;}

label, select, button, input[type="button"], input[type="reset"], input[type="submit"], input[type="radio"], input[type="checkbox"] {cursor:pointer;}

input[type="search"] {-webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; -webkit-appearance:textfield;}

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {-webkit-appearance:none;}

textarea {overflow:auto; vertical-align:top;}



body {margin:0; padding:0px 0px 0px 0px; font-family: 'Montserrat', sans-serif; font-weight:400; color:#000; line-height:normal;  font-size:14px;}

.clr {font-size:0; height:0; line-height:0; clear:both;}
.left {margin:0; padding:0; width:auto; height:auto; float:left;}
.right {margin:0; padding:0; width:auto; height:auto; float:right;}

/* ------------- web fonts -------------*/

/* -------------/ web fonts ------------*/



a{ text-decoration:none; }



.clearfix {

    *zoom: 1;

}

.clearfix:before,
.clearfix:after {

    display: table;

    line-height: 0;

    content: "";

}

.clearfix:after {

    clear: both;

}

/*===================background section===========================*/

.header{margin:0 auto; padding:0; height:auto; width:100%; text-align:center; background: #ff0000;}
.header .container{ max-width:1220px; height:auto; margin:0 auto; padding:28px 2%;}
.header h2{ color: #fff; font-size: 38px; line-height: 46px; font-weight: 600; padding: 0; margin: 0;}
.page-body{ background:url(../images/page-bg1.jpg) center 0 no-repeat; background-size:cover; -o-background-size:cover; -webkit-background-size:cover; -moz-background-size:cover;}
.section01{
    width:100%;
    height:auto;
    margin:0 auto;

}
.section01 .container{ max-width:1220px; height:auto; margin:0 auto; padding:50px 0 30px; text-align: center;}

.section01 h2{
    color:#ff0000;
    font-size:80px;
    font-weight:900;
    margin:0 0 28px;
    text-align:center;
}
.section01 h3{
    color:#fff;
    font-size:44px;
    font-weight:600;
    margin:0 0 28px;
    text-align:center;
}
.section01 h3 span.orange{
    color:#ff0000;}
.section01 h3 span.light-orange{
    color:#ff5400;}
.section01 p{
    color:#fff;
    font-size:30px;
    font-weight:400;
    line-height:36px;
    margin:0 0 30px;
}
.vid {
    padding: 0px;
    max-width: 800px;
    margin: 0 auto 30px; border:15px solid #ff0000; background: #ff0000;

}
.vid iframe {
    height: 450px;
    width: 100%;
}

.vidsec iframe,
.vidsec object,
.vidsec embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 80%;
    height: 80%;
}

.section02{
    width:100%;
    height:auto;
    margin:0 auto; }
.section02 .image-section{ width:100%; padding:0; margin:0 auto; text-align:center;}
.section02 .image-section img{ width:100%;}	
.section02 .text-section{ width:100%; padding:0; margin:0 auto; background:url(../images/sec02-bg.jpg) center 0 no-repeat; background-size:cover; -o-background-size:cover; -webkit-background-size:cover; -moz-background-size:cover;}
.section02 .container{ max-width:1120px; height:auto; margin:0 auto; padding:50px 0 30px; text-align:center;}
.section02 h2{
    color:#1e1e1e;
    font-size:38px;
    font-weight:600;
    margin:0 0 28px;

}
.section02 p{
    color:#fff;
    font-size:14px;
    font-weight:400;
    line-height:28px;
    margin:0 0 30px;
}
.section02 p a{
    color:#fff;}

.section02 h3{
    color:#1e1e1e;
    font-size:40px;
    font-weight:600;
    margin:0 0 28px;

}

.btn-call-to-action {
    text-transform:uppercase;
    color:#fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 1);
    line-height: 60px;
    min-width: 180px;
    font-size:44px;
    font-weight:900;
    vertical-align: middle;
    margin:0 auto 30px; padding:30px 4%;
    font-weight:bold;
    text-align:center;
    display: inline-block;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.5);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color: #ff5400; border-bottom:8px solid #b73c00;
}
.btn-call-to-action:hover,
.btn-call-to-action:focus {
    box-shadow: 2px 2px 12px rgba(0,0,0,0.8);
    text-decoration: none;
    color:#FFFFFF;
    background-color: #b73c00; border-bottom:8px solid #ff5400;
}

.top-display{ width: 100%; height: auto; margin:0 auto; background:url(../images/confirm-page-bg1.jpg) center 0 no-repeat; background-size:cover; -o-background-size:cover; -webkit-background-size:cover; -moz-background-size:cover;}
.top-display .container{ max-width:1220px; height:auto; margin:0 auto; padding:50px 0 30px; text-align: center;}

.top-display h2{
    color:#000;
    font-size:24px;
    font-weight:400;
    margin:0 0 28px;

}
.top-display h3{
    color:#252525;
    font-size:36px;
    font-weight:400;
    margin:0 0 20px;
    text-align:center;
}
.top-display h3 span{color:#ff0000;}
.top-display .join-sec .joinbox{ width:100%; height:auto; margin:0 auto 30px; padding:16px; background: #fff; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -webkit-box-shadow: 0px 0px 11px 0px rgba(0,0,0,0.40); -moz-box-shadow: 0px 0px 11px 0px rgba(0,0,0,0.40); box-shadow: 0px 0px 11px 0px rgba(0,0,0,0.40);}
.top-display .join-sec p{color:#252525;	font-size:18px;	font-weight:400; line-height:24px; margin:0 0 30px;}
.top-display .join-sec button{ width:90%; border: 0; background: #ff0000; color:#fff; font-size: 15px; font-weight: 800; padding: 8px 12px;}
.top-display .join-sec button img{ width: 30px; margin: 0 0 0 12px;}
.top-display .join-sec.sml{ max-width:600px; margin: 30px auto;}

.showsteps{ width:100%; height: auto; margin: 0 auto 60px; background: #d9d9d9;}
.showsteps .container{ max-width:1220px; height:auto; margin:0 auto; padding:0px 0 40px; text-align: center;}
.showsteps .box-lbl{ width:80%; height: auto; margin: -127px auto 60px; background: #ff0000; padding: 12px 4%; position: relative; text-align: center; color:#fff; font-size: 50px; font-weight: 600;}
.showsteps .box-lbl .leftcor{ position:absolute; top:0; left:-34px;}
.showsteps .box-lbl .rightcor{ position:absolute; top:0; right:-34px;}
.showsteps p{ color:#252525; font-size:36px; font-weight: 600px; margin: 0 0 20px;}
.page-bottom{ width:100%; height: auto; margin: 0 auto 60px; background: #fff;}
.page-bottom .container{ max-width:1220px; height:auto; margin:0 auto; padding:30px 0; text-align: center;}

.page-bottom button{ width:auto; border: 0; background: #ff0000; color:#fff; font-size: 30px; font-weight: 800; padding: 10px 20px; margin: 0 auto 60px; text-transform: uppercase;}
.page-bottom p{
    color:#252525;
    font-size:14px;
    font-weight:400;
    line-height:28px;
    margin:0 0 30px;
}
.page-bottom p a{
    color:#252525;}

.wrapper {
    position: relative;
    height: 5em;
}

.countdown-container {
    font-family: Montserrat, sans-serif;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    height: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 100%;
}

.countdown {
    display: flex;
    transform-style: preserve3d;
    perspective: 500px;
    height: 2rem;
    width: 100%;
    margin: 0 auto;
}
.countdown.remove {
    animation: hide-countdown 1s cubic-bezier(0, 0.9, 0.56, 1.2) forwards;
    overflow: hidden;
}

.number, .separator {
    display: block;
    color: #333;
    height: 1rem;
    font-size: 2rem;
    position: relative;
    line-height: 2rem;
    text-align: center;
    width: 100%;
}

.separator {
    margin: 0;
    width: 2rem;
}

.new, .old, .current {
    color: #333;
    position: absolute;
    border-radius: 1rem;
    height: 1rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.new {
    animation: show-new 0.4s cubic-bezier(0, 0.9, 0.5, 1.2) forwards;
}

.old {
    animation: hide-old 2s cubic-bezier(0, 0.9, 0.56, 1.2) forwards;
}

.countdown section {
    position: relative;
}

#js-days:after, #js-hours:after, #js-minutes:after, #js-seconds:after {
    content: "DAYS";
    position: absolute;
    text-align: center;
    left: 0;
    right: 0;
    bottom: -46px;
    font-size: 12px;
}
#js-hours:after {
    content: "HOURS";
}
#js-minutes:after {
    content: "MINUTES";
}
#js-seconds:after {
    content: "SECONDS";
}
@keyframes hide-countdown {
    to {
        height: 0;
        overflow: hidden;
    }
}
@keyframes show-new {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(-2rem) scale(0.8) rotateX(-20deg);
    }
    100% {
        transform: translate(-50%, -50%);
    }
}
@keyframes hide-old {
    0% {
        transform: translate(-50%, -50%);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(-5rem) scale(0.5) rotateX(-75deg);
    }
}



