/**
* Template Name: Restaurantly - v3.7.0
* Template URL: https://bootstrapmade.com/restaurantly-restaurant-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
  Bootstrap Grid v5.1.3 (https://getbootstrap.com/)
# General
--------------------------------------------------------------*/
/* use-> color: var(--textColorGrey);  */
:root {
  --white:#3f3f3f;
  --white:#fff;
  --whiteShade1:#F7F7F7;
  --whiteShade2:#FFFFFF6B;
  
  --black:#000;

  --background: #003e5e;
  --background: #FBFCFF;
  --backgroundShed1: #f5f7f8c2;  
  --backgroundShed2: #f5f7f8de;
  --textColorWhite:#FDFDFD;

  --textColorGrey:#2a2a2a;
  --textColorGreyShed1:#4B5A6A;
  --textContentColorGreyShade3:#5B6673;
  --textContentColorGreyShade4:#8d9095;
  /* --textColorGreyShed2:#151719; */

  --textTitleColorGrey:#272932;
  --textContentColorGrey:#576777;
  --textLinkColor:#201f1f;
  
  --textInactiveColorGrey:#686970;


  /* --background: #111619; */
  --primaryColor:#0A6EBD;
  --primaryColorShade1:#5A96E3;
  --primaryColorShade2:#82b1e7;
  --primaryColorShade3:#A1C2F1;
  --primaryColorShade4:#052640;
  --primaryColorShade5:#00000014;
  --secondaryColor:#E7CEA6;
  --secondaryColor0:#d9ba85;
  --secondaryColor1:#d8a47f;
  --secondaryColor2:#d8890c;
  
  --inputFieldBorderColor:#ced4da;

  /* --red:#a12c2f;
  --yellow:#f5a425;
  --yellowLight:#e7ae00b3;
  --yellowShade1:#fb7f00;
  --orangeShade1:#fb7f00;
  --orangeShade2:#ffa400;
  --cyanColor:#00a390;
  --bgBlackShade1:#131313b3;
  --bgBlackShade2:#000000e8;
  --bgBlackShade2Hover:#67676759;
  --bgTransparent:#00000000;
  --bgTransparent1:#00000082;
  --borderColor:#e5e8e7; */
  transition: --header-font-size 0.3s ease, --title-font-size 0.3s ease, --content-font-size 0.3s ease;
}

body {
  background: var(--background);
  color: var(--textColorWhite);
  text-align: justify;
}

/* font family */
.navbar a, 
.navbar a:focus,
#header .logo,
#header label,
.upload_application label,
.upload_application h5,
#header .register,
#hero h1,
.section-title h2,
#footer .footer-top .footer-info h3 {
  color: var(--textTitleColorGrey);
  /* text-transform: uppercase;
  font-family: "Poppins", sans-serif; */
  /* line-height: 1; */
  /* letter-spacing: 1px; */
}

/* .message .profile .img-card p,
.message .profile .img-card h5,
.cards .box h4,
.tab button,
#faq .faq-list li span,
#faq .faq-list .question,
#gallery .tabcontentGallery .item_card .card-title,
#gallery .tabcontentGallery .item_card .card-text,
#gallery .tabcontentGallery .item_card .btn,
#footer .footer-info h3,
#footer .footer-links h4,
#footer .footer-links a,
.forms form, */
body,
* { 
  font-family: Inter;
  font-style: normal;
}
h1, h2,
h1.logo span,
.section-title p,
.section-header h4.title,
#hero .content_data p,
.message .content,
.breadcrumbs h2,
.readableContent ul li {
  font-family: "Playfair Display", serif;
  font-style: normal;
} 
.logo_title span,
.logo_title {
  font-family: Inter !important;
}

.readableContent h2 {
  color: var(--textTitleColorGrey);
}
.readableContent ol li,
.readableContent p {
  color: var(--textContentColorGrey);
  line-height: 1.8;
}
.readableContent ol li::first-letter,
.readableContent p::first-letter {
  text-transform: capitalize;
}

.readableContent p,
.readableContent ol li {
  font-size: larger;
}
.readableContent p.content_title {
  color: var(--textColorGrey);
  font-size: larger;
  font-weight: 500;
}
.readableContent.normalFont p,
.readableContent.normalFont ol li {
  font-size: large;
}
.readableContent.normalFont p.note {
  font-size: initial;
  font-style: italic;
}

.readableContent .section-header {
  margin: 0 46px 40px 46px;
}
.readableContent .multiContent > div {
  padding-inline: 70px;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

input[type="checkbox"] + label,
input[type="checkbox"],
input[type="radio"] + label,
input[type="radio"] {
  cursor: pointer;
}

/* custom month year selection */
.month-year {
  cursor: pointer;
}
#month-year-picker {
  display: none;
  position: absolute;
  background: #e9ecef;
  border: 1px solid #ddd;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 0 10px 2px 0;
  z-index: 1000;
}
#month-year-picker select {
  margin: 5px;
}

/* replace textarea with Div container as input box */
.editor-container {
  width: 100%;
  min-height: 200px;
}
.word-limit-reached {
  /* Add visual cues for the user, e.g., */
  border: 2px solid #badebe;
  background-color: #f0f0e3;
}
section {
  /* padding: 60px 0; */
  padding: 100px 0;
  overflow: hidden;
}
.section-header,
.section-body {
  margin: 0 100px;
}
@media screen and (max-width: 768px) {
  section {
    /* padding: 0; */
  }

  .section-header,
  .section-body {
    margin: 0 40px;
  }
}
@media screen and (max-width: 500px) {
  section {
    /* padding: 0; */
  }

  .section-header,
  .section-body {
    margin: 0 5px;
  }
}
.section-header h4.title {
  color: var(--textTitleColorGrey);
  font-size: 40px;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 40px;
}
a {
  color: var(--secondaryColor2);
  text-decoration: none;
  font-weight: 500;
}
a:hover {
  color: var(--secondaryColor0);
  text-decoration: none;
}
.star::after {
  content: "*";
  display: inline-block;
  color: red !important;
}
table.work_details th { 
  vertical-align: initial;
}
table.edu_details th,
table.work_details th,
table.work_details tbody th { 
  text-align: center;
}
.text_left,
table.edu_details tbody th {
  text-align: left;
}
table.strong_title tbody td {
  font-weight: 500;
}
table.strong_title tbody td span {
  font-weight: 500;
  color: var(--textContentColorGreyShade3);
}
td {
    vertical-align: top;
}
.info-msg,
.error-msg {
  color: red;
  font-weight: 500;
}
.info-msg {
  color: #0093c5;
}
.info-msg-field,
.error-msg-field {
  outline: none !important;
  border: 1px solid red !important;
  background-color: #ffe4e4;
  border-color: red;
  box-shadow: 0px 5px 37px -6px rgba(189, 10, 10, 0.12) !important;
}
.info-msg-field:focus,
.error-msg-field:focus {
  border: 2px solid red !important;
  border-color: red;
}
.info-msg-field:focus {
  border: 2px solid #0093c5 !important;
  border-color: #0093c5;
}
.success-msg-field:focus {
  outline: none !important;
  border-color: #00ff48;
  border: 2px solid #00ff48 !important;
  box-shadow: 0px 5px 37px -6px rgba(189, 10, 10, 0.12) !important;
}

.scheme-status {
  color: var(--primaryColor) !important;
  font-size: larger !important;
  font-weight: 600 !important;
}
.scheme_info p {
    font-size: initial !important;
    margin: 0;
}
.mt30 {
  margin-top: 30px;
}
.mt45 {
  margin-top: 45px;
}
.mtBreadcrumbs {
  margin-top: 158px;
}

.pRevert {
  padding: revert;
}
.pInherit {
  padding: inherit;
}
.p25 {
  padding: 25px;
}
.p30 {
  padding: 30px;
}
.p60 {
  padding: 60px !important;
}
.pr70 {
  padding-right: 70px;
}
.pl20 {
  padding-left: 20px;
}
.pl70 {
  padding-left: 70px;
}
.pt30 {
  padding-top: 30px;
}
.pt45 {
  padding-top: 45px;
}
.pb20 {
  padding-bottom: 20px;
}


.pMax {
  padding: 5rem !important;
}


.fw6 {
  font-weight: 600;
}
.fw4 {
    font-weight: 400 !important;
}

#gender::first-letter {
    text-transform:capitalize;
}
/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #1a1814;
}
#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid #1a1814;
  border-top-color: var(--secondaryColor1);
  border-bottom-color: var(--secondaryColor1);
  border-radius: 50%;
  width: 60px;
  height: 60px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}
@-webkit-keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 996;
  width: 44px;
  height: 44px;
  border-radius: 50px;
  transition: all 0.4s;
  border: 2px solid var(--secondaryColor);
}
.back-to-top i {
  font-size: 28px;
  color: var(--secondaryColor);
  line-height: 0;
}
.back-to-top:hover {
  background: var(--secondaryColor);
  color: #1a1814;
}
.back-to-top:hover i {
  color: var(--primaryColor);
}
.back-to-top.active {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}
/*--------------------------------------------------------------
# Top Bar
--------------------------------------------------------------*/
#topbar {
  height: 30px;
  height: 110px;
  font-size: 14px;
  transition: all 0.5s;
  z-index: 996;
  background-color: #ffe5bb;
}
#topbar .logo_title {
  font-size: 40px;
  font-weight: 700;
  color: #201f1f;
  padding-top: 8px;
}
#topbar .logo_title p {
  font-size: 16px
}
#topbar .logo_title_md {
  font-size: 35px;
  font-weight: 700;
  color: #201f1f;
  padding-top: 8px;
}
#topbar .logo_title_md p {
  font-size: 14px;
}
#topbar .logo_title_sm {
  font-size: 20px;
  font-weight: 700;
  color: #201f1f;
  padding-top: 10px;
}
#topbar .logo_title_sm p {
  font-size: 8px;
}
#topbar.topbar-scrolled {
  top: -40px;
}
#topbar .languages ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  color: var(--secondaryColor1);
}
#topbar .languages ul a {
  color: var(--textColorGrey);;
}
#topbar .languages ul li + li {
  padding-left: 10px;
}
#topbar .languages ul li + li::before {
  display: inline-block;
  padding-right: 10px;
  color: var(--textColorGrey);
  content: "/";
}
#topbar .container {
    position: relative;
}
#topbar .container .languages {
    position: absolute;
    right: 0px;
    bottom: 0%;
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
  /* border-bottom: 1px solid rgba(12, 11, 9, 0.6); */
  transition: all 0.5s;
  z-index: 997;
  padding: 15px 0;
  padding: 8px 0;
  padding: 4px 0;
  /* top: 0px; */
  top: 110px;
}

#header,
#header.header-scrolled {
  background: var(--secondaryColor);
  /* background: #e7cea6a1 */
}
#header.header-scrolled {
  top: 0;
  background: var(--secondaryColor);
  /* border-bottom: 1px solid #37332a; */
}
#header .logo {
  margin: 0;
  padding: 0;
}
.navbar a, 
.navbar a:focus,
#header .logo,
#header label,
#header .register {
  font-size: 12px;
  font-weight: 600;
}
#header .logo .logo-name {
  display: flex;
  align-items: center;
  margin-left: -20px;
  width: 200px;
}
#header .logo a {
  color: var(--textTitleColorGrey);
  line-height: initial;
}
#header .logo span {
  font-size: 12px;
}
#topbar .logo img,
#header .logo img,
#header .logo .logo-size {
  max-height: 90px;
}
#header .logo img {
  height: 56px !important;
}
#header .logo .logo-size {
  width: 62px !important;
  filter: invert(0%) sepia(0%) saturate(7500%) hue-rotate(186deg) brightness(92%) contrast(100%)
}
#header .logo .logo-name .logo_subtitle {
  display: none;
}
@media only screen and (max-device-width: 990px) {
  #header .logo .logo-name {
    width: auto;
  }
}
@media only screen and (min-device-width: 992px) and (max-device-width: 1103px) {
  #header .logo .logo-name {
    
  }
  .logo_title {
    display: none;
  }
  #header .logo .logo-name .logo_subtitle {
    display: inline;
  }
}
/*-------# Lang Toggle switch --------------------------------------------------------------*/
.toggle-switch {
  display: inline-flex;
  align-items: center;
  color: var(--textColorGrey);
  font-weight: 600;
}
.toggle-switch .left-text{
  margin-right: 5px;
}
.toggle-switch .right-text {
  margin-left: 5px;
}
.toggle-switch .slider {
  width: 38px;
  height: 24px;
  background-color: #ccc;
  border-radius: 15px;
  border: 1px solid var(--primaryColor);
  position: relative;
  cursor: pointer;
}
.toggle-switch input[type="checkbox"] {
  opacity: 0;
  width: 0;
  height: 0;
}
.toggle-switch input[type="checkbox"]:checked + .slider {
  background-color: var(--primaryColorShade2);
}
.toggle-switch .slider::before,
.toggle-switch input[type="checkbox"]:checked + .slider::before {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  background-color: var(--primaryColorShade4);
  border-radius: 50%;
  top: 2px;
  left: 0px;
  transition: transform 0.2s;
}
.toggle-switch .slider::before{
  left: 2px;
}
.toggle-switch input[type="checkbox"]:checked + .slider::before {
  transform: translateX(16px);
}
/*------ # Navigation Menu --------------------------------------------------------------*/
/** * Desktop Navigation */
.navbar {
  padding: 0;
}
.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}
.navbar li {
  position: relative;
}
#header label,
.navbar a, 
.navbar a:focus {
  color: var(--textLinkColor);
  display: flex;
  align-items: center;
  transition: 0.3s;
  justify-content: space-between; 
  padding: 10px 0 10px 20px; 
  white-space: nowrap;
  font-size: 14px;
}
.navbar a i, .navbar a:focus i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}
.customLink {
  color: var(--textLinkColor);
}
.customLink:hover,
.navbar a:hover, 
.navbar .active, 
.navbar .active:focus, 
.navbar li:hover > a {
  color: var(--primaryColor);
}
.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 14px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
  border-radius: 4px;
}
.navbar .dropdown ul li {
  min-width: 200px;
}
.navbar .dropdown ul a {
  padding: 10px 20px;
  color: #444444;
}
.navbar .dropdown ul a i {
  font-size: 12px;
}
.navbar .dropdown ul a:hover, 
.navbar .dropdown ul .active:hover, 
.navbar .dropdown ul li:hover > a {
  color: var(--primaryColor);
}
.navbar .dropdown:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}
.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}
.navbar .dropdown .dropdown:hover > ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}
/* @media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }
  .navbar .dropdown .dropdown:hover > ul {
    left: -100%;
  }
} */
@media only screen and (min-device-width: 992px) and (max-device-width: 1399px) and (orientation:landscape) {
  #header label,
  .navbar a, 
  .navbar a:focus {
    padding: 10px 0 10px 8px;
    /* font-size: 12px; */
  }
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
  margin-left: 10px;
}
.mobile-nav-toggle.bi-list {
  color: var(--textLinkColor);
}
.mobile-nav-toggle.bi-x {
  color: var(--white);
}

@media (max-width: 991px) {
  .mobile-nav-toggle {
    display: block;
  }

  .navbar ul {
    display: none;
  }
}
.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.9);
  transition: 0.3s;
  z-index: 999;
}
.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}
.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  border-radius: 6px;
  background-color: var(--textColorWhite);
  overflow-y: auto;
  transition: 0.3s;
}
.navbar-mobile a, 
.navbar-mobile a:focus {
  padding: 10px 20px;
  font-size: 15px;
  color: #1a1814;
}
.navbar-mobile a:hover, 
.navbar-mobile .active, 
.navbar-mobile li:hover > a {
  color: var(--primaryColor);
}
.navbar-mobile .getstarted, 
.navbar-mobile .getstarted:focus {
  margin: 15px;
}
.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}
.navbar-mobile .dropdown ul li {
  min-width: 200px;
}
.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}
.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover, 
.navbar-mobile .dropdown ul .active:hover, 
.navbar-mobile .dropdown ul li:hover > a {
  color: var(--primaryColor);
}
.navbar-mobile .dropdown > .dropdown-active {
  display: block;
}

/** * Register Button */
#header .register {
  background: var(--secondaryColor1);
  height: fit-content;
  margin: 0 0 0 6px;
  border: 2px solid var(--secondaryColor1);
  color: var(--textColorGrey);
  border-radius: 50px;
  padding: 8px 12px;
  padding: 4px 12px;
  letter-spacing: 1px;
  transition: 0.3s;
}
#header .register:hover {
  border: 2px solid var(--primaryColor);
  background: var(--primaryColor);
  color: var(--textColorWhite);
}
@media (max-width: 992px) {
  /* #header .register {
    margin: 0 15px 0 0;
    padding: 8px 20px;
  } */
}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.bgImage {
  background: url("../img/cover-bg.jpg") top center;
  background-size: cover;
  position: relative;
  padding: 0;
}

#hero {
  width: 100%;
  /* height: 100vh; */
  height: 79vh;
  /* background: url("../img/hero-bg.jpg") top center;*/
  background-size: cover;
  position: relative;
  padding: 0;
  padding-top: 111px;
}
#hero .bg_cover_image {
  position: initial;
  height: 100%;
  width: 100%;
  padding: 0;
  background: url("../img/hero-bg.jpg") top center;
  background-size: cover;
}
/* #hero .content_data {
  position: initial;
  height: 100%;
  width: 46rem;
  padding: 7em 6em;
  background-color: var(--background);
  opacity: 0.949999988079071;
} */
/* index2 */
/* #hero .content_data2 {
  background-color: var(--background);
  width: 40rem;
  padding: 10rem 5rem;
} */
#hero .content_data p {
  overflow: hidden;
  color: var(--textColorGreyShed1);
  /* white-space: nowrap; */
  text-overflow: ellipsis;
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
}
/* index2 */
/* #hero .content_data2 p {
  color: var(--textColorGreyShed1);
} */
:is(#hero, .bgImage):before {
  content: "";
  background: #00000026;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}
.bgImage:before {
  background: #ffffffe0 !important;
}
#hero .container {
  padding-top: 110px;
}
@media (max-width: 992px) {
  #hero .container {
    padding-top: 98px;
  }
}
#hero h1 {
  margin: 0;
  font-size: 48px;
  font-weight: 700;
  line-height: 56px;
  color: var(--textColorWhite);
  /* text-transform: none; */
}
#hero h1 span {
  color: var(--secondaryColor1);
}
#hero h2 {
  color: #eee;
  margin-bottom: 10px 0 0 0;
  font-size: 22px;
}
@media (min-width: 1024px) {
  #hero {
    background-attachment: fixed;
  }
}
@media (max-width: 992px) {
  #hero .play-btn {
    margin-top: 30px;
  }
}
@media (max-height: 500px) {
  #hero {
    height: auto;
  }
  #hero .container {
    padding-top: 130px;
    padding-bottom: 60px;
  }
}
@media (max-width: 768px) {
  #hero h1 {
    font-size: 28px;
    line-height: 36px;
  }
  #hero h2 {
    font-size: 18px;
    line-height: 24px;
  }
}

@-webkit-keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}
/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
.section-bg {
  background-color: #1a1814;
}
.section-title {
  padding-bottom: 40px;
}
.section-title h2 {
  font-size: 14px;
  font-weight: 500;
  padding: 0;
  line-height: 1px;
  margin: 0 0 5px 0;
  letter-spacing: 2px;
  color: #aaaaaa;
}
.section-title h2::after {
  content: "";
  width: 120px;
  height: 1px;
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  margin: 4px 10px;
}
.section-title p {
  margin: 0;
  margin: 0;
  font-size: 36px;
  font-weight: 700;
  color: var(--secondaryColor1);
}

/*-------- # Site Map --------------------------------------------------------------*/
.breadcrumbs {
  padding: 15px 0 0;
  /* background: var(--primaryColorShade4);
  margin-top: 158px; */
  margin-top: 180px;
  color: var(--textContentColorGreyShade4);

}
/* @media (max-width: 992px) {
  .breadcrumbs {
    margin-top: 98px;
  }
} */
.breadcrumbs h2 {
  font-size: 26px;
  font-weight: 300;
  font-weight: 600;
  color: var(--black);
}
.breadcrumbs h2 p {
  padding: 10px 0 0;
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 0;
}
.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0 0 20px;
  margin: 0;
  font-size: 14px;
}
.breadcrumbs ol li + li {
  padding-left: 10px;
}
.breadcrumbs ol li + li::before {
  display: inline-block;
  padding-right: 10px;
  color: var(--secondaryColor1);
  content: "/";
}
@media (max-width: 1200px) {
  /* 768px */
  .breadcrumbs .d-flex {
    display: block !important;
  }
  .breadcrumbs ol {
    display: block;
  }
  .breadcrumbs ol li {
    display: inline-block;
  }
}

/*------ # forms layout --------------------------------------------------------------*/
.inner-page {
  background-color: var(--background);
  color: var(--textLinkColor);
  padding: 40px;
}
@media screen and (max-width: 768px) {
  .inner-page {
    padding: 0;
  }
}
.inner-page .forms {
  background-color: var(--white);
  padding: 60px 80px;
  border-radius: 16px;
  /* box-shadow: 10px 10px 32px #dfdfdf, 5px 5px 21px #525252aa; */
  box-shadow: 0px 5px 37px -6px rgba(10, 110, 189, 0.12);
}
.input_field_shadow,
.inner-page .forms input {
  box-shadow: 0px 4px 6px #dfdfdf, 4px 6px 10px rgba(167, 167, 167, 0.331);
  box-shadow: 0px 5px 37px -6px rgba(10, 110, 189, 0.12);
}
.merge_input_field, 
.input-group-append.input_field_shadow {
  background-color: #ebebeb;
}
.inner-page .forms a {
  font-weight: 500;
  color: var(--primaryColor);
  text-decoration: none;
}
.inner-page .forms a:hover {
  color: var(--secondaryColor1);
  text-decoration: none;
}
.inner-page .forms > .row {
  margin-bottom: 3rem;
}
.inner-page .forms.login_form h3,
.inner-page .forms h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: normal;
}
.inner-page .forms.login_form h3 {
  font-size: 18px;
}
.input_field_label,
.upload_application p,
.inner-page .forms p {
  color: var(--textContentColorGreyShade4);
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
}
.span_container_msg {
    width: fit-content;
    padding: inherit;
}
.upload_application label,
.inner-page .forms.login_form label,
.inner-page .forms > div > div > label,
.inner-page .forms > .tabcontent > div > div > label {
  font-size: 16px;
  font-weight: 600;
  line-height: normal;
}

.inner-forms>.forms{
    padding-bottom: 1px;
    margin-bottom: 40px;
}
.input-group-text {
  background-color: #00000000;
}
.editable_input_field,
.editable_input_field:hover,
.typePassword,
.typePassword:hover {
  background-color: inherit;
  color: var(--black);
  border-radius: 0 0.25rem 0.25rem 0rem;
  border-top-color: var(--inputFieldBorderColor);
  /* border-left-color: #ced4da00; */
  border-left-color: var(--white);
  border-right-color: var(--inputFieldBorderColor);
  border-bottom-color: var(--inputFieldBorderColor);
}
.editable_input_field i {
  color: var(--primaryColor);
}
/* Buttons------------------------- */
.nav_buttons {
  /* position: fixed; 
  bottom: 20px; */
}
.submit_btn,
.reset_btn {
  width: min-content;
}
.sign_in {
  width: inherit;
}
.sign_in_alert {
  color: var(--white) !important;
}
.reset_btn {
  color: var(--primaryColor);
}
.apply_btn,
.submit_btn {
  padding: 0.375rem 2.75rem;
  background-color: var(--primaryColor);
}
.apply_btn {
  color: var(--white) !important;
  padding: 0.375rem 3rem;
  box-shadow: 0px 4px 4px -2px rgba(0, 0, 0, 0.21);
}
.next_btn,
.link_btn {
  color: var(--primaryColor);
  font-weight: 500;
  width: fit-content;
}
.next_btn {
  padding: 0.375rem 2.75rem;
  border-radius: 6px;
  border: 2px solid var(--primaryColor);
  box-shadow: 0px 4px 4px -2px rgba(0, 0, 0, 0.21);
}
.back_btn {
  border: 0px solid var(--backgroundShed2);
  background-color: var(--backgroundShed2);
  color: var(--textTitleColorGrey);
}
.save_btn {
  color: green;
  border: 2px solid green;
}
.link_btn.quarter_2 {
  text-align: inherit;
}
.apply_btn:hover,
.save_btn:hover,
.submit_btn:hover,
.reset_btn:hover {
  font-weight: 600;
}
.reset_btn:hover {
  color: var(--primaryColorShade4);
}
.submit_btn:hover {
  background-color: var(--primaryColorShade4);
  padding: 0.375rem 2.68rem;
}
.apply_btn:hover {
  background-color: var(--primaryColorShade4);
  padding: 0.375rem 2.94rem;
}
.next_btn:hover {
  color: var(--white);
  background-color: var(--primaryColor);
}
.next_btn:hover svg>path {
    stroke: rgb(255, 255, 255);
}
.back_btn:hover {
  color: var(--textLinkColor);
  background-color: #e6f7ffde;
}
.save_btn:hover {
  color: #FFF;
  background-color: green;
}
.link_btn:hover {
  color: var(--primaryColorShade4);
}
.remove_field {
	margin: auto;
  border-radius: 10px;
  color: red !important;
}
.remove_field i {
  padding: 14px 10px !important; 
  align-self: center !important; 
  font-weight:bold !important; 
  color:red !important;
}
.remove_field:hover {
  font-size: 25px;
}
.remove_file {
  padding: 6px 0px !important;
  border-radius: 16px;
} 
.remove_file i {
  padding: 14px 10px; 
  align-self: center; 
  font-weight:bold; 
  color:red
}
.remove_file:hover {
	background-color: #ffd1d1 !important;
  padding: 6px 0px;
  border-radius: 30px;
}
/*--------------------------------------------------------------
# Cards
--------------------------------------------------------------*/
.ref-cards,
.cards {
  padding: 8px 0;
}
.cards {
  background-color: var(--primaryColor);
  background: url(../img/bg/group1.png) top lightcoral;
  background-size: cover;
  position: relative;
}
.ref-cards {
  background-color: var(--primaryColorShade3);
}
:is(.cards, .ref-cards) .box {
  height: inherit;
  padding: 20px 30px;
  padding: 10px 30px;
  text-align: center;
  /* box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  background: #1a1814; */
}
:is(.cards, .ref-cards) .border_right {
  border-right: 1px solid var(--whiteShade2);
}
:is(.cards, .ref-cards) .box:hover {
  cursor: pointer;
  border-radius: 16px;
  background: #d8d8d829;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}
:is(.cards, .ref-cards) .box h4 {
  color: var(--white);
  font-size: 15px;
  font-weight: 600;
  padding-top: 10px;
  padding-top: 5px;
}

.ref-cards .box h4 {
  color: var(--black);
}
@media (max-width: 767px) {
  :is(.cards, .ref-cards) .box {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  :is(.cards, .ref-cards) .border_right {
    border-right: 0px solid var(--whiteShade2);
    border-bottom: 1px solid var(--whiteShade2);
  }
}

/*--------------------------------------------------------------
# Announcement
--------------------------------------------------------------*/
.announcement {
  padding: 0 20px;
}
.announcement {
  height: 50px;
  flex-shrink: 0;
  background: #052640;
}
.announcement h5 {
  font-size: 18px;
  font-weight: 400;
}
/* animate announcement ribbon */
.marquee {
  height: 50px;
  width: 100%;
  overflow: hidden;
}
.marquee-content {
  display: inline-block;
  width: 100%;
  height: 100%;
  margin: 0;
  line-height: 50px;
  text-align: center;
  white-space: nowrap;
  animation: marquee 25s linear infinite;
}
.marquee-content h5 {
  display: inline-block;
  margin-right: 1em;
}
@keyframes marquee {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
.ticker-container {
  width: 100%;
  overflow: hidden;
  color: #fff;
  font-size: 18px;
  height: 50px;
  line-height: 50px;
  display: flex;
  align-items: center;
  position: relative;
}
/* Scrolling text */
.ticker-text {
  display: inline-block;
  white-space: nowrap;
  animation: ticker-scroll 8s linear infinite;
}
/* Keyframes for scrolling */
@keyframes ticker-scroll {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
/* animation highlighter */
.custom-icon-bg, 
.ticker-text .new-message-icon, 
.marquee-content .new-message-icon {
    color: #fff;
    background-color: #ff0000;
    padding: 4px 5px;
    font-weight: 400;
    font-size: 14px;
    border-radius: 12px;
    animation: flash 1s infinite alternate;
    margin-right: 0px;
}
  /* Flashing Animation for New Word */
@keyframes flash {
    0% {
        background-color: #ff0000;
    }
    100% {
        /* background-color: #0A6EBD; */
        background-color: #FFA500;
    }
}

/*--------------------------------------------------------------
# message
--------------------------------------------------------------*/
.message {
  background-color: var(--background);
}
.message .box {
  background: var(--white);
  border-radius: 20px;
  /* padding: 20px; */
}
.message .profile {
  background: url("../img/bg/group2.png") top center;
  background-size: cover;
  position: relative;
  padding: 0;
  height: 400px;
  border-radius: 20px;
  margin-bottom: 20px;
}
.message .profile img {
  position: absolute;
  display: initial;
  height: auto;
  width: 100%;
  max-width: 340px;
  bottom: 100px;
  left: 50%;
  transform: translateX(-50%);
  padding: 0px 40px;
}
.message .profile .img-card {
  position: absolute;
  display: initial;
  bottom: 60px;
  border-radius: 8px;
  background: #052640;
  padding: 20px;
  width: calc(100% - 120px);
  left: 50%;
  transform: translateX(-50%);
}
.message .profile .img-card p {
  margin-bottom: 5px;
}
.message .profile .img-card p,
.message .profile .img-card h5 {
  color: #B5C2D0;
  font-size: 14px;
  font-weight: 600;
  line-height: 148.523%;
}
.message .profile .img-card h5 {
  font-size: 18px;
}
.message .content {
  color: var(--textContentColorGrey);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  padding: 0 20px;
}
@media (min-width: 768px) {
  .message .content {
    padding: 75px 120px 75px 0;
  }
}

@media (max-width: 768px) {
  .message .profile .img-card {
    bottom: 38px;
    padding: 10px 20px 6px;
    width: calc(100% - 84px);
  }

}
@media (min-width: 992px) {
  .message .row {
    display: flex;
    align-items: center;
  }
  .message .profile {
    margin-bottom: 0;
  }
  .message .profile .img-card {
    bottom: 40px;
    padding: 10px;
  }
}
@media (max-width: 992px) {
  .message .profile .img-card {
    bottom: 20px;
    padding: 10px;
  }
}


/*--------------------------------------------------------------
# Why Us
--------------------------------------------------------------*/
/* .why-us .box {
  padding: 50px 30px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  transition: all ease-in-out 0.3s;
  background: #1a1814;
}
.why-us .box span {
  display: block;
  font-size: 28px;
  font-weight: 700;
  color: var(--secondaryColor1);
}
.why-us .box h4 {
  font-size: 24px;
  font-weight: 600;
  padding: 0;
  margin: 20px 0;
  color: rgba(255, 255, 255, 0.8);
}
.why-us .box p {
  color: #aaaaaa;
  font-size: 15px;
  margin: 0;
  padding: 0;
}
.why-us .box:hover {
  background: var(--secondaryColor1);
  padding: 30px 30px 70px 30px;
  box-shadow: 10px 15px 30px rgba(0, 0, 0, 0.18);
}
.why-us .box:hover span, .why-us .box:hover h4, .why-us .box:hover p {
  color: var(--textColorWhite);
} */

/*--------------------------------------------------------------
# Menu Section
--------------------------------------------------------------*/
/* .menu #menu-flters {
  padding: 0;
  margin: 0 auto 0 auto;
  list-style: none;
  text-align: center;
  border-radius: 50px;
}
.menu #menu-flters li {
  cursor: pointer;
  display: inline-block;
  padding: 8px 12px 10px 12px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  color: var(--textColorWhite);
  margin-bottom: 10px;
  transition: all ease-in-out 0.3s;
  border-radius: 50px;
}
.menu #menu-flters li:hover, .menu #menu-flters li.filter-active {
  color: var(--secondaryColor1);
}
.menu #menu-flters li:last-child {
  margin-right: 0;
}
.menu .menu-item {
  margin-top: 50px;
}
.menu .menu-img {
  width: 70px;
  border-radius: 50%;
  float: left;
  border: 5px solid rgba(255, 255, 255, 0.2);
}
.menu .menu-content {
  margin-left: 85px;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.menu .menu-content::after {
  content: "......................................................................" "...................................................................." "....................................................................";
  position: absolute;
  left: 20px;
  right: 0;
  top: -4px;
  z-index: 1;
  color: #bab3a6;
}
.menu .menu-content a {
  padding-right: 10px;
  background: #1a1814;
  position: relative;
  z-index: 3;
  font-weight: 700;
  color: white;
  transition: 0.3s;
}
.menu .menu-content a:hover {
  color: var(--secondaryColor1);
}
.menu .menu-content span {
  background: #1a1814;
  position: relative;
  z-index: 3;
  padding: 0 10px;
  font-weight: 600;
  color: var(--secondaryColor1);
}
.menu .menu-ingredients {
  margin-left: 85px;
  font-style: italic;
  font-size: 14px;
  font-family: "Poppins", sans-serif;
  color: rgba(255, 255, 255, 0.5);
} */

/*--------------------------------------------------------------
# Specials
--------------------------------------------------------------*/
/* .specials {
  overflow: hidden;
}
.specials .nav-tabs {
  border: 0;
}
.specials .nav-link {
  border: 0;
  padding: 12px 15px;
  transition: 0.3s;
  color: var(--textColorWhite);
  border-radius: 0;
  border-right: 2px solid var(--secondaryColor1);
  font-weight: 600;
  font-size: 15px;
}
.specials .nav-link:hover {
  color: var(--secondaryColor1);
}
.specials .nav-link.active {
  color: #1a1814;
  background: var(--secondaryColor1);
  border-color: var(--secondaryColor1);
}
.specials .nav-link:hover {
  border-color: var(--secondaryColor1);
}
.specials .tab-pane.active {
  -webkit-animation: fadeIn 0.5s ease-out;
  animation: fadeIn 0.5s ease-out;
}
.specials .details h3 {
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 20px;
  color: var(--textColorWhite);
}
.specials .details p {
  color: #aaaaaa;
}
.specials .details p:last-child {
  margin-bottom: 0;
}
@media (max-width: 992px) {
  .specials .nav-link {
    border: 0;
    padding: 15px;
  }
} */

/*--------------------------------------------------------------
# Events
--------------------------------------------------------------*/
.events {
  /* background: url("../img/hero-bg.jpg") top center; */
  background-size: cover;
  position: relative;
}
.events-slider {
  height: inherit;
  margin: 0;
}
.events .event-item {
  position: initial;
  height: 100%;
  width: 100%;
  padding: 0;
  background-color: var(--background);
}
.events .event-item img {
  /* object-fit: cover; */
  object-fit: contain;
  height: 100%; /* -webkit-fill-available; */
  width: 100%;  /* -webkit-fill-available; */
  /* min-height: 1120px; */
  background-color: #c47f2e5e;
}
.events .swiper-slide p {
    position: absolute;
    bottom: 3%;
    left: 50%;
    transform: translate(-50%, -50%); /* Center both horizontally and vertically */
    text-align: center; /* Center the text inside the <p> element */
    padding: 10px 20px;
    border-radius: 10px;
    color: #363f49;
    color: var(--textColorGrey);
    background-color: var(--background);
    opacity: 0.949999988079071;
    /* white-space: nowrap; */
    font-size: 20px;
    font-weight: 600;
    width: 46%;  /* -webkit-fill-available; */
}
@media screen and (max-width: 500px) {
  .events .swiper-slide p {
    position: absolute;
    bottom: 3%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    padding: 10px 6px;
    border-radius: 10px;
    color: #363f49;
    color: var(--textColorGrey);
    background-color: var(--background);
    opacity: 0.949999988079071;
    /* white-space: nowrap; */
    font-size: 8px;
    font-weight: 600;
    width: 100%;  /* -webkit-fill-available; */
  }
}

@media (min-width: 1024px) {
  .events {
    background-attachment: fixed;
  }
}
.events .events-carousel {
  background: rgba(255, 255, 255, 0.08);
  padding: 30px;
}
.events .swiper-pagination {
  margin-top: 30px;
  position: relative;
}
.events .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: #ffffff66;
  opacity: 1;
}
.events .swiper-pagination .swiper-pagination-bullet-active {
  background-color: var(--secondaryColor1);
}

/*--------------------------------------------------------------
# Book A Table
--------------------------------------------------------------*/
/* .book-a-table .php-email-form {
  width: 100%;
}
.book-a-table .php-email-form .form-group {
  padding-bottom: 8px;
}
.book-a-table .php-email-form .validate {
  display: none;
  color: red;
  margin: 0 0 15px 0;
  font-weight: 400;
  font-size: 13px;
}
.book-a-table .php-email-form .error-msg-field {
  display: none;
  color: var(--textColorWhite);
  background: #ed3c0d;
  text-align: left;
  padding: 15px;
  font-weight: 600;
}
.book-a-table .php-email-form .error-msg-field br + br {
  margin-top: 25px;
}
.book-a-table .php-email-form .sent-message {
  display: none;
  color: var(--textColorWhite);
  background: #18d26e;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}
.book-a-table .php-email-form .loading {
  display: none;
  text-align: center;
  padding: 15px;
}
.book-a-table .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid var(--secondaryColor1);
  border-top-color: #1a1814;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}
.book-a-table .php-email-form input, .book-a-table .php-email-form textarea {
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
  background: #0c0b09;
  border-color: #625b4b;
  color: white;
}
.book-a-table .php-email-form input::-moz-placeholder, .book-a-table .php-email-form textarea::-moz-placeholder {
  color: #a49b89;
}
.book-a-table .php-email-form input::placeholder, .book-a-table .php-email-form textarea::placeholder {
  color: #a49b89;
}
.book-a-table .php-email-form input:focus, .book-a-table .php-email-form textarea:focus {
  border-color: var(--secondaryColor1);
}
.book-a-table .php-email-form input {
  height: 44px;
}
.book-a-table .php-email-form textarea {
  padding: 10px 12px;
}
.book-a-table .php-email-form button[type=submit] {
  background: var(--secondaryColor1);
  border: 0;
  padding: 10px 35px;
  color: var(--textColorWhite);
  transition: 0.4s;
  border-radius: 50px;
}
.book-a-table .php-email-form button[type=submit]:hover {
  background: #d3af71;
} */

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
.testimonials .image-slider,
.gallery .gallery-slider,
.testimonials .testimonials-carousel, 
.testimonials .testimonials-slider {
  overflow: hidden;
}
.testimonials .testimonial-item {
  box-sizing: content-box;
  min-height: 320px;
}
.testimonials .testimonial-item .testimonial-img {
  width: 90px;
  border-radius: 50%;
  margin: -40px 0 0 40px;
  position: relative;
  z-index: 2;
  border: 6px solid rgba(255, 255, 255, 0.2);
}
.testimonials .testimonial-item h3 {
  font-size: 18px;
  font-weight: bold;
  margin: 10px 0 5px 45px;
  color: var(--textContentColorGrey);
}
.testimonials .testimonial-item h4 {
  font-size: 14px;
  color: var(--textContentColorGrey);
  margin: 0 0 0 45px;
}
.testimonials .testimonial-item .quote-icon-left, .testimonials .testimonial-item .quote-icon-right {
  color: #d3af71;
  font-size: 26px;
}
.testimonials .testimonial-item .quote-icon-left {
  display: inline-block;
  left: -5px;
  position: relative;
}
.testimonials .testimonial-item .quote-icon-right {
  display: inline-block;
  right: -5px;
  position: relative;
  top: 10px;
}
.testimonials .testimonial-item p {
  font-style: italic;
  margin: 0 15px 0 15px;
  /* padding: 20px 20px 60px 20px; */
  padding: 20px;
  /* background: #26231d; */
  background-color: var(--background);
  box-shadow: 0px 5px 37px -6px rgba(10, 110, 189, 0.12);
  position: relative;
  border-radius: 6px;
  position: relative;
  z-index: 1;
}

.gallery .swiper-pagination,
.testimonials .swiper-pagination {
  margin-top: 30px;
  position: relative;
}
.gallery .swiper-pagination .swiper-pagination-bullet,
.testimonials .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: #ccc;
  opacity: 1;
}
.gallery .swiper-pagination .swiper-pagination-bullet-active,
.testimonials .swiper-pagination .swiper-pagination-bullet-active {
  background-color: var(--secondaryColor2);
}

/*--------------------------------------------------------------
# Gallery
--------------------------------------------------------------*/
.gallery .gallery-item {
  overflow: hidden;
  border-right: 3px solid #454035;
  border-bottom: 3px solid #454035;
}
.gallery .gallery-item img {
  transition: all ease-in-out 0.4s;
}
.gallery .gallery-item:hover img {
  transform: scale(1.1);
}

/*--------------------------------------------------------------
# Chefs
--------------------------------------------------------------*/
.chefs .member {
  text-align: center;
  margin-bottom: 20px;
  background: #343a40;
  position: relative;
  overflow: hidden;
}
.chefs .member .member-info {
  opacity: 0;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  transition: 0.2s;
}
.chefs .member .member-info-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  transition: bottom 0.4s;
}
.chefs .member .member-info-content h4 {
  font-weight: 700;
  margin-bottom: 2px;
  font-size: 18px;
  color: var(--textColorWhite);
}
.chefs .member .member-info-content span {
  font-style: italic;
  display: block;
  font-size: 13px;
  color: var(--textColorWhite);
}
.chefs .member .social {
  position: absolute;
  left: 0;
  bottom: -38px;
  right: 0;
  height: 48px;
  transition: bottom ease-in-out 0.4s;
  text-align: center;
}
.chefs .member .social a {
  transition: color 0.3s;
  color: var(--textColorWhite);
  margin: 0 10px;
  display: inline-block;
}
.chefs .member .social a:hover {
  color: var(--secondaryColor1);
}
.chefs .member .social i {
  font-size: 18px;
  margin: 0 2px;
}
.chefs .member:hover .member-info {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.8) 20%, rgba(0, 212, 255, 0) 100%);
  opacity: 1;
  transition: 0.4s;
}
.chefs .member:hover .member-info-content {
  bottom: 60px;
  transition: bottom 0.4s;
}
.chefs .member:hover .social {
  bottom: 0;
  transition: bottom ease-in-out 0.4s;
}


/*--------------------------------------------------------------
# Tabs F.A.Q Section
--------------------------------------------------------------*/
/* Style the tab */
.tab {
  overflow: hidden;
  margin-bottom: 20px;
}
/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  color: var(--textInactiveColorGrey);
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 10px 40px;
  transition: 0.25s;
  font-size: 17px;
  font-weight: 400;
  border-bottom: 2px solid #2729322e;
}
.tab div.border_right {
  border-right: 2px solid #2729322e;
}
/* Change background color of buttons on hover */
.tab button:hover {
  /* background-color: var(--primaryColorShade3); */
  color: var(--primaryColor);
  font-weight: 600;
  transition: 500ms ease-out;
}
/* Create an active/current tablink class */
.tab button.active {
  color: var(--primaryColor);
  font-weight: 600;
  border-bottom: 3px solid var(--primaryColor);
}
/* Style the tab content */
.tabcontentGallery,
.tabcontent {
  display: none;
}
/*--------------------------------------------------------------
# F.A.Q Section News & Announcements
--------------------------------------------------------------*/
:is(#faq, #criteria) {
  background: var(--white);
}
:is(#faq, #criteria) .faq-list {
  padding: 0;
  list-style: none;
}
:is(#faq, #criteria) .faq-list li {
  border-bottom: 1px solid var(--primaryColor);
  margin-bottom: 20px;
  padding-bottom: 20px;
}
:is(#faq, #criteria) .faq-list li span {
  color: var(--primaryColor);
  font-size: 12px;
}
:is(#faq, #criteria) .faq-list li span, 
.faq-list .question {
  font-weight: 500;
  line-height: normal;
}
:is(#faq, #criteria) .faq-list .question,
.faq-list p {
  color: var(--textTitleColorGrey);
  font-weight: 500;
}
:is(#faq, #criteria) .faq-list .question {
  color: var(--primaryColor);
  cursor: pointer;
  transition: 0.3s;
  font-size: 18px;
}
:is(#faq, #criteria) .faq-list p {
  margin-bottom: 0;
  font-size: 14px;
  padding: 10px 0 0 0;
}
:is(#faq, #criteria) .faq-list i {
  color: var(--primaryColor);
  font-size: x-large;
  position: absolute;
  right: 20px;
}
:is(#faq, #criteria) .faq-list .icon-show {
  display: none;
}
:is(#faq, #criteria) .faq-list .collapsed {
  color: var(--textTitleColorGrey);
}
:is(#faq, #criteria) .faq-list .collapsed:hover {
  color: var(--primaryColor);
}
:is(#faq, #criteria) .faq-list .collapsed .icon-show {
  display: inline-block;
  transition: 0.6s;
}
:is(#faq, #criteria) .faq-list .collapsed .icon-close {
  display: none;
  transition: 0.6s;
}


/*--------------------------------------------------------------
# Gallery
--------------------------------------------------------------*/
#gallery .tabcontentGallery .item_card {
  margin: 20px 0;
}
#gallery .tabcontentGallery .item_card .card-title,
#gallery .tabcontentGallery .item_card .card-text,
#gallery .tabcontentGallery .item_card .btn {
  color: var(--textTitleColorGrey);
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
}
#gallery .tabcontentGallery .item_card img {
  height: 290px;
  object-fit: cover;
  border-radius: 16px 16px 0 0;
}
#gallery .tabcontentGallery .item_card .card_body {
  display: inline-grid;
  height: 200px;
  width: 100%;  /* -webkit-fill-available; */
  padding: 1rem 1rem;
  background-color: var(--white);
  border-radius: 0 0 16px 16px;
  box-shadow: 0px 5px 37px -6px rgba(10, 110, 189, 0.12);
}
#gallery .tabcontentGallery .item_card .card-text {
  color: var(--textContentColorGreyShade3);
  font-size: 16px;
  font-weight: 400;
}
#gallery .tabcontentGallery .item_card a.btn {
  color: var(--primaryColor);
  font-size: 18px;
  padding: 0.375rem 0rem;
  text-align: inherit;
}

/* Background image */
section .bgImg {
  position: absolute;
  top: 460px;
  z-index: -1;
}
section .bgImg.left {
  left: -190px;
}
section .bgImg.right {
  right: -130px;
}
/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
/* .contact .info {
  width: 100%;
}
.contact .info i {
  font-size: 20px;
  float: left;
  width: 44px;
  height: 44px;
  background: var(--secondaryColor1);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
.contact .info h4 {
  padding: 0 0 0 60px;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 5px;
  font-family: "Poppins", sans-serif;
}
.contact .info p {
  padding: 0 0 0 60px;
  margin-bottom: 0;
  font-size: 14px;
  color: #bab3a6;
}
.contact .info .open-hours, .contact .info .email, .contact .info .phone {
  margin-top: 40px;
}
.contact .php-email-form {
  width: 100%;
}
.contact .php-email-form .form-group {
  padding-bottom: 8px;
}
.contact .php-email-form .validate {
  display: none;
  color: red;
  margin: 0 0 15px 0;
  font-weight: 400;
  font-size: 13px;
}
.contact .php-email-form .error-msg-field {
  display: none;
  color: var(--textColorWhite);
  background: #ed3c0d;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}
.contact .php-email-form .sent-message {
  display: none;
  color: var(--textColorWhite);
  background: #18d26e;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}
.contact .php-email-form .loading {
  display: none;
  text-align: center;
  padding: 15px;
}
.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid var(--secondaryColor1);
  border-top-color: #1a1814;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}
.contact .php-email-form input, .contact .php-email-form textarea {
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
  background: #0c0b09;
  border-color: #625b4b;
  color: white;
}
.contact .php-email-form input::-moz-placeholder, .contact .php-email-form textarea::-moz-placeholder {
  color: #a49b89;
}
.contact .php-email-form input::placeholder, .contact .php-email-form textarea::placeholder {
  color: #a49b89;
}
.contact .php-email-form input:focus, .contact .php-email-form textarea:focus {
  border-color: var(--secondaryColor1);
}
.contact .php-email-form input {
  height: 44px;
}
.contact .php-email-form textarea {
  padding: 10px 12px;
}
.contact .php-email-form button[type=submit] {
  background: var(--secondaryColor1);
  border: 0;
  padding: 10px 35px;
  color: var(--textColorWhite);
  transition: 0.4s;
  border-radius: 50px;
}
.contact .php-email-form button[type=submit]:hover {
  background: #d3af71;
}
@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
} */



/* {
  vertical-align: -webkit-baseline-middle;
} */


/*------- # accessibility Drawer container --------------------------------------------------------------*/
.drawer {
  position: fixed;
  top: 0;
  right: -100%; /* Fully hidden initially */
  height: auto; /* Adjust to content height */
  max-height: 100%; /* Prevent overflow */
  width: auto; /* Adjust to content width */
  min-width: 254px; /* Minimum width for content */
  background-color: #fff;
  box-shadow: -2px 0 8px #00000033;
  border-radius: 8px 0 0 8px;
  z-index: 1050;
  transition: right 0.3s ease-in-out;
  overflow-y: auto;
}
/* Drawer visible state */
.drawer.open {
  right: 0; /* Fully visible */
}
/* Drawer header */
.drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px 4px;
  background-color: var(--primaryColor);
  color: #fff;
  font-size: 18px;
  font-weight: bold;
}
/* Drawer body */
.drawer-body {
  padding: 16px;
}
.drawer-body label, 
.drawer-body hr, 
.drawer-body h5 {
  color: #212529;
}
.reader-toggle-label {
  display: none;
  position: fixed;
  bottom: 8%;
  left: 14.5%;
  transform: translate(-50%, -50%);
  font-weight: 600;
  color: #041c30;
  background-color: white;
  padding: 20px 40px;
  border-radius: 20px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  z-index: 9999;
  text-align: center;
  animation: blink 3s infinite;
}
@keyframes blink {
  0% { opacity: 1; }
  50% { opacity: 0; }
  100% { opacity: 1; }
}
/* Menu items */
.drawer-menu {
  list-style: none;
  padding: 0;
}
.drawer-item {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 8px 12px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.drawer-item:hover {
  background-color: #f0f0f0;
  border-radius: 6px;
}
/* Drawer toggle button */
.drawer-toggle-btn {
  /* 
  position: fixed;
  top: 40%;
  right: 0; 
  right: -112px;
  width: 160px;
  */
  position: absolute;
  transition: 0.3s;
  top: 10%;
  right: 0px;
  width: 46px;
  background: var(--primaryColor);
  color: #fff;
  border: none;
  display: flex;
  align-items: center;
  border-radius: 4px 0 0 4px;
  padding: 6px 4px;
  z-index: 1060;
}
.drawer-toggle-btn:hover {
  right: 0;
  width: 160px;
  box-shadow: 0 0 8px var(--textContentColorGreyShade3);
}
.drawer-toggle-btn img {
  vertical-align: middle;
}
/* .drawer-toggle-btn .img {
  width: fit-content;
  display: contents;
} */
.drawer-toggle-btn label {
  font-size: 10px;
  color: black;
  font-weight: 600;
}
.close-drawer-btn {
  cursor: pointer;
  padding: 0px 10px 4px;
  border: 1px solid #e8e8e8;
  border-radius: 6px;
}
/* Invert colors styles */
.invert-colors {
  filter: invert(1);
  will-change: filter; /* Optimization */
}
/* High contrast styles */
.high-contrast {
  background-color: black !important;
  color: white !important;
  filter: contrast(2) !important;
}
/* Low contrast styles */
.low-contrast {
    background-color: lightgray !important;
    color: gray !important;
    filter: contrast(0.5);
}
/* Desaturate (Grayscale) */
.desaturate-colors {
    filter: grayscale(1); /* grayscale(100%) */
}
/* Optionally override specific elements if needed */
.high-contrast a {
  color: yellow !important;
}
.low-contrast a {
  color: darkgray !important;
}
/* Optional: Exclude images from being inverted */
/* .invert-colors img, */
/* .invert-colors, */
.invert-colors-with-img img {
  filter: invert(1) hue-rotate(180deg);
}
/* Optional: Exclude images from being affected */
/* .invert-colors img, */
.desaturate-colors-with-img img {
  filter: invert(1) hue-rotate(180deg) grayscale(0); /* Prevent image desaturation */
}
/* .reader-btn */
li > button:focus, 
li > button:active {
  transform: scale(0.98);
  font-weight: 600;
  font-size: 18px;
}
li > button > i {
  vertical-align: middle;
  max-width: 100%;
}
/* Screen Reader */
.readable {
  outline: none;
  cursor: pointer;
}
.readable:focus {
  border-radius: 6px;
  background: #e0f7fa;
  outline: 2px solid var(--primaryColor);
}
/*------- # accessibility Drawer container --------------------------------------------------------------*/

/*------- # Screen Reader --------------------------------------------------------------*/
/* Volume Icon Fixed Position */
.volume-icon-wrapper {
  position: fixed;
  bottom: 20px;
  left: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #333;
  color: #fff;
  padding: 10px 15px;
  border-radius: 30px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 1000;
}
/* Show Indicator */
.volume-icon-wrapper.active {
  opacity: 1;
  visibility: visible;
}
/* Volume Icon */
.volume-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #f44336;
  border-radius: 50%;
  color: white;
}
.volume-icon i {
  font-size: 20px;
}
/* Sound Waves */
.wave {
  position: absolute;
  width: 50px;
  height: 50px;
  border: 2px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  animation: wave-animation 1.5s infinite ease-out;
}
.wave:nth-child(2) {
  animation-delay: 0.3s;
}
.wave:nth-child(3) {
  animation-delay: 0.6s;
}
/* Wave Animation */
@keyframes wave-animation {
  0% {
      transform: scale(1);
      opacity: 1;
  }
  100% {
      transform: scale(2.5);
      opacity: 0;
  }
}
/* Screen Tint Effect */
.screen-tint {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #00000040;
  pointer-events: none;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.screen-tint.active {
  opacity: 1;
  visibility: visible;
}
/*------- # Screen Reader --------------------------------------------------------------*/

/*------- # Footer --------------------------------------------------------------*/
#footer {
  background: var(--primaryColorShade4);
  padding: 60px 0 30px 0;
  font-size: 14px;
  /* color: var(--textColorWhite); */
}
#footer .footer-info h3,
#footer .footer-links h4 {
  color: #F4F6F7;
  font-size: 24.01px;
  font-weight: 400;
  line-height: 28.888px;

}
#footer .footer-links a {
  color: #E7ECEF;
  font-size: inherit;
  font-weight: 400;
  line-height: 150%;
}
#footer .footer-top {
  border-bottom: 1px solid #567491;
  padding: 60px 0 30p x 0;
}
#footer .footer-top .footer-info {
  margin-bottom: 30px;
}
#footer .footer-top .footer-info h3 {
  color: var(--textColorWhite);
  font-size: 26px;
  margin: 0 0 20px 0;
  padding: 2px 0 2px 0;
  line-height: 1;
  font-weight: 500;
}
#footer .footer-top .footer-info a {
  color: var(--textColorWhite);
}
#footer .footer-top .footer-info p {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 0;
  color: var(--textColorWhite);
}
#footer .footer-top .social-links a {
  font-size: 18px;
  display: inline-block;
  background: var(--secondaryColor);
  color: var(--textColorGrey);
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}
#footer .footer-top .social-links a:hover {
  background: var(--primaryColor);
  color: var(--textColorWhite);
  text-decoration: none;
}
#footer .footer-top h4 {
  font-size: 16px;
  font-weight: 600;
  color: var(--textColorWhite);
  position: relative;
  padding-bottom: 12px;
}
#footer .footer-top .footer-links {
  margin-bottom: 30px;
}
#footer .footer-top .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#footer .footer-top .footer-links ul i {
  padding-right: 2px;
  color: var(--secondaryColor1);
  font-size: 18px;
  line-height: 1;
}
#footer .footer-top .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}
#footer .footer-top .footer-links ul li:first-child {
  padding-top: 0;
}
#footer .footer-top .footer-links ul a {
  color: var(--textColorWhite);
  transition: 0.3s;
  display: inline-block;
  line-height: 1;
}
#footer .footer-top .footer-links ul a:hover {
  color: var(--secondaryColor1);
}
#footer .copyright {
  text-align: center;
  padding-top: 30px;
  text-align: center;
  color: #77808B;
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
#footer .credits {
  padding-top: 10px;
}
/* visitor Counter */
#footer .counter {
    text-align: center;
}
#footer .counter .counter-value {
    font-size: 2rem;
    font-weight: bold;
    width: fit-content;
    margin: 2px;
    padding: 2px 8px;
    background: linear-gradient(180deg, #3b3a49 0%, rgba(10, 10, 10, 1) 50%, rgba(19, 19, 19, 1) 50%, #3b3a49 100%);
}

/*-------------------------------------------------------------- # font style for Bullets listing --------------------------------------------------------------*/
/* Define global classes for ordered list styling */
.parentheses {
    font-variant-numeric: traditional;
}
.parentheses.parentheses-decimal > li::marker {
    content: '(' counter(list-item, decimal) ') ';
}
.parentheses.parentheses-lower-alpha > li::marker {
    content: '(' counter(list-item, lower-alpha) ') ';
}
.parentheses.parentheses-lower-alpha-single > li::marker {
    content: '' counter(list-item, lower-alpha) ') ';
}
.parentheses.parentheses-upper-alpha > li::marker {
    content: '(' counter(list-item, upper-alpha) ') ';
}
.parentheses.parentheses-lower-roman > li::marker {
    content: '(' counter(list-item, lower-roman) ') ';
}
.parentheses.parentheses-upper-roman > li::marker {
    content: '(' counter(list-item, upper-roman) ') ';
}
/* New CSS for standard bullet points */
.parentheses.bulleted-list {
  list-style-type: disc; /* This creates a solid round bullet (default for <ul>) */
  /* Other common bullet types you could use:
  list-style-type: circle;  // For an empty circle bullet
  list-style-type: square;  // For a solid square bullet
  list-style-type: none;    // To remove all markers (bullets or numbers)
  */
}
/*-------------------------------------------------------------- # font style end --------------------------------------------------------------*/

/*------- # Tabs --------------------------------------------------------------*/
.custom-horizontal-tabs>.tabs {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
/* .custom-horizontal-tabs>.tabs .tab:after {
  height: 3px;
  background-color: #ccc;
  flex-grow: 1;
  margin: 0 5px;
} */
/* .custom-horizontal-tabs>.tabs .tab:after  { 
  flex: 1; 
  height: 1px; 
  width: 100%; 
  margin-right: 0.5rem; 
  content: ""; 
}  */
.custom-horizontal-tabs>.tabs .tab {
  display: flex;
  align-items: center;
  cursor: pointer;
  position: relative;
}
.custom-horizontal-tabs>.tabs .tab-number {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--primaryColorShade5);
  display: flex;
  margin-bottom: 5px;
  margin-right: 6px;
  margin-left: 6px;
  justify-content: center;
  align-items: center;
}
.custom-horizontal-tabs>.tabs .tab-text {
  font-size: 14px;
}
.custom-horizontal-tabs>.tabs .tab.visited .tab-number {
  background-color: var(--primaryColorShade3);
}
.custom-horizontal-tabs>.tabs .tab.active .tab-number {
  background-color: var(--primaryColorShade4);
  color: #fff;
}
.custom-horizontal-tabs .forms .tabcontent table tbody th {
  vertical-align: middle;
}


/*------- #Upload Images Container --------------------------------------------------------------*/
.image_container {
  position: relative;
  border-radius: 5px;
  border: 1px solid #c4c4c4;
  border-style: dashed;
  padding: 0px;
}
.image_container.width {
  width:fit-content;
}
a.fill_image_container {
  display: block;
  height: 177px;
  width: inherit;
  text-decoration: none;
  padding: 0px;
  background-color: #F3F8FF;
  border-radius: 5px;
}
/* mouse over link */
a.fill_image_container:hover {
  background-color: #dceaff;   
  border-radius: 5px;
}
.center_container {
  display: block;
  text-align: center;
  font-weight: 600;
  padding-top: 45px;
}
.image_container a img {
  display: block;
  height: 177px;
  width: 138px;
  object-fit: cover;
  padding: 4px;
  margin: 0px;
}
.image_container a.remove_file {
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: #f8fafed4;
}

/*------- #Add --------------------------------------------------------------*/
.msg-note {
  background-color: #EFFFF0 !important;
  padding: 23px;
  border-radius: inherit;
  color: var(--textContentColorGrey);
}
.msg-note strong {
  color: var(--black);
}


.inner-page .content ol {
  display: contents;
}
.inner-page .content ol li {
  padding: 0 18px;
}

.inner-page .content p {
  font-size: larger;
  font-weight: 600;
  color: var(--textContentColorGrey) !important;
}
.inner-page .content .content-text {
  font-weight: 400;
  color: var(--textContentColorGrey) !important;
}
.inner-page .content .content-text strong {
  color: var(--black) !important;
}

/*------- #Add --------------------------------------------------------------*/

.inner-card {
  background: var(--white);
  box-shadow: 0px 4px 4px #00000017;
  border-radius: 20px;
  padding: 0; 
  /* width: 442px; */
}
.inner-card.links {
  padding: 30px;
}
.inner-card.links h5 {
  border-bottom: 1px solid #000;
  padding: 20px 0;
  margin-bottom: 10px; 
}
.inner-card.links a {
  display: flex;
  justify-content: space-between;  
  border-radius: 10px;
  padding: 12px 20px;
  margin: 8px 0;
  color: var(--black);
}
.inner-card.links hr {
  margin: 0 !important;
}

.inner-card.links,
.inner-card.single {
  background: #008eff80;
}
.inner-card.page_url,
.inner-card.single {
  /* width: 442px; */
  min-height: 160px;
  line-height: 160px;
  text-align: center;
}
.inner-card.page_url,
.inner-card.single.links {
    background-color: #ffd16cf2;
    background-image: linear-gradient(#fff6e0, #ffd16c80);
}
.inner-card.page_url a,
.inner-card.single a {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  color: var(--black);
  font-weight: 600;
  width: 100%;
  padding: 50px 40px;
}
.inner-card.links a:hover,
.inner-card.single:hover {
  /* background-color: #ffe5bb24; */
  background-color: #c0e3ff;
}
.inner-card.page_url:hover {
  background-color: #ff9e00;
}
/*------- #publications table --------------------------------------------------------------*/
.table_list_css, 
.table_list_css table tr {
  background-color: #ffffff;
  padding: 22px;
  border-radius: 6px;
}
.table_list_css table tr td {
  padding: 16px 2px;
}
.table_list_css table tr td a {
  color: var(--textLinkColor);
}
.table_list_css table tr:hover {
  background-color: #c0e3ffcb;
}
.table_list_css table tr td a:hover {
  color: var(--primaryColor);
}
.table_list_css table tr td:last-child {
  text-align: right;
}
.table_list_css table tr:last-child {
  border-bottom-width: 0;
}
/*------- #Add --------------------------------------------------------------*/
.img_full_width {
    width: 100% !important;
}
.cover_image {
    max-height: 600px;
    object-fit: cover;
}
.img_fit {
    height: 210px;
    border-radius: 19px;
    background: #E3E5EB;
    object-fit: cover;
    margin-top: 30px;
}
/*------- #loader message --------------------------------------------------------------*/
.loadingMessageContainer {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 99998;
}
.loadingMessage {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 99999;
  font-size: larger;
  font-weight: 600;
  color: #f36e21;
}

#container {
    position: absolute;
    margin: auto;
    width: 100vw;
    height: 80pt;
    top: 0;
    bottom: 0;

    filter: url(#threshold) blur(0.6px);
}

#text1,
#text2 {
    position: absolute;
    width: 100%;
    display: inline-block;

    font-family: "Raleway", sans-serif;
    font-size: 80pt;

    text-align: center;

    user-select: none;
}
.text-center-vertical {
    align-content: center;
}
.content-wrap {
  overflow-wrap: anywhere;
}
.res-table {
  overflow-x: auto;
}

table th, 
table td:first-child {
  min-width: 130px;
}
table th:first-child, 
table td:first-child,
table th:last-child, 
table td:last-child {
  min-width: 40px;
}
table.no_edit th:first-child, 
table.no_edit td:first-child,
table.no_edit th:last-child, 
table.no_edit td:last-child {
  min-width: 100px;
}
/*------- #tooltip icon --------------------------------------------------------------*/
.tooltip-info-icon {
    cursor: pointer;
    margin-left: 5px;
    border-radius: 50px;
    background: #e7cea6;
    color: black;
    padding: 2px 10px;
    font-weight: 600;
}
.tooltip-info-icon:hover {
    margin-left: 3px;
    background: #e7cb9f;
    color: black;
    padding: 4px 12px;
    font-weight: 700;
}

/*------- #custom-tooltip --------------------------------------------------------------*/
.tooltip-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin: 20px;
}
.tooltip-text {
    visibility: hidden;
    width: 305px;
    background-color: #e7cea6;
    color: #000;
    text-align: left;
    border-radius: 8px;
    padding: 12px;
    position: absolute;
    z-index: 1;
    bottom: 104%;
    left: 68%;
    margin-left: -100px;
    opacity: 0;
    transition: opacity 0.3s;
}
.tooltip-text.right-corner {
    width: 252px;
    right: 0%;
    margin-left: -228px;
}
.tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}
/*------- #in assets and in admin_assets --------------------------------------------------------------*/
.isNotClickable {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
}
/*------- #custom-notification --------------------------------------------------------------*/
/* <div class="custom-notification-container">Use Case<span class="custom-notification-dot large"></span></div> */
.custom-notification-container {
  position: relative;
  display: inline-block;
  padding-right: 12px; /* Space for dot */
}
.custom-notification-container.large-font {
  font-size: 16px;
  font-weight: bold;
}
.custom-notification-dot {
  position: absolute;
  top: -5px;
  right: 0;
  width: 8px;
  height: 8px;
  background-color: #ff0000; /* Red dot - change color as needed */
  border-radius: 50%;
  box-shadow: 0 0 2px rgba(0,0,0,0.3);
}
.custom-notification-dot {
  animation: pulse 1.5s infinite;
}
@keyframes pulse {
  0% { transform: scale(0.95); }
  50% { transform: scale(1.1); }
  100% { transform: scale(0.95); }
}
/* Success notification */
.custom-notification-dot.success {
  background-color: #4CAF50;
}
/* Warning notification */
.custom-notification-dot.warning {
  background-color: #FFC107;
}
.custom-notification-dot.large {
  width: 10px;
  height: 10px;
  top: -6px;
}
.custom-notification-dot.small {
  width: 6px;
  height: 6px;
  top: -6px;
  right: 4px;
}
.custom-notification-dot.small.on-text {
  top: 4px;
}
/*------- #scheme status --------------------------------------------------------------*/
#status-message {
  position: fixed;
  bottom: 0px;
  z-index: 1000;
  width: 100%;
  background-color: #ff4242de;
  padding: 6px;
  color: white;
  text-align: center;
}
#status-message #countdown-timer { 
  font-size: 1.2em;
  font-weight: bold; 
  margin: 0;
}
#submitBtn:disabled { 
  background-color: #ccc; 
  color: #666;
  font-weight: 600;
  width: revert;
  cursor: not-allowed; 
}
/*------- #Add --------------------------------------------------------------*/
/*------- #Add --------------------------------------------------------------*/
/*------- #Add --------------------------------------------------------------*/
/*------- #Add --------------------------------------------------------------*/
/*------- #Add --------------------------------------------------------------*/
/*------- #Add --------------------------------------------------------------*/


























/*------- # Upload Drag & Drop --------------------------------------------------------------*/
.upload_dropZone {
  color: #0f3c4b;
  background-color: var(--colorPrimaryPale, #c8dadf);
  outline: 2px dashed var(--colorPrimaryHalf, #c1ddef);
  outline-offset: -12px;
  transition:
    outline-offset 0.2s ease-out,
    outline-color 0.3s ease-in-out,
    background-color 0.2s ease-out;
}
.upload_dropZone.highlight {
  outline-offset: -4px;
  outline-color: var(--colorPrimaryNormal, #0576bd);
  background-color: var(--colorPrimaryEighth, #c8dadf);
}
.upload_svg {
  fill: var(--colorPrimaryNormal, #0576bd);
}
.btn-upload {
  color: #fff;
  background-color: var(--colorPrimaryNormal);
}
.btn-upload:hover,
.btn-upload:focus {
  color: #fff;
  background-color: var(--colorPrimaryGlare);
}
.upload_img {
  width: calc(33.333% - (2rem / 3));
  object-fit: contain;
}