@media only screen and (max-width: 1400px) 
{
    .big-txt h1{font-size:150px;}
    .box-desc-txt{font-size:30px;}
    .txt-available {
        font-size: 14px;
        margin: 20px 0 0 10px;
    }
    #countdown div span{font-size:60px;}
    #countdown p{margin-top:-20px;}
    .box-about-txt h3 span {font-size: 60px;}
    h3, .h3 {font-size: 20px;}
}

@media only screen and (max-width: 1100px) 
{
    .box-desc-txt{width:90%;}
    .page-nav{right:60px}
    .single-service {width: 100%;}
    .big-txt h1 {font-size:120px;}
}

@media only screen and (max-width: 1023px) 
{
    #countdown div {
        border-bottom: 3px solid #fff;
        float: left;
        width: 20%;
    }
    #legend{width:100%;top:55%;}
    .page-nav {right: 20px;}
    .big-txt h1 {font-size: 80px;}
    
}
@media only screen and (max-width: 991px) 
{
    .box-title h2, #services .box-title h2, #contact .box-title h2{
         -webkit-transform: rotate(0deg) translateX(0px); 
        -moz-transform: rotate(0deg) translateX(0px);
        -o-transform: rotate(0deg) translateX(0px);
        -ms-transform: rotate(0deg) translateX(0px);
         transform: rotate(0deg) translateX(0px);
     }
     .c-hamburger{right:20px;}
}

@media only screen and (max-width: 767px) {
    .box-desc-txt {font-size: 20px;}
    .txt-available{display:none;}
    #countdown div span {font-size: 30px;}
    #countdown p {margin-top: -10px;}
    h2.logo{font-size:80px;}
    .c-hamburger{right:0;height: 66px;width: 66px;}
    .box-title h2{font-size:60px;}
    .page-nav a{
        padding: 8px 10px;
        width: 42px;
        height: 42px;
    }
    .c-hamburger span::before{top: -10px;}
    .c-hamburger span::after {bottom: -10px;}
    .box-desc-txt{margin:116px auto;}
    .box-about-txt{padding: 100px 50px;}
    
    .box-footer.get-in-touch {
        padding: 80px 50px;
        height: 100%;
        margin-bottom: 0px;
        float: left;
    }
    .box-footer h3 span {font-size: 60px;}
    #countdown div{width:18%;margin: 30px 20px 0 0;}
    .big-txt h1 {font-size: 50px;}
}

@media only screen and (max-width: 740px) and (orientation: landscape)
{
    .box-desc-txt{display:none;}
    h2.logo{font-size:80px; margin:10px 0 0 0;}

    #action{bottom:10px;}
    #legend {top: 40%;}
}
@media only screen and (max-width: 600px) and (orientation: landscape)
{
    h2.logo{font-size: 60px;}
}
@media only screen and (max-width: 500px)
{
    .box-about-txt:before{left:20px;}
    .box-about-txt:after{right:20px;}
    
    .single-service{padding:0;}
    #services .box-ico{float:none; margin-bottom:15px;}
    .single-service .info{margin:0;}
}
@media only screen and (max-width: 400px)

{
    h2.logo {font-size: 60px;}
    .page-nav{top:22%;right: 10px;}

}

@media only screen and (max-width: 325px)
{

    #action{bottom:10px;}
    .box-desc-txt {font-size: 16px;}
    .big-txt h1 {font-size: 25px;}
    
    .box-title h2 {font-size: 40px;}

    .box-about-txt {padding: 60px 40px;}
	
}