/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
.container-width, .full-width .ubermenu-nav, .container, .row {
    max-width: 1200px;
}

.nav > li > a {
    font-family: Dosis;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

section.banner-system {
    margin-top: -125px;
    height: 400px;
    overflow: hidden;
}

    section.banner-system img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }

.home__title {
    width: 500px;
    margin: auto;
    text-align: center;
    position: relative;
    height: 2px;
    margin-bottom: 20px;
    background: #ffcf00;
    max-width: 100%;
}

    .home__title span {
        color: #000;
        font-weight: 700;
        font-size: 23px;
        background: #fff;
        position: absolute;
        display: inline-block;
        left: 50%;
        transform: translateX(-50%);
        top: -20px;
        padding: 0px 20px;
    }

.contact-form {
    width: 500px;
    margin: auto;
    box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 15px;
    max-width: 100%;
}

    .contact-form input.wpcf7-form-control.wpcf7-submit {
        background: #472618;
        box-shadow: unset !important;
    }

.ux-search-submit {
}


.searchform .search-field {
      border: none;
    box-shadow: none!important;
    outline: none;
}

.searchform-wrapper {
    border-radius: 24.532px;
    border: 1px solid #DEDEDE;
    background: var(--s-1-p-4, #FFF);
    box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    padding: 0 10px;
}

.icon-search {
}

.searchform .button.icon {
    margin: 0;
    background: transparent;
    border: none;
    color: black;
    font-size: 10px;
}

.info-ft {
}

    .info-ft h4 {
        color: var(--s-1-p-6, #EE3137);
        text-align: center;
        /* s1/t1 */ font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin: 22px 0;
    }

    .info-ft ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .info-ft ul li {
            color: var(--s-1-p-8, #5F5D5B);
            /* s1/t7 */ font-size: 20px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            margin: 0;
            margin-bottom: 24px;
            padding-left: 35px;
        }

    .info-ft li:nth-child(1) {
        background: url(images/imap.png) left center no-repeat;
    }

    .info-ft li:nth-child(2) {
        background: url(images/iphone.png) left center no-repeat;
    }

    .info-ft li:nth-child(3) {
        background: url(images/iemail.png) left center no-repeat;
        margin-bottom: 0;
    }

.ft-map {
}

    .ft-map h4 {
        color: var(--s-1-p-6, #EE3137);
        font-family: Dosis;
        font-size: 32px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        position: relative;
        padding-bottom: 12px;
        margin-bottom: 25px;
        margin-top: 25px;
    }

        .ft-map h4:before {
            position: absolute;
            content: "";
            width: 45px;
            height: 4px;
            border-radius: 2px;
            background: #D9D9D9;
            bottom: 0;
        }

.ft-menu {
}

    .ft-menu h4 {
        color: var(--s-1-p-6, #EE3137);
        font-family: Dosis;
        font-size: 32px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        position: relative;
        padding-bottom: 12px;
        margin-bottom: 10px;
        margin-top: 25px;
    }

        .ft-menu h4:before {
            position: absolute;
            content: "";
            width: 45px;
            height: 4px;
            border-radius: 2px;
            background: #D9D9D9;
            bottom: 0;
        }

    .ft-menu ul {
        list-style: none;
    }

    .ft-menu li {
        margin-left: 0 !important;
        border-bottom: 1px solid #D9D9D9;
        padding: 15px 0;
    }

    .ft-menu a {
        color: #000;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

.chungnhan-heading {
}

    .chungnhan-heading h4 {
        color: var(--s-1-p-6, #EE3137);
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        padding-bottom: 18px;
        margin-bottom: 0;
    }

        .chungnhan-heading h4:before {
            position: absolute;
            content: "";
            width: 103px;
            height: 4.243px;
            border-radius: 50px;
            background: #D9D9D9;
            bottom: 0;
            left: 0;
        }

.owl-carousel .owl-dots .owl-dot {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: #EE3137;
    border-radius: 50%;
    margin: 0 10px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    min-height: unset !important;
}

.owl-dots .owl-dot.active {
    width: 14px;
    height: 14px;
    background-color: #D9D9D9;
    border-radius: 6px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.owl-carousel .owl-dots {
    display: block;
    margin-top: 25px;
    text-align: center;
    position: relative;
    bottom: 0;
    width: 100%;
}

.tintuc-heading {
}

    .tintuc-heading .col-inner {
        display: flex;
        margin: 0;
        align-items: end;
        /* margin-bottom: 47px; */
    }

    .tintuc-heading h4 {
        color: var(--s-1-p-6, #EE3137);
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin-bottom: 0;
        padding-bottom: 18px;
    }

        .tintuc-heading h4:before {
            position: absolute;
            content: "";
            width: 103px;
            height: 4.243px;
            border-radius: 50px;
            background: #D9D9D9;
            bottom: 0;
            left: 0;
        }

.tintuc-read {
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
}

    .tintuc-read span:before {
        width: 116.078px;
        height: 2.648px;
        border-radius: 20px;
        background: var(--s-1-p-6, #EE3137);
        position: absolute;
        content: "";
        right: 0;
        bottom: 0;
    }

    .tintuc-read span {
        margin: 0;
        padding: 0;
        background: transparent;
        color: var(--s-1-p-6, #EE3137);
        /* s1/t3 */
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        border: none;
        min-width: 116.078px;
        text-align: right;
        position: relative;
        padding-bottom: 7px;
    }

.blog-item {
    display: flex;
    align-items: center;
    margin-bottom: 37px;
}

.blog-thumb {
    min-width: 277px;
    max-width: 277px;
    overflow: hidden;
}

    .blog-thumb img {
    }

.blog-content {
    padding-left: 24px;
}

.blog-title {
    margin-bottom: 5px;
}

    .blog-title a {
        color: var(--s-1-p-6, #EE3137);
        text-align: left;
        /* s1/t3 */
        font-family: Dosis;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        display: block;
    }

.blog-desc {
    text-align: justify;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.blog-thumb img {
    width: 100%;
}

.quytrinh-item {
}

    .quytrinh-item h4 {
        color: var(--s-1-p-6, #EE3137);
        text-align: center;
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin: 26px 0;
    }

    .quytrinh-item p {
        color: #000;
        text-align: center;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

.about-info {
}

    .about-info h4 {
        color: var(--s-1-p-6, #EE3137);
        font-size: 36px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

    .about-info p {
        color: #000;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

.about-readmore {
    padding: 0 !important;
    margin: 0;
}

    .about-readmore span {
        color: var(--s-1-p-6, #EE3137);
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        bottom: 0;
        position: relative;
        padding-bottom: 8px;
    }

        .about-readmore span:before {
            position: absolute;
            content: "";
            width: 116.078px;
            height: 2.648px;
            border-radius: 20px;
            background: var(--s-1-p-6, #EE3137);
            bottom: 0;
        }

.kem {
    width: 396px;
    height: 604px;
    background: url(images/kem.png) center center no-repeat;
    position: absolute;
    left: -16px;
    bottom: 0;
    z-index: -1;
}

.about-st {
    position: relative;
}

    .about-st .section-content.relative {
        position: unset !important;
    }

.noibat-heading {
}

    .noibat-heading h4 {
        color: var(--s-1-p-6, #EE3137);
        font-size: 48px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        display: inline-block;
        position: relative;
        margin-bottom: 0;
    }

        .noibat-heading h4:before {
            position: absolute;
            content: "";
            width: 419.858px;
            height: 31.852px;
            border-radius: 50px;
            opacity: 0.1;
            background: var(--s-1-p-6, #EE3137);
            left: 0;
            right: 0;
            margin: auto;
            bottom: 0;
            max-width: 100%;
        }

.prnoibat-item {
    display: flex;
    margin-bottom: 61px;
}

    .prnoibat-item:hover .prnoibat-title a {
        color: var(--s-1-p-2, #D37D18);
    }

.prnoibat-image {
    border-radius: 30px;
    background: #FFF;
    box-shadow: 0px 4px 20px 0px rgba(201, 0, 0, 0.10);
    width: 147px;
    text-align: center;
    padding: 20px;
}

    .prnoibat-image img {
    }

.prnoibat-content {
    padding: 5px 0px 5px 5px;
    padding-left: 27px;
}

.prnoibat-title {
    margin-bottom: 3px;
}

    .prnoibat-title a {
        color: var(--s-1-p-3, #565656);
        /* s1/t2 */
        font-size: 24px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        display: block;
        text-align: justify;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

        .prnoibat-title a:hover {
        }

.proprice-gr {
}

.proprice {
}

    .proprice .new {
        color: var(--s-1-p-6, #EE3137);
        /* s1/t3 */ font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

        .proprice .new span.amount {
            color: var(--s-1-p-6, #EE3137);
        }

    .proprice .old {
        color: var(--s-1-p-5, #ACACAC);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

        .proprice .old span.amount {
        }

.readmore-gr {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.btnr-gr {
    width: 33px;
    height: 33px;
}

.addcarte {
    background: url(images/cart.png) center center no-repeat;
}

.viewproducte {
    background: url(images/view.png) center center no-repeat;
}

.prmoi-item {
    border-radius: 50px;
    background: var(--s-1-p-4, #FFF);
    box-shadow: 4px 10px 30px 0px rgba(163, 21, 25, 0.08);
    /* overflow: hidden; */
    height: 100%;
}

.prmoi-image {
}

.prmoi-content {
    padding: 27px;
}

.prmoi-title {
    margin-bottom: 10px;
}

    .prmoi-title a {
        color: var(--s-1-p-3, #565656);
        /* s1/t3 */ font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-align: justify;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

        .prmoi-title a:hover {
        }

.prmoi-item .proprice-gr {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.proprice {
}

.prmoi-item:hover .prmoi-title a {
    color: var(--s-1-p-2, #D37D18);
}

.prmoi-image img {
    width: 100%;
}

.promoi-box {
    margin-bottom: 30px;
}

#wrapper > .message-wrapper {
    display: none;
}

.nav_protab {
    justify-content: center;
    border-radius: 50px;
    overflow: hidden;
}

    .nav_protab li {
        border: none;
    }

.nav_protabbox .nav_protab a {
    border: none !important;
    background: #EFEFEF;
    padding: 13px 30px;
    text-decoration: none;
}

    .nav_protabbox .nav_protab a.active {
        border-radius: 50px;
        background: var(--s-1-p-6, #EE3137);
        color: var(--s-1-p-4, #FFF);
        /* s1/t3 */
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

        .nav_protabbox .nav_protab a.active:hover {
        }

    .nav_protabbox .nav_protab a:hover {
    }

.nav_protabbox {
    border-radius: 50px;
    background: #EFEFEF;
    display: inline-block;
    margin: auto;
    margin-bottom: 60px;
}

.content_protab {
}

.tab-content > .active {
    display: block;
    opacity: 1 !important;
    visibility: visible;
    height: auto;
}

.read-categoryprohome {
    text-align: center;
}

    .read-categoryprohome a {
        display: block;
        margin: auto;
        margin-top: 26px;
    }

        .read-categoryprohome a:hover {
        }

    .read-categoryprohome span {
        border-radius: 53px;
        border: 1px solid var(--s-1-p-6, #EE3137);
        color: var(--s-1-p-6, #EE3137);
        text-align: center;
        /* s1/t3 */ font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        padding: 19px 45px;
        display: inline-block;
    }

.prmoi-item .sale {
    position: absolute;
    color: var(--s-1-p-4, #FFF);
    /* s1/t4 */ font-family: Dosis;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    width: 53px;
    height: 53px;
    background: #D37D18;
    border-radius: 50%;
    line-height: 53px;
    text-align: center;
    right: 12px;
    top: -20px;
}

.product-section-title-related {
    text-align: center;
    display: block;
    margin: 0 auto;
    margin-top: 40px;
    margin-bottom: 60px;
    text-transform: uppercase;
}

.post-date {
    display: none !important;
}

.blogpage-e {
}

    .blogpage-e .blog-item {
        display: block;
    }

    .blogpage-e .blog-thumb {
        width: 100%;
        max-width: 100%;
    }

        .blogpage-e .blog-thumb img {
        }

    .blogpage-e .blog-content {
        padding: 10px;
    }

@media (min-width: 1366px) {
    .container {
        max-width: 1300px;
    }
}

@media (min-width: 1200px) {
    .header-main .nav .menu-item .nav-top-link:hover:before {
        position: absolute;
        content: "";
        width: 24px;
        height: 24px;
        background: url(images/icon-kem.png) center center no-repeat;
        left: 0;
        right: 0;
        bottom: -25px;
        margin: auto;
    }

    .about-info .col-inner {
        padding-right: 70px;
    }

    .ft-menu {
        padding: 0 40px;
    }

    .container {
        max-width: 1200px;
    }

    .nav-spacing-medium .menu-item {
        margin-right: 57px;
    }
}

@media only screen and (max-width: 48em) {
    .noibat-heading h4 {
        font-size: 31px;
    }

    .proprice .new {
        font-size: 15px;
    }

    .about-readmore {
        margin-bottom: 30px;
    }

    .quytrinh-item {
        margin-bottom: 30px;
    }

    .kem {
        display: none;
    }

    .tintuc-st .blog-item {
        display: block;
    }

    .tintuc-st .blog-content {
        padding-left: 0;
        padding-top: 10px;
    }

    .tintuc-st .blog-thumb {
        max-width: 100%;
        overflow: hidden;
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    .quytrinh-item h4 {
        font-size: 19px;
    }

    .kem {
        display: none;
    }

    .prnoibat-item {
        display: block;
        margin-bottom: 61px;
    }

    .prnoibat-image {
        margin: auto;
    }

    .prnoibat-content {
        padding: 10px;
        text-align: center;
    }

    .readmore-gr {
        display: flex;
        gap: 10px;
        margin-top: 10px;
        justify-content: center;
    }

    .tintuc-st .blog-item {
        display: block;
    }

    .tintuc-st .blog-content {
        padding-left: 0;
        padding-top: 10px;
    }

    .tintuc-st .blog-thumb {
        max-width: 100%;
        overflow: hidden;
    }
}