@charset "utf-8";
/* CSS Document */
@media only screen and (max-width:1420px){
.container{width:100%;}
.nav{width: calc(100% - 190px);}
    .nav > ul > li > a{font-size: 14px; margin: 0px 0 0 10px;}
}

@media only screen and (max-width:1200px){
    .right-content{padding: 60px 0px 60px 30px;}
.product-section ul li{width: 50%;}
.block4 h6{font-size: 12px;}
}
@media only screen and (max-width:1120px){
    .wrapper{padding: 105px 0 0;}
    
    .menu{display: inline-block;}
        .nav{display: none; width: 300px; position: fixed; right: -300px; top: 0; background: #fff; height: 100%; overflow: auto; padding:10px 10px;border-left: 1px solid #ccc;}
        .nav ul li{display: block; float: none; padding: 4px 0;}
        .nav > ul > li > a{font-size: 18px;}
        .sub-menu{position: static; padding:0;}
        .sub-menu ul{width: 100%; margin: 0 0 10px 0;}
        .sub-menu ul li {padding: 0;}
        .sub-menu ul li a{padding: 0;}
        .sub-menu .container{padding: 0 15px;}
        .sub-menu ul{display: none;}
        .nav > ul > li:hover .sub-menu ul{display: block;}
        .nav ul{float: none !important; width: 100%;}
	.open .nav{right: 0;}
    .open .wrapper, .open .header{left: -300px;}


    .nav .company{display: block;}
    .nav .company li span{font-weight: bold;}

    .cart{width: 100%; position: relative;margin: 10px 0; top: 0;}
.cart-cont{padding: 0 0 0 7px;}
.cart ul li.total h6{margin: 0 10px 15px; font-size: 14px;}
    

.block1{width: 100%;}
.contact-right{width: 48%;}

}

@media only screen and (max-width:999px){
    
    .banner-section .container{display: block;}
    .banner-left{display: none;}
    .banner-maiddle{width: 100%; padding: 0;}
    .banner-right{width: 100%; display: flex;}
    .banner-right figure{width: 50%;
        float: left;
        margin: 0 10px;
        padding: 0;}
        .banner-maiddle p{margin: 12px 0;}
        .banner-right img {
            margin: 0 auto;
            width: 100%;
            height: 260px;
            object-fit: cover;
        }
        .new-block{width:calc(100% - 30px);}
        .section3{min-height: 320px;}

        .side-nav{display: none;}
        .right-content{width: 100%; padding: 60px 0;}
        .specials-section ul li{width: 32.3%;}
        .contact-right{width: 100%;}
        .form-section{width: 100%;margin: 0 0 20px;}
        .form-section .form-group{padding: 0;}
        .form-section h2{margin: 0 0 20px 0;}
        .form-section .btn4{margin: 0 ;}

        

}

@media only screen and (max-width:768px){
    .section3 h2{line-height: 36px;font-size: 34px;}
    .section3 span{ font-size: 16px;}
    .section3 span b{display: block;}
    .specials-section h2, .logoss h2, .new-block h2{font-size: 30px;}
    .logoss h2 small{display: block;}
    .top-section h3{font-size: 20px;}
    .specials-section ul li{width: 100%;}
    .specials-section ul li img{width:100%;}
    .block h3 span{margin: 0 auto 10px auto;}

    .form-block{width: 100%;}
    .pic-block{float: none; margin: 0 auto 30px auto; display: table;}

    .block1{display: block; margin:40px auto 0;}
    .block1 figure{width: 100%;}
    .block1-cont{width: 100%;padding: 20px 0 0;}

    .contact-right-in{padding:30px 7px;}
    .contact-right-in h5,.contact-right-in h4 span{font-size: 14px;}
    .contact-right-in h4{font-size: 20px;}
    .right-content1 .table3 , .right-content1 #example_wrapper{width: 800px;}

    .table4{width: 100%;}
    .location{width: 100%;}

    .right-content1 #example_wrapper .col-sm-6{width: auto !important;display: inline-block; }

    .banner-maiddle .btn4 {
        padding: 4px 10px;
        font-size: 12px;
        margin: -20px 0 0 -15px;
        display: table;
       
    }
}

@media only screen and (max-width:599px){
    .banner-right{width: 100%; display: block;}
    .banner-right figure{width: 100%; margin: 20px 0 0px;}
    .product-section ul li{width: 100%;}
    .block4{height: auto !important;}
    .slick-prev, .slick-next{    top: 70%;}
    .left, .right{width: 100%;}
    .seasidetms ul li{width: 100%;}
    .inner-banner{height: 200px;}

    
}

@media only screen and (max-width:480px){
    .login{width: 90%;}

}