@media(min-width:1367px) {
    .slider-banner .lSAction > a {
        left: 50%
    }
}

@media(min-width:992px) {
    #sticker {
        display: block;
        line-height: 14px
    }

    #sticker-container .tbl > .tbl-cell {
        vertical-align: middle
    }

        #sticker-container .tbl > .tbl-cell.mobile {
            display: none
        }

    #sticker-container.menu-fix {
        z-index: 999;
        -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.3);
        -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.3);
        box-shadow: 0 2px 3px 0 rgba(0,0,0,.3);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        background-color: #fafafa
    }

    #sticker-container ul.main-menu {
        display: table;
        width: 100%;
        padding: 0;
        margin: 0
    }

    #sticker .main-menu:after {
        display: table;
        clear: both
    }

    #sticker .main-menu > li {
        text-align: center;
        transition: ease-in-out .2s;
        line-height: 40px;
        padding: 0 16px
    }

        #sticker .main-menu > li:last-child {
            line-height: 40px;
            color: #222;
            vertical-align: middle
        }

        #sticker .main-menu > li.mobile {
            display: none
        }

    #sticker .main-menu ul > li > a {
        display: block;
        white-space: nowrap
    }

    #sticker .main-menu > li > a {
        color: #fff;
        display: block;
        font-size: 15px;
        text-align: center;
        white-space: nowrap;
        position: relative;
        font-weight: 500;
        text-transform: uppercase;
        transition: all .5s linear
    }

    #sticker .main-menu > li.active > a, #sticker .main-menu > li:hover > a {
        color: #e8c646
    }
}

@media(max-width:1200px) {
    div#sticker {
        padding-left: 30px
    }

    .header-bt > container {
        background: #fff;
        padding: 0;
        margin: 0
    }

    .about-us .item h2 {
        font-size: 20px;
        margin-bottom: 15px
    }

    .about-us .item ul li span {
        font-size: 13px
    }

    .about-us .item ul li {
        margin-bottom: 10px
    }
}

@media(max-width:991px) {
    #sticker .main-menu > li.mobile {
        display: block
    }

    #sticker {
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 9999;
        visibility: hidden;
        opacity: 0;
        float: initial
    }

        #sticker.opened {
            visibility: visible;
            opacity: 1;
            transition: ease-in-out .3s
        }

        #sticker .container {
            padding: 0
        }

    #sticker-overlay {
        opacity: 0;
        visibility: hidden;
        background: rgba(0,0,0,.2);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        z-index: 0;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -ms-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out
    }

    #sticker-wrapper {
        height: 100vh;
        width: 310px;
        max-width: 100%;
        background: #222;
        border: none;
        z-index: 1;
        left: -100%;
        display: block;
        position: relative;
        padding: 60px 0 0;
        transition: all .3s ease-out;
        margin: 0;
        opacity: 0;
        transform: scaleX(0);
        visibility: hidden
    }

    @keyframes example {
        0% {
            height: 1%
        }

        100% {
            height: 100%
        }
    }

    #sticker.opened #sticker-wrapper {
        left: -30px;
        z-index: 9999;
        opacity: 1;
        visibility: visible;
        transform: scale(1)
    }

    #sticker.opened #sticker-overlay {
        opacity: 1;
        visibility: visible
    }

    #sticker .tbl, #sticker .tbl-cell {
        display: block;
        width: 100%;
        overflow-y: auto
    }

    #sticker .sticker-header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%
    }

        #sticker .sticker-header .title {
            font-size: 16px;
            line-height: 60px;
            text-transform: uppercase;
            color: #fff;
            padding: 0 50px 0 20px
        }

        #sticker .sticker-header .close-menu {
            width: 40px;
            height: 40px;
            line-height: 40px;
            position: absolute;
            right: 5px;
            top: 17px;
            cursor: pointer;
            text-transform: uppercase
        }

            #sticker .sticker-header .close-menu:after, #sticker .sticker-header .close-menu:before {
                width: 18px;
                height: 2px;
                position: absolute;
                left: 50%;
                top: 50%;
                margin: -1px 0 0 -9px;
                content: "";
                background: #fff
            }

            #sticker .sticker-header .close-menu:before {
                transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -webkit-transform: rotate(45deg);
                -ms-transform: rotate(45deg)
            }

            #sticker .sticker-header .close-menu:after {
                transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -webkit-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg)
            }

    #sticker .sticker-body {
        max-height: 100%;
        transition: all 1s ease-in-out;
        overflow-y: auto;
        height: 100%
    }

    #sticker .search form {
        position: relative
    }

        #sticker .search form input {
            width: 100%;
            height: 40px;
            line-height: 40px;
            padding: 0 30px 0 15px;
            background-color: #fff;
            border: none;
            outline: 0 !important
        }

        #sticker .search form button {
            position: absolute;
            top: 7px;
            right: 10px;
            background: 0 0 !important;
            color: #666;
            outline: 0 !important;
            border: none;
            font-size: 20px;
            padding: 0
        }

    #sticker ul.main-menu {
        display: block;
        float: none !important;
        padding: 0;
        margin: 0;
        padding-bottom: 46px
    }

    #sticker .main-menu > li {
        display: block;
        border-bottom: 1px solid #ebedf09c;
        padding: 0;
        position: relative;
        width: 100%;
        padding-left: 15px
    }

        #sticker .main-menu > li:first-child {
            display: none
        }

        #sticker .main-menu > li.ngonngu {
            display: block !important;
            padding-left: 0
        }

    #sticker .lang {
        font-size: 14px;
        color: #fff;
        border-top: none
    }

    #sticker .main-menu > li:last-child {
        display: none
    }

    #sticker .main-menu > li > a {
        color: #fff;
        line-height: 14px;
        padding: 11px 45px 11px 15px;
        display: block;
        text-align: left;
        font-weight: 400;
        font-size: 15px;
        text-transform: capitalize;
        position: relative;
        font-family: "Open Sans"
    }

        #sticker .main-menu > li > a:before {
            content: "\f0da";
            font: normal normal normal 14px/1 FontAwesome;
            font-size: 14px;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: 0
        }

    #sticker #sticker-wrapper .main-menu > li > .fa {
        position: absolute;
        right: 0;
        top: 0;
        line-height: 39px;
        width: 39px;
        text-align: center;
        cursor: pointer;
        margin: 0;
        font-size: 12px;
        display: block;
        color: #fff
    }

    #sticker ul.main-menu > li ul {
        position: static;
        transform: none;
        width: 100%;
        padding-left: 10px;
        margin-left: 0;
        background-color: transparent;
        display: none;
        margin-bottom: 10px
    }

        #sticker ul.main-menu > li ul:after {
            display: none
        }

        #sticker ul.main-menu > li ul > li {
            border-bottom: none;
            list-style: none
        }

            #sticker ul.main-menu > li ul > li > a {
                border-bottom: none;
                padding: 7px 10px 7px 20px;
                color: #fff;
                font-size: 14px;
                position: relative
            }

                #sticker ul.main-menu > li ul > li > a:before {
                    content: "\f105";
                    font: normal normal normal 14px/1 FontAwesome;
                    font-size: 12px;
                    left: 5px;
                    position: absolute;
                    top: 8px
                }

    #sticker .sticker-footer {
        display: none;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #222;
        color: #fff
    }

    #sticker .hotline {
        text-align: center;
        display: block;
        margin: 0 auto;
        font-size: 16px;
        padding-right: 0;
        color: #fff
    }

        #sticker .hotline a {
            color: #fff
        }

        #sticker .hotline .text {
            min-height: 34px;
            line-height: 34px;
            background: url(../img/hotline-icon.png) 3px 4px no-repeat;
            white-space: nowrap;
            padding: 0 10px 0 40px;
            background-color: #fff !important;
            border-radius: 34px
        }

            #sticker .hotline .text span, #sticker .main-menu > li.hotline .text b {
                display: inline-block;
                font-weight: 600
            }

            #sticker .hotline .text span {
                color: #5d5d5d;
                text-transform: uppercase;
                font-size: 16px;
                font-weight: 700;
                margin-bottom: 0;
                padding-right: 5px
            }

            #sticker .hotline .text b {
                color: #0a4976;
                font-size: 16px
            }

    #sticker .lang {
        border-top: 1px solid #006530;
        padding: 12px 15px;
        text-transform: uppercase
    }

        #sticker .lang .current {
            color: #ddd;
            font-weight: 700
        }

    #sticker .ngonngu .lang {
        border-top: none !important
    }

    #sticker .socials {
        display: inline-block;
        width: auto;
        color: #fff;
        margin-bottom: 0;
        padding: 0;
        background: #063a61
    }

        #sticker .socials:after {
            content: "";
            display: table;
            clear: both
        }

    #sticker .top-header .right ul {
        display: block;
        width: 100%
    }

    #sticker .socials > li {
        width: 20%;
        border: none;
        float: left;
        list-style: none
    }

        #sticker .socials > li > a {
            padding: 0;
            display: block;
            height: 50px;
            line-height: 50px;
            border: 1px solid #b5cec1;
            text-align: center;
            border-left: none;
            text-transform: uppercase;
            font-size: 19px;
            color: #fff
        }

        #sticker .socials > li:last-child > a {
            border-right: 0
        }

    #sticker .top-header {
        height: 50px;
        border-top: 1px solid #b5bfba;
        background: #063a61;
        padding: 12px;
        color: #fff
    }

    #sticker .socials > li > a .fa {
        border-radius: 0;
        font-size: 20px;
        color: #fff
    }

    #sticker .socials > li:last-child > a .fa {
        border-right: none
    }

    #sticker .top-header .right ul li.hotline:before {
        top: 6px
    }

    #touch-menu {
        width: 30px;
        height: 25px;
        float: right;
        position: absolute;
        right: 15px;
        top: 18px;
        z-index: 99;
        transition: ease-in-out .3s
    }

        #touch-menu .touch-menu-inner, #touch-menu .touch-menu-inner:after, #touch-menu .touch-menu-inner:before {
            position: absolute;
            background-color: #fff;
            width: 30px;
            height: 4px;
            transition-timing-function: ease;
            transition-duration: .15s;
            transition-property: transform
        }

        #touch-menu .touch-menu-inner {
            display: block;
            margin-top: -2px;
            top: auto;
            bottom: 0;
            transition-delay: .13s;
            transition-timing-function: cubic-bezier(.55,.055,.675,.19);
            transition-duration: .13s
        }

        #touch-menu.opened .touch-menu-inner {
            transition-delay: .22s;
            transition-timing-function: cubic-bezier(.215,.61,.355,1);
            transform: translate3d(0,-10px,0) rotate(-45deg)
        }

            #touch-menu.opened .touch-menu-inner:before {
                top: 0;
                transition: top .1s cubic-bezier(.33333,0,.66667,.33333) .16s,transform .13s cubic-bezier(.215,.61,.355,1) .25s;
                transform: rotate(-90deg)
            }

            #touch-menu.opened .touch-menu-inner:after {
                top: 0;
                transition: top .2s cubic-bezier(.33333,0,.66667,.33333),opacity .1s linear .22s;
                opacity: 0
            }

        #touch-menu .touch-menu-inner:after, #touch-menu .touch-menu-inner:before {
            display: block;
            content: ""
        }

        #touch-menu .touch-menu-inner:before {
            top: -10px;
            transition: top .12s cubic-bezier(.33333,.66667,.66667,1) .2s,transform .13s cubic-bezier(.55,.055,.675,.19)
        }

        #touch-menu .touch-menu-inner:after {
            top: -20px;
            transition: top .2s cubic-bezier(.33333,.66667,.66667,1) .2s,opacity .1s linear
        }

    .header-top .left ul li a {
        font-size: 15px;
        padding: 0 15px 0 20px
    }

    #logo {
        height: 100%
    }

    .product .cont .desc {
        grid-template-columns: 50% 50%
    }

        .product .cont .desc .item {
            margin-bottom: 20px
        }

    .procedure .cont .list-procedure {
        background: 0 0;
        grid-template-columns: calc(100% / 3) calc(100% / 3) calc(100% / 3)
    }

    .list-procedure .item:nth-child(2n) .txt-number {
        grid-row: initial;
        margin-bottom: 8px
    }

    .list-procedure .item:nth-child(2n) .txt {
        grid-row: initial;
        margin-bottom: 0;
        margin-top: 17px
    }

    .list-procedure .item {
        padding-bottom: 30px
    }

    .iframe {
        width: 100%
    }

    #sticker-overlay {
        display: block
    }

    .sticker-header {
        display: block
    }

        .sticker-header .search {
            display: block
        }
}

@media(max-width:992px) {
    .slider-banner .lSAction > a {
        height: 60px
    }

    .agency {
        display: block;
        margin: 0
    }

    .maps-2 iframe {
        height: 300px
    }

    .lst-agency {
        height: 450px
    }

    .main-prd {
        padding: 25px 0
    }

    .about-us .item h2 {
        font-size: 18px
    }

    .sub-menu {
        opacity: 1;
        overflow: hidden;
        visibility: visible;
        display: none;
        position: initial;
        transform: translate(0);
        background: #555
    }

        .sub-menu ul li a {
            color: #fff;
            font-size: 14px
        }

        .sub-menu .item {
            margin: 10px 0;
            padding: 0
        }

            .sub-menu .item h3 {
                font-size: 16px;
                color: #007bff
            }

    .about-us .item {
        margin-bottom: 15px;
        overflow: hidden
    }

    .lst-about .desc .item {
        display: block;
        margin: 0
    }

        .lst-about .desc .item > .img {
            margin: 15px 0
        }

    .about-us .item img {
        display: block;
        margin: 0 auto
    }

    .about-us {
        padding: 25px 0
    }

    .lst-prd-similar {
        padding: 25px
    }

        .lst-prd-similar .item {
            margin-bottom: 0
        }

    .lst-about {
        padding: 0 0 20px
    }

    .prd-hot {
        padding: 25px 0
    }

    .grid-prd-2 .item {
        padding: 10px
    }

        .grid-prd-2 .item .txt {
            width: 90%
        }

        .grid-prd-2 .item .img {
            height: 180px
        }

    .tit-h2 h1, .tit-h2 h2 {
        margin-bottom: 15px;
        font-size: 22px
    }

    .grid-news .item .img {
        height: 150px
    }

    .grid-news .item h3 {
        font-size: 14px;
        line-height: 20px;
        max-height: 60px
    }

    .grid-news .item .txt {
        padding: 10px 0 0
    }

    .news-hot-id {
        padding: 25px 0
    }

    .tit-detail h1 {
        font-size: 18px
    }

    #sticker .main-menu > li {
        position: relative
    }

    #sticker-wrapper::-webkit-scrollbar, .sub-menu::-webkit-scrollbar {
        width: 6px;
        height: 6px
    }

    .prd-detail {
        display: block
    }

    .cart-mobile {
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 70px
    }

        .cart-mobile a {
            color: #fff;
            font-size: 25px
        }

        .cart-mobile span {
            width: 15px;
            height: 15px;
            background: #ffbc08;
            display: block;
            position: absolute;
            top: 2px;
            right: -5px;
            text-align: center;
            line-height: 16px;
            border-radius: 50%;
            font-size: 12px
        }

    .lang ul {
        left: 0;
        right: initial
    }

    .slider-banner .info .text p:first-child {
        font-size: 16px
    }

    .slider-banner .info .text p:last-child {
        font-size: 14px
    }

    .search-mobile {
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 170px
    }

    .lang {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 106px;
        color: #fff;
        line-height: 60px
    }

        .lang span img {
            width: 25px
        }

    .lang-mobile {
        display: block
    }

    .icon-sr {
        color: #fff;
        line-height: 60px;
        font-size: 18px
    }

    .search .form-search {
        top: 50%;
        transform: translateY(-50%)
    }

    .copy-right .item {
        display: block;
        text-align: center
    }

        .copy-right .item ul {
            margin: 0 auto 10px
        }

    .footer .item {
        width: 50%
    }

    .header-top {
        display: none
    }

    #logo {
        width: 90px;
        height: 60px;
        padding: 5px 0
    }

    .btn {
        padding: 0;
        margin: 10px 0;
        width: 100%;
        float: initial;
        width: 100%
    }

        .btn .ic a:before {
            left: 18px
        }

        .btn .ic.phone a {
            padding-left: 20px
        }

    .lst-prd.lst-prd-2 {
        grid-template-columns: calc(100%/3) calc(100%/3) calc(100%/3)
    }

        .lst-prd.lst-prd-2 .item {
            padding: 20px
        }

        .lst-prd.lst-prd-2 .txt {
            padding-top: 0
        }

    .prd-detail .col-mg {
        margin: 15px;
        display: block
    }

    .img-gallery .lSSlideOuter .lSPager.lSGallery li {
        height: 62px
    }

    .lst-news .grid-news .item:first-child .txt p {
        max-height: 72px
    }

    .lst-prd .item {
        padding: 20px
    }
}

@media(max-width:767px) {
    .lst-about .desc .item .img, .lst-about .desc .item .txt {
        width: 100%;
        margin: 10px 0
    }

    .btn .ic a {
        font-size: 14px !important;
        text-align: right;
        padding-right: 20px
    }

    .price span {
        font-size: 18px;
        display: block
    }

    .price {
        display: block;
        padding: 10px 0
    }

    .parameter h1 {
        font-size: 20px
    }

    .prd-detail {
        padding-bottom: 0
    }

    .lst-news .grid-news .item:first-child .img, .lst-news .grid-news .item:first-child .txt {
        width: 100%;
        float: initial;
        padding: 10px
    }

    .lst-news .grid-news .item:first-child {
        grid-column: 1/3
    }

    .lst-prd, .lst-prd.lst-prd-2 {
        grid-template-columns: 50% 50%
    }

    .contact {
        padding-bottom: 30px
    }

    .lst-contact {
        margin-bottom: 15px
    }

    .lst-form form {
        display: block
    }

    #calltrap-btn {
        width: 45px;
        height: 45px
    }

    #calltrap-ico:before {
        background-size: 80%
    }

    #fixed-left ul li a {
        width: 40px;
        height: 40px
    }

    .grid-prd {
        margin: 0 -6px;
        display: block
    }

    .contact .grid-prd {
        display: block
    }

    .grid-prd .item {
        margin: 6px
    }

    .about-us .item ul li {
        margin-bottom: 14px
    }

    footer {
        padding: 15px 0 0
    }

    .footer .item {
        width: 50%;
        margin-bottom: 10px
    }

    .grid-prd-2 {
        margin: 0 -5px
    }

        .grid-prd-2 .item {
            margin: 5px;
            width: calc(100%/3 - 10px)
        }

            .grid-prd-2 .item:nth-child(4), .grid-prd-2 .item:nth-child(5) {
                width: calc(50% - 10px)
            }

            .grid-prd-2 .item .img {
                grid-row: 1/2 !important;
                grid-column: 1/3 !important
            }

            .grid-prd-2 .item .txt {
                grid-row: 2/3 !important;
                grid-column: 1/3 !important;
                padding: 0 !important;
                width: 100% !important
            }

                .grid-prd-2 .item .txt h3 {
                    font-size: 14px;
                    line-height: 20px
                }

                .grid-prd-2 .item .txt span {
                    font-size: 12px
                }

    .grid-news {
        grid-template-columns: 50% 50%
    }

    .tab-prd .nav-tabs a {
        font-size: 15px
    }

    .tit-h2 h1, .tit-h2 h2 {
        font-size: 18px
    }

    .slider-banner .info {
        right: 0;
        bottom: 10px
    }

        .slider-banner .info .text p:first-child {
            font-size: 15px
        }

        .slider-banner .info .text p:last-child {
            font-size: 10px
        }

    .slider-banner .lSAction > a {
        bottom: 10px
    }

        .slider-banner .lSAction > a.lSPrev {
            height: 54px
        }

        .slider-banner .lSAction > a.lSNext {
            bottom: 38px;
            height: 29px
        }

    #logo a {
        display: block;
        height: 100%
    }

    #touch-menu {
        top: 15px
    }

    .slider-banner .info .text {
        padding: 10px;
        width: 100%;
        left: 0
    }

    .special-offer p {
        font-size: 14px
    }

    #logo img {
        height: 100%
    }

    .grid-prd-2 .item .img {
        height: 150px
    }

    .selecr-maps .form-group select {
        font-size: 12px
    }

    .selecr-maps .form-group:before {
        font-size: 20px
    }

    .lst-prd .item h3 {
        font-size: 15px;
        margin-bottom: 15px
    }

    .lst-prd .item {
        padding: 15px
    }

        .lst-prd .item .txt {
            width: 100%
        }

    .details {
        display: block
    }

    .parameter {
        padding: 0
    }

    .slider-banner .info {
        left: 30%;
        width: auto
    }

    .slider-banner .lSAction > a.lSPrev {
        left: 30%
    }

    .news-hot {
        margin-top: 10px
    }

    .all-rght {
        display: block
    }

    .box-detail-cart {
        display: block
    }

    .cus-inf-v1 > .box span {
        font-size: 12px
    }

    .box-calculator-pr {
        padding: 0
    }

    .cus-inf-v1 > .box .w2b {
        width: 100%
    }

    .cus-inf-v1 > .box .w2a {
        width: 100%
    }

    .table-cart-product.srcoll {
        overflow-x: auto
    }

    table.table_adc {
        width: 700px
    }

    .contents .nav-tabs .nav-link {
        font-size: 16px
    }

    .selecr-maps .form-group {
        width: calc(100%/2 - 14px)
    }

    .grid-news .item .img {
        height: auto
    }

    .wrapper-content p iframe {
        width: 100%
    }
}

@media(max-width:448px) {
    .grid-news .item {
        margin-bottom: 20px
    }

    .parameter h1 {
        font-size: 16px
    }

    .contents .nav-tabs .nav-link {
        font-size: 12px
    }

    .search .form-search {
        top: 60px;
        right: 0;
        position: fixed;
        left: 0;
        transform: translateY(0)
    }

    .grid-news {
        display: block
    }

    .tool-right ul li {
        font-size: 13px
    }

    .lst-prd, .lst-prd.lst-prd-2 {
        display: block;
        margin: 15px -11px 0
    }

    .map iframe {
        height: 300px
    }

    .tit-detail h1 {
        font-size: 16px;
        line-height: 24px
    }

    .about-us .item img {
        width: 100%
    }

    .about-us .item ul li p {
        font-size: 14px;
        margin-bottom: 5px;
        line-height: 20px
    }

    .about-us .item ul li span {
        font-size: 12px;
        line-height: 16px
    }

    .about-us .item h2 {
        font-size: 16px;
        margin-bottom: 10px
    }

    .tit-h2 h1, .tit-h2 h2 {
        font-size: 15px
    }

    .grid-prd-2 .item {
        width: calc(50% - 10px)
    }

        .grid-prd-2 .item:nth-child(5) {
            width: 100%
        }

    .tab-prd .nav-tabs a {
        font-size: 11px;
        font-weight: 600;
        margin: 0 5px
    }

    .slider-banner .info .text p:first-child {
        font-size: 12px
    }

    .footer .item {
        width: 100%
    }

    .lst-news {
        margin: 0
    }

    .grid-news .item p {
        max-height: 72px !important;
        overflow: hidden
    }

    .btn .ic a:before {
        left: 20px
    }
}

@media(max-width:375px) {
    .slider-banner .info .text p:first-child {
        font-size: 10px
    }

    .slider-banner .info .text p:last-child {
        font-size: 8px
    }

    .slider-banner .lSAction > a.lSPrev {
        height: 45px;
        width: 15px
    }

    .slider-banner .info .text {
        border-left: 15px solid #ffcb08
    }
}
