

.home .header-main {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    background: #dddddd00;
}

.header-main {
    padding-left: 40px;
    padding-right: 40px;
    background: #000;
}

.menu-container.menu-pc a.btn-menu-mobile {
    display: block;
    color: #fff;
    font-size: 25px;
}

.entire-action-search .input-group .input-group-append .btn-submit img {
    filter: invert(1);
}

.entire-action-search .input-group input.form-control::placeholder {
    color: #fff;
}
.align-row-center>.row {
    align-items: center;
}
.menu-pc .menu-section {
    position: fixed;
    width: 29rem;
    top: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    z-index: 1100;
    background-color: #fff;
    overflow: auto;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    -webkit-transform: translate3d(-29rem, 0, 0);
    -moz-transform: translate3d(-29rem, 0, 0);
    -ms-transform: translate3d(-29rem, 0, 0);
    -o-transform: translate3d(-29rem, 0, 0);
    transform: translate3d(-29rem, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.65, 0.05, 0.51, 0.82);
    transition: transform 0.3s cubic-bezier(0.65, 0.05, 0.51, 0.82);
    -webkit-box-shadow: -0.1rem 0 0.3rem rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -0.1rem 0 0.3rem rgba(0, 0, 0, 0.2);
    box-shadow: -0.1rem 0 0.3rem rgba(0, 0, 0, 0.2);
}
.menu-pc .menu-section.open {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.menu-pc .menu-section .close-sidebar {
    position: absolute;
    font-size: 3rem;
    color: var(--color-main);
    top: -0.5rem;
    right: 0;
}
.menu-pc .menu-top {
    display: block;
    position: relative;
    margin: 1.5rem;
}

.menu-pc .menu-section > ul {
    background-color: transparent;
    position: static;
    border-top: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section > ul li {
    display: block;
    margin-right: 0;
    margin-left: 0;
    border-bottom: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section > ul li:last-child {
    border-bottom: 0;
}
.menu-pc .menu-section > ul li a {
    display: block !important;
    height: 4rem;
    line-height: 4rem;
    padding: 0 4rem 0 1.5rem !important;
}
.menu-pc .menu-section > ul > li > a {
    text-align: left;
    color: var(--color-main);
}
.menu-pc .menu-section > ul > li:last-child {
    border-bottom: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section > ul > li.has-child:hover > a {
    background-color: transparent;
    color: var(--color-main);
}
.menu-pc .menu-section .grower {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    font-size: 14px;
    width: 4rem;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
    cursor: pointer;
    opacity: 1;
    filter: alpha(opacity=100);
    z-index: 1;
    border-left: 0.1rem solid #e3e3e3;
    pointer-events: auto;
}
.menu-pc .menu-section .grower::after {
    content: "\f067";
    font-family: "Font Awesome 6 Pro";
    vertical-align: bottom;
    font-weight: 600;
}
.menu-pc .menu-section .grower.open::after {
    content: "\f068";
}
.menu-pc .menu-section .menu-title {
    font-weight: normal;
    margin-bottom: 0;
    color: var(--color-text);
    font-size: 1.4rem !important;
}
.menu-pc .menu-section .menu-title::before {
    content: none;
}
.menu-pc .menu-section .row-menu {
    display: block;
    margin-right: 0;
    margin-left: 0;
}
.menu-pc .menu-section .row-menu > div,
.menu-section .row-menu li {
    max-width: 100%;
    padding: 0;
}
.menu-pc .menu-section .container-menu {
    min-height: auto !important;
}
.menu-pc .menu-section .container-menu .sub-menu {
    display: none;
    padding: 0;
    margin-bottom: 0 !important;
}
.menu-pc .menu-section .container-menu .sub-menu li {
    border-bottom: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section .container-menu .sub-menu li:last-child {
    border-bottom: 0;
}
.menu-pc .menu-section .child-indicator {
    display: none;
}
.menu-pc .menu-section .entry-menu {
    background-color: transparent;
    border-top: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section .entry-menu.dropdown ul {
    border-top: 0.1rem solid #e3e3e3;
    background-color: transparent;
    position: static;
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
    display: none;
    min-width: auto;
    margin: 0;
    padding: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
.menu-pc .menu-section .entry-menu.full-width .container-menu {
    padding: 0;
    width: 100%;
}
.menu-pc .menu-section .entry-menu.full-width .container-menu > .row-menu {
    border-bottom: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section .entry-menu.full-width .container-menu > .row-menu:last-child {
    border-bottom: 0;
}
.menu-pc .menu-section .entry-menu.full-width .container-menu > .row-menu .sub-menu {
    border-top: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section .entry-menu.multil-column .row-menu > div {
    border-bottom: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section .entry-menu.multil-column .row-menu:last-child > div {
    border-bottom: 0;
}
.menu-pc .menu-section .entry-menu.multil-column .row-menu .sub-menu {
    border-top: 0.1rem solid #e3e3e3;
}
.menu-pc .menu-section .has-child {
    position: relative;
}
.menu-pc .menu-section .has-child > a {
    position: relative;
}
.menu-pc .menu-section .has-child > a > span {
    display: none !important;
}
.menu-pc .menu-section .has-child > .entry-menu {
    position: static;
    padding: 0;
    min-width: auto;
    width: auto;
    display: none;
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.menu-pc .menu-section .has-child > .entry-menu::before {
    content: none;
}
.menu-pc .menu-section .has-child:hover > a {
    background-color: transparent !important;
    color: var(--color-main) !important;
}
.menu-pc .back-drop {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    z-index: 1020;
    opacity: 0;
    filter: opacity(0);
    visibility: hidden;
}
.menu-pc .back-drop.open {
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
}
.entire-action-search .btn-mini-search {
    display: none;
}

.header-main>.row>div:nth-child(3) {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.entire-action-search .input-group {
    border-bottom: 1px solid #fff;
}

.entire-action-search .input-group .input-group-append .btn-submit {
    border: 0;
    padding-left: 0;
    background: #ffffff00;
}

.entire-action-search .input-group input.form-control {
    border: 0;
    background: none;
    padding: 0;
    color: #fff;
}

.entire-action-search .input-group input.form-control::placeholder {
    color: #fff;
    font-size: 16px;
}

.logo-section {
    text-align: center;
}
.entire-action-search .input-group .input-group-append .btn-submit img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.box-section-home-01 {
    margin-bottom: 60px;
}
.category-list .item {
    position: relative;
}

.category-list .item .inter-content {
    position: absolute;
    bottom: 50px;
    left: 50px;
    z-index: 2;
}

.category-list .item .inter-content .name a {
    color: #000;
    font-size: 25px;
    font-weight: 700;
}

.category-list .item:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 75%;
    height: 75%;
    background: linear-gradient(46deg, rgba(0, 0, -1, 0.969625350140056) 0%, rgba(0, 0, 0, 0.3841911764705882) 25%, rgba(0, 0, 0, 0) 60%);
    z-index: 1;
    pointer-events: none;
}

.category-list .item .inter-content:before {
    content: '';
    position: absolute;
    left: -10px;
    width: 100%;
    height: 100%;
    bottom: -10px;
    background: #e3e3e3a8;
    z-index: -3;
}

.category-list .item .inter-content .name {
    background: #fff;
    padding: 15px 50px;
    border: 1px solid #fff;
    transition: 0.5s;
}
.box-section-home-02 {
    margin-bottom: 60px;
}
.category-list .item .inter-content:hover .name {
    background: #000;
}

.category-list .item .inter-content:hover .name a {
    color: #fff;
}
@media (min-width:1400px){
    .container {
        max-width: 1400px;
    }
}
.box-section-home-04, .box-section-home-05, .box-section-home-06 {
    margin-bottom: 60px;
}
.banner-product img {
    width: 100%;
    height: 37vw;
    object-fit: cover;
}

.box-section-home-07 {
    padding-bottom: 50px;
    background: #f3f3f3;
    padding-top: 50px;
}

.article-item .inner-image .img {
    border-radius: 12px;
    overflow: hidden;
}

.article-item .inner-content .post-date {
    font-size: 16px;
    color: #000;
    margin-bottom: 10px;
}
.article-item .inner-content .btn-link {
    color: #000;
    font-size: 16px;
    text-decoration: none;
    transition: 1s;
    overflow: hidden;
    display: inline-block;
}
.article-item .inner-content .btn-link:hover>span {transform: translateX(0);}

.article-item .inner-content .btn-link>span {
    transform: translateX(-22px);
    display: inline-block;
    transition: 1s;
}

.article-item .inner-content .btn-link>span i {
    margin-right: 10px;
}
.box-section-home-03 {
    background: #fbfbfb;
    padding-top: 60px;
    padding-bottom: 30px;
    margin-bottom: 60px;
}

.box-product-home .product-item .inner-image {
    margin-bottom: 0 !important;;
}

.box-product-home .product-item  .inner-content {
    padding: 15px;
}

footer .logo-section {
    text-align: left;
}

.footer-description-right {
    text-align: right;
}

.footer-description-right .btn-gop-y a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 43px;
    border-radius: 16px;
    padding: 0 30px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .03em;
    margin-bottom: 15px;
    border: 0;
    color: var(--white);
    border: 0.1rem solid;
}

.text-description-comments {
    color: #d9d9d9;
    max-width: 340px;
    margin-left: auto;
}
.border-bottom-footer > .container > .row {
    border-bottom: 0.1rem solid #fff;
    padding-bottom: 3rem;
}

footer {
    background: #000000;
}

.border-bottom-footer {
    padding-top: 40px;
}
.border-bottom-footer-01 {
    padding-top: 40px;
    padding-bottom: 30px;
}
.border-bottom-footer-01 > .container > .row {
    border-bottom: 0.1rem solid #fff;
    padding-bottom: 3rem;
}
.title-footer {
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.menu-footer>ul>li {
    padding-left: 0;
    list-style: none;
    margin-bottom: 15px;
}

.menu-footer>ul {
    padding-left: 0;
    margin-bottom: 0;
}

.menu-footer>ul>li>a {
    color: #fff;
}

.swiper .article-item {
    margin-bottom: 0;
}

@media (min-width:1300px){
    .box-section-home {
        padding-left: 30px;
        padding-right: 30px;
    }
    
    
    footer .container {
        max-width: calc(100% - 60px);
    }
}
@media (min-width:1400px){
    .box-section-home {
        padding-left: 50px;
        padding-right: 50px;
    }
    
    
    footer .container {
        max-width: calc(100% - 100px);
    }
}


/*tin-tuc*/
.article-description-top {
    margin-bottom: 30px;
    border-bottom: 2px dashed #dddddd;
    padding-bottom: 30px;
}

.article-description-top .title-article-detail h1 {
    font-size: 20px;
    font-weight: 700;
}

.article-description-top .title-article-detail {
    margin-bottom: 15px;
}

.img-article-detail {
    border-radius: 8px;
    overflow: hidden;
}

.article-detail-left {
    background: #ebebeb;
    padding: 30px;
    border-radius: 8px;
    width: calc(100% + 100px);
    position: relative;
    z-index: 2;
}

@media (min-width:992px){
    .box-article-top .article-item .inner-content {
        background: #f5f5f5;
        padding: 30px;
        width: calc(100% + 100px);
        position: relative;
        left: -100px;
        z-index: 2;
        border-radius: 8px;
    }
}

.box-article-top .article-item .inner-image {
    margin-bottom: 0 !important;;
}
.article-content h2, .article-content h3, .article-content h4 {
    margin-bottom: 15px;
}

.article-content h2 {
    font-size: 20px;
}
.article-content h3 {
    font-size: 18px;
}
.article-content h4 {
    font-size: 16px;
}
/*tin-tuc*/


#translator {
  position: fixed;
  z-index: 9999;
  bottom: -20px;
  right: 0px;
  display: inline-block;
  padding: 5px 7px 5px 10px;
}

.box-article-detail-01,.box-article-detail-02 {
    margin-bottom: 60px;
}

.box-article-detail-02 .title-section {
    text-align: left !important;
    font-size: 20px;
}

.header-page-title {
    margin-bottom: 15px;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 8vw 0;
    position: relative;
}

.header-page-title:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #0000008f;
}

.header-page-title .breadcrumb {
    position: relative;
    z-index: 2;
}

.header-page-title .breadcrumb .content .title {
    color: #fff;
    margin-bottom: 10px;
}

.header-page-title .breadcrumb .breadcrumbs-section a {
    color: #fff;
}
.header-image img {
    width: 100%;
    height: 23vw;
    object-fit: cover;
    object-position: top;
}

.header-image {
    margin-bottom: 15px;
}
.box-section-home-08 {
    margin-bottom: 60px;
}
.btn-quantity-cart {
    display: flex;
    flex-wrap: wrap;
}
@media (min-width:1400px){
    .entire-action-search .input-group {
        width: 260px;
    }
}
@media (max-width:1200px){
    .is-mobile .product-action {
        display: none;
    }
    .header-menu-mb {
        background: #000;
    }
    
    .btn-action-header {
        padding-right: 6px;
    }
    
    .items-number {
        right: 0;
    }
    .box-section-home-01 {
        margin-bottom: 30px;
    }
    
    .title-section {
        font-size: 25px;
        margin-bottom: 25px;
    }
    
   
    .category-list .item .inter-content .name {
        padding: 10px 25px;
    }
    
    .category-list .item .inter-content .name a {
        font-size: 16px;
    }
    
    .category-list .item .inter-content {
        bottom: 40px;
        left: 40px;
    }
    .box-section-home-03 {
        padding-top: 30px;
        padding-bottom: 20px;
        margin-bottom: 30px;
    }
    .box-section-home-08 {
        margin-bottom: 30px;
    }
    .box-article-detail-01 {
        margin-bottom: 20px;
    }
    .box-article-detail-02 {
        margin-bottom: 30px;
    }
     .row {
        margin-right: -7.5px;
        margin-left: -7.5px;
    }
    
    .row>div {
        padding-left:  7.5px;
        padding-right: 7.5px;;
    }
     .box-section-home-02 {
        margin-bottom: 35px;
    }
      .footer-mid-mobile {
        padding-top: 30px;
    }
     .footer-mid-mobile>.container>.row>div {
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 15px;
    }
    .row.no-gutters {
        margin-right: 0;
        margin-left: 0;
    }
}


@media (max-width:767px){
     .box-section-home-02 {
        margin-bottom: 15px;
    }
    .article-detail-left {
        width: 100%;
        padding: 0;
        background: none;
    }
    
    .img-article-detail {
        display: none;
    }
    
    .article-description-top {
        margin-bottom: 15px;
        border-bottom: 1px dashed #dddddd;
        padding-bottom: 15px;
    }
    
    .article-content h2, .content-text h2 {
        font-size: 18px;
    }
    
    .article-content h3, .content-text h3 {
        font-size: 17px;
    }
    
    .article-content h4, .content-text h4 {
        font-size: 16px;
    }
    .row {
        margin-right: -5px;
        margin-left: -5px;
    }
    
    .row>div {
        padding-left: 5px;
        padding-right: 5px;
    }
    .box-product-home .product-item .inner-content {
        padding: 10px;
    }
    
    .product-item .inner-content .price {
        font-size: 12px;
    }
    
    .product-code {
        font-size: 11px;
    }
    
    .product-title {
        font-size: 14px;
    }
    .row.no-gutters {
        margin-right: 0;
        margin-left: 0;
    }
    
    .box-section-home-08 {
        padding-left: 10px;
        padding-right: 10px;
    }
  
    .footer-mid-mobile>.container>.row>div {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 15px;
    }
    .header-image {
        margin-bottom: 0;
    }
    
    .breadcrumbs-section {
        font-size: 13px;
    }
    .header-image {
        margin-bottom: 0;
    }
    
    .breadcrumbs-section {
        font-size: 13px;
    }
    
    .btn-filter-mobile {
        background: #000;
        color: #fff;
        padding: 5px 20px;
        border-radius: 5px;
        display: inline-block;
    }
    .btn-quantity-cart .btn-cart-buy {
        margin-top: 10px;
    }
    .box-article-top .article-item .inner-content {
        padding-top: 15px;
    }

    .article-item .inner-image {
        margin-bottom: 10px;
    }
    
    .article-item .article-description {
        font-size: 13px;
        margin-bottom: 5px;
    }
    
    .article-item .inner-content .post-date {
        font-size: 14px;
        margin-bottom: 5px;
    }
    
    .article-item .article-title {
        margin-bottom: 5px;
        font-size: 13px;
    }
    
    .article-item .inner-content .btn-link {
        display: none;
    }
}

@media (min-width:500px) and (max-width:1500px){
    .header-main {
        padding-left: 15px;
        padding-right: 15px;
    }
    .entire-action-search .input-group input.form-control {
        position: absolute;
        top: 100%;
        right: 0;
        width: 250px;
        padding-left: 15px;
        z-index: 99;
        background: #000;
        opacity: 0;
        visibility: hidden;
    }
    
    .entire-action-search .input-group:hover input.form-control {
        opacity: 1;
        visibility: initial;
    }
    
    .entire-action-search .input-group {
        border: 0;
    }
    
}

@media (min-width:500px) and (max-width:1200px){
    .icon-header {
        font-size: 18px;
    }
    .header-main>.row>div {
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }
}