.section01 {
    position: relative;
    padding: 160px 0 240px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background:
        linear-gradient(0deg,
            var(--bg-color) 0.41%,
            var(--bg-color-60) 30%,
            var(--bg-color-00) 50%);
    overflow: hidden;
}

/* body.dark-mode .section01 {
    background:
        linear-gradient(0deg,
            var(--bg-color) 0.41%,
            var(--bg-color-60) 30%,
            var(--bg-color-00) 50%),
        url("../img/herobg-dark.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
} */

.section01 .bg-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.section0101 {
    position: relative;
    padding: 240px 0;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: url(../img/dacquyenbg.jpg) no-repeat;
    background-size: cover;
    background-position: bottom center;
    text-align: center;
    overflow: hidden;
}

.sectiondacquyen02 {
    background: url(../img/dacquyen02.jpg) no-repeat;
    position: relative;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-size: cover;
    background-position: bottom center;
    text-align: center;
    overflow: hidden;
}

.sectiondacquyen03 {
    background: url(../img/dacquyen03.jpg) no-repeat;
    position: relative;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-size: cover;
    background-position: bottom center;
    text-align: center;
    overflow: hidden;
}

.sectiondacquyen04 {
    background: url(../img/dacquyen04.jpg) no-repeat;
    position: relative;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-size: cover;
    background-position: bottom center;
    text-align: center;
    overflow: hidden;
}

.sectiondacquyen05 {
    background: url(../img/dacquyen05.jpg) no-repeat;
    position: relative;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-size: cover;
    background-position: bottom center;
    text-align: center;
    overflow: hidden;
}

.pagenewdetail {
    background: url(../img/newdetailbg.jpg) no-repeat;
}

.section0101 h2,
.section01 h1 {
    display: block;
    /* fix iOS */
    background: linear-gradient(99deg, #A07038 29.86%, #EFDBC2 47.87%, #A07038 69.85%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    /* fallback cho Safari */
    -webkit-text-fill-color: transparent;
    text-align: center;
    /* text-shadow: 0 0 12px rgba(0, 0, 0, 0.2), 0 1px 60px #ffe8a4; */
    font-size: 80px;
    font-weight: bold;
    padding: 20px 0;
    font-family: ggfontbold;
    /* bỏ stroke vì gây lỗi, thay bằng text-shadow giả stroke */
    /* -webkit-text-stroke: 1pxx #EFDBC2; */
}

body.dark-mode .section01 h1 {
    background: linear-gradient(99deg, #F4EDE0 29.86%, #EFDBC2 47.87%, #F4EDE0 69.85%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.section01 .span {
    border-radius: 40px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.20);
    backdrop-filter: blur(16px);
    color: var(--text-color);
    padding: 16px 40px;
    font-size: 18px;
    display: inline-block;
    position: relative;
    overflow: hidden;
}

/* Viền hiệu ứng */
.section01 .span::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 40px;
    padding: 2px;
    /* độ dày stroke */
    background: linear-gradient(90deg, #EFDBC2, var(--bg-color), #EFDBC2, var(--bg-color));
    background-size: 300% 300%;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: 1;
    animation: strokeLine 4s linear infinite;
}

/* Nội dung bên trong nằm trên pseudo-element */
.section01 .span>* {
    position: relative;
    z-index: 2;
}

/* Chạy stroke */
@keyframes strokeLine {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 200% 50%;
    }
}

.section01 .span span img.light1 {
    position: absolute;
    width: 72%;
    top: -32%;
    left: -2%;
}

.section01 .span span img.light2 {
    position: absolute;
    width: 52%;
    bottom: -19%;
    right: 3%;
}

.section01 h3 {
    color: var(--text-color);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
}

.dacquyenThumb .swiper-wrapper {
    overflow: visible;
    padding: 4px 0;
}

.dacquyenThumb .swiper-slide {
    width: auto !important;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s;
    color: var(--text-color);
    opacity: 0.6;
    white-space: nowrap;
    border: 1px solid transparent;
    font-weight: 500;
}

.dacquyenThumb .swiper-slide:hover,
.dacquyenThumb .swiper-slide-thumb-active {
    color: var(--text-color);
    border: 1px solid var(--text-color);
    opacity: 1;
}

.uudaitietkiemlentoi {
    font-size: 24px;
}

.uudaitietkiemlentoi p {
    margin: 8px 0;
    font-weight: bold;
    font-size: 22px;
}

.uudaitietkiemlentoi span {
    font-size: 60px;
    font-weight: bold;
    display: block;
}

.uudaitietkiemlentoi h3 {
    margin-bottom: 0;
    font-size: 36px;
    font-weight: bold;
}

.motietkiemt-button {
    background: var(--bg-button);
    color: var(--text-button);
    border-radius: 24px;
    padding: 12px 24px;
    height: fit-content;
    width: fit-content;
}

.motietkiemt-button:hover {
    background: var(--bg-button);
    color: var(--text-button);
    opacity: 0.8;
}

.motietkiemt-button img {
    width: 24px;
    margin-top: -6px;
    margin-left: 4px;
}

.dacquyen-card {
    background:
        url("../img/bg-dacquyen-card.png") no-repeat,
        rgba(210, 181, 137, 0.08);
    background-position: center top;
    background-size: cover;
    border-radius: 24px;
    border: 1.5px solid rgba(255, 255, 255, 0.50);
    box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);
    backdrop-filter: blur(25px);
    padding: 24px;
}

.card-white-25 {
    background: #ffffff3f;
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}

.section02 .container {
    background: url(../img/section02bg.png) no-repeat;
    background-position: center;
    background-size: cover;
}

.section02 h2 {
    font-weight: bold;
}

.ncb-button {
    background: #222D52;
    color: #fff;
    border-radius: 24px;
    padding: 12px 24px;
}

.ncb-button:hover {
    background: var(--bg-button);
    color: var(--text-button);
}

.card-custom {
    position: relative;
    background: #edecea;
    border-radius: 24px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .05);
    display: flex;
    flex-direction: column;
    border: 1px solid #fff;
    overflow: hidden;
}

.card-custom.blur {
    background:
        url("../img/bg-dacquyen-card.png") no-repeat,
        #edecea;
    background-position: center top;
    background-size: cover;
}

.text-gradient {
    background: linear-gradient(90deg, #141B34 0%, #B99340 50.75%, #141B34 93.42%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gradient2 {
    background: linear-gradient(99deg, #A07038 0.41%, #EAC28F 47.16%, #A07038 94.85%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.card-custom-pt {
    padding: 144px 40px 40px 40px;
}

.card-custom-pt p {
    color: #222D52;
    font-size: 18px;
}

.card-custom-quatang {
    position: relative;
    /* cần cho ::before */
    border-radius: 24px;
    background: linear-gradient(180deg, #09193C 0%, #102B4E 50%, #09193C 100%);
    box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    border: 1px solid #fff;
    overflow: hidden;
    height: 200px;
}

.card-custom-quatang::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    bottom: 12px;
    border-radius: 16px;
    /* vẫn bo tròn */
    padding: 2px;
    /* độ dày viền */
    background: linear-gradient(180deg, #FFD700, #ff8c0034, #ffd90000);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.card-custom-doingu {
    position: relative;
    background: url(../img/doingu-bg.jpg) no-repeat;
    background-position: left center;
    background-size: cover;
    box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05);
    border: 1px solid #fff;
    overflow: hidden;
    border-radius: 24px;
    padding: 40px;
}

.card-custom-doingu p {
    color: #222D52;
}

.card-custom-quatang .card-sticker {
    position: absolute;
    right: 32px;
    top: 32px;
    width: 36px;
}

.card-custom-quatang .light {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -18px;
    height: 60px;
    max-width: 100%;
}

.card-custom .card-sticker {
    position: absolute;
    left: 40px;
    top: 36px;
    width: 40px;
}

.card-custom-doingu .card-sticker {
    position: absolute;
    right: 32px;
    top: 32px;
    width: 36px;
}

.accordion-item {
    background-color: transparent !important;
    /* bỏ nền trắng item */
    border: 1px solid #ddd;
    /* nếu bạn vẫn muốn có viền mảnh */
}

.accordion-button {
    background-color: transparent !important;
    /* bỏ nền trắng button */
    color: var(--text-color);
    font-size: 20px;
    font-weight: 600;
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
    background-color: transparent !important;
    color: var(--text-color) !important;
    box-shadow: none !important;
}

.accordion-body {
    color: var(--text-color);
}

/* Ẩn mũi tên mặc định của Bootstrap */
.accordion-button::after {
    display: none;
}

/* Thêm dấu + mặc định */
.accordion-button::before {
    content: "+";
    font-size: 24px;
    font-weight: bold;
    margin-right: 10px;
    transition: transform 0.2s, content 0.2s;
}

/* Khi mở thì đổi thành dấu – */
.accordion-button:not(.collapsed)::before {
    content: "–";
}


.card-news-big {
    background: linear-gradient(180deg, #09214a, #15396c);
    color: #EAC28F !important;
}

.card-news-big h5 a {
    color: #EAC28F;
}

.card-news-list {
    position: relative;
    background: #edecea;
    border-radius: 24px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .05);
    display: flex;
    flex-direction: column;
    border: 1px solid #fff;
    overflow: hidden;
    gap: 4px !important;
}

/* Zoom In #1 */
.hover01 figure {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background: #fff;
    overflow: hidden;
}

.hover01 figure img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.hover01 figure:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

footer .logo {
    height: 60px;
}

.card-contact {
    background:
        url("../img/bg-dacquyen-card.png") no-repeat,
        rgba(210, 181, 137, 0.08);
    background-position: center top;
    background-size: cover;
    border-radius: 24px;
    border: 1.5px solid rgba(255, 255, 255, 0.50);
    box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);
    backdrop-filter: blur(25px);
}

.card-app {
    border-radius: 24px;
    background: linear-gradient(180deg, #09193C 0%, #102B4E 52.88%, #09193C 100%);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.20);
}

.card-app h4 {
    color: #EAC28F;
}

.card-app h4 span {
    display: block;
    font-size: 32px;
    font-weight: 400;
}

.card-tieuchi {
    border-radius: 24px 0 0 24px;
    padding: 0 20px;
    position: relative;
    color: var(--text-color);
    background: var(--bg-color);
    box-shadow: 0 0 10px rgba(0, 0, 0, .05);
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--text-color);
    border-left: 1px solid var(--text-color);
    border-bottom: 1px solid var(--text-color);
    border-right: none;
    overflow: hidden;
    margin-top: -33px;
}

.card-tieuchi h3 {
    background: linear-gradient(90deg, #141B34 0%, #B99340 50.75%, #141B34 93.42%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    border-bottom: 1px solid #bcbcbc;
    padding: 16px 0;
    font-weight: bold;
    margin: 0;
}


.card-tieuchi ul {
    margin: 0;
    padding: 0;
}

.card-tieuchi ul li:not(:last-child) {
    border-bottom: 1px solid #bcbcbc;
}

.card-tieuchi ul li {
    list-style: none;
    padding: 0;
    margin: 0;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    /* căn text bên trái, nếu muốn giữa thì đổi thành center */
    /* border: 1px solid #ddd; */
    /* thêm viền cho rõ */
    padding: 0 12px;
    text-align: start;
}

.card-tieuchi ul li.small {
    /* font-size: 12px; */
}

.membership-card {
    position: relative;
    border-radius: 24px;
    background: linear-gradient(180deg, #09193C 0%, #102B4E 50%, #09193C 100%);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.20);
    color: #EAC28F;
    padding: 28px 32px 80px 32px;
}

.membership-card::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 150px;
    /* điều chỉnh chiều cao vùng ảnh */
    background: url('../img/camthach.png') no-repeat center bottom / contain;
}

.membership-card::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    bottom: 12px;
    border-radius: 16px;
    /* vẫn bo tròn */
    padding: 2px;
    /* độ dày viền */
    background: linear-gradient(180deg, #FFD700, #ff8c0034, #ffd90000);
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.membership-header {
    font-size: 32px;
    font-style: normal;
    line-height: normal;
    background: linear-gradient(99deg, #A07038 0.41%, #EAC28F 47.16%, #A07038 94.85%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.membership-header .col {
    border-bottom: 1px solid #EAC28F;
    padding: 20px 0;
}


.membership-header .col {
    /* border-bottom: 1px solid #EAC28F; */
    /* padding: 24px 8px; */
    /* position: relative; */
    background: linear-gradient(99deg, #A07038 0.41%, #EAC28F 47.16%, #A07038 94.85%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


.membership-card img.light {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -18px;
    height: 60px;
}

.membership-row .col,
.membership-header .col {
    height: 80px;
    /* 👈 chỉnh chiều cao theo ý bạn */
    display: flex;
    align-items: center;
    /* căn giữa theo chiều dọc */
    justify-content: center;
    /* căn giữa theo chiều ngang */
    /* border: 1px solid #ddd; */
    /* thêm viền để giống bảng */
    /* padding: 10px; */
    text-align: center;
    position: relative;
}

.membership-header .col:not(:last-child):before {
    content: "";
    position: absolute;
    width: 100%;
    height: 32px;
    /* top: 17px; */
    right: 5px;
    background-color: #EAC28F;
    width: 2px;
    transform: rotate(20deg);
    transition: all 0.3s ease-in-out 0s;
}

.membership-row .col {
    border-bottom: 1px solid rgba(234, 194, 143, 0.5);
    font-size: 16px;
    /* height: 95px; */
}

.body-bg {
    background: url(../img/body-bg.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

/* Dark mode */
.dark-mode .body-bg {
    background: none
}

.section0102 {
    margin-top: -120px;
}

.card-new-large {
    background: #222D52;
    min-height: 400px;
    color: #EAC28F;
}

.card-new-large h4 {
    line-height: 1.6;
}

/*===============PRODUCT ITEM==================*/
.product-item {
    margin: 20px 0;
    position: relative;
}

.product-item figure {
    position: relative;
}

.product-item h2 a {
    color: var(--text-color);
    text-decoration: none;
    font-weight: 600;
}

.product-item h2 a:hover {
    text-decoration: underline;
}

.product-item h2 {
    font-weight: 500;
    font-size: 18px;
    margin-top: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-item img {
    border-radius: 12px;
}

.product-item p {
    font-size: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Zoom In #1 */
.hover01 figure {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background: #fff;
    overflow: hidden;
    border-radius: 12px;
}

.hover01 figure img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.hover01 figure:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/* Dark mode đổi icon */
body.dark-mode .icon-login,body.dark-mode .row-cols-lg-3 .col:nth-child(1) .icon-login{
    content: url("../img/dang-nhap-dark.png");
}
body.dark-mode .icon-open,body.dark-mode .row-cols-lg-3 .col:nth-child(2) .icon-login{
    content: url("../img/mo-tk-dark.png");
}

body.dark-mode .icon-info, body.dark-mode .row-cols-lg-3 .col:nth-child(3) .icon-login{
    content: url("../img/nhap-tt-dark.png");
}

body.dark-mode .icon-buoc4, body.dark-mode .row-cols-lg-3 .col:nth-child(4) .icon-login{
    content: url("../img/buoc4dark.png");
}

body.dark-mode .icon-ud1 {
    content: url("../img/uudai1-dark.png");
}

body.dark-mode .icon-ud2 {
    content: url("../img/uudai2-dark.png");
}

body.dark-mode .icon-ud3 {
    content: url("../img/uudai3-dark.png");
}

body.dark-mode .icon-ud4 {
    content: url("../img/uudai4-dark.png");
}

body.dark-mode .icon-nhs1,body.dark-mode .row-cols-lg-4 .col:nth-child(1) .icon-nhs1 {
    content: url("../img/nganhangso1-dark.png");
}

body.dark-mode .icon-nhs2,body.dark-mode .row-cols-lg-4 .col:nth-child(2) .icon-nhs1  {
    content: url("../img/nganhangso2-dark.png");
}

body.dark-mode .icon-nhs3,body.dark-mode .row-cols-lg-4 .col:nth-child(3) .icon-nhs1  {
    content: url("../img/nganhangso3-dark.png");
}

body.dark-mode .icon-nhs4,body.dark-mode .row-cols-lg-4 .col:nth-child(4) .icon-nhs1  {
    content: url("../img/nganhangso4-dark.png");
}

body.dark-mode .motietkiemt-button img {
    content: url("../img/wallet-add-dark.png");
}

.card-news-list img {
    width: 160px !important;
    max-width: 160px !important;
}

.card-news-list p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* số dòng muốn giới hạn */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-contact p.text-muted {
    color: var(--text-color) !important;
    opacity: 0.7;
}

.cot-text-content {
    padding: 40px;
    margin-top: -20px;
}

.form-control-lg {
    font-size: 16px;
}

.card-new-large p.description {
    font-size: 14px;
    opacity: 75%;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* số dòng muốn giới hạn */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#confirm {
    text-align: center;
    color: #222;
    margin-top: 0;

    background-size: cover;
    background-position: top center;
    padding: 140px 0 80px 0;
}

@media (max-width: 767px) {
    #confirm {
        padding: 120px 15px;
    }
}

@-webkit-keyframes checkmark {
    0% {
        stroke-dashoffset: 50px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@-ms-keyframes checkmark {
    0% {
        stroke-dashoffset: 50px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes checkmark {
    0% {
        stroke-dashoffset: 50px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 240px;
    }

    100% {
        stroke-dashoffset: 480px;
    }
}

@-ms-keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 240px;
    }

    100% {
        stroke-dashoffset: 480px;
    }
}

@keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 240px;
    }

    100% {
        stroke-dashoffset: 480px;
    }
}

.inlinesvg .svg svg {
    display: inline;
}

.icon--order-success svg path {
    -webkit-animation: checkmark 0.25s ease-in-out 0.7s backwards;
    animation: checkmark 0.25s ease-in-out 0.7s backwards;
}

.icon--order-success svg circle {
    -webkit-animation: checkmark-circle 0.6s ease-in-out backwards;
    animation: checkmark-circle 0.6s ease-in-out backwards;
}

.blog-details .title {
    font-size: 32px;
    font-weight: bold;
}

.blog-details .description {
    font-size: 16px;
    margin: 16px 0;
    font-weight: bold;
}

.blog-details .meta-top {
    margin-top: 20px;
    color: color-mix(in srgb, var(--default-color), transparent 40%);
}

.blog-details .meta-top ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    align-items: center;
    padding: 0;
    margin: 0;
}

.blog-details .meta-top ul li+li {
    padding-left: 20px;
}

.blog-details .meta-top i {
    font-size: 16px;
    margin-right: 8px;
    line-height: 0;
    color: color-mix(in srgb, var(--default-color), transparent 40%);
}

.blog-details .meta-top a {
    color: color-mix(in srgb, var(--default-color), transparent 40%);
    font-size: 14px;
    display: inline-block;
    line-height: 1;
}

.blog-details .meta-bottom {
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
}

.blog-details .meta-bottom i {
    color: color-mix(in srgb, var(--default-color), transparent 40%);
    display: inline;
}

.blog-details .meta-bottom a {
    color: color-mix(in srgb, var(--default-color), transparent 40%);
    transition: 0.3s;
}

.blog-details .meta-bottom a:hover {
    color: var(--accent-color);
}

.blog-details .meta-bottom .cats {
    list-style: none;
    display: inline;
    padding: 0 20px 0 0;
    font-size: 14px;
}

.blog-details .meta-bottom .cats li {
    display: inline-block;
}

.blog-details .meta-bottom .tags {
    list-style: none;
    display: inline;
    padding: 0;
    font-size: 14px;
}

.blog-details .meta-bottom .tags li {
    display: inline-block;
}

.blog-details .meta-bottom .tags li+li::before {
    padding-right: 6px;
    color: var(--default-color);
    content: ",";
}

.blog-details .meta-bottom .share {
    font-size: 16px;
}

.blog-details .meta-bottom .share i {
    padding-left: 5px;
}

.page-link {
    color: #723909;
}

.page-link:hover,
.page-link:focus {
    color: #723909;
}

.blog-details .content img {
    margin: 16px 0;
    max-width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.p14 p {
    font-size: 14px;
}

.fs14 {
    font-size: 14px;
}

.fs13 {
    font-size: 13px;
}

.fs12 {
    font-size: 12px;
}