/* RESET & BASE */
*,
*::before,
*::after {box-sizing: border-box;}
body {font-family: Tahoma; font-size: 14px; line-height: 1.6; color: #333; margin: 0;}
html {overflow-y: scroll; scrollbar-gutter: stable;}
h1, h2, h3, h4, h5, h6 {font-weight: bold;} 
h1 {font-size: 20px;}
h2 {font-size: 19px;}
h3 {font-size: 18px;}
h4 {font-size: 17px;}
h5 {font-size: 16px;}
h6 {font-size: 15px;}
a {color: inherit; text-decoration: none; transition: all 0.3s ease;}
a:hover {color: #e53526;}
img {max-width: 100%; height: auto; display: block;}
/* HEADER */
header .nav-link {color: #333;font-weight: 500;}
header .nav-link:hover {color: #0d6efd;}
.site-header {left: 0; right: 0;}
.nav-item .dropdown-menu {box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);} /* giữ dropdown đẹp */
.categories {
     list-style: none;
     padding: 7px 5px 7px 15px;
     margin-left: 0;
}
.usercp-dropdown {
     position: absolute !important;
     left: 0 !important;
     width: 235px !important;
     max-width: none !important;
     box-sizing: border-box;
     z-index: 1050;
}
.user_tool {padding: 10px;}

/* FOOTER */
.site-footer {font-size: 14px;}
.site-footer a {color: #ccc;}
.site-footer a:hover {color: #fff;}
main {padding-top: 70px;}
.logo {width: 60%; height: 60%;}

/* #container {width: 99%; max-width: 1200px; margin: 0 auto;} */
#container {width: 99%; margin: 0 auto;}
.container-header {
     width: 99%;
     /*max-width: 1200px; */
     margin: 0 auto;
     box-sizing: border-box;
}
.svn-header {}
.svn-content {}
.svn-sidebar {}

.card-body {flex-grow: 1;}

/* Grid Home */
:root {
     --ratio-width: 150;
     --ratio-height: 200;
}
.thumb .th-img {
     position: relative;
     width: 100%;
     aspect-ratio: var(--ratio-width) / var(--ratio-height);
     overflow: hidden;
     background: #ddd;
}
.thumb .th-img .image-scroll {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-size: cover;
     background-position: top left;
     transition: all 3s linear;
}
.thumb .th-img:hover .image-scroll {background-position: bottom right;}
.th-text {padding: 0 5px;}
.th-title {display: block;font-weight: bold;}
.news-info {font-size: 11px;}

/* TOP NEWS * /
/* Topnews layout (1 cột) */
.topnews {
     display: flex;
     align-items: flex-start;
}
.topnews-img {
     flex: 0 0 auto;
     width: 60px;
     aspect-ratio: var(--ratio-width) / var(--ratio-height);
     overflow: hidden;
     background: #ddd;
     position: relative;
}
.topnews-img .image-scroll {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-size: cover;
     background-position: top left;
     transition: all 3s linear;
}
.topnews-img:hover .image-scroll {background-position: bottom right;}

/*
:root {
  --ratio-width: 150;
  --ratio-height: 200;
}

/* Khung ảnh crop 
.thumb .th-img {
  position: relative;
  width: 100%;
  aspect-ratio: var(--ratio-width) / var(--ratio-height);
  overflow: hidden;
  background: #ddd;
}

/* Ảnh trong khung 
.thumb .th-img .image-scroll {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* crop giống background-size: cover 
  transition: all 3s linear;
}

/* Hover: trôi ảnh
.thumb .th-img:hover .image-scroll {
  top: auto;
  bottom: 0;
  left: auto;
  right: 0;
}

.th-text { padding: 0 5px; }

.th-title {
  font-weight: bold;
  display: block;
  margin: 5px 0;
}

.news-info {
  color: #555;
  bottom: 0;
}*/

/* Áp Bootstrap style cho số trang */

.section-label {
     display: inline-block;
     position: relative;
     padding: 7.5px 15px;
     color: #fff;
     text-transform: uppercase;
     background-color: #e53526;
}

/* Mũi nhọn dưới */
.section-label::after {
     content: "";
     position: absolute;
     bottom: -10px;
     left: 20px;
     border-left: 10px solid transparent;
     border-right: 10px solid transparent;
     border-top: 10px solid #e53526;
}

/* Navigation */
.bottom-navi {
     display: flex;
     justify-content: center;
     align-items: center;
     flex-wrap: wrap;
     gap: 5px;
     margin: 15px 0 0 0;
     font-family: Arial, sans-serif;
}
.bottom-navi span, .bottom-navi a {
     display: inline-block;
     padding: 5px 10px;
     border: 1px solid #ccc;
     color: #333;
     text-decoration: none;
     border-radius: 4px;
}
.bottom-navi span.active {
     background-color: #333;
     color: #fff;
     font-weight: bold;
     border-color: #333;
}
.bottom-navi a:hover {background-color: #eee;}

/* Carousel */
.carousel-control-prev, .carousel-control-next {
     top: 10px;
     bottom: auto;
     width: auto;
     padding: 0 5px;
     opacity: 0.8;
}
.carousel-control-prev {
     right: 50px;
     left: auto;
}
.carousel-control-next {
     right: 10px;
}
.carousel-caption {
     position: absolute;
     left: 0;
     right: 0;
     bottom: 0;
     text-align: right;
     padding: 10px 15px 0 15px;
     background: rgba(0, 0, 0, 0.5);
}
.carousel-item img {
     width: 100%;
     aspect-ratio: 800 / 450;
     object-fit: cover;
     display: block;
}

/* PM System */
.pm-box {
     margin-bottom: 25px;
}
.pm_status {
     padding: 25px;
     background-color: #f1f5f9;
     border-radius: 2px;
}
.pm_progress_bar span {
     background: #e85319;
     font-size: 0;
     height: 20px;
     border-radius: 2px;
     display: block;
     overflow: hidden;
}
.pm_progress_bar {
     background-color: #e5dbcc;
     margin-bottom: 10px;
     border-radius: 2px;
     position: relative;
}
.pm_progress_bar .progress-text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-size: 12px;
     font-weight: 500;
     color: #000;
     background: none;
     pointer-events: none;
}

.btn-login {
     height: 25px;
     line-height: 25px;
     padding: 0 12px;
     font-size: 14px;
     border-radius: 4px;
}
.form-login {
     width: 120px !important;
     height: 25px !important;
}
/* Fix Rating */
.unit-rating, .unit-rating li a:hover, .unit-rating li.current-rating {background-image: url("../dleimages/rating.png");}
/* Captcha */
.c-captcha img {height: 38px;}
/* Comments action */
.mass_comments_action {text-align: right;}




.ui-dialog-titlebar-close,
.ui-dialog-titlebar-close .ui-icon,
.ui-dialog-titlebar-close span.ui-button-text {
    background: none !important;
    text-indent: 0 !important;
    opacity: 1 !important;
}
.ui-dialog-titlebar-close {
    position: absolute;
    right: 10px;
    top: 85%;
    transform: translateY(-50%);
    height: 32px;
    width: 32px;
    border: 0;
    background-color: transparent; /* trong suốt */
    padding: 0;
}
.ui-dialog-titlebar-close {
    background: url("../dleimages/close.png") no-repeat center center !important;
    background-size: contain !important;
    width: 32px;
    height: 32px;
    border: none;
}

/*
	.ui-dialog-titlebar-close .ui-icon {
		display: block;
    margin: 9px auto 0 auto;
    width: 12px;
    height: 12px;
    opacity: .5;
    font-weight: 600;
    font-size: 1rem;
	background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 122.88 122.88'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23f44336;fill-rule:evenodd;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Eclose-red%3C/title%3E%3Cpath class='cls-1' d='M61.44,0A61.44,61.44,0,1,1,0,61.44,61.44,61.44,0,0,1,61.44,0ZM74.58,36.8c1.74-1.77,2.83-3.18,5-1l7,7.13c2.29,2.26,2.17,3.58,0,5.69L73.33,61.83,86.08,74.58c1.77,1.74,3.18,2.83,1,5l-7.13,7c-2.26,2.29-3.58,2.17-5.68,0L61.44,73.72,48.63,86.53c-2.1,2.15-3.42,2.27-5.68,0l-7.13-7c-2.2-2.15-.79-3.24,1-5l12.73-12.7L36.35,48.64c-2.15-2.11-2.27-3.43,0-5.69l7-7.13c2.15-2.2,3.24-.79,5,1L61.44,49.94,74.58,36.8Z'/%3E%3C/svg%3E");
	}

	.ui-dialog-titlebar-close span.ui-button-text {
    display: block;
    margin: 9px auto 0 auto;
    width: 12px;
    height: 12px;
    background-size: 10px auto;
	background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 122.88 122.88'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23f44336;fill-rule:evenodd;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Eclose-red%3C/title%3E%3Cpath class='cls-1' d='M61.44,0A61.44,61.44,0,1,1,0,61.44,61.44,61.44,0,0,1,61.44,0ZM74.58,36.8c1.74-1.77,2.83-3.18,5-1l7,7.13c2.29,2.26,2.17,3.58,0,5.69L73.33,61.83,86.08,74.58c1.77,1.74,3.18,2.83,1,5l-7.13,7c-2.26,2.29-3.58,2.17-5.68,0L61.44,73.72,48.63,86.53c-2.1,2.15-3.42,2.27-5.68,0l-7.13-7c-2.2-2.15-.79-3.24,1-5l12.73-12.7L36.35,48.64c-2.15-2.11-2.27-3.43,0-5.69l7-7.13c2.15-2.2,3.24-.79,5,1L61.44,49.94,74.58,36.8Z'/%3E%3C/svg%3E");
    text-indent: -9999px;
    opacity: .5;
	}