﻿@import 'css/font-awesome.min.css';



@media screen and (max-width: 1000px){

    #contentWrap, #page, #main, .site-header #topHeader, .menu-main-menu-container, .subheader-slide .main, .content-topbox, .content-bottombox, #contentWrap .content, #foot2, #foot3{

        width: 100%;

        box-sizing: border-box;

    }

	.content iframe {

		width:100%;

	}

    #contentWrap .content{

        padding: 20px;

    }

    .content-topbox, #contentWrap .content, #contentWrap.product{

        border-radius: 0;

    }

    .homevideobox .video{

        width: 80%;

        box-sizing: border-box;

        padding-right: 20px;

    }

    .homevideobox .video iframe{

        width: 100%;

    }



    .markbox-video{

        width: 20%;

    }

    .markbox-video a{

        width: 100%;

        max-width: 150px;

    }

    .site-header #topHeader{

        height: auto;

    }

    #topHeader .logo{

        display: block;

    }



    .main-navigation, .main-navigation ul, #colophon, #colophon .nav-menu{

        width: 100%;

        display: table;

    }

    .main-navigation ul li, #colophon .nav-menu li{

        display: table-cell;

        text-align: center;

        float: none;

    }

    .main-navigation ul li a, #colophon .nav-menu li a{

        padding: 0;

    }

    .main-navigation ul li a::before, #colophon .nav-menu li a::before{

        display: none;

    }



    .site-header #topHeader{

        padding: 0 20px;

        height: auto;

    }

    .topcart{

        margin-left: 16px;

    }

    #searchform{

        margin-right: 16px;

    }



    .content-topbox{

        padding-right: 120px;

        text-align: center;

    }

    .content-topbox::before{

        width: 100px;

        height: 100px;

        background-size: contain;

        right: 20px;

        top: -15px;

    }





    #product_cont{

        background: none;

        margin-left: 0;

    }



    #prod_right{

        width: 45%;

        box-sizing: border-box;

    }

    #prod_left{

        width: 55%;

        box-sizing: border-box;

        padding-right: 20px;

    }

    #contentWrap.product .img, #finishes, #contentWrap.product .tabs{

        width: 100%;

        box-sizing: border-box;

    }

    #contentWrap.product .finishes{

        width: 100%;

    }

    #contentWrap.product .finish{

        width: 49%;

        margin-right: 1%;

    }



    #contentWrap.product .tab, #product_cont{

        width: 100%;

        box-sizing: border-box;

    }

    #contentWrap.product{

        width: 100%;

        box-sizing: border-box;

        left: auto;

    }

    .x360{

        width: 100%;

        display: table;

        text-align: center;

    }

    .x360 img{

        width: 100%;

        border-radius: 5px;

        height: auto;

        max-width: 400px;

        display: inline-block;

    }

    #contentWrap.product .x360 img{

        display: inline-block;

    }

    #prod_left .img{

        text-align: center;

    }

    .productThumb{

        width: 100%;

    }

    #contentWrap.product .img a.productThumb img{

        display: inline-block;

    }

    #spritespin, .img .productThumb img{

        width: 100% !important;

        max-width: 398px;

        display: inline-block;

        margin: 0 auto;

    }

    #contentWrap.product h1{

        padding: 0 17px;

    }

    #tab-general img, #tab-technical img, #tab-guarantee img, #tab-testing img{

        max-width: 100%;

        height: auto;

        width: auto;

    }

    #tab-general iframe, #tab-videos iframe, #tab-testing iframe, #tab-technical iframe{

        width: 100%;

    }



    .featured-wide{

        width: 100%;

        height: auto;

    }

    .product_box{

        width: 24%;

        margin-right: 1%;

    }

    .product_box a.img{

        width: 100%;

        height: 160px;

        background-size: 100% auto;

        background-position: center center;

        margin-left: 0;

        margin-right: 0;

        border: 1px solid #0f4e8c;

        box-sizing: border-box;

    }

    .product_box a.text{

        width: 100%;

        box-sizing: border-box;

        height: auto;

        /* min-height: 70px; */

    }

    .product_box a.text.text2{

        height: auto;

        /* min-height: 112px; */

    }

    .product_box a.text.text3{

        height: auto;

        /* min-height: 90px; */

    }

    /* .product_box:nth-child(4n+2){

        clear: left;

    } */

    .product_box a.find{

        width: 100%;

    }





    .content-stockist .find-stockist .col1 #map{

        width: 100% !important;

    }

    .content-stockist .right .wp-post-image{

        width: 100%;

        height: auto;

    }



    .mr-max{

        display: none;

    }



    .content-cart table input[type="text"]{

        width: 15px !important;

        display: block;

        text-align: center;

        margin-bottom: 3px;

    }

}







@media screen and (max-width: 950px){

    .topcart{

        /* display: none; */

    }

    .topcart-text{

        display: none;

    }

    #searchform{

        width: 184px;

    }

    #social{

        margin-top: 20px;

    }

    #social a{

        width: 34px;

        height: 34px;

        line-height: 34px;

    }

}



.showmenu, .showsearch{

    color: #000;

    font-size: 40px;

    width: 40px;

    height: 40px;

    line-height: 40px;

    text-align: center;

    position: absolute;

    top: 15px;

    right: 25px;

    display: none;

}

.showsearch{

    right: 90px;

}

.header-phone{

    width: 100%;

    background: none;

    margin-top: 0px;

    display: none;

    color: #000;

    font-size: 30px;

    margin-left: 0;

    line-height: 30px;

    font-weight: 600;

    letter-spacing: 2px;

}

.header-phone span{

    margin-right: 14px;

}



@media screen and (max-width: 900px){

    .content-topbox{

        display: table;

        padding-bottom: 15px;

        padding-top: 0;

    }

    .content-topbox.markbox a{

        display: table-cell;

        width: auto;

    }

    .content-topbox.markbox .icon{

        max-width: 150px;

        margin: 0 auto;

        transform: scale(0.6);

    }

    .content-topbox.markbox .icon-contact{

        background-position: -15px -300px;

    }

   

}

@media screen and (max-width: 800px){

     .content-topbox.markbox .icon-contact{

        background-position: -22px -300px;

    }

    .content-topbox.markbox .icon-guarantee{

        background-position: -15px -150px;

    }

    .homevideobox .video{

        font-size: 15px;

    }

    .homevideobox .video, .markbox-video{

        width: 100%;

        text-align: center;

    }

    .markbox-video a{

        width: 30%;

        display: inline-block;

    }

    .product_box, .product_box.ctvrta{

        width: 32%;

        margin-right: 0.5%;

        margin-left: 0.5%;

    }

    #bar li a{

        padding: 0 15px;

    }

}





@media screen and (max-width: 730px){

    #contentWrap{

        margin-top: 0;

    }

    #contentWrap.hp{

        margin-top: 29px;

    }

    #masthead{

        background: #fff;

        margin-bottom: 15px;

    }

    .site-header #topHeader{

        padding-bottom: 10px;

    }

    .showmenu, .showsearch{

        display: block;

    }

    #searchform{

        margin: 0;

        padding-left: 20px;

        padding-right: 20px;

    }

    #searchform .fa-search{

        display: none;

    }



    .main-navigation{

        opacity: 0;

        overflow: hidden;

        max-height: 0;

        position: relative;

        transition: 0.4s;

        display: block;

        height: auto;*/

    }

	footer .main-navigation {

		display:none;

	}

    #masthead .main-navigation.show{

        opacity: 1;

        max-height: 600px;

    }

    .main-navigation ul li, #colophon .nav-menu li{

        display: table;

        width: 100%;

        border-bottom: 2px solid #56afdf;

    }

    .main-navigation ul li:last-child, #colophon .nav-menu li:last-child{

        border-bottom: 0;

    }

    .main-navigation ul li a, #colophon .nav-menu li a{

        display: block;

        width: 100%;

        border-right: 0;

        text-align: center;

        background: #51a2e6;

        color: #fff;

        font-size: 14px;

    }



    .main-navigation ul li .sub-menu{

        display: none !important;

    }





    #searchform{

        background: none;

        border: 0;

        box-sizing: border-box;

        width: 100%;

        position: relative;

        display: block;

        max-height: 0;

        opacity: 0;

        transition: 0.4s;

        margin-top: 0;

        height: auto;

        top: 0;



    }

    #searchform div{

        width: 100%;

        display: table;

        border: 1px solid #efefef;

    }

    #searchform.show{

        opacity: 1;

        max-height: 40px;

        top: 10px;

        padding-bottom: 10px;

    }

    #searchform #s{

        padding: 4px 4px 4px 40px;

        float: left;

        box-sizing: border-box;

        width: 100%;

        height: 27px;

    }

    #searchform #searchsubmit{

        position: absolute;

        left: 0;

        top: 0;

        background: url("img/search.png") no-repeat;

    }



    #social{

        display: none;

    }

    .header-phone{

        display: table;

    }

    .topcart{

        position: absolute;

        right: 28px;

        top: 75px;

        margin-top: 0;

    }







     .content-topbox{

        display: none;

     }

     .homevideobox{

        display: none;

     }



    .content p img{

        width: auto;

        max-width: 100%;

        height: auto;

    }

    .content p img.ajax-loader{

        width: auto;

    }







    #bar{

        height: auto;

        border: 0;

        background: none;

        box-sizing: border-box;

        padding: 0 20px;

    }

    #bar ul li{

        display: block;

        text-align: center;

        margin-bottom: 3px;

        border-right: 0;

        width: 100%;

    }

    #bar ul li a{

        box-sizing: border-box;

        text-align: center;

        font-size: 18px;

        border: 3px solid #a8cff0;

        border-radius: 5px;

        line-height: 45px;

        font-weight: 600;

    }

    #bar ul li:hover, #bar li a.active{

        border-color: #51a2e6;

        background: #51a2e6;

        color: #fff;

    }

    #bar ul li a::before, #bar ul li a::after{

        display: none;

    }

    #prod_left, #prod_right{

        width: 100%;

        background: none;

        padding: 0 17px;

    }

    #product_cont{

        display: table;

        padding-top: 25px;

    }

    #prod_right{

        margin-top: 25px;

    }



    #prod_right img{

        width: auto;

    }



    #contentWrap.product .tabs{

        display: none;

    }

    .tip360{

        display: none !important;

    }



    .logo{

        position: relative;

    }

    .logo-title{

        display: block;

        text-transform: uppercase;

        font-size: 9.5px;

        color: #315089;

        text-decoration: none;

        position: absolute;

        left: 0;

        bottom: -15px;

        font-weight: 600;

        width: 240px;

    }



    #tab-general iframe, #tab-videos iframe{

        min-height: 400px;

    }





    .content-stockist h1{

        font-size: 20px;

    }



    #prod_right a img{

        width: 100%;

        max-width: 342px;

    }





    .content-cart table th{

        display: none;

    }

    .content-cart table td{

        display: block;

    }

    .content-cart table td::before{

        display: block;

        float: left;

        width: 100px;

        font-weight: 600;

        font-size: 14px;

        text-align: left;

    }

    .content-cart table td:last-child{

        border-bottom: 4px solid #f0f0f0;

    }



    .content-cart table td:nth-child(1)::before{

        /* content: "Product"; */

    }

    .content-cart table td:nth-child(2)::before{

        content: "Quantity";

    }

    .content-cart table td:nth-child(3)::before{

        content: "Unit Price";

    }

    .content-cart table td:nth-child(4)::before{

        content: "Subtotal";

    }

    .content-cart table .summary td::before{

        display: none;

    }

}



@media screen and (max-width: 680px){

    .content-bottombox.markbox{

        margin: 0;

    }

    .content-bottombox.markbox a{

        width: 50%;

        display: block;

        float: left;

        font-size: 16px;

        margin-bottom: 30px;

    }

    .content-bottombox.markbox .icon{

        max-width: 150px;

        margin: 0 auto;

    }

    #above-footer-left form {white-space: normal;}
    #above-footer-left form input[type="text"] {width: 100%; box-sizing: border-box;}
    #above-footer-left form button {top: auto; bottom: 10px;}
    #above-footer-left form label {padding-right: 0; margin-bottom: 5px; display: inline-block;}
    #above-footer {align-items: baseline;}

}



@media screen and (max-width: 640px){

    #tab-general iframe, #tab-videos iframe{

        min-height: 340px;

    }

    .products-title .left, .products-title .right,

    .content-stockist .left, .content-stockist .right{

        width: 100%;

        padding-left: 0;

    }

    .products-title .left img,

    .content-stockist .right img{

        width: 100%;

        max-width: 200px;

        margin: 0 auto;

        display: block;

    }

    .content-stockist .right img{

        position: relative;

        top: 0;

        right: 0;

        margin-bottom: 15px;

    }

    .products-title .right h1, .products-title .right p{

        text-align: center !important;

    }

    .content-stockist .find-stockist .col1, .content-stockist .find-stockist .col2{

        width: 100%;

        border: 0;

    }

    .content-stockist .find-stockist .col1 #map{

        height: 300px !important;

    }

}



@media screen and (max-width: 480px){

    .product_box, .product_box.ctvrta{

        width: 48%;

        margin-right: 1%;

        margin-left: 1%;

    }

    .content-stockist .searchbox input[type="text"]{

        width: 70%;

        box-sizing: border-box;

        display: block;

        float: left;

    }

    .content-stockist .searchbox .btn{

        width: 20%;

        box-sizing: border-box;

        margin: 0;

        margin-left: 10%;

    }

    .news h2{

        display: table;

        width: 100%;

    }

    .news .thumbnail-wrapper{

        width: 100%;

        margin-right: 0;

    }



    .wpcf7 input[type='text'], .wpcf7 input[type='email'], .wpcf7 textarea, .wpcf7 select{

        width: 100%;

        box-sizing: border-box;

    }

    #above-footer {display: block; padding-top: 0;}
    #above-footer > * {width: 100%; margin: 20px 0;}
    .content-bottombox.markbox {padding-bottom: 0;}

}





@media screen and (max-width: 430px){

    .logo{

        background-size: contain;

        width: 180px;

        height: 55px;

        margin-bottom: 5px;

    }

    .header-phone{

        font-size: 25px;

        letter-spacing: 0;

    }

    #contentWrap.product .finish{

        width: 100%;

        margin-right: 0;

    }

    .product-buy .price{

        width: 100%;

        float: right;

        text-align: right;

        padding-bottom: 10px;

    }

    .topcart{

        top: 62px;

    }

}

@media screen and (max-width: 350px){

    .logo{

        width: 150px;

        height: 45px;

        margin-top: 20px;

    }

    .header-phone{

        font-size: 20px;

    }

    .content-bottombox.markbox a{

        font-size: 14px;

    }

}





/* products home */


@media screen and (max-width: 1000px){

    .product-show, .product-show-slide{

        width: 100%;

        margin: 0 auto;

    }

    .product-show{
        padding: 0 20px;
        box-sizing: border-box;
        padding-bottom: 20px;
    }

.product-slide-left, .product-slide-right {    z-index: 9;}
.product-slide-left, .product-slide-left:hover {left: -20px;}
.product-slide-right, .product-slide-right:hover {right: -20px;}

.homevideobox {padding: 20px 0;}

}    


/*

@media screen and (max-width: 1000px){

    .product-slide-left, .product-slide-right, .product-slide-left:hover, .product-slide-right:hover{

        left: -30px;

        z-index: 10;

    }

    .product-slide-right, .product-slide-right:hover{

        right: -30px;

        left: auto;

    }







    .content-products{

        display: block;

    }

    #page, #main{

        overflow: hidden;

    }



    .product-show, .product-show-slide{

        width: 100%;

        max-width: 820px;

        margin: 0 auto;

    }

    .product-show-slide{

        margin-left: 0;

    }

    .product-show .product_box{

        width: 195px;

        margin-right: 5px;

        margin-left: 5px;

    }

    .product-show .product_box.ctvrta{

        margin-right: 5px;

    }

    .product_box{

        padding: 3px;

    }

    .product_box .text{

        height: 60px;

        font-size: 15px;

        box-sizing: border-box;

    }

}



@media screen and (max-width: 860px){

    .product-slide-left, .product-slide-right{

        top: 314px;

    }

    .product-show-slide{

        height: 530px;

    }

    .product-show, .product-show-slide{

        max-width: 720px;

    }

    .product-show .product_box{

        width: 170px;

    }

    .product_box .text{

        height: 80px;

    }

}



@media screen and (max-width: 780px){

    .product-slide-left, .product-slide-right{

        top: 304px;

    }

    .product-show, .product-show-slide{

        max-width: 620px;

    }

    .product-show .product_box{

        width: 145px;

    }

    .product-show h1{

        font-size: 30px;

    }

}



@media screen and (max-width: 660px){

    .product-show, .product-show-slide{

        max-width: 500px;

    }

    .product-show .product_box{

        width: 157px;

    }

}



@media screen and (max-width: 540px){

    .product-show, .product-show-slide{

        max-width: 400px;

    }

    .product-show .product_box{

        width: 124px;

    }

    .product-slide-left, .product-slide-right{

        top: 336px;

    }

}



@media screen and (max-width: 450px){

    .product-show, .product-show-slide{

        max-width: 320px;

    }

    .product-show .product_box{

        width: 150px;

    }

    .product-slide-left, .product-slide-right{

        top: 335px;

    }

}

@media screen and (max-width: 370px){

    .product-show, .product-show-slide{

        max-width: 260px;

    }

    .product-show .product_box{

        width: 120px;

    }

}

@media screen and (max-width: 310px){

    .product-show, .product-show-slide{

        max-width: 220px;

    }

    .product-show .product_box{

        width: 100px;

    }

}


*/


/* subheader */

@media screen and (max-width: 1000px){

    .subheader-slide, .subheader-slide .main, .subheader-slide .policeman{

        height: 380px;

    }

    .subheader-slide .policeman{

        background-size: contain;

        width: 40%;

    }

}

@media screen and (max-width: 890px){

    .subheader-slide, .subheader-slide .main, .subheader-slide .policeman{

        height: 280px;

    }

}

@media screen and (max-width: 660px){

    .subheader-slide, .subheader-slide .main, .subheader-slide .policeman{

        height: 220px;

    }

}

@media screen and (max-width: 520px){

    .subheader-slide, .subheader-slide .main, .subheader-slide .policeman{

        height: 180px;

    }

}

@media screen and (max-width: 440px){

    .subheader-slide, .subheader-slide .main, .subheader-slide .policeman{

        height: 160px;

    }

    .subheader-slide .policeman{

        left: 15px;

        bottom: -10px;

    }

}

@media screen and (max-width: 380px){

    .subheader-slide, .subheader-slide .main, .subheader-slide .policeman{

        height: 140px;

    }

}