*{
    max-width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body{
    color: #2F4D5E;
    font-family: 'Titillium Web', sans-serif;
}
#header .logo,
#content header h1,
#content header p,
footer p,
#footer,
#labels div{
    -webkit-text-stroke: 0.5px;
}
input[type="text"],
input[type="password"]{
    border: none;
    font-size: 18px;
    padding: 10px 15px;
    border-radius: 5px;
    width: 284px;
}
footer input[type="submit"]{
    border: none;
    background-color: #009FF3;
    text-decoration: none;
    color: #FFF;
    font-weight: bold;
    font-size: 16px;
    padding: 12px 25px;
    border-radius: 4px;
    cursor: pointer;
}
.clearfix{
    clear: both;
}
#header{
    margin: 40px auto;
    width: 1200px;
}
#header .logo{
    font-size: 30px;
    display: inline-block;
}
#header .logo img{
    max-height: 80px;
}
#sign-in-wrapper{
    float: right;
    padding: 5px;
    border-radius: 5px;
    vertical-align: top;
    background-color:rgba(0, 0, 0, 0.1);
    margin-top: -5px;
    position: relative;
    top: 0px;
}
#sign-in-wrapper input[type="text"],
#sign-in-wrapper input[type="password"]{
    padding: 5px 15px;
    width: 140px;
    margin-right: 5px;
    display: none;
    font-size: 16px;
}
#sign-in-wrapper a.button,
#sign-in-wrapper input[type="submit"]{
    color: #FFF;
    text-decoration: none;
    display: inline-block;
    padding: 7px 30px;
    background-color: #2F4D5E;
    font-weight: bold;
    border-radius: 5px;
    border: none;
}
#sign-in-wrapper .close{
    color: rgb(255, 255, 255);
    text-decoration: none;
    font-size: 26px;
    display: inline-block;
    position: absolute;
    right: -27px;
    top: 2px;
    font-weight: 100;
    display: none;
}
#login-form{
    display: inline-block;
}
#content{
    margin: 0 auto;
    width: 870px;
    margin-top: 3%;
}
h1{
    font-size: 46px;
    font-weight: normal;
    margin-bottom: 0;
}
header h1+p{
    margin-top: 0;
    font-weight: bold;
    font-size: 18px;
    opacity: .7;
}
#content form{
    float: right;
}
#content footer{
    border-top: solid 1px #CCC;
    margin-top: 14px;
    padding-top: 15px;
    margin-bottom: 100px;
}
#content footer p{
    font-size: 18px;
    display: inline-block;
    float: left;
    margin-top: 9px;
}
.flip-clock-divider .flip-clock-label{
    display: none;
}
.flip-clock-wrapper .flip{
    box-shadow: none;
}
.flip-clock-wrapper ul li a div div.inn{
    color: #fff;
}
.flip-clock-wrapper ul li a div.up{
    border-bottom: solid 1px rgba(121, 121, 121, 0.1);
}
.flip-clock-wrapper ul li a div.up div.inn{
    background: rgb(44,73,90); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(44,73,90,1) 0%, rgba(29,51,62,1) 48%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(44,73,90,1)), color-stop(48%,rgba(29,51,62,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(44,73,90,1) 0%,rgba(29,51,62,1) 48%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(44,73,90,1) 0%,rgba(29,51,62,1) 48%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(44,73,90,1) 0%,rgba(29,51,62,1) 48%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(44,73,90,1) 0%,rgba(29,51,62,1) 48%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c495a', endColorstr='#1d333e',GradientType=0 ); /* IE6-9 */
}
.flip-clock-wrapper ul li a div.down div.inn{
    background: rgb(29,51,62); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(29,51,62,1) 52%, rgba(44,73,90,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(52%,rgba(29,51,62,1)), color-stop(100%,rgba(44,73,90,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(29,51,62,1) 52%,rgba(44,73,90,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(29,51,62,1) 52%,rgba(44,73,90,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(29,51,62,1) 52%,rgba(44,73,90,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(29,51,62,1) 52%,rgba(44,73,90,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1d333e', endColorstr='#2c495a',GradientType=0 ); /* IE6-9 */
}
.flip-clock-dot{
    background-color: #1D333E;
    box-shadow: none;
}
#clock{
    zoom: 1.4;

    margin: 0;
}
@-moz-document url-prefix() { 
    #clock{
    -moz-transform: scale(1.4);
    -moz-transform-origin: left center;

    margin-bottom: 30px;
}
}

#labels{
    margin-top: 10px;
}
#labels div:not(.clearfix){
    display: inline-block;
    float: left;
    width: 22%;
    margin-right: 4%;
    background: #FFF;
    border-bottom: solid 2px #CCC;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    padding: 11px;
    border-radius: 5px;
    color: #2F4D5E !important;
}
#labels div:nth-of-type(4){
    margin-right: 0 !important;
}
#footer-wrap{
    position: absolute;
    bottom: 30px;
    width: 99%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#footer{
    margin: 0 auto;
    width: 350px;
    text-align: center;
    padding-top: 30px;
    border-top: solid 1px rgba(255, 255, 255, 0.3);
    font-weight: bold;
    color: #FFF;
}
#tidio-logo{
    position: absolute;
    bottom: 30px;
    right: 40px;
    text-indent: -9999px;
    display: inline-block;
    width: 132px;
    height: 32px;
    background: url('../img/logo.png');
}
#content footer .alert{
    background-color: #E24646;
    border: solid 1px #DDD;
    padding: 5px 10px;
    float: right;
    width: 418px;
    border-radius: 5px;
    color: #fff;
}


@media (max-width: 900px){
    #clock{
        zoom: 1;
    }
    #content{
        width: 620px;
    }
    #labels div:not(.clearfix) {
        width: 22%;
    }
    #content footer p{
        max-width: 40%;
        margin-top: 2px;
    }
    input[type="text"]{
        width: 184px;
    }
}
@media (max-width: 640px){
    body{
        position: relative;
    }
    #clock{
        zoom: .5;
        width: 620px;
        margin: 0 auto;
    }
    #labels{
        width: 310px;
        margin-left: auto;
        margin-right: auto;
    }
    #labels div:not(.clearfix){
        width: 21.9%;
        margin-right: 4%;
        font-size: 14px;
    }
    #content footer p{
        max-width: 100%;
        width: 100%;
    }
    #content form{
        width: 100%;
    }
    #content form input{
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }
    body{
        padding: 0 20px 110px;
    }
    #tidio-logo{
        margin: 0 auto;
        display: block;
        position: relative;
        right: initial;
        top: 50px;
    }
    #footer-wrap{
        bottom: -50px;
        margin-bottom: 30px;
    }
    #sign-in-wrapper{
        top: 0;
    }
    #content footer .alert{
        width: 100%;
    }
}