@font-face {
    font-family: FontAwesomeBrands;
    font-style: normal;
    font-weight: 400;
    src: url(fontawesome/webfonts/fa-brands-400.eot);
    src: url(fontawesome/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(../webfonts/fa-brands-400.woff2) format("woff2"),url(../webfonts/fa-brands-400.woff) format("woff"),url(../webfonts/fa-brands-400.ttf) format("truetype"),url(../webfonts/fa-brands-400.svg#fontawesome) format("svg")
}

@font-face {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: 900;
    src: url(fontawesome/webfonts/fa-solid-900.eot);
    src: url(fontawesome/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(fontawesome/webfonts/fa-solid-900.woff) format("woff"),url(fontawesome/webfonts/fa-solid-900.ttf) format("truetype"),url(fontawesome/webfonts/fa-solid-900.svg#fontawesome) format("svg")
}

@font-face {
    font-family: FontAwesomeRegular;
    font-style: normal;
    font-weight: 400;
    src: url(fontawesome/webfonts/fa-regular-400.eot);
    src: url(fontawesome/webfonts/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(fontawesome/webfonts/fa-regular-400.woff) format("woff"),url(fontawesome/webfonts/fa-regular-400.ttf) format("truetype"),url(fontawesome/webfonts/fa-regular-400.svg#fontawesome) format("svg")
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    line-height: 1.4 !important;
}
a {
    outline: 0 !important;
    text-decoration: none
}

.temp_home .left_teamp {
    display: flex;
    flex-wrap: wrap
}

body, html {
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
    font-family: 'Montserrat',Roboto, sans-serif;
    color: #333;
    line-height: 1.8;
    font-size: 15px;
}

header {
    background: #fff;
    position: fixed;    
    top: 0;
    left: 0;
    right: 0;
    padding: 0 100px;
    z-index: 99;
    color: #eee;
    display: flex !important;
    justify-content: space-between;
    box-shadow: 1px 1px 5px 2px #d4cfcf
}

.header__right {
    display: flex;
    flex-direction: column;
    margin-top: 8px
}

.header__right-top > div a {
    font-size: 13px;
    font-weight: 400;
    text-transform: capitalize;
    border-right: 1px solid #ccc;
    line-height: 1;
    padding: 0;
    margin: 0;
    height: auto;
    padding-right: 15px;
    margin-right: 15px;
    text-decoration: none;
    color: #fff
}

    .header__right-top > div a:hover {
        color: #ff7d20
    }

    .header__right-top > div a:last-child {
        border-right: none
    }

.header__right-bottom {
    display: flex
}

.ul-menu-new {
    float: right;
    margin-top: 10px;
    margin-right: 15px;
    margin-bottom: 10px
}

    .ul-menu-new > li {
        display: inline-block;
        vertical-align: text-top;
        position: relative
    }

        .ul-menu-new > li > a {
            display: block;
            height: 35px;
            line-height: 35px;
            position: relative;
            z-index: 5;
            color: #fff;
            padding: 0 8px;
            text-decoration: none
        }

    .ul-menu-new li ul {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 99999;
        margin-top: 15px;
        border-bottom: solid 4px #fc6621;
        border-right: solid 1px #fc6621;
        box-shadow: 2px 1px 2px rgba(0,0,0,.3);
        visibility: hidden;
        opacity: 0;
        border-left: solid 1px #fc6621;
        border-top: solid 1px #fc6621
    }

.menu-show-left-menu {
    display: none
}

@media (min-width:576px) {
    .modal-dialog {
        max-width: fit-content !important
    }
}

@media only screen and (max-width:768px) {
    .menu-show-left-menu {
        display: inline-block;
        width: 100%;
        height: 100%;
        text-align: left;
        padding: 35px 20px 20px 20px;
        vertical-align: middle;
        line-height: 20px
    }

        .menu-show-left-menu span.text {
            margin-left: 15px;
            text-transform: uppercase;
            color: #d3531a
        }

    #nav-icon4 {
        width: 22px;
        height: 18px;
        position: relative;
        margin: 0 auto;
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        cursor: pointer;
        padding: 0
    }

    .show-left-menu {
        line-height: 20px text-align: right;
        vertical-align: middle;
        display: inline-block;
        float: left
    }

    #nav-icon4 span {
        display: block;
        position: absolute;
        height: 3px;
        width: 22px;
        background: #d3531a;
        border-radius: 9px;
        opacity: 1;
        left: 0;
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out
    }

        #nav-icon4 span:nth-child(1) {
            top: 0;
            -webkit-transform-origin: left center;
            -moz-transform-origin: left center;
            -o-transform-origin: left center;
            transform-origin: left center
        }

        #nav-icon4 span:nth-child(2) {
            top: 7px;
            -webkit-transform-origin: left center;
            -moz-transform-origin: left center;
            -o-transform-origin: left center;
            transform-origin: left center
        }

        #nav-icon4 span:nth-child(3) {
            top: 14px;
            -webkit-transform-origin: left center;
            -moz-transform-origin: left center;
            -o-transform-origin: left center;
            transform-origin: left center
        }

    .show-left-menu span {
        font-size: 20px;
        font-weight: 300;
        text-transform: capitalize;
        margin-right: 1rem;
        vertical-align: middle;
        line-height: 1;
        color: #ef3c26
    }

    .mau-web-content .kho-sidebar {
        width: 0;
        display: none;
        border-top: 1px solid #eee;
        margin-top: 3rem;
        transition: all .6s ease
    }

        .mau-web-content .kho-sidebar.active {
            width: 100%;
            display: block;
            transition: all .6s ease
        }
}

.ul-menu-new li:hover li:hover ul, .ul-menu-new li:hover ul {
    margin-top: 0;
    margin-left: 0;
    visibility: visible;
    opacity: 1;
    background: #fff;
    padding: 10px 0
}

#_menu li:hover li ul {
    top: 0;
    left: 100%;
    opacity: 0;
    visibility: hidden;
    margin-left: 20px
}

.mau-web-detail__title {
    margin-top: 130px;
    text-transform: uppercase;
    font-size: 32px;
    color: #004f83
}

.mau-web-detail__h2 {
    line-height: 18px;
    text-transform: uppercase;
    font-size: 26px;
    color: #26608d;
    margin-top: 30px;
    margin-bottom: 20px
}

.mau-web-detail__desc {
    color: #333;
    font-size: 17px;
    font-weight: 300
}

.mau-web-detail__code {
    color: #ff7544
}

.header__right #_menu li:hover li:hover ul.ul-menu-child {
    padding-top: 0
}

#_menu li:hover li:hover ul, .header__right #_menu li:hover ul {
    margin-top: 0;
    margin-left: 0;
    visibility: visible;
    opacity: 1;
    background: #fff;
    padding: 0
}

.header__right #_menu li:hover li ul {
    top: 0;
    left: 100%;
    opacity: 0;
    visibility: hidden;
    margin-left: 20px
}

.header__right #_menu li ul li ul {
    padding: 0
}

.dv-mnmb {
    display: none
}

.header__right #_menu li ul li {
    white-space: nowrap;
    text-align: left;
    display: block;
    background: #fff;
    padding: 0 15px;
    position: relative
}

    .header__right #_menu li ul li:last-child {
        padding-bottom: 10px
    }

    .header__right #_menu li ul li:first-child {
        padding-top: 10px
    }

        .header__right #_menu li ul li:first-child a {
            border-top: none
        }

    .header__right #_menu li ul li a {
        padding: 0 15px;
        border-bottom: solid 1px #f0f0f5;
        border-top: solid 1px #fff;
        position: relative;
        color: #333;
        transition: padding .2s linear;
        -webkit-transition: padding .2s linear;
        -moz-transition: padding .2s linear;
        -o-transition: padding .2s linear;
        -ms-transition: padding .2s linear;
        text-decoration: none
    }

.header__right #_menu li a {
    display: block;
    height: 35px;
    line-height: 35px;
    position: relative;
    z-index: 5;
    color: #262661;
    font-weight: 600;
    font-size:15px !important
}

.header__right #_menu li.mau-web-btn a {
    background: #ef3c26;
    border-radius: 13px;
    color: #fff
}

.dv-timkiem {
    float: right;
    position: relative;
    margin-top: 15px;
    margin-right: 15px
}

    .dv-timkiem input {
        float: left;
        height: 29px;
        width: 160px;
        padding: 0 15px;
        border: none;
        padding-right: 30px;
        border-radius: 100px;
        color: #333;
        background: #fff;
        font-size: 12px;
        outline: 0
    }

    .dv-timkiem button {
        float: left;
        height: 29px;
        border: none;
        position: absolute;
        right: 0;
        background: 0 0;
        cursor: pointer
    }

        .dv-timkiem button img {
            width: 21px
        }

#home > a {
    display: flex !important;
    justify-content: center;
    align-items: center
}

#_menu li ul li > a:before {
    content: attr(icons);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    font-size: 18px;
    line-height: 34px;
    transition: left .2s linear;
    -webkit-transition: left .2s linear;
    -moz-transition: left .2s linear;
    -o-transition: left .2s linear;
    -ms-transition: left .2s linear
}

.header__left > a > img {
    height: 40px;
    width: auto;
}


.header__left > a {
    padding: 19px 0 0;
    margin-left: 15px;
    display: block
}

.ul-menu-new > li:hover:after {
    width: 100%
}

.ul-menu-new > li.ico_home:hover > a { /*background:url(../images/icon_menu_home_hover.png*/
    ) no-repeat center !important
}

.ul-menu-new > li.ico_home:after, .ul-menu-new > li.ico_home:hover:after, .ul-menu-new > li.mau-web-btn:after, .ul-menu-new > li.mau-web-btn:hover:after {
    display: none
}

.ul-menu-new > li:after {
    content: "";
    background: #fc6621;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    -webkit-transition: width .2s linear;
    -moz-transition: width .2s linear;
    -o-transition: width .2s linear;
    transition: width .2s linear
}

.dv-timkiem {
    float: right;
    position: relative;
    margin-top: 15px;
    margin-right: 15px
}

@keyframes slidy {
    0% {
        left: 0
    }

    20% {
        left: 0
    }

    25% {
        left: -100%
    }

    45% {
        left: -100%
    }

    50% {
        left: -200%
    }

    70% {
        left: -200%
    }

    75% {
        left: -100%
    }

    95% {
        left: -100%
    }

    100% {
        left: 0
    }
}

figure {
    margin: 0;
    background: #101010;
    font-family: Istok Web,sans-serif;
    font-weight: 100;
    margin: 0 !important
}

div#captioned-gallery {
    width: 100%;
    overflow: hidden
}

figure.slider {
    position: relative;
    width: 500%;
    font-size: 0;
    animation: 10s slidy infinite
}

    figure.slider figure {
        width: 20%;
        height: auto;
        display: inline-block;
        position: inherit
    }

    figure.slider img {
        width: 100%;
        height: auto
    }

    figure.slider figure figcaption {
        position: absolute;
        bottom: 0;
        background: 0 0;
        color: #fff;
        width: 100%;
        font-size: 20px;
        padding: 30px;
        top: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column
    }

.slider-row {
    display: inline-block;
    width: 100%;
    overflow: hidden;
    text-align: center;
    margin: 5px 0 20px 0
}

.slider-row-content.row-content {
    border: 2px solid #ea4738
}

.slider-row-content {
    display: inline-block;
    color: #fff;
    text-transform: uppercase;
    font-size: 23px
}

.slider-row-1 {
    display: flex;
    justify-content: center
}

.row-content-text {
    float: left;
    padding: 10.5px 10px
}

.slider-content {
    position: absolute;
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0;
    text-align: center
}

.section1 .slider-row-content img {
    float: none;
    margin: 0 auto;
    display: table;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
    margin: 0;
    padding: 0
}

.slider-title {
    font-size: 2.5rem !important;
    line-height: 1.6;
    font-weight: 400;
    color: #000;
    margin: 0
}

.banner-with-text {
    position: relative
}

.banner-with-text-wrapper {
    position: absolute;
    top: 50%;
    left: 50%
}

.tinhnang_home_box {
    background-size: cover;
    padding-top: 40px;
}

.pagewrap {
    position: relative;
    width: 1200px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.load_padding, .showText, .tinhnang_home {
    padding: 0 15px
}

.title_home2_id h2 {
    font-size: 25px;
    font-weight: 700;
    color: #fc6621;
    text-transform: uppercase;
    line-height: 35px;
    border-bottom: double #d6d6d6 4px;
    width: 70%;
    padding-bottom: 5px;
    margin-bottom: 10px;
    margin: auto
}

.tinhnang_home ul h3:hover {
    background: #5abb49;
    color: #fff
}

.title_home2_id h3 {
    font-size: 27px;
    font-weight: 400;
    color: #fff;
    text-transform: none;
    line-height: 40px
}

.tinhnang_home li {
    float: left;
    list-style: none
}

.tinhnang_home ul {
    float: right;
    width: 610px
}

    .tinhnang_home ul h2 {
        background: url(../../../../web30s.vn/images/icon-done.png) center left no-repeat;
        padding-left: 45px;
        line-height: 50px;
        font-size: 18px;
        font-weight: 400;
        color: #eee
    }

    .button-main, .tinhnang_home ul h3 {
        background: #f60;
        font-size: 18px !important;
        font-weight: 400;
        color: #fff;
        border: solid #fff 1px;
        padding: 10px 30px;
        float: left;
        margin-top: 20px;
        line-height: 35px;
        outline: 1px solid #fff;
        outline-offset: 2px;
        cursor: pointer
    }

.kenit-alo-phone {
    position: fixed;
    right: 0;
    bottom: 0;
    visibility: visible;
    background-color: transparent;
    width: 110px;
    height: 110px;
    cursor: pointer;
    z-index: 9 !important
}

.kenit-alo-img-circle {
    width: 30px;
    height: 30px;
    top: 43px;
    left: 43px;
    position: absolute;
    background: rgba(30,30,30,.1) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABNmlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjarY6xSsNQFEDPi6LiUCsEcXB4kygotupgxqQtRRCs1SHJ1qShSmkSXl7VfoSjWwcXd7/AyVFwUPwC/0Bx6uAQIYODCJ7p3MPlcsGo2HWnYZRhEGvVbjrS9Xw5+8QMUwDQCbPUbrUOAOIkjvjB5ysC4HnTrjsN/sZ8mCoNTIDtbpSFICpA/0KnGsQYMIN+qkHcAaY6addAPAClXu4vQCnI/Q0oKdfzQXwAZs/1fDDmADPIfQUwdXSpAWpJOlJnvVMtq5ZlSbubBJE8HmU6GmRyPw4TlSaqo6MukP8HwGK+2G46cq1qWXvr/DOu58vc3o8QgFh6LFpBOFTn3yqMnd/n4sZ4GQ5vYXpStN0ruNmAheuirVahvAX34y/Axk/96FpPYgAAACBjSFJNAAB6JQAAgIMAAPn/AACA6AAAUggAARVYAAA6lwAAF2/XWh+QAAAB/ElEQVR42uya7W3CMBCG31QM4A1aNggTlG6QbpBMkHYC1AloJ4BOABuEDcgGtBOETnD9c1ERCH/lwxeaV8oPFGP86Hy+DxMREW5Bd7gRjSDSNGn4/RiAOvm8C0ZCRD5PSkQVXSr1nK/xE3mcWimA1ZV3JYBZCIO4giQANoYxMwYS6+xKY4lT5dJPreWZY+uspqSCKPYN27GJVBDXheVSQe494ksiEWTuMXcu1dld9SARxDX1OAJ4lgjy4zDnFsC076A4adEiRwAZg4hOUSpNoCsBPDGM+HqkNGynYBCuILuWj+dgWysGsNe8nwL4GsrW0m2fxZBq9rW0rNcX5MOQ9eZD8JFahcG5g/iKT671alGAYQggpYWvpEPYWrU/HDTOfeRIX0q2SL3QN4tGhZJukVobQyXYWw7WtLDKDIuM+ZSzscyCE9PCy5IttCvnZNaeiGLNHKuz8ZVh/MXTVu/1xQKmIqLEAuJ0fNo3iG5B51oSkeKnsBi/4bG9gYB/lCytU5G9DryFW+3Gm+JLwU7ehbJrwTjq4DJU8bHcVbEV9dXXqqP6uqO5e2/QZRYJpqu2IUAA4B3tXvx8hgKp05QZW6dJqrLTNkB6vrRURLRwPHqtYgkC3cLWQAcDQGGKH13FER/NATzi786+BPDNjm1dMkfjn2pGkBHkf4D8DgBJDuDHx9BN+gAAAABJRU5ErkJggg==) no-repeat center center;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: .7;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    background-color: #fc6621;
    background-size: 70%
}

.kenit-alo-circle-fill {
    width: 60px;
    height: 60px;
    top: 28px;
    left: 28px;
    position: absolute;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    background-color: rgba(252,102,33,.5);
    opacity: .75 !important
}

.kenit-alo-circle {
    width: 90px;
    height: 90px;
    top: 12px;
    left: 12px;
    position: absolute;
    background-color: transparent;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid rgba(30,30,30,.4);
    opacity: .1;
    border-color: #fc6621;
    opacity: .5
}

.kenit-alo-phone span {
    display: block;
    background: #30a4cc;
    color: #fff;
    padding: 5px;
    text-align: center;
    position: absolute;
    left: 5px;
    width: 110px;
    top: -15px;
    border-radius: 4px 4px
}

    .kenit-alo-phone span:before {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 10px 0 10px;
        border-color: #30a4cc transparent transparent transparent;
        position: absolute;
        top: 28px;
        left: 0;
        right: 0;
        text-align: center;
        margin: 0 auto
    }

img {
    max-width: 100%;
    height: auto
}

.header__banner {
    background-color: #333;
    background-image: url(../../../../66.media.tumblr.com/8b4969985e84b2aa1ac8d3449475f1af/tumblr_n3iftvUesn1snvqtdo1_1280.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 300px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.header__logo {
    margin-left: 50px;
    max-width: 300px;
    margin-top: -135px
}

header h1 {
    background-color: rgba(18,72,120,.8);
    color: #fff;
    padding: 0 1rem;
    position: absolute;
    top: 2rem;
    left: 2rem
}

.fixed-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}

.visible-title {
    visibility: visible
}

.menu-sub, nav ul {
    list-style-type: none;
    margin: 0 2% auto 0;
    padding-left: 0;
    max-width: 100%
}

.menu-sub {
    list-style-type: none;
    margin: 0 2% auto 0;
    padding-left: 0;
    text-align: right;
    max-width: 100%;
    display: flex;
    margin-top: -120px;
    margin-right: 25px
}

    .menu-sub a {
        display: block;
        margin: 0 10px;
        text-align: center;
        text-decoration: none;
        color: #fff
    }

.logo__scrolling {
    max-width: 148px
}

nav ul li {
    display: inline-block;
    line-height: 60px;
    margin-left: 10px
}

    nav ul li a {
        text-decoration: none;
        color: #fff
    }

main {
    flex: 1
}

footer {
    box-shadow: 1px 1px 5px 2px #d4cfcf;
    color: #d2d2d2;
    padding-top: 25px;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100%;
    background-image: radial-gradient(circle,#f2f2f2,#e8e8e8,#dfdfdf,#d5d5d5,#ccc,#bebebe,#b1b1b1,#a4a4a4,#909090,#7c7c7c,#696969,#565656)
}

    footer > ul {
        width: 100%;
        display: -webkit-box
    }

    footer ul {
        list-style-type: none;
        margin: 0;
        padding: 0
    }

.footer_link ul li {
    list-style-type: none;
    padding: 0;
    margin: 0;
    float: left;
    width: 18%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box
}

.li_foot_new_v1 {
    width: calc(100% / 3)
}

.footer__title {
    color: #262661;
    font-family: Roboto,sans-serif;
    font-weight: 500;
    font-size: 18px;
    margin-bottom: 12px
}

footer li a {
    font-family: 'Montserrat',Roboto, sans-serif;
    text-shadow: none;
    font-size: 14px;
    font-weight: 600;
    color: #262661;
    line-height: 1.6;
    text-decoration: none
}

.uabb-module-content.uabb-separator-parent {
    margin-bottom: 20px
}

.uabb-separator-parent {
    line-height: 0;
    text-align: left
}

.uabb-module-content.uabb-separator-parent .uabb-separator {
    width: 28%
}

.uabb-separator {
    border-top: 2px solid #2f2e2e;
    width: 50%;
    display: inline-block
}

#tietkiemchiphis b {
    font-weight: 500;
    color: rgba(0,0,0,.5)
}

footer li a:hover {
    color: #00bcd4
}

footer li {
    padding: 2px 0
}

.main-page__title {
    font-size: 18px;
    color: red;
    text-transform: uppercase;
    border-bottom: 2px solid #000;
    padding-bottom: 20px;
    text-align: center
}

.why-us {
    display: flex;
    margin-top: 50px;
    margin-bottom: 50px
}

.why-us__col {
    width: calc(100% / 3);
    margin: 0 20px
}

.clear, .clr {
    clear: both
}

.temp_home_box {
    padding: 50px 0;
    background: #fff
}

ul {
    padding: 0
}

.section8 {
    text-align: center;
    color: #fff;
    padding: 50px 0
}

.section8 {
    position: relative;
    background-image: url(../images/bg2.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: auto;
    background-attachment: fixed
}

    .section8 .price-table-title {
        color: #fff;
        font-size: 25px;
        line-height: 1.5;
        padding-bottom: 0;
        font-weight: 600;
        margin-bottom: 0;
        margin-top: 30px
    }

    .section8 p {
        text-align: left;
        font-weight: 300;
        font-size: 15px;
        line-height: 24px;
        padding: 0;
        margin: 5px 0
    }

    .section8 .seo {
        margin-top: 30px
    }

    .section8 img {
        height: auto;
        max-width: 100%;
        max-height: 100%;
        vertical-align: middle;
        margin: 0;
        padding: 0
    }

.message-item .message-inner {
    position: relative;
    text-align: left;
    margin-left: 30px;
    border-bottom: 1px solid;
    padding-bottom: 18px
}

.message-item .message-head {
    margin-bottom: 5px;
    padding-bottom: 5px
}

    .message-item .message-head .user-detail {
        overflow: hidden
    }

        .message-item .message-head .user-detail h5 {
            font-size: 18px;
            font-weight: 700;
            margin: 0
        }

.qa-message-content {
    font-size: 16px
}

.message-item#m5:after {
    content: url(../../../../img.icons8.com/color/50/000000/1-circle.png) !important;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(0,0,0,.1);
    height: 15px;
    left: -50px;
    position: absolute;
    top: 0;
    width: 15px
}

.message-item#m4:after {
    content: url(../../../../img.icons8.com/color/50/000000/2-circle.png) !important;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(0,0,0,.1);
    height: 15px;
    left: -50px;
    position: absolute;
    top: 0;
    width: 15px
}

.message-item#m3:after {
    content: url(../../../../img.icons8.com/color/50/000000/3-circle.png) !important;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(0,0,0,.1);
    height: 15px;
    left: -50px;
    position: absolute;
    top: 0;
    width: 15px
}

.message-item#m2:after {
    content: url(../../../../img.icons8.com/color/50/000000/4-circle.png) !important;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(0,0,0,.1);
    height: 15px;
    left: -50px;
    position: absolute;
    top: 0;
    width: 15px
}

.message-item#m1:after {
    content: url(../../../../img.icons8.com/color/50/000000/5-circle.png) !important;
    border-radius: 50%;
    box-shadow: 0 0 5px rgba(0,0,0,.1);
    height: 15px;
    left: -50px;
    position: absolute;
    top: 0;
    width: 15px
}

#wallmessages {
    padding-top: 50px
}

.message-item {
    margin-bottom: 25px;
    margin-left: 40px;
    position: relative
}

.title_home_id ul h2 {
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    color: #262661;
    text-transform: uppercase;
    line-height: 35px;
    width: 50%;
    padding-bottom: 5px;
    margin-bottom: 10px;
    margin: auto
}

.temp_home h3 {
    padding: 15px 20px;
    width: 24%;
    margin-top: 20px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    background: #fc6621;
    font-weight: 400;
    text-align: center;
    outline: 1px solid #2ea5cc;
    outline-offset: 2px;
    margin: auto;
    margin-top: 30px
}

    .temp_home h3:hover {
        background: #0e6985;
        outline: 1px solid #dc1a5b;
        outline-offset: 2px
    }

.title_home_id ul h3 {
    text-align: center;
    font-size: 20px;
    font-weight: 400;
    color: #666;
    text-transform: none;
    line-height: 35px
}

.temp_home ul {
    float: left;
    width: calc(100% / 4 - 36px);
    margin: 14px;
    list-style: none;
    border: solid #eee 1px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

    .temp_home ul li, .temp_home ul li img {
        width: 100%;
        line-height: 0
    }

    .temp_home ul h4 {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .temp_home ul h2 {
        float: right;
        padding: 20px;
        font-size: 18px;
        color: #999;
        font-weight: 400
    }

    .temp_home ul h1, .temp_home ul h4 {
        float: left;
        font-size: 20px;
        color: #333;
        font-weight: 400;
        padding: 20px;
        margin: 0
    }

        .temp_home ul h4 p {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            font-size: 14px;
            color: #989898;
            margin: 0
        }

    .khoungdung_id ul:hover, .temp_home ul:hover {
        -moz-box-shadow: 0 0 8px rgba(0,0,0,.5);
        -webkit-box-shadow: 0 0 8px rgba(0,0,0,.5);
        box-shadow: 0 0 8px rgba(0,0,0,.5)
    }

        .temp_home ul:hover h1, .temp_home ul:hover h4 {
            color: #dc1a5b
        }

.desktop {
    display: block
}

.menu_left_ungdung {
    float: left;
    width: 270px;
    margin-left: 15px
}

    .menu_left_ungdung h2 {
        color: #dc1a5b;
        text-transform: uppercase;
        font-size: 20px;
        line-height: 35px;
        font-weight: 400;
        margin-bottom: 15px
    }

    .menu_left_ungdung ul {
        border-bottom: solid #ccc 1px;
        margin-bottom: 15px;
        padding-bottom: 15px
    }

ul {
    padding: 0
}

.menu_left_ungdung ul li {
    line-height: 40px;
    list-style: none;
    font-size: 16px;
    font-weight: 400
}

    .menu_left_ungdung ul li a {
        color: #666
    }

        .menu_left_ungdung ul li a:hover {
            color: #dc1a5b;
            text-decoration: none
        }

.mobile {
    display: none
}

.sl_mobile {
    width: 100%;
    padding: 6px;
    background: #dc1a5b;
    color: #fff;
    border: none;
    border-radius: 3px
}

    .sl_mobile option {
        padding: 3px 0
    }

.right_khoungdung {
    width: 100%;
    float: right
}

.khoungdung_id {
    margin-bottom: 20px
}

.link_page h2 {
    margin-right: 15px;
    margin-left: 15px;
    color: #666;
    text-transform: uppercase;
    font-size: 25px;
    line-height: 35px;
    font-weight: 400;
    margin-bottom: 20px
}

.khoungdung_id ul {
    float: left;
    margin-left: 15px;
    padding: 10px;
    border: solid #ccc 1px;
    width: calc(100% / 4 - 19px);
    margin-bottom: 20px;
    list-style: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

    .khoungdung_id ul li, .khoungdung_id ul li img {
        width: 100%;
        height: 259px;
        line-height: 0
    }

    .khoungdung_id ul h2 {
        font-size: 14px;
        font-weight: 700;
        color: #666;
        text-transform: uppercase;
        padding: 10px 0;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .khoungdung_id ul h3 {
        font-size: 17px;
        font-weight: 700;
        color: #f34c49;
        text-transform: uppercase;
        padding-bottom: 10px
    }

.dv-ndungdung {
    padding: 0;
    margin: 0;
    color: #666;
    height: 75px;
    overflow: hidden
}

.dv-gd .dv-gd-goiwebshop-1, .dv-gd .dv-gd-goiwebshop-1:hover {
    background: #fff
}

.col-right-kud-detai .dv-li .gia {
    color: red !important;
    font-weight: 700
}

.col-right-kud-detai .dv-li p {
    display: inline-block;
    padding: 0;
    width: 90px;
    margin: 0
}

.dv-khud-detail a:hover, .dv-thanhtoan a:hover {
    text-decoration: none
}

.col-right-kud-detai .dv-li {
    border-bottom: 1px dotted #ccc;
    padding: 5px 0
}

.pricing-grid {
    width: calc(100% / 4 - 30px);
    float: left;
    margin-left: 15px;
    margin-right: 15px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    text-align: center;
    transition: .5s all;
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    -o-transition: .5s all;
    box-shadow: 0 0 8px rgba(0,0,0,.5);
    border: solid #eee 1px
}

.pricing-grid {
    width: calc(100% / 4 - 30px);
    float: left;
    margin-left: 15px;
    margin-right: 15px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    text-align: center;
    transition: .5s all;
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    -o-transition: .5s all
}

    .pricing-grid:hover {
        -webkit-transform: scale(1.04) translateY(-5px);
        z-index: 1;
        border-bottom: 0 none
    }

.dv-gd .dv-gd-goiwebshop-1 .dv-gd-cont ul li a:hover {
    background: #55d8ff;
    color: #fff
}

.dv-gd .dv-gd-goiwebshop-2 .dv-gd-cont ul li a:hover {
    background: #f9aba2;
    color: #fff
}

.dv-gd .dv-gd-goiwebshop-3 .dv-gd-cont ul li a:hover {
    background: #3ed2a8;
    color: #fff
}

.dv-gd .dv-gd-goiwebshop-1 .dv-gd-hd1 {
    background: #00a6d9
}

.dv-gd .dv-gd-hd1 {
    height: 100px;
    text-align: center;
    position: relative
}

.dv-gd .dv-gd-hd1, .dv-gd-price {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.dv-gd .dv-gd-title {
    color: #ff0;
    position: absolute;
    bottom: 40px;
    width: 100%;
    text-align: center;
    font-weight: 600;
    font-size: 23px
}

.dv-gd .dv-gd-goiwebshop-1 .dv-gd-hd2 {
    background: #0ac4fc
}

.dv-gd .dv-gd-hd2 {
    height: 95px;
    position: relative
}

.dv-gd .dv-gd-goiwebshop-1 .dv-gd-nut {
    background: #00a6d9;
    border: 1px solid #0ac4fc
}

.dv-gd .dv-gd-nut {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    width: 30px;
    height: 30px;
    top: -15px;
    position: relative;
    left: calc(50% - 15px)
}

.dv-gd .dv-gd-goiwebshop-2 .dv-gd-nut {
    background: #f24e49;
    border: 1px solid #f08275
}

.dv-gd .dv-gd-goiwebshop-3 .dv-gd-nut {
    background: #179c76;
    border: 1px solid #1bb589
}

.dv-gd .dv-gd-goiwebshop-2 .dv-gd-dk a {
    background: #f08275
}

.dv-gd .dv-gd-goiwebshop-2 .xthem a {
    background: rgba(242,78,73,.2);
    color: #f85542
}

.dv-gd .dv-gd-goiwebshop-3 .dv-gd-dk a {
    background: #1bb589
}

.dv-gd .dv-gd-goiwebshop-3 .xthem a {
    background: rgba(23,156,118,.2);
    color: #1bb589
}

.dv-gd .dv-gd-nut img {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    top: 2px;
    position: relative;
    left: 1px
}

.dv-gd .dv-gd-goiwebshop-2 .dv-gd-hd1 {
    background: #f24e49
}

.dv-gd .dv-gd-goiwebshop-2 .dv-gd-hd2 {
    background: #f08275
}

.dv-gd .dv-gd-goiwebshop-3 .dv-gd-hd1 {
    background: #179c76
}

.dv-gd .dv-gd-goiwebshop-3 .dv-gd-hd2 {
    background: #1bb589
}

.dv-gd .dv-gd-hd2 .dv-gd-imghot {
    position: absolute;
    right: 0;
    top: 0;
    margin-top: -4px;
    margin-right: -4px
}

.dv-gd .dv-gd-hd2-tit1 {
    color: #fff;
    font-size: 17px;
    margin-top: -3px;
    margin-bottom: 2px
}

.dv-gd .dv-gd-hd2-tit2 {
    color: #fff;
    font-size: 17px
}

.dv-gd .dv-gd-cont ul, .dv-gd-cont ul li {
    list-style: none
}

    .dv-gd .dv-gd-cont ul li:nth-child(2n-1) {
        background: #f5f5f5
    }

.pricing-grid ul li {
    list-style: none
}

.dv-gd .dv-gd-cont ul li a {
    color: #333;
    font-size: 14px;
    padding: 6px 0;
    display: block;
    transition: all 0s;
    cursor: pointer
}

    .dv-gd .dv-gd-cont ul li a strong {
        font-weight: 600
    }

.dv-gd .dv-gd-goiwebshop-1 .dv-gd-dk a {
    background: #0ac4fc;
    cursor: pointer
}

.dv-gd .dv-gd-dk a {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    display: block;
    padding: 8px 0
}

.dv-gd .dv-gd-goiwebshop-1 .xthem a {
    background: rgba(10,196,252,.2);
    color: #0ac4fc
}

.dv-gd .xthem a {
    display: block;
    padding: 6px 0;
    margin-top: 10px;
    font-weight: 600;
    transition: all .5s
}

.requirement-first-row {
    background-color: #0071bb;
    margin-top: -32px;
    color: #fff;
    height: 400px;
    text-align: center;
    background-image: url(../images/background_city.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
}

    .requirement-first-row:before {
        position: absolute;
        content: " ";
        top: 0;
        left: 0;
        width: 100%;
        height: 367px;
        display: block;
        z-index: 0;
        background-color: rgba(0,0,0,.5)
    }

    .requirement-first-row * {
        z-index: 1
    }

    .requirement-first-row h1 {
        padding-top: 70px;
        font-size: 40px;
        line-height: 40px;
        margin-top: 33px;
        margin-bottom: 23px;
        font-weight: 300
    }

    .requirement-first-row p {
        font-size: 20px
    }

.pt-second-row_col-1 {
    margin: 50px 0 0 10px
}

    .pt-second-row_col-1 h4 {
        margin: 0;
        line-height: 30px;
        font-weight: 300;
        position: relative;
        padding-left: 40px;
        font-size: 18px
    }

    .pt-second-row_col-1 a {
        color: #000;
        text-decoration: none;
        font-weight: 300;
        font-size: 18px
    }

    .pt-second-row_col-1 h4 i {
        color: #dddbdb;
        line-height: 30px;
        width: 30px;
        height: 30px;
        position: absolute;
        top: 0;
        left: 0
    }

.text-header h1 {
    font-weight: 300;
    color: #000;
    font-size: 32px;
    line-height: 40px;
    margin-top: 33px;
    margin-bottom: 23px
}

div.wpcf7 {
    margin: 0;
    padding: 0
}

.wpcf7 input {
    height: 40px;
    width: 100%;
    background-color: #fff;
    border-color: #ddd;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    color: #4d4d4d;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
    text-align: left;
    font-size: 19px;
    font-family: inherit
}

.wpcf7 textarea {
    z-index: auto;
    position: relative;
    line-height: 27.1429px;
    font-size: 19px;
    transition: none 0s ease 0s;
    background: 0 0 !important;
    width: 100%;
    background-color: #fff;
    border-color: #ddd;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    color: #4d4d4d;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
    text-align: left;
    font-size: 19px;
    font-family: inherit
}

.wpcf7 input[type=submit] {
    cursor: pointer;
    color: #fff;
    display: inline-block;
    overflow: visible;
    margin: 5px 0;
    text-decoration: none;
    vertical-align: top;
    min-height: 2.4em;
    width: auto;
    font-weight: 400;
    line-height: 1;
    background: #0072bc;
    border: 0
}

.kho-area .kho-left.kho-sidebar ul.sb-categories, .kho-area .kho-left.kho-sidebar ul.sb-filters {
    list-style: none;
    padding: 0;
    margin: 0
}

    .kho-area .kho-left.kho-sidebar ul.sb-categories li, .kho-area .kho-left.kho-sidebar ul.sb-filters li {
        transition: text-indent .2s;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 35px;
        border-bottom: 1px solid #eee;
        border-top: 1px solid #eee
    }

        .kho-area .kho-left.kho-sidebar ul.sb-categories li a, .kho-area .kho-left.kho-sidebar ul.sb-filters li a {
            text-transform: capitalize;
            font-size: 14px;
            color: #666;
            position: relative
        }

            .kho-area .kho-left.kho-sidebar ul.sb-categories li a:before {
                content: "\f105";
                font-family: FontAwesome;
                margin-right: .8rem;
                font-size: 18px;
                vertical-align: middle;
                display: inline-block
            }

hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee
}

.kho-area .kho-left.kho-sidebar .category-list {
    color: #333;
    margin-left: 35px;
    margin-top: 16px
}

.font-medium {
    font-size: 18px;
    font-weight: 400
}

.kho-area .kho-left.kho-sidebar ul.sb-categories li.active, .kho-area .kho-left.kho-sidebar ul.sb-filters li.active {
    background-color: #ef3c26;
    color: #fff;
    font-weight: 600
}

.kho-area .kho-right {
    float: right;
    border-left: 1px solid rgba(32,48,60,.1)
}

.kho-area .kho-left.kho-sidebar ul.sb-categories li:hover, .kho-area .kho-left.kho-sidebar ul.sb-filters li:hover {
    text-indent: 6px;
    transition: text-indent .2s
}

.slider {
    margin: 0 auto
}

.slide_viewer img {
    width: 100%;
    height: 100%
}

.slide_group {
    height: 100%;
    position: relative;
    width: 100%;
    background-color: #eee
}

.slide {
    display: none;
    height: 100%;
    position: absolute;
    width: 100%
}

    .slide:first-child {
        display: block;
        height: 500px
    }

.slide_buttons {
    left: 0;
    position: absolute;
    right: 0;
    text-align: center
}

a.slide_btn {
    color: #474544;
    font-size: 42px;
    margin: 0 .175em;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out
}

.slide_btn.active, .slide_btn:hover {
    color: #428cc6;
    cursor: pointer
}

.next_btn, .previous_btn {
    cursor: pointer;
    height: 65px;
    opacity: .5;
    -webkit-transition: opacity .4s ease-in-out;
    -moz-transition: opacity .4s ease-in-out;
    -ms-transition: opacity .4s ease-in-out;
    -o-transition: opacity .4s ease-in-out;
    transition: opacity .4s ease-in-out;
    width: 65px
}

    .next_btn:hover, .previous_btn:hover {
        opacity: 1
    }

slider {
    margin: 0 auto
}

.slide_viewer {
    height: 510px;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(204,204,204,.4)
}

.slide_group {
    height: 100%;
    position: relative;
    width: 100%
}

.slide {
    display: none;
    height: 100%;
    position: absolute;
    width: 100%
}

    .slide:first-child {
        display: block;
        height: 500px
    }

.slide_buttons {
    left: 0;
    position: absolute;
    right: 0;
    text-align: center
}

a.slide_btn {
    color: #474544;
    font-size: 42px;
    margin: 0 .175em;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out
}

.slide_btn.active, .slide_btn:hover {
    color: #428cc6;
    cursor: pointer
}

.directional_nav {
    height: 0;
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    top: -119px;
    right: 42%
}

.previous_btn {
    bottom: 0;
    margin: auto;
    position: absolute;
    top: 200px;
    right: 95px
}

@-moz-document url-prefix() {
    .directional_nav {
        top: -217px
    }
}

.next_btn {
    bottom: 0;
    margin: auto;
    position: absolute;
    right: -20px;
    top: 200px
}

.next_btn, .previous_btn {
    cursor: pointer;
    height: 65px;
    opacity: .5;
    -webkit-transition: opacity .4s ease-in-out;
    -moz-transition: opacity .4s ease-in-out;
    -ms-transition: opacity .4s ease-in-out;
    -o-transition: opacity .4s ease-in-out;
    transition: opacity .4s ease-in-out;
    width: 65px;
    text-align: right
}

    .next_btn:hover, .previous_btn:hover {
        opacity: 1
    }

        .next_btn:focus polyline, .next_btn:hover polyline, .previous_btn:focus polyline, .previous_btn:hover polyline {
            stroke-width: 3
        }

@media only screen and (max-width:321px) {
    .previous_btn {
        right: 0 !important
    }

    .next_btn {
        right: 25px !important
    }
}

@media only screen and (max-width:767px) {
    .slide_viewer {
        height: 400px
    }

    #_menu li:hover li:hover ul, #_menu li:hover ul {
        visibility: hidden;
        opacity: 0
    }

    .kho-area {
        margin: 0 !important
    }

    .mau-web-content {
        margin-top: 63px !important
    }

    .pricing-grid {
        width: calc(100% - 30px);
        margin-bottom: 40px
    }

    .temp_home h3 {
        width: 285px
    }

    .previous_btn {
        left: 50px
    }

    .next_btn {
        right: 50px
    }

    .khoungdung_id ul {
        width: calc(100% - 30px) !important
    }
}

@media only screen and (max-width:767px) {
    .directional_nav {
        top: -106px;
        right: 25%
    }

    @-moz-document url-prefix() {
        .directional_nav {
            top: -210px
        }
    }

    .previous_btn {
        right: -30px
    }

    .next_btn {
        right: 40px
    }

        .next_btn svg, .previous_btn svg {
            width: 30px;
            height: 30px
        }
}

@media only screen and (max-width:1287px) {
    .dv-mnmb {
        display: block
    }

    header {
        justify-content: space-between;
        padding: 0 30px
    }

    .dv-mnmb {
        margin: 0 -5px
    }

    .dv-mnmb {
        position: relative;
        z-index: 99
    }

    .dl-menuwrapper:first-child {
        margin-right: 0;
        z-index: 9999
    }

    .dl-menuwrapper {
        width: 250px;
        float: right;
        position: absolute;
        -webkit-perspective: 1000px;
        perspective: 1000px;
        -webkit-perspective-origin: 50% 200%;
        perspective-origin: 50% 200%;
        z-index: 1000;
        margin-top: 7px;
        text-transform: capitalize;
        right: 0
    }

        .dl-menuwrapper button {
            background: #dd127e;
            border: none;
            width: 35px;
            height: 30px;
            text-indent: -900em;
            overflow: hidden;
            position: relative;
            cursor: pointer;
            outline: 0;
            border: 1px solid rgba(253,253,253,.45);
            margin: 6px;
            border-radius: 5px;
            float: right;
            right: 5px
        }

        .dl-menuwrapper .dl-menu {
            right: 0;
            margin: 0;
            position: absolute;
            min-width: 250px;
            opacity: 0;
            pointer-events: none;
            -webkit-transform: translateY(10px);
            transform: translateY(10px);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden
        }

        .dl-menuwrapper ul {
            padding: 0;
            list-style: none;
            -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d
        }

        .dl-menuwrapper button.dl-active, .dl-menuwrapper button:hover, .dl-menuwrapper ul {
            background: #dd127e
        }

        .dl-menuwrapper li {
            position: relative
        }

            .dl-menuwrapper li a {
                display: block;
                position: relative;
                padding: 6px 10px;
                font-size: 13px;
                line-height: 20px;
                font-weight: 300;
                color: #fff;
                outline: 0;
                border-top: 1px dashed rgba(255,255,255,.2);
                text-decoration: none
            }

            .dl-menuwrapper li.dl-back:after, .dl-menuwrapper li > a:not(:only-child):after {
                position: absolute;
                top: 0;
                line-height: 33px;
                speak: none;
                -webkit-font-smoothing: antialiased;
                content: ">";
                opacity: .64;
                font-size: 11px
            }

            .dl-menuwrapper li .dl-submenu {
                display: none
            }

        .dl-menuwrapper ul {
            padding: 0;
            list-style: none;
            -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d
        }

        .dl-menuwrapper li.dl-back > a {
            padding-left: 30px;
            background: rgba(0,0,0,.1)
        }

        .dl-menuwrapper li.dl-back > a {
            padding-left: 25px !important
        }

        .dl-menuwrapper button:after {
            content: '';
            position: absolute;
            width: 64%;
            height: 3px;
            background: #fff;
            top: 5px;
            left: 18%;
            box-shadow: 0 7px 0 #fff,0 14px 0 #fff
        }

        .dl-menuwrapper .dl-menu {
            right: 0;
            margin: 0;
            position: absolute;
            min-width: 250px;
            opacity: 0;
            pointer-events: none;
            -webkit-transform: translateY(10px);
            transform: translateY(10px);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden
        }

            .dl-menuwrapper .dl-menu.dl-menuopen {
                opacity: 1;
                pointer-events: auto;
                -webkit-transform: translateY(0);
                transform: translateY(0);
                margin-top: 3px
            }

        .dl-menuwrapper ul {
            padding: 0;
            list-style: none;
            -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d
        }

        .dl-menuwrapper li a {
            font-size: 14px !important;
            padding: 8px 12px !important
        }
}

@media only screen and (max-width:852px) {
    #_menu li.mau-web-btn a {
        width: 100px
    }

    header {
        flex-direction: column;
        padding: 0
    }


    .header__left {
        padding: 6px 0;
        margin-left: 0;
        position: relative;
        z-index: 999
    }

    .ul-menu-new {
        margin: 0 0 10px 0;
        width: 100%;
        text-align: center
    }

    .header__right #_menu {
        display: none
    }

    .header__right-top {
        display: none
    }

    .header__right {
        margin-top: 0
    }

    .header__left > a {
        text-align: left
    }
}

@media only screen and (max-width:1199px) {
    .pagewrap {
        width: 100%;
        padding: 0 5px;
        overflow: hidden
    }
}

@media only screen and (max-width:767px) {
    .col-text-img-mobile {
        flex-direction: column-reverse
    }

    .col-left-kud-detai, .col-right-kud-detai {
        width: 100% !important
    }

    .slider-row-content {
        font-size: 10px
    }

        .slider-row-content img {
            width: 145px
        }

    .slider-title {
        font-size: 14px !important
    }

    .slider-row-1 {
        margin-bottom: 7px
    }

    .itemlist {
        margin-bottom: 30px
    }

    .uabb-module-content.uabb-separator-parent .uabb-separator {
        width: 100%
    }

    .temp_home .left_teamp .dv_teamp_cont {
        width: 100%
    }

    .temp_home ul {
        width: 100%;
        margin: 0 0 20px
    }

    .title_home2_id > ul {
        padding: 0
    }

    .title_home2_id, .title_home_id {
        width: 98%;
        margin-bottom: 25px
    }

        .title_home2_id ul h2 {
            width: 85%;
            font-size: 25px;
            line-height: 30px;
            padding-bottom: 7px
        }

        .title_home2_id ul h3 {
            font-size: 20px
        }

    .tinhnang_home li img {
        max-width: 100%;
        height: auto;
        margin-bottom: 10px
    }

    .tinhnang_home ul {
        width: 100%;
        margin-top: 20px
    }

        .tinhnang_home ul h2 {
            padding-left: 38px;
            line-height: 25px;
            font-size: 14px;
            background-size: 25px 25px;
            margin-bottom: 7px
        }

    .tinhnang_home li {
        text-align: center;
        float: none
    }

    .tinhnang_home ul h3 {
        font-size: 13px;
        padding: 5px 0;
        width: 200px;
        text-align: center;
        float: none;
        margin: 30px auto;
        margin-bottom: 0
    }

    .header__logo {
        margin-left: 0;
        max-width: 250px
    }

    .header__banner {
        justify-content: center
    }

    .li_foot_new_v1 {
        width: 100%
    }

    footer > ul {
        display: block
    }

    nav ul li a {
        font-size: 12px
    }

    .logo__scrolling {
        display: none
    }

    .why-us {
        flex-wrap: wrap
    }

    .why-us__col {
        width: 100%;
        margin-bottom: 60px
    }

    .mauweb__items {
        width: 100% !important;
        margin-bottom: 50px
    }
}

.why-us__text {
    color: #666;
    font-size: 15px;
    text-align: center;
    padding: 0 20px;
    margin-top: 20px
}

.flex {
    display: flex
}

.col-50 {
    width: calc(100% / 2)
}

.question__section {
    margin: 0 10%;
    align-items: center;
    margin-bottom: 50px
}

.question__question {
    font-size: 18px;
    text-transform: uppercase;
    color: #000;
    margin-bottom: 25px;
    padding: 0 20px
}

.question__answer {
    line-height: 27px;
    font-size: 15px;
    color: #666;
    padding: 0 20px
}

.mauweb__wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 0 50px
}

.mauweb__items {
    width: calc(100% / 3 - 40px);
    padding: 0 20px;
    position: relative
}

    .mauweb__items:before {
        content: '';
        background: rgba(0,0,0,.28);
        display: block;
        z-index: 1;
        position: absolute;
        width: calc(100% - 40px);
        height: calc(100% - 56px);
        transition: all .6s ease;
        opacity: 0
    }

.mauweb__name {
    font-size: 18px;
    color: #333;
    line-height: 26px;
    text-transform: capitalize;
    font-weight: 400;
    text-align: center
}

.mauweb__tag {
    color: #00bcd4;
    font-size: 15px;
    line-height: 26px;
    text-align: center
}

.modal.fade.in {
    background: rgba(0,0,0,.8)
}

.modal {
    z-index: 99999 !important
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto
}

.fade.in {
    opacity: 1
}

#wpkCallNow .modal-dialog {
    width: 610px;
    height: 360px;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0 !important;
    margin: auto
}

#wpkCallNow .modal-content {
    background: url(../images/popup.png) no-repeat;
    background-position: center;
    background-size: cover;
    height: 360px;
    width: 610px;
    border: 0;
    border-radius: 15px;
    padding: 0;
    overflow: inherit
}

@media (min-width:768px) {
    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
        box-shadow: 0 5px 15px rgba(0,0,0,.5)
    }

    .title_home_id ul h2 {
        width: 80%
    }
}

.modal.show {
    display: block !important
}

.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    outline: 0
}

#wpkCallNow .modal-header .close {
    margin-top: 0;
    position: absolute;
    line-height: 20px;
    padding: 6px 12px;
    font-weight: 400;
    text-shadow: none;
    right: -35px;
    top: -35px;
    opacity: 1;
    background: rgba(0,0,0,0) url(../../../../www.chili.vn/wp-content/themes/bb-theme-child/images/icon-close-w.png) no-repeat scroll center center/70%;
    font-size: 0;
    border: none
}

#wpkCallNow #callautoform {
    padding-top: 135px;
    max-width: 460px;
    margin: 0 auto;
    text-align: center
}

    #wpkCallNow #callautoform .form-group {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        color: #fff;
        margin-bottom: 10px;
        padding-top: 0
    }

.modal-header {
    border-bottom: none !important
}

.modal-footer {
    border-top: none !important
}

#wpkCallNow #callautoform #phonenumberautocall {
    height: 40px;
    width: 290px;
    background-color: #000;
    color: #fff !important;
    border: 0;
    float: left;
    margin-right: 10px;
    border-radius: 3px;
    font-size: 15px;
    font-weight: 300;
    padding: 6px 12px;
    line-height: 1.428571429;
    color: #666;
    vertical-align: middle;
    outline: 0
}

    #wpkCallNow #callautoform #phonenumberautocall::placeholder {
        color: #fff;
        opacity: 1
    }

    #wpkCallNow #callautoform #phonenumberautocall:-ms-input-placeholder {
        color: #fff
    }

    #wpkCallNow #callautoform #phonenumberautocall::-ms-input-placeholder {
        color: #fff
    }

#wpkCallNow #callautoform #button-call {
    height: 40px;
    border: 0;
    background-color: #fc6621;
    color: #fff;
    text-transform: uppercase;
    font-size: 17px;
    line-height: 1.5;
    padding-left: 15px;
    padding-right: 15px;
    position: static;
    padding: 6px 12px;
    font-weight: 400;
    box-shadow: none;
    border-radius: 4px;
    cursor: pointer
}

#wpkCallNow #callautoform .form-group {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    color: #fff;
    margin-bottom: 10px;
    padding-top: 0
}

#wpkCallNow #callautoform .chooselocation {
    margin-right: 30px;
    padding-left: 10px
}

#wpkCallNow #callautoform .title-option3 {
    font-size: 22px;
    line-height: 1.5;
    font-weight: 300;
    display: block;
    margin-bottom: 10px
}

#wpkCallNow .modal-content .modal-footer {
    background-color: #000;
    color: #fff;
    border-top: 0;
    padding-top: 10px;
    text-align: center;
    border-radius: 0 0 15px 15px;
    display: block;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 10px
}

    #wpkCallNow .modal-content .modal-footer span {
        max-width: 460px;
        display: block;
        margin: auto;
        font-style: italic;
        font-size: 14px;
        font-weight: 300
    }

.fl-page-footer {
    border-top: 1px solid #e6e6e6;
    font-size: 12px;
    border-color: #3d3d3d;
    color: grey;
    padding-top: 20px;
    margin: 0 64px
}

.fl-row-fixed-width {
    max-width: 1140px
}

.fl-row, .fl-row-content {
    margin-left: auto;
    margin-right: auto
}

.fl-page-footer * {
    color: #262661;
    font-weight: 700
}

.pluginConnectTextDark {
    color: #7f7f7f
}

.fl-page-footer-text {
    font-size: 14px;
    padding-bottom: 20px
}

#register-trial-template {
    padding: 140px 0
}

.col-left .reg-social {
    margin-bottom: 10px
}

    .col-left .reg-simple .title, .col-left .reg-social .title, .col-right .reg-simple .title {
        margin: 0 0 15px 0;
        font-size: 18px;
        color: #333;
        line-height: 26px;
        font-weight: 400
    }

#register_info {
    position: relative;
    overflow: hidden
}

div.social-networks a {
    border-bottom: none;
    text-decoration: none
}

.theme-4 .apsl-icon-block.icon-facebook {
    background: #48629b none repeat scroll 0 0;
    border-radius: 3px;
    color: #fff;
    font-size: 13px;
    line-height: 22px;
    padding: 7px 15px;
    vertical-align: middle;
    display: inline-block
}

.theme-4 .fa.fa-facebook {
    font-size: 19px;
    padding-right: 16px;
    padding-top: 2px;
    vertical-align: top;
    display: inline-block
}

.theme-4 .apsl-icon-block.icon-google {
    background: #dc4b38 none repeat scroll 0 0;
    border-radius: 3px;
    color: #fff;
    font-size: 13px;
    line-height: 22px;
    padding: 7px 15px;
    vertical-align: top;
    display: inline-block
}

.theme-4 .apsl-icon-block {
    width: 200px !important
}

    .theme-4 .apsl-icon-block > i {
        margin-right: 10px
    }

.hidden {
    display: none !important;
    visibility: hidden !important
}

#register_info .form-group {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column
}

#register_info input {
    display: block;
    width: 100%;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #666;
    vertical-align: middle;
    background-color: #fcfcfc;
    background-image: none;
    border: 1px solid #e6e6e6;
    -moz-transition: all ease-in-out .15s;
    -webkit-transition: all ease-in-out .15s;
    transition: all ease-in-out .15s;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    outline: 0
}

.col-left .reg-simple form .form-group label {
    font-weight: 400;
    color: #686868;
    margin-bottom: 2px;
    display: inline-block;
    max-width: 100%
}

.col-left .reg-simple form .form-group input {
    height: 36px
}

.apsl-icon-block {
    margin-right: 10px
}

.apsl-icon-block {
    margin-bottom: 10px
}

.form-group.form-agree.radio.radio-danger {
    margin-bottom: 15px
}

.radio {
    padding-left: 20px
}

.checkbox, .radio {
    position: relative;
    display: block;
    margin-top: 10px
}

.col-left .reg-simple form .form-group input {
    height: 36px
}

.radio input[type=checkbox] {
    opacity: 1;
    margin-top: -6px
}

.form-agree input {
    position: absolute;
    left: 0
}

input[type=checkbox], input[type=radio] {
    margin: 4px 0 0;
    line-height: normal
}

h3.title-template {
    text-transform: uppercase;
    font-size: 36px;
    font-weight: 200;
    line-height: 1.3;
    color: #333;
    text-align: center;
    margin: .5rem 0 0 0
}

    h3.title-template a {
        font-size: 18px;
        color: #333;
        line-height: 26px;
        text-transform: capitalize;
        font-weight: 400
    }

    h3.title-template span.id-template {
        display: block;
        line-height: 0
    }

.col-left .reg-simple form .form-group label.note {
    font-style: italic;
    font-size: 13px;
    margin: 3px 0 0 0
}

.col-left .reg-simple form .form-group label {
    font-weight: 400;
    color: #686868
}

.col-left .reg-simple form .form-group label {
    color: #686868;
    margin-bottom: 2px
}

h3.title-template span.id-template a {
    font-size: 15px;
    color: #ef3c26
}

button.btn-register-trial {
    display: inline-block;
    border: 1px solid #ef3c26;
    height: 42px;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    padding: 3px 25px 3px;
    border-radius: 50px;
    color: #fff;
    text-transform: uppercase;
    transition: all .4s ease;
    font-size: 14px;
    background: #ef3c26
}

a.btn-back {
    border: 1px solid #1c1c1c !important;
    height: 42px;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    padding: 3px 20px 3px !important;
    border-radius: 50px;
    color: #fff;
    text-transform: uppercase;
    transition: all .4s ease;
    font-size: 14px;
    background: #1c1c1c;
    margin-left: 1rem;
    line-height: 35px
}

#header #logo h1.logo a img {
    height: 62px;
    margin-top: -13px
}

.scroll-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    right: 22px;
    bottom: 104px;
    box-shadow: 0 0 10px rgba(232,98,86,.05);
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background-color: rgba(252,102,33,.5);
    opacity: .75 !important;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .3s 0s,visibility 0s .3s;
    -moz-transition: opacity .3s 0s,visibility 0s .3s;
    transition: opacity .3s 0s,visibility 0s .3s;
    z-index: 9
}

    .scroll-top:after, .scroll-top:before {
        content: "";
        display: block;
        position: absolute;
        height: 2px;
        width: 30%;
        background: #fff;
        top: 50%;
        left: 50%
    }

    .scroll-top:before {
        transform: rotate(45deg);
        margin-left: calc(-15% + 10%)
    }

    .scroll-top:after {
        transform: rotate(-45deg);
        margin-left: calc(-15% + -10%)
    }

    .no-touch .scroll-top:hover, .scroll-top.fade-out, .scroll-top.is-visible {
        -webkit-transition: opacity .3s 0s,visibility 0s 0s;
        -moz-transition: opacity .3s 0s,visibility 0s 0s;
        transition: opacity .3s 0s,visibility 0s 0s
    }

    .scroll-top.is-visible {
        visibility: visible;
        opacity: 1
    }

    .scroll-top.fade-out {
        opacity: .5
    }

.no-touch .scroll-top:hover {
    background-color: #e86256;
    opacity: 1
}

.scroll-top {
    height: 40px;
    width: 40px;
    right: 33px;
    bottom: 104px
}

#tietkiemchiphis .tiet-kiem-img {
    transition: .5s all;
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    -o-transition: .5s all;
    width: 200px;
    margin: auto
}

#tietkiemchiphis .row:hover .tiet-kiem-img {
    -webkit-transform: scale(1.04) translateY(-5px)
}

#tietkiemchiphis .text-left {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.temp_home ul .button-img {
    opacity: 1;
    transition: all .6s ease;
    padding: 20px 0 15px 0
}

.temp_home .button-img a.black {
    background: #000
}

.temp_home .dv_teamp_cont > ul {
    position: relative;
    float: none;
    width: 100%;
    display: flex;
    flex-direction: column
}

@media only screen and (max-width:767px) {
    #wpkCallNow .modal-header .close {
        right: 10px
    }

    #wpkCallNow .modal-dialog {
        width: 310px;
        height: 460px;
        top: 53%;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        margin-top: 0 !important
    }

    #wpkCallNow .modal-content {
        background: url(../images/popup.png) no-repeat;
        width: 310px;
        height: 460px
    }

        #wpkCallNow .modal-content .modal-body {
            padding-top: 80px;
            padding-left: 20px !important;
            padding-right: 20px !important
        }

        #wpkCallNow .modal-content .modal-footer {
            display: none
        }

    #wpkCallNow #callautoform {
        padding-top: 115px
    }

        #wpkCallNow #callautoform .title-option3 {
            font-size: 22px;
            line-height: 1.5;
            font-weight: 300;
            display: block;
            margin-bottom: 10px
        }

        #wpkCallNow #callautoform .title-option3 {
            font-size: 16px;
            margin-bottom: 15px;
            margin-top: 10px
        }

        #wpkCallNow #callautoform .option3 {
            max-width: 160px;
            width: 100%;
            display: block;
            margin: 0 auto
        }

            #wpkCallNow #callautoform .option3 #cta-location-hcm, #wpkCallNow #callautoform .option3 #cta-location-hn {
                text-align: left;
                left: 54px
            }

            #wpkCallNow #callautoform .option3 label {
                display: block;
                text-align: left;
                margin-right: 0;
                padding-left: 10px;
                margin-bottom: 10px
            }

        #wpkCallNow #callautoform #phonenumberautocall {
            margin-right: 0;
            width: 260px;
            float: none;
            margin: 0 auto
        }

        #wpkCallNow #callautoform #button-call {
            position: absolute;
            top: auto;
            bottom: 12px;
            left: 50%;
            -ms-transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%)
        }

    #wpkCallNow .radio input[type=radio] {
        position: absolute;
        margin-left: -20px
    }
}

.gb-card-header {
    display: inline-block;
    border-bottom: solid 1px #efefef;
    padding: 16px 20px;
    margin: 0;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    color: #282727
}

.gb-wrap-rowctn {
    margin: 15px 0
}

.gb-card-body {
    padding: 20px
}

.gb-page-width {
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;
    min-width: 768px;
    max-width: 1200px
}

    .gb-page-width h3 {
        border-bottom: solid #fc6621 2px;
        color: #262661
    }

.dp-grid, .gb-control-group, .rqf-company, .rqf-person {
    display: grid
}

.gb-control-group {
    width: 100%;
    margin: 0 0 25px;
    grid-template-columns: repeat(4,1fr);
    grid-column-gap: 5px;
    padding: 0 10px
}

.requirement-info p {
    display: inline-block;
    width: 100%;
    padding: 0;
    margin: 0
}

.requirement-info .company {
    color: #282727;
    font-weight: 600;
    text-transform: uppercase
}

.requirement-info .open-hour {
    margin-top: 20px
}

.rqf-info {
    background-color: #f5f5f5
}

.rqf-confirm, .rqf-info {
    padding: 20px 0
}

.rqf-company, .rqf-person {
    grid-column-gap: 10px
}

.rqf-person {
    grid-template-columns: repeat(3,1fr)
}

.rqf-company {
    grid-template-columns: repeat(1,1fr)
}

@media only screen and (max-device-width:375px) {
    .requirement-ctn .sendmessage {
        margin: 20px 0
    }

    .Funct_txtarea, .gb-textbox {
        width: 333px !important
    }

    .gb-page-width {
        max-width: 370px;
        min-width: 320px
    }
}

@media only screen and (min-width:376px) and (max-device-width:414px) {
    .requirement-ctn .sendmessage {
        margin: 20px 0
    }

    .Funct_txtarea, .gb-textbox {
        width: 360px !important
    }

    .gb-page-width {
        max-width: 413px;
        min-width: 376px
    }
}

@media only screen and (min-width:415px) and (max-width:767px) {
    .sendmessage {
        margin: 20px 0
    }

    .gb-control-group {
        grid-template-columns: repeat(2,1fr)
    }
}

.info {
    object-fit: cover;
    background-color: #f5f5f5;
    padding-bottom: 20px
}

@media only screen and (max-device-width:414px) {
    .info {
        padding-top: 20px
    }
}

.info img {
    width: 100%
}

@media screen and (max-width:767px) {
    .info h5 {
        margin: 15px 0
    }
}

@media screen and (max-width:768px) {
    .gb-control-group, .rqf-company, .rqf-person {
        grid-template-columns: repeat(1,1fr)
    }

    .gb-page-width {
        padding: 0
    }

    .gb-card-body {
        padding: 8px
    }

    .Funct_txtarea, .gb-textbox {
        width: 360px
    }
}

.ico img {
    width: 5%
}

.google-map {
    width: 100%;
    height: 350px;
    padding: 5px
}

    .google-map iframe {
        width: 100% !important;
        height: 100% !important
    }

.gb-form-group {
    width: 100%;
    margin: 0 0 10px
}

.gb-control-label {
    display: inline-block;
    width: 20%;
    font-size: 14px;
    font-weight: 600;
    padding: 0;
    margin: 0 0 8px
}

    .gb-control-label.required:after {
        content: ' *';
        color: #ff586c
    }

.gb-textbox {
    display: inline-block;
    padding: 0 15px;
    height: 40px;
    outline: 0;
    width: 97%;
    font-size: 14px;
    font-family: Montserrat,sans-serif;
    line-height: 1.42857;
    color: #555;
    border: solid 1px #d7dbdb;
    transition: all ease .15s;
    -webkit-transition: all ease .15s;
    -moz-transition: all ease .15s;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px
}

    .gb-textbox:focus {
        border-color: #a3a3a3
    }

.gb-button, a.gb-button {
    display: inline-block;
    cursor: pointer;
    position: relative;
    min-height: 2.4em;
    line-height: 44px;
    border: none;
    outline: 0;
    font-size: 18px;
    color: #fff;
    font-weight: 400;
    background: #fc6621;
    text-align: center;
    transition: all ease .3s;
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    height: 40px;
    border-radius: 5px;
    width: auto
}

    .gb-button.wide, a.gb-button.wide {
        padding: 0 50px
    }

    .gb-button:hover, a.gb-button:hover {
        background: rgba(252,102,33,.8)
    }

    .gb-button.icon-readmore, a.gb-button.icon-readmore {
        padding: 0 60px 0 20px
    }

        .gb-button.icon-readmore:after, a.gb-button.icon-readmore:after {
            display: inline-block;
            width: 40px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            font-family: Entypo;
            content: '\e766';
            font-size: 15px;
            position: absolute;
            top: 0;
            right: 0
        }

        .gb-button.icon-readmore:before, a.gb-button.icon-readmore:before {
            display: inline-block;
            width: 1px;
            height: 24px;
            background: #fff;
            position: absolute;
            top: 8px;
            right: 40px;
            content: ''
        }

    .gb-button.icon-download:after, a.gb-button.icon-download:after {
        display: inline-block;
        font-family: Entypo;
        content: '\1f4e5';
        font-size: 15px;
        margin-left: 15px
    }

.radio {
    padding-left: 20px
}

    .radio label {
        display: inline-block;
        position: relative;
        padding-left: 5px;
        margin: 0
    }

        .radio label::before {
            content: "";
            display: inline-block;
            position: absolute;
            width: 17px;
            height: 17px;
            left: 0;
            margin-left: -20px;
            border: 1px solid #ccc;
            border-radius: 50%;
            background-color: #fff;
            -webkit-transition: border .15s ease-in-out;
            -o-transition: border .15s ease-in-out;
            transition: border .15s ease-in-out
        }

        .radio label::after {
            display: inline-block;
            position: absolute;
            content: " ";
            width: 11px;
            height: 11px;
            left: 4px;
            top: 4px;
            margin-left: -20px;
            border-radius: 50%;
            background-color: #555;
            -webkit-transform: scale(0,0);
            -ms-transform: scale(0,0);
            -o-transform: scale(0,0);
            transform: scale(0,0);
            -webkit-transition: -webkit-transform .1s cubic-bezier(.8,-.33,.2,1.33);
            -moz-transition: -moz-transform .1s cubic-bezier(.8,-.33,.2,1.33);
            -o-transition: -o-transform .1s cubic-bezier(.8,-.33,.2,1.33);
            transition: transform .1s cubic-bezier(.8,-.33,.2,1.33)
        }

    .radio input[type=radio] {
        opacity: 0
    }

        .radio input[type=radio]:checked + label::after {
            -webkit-transform: scale(1,1);
            -ms-transform: scale(1,1);
            -o-transform: scale(1,1);
            transform: scale(1,1)
        }

        .radio input[type=radio]:disabled + label {
            opacity: .65
        }

            .radio input[type=radio]:disabled + label::before {
                cursor: not-allowed
            }

    .radio.radio-inline {
        margin-top: 0
    }

.radio-primary input[type=radio] + label::after {
    background-color: #fc6621
}

.radio-primary input[type=radio]:checked + label::before {
    border-color: #fc6621
}

.radio-primary input[type=radio]:checked + label::after {
    background-color: #fc6621
}

.icon-bar {
    background-color: #fff
}

.navbar-toggle {
    background-color: #bfbcb8
}

    .navbar-toggle:focus {
        background-color: #757370
    }

#navBarStyle {
    margin-top: .5%
}

.navbar {
    background-color: transparent;
    background: 0 0;
    border: none
}

    .navbar li {
        color: #000
    }

@media screen and (max-width:767px) {
    .side-collapse-container {
        width: 100%;
        position: relative;
        right: 0;
        transition: left .4s
    }

        .side-collapse-container.out {
            right: 200px !important
        }

    .side-collapse {
        top: 50px;
        bottom: 0;
        right: 0;
        width: 200px;
        position: fixed;
        overflow: hidden;
        transition: width .4s
    }

        .side-collapse.in {
            width: 0
        }

    #navBarStyle {
        margin-top: .5%
    }
}

.cus-title-2-home {
    color: #000;
    font-weight: 700;
    line-height: 40px;
    font-size: 30px;
    padding-top: 30px;
    padding-bottom: 30px;
    text-align: center
}

.text-sologan-home {
    text-align: center;
    padding-bottom: 20px;
    margin-left: 30px;
    margin-right: 30px
}

#wraprun {
    overflow: hidden
}

    #wraprun.box-bar-site {
        padding-top: 110px;
        padding-bottom: 110px;
    }

#listBar .box-bar:hover {
    z-index: 10
}

    #listBar .box-bar:hover .dmb-box {
        background: #fc6621
    }

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto
}

@media screen and (min-width:1367px) and (max-width:2560px) {
    #wraprun .wrapper {
        margin: 0 auto
    }

    .sharpDM .dmb-box {
        height: 280px !important;
        width: 280px !important
    }

    .sharpDM .diamond-bord {
        width: 270px !important;
        height: 270px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-top: 25px !important;
            padding-left: 0 !important
        }

            .sharpDM .diamond-bord .dm-text .h3 {
                font-size: 24px
            }

            .sharpDM .diamond-bord .dm-text .h1 {
                font-size: 30px !important
            }

            .sharpDM .diamond-bord .dm-text p {
                font-size: 18px !important;
                line-height: 24px !important
            }
}

@media screen and (min-width:1025px) and (max-width:1145px) {
    #wraprun.box-bar-site {
        padding-top: 0
    }

    #listBar {
        padding: 100px 24px 100px 24px !important
    }

    .sharpDM .dmb-box {
        height: 380px !important;
        width: 380px !important
    }

    .sharpDM .diamond-bord {
        width: 360px !important;
        height: 360px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-top: 30px !important;
            padding-left: 38px !important
        }

            .sharpDM .diamond-bord .dm-text .h3 {
                font-size: 30px !important
            }

            .sharpDM .diamond-bord .dm-text .h1 {
                font-size: 40px !important
            }

            .sharpDM .diamond-bord .dm-text p {
                height: 8.1em;
                font-size: 24px !important;
                line-height: 40px !important
            }

            .sharpDM .diamond-bord .dm-text p {
                height: 8.3em !important
            }
}

@media screen and (min-width:769px) and (max-width:1024px) {
    #wraprun.box-bar-site {
        padding-top: 0
    }

    #listBar {
        padding: 100px 24px 100px 24px !important
    }

    .sharpDM .dmb-box {
        height: 380px !important;
        width: 380px !important
    }

    .sharpDM .diamond-bord {
        width: 360px !important;
        height: 360px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-top: 30px !important;
            padding-left: 38px !important
        }

            .sharpDM .diamond-bord .dm-text .h3 {
                font-size: 30px !important
            }

            .sharpDM .diamond-bord .dm-text .h1 {
                font-size: 40px !important
            }

            .sharpDM .diamond-bord .dm-text p {
                height: 8.1em;
                font-size: 24px !important;
                line-height: 40px !important
            }

            .sharpDM .diamond-bord .dm-text p {
                height: 8.3em !important
            }
}

@media screen and (max-width:768px) {
    #wraprun.box-bar-site {
        padding-top: 0
    }

    .sharpDM .diamond-bord .dm-text p {
        font-size: 18px !important;
        line-height: 32px !important
    }

    .sharpDM .diamond-bord .dm-text {
        padding-top: 25px !important;
        padding-left: 0 !important
    }

        .sharpDM .diamond-bord .dm-text .h3 {
            font-size: 24px !important
        }

        .sharpDM .diamond-bord .dm-text .h1 {
            font-size: 30px !important
        }

        .sharpDM .diamond-bord .dm-text p {
            font-size: 18px !important;
            line-height: 30px !important
        }

        .sharpDM .diamond-bord .dm-text p {
            height: 8.3em !important
        }
}

@media screen and (min-width:737px) and (max-width:768px) {
    #listBar {
        padding: 100px 24px 0 24px !important
    }

        #listBar .col-sm-3 {
            -ms-flex: 0 0 50%;
            flex: 0 0 50%;
            max-width: 50%
        }

    .sharpDM .diamond-bord .dm-text {
        padding-top: 20px !important;
        padding-left: 25px !important
    }

    .sharpDM .dmb-box {
        height: 300px !important;
        width: 300px !important
    }

    .sharpDM .diamond-bord {
        width: 280px !important;
        height: 280px !important
    }
}

@media screen and (min-width:415px) and (max-width:736px) {
    #listBar {
        padding: 100px 24px 100px 24px !important
    }

        #listBar .col-sm-3 {
            -ms-flex: 0 0 50%;
            flex: 0 0 50%;
            max-width: 50%
        }

    .sharpDM .diamond-bord .dm-text {
        padding-top: 20px !important;
        padding-left: 25px !important
    }

    .sharpDM .dmb-box {
        height: 300px !important;
        width: 300px !important
    }

    .sharpDM .diamond-bord {
        width: 280px !important;
        height: 280px !important
    }
}

@media screen and (min-width:416px) and (max-width:667px) {
    .sharpDM .dmb-box {
        height: 320px !important
    }

    .sharpDM .diamond-bord {
        width: 308px !important;
        height: 310px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-top: 50px !important;
            padding-left: 18px !important
        }
}

@media screen and (min-width:376px) and (max-width:415px) {
    #listBar {
        padding: 70px 30px 0 30px !important
    }

    .sharpDM .dmb-box {
        height: 300px !important;
        width: 300px !important
    }

    .sharpDM .diamond-bord {
        width: 280px !important;
        height: 280px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-top: 40px !important;
            padding-left: 0 !important
        }
}

@media screen and (min-width:321px) and (max-width:376px) {
    #listBar {
        padding: 70px 40px 0 40px !important
    }

    .sharpDM .dmb-box {
        height: 300px !important;
        width: 300px !important
    }

    .sharpDM .diamond-bord {
        width: 280px !important;
        height: 280px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-top: 28px !important;
            padding-left: 20px !important
        }
}

@media screen and (max-width:321px) {
    #listBar {
        padding: 70px 0 97px 0
    }

    .sharpDM .dmb-box {
        height: 310px !important
    }

    .sharpDM .diamond-bord {
        width: 307px !important;
        height: 300px !important
    }

        .sharpDM .diamond-bord .dm-text {
            padding-left: 20px !important
        }
}

#wraprun .box-bar {
    position: relative
}

#listBar {
    padding: 0 60px 0 60px
}

.sharpDM {
    padding: 10px 10px 10px 10px;
    width: 240px;
    height: 240px;
    margin: 0;
    -webkit-transform-origin: 0 100%;
    -moz-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    -o-transform-origin: 0 100%;
    transform-origin: 0 100%
}

    .sharpDM .dmb-box {
        background: #818285;
        padding: 5px;
        height: 240px;
        width: 240px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    .sharpDM .diamond-bord {
        width: 218px;
        height: 218px;
        border: 1px solid rgba(255,255,255,.8);
        margin-top: 5px;
        margin-left: 5px
    }

        .sharpDM .diamond-bord .dm-text {
            text-align: center;
            padding-top: 17px;
            padding-left: 0;
            color: #fff;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg)
        }

            .sharpDM .diamond-bord .dm-text .h1, .sharpDM .diamond-bord .dm-text .h3 {
                text-transform: uppercase;
                margin-bottom: 5px;
                margin-top: 0
            }

            .sharpDM .diamond-bord .dm-text .h1 {
                font-weight: 600;
                font-size: 26px
            }

            .sharpDM .diamond-bord .dm-text .h3 {
                font-weight: 400;
                font-size: 20px
            }

            .sharpDM .diamond-bord .dm-text hr {
                background: #ccc;
                width: 80%;
                margin-top: 0;
                margin-bottom: 0;
                margin-left: 33px
            }

            .sharpDM .diamond-bord .dm-text p {
                word-break: break-word;
                text-wrap: avoid;
                margin-top: 10px;
                font-size: 16px;
                line-height: 20px;
                font-weight: 400;
                padding-left: 20px;
                padding-top: 5px;
                height: 8em;
                overflow: hidden;
                text-overflow: ellipsis;
                width: 89%
            }

#sl-id-1 {
    z-index: 4
}

#sl-id-2 {
    z-index: 3
}

#sl-id-3 {
    z-index: 2
}

#sl-id-4 {
    z-index: 1
}

.dp-flex {
    display: flex
}

.min-height-250 {
    min-height: 250px
}

.min-height-50 {
    min-height: 50px
}

.bg-transparent {
    background-color: rgba(0,0,0,.5);
    border: 1px solid rgba(204,204,204,.3)
}

.bg-transparent-orange-60 {
    background-color: rgba(252,102,33,.6)
}

.bg-transparent-orange-70 {
    background-color: rgba(252,102,33,.7)
}

.bg-transparent-orange-80 {
    background-color: rgba(252,102,33,.8)
}

.bg-transparent-orange-90 {
    background-color: rgba(252,102,33,.9)
}

.pdd-20 {
    padding: 20px
}

.title-1 {
    background: url(../images/quytrinh/1.png) no-repeat
}

.title-2 {
    background: url(../images/quytrinh/2.png) no-repeat
}

.title-3 {
    background: url(../images/quytrinh/3.png) no-repeat
}

.title-4 {
    background: url(../images/quytrinh/4.png) no-repeat
}

.title-5 {
    background: url(../images/quytrinh/5.png) no-repeat
}

.text-center {
    text-align: center !important
}

.title-1, .title-2, .title-3, .title-4, .title-5 {
    font-size: 20px;
    line-height: 34px;
    padding-left: 45px;
    text-align: left
}

.grd-ctn-2, .grid-bottom, .grid-top {
    width: 100%;
    grid-column-gap: 15px
}

.grid-bottom, .grid-top {
    margin: 0 0 15px
}

.grd-ctn-2 {
    grid-auto-rows: minmax(100px,auto)
}

.grid-top {
    grid-template-columns: repeat(2,1fr)
}

.grid-bottom {
    grid-template-columns: repeat(3,1fr)
}

.lazy {
    background-color: #f2f2f2;
    background-image: url(../images/loading.gif);
    background-repeat: no-repeat;
    background-position: center
}

@media only screen and (max-width:415px) {
    .grid-bottom, .grid-top {
        grid-template-columns: repeat(1,1fr);
        margin: 0
    }

    .col-md-offset-0 {
        margin-bottom: 15px
    }

    .box-bar a {
        margin-bottom: 10px
    }

    .box-bar-site .col-sm-offset-1 {
        display: inherit !important
    }
}

@media only screen and (min-width:376px) and (max-width:415px) {
    .grid-bottom, .grid-top, .grid-top-title {
        grid-template-columns: 385px !important
    }
}

@media only screen and (min-width:321px) and (max-width:376px) {
    .grid-bottom, .grid-top, .grid-top-title {
        grid-template-columns: 345px !important
    }
}

@media only screen and (max-width:321px) {
    .grid-bottom, .grid-top, .grid-top-title {
        grid-template-columns: 285px !important
    }
}

.viewtemplate-detail-img, .viewtemplate-detail-wrapper {
    height: 450px
}

.viewtemplate-detail-img {
    overflow-y: scroll;
    position: relative;
    max-width: 100%;
    scrollbar-color: #fc6621 #f1f1f1;
    scrollbar-width: thin
}

    .viewtemplate-detail-img::-webkit-scrollbar {
        width: 3px
    }

    .viewtemplate-detail-img .scrollbar-thumb, .viewtemplate-detail-img::-webkit-scrollbar-thumb {
        background: #fc6621
    }

    .viewtemplate-detail-img::-webkit-scrollbar-track {
        background: #f1f1f1
    }

    .viewtemplate-detail-img img {
        width: 100%;
        height: auto;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,.3);
        max-width: 100%
    }

.viewtemp_home ul:hover .template-detail-wrapper {
    height: 450px
}

.template-detail-img, .template-detail-wrapper {
    height: 320px
}

.template-detail-img {
    overflow-y: scroll;
    position: relative;
    max-width: 100%;
    scrollbar-color: #fc6621 #f1f1f1;
    scrollbar-width: thin
}

    .template-detail-img::-webkit-scrollbar {
        width: 3px
    }

    .template-detail-img .scrollbar-thumb, .template-detail-img::-webkit-scrollbar-thumb {
        background: #fc6621
    }

    .template-detail-img::-webkit-scrollbar-track {
        background: #f1f1f1
    }

    .template-detail-img img {
        width: 100%;
        height: auto;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,.3);
        max-width: 100%
    }

.temp_home ul:hover a.template-detail-title h4 {
    position: relative;
    color: #333
}

.slider:hover {
    -moz-box-shadow: 0 0 8px rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 8px rgba(0,0,0,.5);
    box-shadow: 0 0 8px rgba(0,0,0,.5)
}

.header__left > a {
    padding: 5px 0 0;
}

    .header__left > a > img {
        height: 65px;
        width: auto;
        padding: 10px 0;
    }

@media (max-width: 575.98px) {
    .header__left > a > img {
        padding: 10px 0 0;
        height: 30px;
        margin-top: 0px;
    }
}

@media only screen and (max-width:767px) {
    .viewtemplate-detail-img, .viewtemplate-detail-wrapper {
        height: 350px
    }
}

@media (max-width: 852px) {
    .header__left > a > img {
        height: 40px;
        width: auto;
        padding: 0 0;
        margin-top:0;
    }
}
