/* ----- Tổng quan Title + Background ----- */
.featured-title {
    background-color: #446084;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
}

.page-title {
    position: relative;
}

.page-title-inner {
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
    min-height: 60px;
}

.page-title-inner ul,
.page-title-inner select,
.page-title-inner form,
.page-title-inner button,
.page-title-inner p {
    margin: 0;
}

/* ----- Title Background, Overlay, Parallax ----- */
.page-title-bg {
    overflow: hidden;
    box-shadow: inset 0 0 30px rgba(0, 0, 0, .1);
}

.title-bg {
    transition: opacity .6s;
    background-image: url(https://trunghieploi.com.vn/wp-content/uploads/2019/10/57abbf6…-1.jpg) !important;
}

.title-overlay {
    background-color: rgba(0, 0, 0, .25);
}

.shop-page-title.featured-title .title-overlay {
    background-color: #317e50;
}

/* ----- Flex utilities ----- */
.flex-row {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.flex-grow {
    flex: 1;
    flex-shrink: 1;
    flex-basis: auto !important;
}

.flex-col {
    max-height: 100%;
}

.inline-block {
    display: inline-block;
}

/* ----- Typography ----- */
.uppercase,
.is-uppercase,
h6,
th,
span.widget-title {
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.is-large {
    font-size: 1.15em;
}

.breadcrumbs {
    font-weight: bold;
    letter-spacing: 0;
    padding: 0;
    text-transform: none;
    color: #222;
}

.breadcrumbs a:first-of-type {
    margin-left: 0;
}

.breadcrumbs .divider,
.breadcrumbs .separator {
    position: relative;
    top: 0;
    opacity: .35;
    margin: 0 .3em;
    font-weight: 300;
    color: #fff !important;
}

/* ----- Dark Mode ----- */
.dark, .dark p, .dark td {
    color: #f1f1f1;
}

.dark .breadcrumbs,
.dark .breadcrumbs a {
    color: #fff !important;
}

.dark .form-flat input:not([type=submit]),
.dark .form-flat textarea,
.dark .form-flat select,
.nav-dark .form-flat input:not([type=submit]),
.nav-dark .form-flat textarea,
.nav-dark .form-flat select {
    background-color: rgba(255, 255, 255, .2) !important;
    border-color: rgba(255, 255, 255, .09);
    color: #fff;
}

.dark .form-flat select option {
    color: #333;
}

.woocommerce .woocommerce-breadcrumb {
    color: #fff !important;
}

/* ----- Forms & Inputs ----- */
.form-flat input:not([type=submit]),
.form-flat textarea,
.form-flat select {
    background-color: rgba(0, 0, 0, .03);
    border-color: rgba(0, 0, 0, .09);
    color: currentColor !important;
    border-radius: 99px;
    box-shadow: none;
}

.form-flat button,
.form-flat input {
    border-radius: 99px;
}

.flex-col button,
.flex-col .button,
.flex-col input {
    margin-bottom: 0;
}

.button,
button,
input,
textarea,
select,
fieldset {
    margin-bottom: 1em;
}

/* ----- Select Styling ----- */
select,
.select-resize-ghost,
.select2-container .select2-choice,
.select2-container .select2-selection {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 0;
    box-shadow: inset 0 -1.4em 1em rgba(0, 0, 0, .02), inset 0 1px 2px rgba(0, 0, 0, .1);
    padding: 0 .75em;
    height: 2.507em;
    font-size: .97em;
    /*background-image: url(data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E);*/
    background-position: right .45em top 50%;
    background-repeat: no-repeat;
    background-size: auto 16px;
}

/* ----- Utility & Visibility ----- */
[data-parallax-container] {
    overflow: hidden;
}

[data-parallax] {
    will-change: transform !important;
}

.category-filter-row {
    display: none;
}

@media (min-width: 850px) {
    [data-show="show-for-medium"],
    .show-for-medium {
        display: none !important;
    }
}

/* ----- Misc Styles ----- */
.links > li > a:before,
i[class^="icon-"],
i[class*=" icon-"] {
    font-family: "fl-icons" !important;
    speak: none;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    display: inline-block;
    line-height: 1.2;
    position: relative;
}


/*tôi code thêm*/
.page-title-inner ul, .page-title-inner select, .page-title-inner form, .page-title-inner button, .page-title-inner p {
    margin-top: 0;
    margin-bottom: 0;
}
.woocommerce-result-count {
    display: inline-block;
    margin: 0 1em 0 auto !important;
}
.shop-page-title.category-page-title.page-title.featured-title.dark
{
    float:left;
    width:100%;
}
.featured-title .page-title-inner {
    padding-bottom: 20px;
}
.dark .breadcrumbs {
    color: #fff;
}
.breadcrumbs {
    text-transform: none;
}
.breadcrumbs {
    color: #222;
    font-weight: bold;
    letter-spacing: 0;
    padding: 0;
}
.is-uppercase, .uppercase {
    line-height: 1.2;
    text-transform: uppercase;
}
.uppercase, h6, th, span.widget-title {
    line-height: 1.05;
    letter-spacing: .05em;
    text-transform: uppercase;
}



/*tôi code section chính*/
/* ------------------- Responsive Grid Columns ------------------- */
@media screen and (min-width: 850px) {
    .large-9 {
        max-width: 75%;
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
    }

    .gallery-columns-3 .gallery-item,
    .large-columns-3 > .col,
    .large-columns-3 .flickity-slider > .col {
        max-width: 33.3333%;
        -ms-flex-preferred-size: 33.3333%;
        flex-basis: 33.3333%;
    }

    .col + .col .col-inner {
        margin-right: auto;
        margin-left: 0;
    }

    .col:first-child .col-inner {
        margin-left: auto;
        margin-right: 0;
    }
}

@media screen and (min-width: 550px) {
    .medium-columns-3 > .col,
    .medium-columns-3 .flickity-slider > .col {
        max-width: 33.3333%;
        -ms-flex-preferred-size: 33.3333%;
        flex-basis: 33.3333%;
    }
}

.small-columns-2 > .col,
.small-columns-2 .flickity-slider > .col {
    max-width: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
}

/* ------------------- Row & Column Layout ------------------- */
.row .row-small:not(.row-collapse),
.container .row-small:not(.row-collapse) {
    margin: 0 -10px;
}

.row .gallery,
.row .row:not(.row-collapse),
.container .row:not(.row-collapse),
.lightbox-content .row:not(.row-collapse) {
    padding: 0;
    margin-left: -15px;
    margin-right: -15px;
    width: auto;
}

.row.row-small {
    max-width: 1065px; /* override 1202.5px */
}

.row-small > .flickity-viewport > .flickity-slider > .col,
.row-small > .col {
    padding: 0 9.8px 19.6px;
    margin-bottom: 0;
}

.col,
.gallery-item,
.columns {
    position: relative;
    margin: 0;
    padding: 0 15px 30px;
    width: 100%;
}

/* ------------------- Column Inner ------------------- */
.col-inner {
    position: relative;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
}

/* ------------------- Box Styling ------------------- */
.box,
.box-image,
.box-text {
    width: 100%;
    position: relative;
    margin: 0 auto;
    -webkit-transition: opacity .3s, background-color .3s, -webkit-transform .3s;
    -o-transition: opacity .3s, transform .3s, background-color .3s;
    transition: opacity .3s, transform .3s, background-color .3s, -webkit-transform .3s;
}

.box-image {
    height: auto;
    overflow: hidden;
}

.box-image > a,
.box-image > div > a {
    display: block;
}

.box a {
    display: inline-block;
}

/* ------------------- Box Shadows ------------------- */
.row-box-shadow-1 .col-inner,
.row-box-shadow-1-hover .col-inner:hover,
.box-shadow-1,
.box-shadow-1-hover:hover {
    box-shadow: 0 1px 3px -2px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
}

.row-box-shadow-1 .col-inner,
.row-box-shadow-2 .col-inner,
.row-box-shadow-3 .col-inner,
.row-box-shadow-4 .col-inner,
.row-box-shadow-5 .col-inner,
.row-box-shadow-1-hover .col-inner,
.row-box-shadow-2-hover .col-inner,
.row-box-shadow-3-hover .col-inner,
.row-box-shadow-4-hover .col-inner,
.row-box-shadow-5-hover .col-inner,
.box-shadow-1,
.box-shadow-2,
.box-shadow-3,
.box-shadow-4,
.box-shadow-5,
.box-shadow-1-hover,
.box-shadow-2-hover,
.box-shadow-3-hover,
.box-shadow-4-hover,
.box-shadow-5-hover {
    transition: background-color .3s, color .3s, opacity .3s, transform .3s, box-shadow .3s;
}

/* ------------------- Box Text ------------------- */
.box-text {
    padding: .7em 1.2em 1.4em;
    position: relative;
    width: 100%;
    font-size: .9em;
    font-weight: 700;
    text-align: center;
}

/* ------------------- Utilities ------------------- */
.text-center {
    text-align: center;
}

.is-small,
.is-small.button {
    font-size: .8em;
}

.z-1 {
    z-index: 21;
}

.left  { left: 0; }
.right { right: 0; }
.top   { top: 0; }
.bottom{ bottom: 0; }
.absolute {
    position: absolute !important;
}

/* ------------------- Image Tools ------------------- */
.image-tools {
    position: absolute;
    padding: 10px;
}

.image-tools.top.right {
    padding-bottom: 0;
    padding-left: 0;
}

.image-tools.bottom.left {
    padding-top: 0;
    padding-right: 0;
}

/* ------------------- Hover Effects ------------------- */
.show-on-hover,
.hover-slide,
.hover-slide-in,
.hover-zoom,
.hover-zoom-in {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: blur(0);
    filter: blur(0);
    -webkit-transition: opacity .5s, max-height .6s, -webkit-transform .3s, -webkit-filter .6s;
    -o-transition: opacity .5s, transform .3s, max-height .6s, filter .6s;
    transition: opacity .5s, transform .3s, max-height .6s, filter .6s, -webkit-transform .3s, -webkit-filter .6s;
}

.hover-slide-in {
    -webkit-transform: translateY(100%) translateZ(0);
    transform: translateY(100%) translateZ(0);
}

/* ------------------- Grid Tools ------------------- */
.grid-tools {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 0 !important;
    margin-bottom: -1px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    white-space: nowrap;
}

/* ------------------- Other ------------------- */
.badge-container {
    margin-top: 30px;
}

.has-shadow > .col > .col-inner,
.has-shadow.box:not(.box-overlay):not(.box-shade),
.has-shadow .box:not(.box-overlay):not(.box-shade) {
    background-color: #fff;
}
@media screen and (min-width: 550px) {
    .medium-columns-3>.col, .medium-columns-3 .flickity-slider>.col {
        max-width: 33.3333333333%;
        -ms-flex-preferred-size: 33.3333333333%;
        flex-basis: 33.3333333333%;
    }
}
@media screen and (min-width: 850px) {
    .gallery-columns-3 .gallery-item, .large-columns-3>.col, .large-columns-3 .flickity-slider>.col {
        max-width: 33.3333333333%;
        -ms-flex-preferred-size: 33.3333333333%;
        flex-basis: 33.3333333333%;
    }
}
@media screen and (min-width: 850px) {
    .gallery-columns-4 .gallery-item, .large-columns-4>.col, .large-columns-4 .flickity-slider>.col {
        max-width: 25%;
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    }
}
.bg-zoom:hover .bg, .has-hover:hover .image-zoom img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.has-hover .bg, .has-hover [class*=image-] img {
    -webkit-transition: opacity .6s, -webkit-filter .6s, -webkit-transform .6s, -webkit-box-shadow .3s;
    transition: opacity .6s, -webkit-filter .6s, -webkit-transform .6s, -webkit-box-shadow .3s;
    -o-transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;
    transition: filter .6s, opacity .6s, transform .6s, box-shadow .3s;
    transition: filter .6s, opacity .6s, transform .6s, box-shadow .3s, -webkit-filter .6s, -webkit-transform .6s, -webkit-box-shadow .3s;
}

/*tôi code tiếp*/
ul.links {
    margin: 5px 0 !important;
    font-size: .85em;
}
.text-center {
    text-align: center;
}
.woocommerce-pagination ul.links li {
    margin-left: inherit;
}
ul.links li:first-child {
    margin-left: 0;
}
ul.links li {
    margin: 0 .4em !important;
    display: inline-block;
}
.nav-vertical.nav-tabs > li.active > a, .scroll-to-bullets a.active, .nav-pagination > li > .current, .nav-pagination > li > span:hover, .nav-pagination > li > a:hover, .has-hover:hover .badge-outline .badge-inner, .accordion-title.active, .featured-table, .is-outline:hover, .tagcloud a:hover, blockquote, .has-border, .cart-icon strong:after, .cart-icon strong, .blockUI:before, .processing:before, .loading-spin, .slider-nav-circle .flickity-prev-next-button:hover svg, .slider-nav-circle .flickity-prev-next-button:hover .arrow, .primary.is-outline:hover {
    border-color: #187c46 !important;
}
.nav-pagination>li>span, .nav-pagination>li>a {
    font-size: 1.1em !important;
    display: block !important;
    height: 2.25em !important;
    line-height: 2em !important;
    text-align: center !important;
    width: auto !important;
    min-width: 2.25em !important;
    padding: 0 7px !important;
    font-weight: bolder !important;
    border-radius: 99px !important;
    border: 2px solid black !important;
    -webkit-transition: all .3s !important;
    -o-transition: all .3s !important;
    transition: all .3s !important;
    vertical-align: top !important;
}
.nav-pagination>li>.current, .nav-pagination>li>span:hover, .nav-pagination>li>a:hover {
    color: #fff !important;
}
.scroll-to-bullets a, .featured-title, .label-new.menu-item > a:after, .nav-pagination > li > .current, .nav-pagination > li > span:hover, .nav-pagination > li > a:hover, .has-hover:hover .badge-outline .badge-inner, button[type="submit"], .button.wc-forward:not(.checkout):not(.checkout-button), .button.submit-button, .button.primary:not(.is-outline), .featured-table .title, .is-outline:hover, .has-icon:hover .icon-label, .nav-dropdown-bold .nav-column li > a:hover, .nav-dropdown.nav-dropdown-bold > li > a:hover, .nav-dropdown-bold.dark .nav-column li > a:hover, .nav-dropdown.nav-dropdown-bold.dark > li > a:hover, .header-vertical-menu__opener, .is-outline:hover, .tagcloud a:hover, .grid-tools a, input[type='submit']:not(.is-form), .box-badge:hover .box-text, input.button.alt, .nav-box > li > a:hover, .nav-box > li.active > a, .nav-pills > li.active > a, .current-dropdown .cart-icon strong, .cart-icon:hover strong, .nav-line-bottom > li > a:before, .nav-line-grow > li > a:before, .nav-line > li > a:before, .banner, .header-top, .slider-nav-circle .flickity-prev-next-button:hover svg, .slider-nav-circle .flickity-prev-next-button:hover .arrow, .primary.is-outline:hover, .button.primary:not(.is-outline), input[type='submit'].primary, input[type='submit'].primary, input[type='reset'].button, input[type='button'].primary, .badge-inner {
    background-color: #187c46 !important;
}
.woocommerce nav.woocommerce-pagination ul
{
    border:none !important;
}
.woocommerce nav.woocommerce-pagination ul li
{
    border-right: none !important;
}