/**
 * @file
 * Subtheme specific CSS.
 */


/* header */
:root {
  --swiper-pagination-bullet-color: #818E98;
}

.search-modal-overlay {
  z-index: 99999999;
}

.id-card-wrapper .voter-info-wrapper .voter-info-item {}

.hero-slider:has(video) {
  height: 777px;
  background-color: #34495e;
}

.field--name-field-media-video-file {
  position: relative;

}

.field--name-field-media-video-file::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, rgb(0 0 0 / 48%) 0%, rgb(0 0 0 / 53%) 100%);
}

.hero-slider:has(video) video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.block-views-blockview-home-calendar-block-1>h2 {
  text-align: center;
}

.highcharts-root {
  font-family: Cairo !important;
  width: 100%;
}

.content-item.content-table {
  background: #36454f8a;
}

.main-content {
  min-height: 50rem !important;
}

/* .highcharts-color-0 {
    fill: var(--color-primary);
    stroke: transparent;
}
.highcharts-color-1
{
  fill: var(--color-secondary);
  stroke: transparent;
} */
.highcharts-background {
  /* background: transparent; */
  /* fill: #fff; */
  fill: rgba(255, 255, 255, 0.85);
  box-shadow: 0 3.793px 7.586px 0 rgba(0, 0, 0, 0.10);
}

rect.highcharts-legend-box {
  fill: transparent;
}

.highcharts-plot-background {
  fill: rgba(245, 249, 250, 0.85);
}

.highcharts-plot-border {
  fill: transparent;
}

.highcharts-data-label text {
  fill: var(--color-primary);
}

.highcharts-label-box.highcharts-data-label-box {
  fill: transparent;
  stroke: transparent;
}

#header {
  background-color: transparent;
  width: 100%;
  padding: 18px 0;

}

.path-frontpage #header:not(.user-logged-in #header),
.electionEnablePage #header:not(.user-logged-in #header) {
  position: absolute;
  top: 0;
  z-index: 999;
  transition: 0.3s;
}

.not-front.electionEnablePage main#content {
  padding: 0;
}

#header:hover {
  background-color: #fff;
}

#header .d-flex.justify-content-between.align-items-start.w-100 {
  gap: 48px;
}

.navbar {
  width: 100%;
}

.header-left.d-flex.flex-column {
  gap: 38px;
}

.header-left.d-flex.flex-column .row>* {
  width: max-content;
}

/* Logo and site title */
.header-site-title {
  width: 155.347px;
}



/* Top header menu */
a.navbar-brand {
  display: inline-block;
  margin: 0;
  padding: 0;
}

div#block-bootstrap-barrio-subtheme-logohover {
  position: absolute;
  top: 0;
  opacity: 0;
}

.region-top-header {
  justify-content: flex-end;
  align-items: center;
}

.menu--top-header-menu ul.nav {
  gap: 8.6px;
}

.menu--top-header-menu .nav-item {
  padding-left: 10.29px;
  border-left: 1px solid #fff;
  line-height: 1;
}

.menu--top-header-menu .nav-item .nav-link {
  color: #FFF;
  text-align: center;
  font-family: Cairo;
  font-size: 12.861px;
  line-height: 1px;
  /* 151.111% */

}

/* .menu--top-header-menu .nav-item .nav-link:hover {
  color: rgba(255, 255, 255, 0.8);
} */

.menu--top-header-menu .nav-item:last-child {
  padding: 0;
  border: 0;
}

.menu--top-header-menu .nav-item:last-child button {
  background: rgba(54, 69, 79, 0.20);
  border: 0px
}


/* search */
.block-views-exposed-filter-blockheader-search-page-1 form {
  position: relative;
}

.block-views-exposed-filter-blockheader-search-page-1 form .mb-3 {
  margin-bottom: 0 !important;
}

.header-search {
  border: 0;
  background-color: rgba(54, 69, 79, 0.20);
  background-image: url(../images/search.svg) !important;
  background-repeat: no-repeat !important;
  background-position: 97% center !important;
  color: #fff !important;
  border-radius: 0;
  width: 191px;
  padding-right: 31px;
  height: 36px;
  margin-right: 10px;
}

#header:hover .header-search,
.not-front #header .header-search:not(.electionEnablePage #header .header-search) {
  background-color: var(--color-primary);
}

.header-search::placeholder {
  color: #fff;
  opacity: 1;
  font-size: 12px;
}

.block-views-exposed-filter-blockheader-search-page-1 form button {
  display: none;
}


/*Header Language Switcher */
div#block-bootstrap-barrio-subtheme-advancedlanguageselectorblock {
  margin-right: 8px;
}

button#lang-custom {
  background: rgba(54, 69, 79, 0.20);
  border: 0;
  border-radius: 0;
  width: 81px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  gap: 2px;
}

button#lang-custom span {
  color: #FFF;
  text-align: center;
  font-family: Cairo;
  font-size: 13px;
  font-style: normal;
  font-weight: normal;
  line-height: 24.41px;
  /* 187.771% */
}

.not-front #lang-custom:not(.electionEnablePage #lang-custom),
#header:hover #lang-custom {
  background: var(--color-primary);
}

/* Social media icons */
nav#block-bootstrap-barrio-subtheme-headersocialmedia {
  margin-right: 18px;
  padding-right: 20px;
}

.menu--header-social-media .nav {
  display: flex;
  gap: 11.34px;
}

.menu--header-social-media .nav-link {
  color: #fff;
  font-size: 19px;
  padding: 0;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2.19516px solid #fff;
  border-radius: 100%;
  transition: 0.3s;
}

.menu--header-social-media .nav-link:hover {
  color: var(--color-primary);
  border-color: var(--color-primary);
}


#header:hover .navbar-brand,
.not-front #header.navbar-brand {
  opacity: 0;
}

#header:hover div#block-bootstrap-barrio-subtheme-logohover,
.not-front #header div#block-bootstrap-barrio-subtheme-logohover:not(.electionEnablePage #header div#block-bootstrap-barrio-subtheme-logohover) {
  opacity: 1;
}

#header:hover .menu--top-header-menu .nav-item .nav-link,
.not-front #header .menu--top-header-menu .nav-item .nav-link:not(.electionEnablePage #header .menu--top-header-menu .nav-item .nav-link) {
  color: var(--color-primary);
}

#header:hover .menu--top-header-menu .nav-item,
.not-front #header .menu--top-header-menu .nav-item:not(.electionEnablePage #header .menu--top-header-menu .nav-item) {
  border-color: var(--color-primary)
}

#header:hover .menu--header-social-media .nav-link,
.not-front #header .menu--header-social-media .nav-link:not(.electionEnablePage #header .menu--header-social-media .nav-link) {
  color: var(--color-primary);
  font-size: 19px;
  padding: 0;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2.19516px solid var(--color-primary);
}

/* Main navigation */
.menu--main .nav-item .nav-link {
  color: #fff;
  padding: 10px 15px;
  font-weight: 500;
}

.menu--main .nav-item .nav-link:hover,
.menu--main .nav-item .nav-link.is-active {
  color: rgba(255, 255, 255, 0.8);
}



/* main navigation dropdown */
/***** new menu styles *****/
ul#block-bootstrap-barrio-subtheme-main-menu {
  display: flex;
  gap: 20px;
}

ul#block-bootstrap-barrio-subtheme-main-menu li {
  display: flex;
  position: relative;
  padding: 0;
}

ul#block-bootstrap-barrio-subtheme-main-menu li ul:not(ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block ul),
ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block {
  position: absolute;
  right: -50%;
  top: 64px;
}

ul#block-bootstrap-barrio-subtheme-main-menu li.menu-item--expanded:not(ul#block-bootstrap-barrio-subtheme-main-menu ul li, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block li)::before {
  display: none;
  width: 16px;
  height: 11.979px;
  background: transparent url(../images/arrow-menu.svg) no-repeat center center;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 53px;
  content: '';
  transition: display 0.3s ease-in-out;
}

ul#block-bootstrap-barrio-subtheme-main-menu li.show-expanded:not(ul#block-bootstrap-barrio-subtheme-main-menu ul li, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block li):before {
  display: inline-block;
}

ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block {
  right: 0;
  margin-right: -700px;
}

ul#block-bootstrap-barrio-subtheme-main-menu li:nth-child(2) .view-expanded-block {
  right: 0;
  margin-right: -200px;
}

ul#block-bootstrap-barrio-subtheme-main-menu .view-expanded-block .view-content {
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 30px;
}

ul#block-bootstrap-barrio-subtheme-main-menu li ul:not(ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block ul),
ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block {
  padding: 30px;
  background: #fff;
  display: none;
  flex-direction: column;
  width: max-content;
  gap: 3px;
  transition: display 0.3s ease-in-out;
}

ul#block-bootstrap-barrio-subtheme-main-menu li.show-expanded ul:not(ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block ul),
ul#block-bootstrap-barrio-subtheme-main-menu li.show-expanded .view-expanded-block {
  display: flex;
}

ul#block-bootstrap-barrio-subtheme-main-menu .item-list h3 {
  color: var(--color-primary);
  text-align: right;
  font-family: Cairo;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

ul#block-bootstrap-barrio-subtheme-main-menu .item-list h3::after {
  content: '';
  background: transparent url(../images/down-arrow.svg) no-repeat center center;
  border: 0;
  border-radius: 0;
  width: 9.727px;
  height: 5.543px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  filter: brightness(0);

}

ul#block-bootstrap-barrio-subtheme-main-menu .item-list {
  display: flex;
  /* float: right; */
  flex-direction: column;
  padding-left: 30px;
  border-left: 1px solid #E0E0E0;
  width: 240px;
}

ul#block-bootstrap-barrio-subtheme-main-menu .views-field.views-field-title,
ul#block-bootstrap-barrio-subtheme-main-menu .views-field.views-field-title span {
  width: 100%;
  display: flex;
}

ul#block-bootstrap-barrio-subtheme-main-menu .item-list:last-child {
  border: 0;
  padding: 0;
}

ul#block-bootstrap-barrio-subtheme-main-menu li ul a,
ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a {
  color: #201D1E;
  text-align: right;
  font-family: Cairo;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 35px;
  /* 269.231% */
  padding-bottom: 6px;
  border-bottom: 1px solid #D1D1D1;
  width: 100%;
  padding-left: 16.389px !important;
  background: url(../images/child-menu.svg) no-repeat left center;
}

ul#block-bootstrap-barrio-subtheme-main-menu li ul li:last-child a,
ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block li:last-child a {
  border: 0px;
}

ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a),
ul#block-bootstrap-barrio-subtheme-main-menu li button {
  border: 0;
  padding: 0;
  font-weight: normal;
  background: transparent;
  font-size: 13px;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 2px;
  position: relative;
}

ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a)::before,
ul#block-bootstrap-barrio-subtheme-main-menu li button::before {
  content: '';
  width: 0;
  height: 2px;
  display: inline-block;
  background: var(--color-primary);
  position: absolute;
  bottom: -4px;
  right: 0;
  border-radius: 100px;
  transition: width 0.3s ease-in-out;
}

ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a):hover,
.not-front #header ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a):not(.electionEnablePage #header ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a)),
.not-front #header ul#block-bootstrap-barrio-subtheme-main-menu li button:not(.electionEnablePage #header ul#block-bootstrap-barrio-subtheme-main-menu li button) {
  color: var(--color-primary);
}

ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a):hover::before,
ul#block-bootstrap-barrio-subtheme-main-menu li:hover button::before {
  width: 100%;
}

ul#block-bootstrap-barrio-subtheme-main-menu li.menu-item--expanded a:not(ul#block-bootstrap-barrio-subtheme-main-menu li.menu-item--expanded ul a, ul#block-bootstrap-barrio-subtheme-main-menu li.menu-item--expanded .view-expanded-block a)::after,
ul#block-bootstrap-barrio-subtheme-main-menu li button::after {
  content: '';
  background: transparent url(../images/down-arrow.svg) no-repeat center center;
  border: 0;
  border-radius: 0;
  width: 9.727px;
  height: 5.543px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
}

#header:hover ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a),
#header:hover ul#block-bootstrap-barrio-subtheme-main-menu li button {
  color: var(--color-primary);
}

#header:hover ul#block-bootstrap-barrio-subtheme-main-menu li a:not(ul#block-bootstrap-barrio-subtheme-main-menu li ul a, ul#block-bootstrap-barrio-subtheme-main-menu li .view-expanded-block a)::after,
#header:hover ul#block-bootstrap-barrio-subtheme-main-menu li button::after,
.not-front #header ul#block-bootstrap-barrio-subtheme-main-menu li button:not(.electionEnablePage #header ul#block-bootstrap-barrio-subtheme-main-menu li button)::after {
  filter: brightness(0);
}

.electionEnablePage .inner-image {
  display: none;
}

.views-exposed-form form {
  margin-right: 10px;
}


/* الحاوية الجانبية */
.menu-section.menu--sections-menu {
  position: fixed;
  left: 17px;
  top: 55%;
  transform: translateY(-50%);
  z-index: 999999;
  border-radius: 84.466px;
  background: rgba(57, 57, 57, 0.43);
  backdrop-filter: blur(1.6893203258514404px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 47px;
  padding: 40px 0 20px;
  width: 50px;

  h2#-menu {
    transform: rotate(-90deg);
    color: #FFF;
    text-align: right;
    font-family: Cairo;
    font-size: 12.981px !important;
    font-style: normal;
    font-weight: 900;
    line-height: 13.359px;
    width: max-content;
  }
}

.user-logged-in .menu-section.menu--sections-menu {
  left: 86px;
  top: 61%;
  z-index: 9;
}


/* القائمة عمودية */
.menu-section.menu--sections-menu .nav {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0;
  /* padding: 0 12px; */
}

/* شكل الزر */
.menu-section.menu--sections-menu .nav-link {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #fff;
  overflow: visible;
  font-size: 0 !important;
  /* border: 3px solid #fff; */
}

.menu-section.menu--sections-menu .nav-link:hover {
  background-color: #A93226;

}

/* before = الأيقونة */
.menu-section.menu--sections-menu .nav-link::before {
  content: "";
  position: absolute;
  inset: 0;
  /* background-color: #fff; */
  border-radius: 50%;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center;
  /* background-size: 40px; */
}

/* after = البالون النصّي */
.menu-section.menu--sections-menu .nav-link::after {
  content: var(--label);
  position: absolute;
  left: 184%;
  top: 50%;
  transform: translateY(-50%);
  background: #6b7276;
  color: #fff;
  padding: 6px 16px;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  font-size: 14px;
  transition: opacity 0.25s ease, transform 0.25s ease;
  box-shadow: -6px 0 0 0 #6b7276;
  width: fit-content;
}

/* إظهار البالون */
.menu-section.menu--sections-menu .nav-item:hover .nav-link::after {
  opacity: 1;
  /* transform: translateY(-50%) translateX(0); */
}

/* --------------------------- */
/*      NTH-CHILD ICONS        */
/* --------------------------- */

.menu-section.menu--sections-menu .nav li:nth-child(1) .nav-link::before {
  background-image: url("../images/a1.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(2) .nav-link::before {
  background-image: url("../images/a2.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(3) .nav-link::before {
  background-image: url("../images/a3.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(4) .nav-link::before {
  background-image: url("../images/a4.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(6) .nav-link::before {
  background-image: url("../images/a5.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(5) .nav-link::before {
  background-image: url("../images/a6.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(7) .nav-link::before {
  background-image: url("../images/a7.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(8) .nav-link::before {
  background-image: url("../images/a8.svg");
}

.menu-section.menu--sections-menu .nav li:nth-child(9) .nav-link::before {
  background-image: url("../images/a9.svg");
}

/* --------------------------- */
/*       NTH-CHILD LABELS       */
/* --------------------------- */

/*Slider */

.view-slider {
  width: 100%;
}

.view-slider .swiper-slide .field--name-field-media-image .field__item {
  width: 100%;
}

.view-slider .swiper-slide .field--name-field-media-image img {
  max-width: 100%;
  height: auto;
  min-height: 817px;
  margin: 0;
  width: 100%;
  object-fit: cover;
}

.view-slider .swiper-slide .field--name-field-media-image .field__item::after {
  display: inline-block;
  content: 'Shadow';
  width: 100%;
  height: 100%;
  /* background: #000; */
  position: absolute;
  z-index: 999;
  top: 0;
  right: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.35) 100%);
  font-size: 0;
}

.view-slider .swiper-slide {
  height: 817px;
  overflow: hidden;
}


.swiper-horizontal>.swiper-pagination-bullets:not(.custom-swiper-partner-nav .swiper-pagination-bullets),
.swiper-pagination-bullets.swiper-pagination-horizontal:not(.custom-swiper-partner-nav .swiper-pagination-bullets.swiper-pagination-horizontal),
.swiper-pagination-custom:not(.custom-swiper-partner-nav .swiper-pagination-custom),
.swiper-pagination-fraction:not(.custom-swiper-partner-nav .swiper-pagination-fraction) {
  bottom: auto;
  bottom: 289px;
  left: 0;
  width: 100%;
}

/* .view-slider .text-formatted {
  display: flex;
  max-width: 70%;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 331px;
  z-index: 999;
  margin: auto;
  left: 0;
  right: 0;
  text-align: center;
  color: #FFF;
} */


.view-slider .text-formatted {
  display: flex;
  max-width: 70%;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 254px;
  z-index: 10;
  margin: auto;

  left: 0;
  right: 0;
  text-align: center;
  color: #FFF;
  flex-direction: column;
  font-size: 20px;
  gap: 26px;
}


.electionEnablePage .view-slider .text-formatted {
  top: 220px;
}

.view-slider .text-formatted h2 {
  font-size: 30px;
  color: #FFF;
}

.view-slider .text-formatted.center-slider-text h2 {
  font-size: 44px;
}

a.more-body,
a.read-more {
  display: flex;
  width: 94px;
  height: 23px;
  justify-content: center;
  align-items: center;
  gap: 9px;
  flex-shrink: 0;
  font-size: 14px;
  color: #fff;
}

a.more-body::after,
a.read-more::after {
  content: '';
  display: inline-block;
  width: 19px;
  height: 19px;
  background: url(../images/arrow-circule.svg) no-repeat center center;

}

a.more-body:hover,
a.read-more:hover {
  flex-direction: row-reverse;
}

a.button-body-primary {
  display: flex;
  padding: 16px 18px;
  justify-content: center;
  align-items: center;
  gap: 9px;
  flex-shrink: 0;
  font-size: 14px;
  color: #fff;
  background: var(--color-primary);
  margin: 0 5px;
  line-height: 1;
  float: right;
  position: relative;
  z-index: 99;
}

a.button-body-primary::before,
a.button-body-secondary::before {
  content: '';
  display: inline-block;
  width: 0;
  height: 100%;
  background: #fff;
  position: absolute;
  top: 0;
  right: 0;
  transition: 0.3s ease-in;
  z-index: -1;
}

a.button-body-primary:hover::before,
a.button-body-secondary:hover::before {
  width: 100%;
}

a.button-body-primary:hover {
  color: var(--color-primary);
}

a.button-body-primary::after {
  content: '';
  display: inline-block;
  width: 19px;
  height: 19px;
  background: url(../images/arrow-circule.svg) no-repeat center center;

}


a.button-body-secondary {
  display: flex;
  padding: 16px 18px;
  justify-content: center;
  align-items: center;
  gap: 9px;
  flex-shrink: 0;
  font-size: 14px;
  color: #fff;
  background: var(--color-secondary);
  margin: 0 5px;
  line-height: 1;
  float: right;
  position: relative;
  z-index: 99;
}

a.button-body-secondary:hover {
  color: var(--color-secondary);
}

a.button-body-secondary::after {
  content: '';
  display: inline-block;
  width: 19px;
  height: 19px;
  background: url(../images/arrow-circule.svg) no-repeat center center;

}


/**quick-links-grid */
.hero-slider {
  position: relative;
  width: 100%;
  height: 817px;
  overflow: hidden;
}

.quick-link-section {
  bottom: 46px;
  position: absolute;
  z-index: 99;
  margin: auto;
  right: 0;
  left: 0;
}

.quick-link-section .quick-links-grid {
  padding-top: 57px;
  border-top: 1px solid #E0E0E0;
}

.electionEnablePage .quick-links-grid {
  padding: 0;
  border: 0;
}

.quick-links-grid .view-content,
.quick-links-grid {
  display: flex;
  max-width: 92%;
  margin: auto;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 16px;
  justify-content: center;
  align-items: center;
}

.quick-links-grid .view-content {
  width: 100%;
  max-width: 100%;
}

.quick-links {
  width: 201px !important;
  height: 176px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 13px;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.25);
  transition: 0.3s;
  padding-inline: 10px !important;
  text-align: center;
}

.quick-links .views-field-field-media-image img {
  max-height: 54px;
}


.electionEnablePage .quick-links {
  background: rgba(128, 128, 128, 0.60);
}

.quick-links:hover {
  background: var(--color-secondary);
}

.quick-links a:not(.views-field-field-media-image a),
.quick-links span:not(.views-field-field-media-image a) {
  text-align: center;
  font-family: Cairo;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 18.635px;
  width: 100%;
  display: flex;
  padding: 0 5px;
  height: 60px;
  transition: 0.3s;
}

.electionEnablePage .quick-links a:not(.views-field-field-media-image a) {
  color: #fff;
}

.quick-links:hover a,
.quick-links:hover span {
  color: #fff;
}

.quick-links img {

  transition: 0.3s;
}

.quick-links:hover img {
  transform: scale(1.1);
  margin-top: 20px;
  filter: brightness(0.5) invert(1);
}

/***** small video ****/
.small-video {
  position: fixed;
  right: 20px;
  z-index: 99;
  top: 53vh;
  overflow: hidden;
  width: 197px;
  height: 243px;
}

button#close-video {
  width: 28px;
  height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 2;
  font-size: 26px;
  font-family: 'AIOA Rubik';
  margin-bottom: 7px;
  color: #fff;
  background: var(--color-primary);
  border: 0;
}

.small-video video {
  width: 100%;
  height: 207px;
  object-fit: cover;
}

/* News  ticker */
.ticker-section {

  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  background: #FFF;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.25);
  height: 58px;
}

.ticker-section h2 {
  width: 11.6%;
  /* width: 163px; */
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  background: var(--color-secondary);
  color: #fff;
  text-align: right;
  font-family: Cairo;
  font-size: 16px;
  line-height: 22.667px;
  /* 141.667% */
}

.ticker-section .content {
  display: flex;
  width: 89%;
  overflow: hidden;
}

.ticker-section .content>div:not([class]) {
  width: 100%;
}

.ticker {
  background: #fff;
  overflow: hidden;
  position: relative;
  /* display: flex;
  align-items: center; */
}

.ticker-view {
  display: flex;
  height: 58px;
  width: 100%;
}

.ticker-view .view-footer {
  width: 13%;
  height: 58px;
  display: flex;
  background: #fff;
}

.ticker-view .view-footer a {
  display: flex;
  gap: 6px;
  background: #fff;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: var(--color-primary);
  text-align: center;
  font-family: Cairo;
  font-size: 14px;
  line-height: 22.667px;
  /* 161.905% */
  transition: 0.3s;
}

.ticker-view .view-footer a:hover {
  color: var(--color-secondary);
}

.ticker-view .view-footer a::after {
  content: '';
  display: inline-block;
  width: 19px;
  height: 19px;
  border-radius: 100%;
  background: var(--color-primary) url('../images/down-arrow.svg') no-repeat center center;
  transition: 0.3s;
  transform: rotate(90deg);
}

.ticker-view .view-footer a:hover::after {

  background-color: var(--color-secondary);
}

.ticker-view .view-content {
  width: 87%;
}

.ticker__run {
  display: flex;
  list-style: none;
  animation: ticker 20s linear infinite;
  white-space: nowrap;
  gap: 14px;
  padding: 0;
  align-items: center;
  height: 100%;
  -webkit-animation: ticker 20s linear infinite;
}

.ticker__run:hover {
  animation-play-state: paused;
}

.ticker__run li {
  display: flex;
  height: 100%;
  align-items: center;
  gap: 14px;
}

.ticker__run li::before {
  content: '';
  display: inline-block;
  width: 64.001px;
  height: 43.068px;
  background: url(../images/ticker-logo.svg) no-repeat center center;

}

.ticker__run article {
  background: transparent;
  padding: 0;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  margin: 0;
  border: 0;
}

.ticker__run article:hover {
  transform: translateY(-2px);

}

.ticker__run a {
  color: #201D1E;
  text-align: right;
  font-family: Cairo;
  font-size: 13px;
  line-height: 31px;
  /* 238.462% */
}


/* RTL specific styles */
.ticker.arabic {
  direction: rtl;
}

.ticker.arabic .ticker__run {
  animation-direction: reverse;
}

/* Animation for unlimited scrolling */
@keyframes ticker {
  0% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(-100%);
  }
}

/*about section */
.node--type-about-us.node--view-mode-teaser {
  position: relative;
  border: 0;
  margin: 0;
  padding: 0;
}

.node--type-about-us.node--view-mode-teaser .field.field--name-field-media-image {
  height: 461px;
  overflow: hidden;
}

.node--type-about-us.node--view-mode-teaser .field.field--name-field-media-image * {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.summary-overlay,
.summary-overlay-link a {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 57px 32px;
  align-items: flex-start;
  justify-content: flex-end;
  display: flex;
  flex-direction: column;
  color: #fff;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #36454F 131.34%);
  font-size: var(--font-size-base);
  line-height: 30.667px;
  /* 204.444% */
  gap: 5px;
  transition: padding 0.5s ease;
  z-index: 99;
}

.vision-and-mission-grid .view-content {
  flex-wrap: wrap;
  padding: 50px;
  margin-top: 53px;
  background: var(--color-primary);
  height: 461px;
  overflow: hidden;
  flex-direction: row;
  position: relative;
}

.vision-and-mission-grid .view-content:before,
.site-footer:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: url(../images/colored-flag.png) no-repeat top left;
  display: inline-block;
  z-index: 9;
  filter: grayscale(1) invert(1);
  opacity: 00.2;
  transition: 0.3s;
}

.vision-and-mission-grid .view-content:hover:before {
  opacity: 1;
  filter: unset;
}

.vision-and-mission-grid .view-content .views-row {
  display: flex;
  width: 50% !important;
  height: 50%;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-align: center;
  font-size: var(--font-size-base);
  font-weight: 400;
  line-height: 27px;
  z-index: 999;
}

.vision-and-mission-grid .view-content .views-row:first-child {
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  padding-left: 47px !important;
  padding-bottom: 21px !important;
}

.vision-and-mission-grid .view-content .views-row:nth-child(2) {
  border-bottom: 1px solid #fff;
  padding-right: 47px !important;
  padding-bottom: 21px !important;

}

.vision-and-mission-grid .view-content .views-row:nth-child(3) {
  border-left: 1px solid #fff;
  padding-left: 47px !important;
  padding-bottom: 21px !important;
  padding-top: 35px !important;
}

.vision-and-mission-grid .view-content .views-row:last-child {

  padding-right: 47px !important;
  padding-bottom: 21px !important;
  padding-top: 35px !important;
}

.vision-and-mission-grid .view-content .views-row h2 {
  margin: 8px 0;
  color: #fff;
  display: inline-block;
  width: 100%;
}

/*Facts section */
.fact-block {
  display: flex;
  width: 93.699%;
  margin: auto;
  align-items: center;
}

.fact-block h2:not(.fact-block .image-wrapper h2) {
  color: #fff;
  width: 20%;
}

.fact-block .content {

  width: 80%;

}

.fact-block .node__content {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 21px;
  width: 100%;
  height: 221px;
}

.fact-block .image-wrapper,
.fact-block .image-wrapper h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-size: 18px;
}

.fact-block .fact-content {
  flex-direction: row-reverse;
  display: flex;
  color: #fff;
  font-size: 27px;
  line-height: 1;
}

/*elections-type-swiper */
.elections-type-swiper .swiper {
  width: 100%;
}



.elections-type-swiper .swiper .vocabulary-types-of-elections h2 {
  display: none;
}

.elections-type-swiper .swiper .vocabulary-types-of-elections .field--name-field-media-image.field__item .field--name-field-media-image,
.elections-type-swiper .swiper .swiper-slide {
  height: 507.065px;
  overflow: hidden;

}

.elections-type-swiper .swiper .vocabulary-types-of-elections .field--name-field-media-image.field__item .field--name-field-media-image img {
  min-height: 530.065px;
  transition: 0.5s;
  overflow-clip-margin: unset;
  overflow: unset;
  object-fit: cover;
}

.elections-type-swiper .swiper .vocabulary-types-of-elections .summary-overlay {
  align-items: center;
  font-size: var(--font-size-h2);
  transition: 0.5s;
  gap: 36px;
}

.elections-type-swiper .swiper .vocabulary-types-of-elections .field--name-field-boolean a {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  font-size: 0px;
  font-weight: normal;
  line-height: normal;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: end;
  padding-bottom: 40px;
}

.elections-type-swiper .swiper .vocabulary-types-of-elections .field--name-field-boolean a::after {
  display: inline-block;
  content: '';
  width: 30.368px;
  height: 33.852px;
  background: url(../images/go.svg) no-repeat center center;
  transition: 0.5s;
  opacity: 0;
  z-index: 999;
}

.elections-type-swiper .swiper .swiper-slide:hover .summary-overlay {
  padding-bottom: 100px;
}

.elections-type-swiper .swiper .swiper-slide:hover .field--name-field-boolean a::after {
  opacity: 1;
}

.elections-type-swiper .swiper .swiper-slide:hover .field--name-field-media-image.field__item .field--name-field-media-image img {
  transform: scale(1.1);
}

.elections-type-swiper .swiper .vocabulary-types-of-elections {
  display: inline-block;
  margin-top: 0px;
  overflow: hidden;
  position: relative;
}

/* elctronic services */
.electronic-services {
  background: #F5F5F5;
}


.electronic-services .view-content {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

.electronic-services .view-content .views-row {
  width: 31.575%;
  height: 208px;
}

.node--type-services.node--view-mode-swiper-list {

  padding: 42px;
  border: 1px solid #D1D1D1;
  background: #FFF;
  position: relative;
  height: 200px;
}

.node--type-services.node--view-mode-swiper-list .card-services-header {
  display: flex;
  align-items: center;
  /* justify-content: center; */
  gap: 7px;
  position: relative;
}

.node--type-services.node--view-mode-swiper-list::before {
  content: '';
  display: inline-block;
  width: 0;
  height: 100%;
  background: var(--color-secondary);
  position: absolute;
  top: 0;
  right: 0;
  transition: 0.3s ease-in;
  z-index: 9;
}

.node--type-services.node--view-mode-swiper-list .node__content {
  z-index: 999;
  transition: 0.3s ease-in;
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 15px;
  position: relative;
}

.node--type-services.node--view-mode-swiper-list:hover:before {
  width: 100%;
}

.node--type-services.node--view-mode-swiper-list h2 {
  margin-bottom: 0;
}

.node--type-services.node--view-mode-swiper-list:hover,
.node--type-services.node--view-mode-swiper-list:hover h2 {
  color: #fff;
}

.node--type-services.node--view-mode-swiper-list:hover .card-services-header img {
  filter: brightness(0.5) invert(1);
}


/*Gallery */



.view-photo-and-video-gallery .swiper .views-field-field-media-images .field--name-field-media-image,
.view-photo-and-video-gallery .swiper .field--name-field-media-image,
.view-photo-and-video-gallery .swiper .swiper-slide {
  height: 364px;
  overflow: hidden;
  position: relative;

}

.view-photo-and-video-gallery .swiper .field--name-field-media-image * {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.view-photo-and-video-gallery .swiper .swiper-slide::before {
  content: '';
  position: absolute;
  bottom: 0;
  /* Start from the bottom */
  width: 100%;
  height: 0;
  /* Start collapsed */
  padding: 57px 32px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: column;
  color: #fff;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #36454F 131.34%);
  font-size: var(--font-size-base);
  line-height: 30.667px;
  gap: 5px;
  transition: height 0.5s ease;
  z-index: 9;
  box-shadow: none;
  /* Optional shadow */
}

.view-photo-and-video-gallery .swiper .views-field-field-media-images .field--name-field-media-image img,
.view-photo-and-video-gallery .swiper .views-field-field-media-video img {
  min-height: 364px;
  transition: 0.5s;
  overflow-clip-margin: unset;
  overflow: unset;
  object-fit: cover;
}

.view-photo-and-video-gallery .swiper .swiper-slide .summary-overlay-link a {
  align-items: center;
}

.view-photo-and-video-gallery .swiper .swiper-slide .summary-overlay-link a::before {
  content: '';
  display: inline-block;
  width: 79px;
  height: 79px;
  background: #fff url(../images/gocir.svg) no-repeat center center;
  transition: top 0.5s ease;
  border-radius: 100%;
  top: -100%;
  position: absolute;
}

.view-photo-and-video-gallery .swiper .swiper-slide:hover .summary-overlay-link a::before {
  top: 39%;
  transform: translate(-50%, -50%);
  left: 50%;
}

.view-photo-and-video-gallery .swiper .swiper-slide .summary-overlay-link a::before:hover {
  background-color: var(--color-secondary);
}

.view-photo-and-video-gallery .swiper .swiper-slide:hover .summary-overlay-link a {
  padding-bottom: 81px;
}

.view-photo-and-video-gallery .swiper .swiper-slide:hover::before {
  height: 100%;
  /* Expand to full height on hover */
}

.view-photo-and-video-gallery .swiper {
  padding-bottom: 100px;
}

/* charts */
.chart-home-block {
  margin: 20px 0;
}

.chart-nav-buttons {
  margin-bottom: 29px;
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.chart-nav-btn {
  padding: 6px 32px;
  border: 1px solid #fff;
  background: #f8f9fa;
  cursor: pointer;
  border-radius: 0;
  transition: all 0.3s;
  color: var(--color-primary);
}

.chart-nav-btn:hover {
  background: var(--color-primary);
  border-color: #fff;
  color: #fff
}

.chart-nav-btn.active {
  background: var(--color-primary);
  border-color: #fff;
  color: #fff
}

/* Flexible Grid Layout */
.chart-content-wrapper {
  width: 100%;
}

.content-grid {
  display: grid;
  gap: 20px;
  width: 100%;
}

/* Grid layouts based on content count */
.content-grid.grid-single {
  grid-template-columns: 1fr;
}

.content-grid.grid-double {
  grid-template-columns: 1fr 1fr;
}

.content-grid.grid-triple {
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
}

/* Content Items */
.chart-home-block .content-item {
  border: 1px solid #ddd;
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.3s ease;
  height: 400px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center
}

.chart-home-block .content-item.content-table {
  background: #36454f85;
}

.chart-home-block .content-item .content-body {
  width: 100%;
}

/* .chart-home-block .content-item:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
} */

/* .content-header {
  background: #f8f9fa;
  padding: 15px 20px;
  border-bottom: 1px solid #ddd;
}

.content-header h3 {
  margin: 0;
  font-size: 1.2em;
  color: #333;
}

.content-body {
  padding: 20px;
} */
.highcharts-container {
  width: 100% !important;
  height: 400px !important;
  margin: auto;
  position: relative;
}

/* Individual chart styling */
.individual-chart {
  margin: auto;
}

/*.individual-chart:last-child {
  margin-bottom: 0;
} */

/* Table Styles */
.chart-table::before {
  display: inline-block;
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  background: var(--color-primary);
  z-index: 9;
  opacity: 0.8;
  top: 0;
  right: 0;

}

.chart-table {
  position: relative;
}

.chart-table table {
  width: 100%;
  position: relative;
  margin: 0;
  z-index: 99;
  ;

}

.chart-home-block .content-table .content-body {
  width: 95%;
}

.chart-table .table-striped>tbody>tr:nth-of-type(odd)>* {
  --bs-table-accent-bg: unset;
  color: #fff;
}

.chart-table th,
.chart-table td {
  padding: 8px 12px;
  border: 0px solid #ddd;
  text-align: center !important;
  color: #fff;
}

.chart-table th {
  background-color: var(--color-primary);
  font-weight: bold;
}

.chart-table tfoot span {
  color: var(--color-primary);
  display: inline-flex;
  padding: 21.652px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.011px;
  margin-bottom: 10px;
  width: 100%;
  background: #FFF;
  box-shadow: 0 3.641px 7.282px 0 rgba(0, 0, 0, 0.10);
  font-size: 14.564px;
}

.chart-home-block .content-chart .content-body {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

/* Percentage Styles */
.chart-percentage {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
  justify-content: center;
}

.percentage-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  /* border-radius: 100%; */
}

.circular-progress {
  position: relative;
  width: 200px;
  height: 200px;
  /* width: 113.341px; */
  /* height: 113.341px; */
  /* filter: drop-shadow(0 3.839px 3.839px rgba(0, 0, 0, 0.25)); */

  box-shadow: 0 3.839px 3.839px rgba(0, 0, 0, 0.25);
  background: rgba(242, 242, 242, 1);
  border-radius: 100%;
}

.progress-ring {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
  background: #F2F2F2;
  border-radius: 100%;
}

.progress-ring-bg {
  fill: none;
  stroke: #e4dfdf;
  stroke-width: 16px;
  box-shadow: 0 3.839px 3.839px rgba(0, 0, 0, 0.25);
  /* stroke-linecap: round; */
}

.progress-ring-fill {
  fill: none;
  stroke: #34495e;
  stroke-width: 16px;
  /* stroke-linecap: round; */
  transition: stroke-dashoffset 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: 0 3.839px 3.839px rgba(0, 0, 0, 0.25);
}

.percentage-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 28px;
  font-weight: 600;
  color: var(--color-primary);
  letter-spacing: -0.5px;
  width: 110px;
  height: 110px;
  align-items: center;
  justify-content: center;
  display: flex;
  border-radius: 100%;
  box-shadow: 0 3.839px 3.839px rgba(0, 0, 0, 0.25);
}

.percentage-label {
  font-size: 18px;
  color: var(--color-primary);
  font-weight: bold;
  text-align: center;
  max-width: max-content;
}

.block-chart-home-block h2 {
  color: #fff;

}

/*callender */
.view-view-home-calendar {
  width: 100%;
  margin: auto;
}

.view-view-home-calendar .fc-today-button,
.view-view-home-calendar .fc-right {
  display: none;
}

.view-view-home-calendar .fc-toolbar.fc-header-toolbar {
  margin: 0;
  background: var(--color-primary);
  color: #000;
  align-items: center;
  justify-content: center;
  height: 62px;
  position: relative;
}

.view-view-home-calendar .fc-center {
  position: relative;
  z-index: 999;
}

.view-view-home-calendar .fc-center h2 {
  margin: 0;
  font-size: 16.154px;
  color: #fff;
  font-weight: normal;
}

.view-view-home-calendar .fc-button-group {
  background: transparent;
  position: absolute;
  width: 43%;
  margin: auto;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  height: 48px;
  justify-content: space-between;
  display: flex;
  flex-direction: row-reverse;
}

.view-view-home-calendar .fc-button-group .fc-button {
  background: transparent;
  color: #fff;
  border: 0;
  padding: 0;
}

#event {
  width: 56%;
  margin: auto;
  padding: 0;
  transition: left 0.4s ease-in-out;
  position: relative;
  left: 0;
}

[id^="windowManager_"] {
  display: none !important;
}

div#event.event-open {
  left: 20px;
}

#event-content {
  display: none;
  opacity: 0;
  transition: opacity 0.4s ease-in-out, display 0.4s ease-in-out;
}

#event-content.event-open {
  display: inline-block;
  opacity: 1;
  width: 35%;
  margin-top: 51px;
}

.custom-event .node__content {
  border: 1px solid #CFCFCF;
  background: #FFF;
}

.custom-event img {
  width: 100%;
  min-height: 195px;
}

.custom-event .field--name-field-media-image {
  overflow: hidden;
  height: 195px;
}

.custom-event .card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px 51px;
  text-align: right;
  height: 276px;

}

.custom-event .card-body .field--name-field-date {
  display: flex;
  height: 25px;
  flex-direction: row;
  align-items: center;
  flex-shrink: 0;
  gap: 6px;
  color: #3C3C3C;
  text-align: right;
  font-family: Cairo;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 184.615% */
}

.custom-event .card-body .field--name-field-date::before {
  content: '';
  display: inline-block;
  width: 17.546px;
  height: 16.454px;
  background: url(../images/date.svg) no-repeat center center;
}

.section-space .custom-event .card-body h2,
.section-space .custom-event .card-body h2 a {
  margin-bottom: 0;
  color: #201D1E;
  text-align: right;
  font-family: Cairo;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 35px;
}

.custom-event .card-body .text-formatted.field.field--name-field-brief {
  color: #282828;
  text-align: right;
  font-family: Cairo;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 30.667px;
  height: 61px;
  overflow: hidden;
}

.custom-event .card-body a.read-more {
  background: var(--color-secondary);
  padding: 5px;
  font-size: 9px;
  height: 25px;
}

.fc-view>table {
  margin: 0;
}

.fc-scroller.fc-day-grid-container {
  height: auto !important;
  overflow: hidden !important;
}

.fc-dayGrid-view .fc-body .fc-row {
  min-height: 58px;
  height: 58px !important;
}

.fc td {
  border-style: solid;
  border-width: 1px;
  padding: 0;
  vertical-align: middle;
  text-align: center !important;
  background: #F8F2F1;
  border: 0.8px solid #B2B2B2 !important;
}

.fc-unthemed .fc-content,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-list-heading td,
.fc-unthemed .fc-list-view,
.fc-unthemed .fc-popover,
.fc-unthemed .fc-row,
.fc-unthemed tbody,
.fc-unthemed td,
.fc-unthemed th,
.fc-unthemed thead {
  border: 0
}

.fc th {
  border: 0.8px solid #fff !important;
  background: var(--color-primary) !important;
  text-align: center !important;
  font-size: 10.725px;
  font-weight: normal;
  height: 60px;
  vertical-align: middle;
}

thead>tr {
  border-bottom: 0px solid #000;
}

.fc table {
  margin: 0;
}

.fc-content-skeleton td,
.fc-content-skeleton tr {
  background: transparent;
  border: 0px;
}


.fc .fc-row .fc-content-skeleton table,
.fc .fc-row .fc-content-skeleton td,
.fc .fc-row .fc-mirror-skeleton td {
  background: 0 0;
  border-color: transparent;
  border: 0 !important;
}


.fc-ltr .fc-dayGrid-view .fc-day-top .fc-day-number {
  float: none;
}


.fc-row .fc-content-skeleton {
  position: relative;
  z-index: 4;
  padding-bottom: 0;
  height: 100%;
}

.fc-day-number {
  pointer-events: none;
}


td.fc-day-top {
  padding-top: 7px;
}


.fc-content {
  background: var(--color-secondary);
  border: 0 !important;
}

.fc-rtl .fc-dayGrid-view .fc-day-top .fc-day-number {
  float: none;
}

/*usful links */
.view-useful-links .swiper-slide.swiper-slide-next {
  border-left: 1px solid #B7B7B7;
  border-right: 1px solid #B7B7B7;
}


.node.node--type-useful-links.node--view-mode-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  height: 200px;
}

.node.node--type-useful-links.node--view-mode-card .node__content {
  display: flex;
  width: max-content;
  height: max-content;
  position: relative;
}

.node.node--type-useful-links.node--view-mode-card .node__content .field--name-title a {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: hsl(204deg 18.8% 26.08% / 50%);
  right: 0;
  top: 0;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  text-align: center;
}

.node.node--type-useful-links.node--view-mode-card .node__content .field--name-field-link {
  display: none;
}

.node.node--type-useful-links.node--view-mode-card .node__content:hover .field--name-title a {
  opacity: 1;
}


/* Footer */
.site-footer {
  font-family: 'CAIRO';
  padding: 64px 0;
  background: var(--color-primary);
  position: relative;
  margin-top: 10px;
  z-index: 99992;
}


[dir="rtl"] .site-footer__top .region:last-child {
  padding: 0;
  width: 100%;
}

section.row.region.region-footer-first {
  gap: 15px;
}

.site-footer h2 {
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 56px;
  color: #fff;
  margin-bottom: 19px;
  border-bottom: 0;
  padding-bottom: 0;
  position: relative;
}

.site-footer h2:after {
  content: '';
  display: inline-block;
  width: 42px;
  height: 2px;
  background: #fff;
  position: absolute;
  bottom: 0px;
  right: 0;
}


.site-footer .menu--header-social-media .nav-link:hover {
  color: var(--color-primary);
  border-color: #fff;
  background-color: #fff;
}

.site-footer .footer-second ul,
.site-footer .footer-third ul {
  flex-direction: column;
}

.site-footer .footer-second ul a,
.site-footer .footer-third ul a {
  font-size: 15px;
  font-style: normal;
  font-weight: normal;
  line-height: 40px;
  /* 373.333% */
  color: #fff;
}

.site-footer .block {
  margin: 0;
  border: 0px;
  padding: 0;
}

.site-footer .container {
  position: relative;
  z-index: 999;
}

div#block-bootstrap-barrio-subtheme-backtotop {
  display: inline-block;
  width: max-content;
  text-align: center;
}

.footer-fourth .field--name-body {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

#block-bootstrap-barrio-subtheme-atslbna p {
  color: #FFF;
  text-align: right;
  font-family: Cairo;
  font-size: 13px;
  line-height: 20px;
  display: flex;
  gap: 5px;
  margin-top: 0 !important;
  height: 44px;
}

#block-bootstrap-barrio-subtheme-simplenewssubscription label,
#block-bootstrap-barrio-subtheme-simplenewssubscription .description,
#block-bootstrap-barrio-subtheme-simplenewssubscription .field--name-subscriptions {
  display: none;
}

#block-bootstrap-barrio-subtheme-simplenewssubscription input {
  border-radius: 0;
  border: 0;
  padding: 14px 19px;
}

#block-bootstrap-barrio-subtheme-simplenewssubscription button,
#block-bootstrap-barrio-subtheme-simplenewssubscription button:hover {
  height: 51px;
  width: 100%;
  background: var(--color-accent);
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  font-style: normal;
  font-weight: 700;
  gap: 10px;
  border: none;
}

#block-bootstrap-barrio-subtheme-simplenewssubscription button:after {
  content: '';
  display: inline-block;
  width: 17.608px;
  height: 17.607px;
  background: url(../images/send.svg) no-repeat center center;
}

#block-bootstrap-barrio-subtheme-simplenewssubscription .js-form-wrapper {
  margin-bottom: 0 !important;
}

.site-footer__bottom {
  letter-spacing: 0;
  margin-top: 0;
  border-top: 0px solid #555;
  border-color: rgba(255, 255, 255, 0.15);
}

.site-footer__bottom .region {
  margin-top: 0;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 13px;
}

.site-footer__bottom .region nav,
.site-footer__bottom .region #block-bootstrap-barrio-subtheme-copyright {
  width: max-content;
}

nav#block-bootstrap-barrio-subtheme-topheadermenu-2 {
  margin-right: 37%;
}

.site-footer:before {
  background-size: 30%;
}

.export-csv-btn {
  display: none;
}




/* about */
iframe {
  height: 498px;
}

div#sidebar_first {
  margin-top: 50px;
  padding: 0 60px;
  position: relative;
}

.sidebar .block {
  border-style: solid;
  border-width: 0;
  padding: 0;
  margin: 0 0 20px;
}

.sidebar .nav {
  margin: 0;
  flex-direction: column;
  gap: 17px;
}

.sidebar .nav a {
  display: flex;
  width: 100%;
  height: 56px;
  padding: 13px 40px 13px 13px;
  border-radius: 70px;
  border: 1px solid #36454F;
  background: #FFF;
  color: #000;
  text-align: right;
  font-family: Cairo;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase
}

.sidebar .nav a:hover,
.sidebar .nav li.active a {
  background: #36454F;
  color: #fff;
}

.sidebar nav .nav {
  margin: 0 0;

}

aside.section {
  position: sticky;
  top: 14px;
}


/**** counter ****/

.countdown {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row-reverse;
}

.time-unit {
  /* background: rgba(255, 255, 255, 0.2); */
  /* border-radius: 15px; */
  /* padding: 1.5rem; */
  /* min-width: 120px; */
  /* border: 1px solid rgba(255, 255, 255, 0.3); */
  transition: transform 0.3s ease;
  align-items: center;
  justify-content: center;
  display: flex;
  flex-direction: column-reverse;
  gap: 10px;
}

.time-unit:hover {
  transform: translateY(-5px);
}

.time-value {
  font-size: 3rem;
  font-weight: bold;
  display: block;
  /* text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); */
  margin-bottom: 0.5rem;
  border-radius: 7.159px;
  background: #FFF;
  color: #36454F;
  font-family: Cairo;
  font-size: 31.292px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  align-items: center;
  display: flex;
  justify-content: center;
  width: 62.642px;
  height: 64.432px;
}

.time-label {
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  /* opacity: 0.8; */
  color: #FFF;
  text-align: center;
  font-family: Cairo;
  font-size: 15.646px;
  font-style: normal;
  font-weight: 700;
  line-height: 31.987px;
  /* 204.444% */
}

.target-date {
  font-size: 1.2rem;
  opacity: 0.9;
  margin-top: 1rem;
}

.expired {
  color: #ff6b6b;
  font-size: 2rem;
  font-weight: bold;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

div#countdown {
  position: absolute;
  top: 348px;
  /* z-index: 9999; */
  z-index: 500;
  left: 0;
  right: 0;
  margin: auto;
  width: max-content;
}


.media--ratio--43 {
  padding-bottom: 0%;
}

.id-card-wrapper input {
  border-radius: 0;
  width: 297px;
  height: 37px;
}

.id-card-wrapper button {
  width: 130px;
  flex-shrink: 0;
  border-radius: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #142438;
  font-size: 13.213px;
  font-weight: 700;
  height: 37px;
  border: none;
  margin-top: 41px;
}

.id-card-wrapper button:hover {
  background-color: var(--color-secondary);
}

.id-card-wrapper .form-type-number {
  margin-bottom: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.id-card-wrapper form {
  padding: 26px 56px;
  border: 1px solid #CACACA;
  background: #FFF;
  margin-inline: 80px;
  margin-bottom: 21px;
  display: flex;
  gap: 9px;
}

.id-card-wrapper .fieldset-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.id-card-wrapper .voter-info-wrapper {
  margin-inline: 80px;
  border: 1px solid #CACACA;
  background: #FFF;
  padding: 34px 65px;
  padding-inline-end: 27px;
}

.id-card-wrapper .voter-info-wrapper .voter-info-item {
  display: flex;
  gap: 20px;
  align-items: flex-start;

  .label {
    display: none;
  }

  iframe {
    width: 100%;
  }

  .voter-icon {
    width: 39px;
    height: 39px;
    flex-shrink: 0;
    background-color: #142438;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;

    img {
      width: 19.326px;
      height: 20.479px;
      object-fit: contain;
    }
  }
}

.voter-info-wrapper .voter-data {
  display: flex;
  gap: 5px;
  font-size: 15px;
  color: #142438;
  flex-direction: column;

  .label {
    display: block !important;
    font-size: 18px;
    line-height: 1;
  }
}

.voter-info-wrapper .col-sm-5 {
  display: flex;
  flex-direction: column;
  gap: 25px;
  justify-content: space-evenly;

}


li.config.view.statistics.block_1.menu-item--expanded.menu-item.show-expanded {
  .view-expanded-block {
    right: auto !important;
    left: 0;
  }
}

li.config.view.election_map.block_4.menu-item--expanded.menu-item.show-expanded {
  .view-expanded-block {
    margin-right: -313px !important;
  }

}