@media (min-width: 768px) {
    html {
        font-size: 18px;
    }
    .navbar-collapse{width: 50%;}
    .footer{padding: 5% 0;}
    .contact-footer{margin: 0;}
    .social-footer{margin-top: 1rem;}
    .owl-products button.owl-dot {width: 110px;}
    
    .content-aboutus, .content-service{padding: 5% 0;}
    .content-category{padding: 5% 0 10%;}
    .content-otherpage{padding: 5% 0;}
    .viewmore-btn{text-align: right;}
    .vdo-presents{height: 380px;}
    
    .content-products{
        margin: 3rem auto;
    }

}
@media (min-width: 812px){
}
/*///////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 992px){
    .headbar-main{position: fixed;}
    .hamburgers-box{display: flex;justify-content: flex-start;}
    .navbar-expand-lg .navbar-collapse{width: 100%;}
    .navbar-expand-lg .navbar-nav{width: 100%;}
    .navbar-collapse ul li {
        width: auto;
        margin: 0 auto;
        text-align: center;
    }
    .navbar-collapse ul li a{
        padding: 10px 0px;
        position: relative;
        transition: all 0.5s;
        display: block;
    }   
    .social-footer{margin-top: 0;}
    .language-box{
        width: 70%;
        float: right;
        clear: both;
    }
    .language-box ul{
        list-style: none;
        display: flex;
        align-items: center;
        border-radius: 30px;
        background: #6a6b6b;
    }
    .language-box ul li{
        width: auto;
        margin: auto;
    }
    .language-box ul li a{
        display: flex;
        padding: 5px;
        color: #FFF;
        align-content: center;
        justify-content: center;
        text-align: center;
        transition: all 0.5s;
    }
    .language-box ul li a.active{
        background: #FFF;
        transform: scale(1.3);
        border-radius: 50%;
        color: #242424;
        width: 40px;
        height: 40px;
    }
    .title-about h1, .title-box h1{font-size: 35px;}
    .name-product{
        -webkit-line-clamp: 3;
        height: calc(1rem * 1.2 * 3);
        padding: 5px 10px;
    }
    .aboutus-box h1{ font-size: 33px;}
    .address-box {margin-bottom: 0;}
    
    .vdo-port{height: 420px;}
    
     #big{height:380px;}
    #big .item{	height:380px;}
    .vdo-presents{height: 480px;}
    
}
/*///////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 1200px) {
    html{font-size: 20px;}
    .language-box{ width: 55%;}
    .name-product{width: 75%;}
    .icon-box p{padding: 0 11%;}
    .owl-products button.owl-dot {width: 215px;}
    .footer h1{margin-bottom: 30px;}
    #slide-zone, #slide-zone .banner-slide{height: 100vh;text-align: center;}
    #slide-zone .owl-carousel .owl-dots{bottom: 5%;}
    #slide-zone .banner-slide img{max-width: 100%;width: auto;}
}

/*///////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 1440px) {
    html{font-size: 22px;}
    .container{ max-width: 1330px; }
    .title-about h1, .title-box h1 {
        font-size: 44px;
    }
    html:lang(en) .title-about h1{
        font-size: 1.5rem;
    }
    .title-box p, .title-about p{font-size: 25px;}
    .owl-products button.owl-dot {
        width: 265px;
    }
    .vdo-port{height: 480px;}
    
     #big{height:480px;}
    #big .item{	height:480px;}
}
/*///////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 1600px) {
    .name-product{width: 65%;}
    .owl-products button.owl-dot {width: 320px;}
    .category-product.product-page .img-box{height: 350px;}
    .vdo-port{height: 515px;}
}
/*///////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 1800px) {
    html{font-size: 24px;}
    .container{ max-width: 1440px; }
}