pre code,pre code.hljs {
    overflow-x: auto;
    display: block
}

code.hljs,pre code {
    padding: 3px 5px
}

.hljs,pre code {
    background: #000;
    color: #eaeaea
}

.left-container,.news-detail-description>p {
    user-select: none
}

*,.form-input-field,.news-detail-comment-input-box,.outline-btn-2,.pagination .item,.select-box,:after,:before {
    box-sizing: border-box
}

.hljs-emphasis,blockquote {
    font-style: italic
}

@font-face {
    font-family: OpenSans;
    src: url("../fonts/Google-OpenSans-Latin-Normal.woff2") format('woff2');
    font-weight: 400;
    font-display: swap
}

@font-face {
    font-family: OpenSans;
    src: url("../fonts/Google-OpenSans-Regular.woff2") format('woff2');
    font-weight: 400;
    font-display: swap
}

@font-face {
    font-family: OpenSans-SemiBold;
    src: url("../fonts/Google-OpenSans-SemiBold.woff2") format('woff2');
    font-weight: 400;
    font-display: swap
}

@font-face {
    font-family: OpenSans-SemiBold;
    src: url("../fonts/Google-OpenSans-Latin-Semibold.woff2") format('woff2');
    font-weight: 400;
    font-display: swap
}

:root {
    --primary-0: #55ae9b;
    --primary-1: #6cc0ae;
    --primary-2: #9dddcd;
    --primary-3: #b8e7d7;
    --primary-4: #dcf3eb;
    --primary-5: #f5f5f5;
    --white: #ffff;
    --black-1: #0d0c22;
    --black-2: #3d3d4e;
    --black-3: #6e6d7a;
    --black-4: #a9aab8;
    --black-5: #e2e2e2;
    --black-6: #636363;
    --grey-1: #84888f
}

html {
    scroll-behavior: smooth
}

h1,h2,h3,h4 {
    font-family: sans-serif,OpenSans-SemiBold!important
}

* {
    font-family: sans-serif,OpenSans
}

.news-detail-description a,.news-detail-description a *,.news-detail-qa-item a,.news-detail-qa-item a *,a {
    color: var(--primary-0);
    text-decoration: none;
    font-weight: 600
}

.btn-facebook:hover,.btn-goolge:hover,.fb-btn:hover,.first-btn:hover,.form-submit-btn:hover,.modal-content .modal-close-button:hover,.outline-btn-2:hover,.outline-btn:hover,.primary-btn:hover,.second-btn:hover,.third-btn:hover,a:hover {
    opacity: .8
}

body {
    margin: auto;
    background-color: #f5f5f5!important
}

button {
    outline: 0
}

pre {
    margin-bottom: 0!important
}

.mb-10,pre>code {
    margin-bottom: 10px
}

pre code {
    border-radius: 5px
}

pre code.hljs {
    padding: 1em
}

.category-group p,.title1,.title2 {
    font-style: normal
}

.hljs-strong {
    font-weight: 700
}

.hljs-comment,.hljs-quote {
    color: #969896
}

.hljs-deletion,.hljs-name,.hljs-regexp,.hljs-selector-class,.hljs-selector-id,.hljs-tag,.hljs-template-variable,.hljs-variable {
    color: #d54e53
}

.hljs-built_in,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-params,.hljs-type {
    color: #e78c45
}

.hljs-attribute {
    color: #e7c547
}

.hljs-addition,.hljs-bullet,.hljs-string,.hljs-symbol {
    color: #b9ca4a
}

.hljs-section,.hljs-title {
    color: #7aa6da
}

.hljs-keyword,.hljs-selector-tag {
    color: #c397d8
}

header {
    display: block;
    background-color: #fff;
    position: relative;
    z-index: 3
}

header .navbar {
    margin: auto;
    display: flex;
    justify-content: center;
    padding: 0 80px
}

.first-section,header .nav-container {
    display: grid;
    grid-template-rows: 72px
}

header .nav-container {
    grid-template-columns: 70% 10% 20%;
    gap: 0 0;
    grid-auto-flow: row;
    grid-template-areas: "first-section separate second-section";
    width: 100%
}

.first-section {
    grid-area: first-section;
    grid-auto-columns: 1fr;
    grid-auto-rows: 1fr;
    grid-template-columns: 114px 223px 357px;
    gap: 0 32px;
    grid-template-areas: "logo category-group search-bar"
}

.separate {
    grid-area: separate
}

.second-section {
    grid-area: second-section;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end
}

.logo {
    grid-area: logo;
    cursor: pointer
}

.category-group {
    grid-area: category-group;
    display: flex;
    align-items: center
}

.category-group .fas.fa-bars,.category-group .fas.fa-times {
    font-size: 32px;
    color: var(--primary-1);
    cursor: pointer
}

.category-group .fas.fa-bars#menu-icon-shown {
    display: inline-block
}

#list-language,#list-tags,.avatar-mobile-container,.banner-link-facebook-mobile,.banner_toplist_mobile,.btn_openToc,.category-group .fas.fa-bars#menu-icon-hidden,.category-group .fas.fa-times,.current-user-mobile .icon-down #user-fa-chevron-up,.d-none,.d-none-md,.displayNone,.language-dropdown.mobile .fa-chevron-up,.line_mobile,.menu-dropdown.mobile .fa-chevron-up,.news-detail-qa-menu,.overlay_toc,.page_account .form_createArticle_user,.page_article .slim-devider,.page_details .slim-devider,.select-language-popup .list-language .btn-choose-language,.wrap-menu-responsive,.wrap_fromReply,i#menu-icon-hidden {
    display: none
}

.category-group p {
    margin-left: 13px;
    color: var(--black-6);
    font-weight: 500;
    font-size: 30px;
    margin-top: 0;
    margin-bottom: 0
}

.search-bar {
    grid-area: search-bar;
    display: flex;
    align-items: center;
    align-content: center;
    position: relative
}

.search-bar .search-results {
    position: absolute;
    top: 100%;
    left: 0;
    background: #ffff;
    padding: 10px 15px;
    width: 100%;
    display: none;
    overflow-y: scroll;
    max-height: 450px
}

.search-bar .search-results .search-result-title,.sidenav-container .search-results .search-result-title {
    padding: 7px 10px 2.5px;
    font-size: 15px
}

.search-bar .search-results .divider,.sidenav-container .search-results .divider {
    width: 100%;
    height: 2px;
    border-width: 0;
    background: #e8e8e8
}

.search-bar .search-results .list-result,.sidenav-container .search-results .list-result {
    list-style: none;
    margin: 0;
    padding: 0
}

.right-container .form-title,.search-bar .search-results .list-result .result-item,.sidenav-container .search-results .list-result .result-item {
    margin: 5px 0
}

.search-bar .search-results .list-result .result-item .result-item-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: #636363;
    cursor: pointer;
    margin: 25px 0
}

.search-bar .search-results .list-result .result-item .result-item-wrapper:hover,.sidenav-container .search-results .list-result .result-item .result-item-wrapper:hover {
    background-color: var(--primary-3)
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .title {
    font-size: 14px;
    font-weight: 500;
    margin-top: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .image {
    display: block;
    height: 70px;
    border-radius: 3px;
    background: grey;
    float: left;
    min-width: 70px;
    width: 70px;
    align-self: flex-start;
    object-fit: cover
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .content,.sidenav-container .search-results .list-result .result-item .result-item-wrapper .content {
    margin-left: 10px;
    padding: 0 5px 5px
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .content .desc,.sidenav-container .search-results .list-result .result-item .result-item-wrapper .content .desc {
    font-size: 12px;
    font-weight: 300;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

.input-icon i.icon {
    top: 50%;
    position: absolute;
    color: var(--black-4);
    left: 10px;
    width: 14px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%)
}

.pdt-0,.sidenav-container .input-icon i.icon {
    padding-top: 0
}

.input-field {
    width: 357px;
    padding: 10px 10px 10px 35px;
    border: none;
    background-color: #f3f3f3;
    border-radius: 10px
}

.input-field:focus {
    border: none;
    outline: 0
}

.input-field::placeholder {
    color: var(--black-4);
    font-size: 16px;
    padding: 10px
}

.navbar .nav-container .logo {
    font-size: 40px;
    font-weight: 600;
    color: var(--primary-1);
    margin: 0;
    display: flex;
    align-items: center
}

.button-form-campaign {
    position: absolute;
    top: 16%;
    right: 4%
}

.button-form-campaign span {
    padding: 4px 8px;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    display: inline-block;
    background-color: #e51b28;
    font-weight: 600
}

.button-form-campaign-mobile {
    position: absolute;
    top: 50%;
    right: 2%;
    height: 35%;
    width: 33.6%;
    transform: translate(0,-50%);
    text-align: center
}

.button-form-campaign-mobile span {
    width: min-content;
    white-space: nowrap;
    padding: 0 6%;
    height: 100%;
    border-radius: 4px;
    line-height: 200%;
    box-shadow: 0 4px 10px 0 #153A364D;
    text-decoration: none;
    color: #fff;
    font-size: 4vw;
    display: inline-block;
    background-color: #e51b28;
    font-weight: 700
}

.banner-link-facebook,.half-left-container .news-item .news-information,.ml-20 {
    margin-left: 20px
}

.img-100per,.img-banner-link-facebook {
    width: 100%;
    height: 100%
}

.language {
    display: flex;
    align-items: center;
    margin-right: 25px
}

.language .i-globe {
    color: var(--black-3)
}

.language .language-dropdown {
    margin-left: 10px;
    display: flex;
    align-items: center;
    cursor: pointer
}

.language .language-dropdown p {
    font-size: 16px
}

.language .language-dropdown i {
    margin-left: 10px;
    color: var(--black-3)
}

.language-dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,.2);
    top: 40px;
    z-index: 1;
    width: 140px
}

.outline-btn,.primary-btn {
    padding: 8px 18px 10px;
    box-shadow: none;
    font-size: 16px;
    height: 40px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap
}

.dropdown:hover .language-dropdown-content {
    display: block;
    background: #fff;
    box-shadow: 0 0 14px 1px rgba(0,0,0,.1);
    border-radius: 15px
}

.language-dropdown-content .language-option {
    padding: 12px;
    cursor: pointer
}

.language-dropdown-content .language-option:hover {
    background-color: var(--primary-4);
    border-top-left-radius: 15px;
    border-top-right-radius: 15px
}

.language-dropdown-content .language-option:last-child:hover {
    background-color: var(--primary-4);
    border-radius: 0 0 15px 15px
}

.primary-btn {
    background-color: var(--primary-1);
    color: #fff;
    border-radius: 10px;
    border: none;
    margin-right: 16px
}

.outline-btn {
    background-color: #fff;
    color: var(--primary-1);
    border-radius: 10px;
    border: 1px solid var(--primary-1)
}

.outline-btn-2 {
    background: #fff;
    cursor: pointer;
    border: .5px solid #acacb9;
    border-radius: 10px;
    padding: 12px 49px
}

.title1 {
    font-family: OpenSans;
    font-weight: 600;
    font-size: 22px;
    margin: 0;
    color: #313131
}

.title2,.title3 {
    font-weight: 600;
    color: var(--black-1)
}

.title2 {
    font-family: OpenSans-SemiBold;
    font-size: 20px;
    margin: 0
}

.title3,.title3-a {
    font-size: 16px;
    margin: 0;
    font-style: normal;
    font-family: OpenSans-SemiBold
}

.title3-a {
    font-weight: 400;
    color: var(--black-2)
}

.body1,.body2,.p-black2,.title4 {
    font-size: 14px
}

.title4 {
    font-family: OpenSans-SemiBold;
    font-style: normal;
    font-weight: 600;
    margin: 0;
    color: var(--black-1)
}

.body1,.body2,.body3,.p-black2 {
    font-weight: 400;
    font-style: normal;
    margin: 0;
    color: var(--black-1);
    font-family: OpenSans
}

.body3 {
    font-size: 13px
}

.p-black1 {
    font-family: OpenSans;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    margin: 0;
    color: var(--black-1)
}

.banner-text,.figures,.quote-text {
    font-weight: 400;
    font-style: normal
}

.flex-row,.half-left-container .news-item,.social-button {
    display: flex;
    flex-direction: row
}

.c-pointer,.pointer,.wrap-title img {
    cursor: pointer
}

.figures {
    font-size: 14px;
    color: var(--black-6)
}

.fb-btn {
    background-color: #408bc1;
    color: #fff;
    height: 20px;
    border: none;
    border-radius: 5px;
    margin-left: 20px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    cursor: pointer
}

.fb-btn i {
    font-size: 12px;
    margin-right: 5px
}

.select-box {
    background: #fff;
    border: .5px solid #a9aab8;
    border-radius: 10px;
    width: 176px;
    height: 36px;
    padding-left: 14px;
    padding-right: 14px;
    outline: 0;
    color: #3d3d4e
}

.form-account .form-input-field:focus,.form-input-field:focus,.posts-container .filter-container .select-box:focus,.select-box:focus {
    border-color: var(--primary-0);
    box-shadow: 0 0 5px rgba(108,192,174,.3)
}

.divider {
    border: 2px solid #6cc0ae;
    border-radius: 5px;
    margin-top: 15px;
    margin-bottom: 20px
}

.category-group {
    grid-area: category-group
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1500;
    top: 0;
    left: 0;
    background-color: #fff;
    overflow-x: hidden;
    transition: .5s
}

.sidenav .head-logo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px
}

.sidenav .head-logo .logo {
    font-size: 28px
}

.sidenav-container {
    border-top: 1px solid #e9f4f0;
    padding-top: 20px;
    position: relative;
    padding-left: 12px;
    padding-right: 12px
}

.sidenav-container .search-results {
    position: absolute;
    width: 100%;
    background: #fff;
    top: 70px;
    display: none;
    padding: 10px;
    left: 0;
    overflow-y: scroll;
    max-height: 450px;
    z-index: 10
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 5px 14px;
    color: #636363;
    cursor: pointer;
    margin: 25px 0
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper .image {
    display: block;
    height: 70px;
    border-radius: 3px;
    background: grey;
    float: left;
    width: 100px;
    min-width: 100px;
    align-self: flex-start
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper .title {
    font-size: 14px;
    margin-top: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

.sidenav #closebtn {
    font-size: 20px;
    display: none;
    color: #414042;
    transform: rotate(90deg);
    cursor: pointer
}

.avatar-author {
    border-radius: 50%
}

#btnregister,#change-password,#information,#settings,.banner_toplist_desktop,.card_sidebar,.category .dropdown i#menu-icon-shown,.current-user-mobile .icon-down #user-fa-chevron-down,.current-user:hover .user-dropdown-content,.d-block,.d-none-mobile,.d-none-sm,.desktop-footer-banner,.desktop-top-banner,.dropdown-calendar.show,.language-dropdown.mobile .fa-chevron-down,.menu-dropdown.mobile .fa-chevron-down,input[id=open_optionAccount]:checked~.list-filter-responsive,input[name=open_formReply]:checked+.wrap_fromReply,input[name=tab_create_article][id=tab_category]:checked~.wrap_content_form .content_tab-category,input[name=tab_create_article][id=tab_content]:checked~.wrap_content_form .content_tab-content,input[name=tab_create_article][id=tab_seo]:checked~.wrap_content_form .content_tab-seo,input[name=tab_create_article][id=tab_title]:checked~.wrap_content_form .content_tab-title {
    display: block
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top:15px
    }

    .sidenav a {
        font-size: 18px
    }
}

@media only screen and (max-width: 1920px) {
    .category-group .fas.fa-bars#menu-icon-hidden,.sidenav {
        display:none
    }
}

@media only screen and (max-width: 1240px) {
    .footer,.homepage-container,header .navbar {
        padding:20px 40px!important
    }
}

@media only screen and (max-width: 1160px) {
    .footer,.homepage-container,header .navbar {
        padding:20px!important
    }
}

@media only screen and (max-width: 850px) {
    .category-group .fas.fa-bars#menu-icon-hidden {
        display:block!important
    }

    .banner_toplist_desktop,.language {
        display: none
    }

    .banner_toplist_mobile {
        display: block;
        width: 100%
    }

    .banner {
        flex-direction: column;
        text-align: center
    }

    .banner .primary-btn {
        margin-top: 12px
    }

    .norms {
        margin-top: 30px!important
    }

    .pagination .item {
        width: 36px!important;
        height: 36px;
        font-size: 16px!important;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .norms p {
        font-size: 14px!important
    }

    .ft-slogan {
        width: 100%!important;
        text-align: left;
        font-size: 14px
    }

    .ft-list-ul>li>a {
        color: #313131!important;
        font-style: normal;
        font-size: 14px
    }

    .wrap-icon {
        margin-top: 22px!important
    }
}

.norms,.pagination .item,.text-align-center,.text-center {
    text-align: center
}

#list-tags,.gray-divider,.mt-20 {
    margin-top: 20px
}

.search-container-mobile {
    display: flex;
    justify-content: center;
    margin-bottom: 10px
}

.search-container-mobile .search-bar-mobile.input-icon {
    width: 100%!important;
    display: flex;
    align-items: center;
    position: relative
}

.search-container-mobile .search-bar-mobile .input-field {
    width: 100%!important
}

.language-dropdown.mobile,.menu-dropdown.mobile {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    width: 100%;
    height: 48px
}

.menu-dropdown.mobile,.pdb-0 {
    padding-bottom: 0
}

.icon-down,.language-dropdown.mobile i,.menu-dropdown.mobile i {
    color: #6e6d7a
}

.menu-dropdown-title {
    font-size: 24px
}

.banner-text,.current-user-mobile .text-name {
    font-size: 15px
}

.language-dropdown.mobile p,.menu-dropdown.mobile p {
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    color: #3d3d4e;
    display: block;
    transition: .3s
}

.gray-divider {
    width: 100%;
    height: .5px;
    background-color: #d8d8d8;
    margin-bottom: 30px
}

.banner-text,.mb-0 {
    margin-bottom: 0
}

#list-language {
    padding: 0 12px
}

#list-language .language-item {
    display: flex;
    width: 100%;
    height: 48px;
    align-items: center
}

#list-language .language-item i {
    color: #6e6d7a;
    margin-right: 11px;
    visibility: hidden
}

#list-language .language-item.active i {
    visibility: visible
}

.current-user-mobile,.jc-between {
    justify-content: space-between
}

.current-user-mobile,.current-user-mobile .user {
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
    padding: 5px 0
}

.current-user-mobile .wrap-avatar {
    width: 34px;
    height: 34px
}

.user-dropdown-content-mobile {
    display: none;
    color: #3d3d4e;
    padding: 0 17px
}

.user-dropdown-content-mobile .user-option {
    margin-top: 27px;
    padding: 0 12px
}

.user-dropdown-content-mobile .gray-divider {
    margin-top: 27px;
    width: 90%
}

.figure-style {
    height: 32px;
    justify-content: flex-end;
    margin-top: 15px
}

.banner-text,.mt-0 {
    margin-top: 0
}

.banner-text {
    font-family: OpenSans
}

.thumnail {
    width: 187px;
    height: 120px;
    object-fit: cover
}

@media only screen and (max-width: 760px) {
    header .navbar {
        padding:0 12px!important
    }

    header .navbar .logo {
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        font-family: OpenSans;
        padding: 12px
    }

    .banner {
        padding: 20px 12px!important
    }

    .category-group p,.second-section .outline-btn,.second-section .primary-btn {
        display: none
    }

    .nav-container {
        display: grid!important;
        grid-template-columns: 100%!important;
        grid-template-rows: 48px!important;
        grid-auto-columns: 1fr;
        grid-auto-rows: 1fr;
        gap: 0 0!important;
        grid-auto-flow: row!important;
        grid-template-areas: "first-section"!important;
        align-items: center!important
    }

    .first-section {
        display: grid;
        grid-template-columns: 20% 1fr 20%;
        grid-template-rows: 1fr;
        gap: 0 0;
        grid-auto-flow: row;
        grid-template-areas: "logo . category-group";
        grid-area: first-section
    }

    .category-group {
        justify-content: flex-end
    }

    .tags-authors-otherNews {
        grid-template-columns: auto!important;
        grid-auto-rows: auto!important
    }

    .authors {
        margin-right: 20px
    }

    .title2 {
        font-size: 15px
    }

    .current-user {
        display: none!important
    }
}

.align-items-center-grid,.avatar-datetime,.comments,.small-information,.views,.wrap-title {
    align-items: center
}

@media only screen and (max-width: 550px) {
    .fb-btn {
        margin-left:0;
        float: left
    }

    .btn-container {
        width: 100%
    }
}

.work-break {
    word-wrap: break-word;
    width: 100%
}

.mg-0,p {
    margin: 0
}

.mr-0,.wrap_menu_new .menu_new .menu_new_item:last-child {
    margin-right: 0
}

.ml-0,.page_article .ft-content:nth-child(2),.page_category .ft-content:nth-child(2) {
    margin-left: 0
}

.ml-3per {
    margin-left: 3%
}

.ml-10per {
    margin-left: 10%
}

.mt-4 {
    margin-top: 4px
}

.mr-5,.wrap_toc .title_toc i {
    margin-right: 5px
}

.mt-6 {
    margin-top: 6px
}

.mr-15-important {
    margin-right: 15px!important
}

.mt-8 {
    margin-top: 8px
}

.mt-12 {
    margin-top: 12px
}

.ml-12 {
    margin-left: 12px
}

.mt-14 {
    margin-top: 14px
}

.mt-16 {
    margin-top: 16px
}

.mb-16 {
    margin-bottom: 16px
}

.mb-4 {
    margin-bottom: 4px
}

.mt-17 {
    margin-top: 17px
}

.mt-18 {
    margin-top: 18px
}

.mb-18 {
    margin-bottom: 18px
}

.mr-20 {
    margin-right: 20px
}

.ml-40 {
    margin-left: 40px
}

.mb-20,.posts-container .title2 {
    margin-bottom: 20px
}

.ab-description-3,.mt-30,.table-container,.title1.mb-30.mt-0,.wrap-tags {
    margin-top: 30px
}

.pd-0 {
    padding: 0
}

.pdl-0 {
    padding-left: 0
}

.pdr-0 {
    padding-right: 0
}

.pdr-12 {
    padding-right: 12px
}

.pdr-15,blockquote {
    padding-right: 15px
}

.pdl-12 {
    padding-left: 12px
}

.fontsize-26 {
    font-size: 26px
}

.fontsize-12 {
    font-size: 12px
}

.quote-text {
    margin: 15px 0 0;
    font-size: 16px;
    line-height: 24px;
    color: var(--black-2)
}

.line-height-22,.text-name {
    line-height: 22px
}

.color-primary-0,.news-detail-tags-item.tagsStyle_2:hover a,.wrap_box_tags .box_tags .news-detail-tags-item:hover a,.wrap_menu_new .menu_new .menu_new_link:hover {
    color: var(--primary-0)
}

.color-black-2 {
    color: var(--black-2)
}

.action-container>.title3.tablinks.selected,.action-container>p>a:hover {
    color: #3d3d4e!important;
    text-decoration: none
}

.align-items-center,.student-avatarSummary {
    display: flex;
    align-items: center
}

.justify-space-between,.top-authors {
    display: flex;
    justify-content: space-between
}

.justify-center,.left-content {
    display: flex;
    justify-content: center
}

.container-square-1 .text-square1,.flex-column {
    display: flex;
    flex-direction: column
}

.ellipsis-1,.ellipsis-2,.ellipsis-3 {
    text-overflow: ellipsis;
    display: -webkit-box;
    overflow: hidden
}

.contact-map,.full-width,.login-page-mobile .form-input-field,.news-item .news-information,.right-container,.right-container-w-post,.w-100per,.wrap_sidebar_details .other-news {
    width: 100%
}

.w-90per {
    width: 90%
}

.tag-col,.w-50per {
    width: 50%
}

.btn_reply:hover,.option_checkbox .nameOption:hover,.underline-text,.wrap_toc li:hover {
    text-decoration: underline
}

.dropdown-toggle.select-box,.news-detail-student-slider-container,.pos-relative,.wrap_hidden_fixed_toc {
    position: relative
}

.radius-50 {
    border-radius: 100%
}

.radius-10px {
    border-radius: 10px
}

.radius-20px {
    border-radius: 20px
}

.img-8px {
    width: 8px;
    height: 8px
}

.img-16px {
    width: 16px;
    height: 16px
}

.img-22px {
    width: 22px;
    height: 22px
}

.img-26px,.wrap-avatar {
    width: 26px;
    height: 26px
}

.img-32px {
    width: 32px;
    height: 32px
}

.img-80px {
    width: 80px;
    height: 80px
}

.img-104px {
    width: 104px;
    height: 104px
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.ellipsis-1 {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

.ellipsis-2 {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.card_sidebar .card_sidebar-title,.ellipsis-3 {
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.fweight-60,.other-news-summary-title {
    font-weight: 600
}

.fw-normal,.fweight-normal,.normal-a-tag {
    font-weight: 400
}

.opensans {
    font-family: OpenSans
}

.gap-30 {
    gap: 30px
}

.normal-a-tag {
    color: #3d3d4e!important
}

.category p,.logo,.text-name {
    font-weight: 600
}

.w3-modal {
    z-index: 10
}

.banner {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 33px;
    background-color: #e9f4f0
}

.banner h2 {
    color: #0d0c22
}

#body {
    background-color: var(--primary-5)
}

.header-container {
    height: 72px;
    background-color: #fff;
    gap: 20px;
    padding: 0 80px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    z-index: 2;
    position: relative
}

.category,.logo-category-search {
    display: flex;
    flex-direction: row
}

.logo-category-search {
    align-items: center
}

.logo {
    font-family: OpenSans;
    font-style: normal;
    font-size: 40px;
    color: #6cc0ae!important;
    margin-right: 31px
}

.category {
    align-items: center;
    margin-right: 38px
}

.category .title {
    font-size: 32px;
    margin-left: 7.5px
}

.category .dropdown i#menu-icon-shown,i#menu-icon-hidden {
    font-size: 32px!important;
    color: #6cc0ae;
    margin-right: 13px;
    cursor: pointer
}

.category p {
    font-family: OpenSans;
    font-style: normal;
    font-size: 36px;
    color: #636363
}

.dropdown,.dropdown>i#menu-icon#shown {
    position: relative;
    display: inline-block
}

.dropdown>i#hidden {
    position: relative;
    display: none
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 673px;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,.2);
    padding: 12px 16px;
    z-index: 1;
    max-width: 673px
}

.dropdown:hover .dropdown-content {
    display: block;
    background: #fff;
    box-shadow: 0 0 14px 1px rgba(0,0,0,.1);
    border-radius: 15px;
    padding: 24px
}

.language-signin-signup,.language-signin-signup .dropdown {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 100%
}

.language-signin-signup .language-dropdown-content {
    top: 55px
}

.language {
    height: 100%
}

.current-user {
    align-items: center;
    display: none;
    height: 100%;
    position: relative
}

.user-avatar {
    width: 100%;
    border-radius: 100%
}

.text-name {
    margin-left: 10px;
    white-space: nowrap;
    font-size: 14px;
    color: #3d3d4e;
    margin-right: 20px
}

.user-dropdown-content {
    display: none;
    position: absolute;
    min-width: 160px;
    background: #fff;
    box-shadow: 0 0 14px 1px rgba(0,0,0,.1);
    top: 55px;
    z-index: 1;
    width: 210px;
    border-radius: 15px;
    padding: 10px 0
}

.user-dropdown-content .user-option {
    padding: 14px 20px;
    white-space: nowrap;
    cursor: pointer
}

.dropdown-month .current-month,.dropdown-month .month-item:hover,.dropdown-years .current-year,.dropdown-years .year-item:hover,.user-dropdown-content .user-option-selected,.user-dropdown-content .user-option:hover {
    background-color: #dcf3eb
}

.categories-tags {
    cursor: pointer;
    background: #ebebeb;
    border-radius: 10px;
    padding: 6px 12px;
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 10px
}

.categories-tags a {
    color: #636363!important;
    font-weight: 400;
    font-size: 13px
}

.content-container {
    width: 100%;
    padding: 40px 80px;
    display: flex;
    flex-direction: row;
    gap: 30px
}

.half-left-container {
    width: 50%;
    display: flex;
    flex-direction: column
}

.avatar-datetime .author-avatar {
    margin-right: 10px;
    border-radius: 50%;
    width: 22px;
    height: 22px
}

.sm-icon {
    color: var(--black-6);
    margin-right: 5px
}

.half-right-container {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 37px
}

a.title2.c-pointer {
    color: #0d0c22!important
}

@media only screen and (max-width: 1310px) {
    .content-container,.header-container {
        padding:0 12px
    }

    .content-container {
        margin-top: 22px;
        gap: 0
    }

    .category,.category .dropdown i#menu-icon-shown,.language-signin-signup,.search-bar {
        display: none!important
    }

    #menu-icon-hidden,.sidenav {
        display: block!important
    }

    .logo-category-search {
        width: 100%;
        justify-content: space-between
    }

    .half-right-container {
        margin-right: 30px
    }

    .w-100per.flex-row.gap-30 {
        gap: 10px
    }
}

@media only screen and (max-width: 1220px) {
    .logo {
        font-size:28px
    }

    #menu-icon-hidden {
        font-size: 20px
    }

    .banner h2 {
        font-size: 22px
    }

    .banner button {
        font-size: 14px;
        height: 34px;
        display: flex;
        align-items: center
    }

    .content-container {
        gap: 20px
    }

    .half-right-container {
        width: 46%
    }

    .thumnail {
        width: 130px;
        height: 80px
    }

    .w-100per.flex-row.gap-30 {
        display: flex;
        flex-direction: column
    }

    .tag-col {
        width: 100%
    }
}

@media only screen and (max-width: 1090px) {
    .btn-container .fb-btn {
        margin-left:0
    }

    .small-information.flex-row .btn-container {
        margin-top: 6px
    }

    .views.flex-row {
        margin-left: 10px
    }

    .form-submit-btn {
        width: 100%;
        margin: 4px 0
    }
}

@media only screen and (max-width: 960px) {
    .first-btn.first,.second-btn.second,.third-btn.third {
        height:28px!important;
        font-size: 14px!important;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .content-container {
        flex-direction: column;
        align-items: center
    }

    .divider,.half-left-container {
        width: 100%
    }

    .half-right-container {
        width: 100%;
        margin-right: 0
    }

    .small-information.flex-row {
        flex-direction: row;
        word-break: normal
    }

    .btn-container {
        margin-top: 6px
    }

    .tag-col {
        width: 90%
    }

    .first-btn.first {
        justify-content: center;
        padding: 17px 10px!important;
        margin-left: 7px;
        margin-right: 7px!important
    }

    .second-btn.second,.third-btn.third {
        padding: 17px 12px!important
    }

    .norms {
        margin: 0 12px
    }
}

@media only screen and (max-width: 500px) {
    .small-information.flex-row {
        flex-direction:column!important;
        display: contents
    }

    .small-information.flex-row .btn-container,.small-information.flex-row .flex-row {
        width: 60%;
        display: flex;
        justify-content: left;
        font-size: 12px
    }
}

@media only screen and (max-width: 320px) {
    .small-information.flex-row .flex-row {
        flex-wrap:wrap
    }

    .first-btn.first {
        padding: 17px 10px!important
    }

    .second-btn.second,.third-btn.third {
        padding: 17px 12px!important
    }
}

.pagination {
    display: flex;
    justify-content: center;
    margin-top: 10px;
    margin-bottom: 25px;
}

.pagination .item {
    padding: 5px 0;
    width: 40px;
    margin: 0 5px;
    border-radius: 10px;
    border: 1px solid #a9aab87a;
    font-size: 20px;
    cursor: pointer
}

.pagination .item-select {
    background-color: #6cc0ae;
    border: 1px solid #6cc0ae;
    color: #fff
}

.norms {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 35px;
    padding-bottom: 75px
}

.buttons {
    display: flex;
    margin: auto auto 20px
}

.author-buttons {
    display: flex;
    margin-bottom: 20px;
    margin-top: 16px
}

.buttons .first-btn.first {
    margin: 0 12px 0 0;
    height: 38px;
    background-color: #24cb99;
    border-radius: 10px;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    text-align: center;
    color: #fff;
    padding: 0 31px
}

.buttons .second-btn.second,.buttons .third-btn.third {
    margin: 0 12px 0 0;
    height: 38px;
    border-radius: 10px;
    font-style: normal;
    font-size: 14px;
    align-items: center;
    color: #fff;
    padding: 0 31px;
    font-weight: 600;
    display: flex;
    text-align: center
}

.buttons .second-btn.second {
    background: #008cf1
}

.buttons .third-btn.third {
    background: #49b3ff
}

footer {
    background-color: #ebebeb
}

.footer {
    display: flex;
    margin-top: 60px;
    padding: 47px 80px
}

.ft-logo {
    font-size: 40px;
    font-weight: 600;
    color: var(--primary-1);
    margin: -10px 0 0;
    display: flex;
    align-items: center
}

.ft-list-ul li,.ft-slogan {
    font-style: normal;
    font-weight: 400;
    font-size: 14px
}

.ft-slogan {
    margin-top: 10px;
    text-align: justify;
}

.ft-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    padding: 5px;
    flex-basis: 25%;
    color: #31313e;
    margin-top: 48px
}

.ft-content:nth-child(2),.news-detail-comment-item_reply {
    margin-left: 50px
}

.wrap-icon {
    margin-top: 35px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px
}

.ft-title {
    margin: 0 0 16px;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px
}

@media screen and (max-width: 600px) {
    .banner h2 {
        font-size:4.26vw;
        line-height: 6.4vw
    }

    .banner .ml-10per {
        margin-left: 0
    }

    .banner .primary-btn {
        margin-top: 3.2vw;
        font-size: 3.73vw;
        padding: 2.1vw 1.6vw
    }

    .ft-title {
        font-size: 4.8vw;
        margin-bottom: 5.33vw
    }

    .other-news+.slim-devider {
        margin-top: 6vw!important
    }

    .ft-content+.slim-devider {
        margin-bottom: 0!important
    }
}

.ft-list-ul {
    line-height: 34px;
    margin: 0;
    padding: 0;
    list-style-type: none
}

.ft-list-ul li {
    cursor: pointer
}

.modal-content {
    width: 460px;
    margin: auto;
    background-color: #fdfdfd;
    position: relative;
    padding: 0;
    outline: 0;
    box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%),0 4px 20px 0 rgb(0 0 0 / 19%);
    text-align: center;
    border-radius: 20px
}

.modal-content .modal-close-button {
    cursor: pointer;
    padding: 12px;
    font-size: 25px
}

.modal-content .modal-content-container {
    padding: 30px 40px
}

.form-input-field {
    width: 380px;
    height: 48px;
    background: #fff;
    border: .5px solid #a9aab8;
    border-radius: 10px;
    outline: 0;
    margin-bottom: 16px;
    padding-left: 18px
}

.center-box {
    width: 460px;
    height: 322px;
    margin: 210px auto auto;
    background: #fdfdfd;
    box-shadow: 2px 2px 12px rgba(0,0,0,.1);
    border-radius: 20px;
    text-align: center
}

.center-box .center-box-content {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 30px 40px
}

.login-page-mobile {
    border-top: .5px solid #d8d8d8;
    padding: 50px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    height: 100%
}

.login-page-mobile .outline-btn-2 {
    font-weight: 600;
    font-size: 14px;
    color: #3d3d4e;
    display: flex;
    align-items: center;
    justify-content: center
}

.news-detail-container,.sub-category-container,.super-category-container {
    padding: 40px 80px;
    height: 100%
}

.sub-category-content,.super-category-content {
    width: 100%;
    display: grid;
    grid-template-columns: 3fr 1fr;
    grid-template-rows: 100%;
    gap: 0 30px;
    grid-template-areas: "card-news topicThumbnail-orders-relativeTopics"
}

.card-news {
    grid-area: card-news;
    margin-right: 20px
}

.card-news-title {
    font-size: 21px;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    gap: 10px
}

.author-title {
    size: 14px;
    font-weight: 400;
    line-height: 22px
}

.author-description {
    margin: 0 auto
}

.infor {
    margin-left: 26px
}

.topicThumbnail-orders-relativeTopics {
    grid-area: topicThumbnail-orders-relativeTopics
}

.first-btn {
    background: #008cf1;
    cursor: default
}

.second-btn {
    background: #24cb99;
    cursor: default
}

.third-btn {
    background: #49b3ff;
    cursor: default
}

.first-btn,.second-btn,.third-btn {
    border-radius: 10px;
    padding: 7px 25px;
    color: #fff;
    display: flex;
    align-items: center;
    margin-right: 12px;
    font-weight: 400;
    font-size: 14px
}

@media only screen and (max-width: 760px) {
    .sub-category-container,.super-category-container {
        padding:40px 15px!important
    }

    .first-btn.mobile,.second-btn.mobile,.third-btn.mobile {
        width: 65px!important;
        height: 20px!important;
        font-size: 12px
    }
}

.my-wrapper {
    width: 95%;
    margin: auto;
    overflow: hidden
}

.news-detail-content {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.news-detail {
    width: calc(70% - 30px);
    margin-right: 30px
}

.other-news,.wrap_sidebar_details {
    width: 30%
}

.news-detail-title {
    font-weight: 600;
    font-size: 30px
}

.news-detail-description {
    margin-top: 23px;
    font-size: 15px;
    line-height: 1.5
}

.news-detail-description ul,.news-detail-qa-item ul {
    list-style: unset
}

.slim-devider {
    width: 100%;
    height: .5px;
    background-color: #a9aab8
}

.news-detail-student-slider {
    margin-top: 30px;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative
}

.horizon-next,.horizon-prev {
    position: absolute;
    top: 48%;
    cursor: pointer
}

.horizon-prev {
    left: 10px
}

.horizon-next {
    right: 10px
}

.student-item {
    background-color: #fff;
    padding: 10px 25px;
    border-radius: 10px 80px 10px 10px;
    width: 346px;
    line-height: 16px;
    font-size: 12px;
    margin-right: 10px
}

.student-avatar {
    width: 74px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 20px;
    margin-right: 10px
}

.news-item .wrap_thumbnail img,.size_img,.student-avatar img,.wrap_thumbnail_form img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.student-name {
    line-height: 22px;
    font-weight: 600
}

.student-level {
    font-size: 12px;
    line-height: 16px
}

.star-rate {
    margin-top: 10px
}

.d-flex,.news-detail-comment-item-nameDate,.student-skill {
    display: flex
}

.student-skill-label,.student-summary-label {
    font-weight: 600;
    margin-right: 5px;
    line-height: 16px;
    width: 80px
}

.student-skill-value {
    margin-left: 10px;
    width: 70%
}

.line-rate-item {
    height: 20px;
    display: flex;
    align-items: center;
    margin-top: 1px
}

.line-rate {
    width: 100%;
    height: 6px;
    border-radius: 10px;
    background-color: #f3f3f3
}

.line-rate-value {
    height: 100%;
    border-radius: 10px;
    background-color: var(--primary-0)
}

.news-detail-qa {
    margin-top: 40px
}

.news-detail-qa-title {
    font-weight: 600;
    font-size: 22px
}

.news-detail-qa-menu {
    position: fixed;
    top: 180px;
    left: 2%
}

@-webkit-keyframes menuBouncing {
    from {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.news-detail-qa-menu-mobile-fixed {
    position: fixed!important;
    bottom: 5px;
    top: unset!important;
    left: 20px;
    height: 50px;
    -webkit-animation: .6s ease-in-out menuBouncing;
    -moz-animation: .6s ease-in-out menuBouncing;
    -o-animation: .6s ease-in-out menuBouncing;
    animation: .6s ease-in-out menuBouncing
}

.news-detail-qa-number {
    width: 30px;
    height: 30px;
    margin-top: 5px;
    border-radius: 100%;
    background-color: var(--primary-0);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    cursor: pointer
}

.news-detail-qa-content {
    margin-top: 24px
}

.news-detail-qa-item {
    background-color: #fff;
    border-radius: 20px;
    padding: 20px;
    margin-bottom: 30px
}

.news-detail-qa-item-title {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 20px
}

.news-detail-qa-item-number {
    margin-right: 10px;
    width: 25px;
    height: 25px;
    border-radius: 10px;
    background-color: var(--primary-0);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff
}

.news-detail-qa-item-author {
    margin-top: 20px;
    max-width: 386px;
    width: 50%;
    background-color: #fbfbfb;
    box-shadow: 0 4px 4px rgba(0,0,0,.05);
    border-radius: 20px;
    padding: 17px;
    display: flex;
    align-items: center;
    cursor: pointer
}

.news-detail-qa-item-author-avatar {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 100%;
    margin-right: 17px
}

.news-detail-social-button,.news-detail-tags-item {
    border-radius: 10px;
    justify-content: center;
    cursor: pointer
}

.news-detail-social {
    display: flex;
    margin: 30px -10px 20px
}

.news-detail-social-button {
    width: 221px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    color: #fff;
    font-weight: 600;
    margin: 0 12px
}

.btn-facebook {
    background-color: #408bc1
}

.btn-goolge {
    background-color: #d9534f
}

.news-detail-tags {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px 30px
}

.news-detail-tags-item {
    background: #e8e8e8;
    height: 30px;
    margin: 0 12px 10px;
    line-height: 22px;
    padding: 0 10px;
    display: flex;
    align-items: center
}

.news-detail-comment-input-box {
    width: 100%;
    height: 100px;
    border: .5px solid #a3a3a3;
    border-radius: 10px;
    padding: 10px;
    resize: none;
    outline: 0;
    margin-top: 20px
}

.news-detail-login-facebook-button {
    margin-top: 10px;
    width: fit-content;
    height: 38px;
    line-height: 22px;
    border-radius: 10px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: 600;
    padding: 0 10px;
    cursor: pointer;
    margin-bottom: 20px
}

.news-detail-comment-title {
    margin-top: 30px;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px
}

.news-detail-comment-item {
    margin-top: 30px;
    display: grid;
    grid-template-columns: 55px 1fr
}

.news-detail-comment-item-avatar {
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: 100%;
    margin-right: 12px
}

.news-detail-comment-item-name {
    font-weight: 600;
    line-height: 22px;
    margin-right: 12px;
    cursor: pointer
}

.news-detail-comment-item-date {
    line-height: 22px;
    font-size: 12px
}

.news-detail-comment-item-content {
    line-height: 19px;
    font-size: 13px
}

.other-news-title {
    margin-top: 48px;
    font-weight: 600;
    font-size: 22px;
    line-height: 30px
}

.other-news-item {
    display: flex;
    margin-top: 30px;
    cursor: pointer
}

.other-news-item-avatar {
    width: 110px;
    height: 70px;
    overflow: hidden;
    border-radius: 10px;
    margin-right: 12px;
    min-width: 110px;
    min-height: 70px
}

.other-news-summary {
    width: calc(100% - 122px)
}

.avatar-datetime,.comments,.views {
    margin-right: 20px;
    align-items: center;
    margin-top: 6px
}

@media only screen and (min-width: 1921px) {
    body {
        margin:auto
    }

    .news-detail-qa-menu {
        left: auto
    }
}

@media only screen and (max-width: 1240px) {
    .news-detail-container {
        padding:40px
    }

    .news-detail-qa-content {
        position: relative
    }

    .news-detail-qa-menu {
        display: flex;
        position: absolute;
        top: -20px
    }

    .news-detail-qa-number {
        margin-right: 5px
    }
}

@media only screen and (max-width: 1160px) {
    .news-detail-container {
        padding:40px 20px
    }
}

@media only screen and (max-width: 600px) {
    .banner h2 {
        font-size:17.5px;
        width: 70vw;
        line-height: 1.7;
        margin: 10px 0
    }

    .work-break {
        word-wrap: break-word;
        width: 95%
    }

    .footer {
        display: flex;
        flex-direction: column
    }

    .ft-content {
        margin-top: 5px;
        margin-left: 5px
    }

    .ft-content:nth-child(2) {
        margin-top: 25px;
        margin-left: 5px
    }

    .ft-title {
        margin-bottom: 12px;
        font-size: 17.5px
    }

    #reset-password-body,.w3-modal {
        background-color: #fff!important
    }

    .center-box,.modal-content {
        box-shadow: none;
        border-radius: 0
    }

    .center-box,.w3-modal {
        border-top: .5px solid #d8d8d8
    }

    .center-box,.form-input-field,.w3-modal {
        width: 100%
    }

    .w3-modal {
        position: absolute;
        top: 72px;
        padding-top: 0
    }

    .modal-content {
        width: 100%;
        margin: auto;
        background-color: #fdfdfd;
        position: relative;
        padding: 0;
        outline: 0;
        text-align: center
    }

    .outline-btn-2.w-100per {
        color: #3d3d4e;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        padding: 10px 6px
    }

    .modal-content .modal-content-container {
        padding: 0 24px
    }

    .modal-note {
        font-size: 13px
    }

    .modal-note a {
        text-decoration: underline
    }

    .modal-content .modal-close-button {
        cursor: pointer;
        padding-right: 30px;
        margin-top: -30px;
        font-size: 30px;
        color: #979797
    }

    .modal-content .modal-close-button:hover {
        color: #6e6e6e
    }

    .center-box {
        height: 100%;
        margin-top: 0
    }

    .center-box .center-box-content {
        padding: 30px 23px
    }

    .sub-category-container,.super-category-container {
        padding: 5.33vw 4.8vw 0!important
    }

    .news-detail-container {
        padding: 5.33vw 4.8vw 0
    }

    .norms .buttons {
        margin-bottom: 0
    }

    .norms {
        padding-bottom: 8vw
    }
}

@media only screen and (max-width: 972px) {
    .button-form-campaign {
        top:16%;
        right: 4%;
        text-align: center
    }

    .button-form-campaign span {
        width: min-content;
        line-height: 200%;
        white-space: nowrap;
        font-size: 16px;
        padding: 2px 10px
    }

    .sub-category-content,.super-category-content {
        display: unset
    }

    .card-news {
        margin-right: 0
    }

    .first-btn,.second-btn,.third-btn {
        padding: 5px 10px;
        justify-content: center
    }

    .news-detail-content {
        flex-direction: column
    }

    .news-detail {
        width: 100%;
        margin-right: 0
    }

    .other-news {
        width: 100%
    }

    .other-news-top-image {
        display: none
    }
}

.account-container {
    width: 100%;
    margin-top: 40px
}

.account-content {
    display: flex;
    flex-direction: row;
    margin: 0 auto;
    max-width: 1310px;
    padding: 0 15px
}

.account-content .left-container,.account-content .right-container {
    background: #fff;
    height: 100%;
    border-radius: 20px;
    padding: 20px 25px 70px
}

.account-content .right-container-w-post {
    background: #fff;
    height: 100%;
    border-radius: 20px
}

.left-container {
    width: 298px;
    min-width: 298px;
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-right: 30px;
    padding: 40px 0;
    transition: .5s
}

.account-avatar {
    width: 108px;
    height: 108px;
    border-radius: 50%
}

.avatar-container {
    position: relative;
    width: 108px;
    height: 112px
}

.edit-round-btn {
    width: 24px;
    height: 24px;
    background-color: #6cc0ae;
    border-radius: 50%;
    position: absolute;
    right: 10px;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.action-container {
    text-align: left;
    margin-top: 36px;
    padding: 40px 31px
}

.action-container>.title3.tablinks.selected {
    font-weight: 600!important;
    font-family: OpenSans-SemiBold
}

.action-container>.title3.tablinks {
    text-decoration: none;
    color: #6e6d7a!important;
    cursor: pointer;
    font-weight: 400!important;
    font-family: OpenSans;
    padding: 10px 0;
    border-bottom: .5px solid #e2e2e2
}

.action-container>.title3.tablinks:last-child {
    border-bottom: none
}

.form-account {
    padding: 30px 23px;
    flex-direction: column;
    display: none
}

.form-account .form-title {
    margin: 0;
    padding: 0 0 10px
}

.form-account .form-input-field {
    width: 493px;
    height: 40px
}

.form-account .form-submit-btn {
    width: 150px
}

.posts-container {
    padding: 20px 30px 27px
}

.posts-container .filter-container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end
}

.posts-container .filter-container .filter-btn {
    width: 109px;
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 0
}

.posts-container .filter-container .select-box {
    margin: 0 16px 0 0!important;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    white-space: nowrap
}

.posts-container>.space-line-option {
    width: 100%;
    margin: 30px 0 0
}

.striped-table {
    width: 100%;
    background: #edf7f5;
    border-radius: 10px 10px 0 0;
    border-spacing: 0px
}

.striped-table>thead>tr>th {
    padding: 16px;
    text-align: left;
    font-size: 14px;
    color: #3d3d4e
}

.striped-table>tbody>tr>td {
    background: #edf7f5;
    padding: 16px;
    font-size: 14px;
    color: #3d3d4e
}

.striped-table>tbody>tr:nth-of-type(odd)>td {
    background-color: #fff!important
}

.status-tag {
    border-radius: 20px;
    width: 110px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center
}

.dropdown-calendar,.dropdown-month,.dropdown-years {
    background: #fbfcfd;
    border-radius: 10px;
    display: none;
    box-shadow: 0 4px 8px rgba(0,0,0,.1);
    position: absolute
}

.status-tag.waiting {
    background: #f7d4d0
}

.status-tag.published {
    background: #6cc0ae7e;
    border-radius: 20px
}

.dropdown-years {
    right: 50px
}

.dropdown-month {
    left: 70px
}

.dropdown-month,.dropdown-years {
    max-height: 300px;
    overflow-y: auto;
    z-index: 11;
    padding: 5px;
    width: 100px;
    top: 40px
}

.dropdown-month .month-item,.dropdown-years .year-item {
    padding: 5px;
    color: #000;
    font-weight: 400;
    cursor: pointer
}

.dropdown-calendar {
    z-index: 10
}

.dropdown-calendar .calendar {
    width: 350px
}

.dropdown-calendar .calendar .month-year {
    background-color: #dcf3eb;
    padding: 17px 32px;
    display: flex;
    justify-content: space-between;
    flex-direction: row
}

.dropdown-calendar .calendar .month-year .month,.dropdown-calendar .calendar .month-year .year {
    border: none;
    background-color: transparent;
    outline: 0;
    font-size: 14px;
    line-height: 19px;
    display: flex;
    align-items: center;
    text-align: center;
    color: #53596f
}

.post-card,.post-card-item:first-child {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px
}

.dropdown-calendar .calendar .weekdays {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 20px 19px;
    font-weight: 600;
    font-size: 12px;
    color: #53596f
}

.days,.days-mobile {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 10px 12px;
    justify-content: center
}

.days div,.days-mobile div {
    font-size: 14px;
    margin: 9px 7px;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 50%
}

.days div:hover:not(.today),.days-mobile div:hover:not(.today) {
    border-radius: 50%;
    background: #dcf3eb;
    cursor: pointer
}

.next-date,.prev-date {
    opacity: .5
}

.today {
    background-color: #6cc0ae;
    color: #fff
}

.list-filter,.list-filter-responsive {
    background: #fbfcfd;
    box-shadow: 0 4px 8px rgba(0,0,0,.1);
    border-radius: 10px;
    width: 176px;
    height: 80px;
    position: absolute;
    display: none
}

.list-filter .filter-item,.list-filter-responsive .filter-item {
    padding: 10px 17px;
    margin: 1.25px
}

.list-filter .filter-item:hover,.list-filter-responsive .filter-item:hover {
    background-color: #dcf3eb;
    cursor: pointer
}

.list-filter .filter-item:last-child:hover,.list-filter-responsive .filter-item:last-child:hover {
    border-radius: 0 0 10px 10px
}

.calendara .header .text,.list-filter .filter-item:first-child:hover,.list-filter-responsive .filter-item:first-child:hover {
    border-radius: 10px 10px 0 0
}

.select-box-mobile,.select-box-mobile_custom {
    cursor: pointer;
    border-color: transparent!important;
    background-color: #fff;
    width: 100%!important;
    border-radius: 10px;
    height: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 17px;
    margin-bottom: 16px
}

@media only screen and (min-width: 601px) {
    .window-device {
        display:block
    }

    .mobile-device {
        display: none
    }
}

@media only screen and (max-width: 670px) {
    .news-detail-qa-item-author {
        width:unset;
        max-width: unset
    }

    .mobile-device {
        display: block
    }

    .account-content {
        width: 100%;
        padding: 0 12px;
        display: flex;
        flex-direction: column
    }

    .select-box-mobile,.select-box-mobile_new {
        cursor: pointer;
        border-color: transparent!important;
        background-color: #fff;
        width: 100%!important;
        border-radius: 10px;
        height: 40px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 9px 17px;
        margin-bottom: 16px
    }

    .avatar-container-bg {
        display: flex;
        justify-content: center
    }

    .information-container {
        background: #fff;
        border-radius: 10px;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        padding: 20px 12px
    }

    .avatar-container {
        display: flex;
        justify-content: center;
        margin-bottom: 16px
    }

    .form-account-mobile {
        text-align: left;
        margin-top: 20px
    }

    .title4.form-title {
        margin-bottom: 10px
    }

    .form-input-field {
        width: 100%!important;
        height: 40px;
        color: #3d3d4e
    }

    .list-filter {
        top: 45px;
        width: 100%!important;
        z-index: 3;
        height: fit-content
    }

    .calendar-container button,.payment-container button,.status-container button {
        width: 100%!important;
        margin: 20px 0 0;
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .calendar-container,.payment-container,.status-container {
        position: relative
    }

    .payment-container {
        margin-bottom: 20px
    }

    .filter-container {
        border-bottom: .5px solid #a9aab8;
        display: none
    }
}

.post-card-item {
    background-color: #f5fbf9;
    padding: 26px 12px
}

.bg-white,.post-card,.post-card-item:nth-of-type(2n) {
    background-color: #fff
}

.post-card {
    padding-top: 1px
}

.user-post-container {
    text-align: start
}

.pen-icon-edit {
    font-size: 11px;
    color: #fff
}

@media only screen and (min-width: 601px) {
    .account-content {
        width:100%;
        padding: 0 12px;
        display: flex;
        flex-direction: column
    }
}

.wrap-top-infor {
    margin-bottom: 20px;
    display: none
}

@media only screen and (max-width: 960px) {
    .list-filter-responsive {
        top:45px;
        width: 100%!important;
        z-index: 3;
        height: fit-content
    }

    .wrap-menu-responsive,.wrap-top-infor {
        display: block
    }

    .left-container {
        display: none
    }

    .account-container {
        margin-top: 24px
    }
}

@media only screen and (min-width: 961px) {
    .left-container {
        display:block!important
    }

    .account-content {
        display: flex;
        flex-direction: row
    }

    .account-container {
        margin-top: 40px
    }
}

@media only screen and (max-width: 1120px) {
    .margin-image {
        margin-left:10px
    }

    .select-box {
        width: auto!important
    }
}

.image-banner,.test {
    position: relative;
    width: 100%
}

.calendara,.calendara .header .text,.pos-absolute {
    position: absolute
}

.image-banner .banner-child {
    position: absolute;
    top: 0;
    width: 100%;
    color: #313131
}

.wrap-content-about-us {
    margin-bottom: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 12px;
    max-width: 1110px;
    margin-left: auto;
    margin-right: auto
}

.about-title {
    width: 80%;
    margin-top: 60px;
    text-align: center;
    font-weight: 600;
    font-size: 30px;
    line-height: 41px;
    color: #313131
}

.div-space-title {
    height: 5px;
    width: 80px;
    background: #6cc0ae;
    border-radius: 50px;
    margin-top: 10px
}

.ab-description {
    margin-top: 40px;
    text-align: center
}

.ab-content-2 {
    width: 80%;
    margin-top: 60px;
    font-weight: 600;
    font-size: 22px;
    line-height: 30px;
    text-align: center;
    color: #313131
}

.ab-description-2 {
    display: flex;
    justify-content: space-between;
    margin-top: 60px
}

.ab-description-2 .container-square-1 {
    width: 48%;
    display: flex
}

.container-square-1 .ab-icon {
    width: 72px;
    min-width: 72px;
    background: #dcf3eb;
    height: 72px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 17px;
    margin-left: 10px
}

.text-square1 .ab-square-title {
    font-weight: 600;
    font-size: 16px;
    line-height: 24px
}

.text-square1 .ab-square-description {
    font-size: 14px;
    line-height: 22px;
    color: #6e6d7a;
    margin-top: 10px
}

.ab-description-3 {
    line-height: 22px;
    text-align: justify;
    color: #313131
}

.Tags {
    margin-top: 60px;
    font-weight: 600;
    font-size: 30px;
    line-height: 41px;
    text-align: center;
    color: #313131
}

.wrap-tags {
    display: flex;
    flex-direction: row;
    flex-flow: row wrap;
    justify-content: center
}

.wrap-tags .tag-item {
    cursor: pointer;
    font-size: 14px;
    line-height: 22px;
    display: flex;
    align-items: center;
    background: #ebebeb;
    height: 32px;
    padding: 0 18px;
    border-radius: 10px;
    margin-left: 11px;
    white-space: nowrap;
    margin-bottom: 12px
}

.ab-wrap-end,.page_category .wrap_box_tags_category+.divider {
    margin-top: 5px
}

.ab-wrap-end .kinhnghiemthucte {
    padding: 7px 32px;
    background-color: #24cb99;
    border-radius: 10px;
    color: #fff
}

.ab-wrap-end .tuvan {
    padding: 7px 36px;
    background-color: #008cf1;
    color: #fff;
    border-radius: 10px;
    margin: 0 12px
}

.ab-wrap-end .uytin {
    padding: 7px 39px;
    background-color: #49b3ff;
    color: #fff;
    border-radius: 10px
}

.description-end {
    margin-top: 20px;
    font-size: 16px;
    line-height: 24px;
    text-align: center
}

.div-space-end {
    width: 100%;
    height: 1px;
    background-color: #d8d8d8;
    margin: 30px 0
}

.width-44 {
    width: 44px
}

.policy-intro {
    font-size: 16px;
    line-height: 24px;
    padding-top: 10px
}

.calendara .header .text,.month {
    padding: 15px;
    backface-visibility: hidden
}

.policy-group-row {
    margin: 20px 0
}

.policy-title {
    font-size: 18px;
    line-height: 24px;
    font-weight: 700
}

.policy-desc,.policy-group-row ul li {
    font-size: 16px;
    line-height: 24px
}

.container-square-1 {
    width: 100%!important;
    margin-top: 30px
}

.wrap-quare-receive {
    margin-top: 0!important
}

.pull-left {
    float: left
}

.pull-right {
    float: right
}

.clearfix:after,.clearfix:before {
    content: "";
    display: table
}

.clearfix:after {
    clear: both;
    display: block
}

.calendara {
    z-index: 10;
    width: 300px;
    font-size: 100%;
    margin: 5px auto 0;
    perspective: 1000px;
    cursor: default;
    top: 0;
    display: none
}

.calendara .header {
    height: 48px;
    position: relative;
    color: #53596f
}

.calendara .header .text {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #dcf3eb
}

.calendara .header .text>span {
    text-align: center;
    display: block
}

.calendara .header.active .text {
    opacity: 1
}

.months {
    width: 100%;
    height: fit-content;
    position: relative
}

.months .hr {
    height: 1px;
    margin: 15px 0;
    background: #ccc
}

.month {
    width: inherit;
    height: inherit;
    background: #fff;
    position: absolute;
    transition: 10ms ease-in-out;
    box-shadow: 0 5px 8px rgba(0,0,0,.1)
}

.months[data-flow=left] .month {
    transform: rotateY(-180deg)
}

.months[data-flow=right] .month {
    transform: rotateY(180deg)
}

.table {
    width: 100%;
    font-size: 12px;
    font-weight: 400;
    display: table
}

.table .row {
    display: table-row
}

.table .row.head {
    color: #53596f;
    text-transform: uppercase;
    font-weight: 600
}

.table .row .cell {
    width: 14.28%;
    padding: 5px;
    text-align: center;
    display: table-cell
}

.table .row .cell.disable {
    color: #9897a0
}

.table .row .cell span {
    display: block;
    width: 28px;
    height: 28px;
    color: #53596f;
    line-height: 28px
}

.table .row .cell.curent span {
    border: 1px solid #6cc0ae;
    border-radius: 100px
}

.table .row .cell.active span,.table .row .cell.active span:hover,.table .row .cell.curent span:hover {
    color: #fff;
    background-color: #6cc0ae;
    border-radius: 100px
}

.table .row .cell span:hover {
    background-color: #dcf3eb;
    border-radius: 100px;
    cursor: pointer
}

.months .month[data-active=true] {
    transform: rotateY(0)
}

.header [data-action] {
    color: inherit;
    position: absolute;
    top: 50%;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    z-index: 10;
    opacity: 0;
    transition: ease-in-out
}

.header [data-action]>i {
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -10px;
    margin-left: -10px;
    font-size: 10px
}

.header [data-action]>i:after,.header [data-action]>i:before {
    top: 50%;
    margin-top: -1px;
    content: "";
    position: absolute;
    height: 2px;
    width: 20px;
    border-top: 2px solid;
    border-radius: 2px
}

.header [data-action*=prev] {
    left: 15px
}

.header [data-action*=next] {
    right: 15px
}

.header [data-action*=prev]>i:after,.header [data-action*=prev]>i:before,.slider-container .slider-control.control-previous {
    left: 0
}

.header [data-action*=prev]>i:before {
    top: 3px;
    transform: rotate(-45deg)
}

.header [data-action*=prev]>i:after {
    top: auto;
    bottom: 3px;
    transform: rotate(45deg)
}

.header [data-action*=next]>i:after,.header [data-action*=next]>i:before,.slider-container .slider-control.control-next {
    right: 0
}

.header [data-action*=next]>i:before {
    top: auto;
    bottom: 3px;
    transform: rotate(-45deg)
}

.header [data-action*=next]>i:after {
    top: 3px;
    transform: rotate(45deg)
}

.header.active [data-action=prev-month] {
    opacity: 1;
    display: flex;
    align-items: center
}

.header.active [data-action=next-month] {
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.pb-10 {
    padding-bottom: 10px
}

.mt-22 {
    margin-top: 22px
}

.mt-35,.mt-56 {
    margin-top: 35px
}

.mr-10 {
    margin-right: 10px
}

.mb-24 {
    margin-bottom: 24px
}

.d-grid {
    display: grid
}

.w-60per {
    width: 60%
}

.d-block-important {
    display: block!important
}

.gird-col-7-3 {
    grid-template-columns: 70% 30%;
    align-items: start
}

.grid-col-2 {
    grid-template-columns: auto auto
}

.grid-gap-col-14 {
    grid-column-gap: 14px
}

.jc-evenly {
    justify-content: space-evenly
}

.jc-center {
    justify-content: center
}

.jc-end {
    justify-content: flex-end
}

.flex-wrap {
    flex-wrap: wrap
}

.tags_section {
    display: block;
    font-size: 14px;
    line-height: 19px;
    color: var(--black-6);
    font-weight: 400;
    border: 1px solid var(--black-4);
    padding: 6px 10px;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px
}

.line-grey {
    border: none;
    outline: 0;
    width: 100%;
    height: 1px;
    background: var(--black-4)
}

.section_item .wrap-title_section .title_section {
    font-weight: 600;
    font-size: 28px;
    line-height: 38px;
    color: var(--primary-0);
    position: relative;
    padding-left: 13px
}

.section_item .wrap-title_section .title_section:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 5px;
    background: var(--primary-0);
    top: 0;
    left: 0;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px
}

.siderbar_item .siderbar_item-title {
    margin: 0;
    font-weight: 600;
    font-size: 22px;
    line-height: 30px;
    color: var(--black-2)
}

.card_sidebar .card_sidebar-thumbnail {
    width: 110px;
    height: 70px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    overflow: hidden
}

.card_sidebar .card_sidebar-title {
    color: #313131;
    font-size: 15px;
    line-height: 25px;
    font-weight: 400;
    display: -webkit-box;
    overflow: hidden
}

.card_sidebar-thumbnail {
    display: block;
    width: 100%
}

.card_sidebar-thumbnail .thumbnail {
    width: 100%;
    height: 190px;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    overflow: hidden
}

.card_sidebar-thumbnail .card_sidebar-thumbnail-title {
    font-size: 16px;
    line-height: 23px;
    color: var(--black-1);
    font-weight: 400;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.siderbar_item.talkShow .siderbar_item-body {
    background-color: #edf9f5;
    padding: 24px 20px 40px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px
}

.author-col {
    padding: 20px;
    border: 1px solid var(--black-4);
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px
}

.news-item {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-column-gap: 20px;
    margin-bottom: 25px
}

.news-item .wrap_thumbnail {
    display: block;
    width: 238px;
    height: 152px;
    overflow: hidden;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px
}

.news-item .fb-btn {
    font-size: 11px
}

.news-item .news-information .title-news-information {
    margin: 0;
    font-weight: 600;
    font-size: 20px;
    line-height: 27px;
    color: #0d0c22;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news-item .news-information .news-description {
    font-size: 14px;
    text-align: justify;
    color: var(--black-1);
    margin-top: 10px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 92px
}

.news-item:hover .wrap_thumbnail img {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s
}

@media screen and (max-width: 640px) {
    .mr-0-sm {
        margin-right:0
    }

    .news-item {
        grid-column-gap: 12px;
        margin-bottom: 25px
    }

    .news-item .wrap_thumbnail {
        width: 28.3vw;
        height: 18.1vw
    }

    .news-item .news-information .title-news-information {
        font-size: 4vw;
        line-height: 5.33vw
    }

    .news-item .news-information .news-description {
        display: none
    }

    .news-item .customMoreInfo {
        width: 100%!important;
        display: flex;
        justify-content: space-between!important;
        margin: 5px 0
    }

    .news-item .customMoreInfo>div {
        margin: 0;
        width: unset!important
    }
}

.sidebar-new {
    padding-right: 25px
}

.slider-container {
    width: 100%;
    height: 220px;
    margin: auto;
    display: block;
    overflow: hidden;
    position: relative
}

.slider-container .slider {
    position: absolute;
    left: 0;
    top: 0;
    min-width: 100%;
    height: 100%;
    display: flex;
    cursor: pointer;
    transition-timing-function: linear;
    z-index: 1
}

.mr-15,.slider-container .slide:not(:last-child) {
    margin-right: 15px
}

.slider-container .slider-control {
    position: absolute;
    z-index: 2;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    cursor: pointer
}

.card_slider_home {
    width: 230px;
    height: 100%
}

.card_slider_home .card_slider_home-body {
    width: 100%;
    height: 100%;
    display: block
}

.card_slider_home .card_slider_home-body .card_slider_home-thumbnail {
    width: 100%;
    height: 135px;
    border-radius: 15px;
    overflow: hidden
}

.card_slider_home .card_slider_home-body .card_slider_home-title {
    margin-top: 16px;
    font-size: 16px;
    line-height: 21px;
    color: var(--black-1);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    font-weight: 500
}

@media screen and (max-width: 957px) {
    .wrap_sidebar_details {
        width:100%
    }
}

.news-detail-qa-item img {
    margin-top: 20px 0;
    max-width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 10px
}

@media screen and (min-width: 600px) {
    .footer {
        display:grid;
        grid-template-columns: repeat(3,1fr);
        grid-column-gap: 25px
    }
}

@media screen and (min-width: 1200px) {
    .footer {
        display:grid;
        grid-template-columns: repeat(5,1fr);
        grid-column-gap: 25px
    }
}

.btn_reply {
    cursor: pointer;
    color: #337ab7;
    font-size: 14px
}

.news-detail-comment-item .wrap_fromReply .content_reply {
    width: 100%;
    padding: 0
}

.btn_submit_form {
    border: none;
    outline: 0;
    background-color: #337ab7;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    padding: 5px 15px;
    cursor: pointer
}

.ml-5 {
    margin-left: 5px
}

@media only screen and (max-width: 440px) {
    .student-item {
        width:85.3vw
    }
}

.logo-img-sidenav {
    width: 200px
}

.btn_loadmore {
    color: #fff;
    background: #24cb99;
    width: 100px;
    height: 40px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px
}

@media screen and (max-width: 500px) {
    .btn_loadmore {
        width:90px;
        height: 35px;
        font-size: 12px
    }
}

.page_details .slider-container {
    height: 250px
}

.container_app {
    width: 100%;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto
}

.form_createArticle_user .formActicle-2-col {
    grid-template-columns: 200px 1fr
}

.btn-primary {
    border: none;
    outline: 0;
    cursor: pointer;
    display: block;
    padding: 5px 10px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    background-color: var(--primary-1);
    color: #fff;
    font-weight: 500
}

.btn-secondary,.wrap_thumbnail_form {
    display: block;
    border-radius: 5px;
    cursor: pointer
}

.btn-secondary {
    padding: 5px 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    background-color: #008cf1;
    color: #fff;
    font-weight: 500
}

.btn-submit,.btn_icon:hover {
    background-color: var(--primary-1)
}

.mb-30 {
    margin-bottom: 30px
}

.style-input {
    border: 1px solid #ced4da;
    outline: 0;
    color: #495057;
    padding: 5px 10px
}

.wrap_thumbnail_form {
    width: 200px;
    height: 200px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    overflow: hidden
}

.btn-submit,.btn-toggle {
    justify-content: center;
    border-radius: 5px
}

.form_createArticle_user .title_row {
    color: #212529;
    font-size: 16px
}

.btn-toggle {
    width: 200px;
    height: 40px;
    display: flex;
    align-items: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    cursor: pointer;
    color: var(--primary-1);
    border: 2px solid var(--primary-1);
    font-weight: 500;
    text-align: center;
    font-size: 15px
}

.btn-toggle:hover,input[name=tab_create_article][id=tab_category]:checked~.wrap_button_control_form .btn-category-form,input[name=tab_create_article][id=tab_content]:checked~.wrap_button_control_form .btn-content-form,input[name=tab_create_article][id=tab_seo]:checked~.wrap_button_control_form .btn-seo-form,input[name=tab_create_article][id=tab_title]:checked~.wrap_button_control_form .btn-title-form {
    background-color: var(--primary-1);
    color: #fff
}

.page_account .btn-toggle {
    width: 100%;
    margin: 0 10px
}

.text-black,.wrap_menu_new .sub_menu .sub_menu_item:hover .menu_new_link:hover {
    color: #000
}

@media screen and (max-width: 670px) {
    .d-none-mobile {
        display:none
    }
}

.btn-reset,.btn-submit {
    width: 120px;
    display: flex;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    height: 40px
}

.btn-submit {
    align-items: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border: none;
    outline: 0;
    cursor: pointer
}

.btn-reset,.btn_icon {
    justify-content: center;
    outline: 0;
    cursor: pointer
}

.btn-reset {
    align-items: center;
    background-color: #dc3545;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border: none
}

.option_checkbox {
    display: grid;
    grid-template-columns: 30px 1fr;
    align-items: center;
    position: relative;
    margin-bottom: 5px
}

.option_checkbox .nameOption {
    color: #212529;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer
}

.title-small {
    font-size: 12px;
    color: #212529
}

.grid-col-2-100px {
    grid-template-columns: 100px 1fr
}

.gird-gap-col-10 {
    grid-gap: 10px
}

.btn_icon {
    border: none;
    background-color: #828282;
    width: 30px;
    height: 29px;
    display: flex;
    align-items: center;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px
}

.btn_icon img {
    width: 13px;
    height: 16px
}

.btn_icon.btn_edit {
    background-color: #f7d4d0
}

.btn_icon.btn_edit:hover {
    background-color: #fb8678
}

.btn_icon.btn_edit img {
    width: 15px;
    height: 15px
}

.text-center-important {
    text-align: center!important
}

.select-language-popup {
    position: fixed;
    right: 20px;
    top: 30%;
    z-index: 9999
}

.select-language-popup.hidden-popup {
    transform: translateX(100%)
}

.select-language-popup .list-language {
    list-style: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    position: relative
}

.page_details .news-detail-qa-item li,.select-language-popup .list-language .language-item {
    margin: 10px 0
}

.select-language-popup .list-language .language-item .language-image-wrapper {
    width: 40px;
    height: 40px;
    background-color: var(--white);
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--grey-1);
    border-radius: 5px;
    padding: 15px 2.5px 22px
}

.select-language-popup .list-language .language-item .language-image-wrapper.active {
    background: var(--primary-3)
}

.select-language-popup .list-language .language-item .language-item-image {
    width: 25px;
    height: 16px;
    object-fit: cover
}

.page_article .line_mobile {
    margin-bottom: 7vw
}

@media screen and (max-width: 956px) {
    .d-none-md {
        display:block
    }

    .d-none-sm {
        display: none!important
    }

    .avatar-mobile-container {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 112px;
        margin: 25px 0
    }

    .avatar-mobile-container .avatar-mobile-wrapper {
        position: relative;
        width: fit-content;
        height: auto
    }

    .avatar-mobile-container .avatar-mobile-wrapper>form {
        position: absolute;
        top: calc(100% / 4 * 2.5);
        right: 0
    }

    .avatar-mobile-container .avatar-mobile-wrapper .edit-round-btn {
        position: unset
    }
}

.page_category .wrap_box_tags_category {
    display: flex;
    flex-wrap: wrap;
    margin-top: 15px
}

@media only screen and (max-width: 600px) {
    .Tags,.about-title {
        margin-top:30px
    }

    .wrap-content-about-us {
        margin-bottom: 30px
    }

    .about-title {
        font-size: 25px;
        width: 90vw
    }

    .ab-description {
        font-size: 14px;
        text-align: justify
    }

    .ab-description-2 {
        display: flex;
        flex-direction: column;
        margin-top: 0
    }

    .ab-content-2 {
        margin-top: 30px;
        font-size: 20px;
        font-weight: 501;
        width: 70vw
    }

    .w3-modal {
        background-color: #fff!important
    }

    .modal-content {
        width: 100%;
        margin: auto;
        background-color: #fff;
        position: relative;
        padding: 0;
        outline: 0;
        box-shadow: none;
        text-align: center;
        border-radius: 0
    }

    .banner .primary-btn {
        margin-top: 12px;
        padding: 20px 15px
    }

    .form-account .form-submit-btn {
        width: 100%;
        font-size: 14px;
        margin-top: 20px
    }

    .select-language-popup {
        position: fixed;
        left: 100%;
        z-index: 9999;
        transition: .5s
    }

    .select-language-popup.show-popup {
        left: calc(100% - 40px)
    }

    .select-language-popup .list-language {
        list-style: none;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        position: relative
    }

    .select-language-popup .list-language .btn-choose-language {
        position: absolute;
        right: 100%;
        top: 0;
        padding: 8px;
        background-color: var(--grey-1);
        width: 40px;
        height: 40px;
        color: var(--white);
        display: flex;
        justify-content: center;
        align-items: center;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
        cursor: pointer
    }

    .select-language-popup .list-language .language-item {
        margin: 10px 0
    }

    .select-language-popup .list-language .language-item .language-image-wrapper {
        width: 40px;
        height: 40px;
        background-color: var(--white);
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 0;
        border: none
    }

    .select-language-popup .list-language .language-item .language-image-wrapper.active {
        background: var(--primary-3)
    }

    .select-language-popup .list-language .language-item .language-item-image {
        width: 20px;
        height: 16px;
        object-fit: cover
    }
}

@media only screen and (max-width: 375px) {
    .norms {
        width:100%;
        margin: 0
    }

    .norms .buttons {
        width: 100%;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center
    }

    .norms .buttons>div {
        margin: 7px 6px!important;
        width: 45%
    }

    .student-skill-label,.student-summary-label {
        width: 85px
    }
}

blockquote:after {
    position: absolute;
    height: 100%;
    width: 5px;
    background: #ccc;
    content: "";
    top: 0;
    left: -20px
}

.breadcrumbs {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-bottom: 10px;
    margin-top: 10px
}

.breadcrumbs .breadcrumbs-line {
    margin-left: 10px;
    margin-right: 10px;
    color: var(--primary-1);
    margin-top: 2px
}

.breadcrumbs .breadcrumbs-txt {
    color: var(--primary-1);
    font-size: 18px;
    padding-bottom: 3px
}

.page_details .wrap_table {
    width: 100%;
    overflow-x: auto;
    margin-left: auto;
    margin-right: auto
}

.page_details .wrap_table table {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%
}

@media screen and (min-width: 1400px) {
    .page_details .wrap_table {
        width:500px
    }
}

@media screen and (max-width: 1400px) {
    .page_details .wrap_table {
        width:500px
    }
}

@media screen and (max-width: 1150px) {
    .page_details .wrap_table {
        width:400px
    }
}

@media screen and (max-width: 1050px) {
    .page_details .wrap_table {
        width:350px
    }
}

.page_details .news-detail-description,.page_details .news-detail-qa-item {
    font-family: sans-serif,OpenSans!important
}

.page_details .news-detail-qa-item h2,.page_details .news-detail-qa-item h2 span {
    font-weight: 700;
    font-size: 24px!important;
    line-height: 29px!important
}

.page_details .news-detail-qa-item h3,.page_details .news-detail-qa-item h3 span {
    font-weight: 700;
    font-size: 20px!important;
    line-height: 25px!important
}

.page_details .news-detail-qa-item h4,.page_details .news-detail-qa-item h4 span {
    font-weight: 700;
    font-size: 18px!important;
    line-height: 23px!important
}

.page_details .news-detail-qa-item p,.page_details .news-detail-qa-item span,.page_details .news-detail-qa-item ul {
    font-size: 16px!important;
    line-height: 26px!important
}

.news-detail-container {
    position: relative;
    display: grid;
    grid-template-columns: 300px 1fr
}

.wrap_toc {
    position: sticky;
    top: 20px;
    width: 280px;
    max-height: 90vh;
    overflow-y: scroll;
    background-color: #fff;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    padding: 10px;
    -webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.24);
    -moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.24);
    box-shadow: 0 0 5px 0 rgba(0,0,0,.24);
    -ms-overflow-style: none;
    scrollbar-width: none
}

.wrap_toc::-webkit-scrollbar {
    display: none
}

.wrap_toc.fixed_toc {
    position: fixed;
    top: 0;
    left: unset;
    transform: translate(calc(-100% - 20px),20px);
    -webkit-transform: translate(calc(-100% - 20px),20px);
    -moz-transform: translate(calc(-100% - 20px),20px);
    -ms-transform: translate(calc(-100% - 20px),20px);
    -o-transform: translate(calc(-100% - 20px),20px)
}

.wrap_toc ol {
    padding-left: 30px
}

.wrap_toc .title_toc {
    font-size: 20px;
    font-weight: 700;
    padding-left: 15px;
    margin-top: 10px;
    margin-bottom: 15px
}

    .wrap_toc li {
        position: relative;
        padding-left: 5px;
        margin-bottom: 5px;
        list-style-type: disc;
    }

.wrap_toc li a {
    color: #0d0c22;
    font-weight: 500
}

.wrap_toc li::before {
    position: absolute;
    content: "";
    width: 27px;
    height: 27px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    top: 0;
    left: 0;
    z-index: 1;
    transform: translate(-94%,-6%);
    -webkit-transform: translate(-94%,-6%);
    -moz-transform: translate(-94%,-6%);
    -ms-transform: translate(-94%,-6%);
    -o-transform: translate(-94%,-6%)
}

.wrap_toc li::marker {
    font-size: 16px;
    position: relative;
    z-index: 2;
    margin-right: 10px;
    color: var(--primary-1);
    font-weight: 500
}

.banner_toplist,.break,.close:checked,.close:checked+div,.mobile-footer-banner,.mobile-top-banner,.wrap_toc .wrap_title_toc .btn_close_toc {
    display: none
}

@media screen and (max-width: 972px) {
    .page_details .wrap_table {
        width:80vw
    }

    .page_details .wrap_table table {
        max-width: unset
    }

    .news-detail-container {
        grid-template-columns: 1fr;
        padding: 0
    }

    .btn_openToc {
        position: fixed;
        top: 50%;
        right: 15px;
        font-size: 20px;
        transform: translateY(-50);
        -webkit-transform: translateY(-50);
        -moz-transform: translateY(-50);
        -ms-transform: translateY(-50);
        -o-transform: translateY(-50);
        z-index: 2;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50px;
        height: 50px;
        background-color: var(--primary-1);
        color: #fff;
        cursor: pointer;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px
    }

    .overlay_toc,.wrap_toc {
        position: fixed;
        top: 0;
        right: 0
    }

    .wrap_toc {
        left: unset;
        width: 350px;
        max-height: unset;
        height: 100vh;
        z-index: 4;
        transform: translateX(100%);
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        border-radius: 20px 0 0 20px;
        -webkit-border-radius: 20px 0 0 20px;
        -moz-border-radius: 20px 0 0 20px;
        -ms-border-radius: 20px 0 0 20px;
        -o-border-radius: 20px 0 0 20px
    }

    .wrap_toc .wrap_title_toc {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center
    }

    .wrap_toc .wrap_title_toc .btn_close_toc {
        font-size: 20px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        display: block
    }

    .overlay_toc {
        left: 0;
        bottom: 0;
        background-color: rgba(0,0,0,.1);
        z-index: 3;
        display: none
    }

    input[id=openToc]:checked~.overlay_toc {
        display: block
    }

    input[id=openToc]:checked~.wrap_toc {
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transition: .5s;
        -webkit-transition: .5s;
        -moz-transition: .5s;
        -ms-transition: .5s;
        -o-transition: .5s
    }
}

.wrap_hidden_fixed_toc .hidden_fixed_toc {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000;
    opacity: 0
}

.topicThumbnail-orders-relativeTopics .normal-a-tag:hover,.wrap_sidebar_details .normal-a-tag:hover {
    color: var(--primary-1)!important;
    opacity: 1!important
}

.hidden_for_SEO {
    position: absolute;
    opacity: 0;
    z-index: -1
}

.banner_aboutus {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    height: 600px;
    position: relative
}

.banner_aboutus .overlay_banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.4)
}

@media screen and (max-width: 1100px) {
    .banner_aboutus {
        height:500px
    }
}

.post-thumbnail {
    max-width: 100%;
    display: block;
    margin: auto;
    border-radius: 10px
}

.thumbnail-container {
    margin-top: 20px;
    margin-bottom: 20px
}

figure.image {
    margin: 20px auto
}

figure.image>figcaption {
    text-align: center;
    margin-top: 5px
}

ul {
    list-style: none
}

.wrap_menu_new {
    padding-left: 80px;
    padding-right: 80px;
    height: 60px;
    width: 100%;
    display: flex;
    position: relative
}

.wrap_menu_new .menu_new {
    border-top: .5px solid #d8d8d8;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    overflow-x: hidden
}

.wrap_menu_new .menu_new .menu_new_item {
    margin-right: 50px;
    position: relative;
    height: 40px;
    white-space: nowrap
}

.wrap_menu_new .menu_new_link {
    font-size: 16px;
    line-height: 24px;
    color: #3d3d4e;
    font-weight: 400;
    opacity: 1!important;
    height: 100%;
    display: flex;
    align-items: center
}

.wrap_menu_new .sub_menu {
    display: none;
    width: 270px;
    left: -10px;
    position: absolute;
    background-color: #fff;
    padding: 0;
    box-shadow: 0 0 14px 1px rgba(0,0,0,.1);
/*    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px*/
}

.wrap_menu_new .sub_menu .sub_menu_item:hover {
    background: var(--primary-2)
}

.wrap_menu_new .sub_menu .sub_menu_item {
    width: 100%;
    height: 40px;
    padding: 10px
}

.wrap_box_tags .box_tags {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    padding-bottom: 7px;
    margin-top: 10px
}

.news-detail-tags-item.tagsStyle_2,.wrap_box_tags .box_tags .news-detail-tags-item {
    margin: 0 10px 10px 0
}

.news-detail-tags-item.tagsStyle_2 a,.wrap_box_tags .box_tags .news-detail-tags-item a {
    font-weight: 400;
    color: #636363;
    margin: 0;
    opacity: 1!important
}

.wrap_box_tags .lineBoxTags {
    width: 100%;
    height: 4px;
    background-color: var(--primary-0);
    margin: 0;
    position: absolute;
    bottom: 0;
    border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -ms-border-radius: 40px;
    -o-border-radius: 40px
}

@media screen and (max-width: 800px) {
    .banner-link-facebook-mobile,.d-block-md {
        display:block
    }

    .w-100-md {
        width: 100%
    }

    .jc-start-md {
        justify-content: flex-start
    }

    .grid-col-1-md {
        grid-template-columns: 1fr
    }

    .mt-14-md {
        margin-top: 14px
    }

    .mt-24-md {
        margin-top: 24px
    }

    .sidebar-new {
        padding-right: 0
    }

    .banner-link-facebook {
        display: none
    }

    .wrap_box_tags {
        padding-top: 15px;
        position: relative
    }

    .wrap_box_tags::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 5px;
        background: #ededed;
        top: 0
    }
}

.wrap_menu_new #menu_next_btn,.wrap_menu_new #menu_prev_btn {
    outline: 0;
    border: none;
    background: 0 0;
    padding: 0 10px;
    cursor: pointer
}

.wrap_menu_new #menu_next_btn:hover,.wrap_menu_new #menu_prev_btn:hover {
    color: var(--primary-0);
    font-weight: 700
}

.wrap_menu_dropdownMobile .menuLinkMobile {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #3d3d4e;
    font-weight: 400;
    padding-left: 10px;
    position: relative;
    cursor: pointer
}

.menuLinkMobile a {
    flex-grow: 1
}

.menuLinkMobile label {
    height: 100%;
    flex-grow: 2
}

.wrap_menu_dropdownMobile .menuLinkMobile:hover {
    background: var(--primary-0);
    color: #fff
}

.wrap_menu_dropdownMobile .menuLinkMobile i {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%) rotate(0);
    -webkit-transform: translateY(-50%) rotate(0);
    -moz-transform: translateY(-50%) rotate(0);
    -ms-transform: translateY(-50%) rotate(0);
    -o-transform: translateY(-50%) rotate(0)
}

.wrap_menu_dropdownMobile .wrapSubmenuItem {
    padding-left: 20px;
    height: auto;
    max-height: 0;
    overflow: hidden;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s
}

input[name=openMenuItem]:checked~.wrapSubmenuItem {
    max-height: 100vh;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s
}

input[name=openMenuItem]:checked~.menuLinkMobile i {
    transform: translateY(-50%) rotate(180deg);
    -webkit-transform: translateY(-50%) rotate(180deg);
    -moz-transform: translateY(-50%) rotate(180deg);
    -ms-transform: translateY(-50%) rotate(180deg);
    -o-transform: translateY(-50%) rotate(180deg)
}

.txt_category_mobile {
    font-weight: 600;
    font-size: 15px;
    line-height: 20px;
    color: #3d3d4e;
    margin-bottom: 10px;
    margin-top: 15px
}

blockquote {
    font-size: 1.4em;
    margin: 12px auto;
    color: #555;
    padding-top: 35px;
    padding-left: 35px;
    border-left: 8px solid #78c0a8;
    line-height: 1.6;
    position: relative;
    background: #ededed
}

blockquote::before {
    font-family: Arial;
    content: "\201C";
    color: #78c0a8;
    font-size: 4em;
    position: absolute;
    left: 5px;
    top: -25px
}

blockquote p,blockquote span {
    background-color: transparent!important
}

blockquote::after {
    content: "";
    display: none
}

.news-detail p,.news-detail p *,.news-detail-description p,.news-detail-description p * {
    text-align: justify!important
}

.news-detail img, .news-detail-description img{
    max-width: 100% !important;
    height: auto !important;
}

.bannerText {
    font-size: clamp(.7rem, 2.5vw, 1.5rem);
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%,-50%);
    white-space: nowrap;
    text-align: center;
    text-shadow: -1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
    z-index: 35;
    overflow: hidden
}

.bannerText p {
    color: #fff;
    font-weight: 700
}

.bannerText span {
    color: orange;
    font-weight: 700;
    animation: 1s infinite alternate blinking
}

.contact-info h2,.contact-map p,.contact-submit h3 {
    font-size: 18px;
    color: #3d3d4e
}

.bannerImage {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 5px
}

.close {
    position: absolute;
    top: 0;
    right: 1em;
    z-index: 36;
    width: 0;
    height: 0;
    cursor: pointer
}

.close::before {
    content: '\00D7';
    color: #fff;
    display: block;
    text-align: center;
    line-height: 1em;
    width: 1em;
    height: 1em;
    background-color: #192d45;
    border-radius: 5px;
    margin-top: -20px
}

.contact-form {
    margin: 60px auto;
    padding: 48px;
    max-width: 1240px;
    background: #fff;
    border-radius: 8px
}

.contact-title {
    width: 100%;
    text-align: center;
    font-weight: 600;
    font-size: 30px;
    line-height: 41px;
    color: #313131
}

.contact-container {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    grid-gap: 50px;
    margin-top: 50px
}

.contact-map p {
    font-weight: 600;
    margin-bottom: 20px
}

.contact-submit h3 {
    font-weight: 600;
    margin-bottom: 20px;
    margin-top: 0
}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.contact-social {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px
}

.contact-info h2 {
    font-weight: 600
}

.contact-item {
    width: 100%;
    margin-bottom: 15px
}

.contact-item input {
    width: 100%;
    outline: 0;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid #a3a3a3;
    margin-top: 8px
}

.contact-item p {
    font-size: 16px;
    font-weight: 500
}

.flex-contact {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: center
}

.contact-button {
    border: none;
    padding: 8px 40px;
    float: right;
    background: #0b544c;
    border-radius: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-top: 20px;
    cursor: pointer
}

@media screen and (min-width: 820px) {
    .rs-image-desktop {
        max-width:1000px;
        min-width: 800px
    }

    .desktop {
        display: none
    }

    .mobile {
        display: block
    }
}

@media screen and (max-width: 1310px) {
    .wrap_menu_new {
        display:none
    }
}

@media screen and (max-width: 820px) {
    .bannerImage {
        width:100%
    }

    .break,.desktop {
        display: block
    }

    .mobile {
        display: none
    }

    .contact-container {
        grid-template-columns: 1fr
    }

    .contact-form {
        padding-left: 30px;
        padding-right: 30px
    }
}

@keyframes blinking {
    0% {
        text-shadow: -1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff;
        color: #ff0
    }

    100% {
        text-shadow: -1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
        color: orange
    }
}

.btnCustomArticle {
    -webkit-animation: 1.5s ease-in-out infinite both heartbeat;
    animation: 1.5s ease-in-out infinite both heartbeat;
    color: #fff!important
}

@-webkit-keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    10% {
        -webkit-transform: scale(.91);
        transform: scale(.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    17% {
        -webkit-transform: scale(.98);
        transform: scale(.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    33% {
        -webkit-transform: scale(.87);
        transform: scale(.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    10% {
        -webkit-transform: scale(.91);
        transform: scale(.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    17% {
        -webkit-transform: scale(.98);
        transform: scale(.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    33% {
        -webkit-transform: scale(.87);
        transform: scale(.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@media screen and (max-width: 600px) {
    .news-detail-title {
        line-height:7.2vw;
        font-size: 5.3vw
    }

    .news-detail-description {
        font-size: 4.26vw;
        line-height: 5.86vw;
        margin-top: 4.8vw
    }

    .news-detail-description p span {
        font-size: 4.26vw!important;
        line-height: 7.86vw!important
    }

    .slim-devider {
        width: 100%;
        height: .5px;
        margin-top: 5.3vw!important;
        margin-bottom: 5.3vw!important;
        background-color: #d8d8d8
    }

    .news-detail-qa {
        margin-top: 8vw
    }

    .news-detail-qa-title {
        font-size: 4.27vw;
        line-height: 5.6vw;
        color: #313131
    }

    .news-detail-qa-item {
        margin-bottom: 6.4vw;
        padding: 5.3vw 3.2vw
    }

    .news-detail-social,.news-detail-tags {
        margin: 0
    }

    .news-detail-social>div {
        margin-left: 0!important
    }

    .news-detail-tags-item {
        margin: 4.27vw 1.6vw 0 0
    }

    .news-detail-comment-input-box {
        margin-top: 0
    }

    .news-detail-comment-title {
        margin-top: 6px
    }

    .other-news-title {
        margin-top: 4.8vw;
        font-size: 4.8vw;
        color: #313131
    }

    .other-news-item {
        margin-top: 5.33vw
    }

    .news-item {
        margin-bottom: 8vw
    }

    .mb-0-sm {
        margin-bottom: 0!important
    }

    .form_createArticle_user .formActicle-2-col {
        grid-template-columns: 1fr
    }

    .form_createArticle_user .formActicle-2-col .title_row {
        margin-bottom: 10px;
        margin-top: 20px
    }

    .page_account .btn-toggle {
        width: 100%;
        margin: 0 5px
    }

    .btn-toggle {
        font-size: 12px
    }

    .breakLine-sm::after {
        content: "";
        display: block
    }

    .line_mobile {
        display: block;
        width: calc(100% + 4.8vw + 4.8vw);
        height: 7px;
        background-color: #ededed;
        margin-top: 8vw;
        margin-left: -4.8vw
    }

    .ab-description {
        text-align: justify
    }

    .mobile-footer-banner,.mobile-top-banner,.page_article .slim-devider,.page_details .slim-devider {
        display: block
    }

    .breadcrumbs .breadcrumbs-line {
        font-size: 3.73vw;
        margin-top: 0
    }

    .breadcrumbs .breadcrumbs-txt {
        font-size: 3.73vw;
        padding-bottom: 0
    }

    .page_details .news-detail-qa-item h2,.page_details .news-detail-qa-item h2 span {
        font-weight: 700;
        font-size: 6.4vw!important;
        line-height: 7.3vw!important;
        text-align: start!important
    }

    .page_details .news-detail-qa-item h3,.page_details .news-detail-qa-item h3 span {
        font-size: 5.33vw!important;
        line-height: 6.6vw!important
    }

    .page_details .news-detail-qa-item h4,.page_details .news-detail-qa-item h4 span {
        font-weight: 700;
        font-size: 4.8vw!important;
        line-height: 6.1vw!important
    }

    .page_details .news-detail-qa-item p,.page_details .news-detail-qa-item span,.page_details .news-detail-qa-item ul {
        font-size: 4.26vw!important;
        line-height: 7.6vw!important
    }

    .wrap_toc_mobile {
        position: fixed;
        display: block;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%);
        background-color: #fff;
        z-index: 4;
        width: 90%;
        height: 0;
        overflow-y: scroll;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        padding-right: 15px
    }

    .btn_openToc {
        right: 10px;
        font-size: 20px;
        width: 40px;
        height: 40px;
        opacity: .7
    }

    .wrap_toc {
        width: 80%
    }

    .banner_aboutus {
        height: 55.3vw
    }

    .desktop-footer-banner,.desktop-top-banner {
        display: none
    }
}

.quote {
    position: relative;
    padding: 15px 30px
}

.quote::after,.quote::before {
    font-weight: 700;
    font-size: 40px;
    position: absolute
}

.quote::before {
    content: open-quote;
    line-height: 1;
    top: 0;
    left: 0
}

.quote::after {
    content: close-quote;
    line-height: 0;
    right: 0;
    bottom: 0
}