/* ----- CSS for 1000NTL ----- */
/*.hot-news .box-content {      display: flex;    flex-wrap: wrap;}
.hot-news .box-content .story, .hot-news .box-content .story:last-child {        padding-left: 20px;    margin-bottom: 10px;    padding-bottom: 10px;    border-bottom: 1px solid rgba(0,0,0,.1);width: 49%;}
.hot-news .box-content .story:before {        content: '.'; font-size: 40px!important; margin-top:-20px;} 
.hot-news .box-content .story:first-child::before {      border-bottom: unset;    }
.hot-news .story__summary {     margin-bottom: 20px;font-size: 18px;}
.hot-news .box-content .story:first-child .story__thumb {float: left;     margin-left: unset;} 
.onemain-multisub .sub-title {     flex-wrap: wrap; overflow-x: auto;}*/
/* ----- End CSS for 1000NTL ----- */
:root{    --gold:#FFD700;    --bright-red:#FF0000;    --silver:#C0C0C0;    --bright-primary:#338FFF;}
.site-header {    background: var(--primary);}
.site-header .user-menu {    display: flex;}
.site-header .user-menu .btn-login .ic-profile, .site-header .user-menu .avatar-user .ic-logout{    color: var(--primary);    font-size: 23px; }
.user-menu .avatar-user {    font-size: 14px;    font-weight: 600;    line-height: 1.5; display: flex;    justify-content: center;    align-items: center;    gap: 8px;color: var(--primary);  }
.user-menu .avatar-user img {    display: block;    width: 24px;    height: 24px;    border-radius: 50%;}
.user-dropdown {    border-radius: 6px;    border: 1px solid var(--Gray-200,#e9ecef);    background: #fff;    box-shadow: 4px 4px 16px 0 rgba(0,0,0,.4);    position: absolute;    min-width: 250px;  top: 56px;    right: 10px;    padding: 16px 20px;    display: none;    z-index: 2}
.user-dropdown.show{display: block;}
.user-dropdown::before {    position: absolute;    content: "";    width: 0;    height: 0;    border-left: 8px solid transparent;    border-right: 8px solid transparent;    border-bottom: 8px solid var(--white);
    top: -8px;    right: 70px;}
.user-dropdown li {    padding-bottom: 13px;    margin-bottom: 13px;    border-bottom: 1px solid var(--border-color);}
.user-dropdown li a {    display: flex;    align-items: center;    gap: 10px;    color: var(--title,#212529);    font-size: 18px;    font-weight: 400;    line-height: 1.5;}
.site-header .container .user-dropdown li a .ic-profile {    display: flex;}
/*Download*/
.site-body.download-page{min-height: 58vh;}
    .btn-download {    min-height: 42px;    width: 200px;    padding: 0 16px;    text-transform: uppercase;    background: var(--primary);    display: flex;    align-items: center;    justify-content: center;    margin: 0 auto;   color: var(--white,#fff);    font-size: 18px;    font-weight: 400;    transition: .3s;margin-bottom: 16px;border-radius: 10px;}
    a.btn-download:hover {    color: var(--white)!important;background: var(--secondary);}

/* #043357 */
    .wrap-video video{width: 100%;height: 100%;}
    .wrap-info .article__body{max-height: calc(480px * 9 / 16);    overflow-y: scroll;    margin-bottom: 7.5px;font-size: 18px;}
    .wrap-info .article__body::-webkit-scrollbar {    width: 4px;}
    .wrap-info .article__body::-webkit-scrollbar-thumb {    border-radius: 24px;    background-color: var(--primary);}
    .wrap-info .article__body::-webkit-scrollbar-track {    background-color: var(--gray-100);}
    .wrap-info .article__title{ font-size: 24px;    line-height: 1.3;      margin-bottom: 12px;font-weight: bold;}
    .wrap-info .article__meta {    display: flex;    gap: 16px;}
    .wrap-info .article__meta .author {       font-size: 16px;    font-weight: 500;    line-height: 150%;margin-top: 10px;}
    .wrap-info .article__meta .time {     font-size: 14px;    font-weight: 400;    line-height: 150%;    padding-top: 3px;}
    .wrap-btn{text-align: right;margin-top: 15px;margin-bottom: 20px;display: inline-block;}
    .wrap-btn .btn-download {    min-height: 38px;     padding: 9px;    text-transform: uppercase;    background: var(--primary);       align-items: center;    justify-content: center;   margin-right: 7px;   color: var(--white,#fff);    font-size: 15px;    font-weight: 400;    transition: .3s;margin-bottom: 16px;border-radius: 10px;}
    a.btn-download:hover {    color: var(--white)!important;background: var(--secondary);}
    .onemain-multisub .box-heading .title {color:var(--primary);}
    .onemain-multisub .box-heading{margin-top: 20px;margin-bottom: 20px;}       
    .onemain-multisub .wrapper .story .story__heading a{font-size: 17px;}   
    .site-body .container .video-detail{margin-bottom: 20px;}


  /* #043357 */
  .wrap-video video{width: 100%;height: 100%;}
  .wrap-info .article__body{max-height: calc(480px * 9 / 16);    overflow-y: scroll;    margin-bottom: 7.5px;font-size: 18px;}
  .wrap-info .article__body::-webkit-scrollbar {    width: 4px;}
  .wrap-info .article__body::-webkit-scrollbar-thumb {    border-radius: 24px;    background-color: var(--primary);}
  .wrap-info .article__body::-webkit-scrollbar-track {    background-color: var(--gray-100);}
  .wrap-info .article__title{ font-size: 24px;    line-height: 1.3;      margin-bottom: 12px;font-weight: bold;}
  .wrap-info .article__meta {    display: flex;    gap: 16px;}
  .wrap-info .article__meta .author {       font-size: 16px;    font-weight: 500;    line-height: 150%;margin-top: 10px;}
  .wrap-info .article__meta .time {     font-size: 14px;    font-weight: 400;    line-height: 150%;    padding-top: 3px;}
  .wrap-btn{text-align: right;margin-top: 15px;margin-bottom: 20px;display: inline-block;}
  .wrap-btn .btn-download {    min-height: 38px;     padding: 9px;    text-transform: uppercase;    background: var(--primary);       align-items: center;    justify-content: center;   margin-right: 7px;   color: var(--white,#fff);    font-size: 15px;    font-weight: 400;    transition: .3s;margin-bottom: 16px;border-radius: 10px;}
  a.btn-download:hover {    color: var(--white)!important;background: var(--secondary);}
  .onemain-multisub .box-heading .title {color:var(--primary);}
  .onemain-multisub .box-heading{margin-top: 20px;margin-bottom: 20px;}  
  .onemain-multisub .wrapper .story .story__heading a{font-size: 17px;}   
  .site-body .container .video-detail{margin-bottom: 20px;}
  .abf-media>.box-content .story__heading a {    color: var(--black);    font-size: 16px;    padding-bottom: 4px;}
  .abf-media>.story .story__heading a { font-size: 28px;    padding-bottom: 4px; font-family: var(--font-family-second);}
  .abf-media>.wrapper {    display: grid;    grid-template-columns: repeat(2,1fr);    gap: 10px 20px;    margin-top: 20px;}
  .abf-media>.wrapper .story__thumb {margin-bottom: 16px;}    
  .abf-media>.wrapper .story__thumb a{    padding-bottom: 66.667%;}
  .abf-media>.wrapper .story__heading a {  font-size: 16px;    padding-bottom: 4px;}
  .abf-media>.wrapper .story .time {    font-size: 12px;    margin-bottom: 8px;}
  .abf-media>.story .story__thumb {margin-bottom: 16px;}
  .abf-media>.story .story__thumb a {    padding-bottom: 66.667%;}
  .abf-media>.box-content {margin-top: 20px;} 
  .abf-media>.box-content .story {    margin-bottom: 20px;    padding-bottom: 20px;    border-bottom: 1px solid var(--border-color);}
  .abf-media>.box-content .story__thumb {    width: 150px;    height: 100px;    margin-right: 16px;    float: left;    margin-top: 4px;}
    
/*icon  play*/
.abf-media>.story .story__thumb a .icon {    position: absolute; bottom:20px;left: 20px;width: 60px;height: 60px;    display: block;    border-radius: 50%;    content: "";    z-index: 1;    font-size: 0!important;}
.abf-media>.story .story__thumb a .icon-play {border-radius: 50%;position: absolute;width: 64px;height: 64px;background: url(../../styles/img/icon-play-lg.png) center center/64px no-repeat!important;}
.abf-media>.box-content .story .story__thumb a .icon, .four-pack>.box-content .story .story__thumb a .icon {    position: absolute; bottom:10px;left: 10px;width: 30px;    display: block;    border-radius: 50%;    content: "";    z-index: 1;    font-size: 0!important;}
.abf-media>.box-content .story .story__thumb a .icon-play, .four-pack>.box-content .story .story__thumb a .icon-play {border-radius: 50%;position: absolute;height: 24px;background: url(../../styles/img/icon-play-sm.png) center center/32px no-repeat!important;}
/*user profile*/
.site-header .user-menu {    display: flex;}
.site-header .user-menu .btn-login .ic-profile, .site-header .user-menu .avatar-user .ic-logout{    color: var(--gray-100);    font-size: 23px; }
.user-menu .avatar-user {    font-size: 14px;    font-weight: 600;    line-height: 1.5; display: flex;    justify-content: center;    align-items: center;    gap: 8px;color: var(--primary);  }
.user-menu .avatar-user img {    display: block;    width: 24px;    height: 24px;    border-radius: 50%;}
.user-dropdown {    border-radius: 6px;    border: 1px solid var(--Gray-200,#e9ecef);    background: #fff;    box-shadow: 4px 4px 16px 0 rgba(0,0,0,.4);    position: absolute;    width: 230px;
top: 56px;    right: 0;    padding: 16px 20px;    display: none;    z-index: 2}
.user-dropdown.show{display: block;}
.user-dropdown::before {    position: absolute;    content: "";    width: 0;    height: 0;    border-left: 8px solid transparent;    border-right: 8px solid transparent;    border-bottom: 8px solid var(--white);
top: -8px;    right: 70px;}
.user-dropdown li {    padding-bottom: 13px;    margin-bottom: 13px;    border-bottom: 1px solid var(--border-color);}
.user-dropdown li a {    display: flex;    align-items: center;    gap: 10px;    color: var(--title,#212529);    font-size: 18px;    font-weight: 400;    line-height: 1.5;}
.site-header .container .user-dropdown li a .ic-profile {    display: flex;}
/*Popup Modal*/
.modal-backdrop {    display: none;    position: fixed;    top: 0;    left: 0;    right: 0;    bottom: 0;    width: 100%;    height: 100%;    background-color: rgba(0,0,0,.5);    z-index: 1009;}
.modal-backdrop.show , .modal.show{display: block;}
.modal {    display: none;    position: fixed;    top: 60px;    left: 0;    right: 0;    margin: 0 auto;    background: var(--Gray-White,#fff);    border-radius: 4px;    box-shadow: 0 3px 10px rgba(0,0,0,.3);    z-index: 9999;    max-width: calc(100% - 30px);    height: fit-content;    padding-bottom: 20px;}
.modal .modal-header {    border-radius: 4px 4px 0 0;    border-bottom: 1px solid #e9ecef;    background: var(--primary);    padding: 12px 25px 12px 20px;    display: flex;    align-items: center; justify-content: space-between;}
.modal .modal-header .modal-title {    color: var(--gray-200);    font-size: 24px;    font-weight: var(--font-weight-semibold);    line-height: 160%;}
.modal .modal-header .btn-close, .modal .modal-header .close {    width: 20px;    height: 20px;    font-size: 0;    position: relative;    display: flex;    align-items: center;}
.modal .modal-header .btn-close::before, .modal .modal-header .close::before {    position: absolute;    content: "\e90f";    color: #adb5bd;    font-size: 20px;    font-family: icomoon;}
.modal .modal-body {    overflow-y: scroll;    overflow-x: hidden;    max-height: 450px;    font-size: 16px;    padding: 20px;    color: #000;}
.modal .modal-body>* {    margin-bottom: 16px;}
.modal .modal-body .form-group {    position: relative;    padding-top: 10px;}
.modal .modal-body .form-group label {    color: #6c757d;    font-size: 14px;    position: absolute;    top: 5px;    left: 10px;    background: var(--Gray-White,#fff);    width: fit-content;    padding: 0 10px;
z-index: 1;    margin-bottom: 0;}
.modal .modal-body .form-group .form-select, .modal .modal-body .form-group input.form-control {    border-radius: 6px;    border: 1px solid rgba(0,0,0,.1);    background: var(--Gray-White,#fff);    width: 100%;
height: 50px;    padding: 0 16px;}
.modal-body .d-flex .ic-eye {    position: absolute;    padding: 13px 10px;    width: 35px;    right: 0;    cursor: pointer;    height: 50px;    bottom: 0;    background: url(../../styles/img/eye.svg) center center/18px no-repeat;}
.ic-eye:before {    content: "\e913";}
.modal .modal-body .text-notice {    color: #888;    font-size: 14px;    font-weight: var(--font-weight-normal);    line-height: 150%;    display: flex;    align-items: center;    flex-wrap: wrap;    gap: 8px;}
.modal .modal-body .text-notice input {    border-radius: 2px;    border: 1px solid rgba(0,0,0,.2);    background: var(--Gray-White,#fff);    width: 16px;    height: 16px;}
.modal .modal-body .text-notice label {    margin-bottom: 0;}
.modal .modal-body .text-notice .forget-password {    margin-left: auto;}
.modal .modal-body .btn-submit {    border-radius: 6px;    background: linear-gradient(258deg,#0067b8 0,#264097 95.34%);    height: 52px;    color: var(--Gray-White,#fff);    font-size: 20px;    line-height: 160%;
text-transform: uppercase;    width: 100%;}
.ads_close, .banner_hidden, .hidden, .login-fb, .rennab_hidden, .title-hidden {    display: none!important;}
.modal .modal-body .text-decor {    color: #888;    font-size: 14px;    font-weight: var(--font-weight-normal);    line-height: 150%;    position: relative;    display: grid;    grid-template-columns: 1fr max-content 1fr;    align-items: center;    gap: 16px;}
.modal-body .incognito {    color: #444;    text-align: center;    font-size: 16px;    font-weight: var(--font-weight-medium);    line-height: 150%;    text-transform: uppercase;    display: grid;    grid-template-columns: repeat(2,max-content);    gap: 8px;    justify-content: center;}
.modal .modal-body .text-decor::after, .modal .modal-body .text-decor::before {    content: "";    width: 100%;    height: 1px;    left: 0;    background: rgba(0,0,0,.1);}
.modal .modal-body .social-group {    display: flex;    justify-content: center;    gap: 12px;    margin-bottom: 15px;}
.modal .modal-body .social-group>* {    width: 100%;    height: 48px;    padding: 0 24px;    font-size: 0;    border-radius: 6px;    transition: .3s;}
.modal .modal-body .social-group>.fb {    background: url(../../styles/img/facebook.png) center center/70px no-repeat rgba(59,89,152,.1);}
.modal .modal-body .social-group>.zl {    background: #ebedfc url(../../styles/img/zalo.png) center center/30px no-repeat;}
.modal .modal-body .social-group>.gg {    background: url(../../styles/img/google.png) center center/50px no-repeat rgba(204,64,52,.1);}
.modal .modal-body .text-center {    text-align: center;    justify-content: center;}
.modal .modal-body .text-notice a {    color: #0b699e;}
.modal .wrapper.video .modal-title {    color: #000;    font-size: 2rem;    font-weight: var(--font-weight-semibold);    line-height: 160%;}
.iframe-container {            position: relative;            width: 100%;            overflow: hidden;            padding-top: 56.25%; /* 16:9 aspect ratio */        }
.iframe-container iframe {            position: absolute;            top: 0;            left: 0;            width: 100%;            height: 75%;            border: 0;        }
    @media (max-width: 767.98px){
        .story__thumb {    margin-bottom: 8px;}
      }

  /* dark-theme*/
    .dark-theme {  background: var(--gray-900, #212529);color: var(--gray-100);}
    .dark-theme .breadcrumb-detail.breadcrumb .main a,  .dark-theme .wrap-gray {   background-color: var(--gray-800);        padding: 10px 16px 36px 16px;    margin-bottom: -36px!important;margin: 0 -16px;} /*margin: 0 -16px;*/
	.detail-page.dark-theme .wrap-gray {   background-color: var(--gray-800);    margin-bottom: -36px!important; padding:16px 0;margin:unset;}
	.dark-theme .breadcrumb-detail.breadcrumb .main a.active{background-color:var(--gray-900);}
    .dark-theme .onemain-multisub .box-heading .title, .dark-theme .story__heading a {    color: var(--gray-100); }
	.dark-theme .site-header {    background: var(--primary);}
	.dark-theme .site-header>[class*=ic-] {  color: var(--gray-100);}
	.dark-theme .site-header .logo {    background:url(../../styles/img/logo-white.png) center center/117px 35px no-repeat;}
    .dark-theme .story__thumb img{border-radius: 7px;}
    .dark-theme .story .time { color: var(--gray-300);}
    .dark-theme .onemain-multisub .box-heading .title, .dark-theme .story__heading a {    color: var(--gray-100); }
    .dark-theme .abf-media>.box-content .story__heading a, .dark-theme .breadcrumb-detail.breadcrumb .main a.active{color: var(--gray-100);}
    .dark-theme .abf-media>.box-content .story {    margin-bottom: 10px; border-bottom:unset;}
    .dark-theme .onemain-multisub .sub-title a{color:var(--gray-100);font-size: 16px; margin-right: 18px;}
    .dark-theme .onemain-multisub .box-content>.story .story__heading a {font-size: 20px;}
    .dark-theme .onemain-multisub .wrapper .story .story__heading a{font-size: 16px;}
    .dark-theme .site-header>[class*=ic-] {    color: var(--gray-100);}   
    .dark-theme .four-pack .story{  margin-bottom: 10px; border-bottom:unset;}
    .dark-theme .four-pack>.box-heading .title,  .dark-theme .breadcrumb .main a.active {color:var(--gray-100)!important;}
    .dark-theme .site-header>[class*=ic-] {  color: var(--gray-100);}
	/*chinh sua lai sau thay font*/
	.wrap-info .article__title {    font-size: 22px; margin-top: 10px;}
	.navigation .menu>li>a { font-size: 20px;    font-weight: 500;}
	.story__heading a{font-weight:500;}
	.onemain-multisub .box-content>.story .story__heading a {    font-size: 22px;}
	.four-pack .story__heading a{font-size:16px;}
	.abf-homepage .story:first-child .story__heading a {    font-size: 26px;  font-weight:500;  } 
	.abf-homepage .story:not(:first-child) .story__heading a {    font-size: 16px;   }
    .box-content .story__heading a{font-size: 16px;}
    /*css khối sự kiện */
.dark-theme .event a{color: var(--gray-100);}
.event {display: flex;}
.container .event{margin-bottom: 15px!important;}
.container .event {    position: relative;    padding-bottom: 8px;    margin-top: 25px;    padding-top: 0;    border: none;    box-shadow: none;    height: 32px;    overflow: hidden;    margin-bottom: 0px;}
.container .event::after, .container .event::before {    position: absolute;    content: "";    background: var(--Gray-400,#ced4da);    height: 1px;    width: 100%;    bottom: 0;}
.container .event::after {  bottom: 2px;}
.event {    display: flex;    gap: 15px;    border-top: 1px solid var(--Gray-900,#212529);    box-shadow: 0 1px 0 0 rgba(0,0,0,.05);    padding: 20px 0;}
.event a.title {font-size: 16px;font-weight: 800;line-height: 150%;    text-transform: uppercase;    white-space: nowrap;    float: left;    margin-right: 0; color: var(--primary);}
.event .event-list{align-items: center;}
.event .event-list a {  margin-right: 30px;    line-height: 150%;    white-space: nowrap;    position: relative;    width: auto!important;text-transform: uppercase;        font-size: 16px;font-weight: 500;}
.event .event-list a::before {    position: absolute;    content: "";    width: 1px;    height: 10px;    background: var(--primary);    left: -15px;    top: 50%;    transform: translateY(-50%);}
/* .event .event-list a:hover{color: var(--gold) !important;} */
.dark-theme .story__heading a:hover,.dark-theme .box-heading .title:hover{color:#338FFF!important; }
a:hover{color:var(--bright-primary)!important;}
.dark-theme .event a.title{color:var(--gold);}
.dark-theme .event .event-list a:hover{color: var(--gold) !important;}
.dark-theme .search-tags .keywords, .dark-theme .search-tags .result,.dark-theme .search-tags .result span {color:var(--silver);}
.dark-theme .search-tags .keywords span{color:var(--gold);font-size: 23px;    font-family: var(--font-family-second);}
.dark-theme .navigation .menu {color: #000;}