/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

:root{
  --primary-color: #c07b39; 
  --secondary-color: #19236b;
  --success-color: #fff;
  --alert-color: #4ea0dc;
}

blockquote, dl, figure, form, ol, p, pre, ul {
  margin-bottom: 10px;
  margin-top: 10px;
}

h1,h2,h3,h4,h5,h6{
  margin-bottom: 15px;
}

/* p, span, ul li{
  font-size: 15px;
} */
.button span {
  font-weight: 400;
}

.col, .columns, .gallery-item {
  padding: 15px;
}

.top-divider {
  border-top: NONE;
}
.nav-line-bottom>li>a:before{
  height: 2px;
}

.main_title{
  font-size: 25px;
  margin-bottom: 15px;
}
.des_title{
  font-size: 20px;
  margin-bottom: 15px;
}
.sec_title{
  font-size: 16px;
  margin-bottom: 15px;
}
.button_main:hover{
  background-color: var(--alert-color);
}

/* .form_ft .col{
  padding: 10px !important;
} */
input[type=text],input[type="email"],input[type=submit],input[type=number],textarea,select{
  border-radius: 4px;
}

.slider-nav-light .flickity-page-dots .dot.is-selected, .slider-nav-light.slider-nav-dots-simple .flickity-page-dots .dot,.slider-nav-light .flickity-page-dots .dot {
  border-radius: 16px
}
.slider-nav-light .flickity-page-dots .dot.is-selected{
  border-color: var(--primary-color);
}

svg.flickity-button-icon {
  display: none;
}
button.flickity-button.flickity-prev-next-button.previous::after, button.flickity-button.flickity-prev-next-button.previous::after {
  background-size: 100% 100%;
  content: '\f060';
  position: absolute;
  left: 0;
  font-family: "Font Awesome 6 Free";
  color: var(--primary-color);
  font-size: 20px
}
button.flickity-button.flickity-prev-next-button.next::after, button.flickity-button.flickity-prev-next-button.next::after {
  background-size: 100% 100%;
  content: '\f061';
  position: absolute;
  right: 0;
  font-family: "Font Awesome 6 Free";
  color: var(--primary-color);
  font-size: 20px
}
.inline_title{
 border-bottom: 1px solid #fff;
 max-width: max-content;
}

.section_footer a{
  color: var(--alert-color) !important;
}
.absolute-footer {
  display: none;
}

.hover-link a {
  position: relative;
  text-decoration: none;
  color: #000; /* Màu chữ */
}

.hover-link a::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 0.5px; /* Độ dày của đường viền */
  bottom: 0;
  left: 0;
  background-color: #ffffff; /* Màu của đường viền */
  transform: scaleX(0);
  transform-origin: bottom right;
  transition: transform 0.3s ease-out;
}

.hover-link a:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

.button.is-outline {
  border: 1px solid var(--alert-color);
    background: #fff;
    color: var(--primary-color);
}
a#top-link:before {
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 0;
  height: 10px;
  width: 100%;
  opacity: 1;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, .25) 0%, rgba(0, 0, 0, 0) 80%);
}

.section_bg{
  background: linear-gradient(270deg, #236093 0%, #345574 100%);
}
.border_img img{
  border: 10px solid #E1E1E1;
}
.border_img_tron img{
  border-radius: 99%;
  border: 10px solid #E1E1E1;
}

.gallery_in      {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Hàng trên chứa ảnh chính */
.gallery-top img {
  border: 1px solid #c07b39;
  padding: 8px;
  width: 100%;
  height: auto;
  margin-bottom: 15px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

/* Hàng dưới chứa các thumbnail */
.gallery-bottom {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 8px;
  justify-items: center;
  border: 1px solid #c07b39;
  padding: 8px; 
}
.gallery-bottom br {
  display: none;
}
.gallery-bottom img {
  width: auto;
  height: auto;
  cursor: pointer;
  transition: transform 0.3s ease;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}

.gallery-bottom img:hover {
  transform: scale(1.1);
}

.main_tab .nav-pills li a {
  border-radius: 0;
  padding: 10px 20px;
  margin-right: 1px;
  margin-bottom: 10px;
}
.main_tab .nav-pills li a {
  background-color: #4ea0dc;
  color: #fff;
  opacity: 1;
}
.main_tab .nav-pills>li.active>a {
  background-color: #c07b39;
  color: #fff;
  opacity: 1;
}
.main_tab .tab-panels{
  padding: 5px;
  border: 1px solid #c07b393b;
  background-color: #f8f8f8;
}

table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0;
}
th {
  background-color: #c07b39;
  text-align: center;
  color: white;
  padding: 10px;
  border: 1px solid black;
}
td {
  padding: 10px;
  border: 1px solid black;
}
tr:nth-child(even) {
  background-color: #f2f2f2;
}
tr:nth-child(odd) {
  background-color: #ffffff;
}
tr th:first-child, tr td:first-child{
  padding-left: 10px;
}
.color_title_tab span{
  color: #fff !important;
}

/* Slider Imgae */
button.slick-prev.slick-arrow,button.slick-next.slick-arrow {
  background: #ffffff00 !important;
}
.slick-prev:before, .slick-next:before{
  color: #c07b39 !important;
}

/* Host post */
.banner h5, .banner h6, .banner p {
  margin-bottom: 10px;
  margin-top: 10px;
}
.hotspot{
  background: #fff;
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 500;
}
.hotspot_number{
  background: #ffffff;
  padding: 4px 9px;
  font-size: 12px;
  border-radius: 99px;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.glow {
  animation: glowing 2s infinite;
}

/* Keyframes tạo ánh sáng lan tỏa mạnh mẽ */
@keyframes glowing {
  0% {
    box-shadow: 0 0 20px rgba(255, 255, 255, 1),
      0 0 40px rgba(255, 255, 255, 0.9),
      0 0 60px rgba(255, 255, 255, 0.8),
      0 0 80px rgba(255, 255, 255, 0.7);
  }

  50% {
    box-shadow: 0 0 100px rgba(255, 255, 255, 1),
      0 0 150px rgba(255, 255, 255, 1),
      0 0 200px rgba(255, 255, 255, 1),
      0 0 250px rgba(255, 255, 255, 1);
  }

  100% {
    box-shadow: 0 0 20px rgba(255, 255, 255, 1),
      0 0 40px rgba(255, 255, 255, 1),
      0 0 60px rgba(255, 255, 255, 1),
      0 0 80px rgba(255, 255, 255, 1);
  }
}


.tabbed-content span{
  font-size: 12px !important;
}
.sub-menu {
  text-transform: uppercase;
}
/* .sub-menu ul li {
  font-style: 14px !important;
} */
.nav-column>li>a{
  color: #000;
}
.header-main ul.sub-menu.nav-column.nav-dropdown-simple li a {
  font-size: 13px;
  font-weight: 400;
}
/* ul.sub-menu.nav-column.nav-dropdown-simple ul li a:before {
  content: "\f0da";
  font-family: 'Font Awesome 6 Free';
  margin-left: 5px;
}
.fa-solid {
  font-family: "Font Awesome 6 Free";
} */