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

}
@media only screen and (max-width: 1400px) {
   
    .contenShowProduct .itemProduct {
        width: calc((100% / 4) - 20px ) !important;
    }
}

@media only screen and (max-width: 1200px) {
}
@media only screen and (max-width: 1180px) {
    
}
@media only screen and (max-width: 1120px) {

}
@media only screen and (max-width: 1100px) {
    .contenShowProduct .itemProduct {
        width: calc((100% / 3) - 20px ) !important;
    }
    .itemArticle .text {
        font-size: 12px;
    }
}
@media only screen and (max-width: 980px) {
    .propertiesRows .rowProp {
        width: 100%;
    }
    .tabDetailProduct.fixed {
        position: relative;
        background: #f6f6f7;
        z-index: 10;
        top: 0;
    }
    .rowCustom.rowdetailprod .col1 {
        position: relative;
        width: 420px;
        margin-left: 0;
    }
    .rowCustom.rowdetailprod .col1 .productPics .largPicProd {
        width: 340px;
        margin-right: 80px;
    }
    .productPics .smallPicProd .itemSmallPic {
        width: 60px;
    }
    .rowCustom.rowdetailprod .col2 {
        width: calc(100% - 450px);
    }
    .rowCustom.rowdetailprod .col1 .productPics .smallPicProd {
        width: 80px;
        overflow: hidden;
    }
    .contenShowProduct .itemProduct {
        width: calc((100% / 2) - 20px ) !important;
    }
    .itemArticle .text {
        font-size: 10px;
        font-weight: bold;
    }
}
@media only screen and (max-width: 940px) {

}
@media only screen and (max-width: 890px) {
    
    section.secFAQBox .allContentTab .col {
        width: 100%;
    }
    section.secFAQBox .allContentTab .col {
        position: relative;
        width: 100%;
        margin: 5px;
    }
    section.secArticleList .container i.line {
        display: none;
    }
    .itemArticle {
        grid-template-columns: 1fr;
    }
    .itemArticle .col1  {
        padding: 30px 20px 0;
    }
    .itemArticle .col2 {
        padding: 0 20px 20px;
    }
    .itemArticle picture {
        max-width: 420px;
        margin: auto;
        border: 6px solid #ffbb5f;
    }
    .itemArticle .col1 span.NOpost {
        left: 0;
        z-index: 10;
        bottom: auto;
        right: 0;
        top: 15px;
        width: 150px;
        background: #ffbb5f;
        color: #2a2a2a;
        font-size: 16px;
    }
    .itemArticle .text {
        font-size: 14px;
        font-weight: normal;
    }
}
@media only screen and (max-width: 840px) {
    .rowCustom.rowdetailprod .col1 .productPics .largPicProd .img-zoom-result {
        right: 0;
        pointer-events: none;
        opacity: 0.5;
    }
    .rowCustom.rowdetailprod {
        flex-direction: column;
        align-items: center;
    }
    .rowCustom.rowdetailprod .col2 {
        width: 100%;
        margin: 0;
    }
    .FunctionalButtons {
        width: 100%;
        height: 50px;
        left: 0px;
    }
    .FunctionalButtons i.line {
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        height: calc(200%);
        width: 2px;
        background: #d9d9d9;
        right: 0;
        left: 0;
        transform: rotate(90deg);
    }
    .rowCustom.rowdetailprod .col1 .productPics .largPicProd {
        width: 420px;
        margin: 0 0 80px;
    }
    .rowCustom.rowdetailprod .col1 .productPics .smallPicProd {
        width: 100%;
        height: 80px;
        top: 100%;
        bottom: auto;
        flex-direction: row;
    }
}
@media only screen and (max-width: 768px) {
    .contenShowProduct .itemProduct {
        width: calc((100% / 1) - 20px ) !important;
    }
    .itemOffice {
        width: 100%;
        margin: 20px auto;
    }
    .contentContact .col1 {
        padding: 0;
    }
    .contentContact {
        grid-template-columns: 1fr;
    }
    a.itemLogo {
        width: calc((100% / 2) - 20px);
    }
    
    .contentCustomer .row {
        flex-wrap: wrap;
    }
    .contentCustomer .row input, .contentCustomer .row textarea, .contentCustomer .row select {
        width: calc(100% - 120px);
        margin: 0 0 10px 0;
    }
    a.itemBrand {
        width: calc((100% / 2) - 10px);
    }
    .rowCustom .col1 {
        width: 100%;
    }
    .rowCustom .col2 {
        position: relative;
        width: 100%;
        margin: 10px 0 0;
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 10px;
    }
    .SliderOne .itemSliderOne {
        height: 51vw;
    }
    
    a.itemBoxADS {
        margin: 0 0 0px 0;
    }
    
    .modal .BoxModal {
        padding: 10px 10px;
    }
}
@media only screen and (max-width: 680px) {
    .rowTitleProd {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        padding: 10px 5px;
        text-align: center;
    }
    
    .propertiesRows .rowProp {
        width: 100%;
        margin: 0 0 10px;
    }
    .propertiesRows .rowProp .col1 , .propertiesRows .rowProp .col2 {
        margin: 0 0 2px;
        width: 100%;
    }
    .ContentFormCM .boxInput {
        width: 100%;
    }
    section.secContact {
        width: 100%;
    }
    .categoryList {
        max-width: 300px;
    }
    .rowCustom .col2 {
        grid-template-columns: 1fr;
    }
    a.itemBoxADS {
        height: calc(51vw - 5px);
    }
    .rowCustom.BoxesADS {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 10px;
    }
    .titleTabBox h2.title {
        font-size: 12px;
        padding: 5px 20px;
    }
    .titleTabBox {
        max-width: 280px;
        bottom: calc(100% - 25px);
    }
    .titleTabBox:before , .titleTabBox:after {
        bottom: -13px;
    }
    .titleTabBox h2.title:before {
        height: 13px;
    }
    section.secAds .container {
        grid-template-columns: 1fr;
    }
}

@media only screen and (max-width: 600px) {
    
    .contenShowProduct .itemProduct {
        width: calc((100% / 2) - 20px ) !important;
    }
    button.btnFilterMobile {
        display: flex;
    }
    button.closeFilterMobile {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .RowFAQ .col2 {
        padding: 0px 0 0;
        flex-direction: column;
        height: auto;
        justify-content: center;
    }
    
    .ContentListProducts .col1 {
        width: 100%;
        margin-left: 0;
        display: none;
    }
    .ContentListProducts .col1.fixed {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: #f1f1f1;
        z-index: 9999999999950;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 20px 0px 50px;
        overflow: auto;
    }
    
    button.btnFilterMobile {
        display: flex;
    }
    .ContentListProducts .col2 {
        width: 100%;
        margin-top: 10px;
    }
    button.closeFilterMobile {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .rowCustom.BoxSpecial {
        grid-template-columns: 1fr;
    }
    .rowCustom.BoxSpecial.hor .col {
        margin: 0;
    }
    .card .contentCard {
        flex-wrap: wrap;
    }

    a.itemBrand {
        width: calc(100% - 10px);
    }
    
}
@media only screen and (max-width: 560px) {
    h4.titlePicCardProd {
        font-size: 14px;
        text-align: center;
    }
    .rowPicProductDet .col .rowCustom.rowProductPics {
        justify-content: center;
        flex-wrap: wrap;
    }
    .rowCustom.rowProductPics .itemProductPic {
        width: 50px;
        height: 50px;
    }
    .rowPicProductDet .col {
        width: 100%;
    }
    .rowPicProductDet .col:first-child {
        width: 60%;
        margin: auto;
    }
    .rowPicProductDet {
        flex-wrap: wrap;
    }
    .rowCustom.rowdetailprod .col1 .productPics .largPicProd {
        width: 100%;
        margin: 0 0 80px;
    }
    .rowCustom.rowdetailprod .col1 {
        width: 100%;
    }
    section.secBoxProduct .container {
        flex-wrap: wrap;
    }
    section.secBoxProduct .container .col1 {
        width: 100%;
        padding: 20px 0px 20px 0px;
    }
    section.secBoxProduct .container .col2 {
        width: 100%;
    }
    section.secBoxProduct .container .col2:before {
        right: -20px;
        width: calc(100% + 40px);
    }
    i.borderright:before {
        position: absolute;
        top: 0;
        width: 100%;
        height: 4px;
        content: '';
        background: #fffc6a;
        border-radius: initial;
        left: 0;
        right: 0;
        margin: auto;
        max-width: 230px;
    }
    i.borderright:after {
        display: none;
    }
    .slider4Item2line {
        width: 100%;
        margin: 0;
    }
    .addoneArrowCustom {
        width: 100%;
    }
}
@media only screen and (max-width: 540px) {

    .boxpagetitle h2.title {
        font-size: 14px;
        min-width: 200px;
        justify-content: center;
        text-align: center;
    }
    a.itemLogo {
        width: calc(100% - 20px);
    }
    section.secSurprisingly .col1  {
        width: 200px;
        box-sizing: border-box;
        margin-bottom: 20px;
    }
    .SliderOneProgress.swiper-container {
        max-height: 430px;
        position: relative;
        width: 100%;
    }
    section.secSurprisingly .col2{
        width: 100%;
        box-sizing: border-box;
    }
    section.secSurprisingly {
        overflow: hidden;
        flex-direction: column;
        align-items: center;
    }
}
@media only screen and (max-width: 480px) {
    .card {
        padding: 0;
    }
    .dateRate {
        flex-direction: column;
        align-items: center;
    }
    .contenShowProduct .itemProduct {
        width: calc((100% / 1) - 20px ) !important;
    }
    section.secContact {
        margin: auto;
        PADDING: 0;
    }
    .itemArticle span.dateTime {
        margin: auto;
    }
    .itemArticle h2.title:before {
        left: 0;
        margin: auto;
    }
    .itemArticle h2.title {
        justify-content: center;
    }
    .categoryList {
        max-width: 200px;
    }
    .itemCM {
        flex-wrap: wrap;
    }
    .itemCM .colAvatar {
        width: 100%;
        height: 100px;
    }
    .itemCM .colAvatar:before {
        position: absolute;
        left: 0;
        right: 0;
        width: 100%;
        background: #e7bc15;
        content: '';
        height: 2px;
        margin: auto;
        top: 0;
        bottom: 0;
    }
    .tabDetailProduct button.btnTabDP:after {
        top: auto;
        bottom: 0;
        border-color: transparent transparent #0348c0 transparent;
    }
    .itemCM .colText {
        position: relative;
        width: 100%;
        text-align: center;
    }
    .tabDetailProduct button.btnTabDP {
        width: 100%;
        border: none !important;
        background: #ececec;
        margin: 10px 0 0;
        border-radius: 5px;
    }
    .Departements .itemDep {
        width: 100%;
    }
    .ContentListProducts .col1, .ContentListProducts .col2 {
        min-height: 55vw;
    }
    .helpDeskFooter .container {
        display: flex;
        flex-direction: column;
    }
    .helpDeskFooter .container .col {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }
    .newsLetterBox .ContentNewsLetter {
        padding: 0 10px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .newsLetterBox h3.titleNewsletter {
        font-size: 16px;
        margin: 20px 0;
        height: auto;
    }
    .newsLetterBox .ContentNewsLetter .FormNewsletter {
        flex-direction: column;
        align-items: center;
    }
    .FormNewsletter input {
        width: 100%;
    }
    
    .newsLetterBox .ContentNewsLetter:before {
        position: relative;
        width: 70px;
        height: 80px;
        display: block;
        margin: 0 auto;
    }
    .rowCustom.promotion .col {
        width: 100%;
    }
    .rowCustom.AllDayDiscount .col:first-child , .rowCustom.AllDayDiscount .col:last-child{
        width: 100%;
    }
}
@media only screen and (max-width: 420px) {
    .ShareRate {
        flex-wrap: wrap;
        justify-content: space-evenly;
    }
    .titleTabBox {
        max-width: 220px;
        bottom: calc(100% - 25px);
    }
    .titleTabBox h2.title {
        font-size: 10px;
    }
}
@media only screen and (max-width: 380px) {
    
}
@media only screen and (max-width: 280px) {

}
@media only screen and (max-width: 980px) {
    img.papercupImage {
        width: 60%;
    }
}

@media only screen and (max-width: 768px) {
    section.designPaperCup {
        flex-direction: column-reverse;
    }

        section.designPaperCup .contextPaperCup {
            padding: 20px 0;
            width: 100%;
        }

        section.designPaperCup .PicStart {
            width: 100%;
        }

        section.designPaperCup .contextPaperCup h3.title {
            justify-content: center;
            text-align: center;
        }
}