:root {
  --psa-body-font: Calibri, san-sherif;
  --psa-primary-font: Lusail, Calibri;
  --psa-white: #fff;
  --psa-white-f8: #f8f8f8;
  --psa-white-f4: #f4f4f4;
  --psa-white-ef: #efefef;
  --psa-aladaam: #8A1538;
  --psa-aladaamdark: #64011F;
  --psa-dune: #A29475;
  --psa-dunedark: #826C4A;
  --psa-skyline: #0D4261;
  --psa-palm: #009C80;
  --psa-sea: #4194B3;
  --psa-black: #000;
  --psa-black-18: #181818;
  --psa-black-28: #282828;
  --psa-black-38: #383838;
  --psa-black-48: #484848;
  --psa-black-58: #585858;
  --psa-black-68: #686868;
  --psa-black-88: #888;
  --psa-black-a8: #a8a8a8;
  --psa-black-c8: #c8c8c8;
  --psa-black-dd: #ddd;
  --psa-black-d8: #d8d8d8;
  --psa-note-yellow: #FFD600;
  --lightbox: rgba(0, 0, 0, .95);
  --psa-male: #3D4CCE;
  --psa-female: #E850AB;
  --psa-positive: #057901;
  --psa-negative: #D60027;
  --psa-transparent: transparent;
  --psa-width-1: 1px;
  --psa-border-dashed: dashed;
  --psa-border-solid: solid;
  --shadow-small: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --bs-offcanvas-padding-x: 1rem;
  --bs-offcanvas-padding-y: 1rem;
  --psa-padding-15: 1.5rem;
  --psa-padding-15-x: 1.5rem;
  --psa-padding-15-y: 1.5rem;
  --accordion-closed: url("data:image/svg+xml,%3Csvg width='32' height='33' viewBox='0 0 32 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2' y='17.7861' width='2.70968' height='28' rx='1.35484' transform='rotate(-90 2 17.7861)' fill='%238A1538'/%3E%3C/svg%3E%0A");
  --accordion-open: url("data:image/svg+xml,%3Csvg width='32' height='33' viewBox='0 0 32 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='14.6455' y='2.43115' width='2.70968' height='28' rx='1.35484' fill='%238A1538'/%3E%3Crect x='2' y='17.7859' width='2.70968' height='28' rx='1.35484' transform='rotate(-90 2 17.7859)' fill='%238A1538'/%3E%3C/svg%3E%0A")
}

@font-face {
  font-family: 'Lusail';
  src: url(../../fonts/Lusail-Regular.eot);
  src: url(../../fonts/Lusail-Regular.eot?#iefix) format("embedded-opentype"), url(../../fonts/Lusail-Regular.woff2) format("woff2"), url(../../fonts/Lusail-Regular.woff) format("woff"), url(../../fonts/Lusail-Regular.ttf) format("truetype"), url(../../fonts/Lusail-Regular.svg#Lusail-Regular) format("svg");
  font-weight: 400;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: 'Lusail';
  src: url(../../fonts/Lusail-Light.eot);
  src: url(../../fonts/Lusail-Light.eot?#iefix) format("embedded-opentype"), url(../../fonts/Lusail-Light.woff2) format("woff2"), url(../../fonts/Lusail-Light.woff) format("woff"), url(../../fonts/Lusail-Light.ttf) format("truetype"), url(../../fonts/Lusail-Light.svg#Lusail-Light) format("svg");
  font-weight: 300;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: 'Lusail';
  src: url(../../fonts/Lusail-Bold.eot);
  src: url(../../fonts/Lusail-Bold.eot?#iefix) format("embedded-opentype"), url(../../fonts/Lusail-Bold.woff2) format("woff2"), url(../../fonts/Lusail-Bold.woff) format("woff"), url(../../fonts/Lusail-Bold.ttf) format("truetype"), url(../../fonts/Lusail-Bold.svg#Lusail-Bold) format("svg");
  font-weight: 700;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: 'Lusail';
  src: url(../../fonts/Lusail-Medium.eot);
  src: url(../../fonts/Lusail-Medium.eot?#iefix) format("embedded-opentype"), url(../../fonts/Lusail-Medium.woff2) format("woff2"), url(../../fonts/Lusail-Medium.woff) format("woff"), url(../../fonts/Lusail-Medium.ttf) format("truetype"), url(../../fonts/Lusail-Medium.svg#Lusail-Medium) format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: 'Calibri';
  src: url(../../fonts/Calibri-Bold.eot);
  src: url(../../fonts/Calibri-Bold.eot?#iefix) format("embedded-opentype"), url(../../fonts/Calibri-Bold.woff2) format("woff2"), url(../../fonts/Calibri-Bold.woff) format("woff"), url(../../fonts/Calibri-Bold.ttf) format("truetype"), url(../../fonts/Calibri-Bold.svg#Calibri-Bold) format("svg");
  font-weight: 700;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: 'Calibri';
  src: url(../../fonts/Calibri.eot);
  src: url(../../fonts/Calibri.eot?#iefix) format("embedded-opentype"), url(../../fonts/Calibri.woff2) format("woff2"), url(../../fonts/Calibri.woff) format("woff"), url(../../fonts/Calibri.ttf) format("truetype"), url(../../fonts/Calibri.svg#Calibri) format("svg");
  font-weight: 400;
  font-style: normal;
  font-display: swap
}

* {
  transition: all .2s ease-in
}

body {
  font-family: var(--psa-body-font);
  overflow-x: hidden;
  overflow-y: inherit;
  position: relative
}

p {
  font-size: 16px;
  margin-bottom: 12px
}

body.freeze {
  position: fixed
}

.ms-rtestate-field h1,
h1.ms-rteElement-H1,
.ms-rtestate-field h2,
h2.ms-rteElement-H2 {
  color: var(--psa-black-18);
  margin: 0
}

h1,
h2,
h3,
h4,
h5 {
  font-family: var(--psa-primary-font);
  font-weight: 400;
  color: var(--psa-black-18);
  margin: 0
}

h3 {
  font-size: 26px
}

body.contrastMode,
.contrastMode p,
.contrastMode div,
.contrastMode ul {
  background: var(--psa-black) !important;
  color: var(--psa-white) !important
}

.contrastMode ul {
  border: 1px solid #fff
}

body.contrastMode a {
  background: var(--psa-black);
  color: #ff0 !important
}

body.contrastMode img {
  filter: gray;
  -webkit-filter: grayscale(1);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%)
}

a {
  text-decoration: none !important
}

a:visited {
  color: inherit
}

label {
  transition: none
}

.container-fluid {
  padding-left: 80px;
  padding-right: 80px
}

.topNav {
  background: var(--psa-aladaam) url(../../images/pattern-AlAdaam.png);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  height: 48px;
  display: flex;
  align-items: center
}

.topNavFlex {
  display: flex;
  align-items: center;
  justify-content: flex-end
}

.btn-accessibility {
  background: transparent;
  border: 0;
  padding: 0;
  min-width: auto
}

.btn-accessibility.dropdown-toggle::after {
  display: none
}

.accessibility .dropdown-menu.show {
  transform: translateY(32px) !important;
  padding: 1rem
}

.min-font,
.max-font {
  background: var(--psa-aladaam);
  border-radius: 50px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--psa-white) !important;
  font-weight: 500;
  font-size: 16px;
  font-family: Rockwell
}

.font-slider {
  display: flex;
  align-items: center;
  margin-top: .5rem;
  margin-bottom: 1rem
}

.reset-font {
  background: var(--psa-black-d8);
  border-radius: 20px;
  padding: .15rem 1rem;
  margin-left: .5rem;
  margin-right: .5rem;
  white-space: nowrap;
  color: var(--psa-black) !important
}

.reset-font:hover,
.min-font:hover,
.max-font:hover {
  opacity: .7
}

.contrast.form-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 0
}

.contrast.form-switch .form-check-input {
  height: 1.5rem;
  width: 3rem;
  border-radius: 3rem;
  margin: 0;
  background-color: var(--psa-black-d8)
}

.contrast.form-switch .form-check-input:checked {
  background-color: var(--psa-transparent) !important;
  border-color: var(--psa-white) !important
}

.languageSwitch a {
  font-family: var(--psa-primary-font);
  font-size: 16px;
  border: var(--psa-width-1) var(--psa-border-solid) var(--psa-white);
  padding: .2rem 1rem;
  color: var(--psa-white);
  text-decoration: none
}

.languageSwitch a:hover {
  background: var(--psa-white);
  color: var(--psa-aladaam)
}

.languageSwitch a:focus {
  background-color: var(--psa-aladaamdark);
  color: var(--psa-white);
  border-color: var(--psa-aladaamdark)
}

.social-media a {
  display: inline-block;
  padding-left: .25rem;
  padding-right: .25rem
}

.social-media a:first-child {
  padding-left: 0
}

.social-media a:last-child {
  padding-right: 0
}

.search-input-group {
  position: relative;
  display: flex
}

.search-icon {
  display: flex;
  align-items: center;
  padding: 0 .5rem 0 0
}

@media(max-width:640px) {
  .search.mobile .search-wrapper {
    width: 100%
  }
}

.ms-srch-sb>input {
  height: auto;
  display: block;
  width: 250px;
  padding: 0 .25rem !important;
  font-size: 18px;
  line-height: 1.5;
  color: var(--psa-white) !important;
  -webkit-appearance: none !important;
  -moz-appearance: none;
  appearance: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-bottom: var(--psa-width-1) solid var(--psa-white) !important;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out
}

.ms-srch-sb>input::placeholder {
  color: var(--psa-white);
  opacity: .5;
  font-weight: 400
}

li.menu-item {
  padding: 0 .5rem
}

li.menu-item.simple {
  position: relative
}

.wrapper {
  margin: 40px auto;
  width: 400px;
  display: block;
  text-align: center;
  transition: .15s ease
}

.wrapper.active .arrow {
  transform: rotate(45deg) translate(-5px, -5px)
}

.wrapper.active .arrow:before {
  transform: translate(10px, 0)
}

.wrapper.active .arrow:after {
  transform: rotate(90deg) translate(10px, 0)
}

.wrapper.active ul {
  opacity: .3;
  height: 108px
}

.wrapper3 .arrow {
  transform: rotate(0);
  left: 0
}

.wrapper3 .arrow:before,
.wrapper3 .arrow:after {
  background-color: transparent;
  width: 3px;
  height: 10px;
  display: inline-block;
  position: absolute;
  border-bottom: 12px solid #fff;
  top: 0;
  left: 0;
  transform: rotate(0)
}

.wrapper3 .arrow:before {
  transform: rotate(-135deg)
}

.wrapper3 .arrow:after {
  transform: rotate(135deg)
}

.wrapper3.active .arrow {
  transform: rotate(0);
  transform: translate(0, -6px)
}

.wrapper3.active .arrow:before {
  transform: rotate(-45deg)
}

.wrapper3.active .arrow:after {
  transform: rotate(45deg)
}

li.menu-item {
  padding: 0 .45rem
}

a.navLink {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  font-weight: 500;
  color: var(--psa-aladaam);
  display: flex;
  align-items: center;
  text-decoration: none;
  text-decoration: none;
  background: 0 0;
  border: 0;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
  padding: var(--bs-nav-link-padding-y) var(--bs-navbar-nav-link-padding-x);
  position: relative
}

.arrow {
  position: relative;
  width: 5px;
  display: block;
  height: 10px;
  margin-left: .75rem
}

.arrow:before,
.arrow:after {
  content: "";
  position: absolute;
  background: var(--psa-aladaam);
  border-radius: .2rem;
  display: block
}

.arrow.up:before,
.arrow.down:before {
  left: 100%
}

.arrow.up:after,
.arrow.down:after {
  right: 100%
}

.arrow.up:before,
.arrow.down:before,
.arrow.up:after,
.arrow.down:after {
  top: 0;
  height: 10px;
  width: 2px
}

.arrow.up:before,
.arrow.up:after {
  transform: rotate(-45deg)
}

.arrow.up:after {
  transform: rotate(45deg)
}

.arrow.down:before,
.arrow.down:after {
  transform: rotate(45deg)
}

.arrow.down:after {
  transform: rotate(-45deg)
}

.navLink:hover .arrow:before,
.navLink:hover .arrow:after {
  background: var(--psa-dune);
  transition: all .2s ease-in
}

.site-logos {
  padding: 1rem 0;
  display: flex;
  align-items: center;
  justify-content: center
}

.mm-heading {
  margin-bottom: 1.5rem
}

.mm-heading h3 {
  font-weight: 400;
  position: relative
}

.mm-heading h3:before {
  content: '';
  width: 100%;
  height: 1px;
  background: var(--psa-black-d8);
  display: block;
  position: absolute;
  bottom: 0
}

.mm-heading h3:after {
  content: '';
  width: 100px;
  height: 3px;
  background: var(--psa-aladaam);
  display: block;
  position: absolute;
  bottom: -1px;
  border-radius: 3px
}

.mm-Submenu-Item a {
  background: var(--psa-white);
  padding: .5rem .8rem;
  border-radius: 5px;
  display: flex;
  margin-bottom: .25rem;
  font-family: var(--psa-primary-font);
  font-size: 18px;
  text-decoration: none;
  color: var(--psa-aladaam)
}

.mm-Submenu-Item a:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

.mm-Submenu-Item {
  margin-bottom: 1rem
}

.mm-navTopic {
  font-size: 24px;
  font-family: var(--psa-primary-font);
  color: var(--psa-black-28)
}

.whiteBgWrapper {
  background: var(--psa-white);
  padding: 1rem;
  height: 100%
}

li.boxed-List-Item {
  list-style: none;
  padding: 0
}

ul.boxed-List {
  padding: 0;
  margin: 1rem 0 0
}

li.boxed-List-Item a {
  background: var(--psa-white);
  padding: .5rem 1rem;
  display: flex;
  align-items: center;
  border: var(--psa-width-1) var(--psa-border-solid) var(--psa-black-dd);
  color: var(--psa-aladaam);
  text-decoration: none;
  font-family: var(--psa-primary-font);
  font-size: 18px;
  border-radius: 3px;
  margin-bottom: 1rem
}

li.boxed-List-Item a:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

.list-ic a {
  color: var(--psa-black-28);
  text-decoration: none;
  padding: 0 .5rem
}

.list-ic a:hover {
  color: var(--psa-aladaam);
  transform: scale(1.075)
}

.list-ic li {
  position: relative
}

.list-ic li span {
  display: inline-block;
  width: 18px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='20' viewBox='0 0 18 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M18 5L9 0L0 5V15L9 20L18 15V5ZM8.99997 12C10.1045 12 11 11.1046 11 10C11 8.89543 10.1045 8 8.99997 8C7.89541 8 6.99997 8.89543 6.99997 10C6.99997 11.1046 7.89541 12 8.99997 12Z' fill='%238A1538'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  position: relative
}

.list-ic li::before {
  content: "";
  position: absolute;
  background: #888;
  z-index: -1
}

.list-ic.vertical {
  padding: 0;
  margin: 1rem 0
}

.list-ic.vertical li {
  list-style-type: none;
  display: flex;
  align-items: center;
  margin-bottom: 1rem
}

.list-ic.vertical li::before {
  top: -15px;
  left: 8px;
  width: 2px;
  height: 14px
}

.list-ic li:first-child::before {
  display: none
}

.boxed-icon {
  width: 28px;
  height: 28px
}

.stats-calendar-icon {
  background-image: url(../../images/stats-calendar-icon.svg)
}

.digital-atlas-icon {
  background-image: url(../../images/digital-atlas-icon.svg)
}

.ft-icon {
  background-image: url(../../images/ft-icon.svg)
}

.sdgs-icon {
  background-image: url(../../images/sdg-wheel-icon.svg)
}

.nsdp-icon {
  background-image: url(../../images/nsdp-icon.svg)
}

.dictionary-icon {
  background-image: url(../../images/dictionary-icon.svg)
}

li.boxed-List-Item a:hover .stats-calendar-icon {
  background-image: url(../../images/stats-calendar-icon-w.svg)
}

li.boxed-List-Item a:hover .digital-atlas-icon {
  background-image: url(../../images/digital-atlas-icon-w.svg)
}

li.boxed-List-Item a:hover .ft-icon {
  background-image: url(../../images/ft-icon-w.svg)
}

li.boxed-List-Item a:hover .sdgs-icon {
  background-image: url(../../images/sdg-wheel-icon-w.svg)
}

li.boxed-List-Item a:hover .nsdp-icon {
  background-image: url(../../images/nsdp-icon-w.svg)
}

li.boxed-List-Item a:hover .dictionary-icon {
  background-image: url(../../images/dictionary-icon-w.svg)
}

li.boxed-List-Item a .boxed-icon~span {
  display: block;
  padding: .25rem .5rem 0;
  width: calc(100% - 28px);
  transition: none
}

.megamenu {
  position: absolute;
  height: auto;
  left: 50%;
  margin: 0 auto;
  transform: translateX(-50%);
  background: #F4F4F4;
  color: #282828;
  padding: var(--psa-padding-15)
}

.megamenu-column-1 {
  width: auto;
  min-width: 250px;
  padding: 1rem !important
}

.megamenu-column-4 {
  width: calc(100% - 160px)
}

.megamenu p {
  margin: 0;
  padding: 0;
  font-size: 15px;
  color: var(--psa-black-48)
}

.simple ul {
  margin: 0;
  padding: 0
}

.simple ul li {
  list-style: none;
  padding: .5rem 0;
  margin: 0
}

.simple ul li a {
  background: var(--psa-white);
  padding: .5rem 1rem;
  display: block;
  font-size: 16px;
  color: var(--psa-black-28);
  text-decoration: none;
  border-radius: 3px
}

.simple ul li a:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

.mobile {
  display: none
}

.desktop {
  display: flex
}

.offcanvas-header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--psa-padding-15)
}

.btn-close {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
  opacity: 1
}

@keyframes slideLeft {
  0% {
    opacity: 0;
    transform: translateX(100%)
  }

  100% {
    opacity: 1;
    transform: translateX(0%)
  }
}

@keyframes slideRight {
  0% {
    opacity: 1;
    transform: translateX(0%)
  }

  100% {
    opacity: 0;
    transform: translateX(100%)
  }
}

.btn-primary,
.btn-check:checked+.btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check)+.btn:active {
  background: var(--psa-aladaam);
  border: 1px solid var(--psa-aladaam);
  border-radius: 3px;
  text-decoration: none !important;
  color: #fff !important
}

.btn-primary:hover {
  color: var(--psa-aladaam) !important;
  background-color: var(--psa-transparent);
  border-color: var(--psa-aladaam)
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 100;
  margin: 0 auto;
  background-color: var(--psa-white);
  box-shadow: var(--shadow-medium)
}

.brand {
  font-family: inherit;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  color: var(--psa-aladaam);
  text-transform: uppercase;
  order: 1
}

.navbar {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.07)
}

.navbar-left {
  display: none;
  align-items: center;
  flex: 0 0 17%
}

.menu-header {
  display: none;
  box-shadow: var(--shadow-medium)
}

.menu-link>i.bx {
  font-size: 1.35rem;
  margin-left: .25rem;
  transform: rotate(90deg)
}

.menu-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 6px;
  font-size: 1.45rem;
  color: var(--psa-black-48);
  transition: all .25s ease
}

.submenu {
  position: absolute;
  height: auto;
  margin-top: 1.75rem;
  padding: 1rem 2rem;
  z-index: 100;
  opacity: 0;
  display: none;
  border-radius: 0 0 .25rem .25rem;
  border-top: 2px solid var(--psa-aladaam);
  box-shadow: var(--shadow-medium);
  transition: all .25s ease-in-out;
  opacity: 0;
  -webkit-animation: fading ease-in 1s;
  animation: fading ease-in 1s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 1s;
  animation-duration: .3s
}

.overlay {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  opacity: 0;
  visibility: hidden;
  background-color: rgba(0, 0, 0, 0.7);
  transition: all .45s ease-in-out
}

.burger {
  position: relative;
  display: block;
  cursor: pointer;
  width: 1.6rem;
  height: 1rem;
  background: transparent
}

.burger-line {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 2px;
  opacity: 1;
  border-radius: 1rem;
  background: var(--psa-black-48)
}

.burger-line:nth-child(1) {
  top: 0
}

.burger-line:nth-child(2) {
  top: .5rem;
  width: 70%
}

.burger-line:nth-child(3) {
  top: 1rem
}

.submenu .col-md-4 .whiteBgWrapper {
  height: 100%
}

@media only screen and (min-width: 991px) {
  .menu-dropdown:hover>.submenu {
    opacity: 1;
    display: flex;
    margin-top: 0
  }
}

@media only screen and (max-width: 991px) {
  .mobile {
    display: block
  }

  .desktop {
    display: none
  }

  .topNav {
    height: 24px
  }

  .navbar-nav {
    position: initial
  }

  .navbar-left,
  .navbar-right {
    display: flex;
    flex: 0 0 auto
  }

  .navbar-right {
    align-items: center
  }

  .navbar-center {
    flex: 0 0 100%;
    order: 3;
    align-items: center
  }

  .menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 75%;
    height: 100%;
    z-index: 100;
    overflow: hidden;
    transform: translate(-100%);
    background-color: var(--psa-aladaam);
    transition: all .3s ease-in-out
  }

  a.navLink {
    color: var(--psa-white);
    display: flex;
    justify-content: space-between;
    padding: .65rem 1rem
  }

  .arrow:before,
  .arrow:after {
    background: var(--psa-white)
  }

  .menu.is-active {
    transform: translate(0%)
  }

  .navbar {
    padding: .25rem 0 .5rem
  }

  .menu-header {
    position: relative;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 4rem;
    z-index: 110;
    display: none;
    background: var(--psa-aladaam);
    color: var(--psa-white)
  }

  .menu-header.is-active {
    display: flex
  }

  .menu-header.is-active>.menu-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(0)
  }

  .menu-arrow {
    display: none;
    cursor: pointer;
    width: 3rem;
    height: 4rem;
    text-align: center;
    transition: all .25s ease
  }

  .menu-arrow:after {
    content: '';
    background: url(../../images/arrow-left-w.svg) no-repeat;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center
  }

  .menu-title {
    font-family: inherit;
    font-size: inherit;
    font-weight: 500;
    line-height: inherit;
    text-transform: capitalize;
    color: var(--psa-white)
  }

  .menu-inner {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden
  }

  .submenu {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    min-width: auto;
    margin: 0;
    padding: 1rem;
    padding-top: 4rem;
    opacity: 1;
    overflow-y: auto;
    visibility: visible;
    box-shadow: none;
    transform: translateX(0%)
  }

  .submenu.is-active {
    display: block
  }

  .megamenu {
    position: absolute;
    display: none;
    top: 64px;
    left: 0;
    bottom: 0;
    width: 100%;
    height: auto;
    max-width: none;
    min-width: auto;
    margin: 0;
    padding: 1rem;
    opacity: 1;
    overflow-y: auto;
    visibility: visible;
    transform: translateX(0%);
    box-shadow: none
  }

  .submenu .col-md-4 {
    width: 100%;
    padding-bottom: var(--psa-padding-15);
    border-bottom: 1px solid #ddd;
    margin-bottom: 1.2rem
  }

  .submenu .col-md-4:last-child {
    border: 0
  }

  .overlay.is-active {
    opacity: 1;
    visibility: visible
  }

  .burger {
    opacity: 1;
    visibility: visible
  }

  .mobile .social-media img {
    height: 32px
  }

  .mobile .social-media {
    margin-bottom: 2.5rem
  }

  .mobile .social-media a {
    padding: 0 .5rem
  }

  li.menu-item {
    padding: 0 .5rem
  }

  .navFooter {
    position: absolute;
    bottom: 1rem;
    width: 100%
  }

  .ms-srch-sb>input {
    width: calc(100% - 40px)
  }

  .search-input-group {
    width: 100%
  }

  .search.mobile {
    margin-bottom: 1.5rem
  }

  .languageSwitch a {
    border: 0;
    padding: 0 var(--psa-padding-15) 1rem 0;
    font-size: 20px;
    display: block;
    font-weight: 300
  }

  .languageSwitch a:hover {
    background: var(--psa-transparent);
    font-weight: 500
  }

  .languageSwitch.mobile {
    display: flex
  }

  .languageSwitch a.active {
    font-weight: 500
  }

  .search-icon img {
    width: 18px
  }

  li.menu-item.simple {
    position: initial
  }
}

@media(max-width:992px) and (min-width:591px) {
  .site-logos img {
    width: 95%
  }

  .site-logos {
    width: calc(100% - 100px)
  }
}

@media(max-width:1770px) and (min-width:992px) {
  nav .container-fluid {
    justify-content: center !important
  }

  .menu {
    text-align: center;
    justify-content: center;
    display: flex;
    margin-top: .5rem
  }
}

@media(max-width:1440px) {
  .container-fluid {
    padding-left: 24px;
    padding-right: 24px
  }

  .navbar-nav {
    padding-right: 0 !important
  }
}

@media (min-width:991px) and (max-width:1280px) {
  .megamenu-column-4 {
    width: calc(100% - 48px);
    left: 24px;
    right: 24px;
    transform: translate(0)
  }

  .navbar-nav {
    position: initial
  }
}

@media(max-width:375px) {
  .navbar-brand.site-logo img {
    height: 52px
  }
}

@media (min-width: 992px) {
  .menu {
    position: static;
    z-index: auto;
    flex-grow: 1;
    width: auto;
    visibility: visible !important;
    background-color: transparent !important;
    border: 0 !important;
    transform: none !important;
    transition: none
  }
}

@media only screen and (max-width: 450px) {
  .menu {
    width: 100%
  }
}

@media (max-height:700px) {
  .navFooter {
    position: initial;
    margin-top: 2rem
  }
}

/*main {
  min-height: 500px
}*/
footer {
  border-top: 3px var(--psa-border-solid) var(--psa-aladaam);
  padding: var(--psa-padding-15-y) 0;
  border-bottom: 1px var(--psa-border-dashed) var(--psa-black-a8);
  margin-top: 1.5rem;
  margin-bottom: 1.5rem
}

.quick-links-listitem {
  padding: .5rem 1rem
}

.quick-links-listitem a {
  color: var(--psa-black-28);
  text-decoration: none
}

.link-hover-line a {
  position: relative
}

.link-hover-line a:after {
  content: '';
  background: var(--psa-aladaam);
  width: 0;
  display: block;
  height: 2px;
  position: absolute;
  transition: all .35s ease-in
}

.link-hover-line a:hover:after {
  width: 100%
}

.downloadApp-wrapper {
  background: var(--psa-white-f8);
  padding: var(--psa-padding-15);
  border-radius: 30px 0
}

.subTitle {
  font-size: 18px
}

.downloadApp-links {
  display: flex;
  align-items: center;
  padding-bottom: 1rem;
  margin-bottom: var(--psa-padding-15);
  border-bottom: 1px var(--psa-border-dashed) var(--psa-black-88);
  flex-wrap: wrap
}

.appStoreBtn {
  padding-right: 1rem;
  margin-bottom: .5rem
}

.accredition-logos img {
  width: 100%
}

.accredition-logos {
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.al-logo {
  padding-right: var(--psa-padding-15);
  margin-bottom: .5rem
}

.accredition-logos a {
  height: 48px;
  width: 48px;
  display: block;
  transition: all .25s ease-in
}

.accredition-logos a:hover {
  transform: scale(1.2);
  display: block
}

.privacy-terms {
  display: flex;
  align-items: center;
  justify-content: flex-end
}

.privacy-terms-item {
  padding: 0 1rem
}

.copyright {
  padding-bottom: 24px
}

.privacy-terms-item a {
  color: var(--psa-black-48);
  text-decoration: none
}

.footer-title {
  font-family: var(--psa-primary-font);
  font-size: 22px;
  font-weight: 500;
  margin-bottom: .25rem
}

@media (min-width:835px) and (max-width: 1280px) {
  .downloadApp {
    flex: 0 0 auto;
    width: 41.66666667%
  }

  .portal-links {
    flex: 0 0 auto;
    width: 33.33333333%
  }
}

@media(min-width:500px) and (max-width:835px) {

  .quick-links,
  .portal-links {
    flex: 0 0 50%;
    width: 50%
  }

  .downloadApp {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 1rem
  }
}

@media(max-width:992px) {
  .copyright {
    text-align: center
  }

  .privacy-terms {
    justify-content: center;
    margin-top: 1rem
  }

  .pm-image {
    order: 1
  }

  .pm-content {
    order: 2
  }
}

@media(max-width:500px) {

  .quick-links,
  .portal-links {
    flex: 0 0 100%;
    width: 100%
  }

  .portal-links {
    margin-top: var(--psa-padding-15)
  }
}

@media(max-width:1280px) {
  .quick-links-listitem {
    flex: 0 0 100%
  }
}

#s4-bodyContainer {
  padding-bottom: 0
}

.flex-center {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding-left: 30px;
  padding-right: 30px
}

.flex-start {
  display: flex;
  align-items: center
}

.primary-bg {
  background-color: var(--psa-aladaam);
  color: var(--psa-white)
}

.primary-text {
  color: var(--psa-aladaam) !important
}

.secondary-bg {
  background-color: var(--psa-dune);
  color: var(--psa-white)
}

.secondaryblue-bg {
  background-color: var(--psa-skyline);
  color: var(--psa-white)
}

.flex-center-col {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column
}

.searchInputGroup {
  width: 800px
}

.input-group-text.hpSearch {
  background: var(--psa-white) url(../../images/search-slim-icon.svg) no-repeat 50%;
  height: 32px;
  width: 32px;
  border: 0
}

.searchTags ul {
  padding: 0;
  margin: 0
}

.searchTags ul li {
  padding: 1rem 0 0;
  margin: 0;
  list-style-type: none
}

.searchTags ul li a {
  color: var(--psa-white);
  padding: .25rem 1rem;
  display: flex
}

.searchTags ul li a:hover {
  background: var(--psa-white);
  color: var(--psa-aladaam)
}

.searchInputGroup .form-control {
  border: 0;
  background: var(--psa-white);
  padding: .45rem .75rem
}

.searchInputGroup .form-control:focus {
  box-shadow: none
}

.hpSearch::after {
  content: '';
  height: 20px;
  background: #ddd;
  width: 1px;
  display: block;
  position: absolute;
  right: -3px;
  z-index: 9
}

.mb-40 {
  margin-bottom: 40px
}

@media(max-width:850px) {
  .searchInputGroup {
    width: 100%
  }
}

.white-f8-bg {
  background: var(--psa-white-f8)
}

.sno-wrapper {
  background: #a29475de;
  padding: 2rem 80px
}

.card {
  height: calc(100% - 1.4rem);
  margin-bottom: 1.4rem
}

.card.flat-type {
  border: none;
  border-radius: 0;
  padding: 2rem 1.5rem;
  height: 100%
}

a.card.flat-type:hover {
  transform: scale(.97)
}

.primaryBtn {
  background: var(--psa-aladaam);
  color: var(--psa-white) !important;
  padding: .45rem 1rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid transparent;
  font-family: var(--psa-primary-font)
}

.primaryBtn:hover {
  background: var(--psa-white-ef);
  color: var(--psa-aladaam) !important;
  border-color: var(--psa-black-dd);
  transform: scale(1.02)
}

.secondaryBtn {
  background: var(--psa-dune);
  color: var(--psa-white) !important;
  padding: .45rem 1rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--psa-dune);
  font-family: var(--psa-primary-font)
}

.secondaryBtn:hover {
  background: var(--psa-white);
  color: var(--psa-dunedark) !important;
  border-color: var(--psa-black-dd);
  transform: scale(1.02)
}

.primaryBtn:hover .explore-more-icon,
.secondaryBtn:hover .explore-more-icon {
  background: url(../../images/exploremore-arrow.svg) no-repeat 50%
}

.explore-more-icon {
  background: url(../../images/exploremore-arrow-w.svg) no-repeat 50%;
  height: 24px;
  width: 24px;
  display: flex;
  margin-left: .5rem;
  transform: rotate(0deg)
}

.whiteBtn {
  background: var(--psa-white);
  color: var(--psa-aladaam) !important;
  padding: .45rem 1rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--psa-white);
  font-family: var(--psa-primary-font)
}

.whiteBtn:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white) !important;
  border-color: var(--psa-white);
  transform: scale(1.02)
}

.whiteBtn .explore-more-icon {
  background: url(../../images/exploremore-arrow.svg) no-repeat 50%
}

.whiteBtn:hover .explore-more-icon {
  background: url(../../images/exploremore-arrow-w.svg) no-repeat 50%
}

.card-numbers {
  font-family: var(--psa-primary-font);
  font-size: 32px;
  font-weight: 500;
  position: relative
}

.card-icon {
  margin-bottom: .5rem
}

.indicator-name {
  color: var(--psa-aladaam);
  font-family: var(--psa-primary-font);
  font-size: 20px
}

.indicator-month {
  color: var(--psa-black-28)
}

.card-numbers:after,
.data-values:after {
  font-size: 13px;
  position: absolute;
  width1: 100%;
  margin-left: .35rem;
  top: 6px
}

.billionQR::after {
  content: 'Billion QR'
}

.individuals::after {
  content: 'Individuals'
}

.points::after {
  content: 'Points'
}

.card-content {
  position: relative;
  padding-left: 1.4rem
}

.card-content:before {
  background: url(../../images/card-dotted-bg.svg) no-repeat 50%;
  height: 47px;
  width: 13px;
  display: inline-block;
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%)
}

@media (min-width: 1200px) {
  .column-5 {
    flex: 0 0 auto;
    width: 20%;
    margin-bottom: 1.5rem
  }
}

@media (max-width: 1199px) {
  .column-5 {
    flex: 0 0 auto;
    width: 33.3333%;
    margin-bottom: 1.5rem
  }

  .our-ambitions-list .column-5 {
    width: 50%
  }
}

@media (max-width: 768px) {
  .column-5 {
    flex: 0 0 auto;
    width: 50%
  }

  .our-ambitions-list .column-5 {
    width: 100%
  }
}

@media (max-width: 560px) {
  .column-5 {
    flex: 0 0 auto;
    width: 100%
  }
}

.nds-qnv-bg {
  background: url(../../images/doha-1.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 650px
}

.nds-qnv-content {
  margin-top: -20rem
}

.nds-qnv-seperator:before {
  content: '';
  background: var(--psa-black-a8);
  height: 100%;
  width: 1px;
  display: block;
  position: absolute;
  left: 50%;
  z-index: 5
}

.nds-qnv-seperator img {
  z-index: 99;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.nds-qnv-seperator {
  position: relative
}

@media(max-width:767px) {
  .nds-qnv-seperator:before {
    height: 1px;
    width: 100%;
    left: 0
  }

  .nds-qnv-seperator {
    padding-top: 4rem;
    padding-bottom: 4rem
  }
}

.tag {
  background: var(--psa-aladaam);
  display: inline-flex;
  color: var(--psa-white);
  padding: .05rem .5rem .15rem;
  border-radius: 3px;
  margin-bottom: .35rem;
  font-size: 13px
}

.mainNews {
  margin-bottom: 1.25rem;
  border-bottom: 1px dashed var(--psa-black-c8);
  padding-bottom: 1.25rem
}

.news-list .news-content {
  padding-bottom: 1.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px dashed var(--psa-black-c8)
}

.news .tag {
  background: var(--psa-dunedark)
}

.news-content a {
  color: var(--psa-dunedark);
  text-decoration: underline !important
}

.news-content p {
  font-size: 15px
}

.news-list .news-content:last-child {
  border: 0;
  padding-bottom: 0;
  margin-bottom: 0
}

.icon-24 {
  height: 24px;
  width: 24px;
  display: flex;
  margin-right: .35rem
}

.icon-24.right {
  margin-left: .35rem;
  margin-right: 0
}

.hp-news-date {
  font-size: 15px
}

.calendar-io {
  background: url(../../images/news-calendar-icon.svg)
}

.news-content h3 a {
  color: var(--psa-black-28);
  text-decoration: none !important;
  font-size: 20px
}

.news-content h3 a:hover {
  text-decoration: underline !important
}

@media(max-width:1600px) {
  .news-image {
    margin-bottom: 1rem
  }
}

@media(max-width:992px) {
  .mainNews .news-content {
    border: 0;
    padding-bottom: 0;
    margin-bottom: 0
  }

  .news-content {
    padding-bottom: 1.25rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px dashed var(--psa-black-c8)
  }

  .news-image-col,
  .news-content-col {
    width: 50%
  }
}

@media(max-width:767px) {

  .news-image-col,
  .news-content-col {
    width: 100%
  }
}

.section-heading h1 {
  margin-bottom: 0;
  line-height: 40px;
  width: 100%
}

.qms-month {
  background: var(--psa-skyline);
  display: inline-block;
  padding: .15rem 1rem;
  color: var(--psa-white);
  margin-top: .5rem;
  margin-bottom: 1rem
}

.btnGroup .primaryBtn {
  margin-right: .5rem;
  justify-content: space-between
}

.card.dahsed {
  border: 1px dashed var(--psa-black-c8);
  padding: 1rem
}

.flex-space {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.qms-icon {
  margin-right: 1rem
}

.qms-data-group .data {
  margin-right: 1rem;
  margin-left: 1rem
}

.qms-data-group .data:last-child {
  margin-right: 0
}

.tac-qms .qms-data-group {
  width: calc(100% - 130px);
  align-items: flex-start
}

.tac-qms .qms-data-group .data {
  width: 33.333333%;
  padding-left: 12px;
  padding-right: 12px;
  margin: 0
}

@media(max-width:991px) {
  .tac-qms .qms-data-group .data {
    width: 33.333333%;
    margin-bottom: 0
  }
}

@media(max-width:1300px) and (max-width:680px) {
  .tac-qms .qms-data-group .data {
    width: 50%;
    margin-bottom: 1rem
  }
}

@media(max-width:480px) {
  .tac-qms .qms-data-group .data {
    width: 100%;
    margin-bottom: 1rem
  }

  .tac-qms {
    flex-direction: column
  }

  .tac-qms .qms-data-group {
    width: 100%
  }
}

@media(max-width:767px) {
  .qms-content.flex-start {
    justify-content1: center
  }
}

.data-title {
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.data-values {
  color: var(--psa-aladaam);
  font-family: var(--psa-primary-font);
  font-size: calc(1rem + .65vw);
  position: relative
}

.align-flex-start {
  align-items: flex-start
}

.lh-30 {
  line-height: 30px
}

.data-difference {
  display: flex;
  align-items: center;
  font-family: var(--psa-primary-font);
  font-weight: 500;
  font-size: 20px !important
}

.diff-arrow:after {
  content: '';
  height: 16px;
  width: 16px;
  display: flex;
  margin-left: .35rem;
  margin-bottom: .2rem
}

.increased:after {
  background: url(../../images/qms/increased-arrow.svg)
}

.decreased:after {
  background: url(../../images/qms/decreased-arrow.svg)
}

.data-difference.increased {
  color: var(--psa-positive)
}

.data-difference.decreased {
  color: var(--psa-negative)
}

a.card.dahsed:hover {
  transform: scale(1.025)
}

@media (min-width: 1360px) {
  .column-3 {
    flex: 0 0 auto;
    width: 25%;
    margin-bottom: 1rem
  }
}

@media (max-width: 1359px) {
  .column-3 {
    flex: 0 0 auto;
    width: 33.3333%;
    margin-bottom: 1.5rem
  }
}

@media (max-width: 1024px) {
  .column-3 {
    flex: 0 0 auto;
    width: 50%
  }
}

@media (max-width: 560px) {
  .column-3 {
    flex: 0 0 auto;
    width: 100%
  }
}

#hpBanner {
  margin-top: 1rem
}

#hpBanner .carousel-control-prev,
#hpBanner .carousel-control-next {
  width: auto
}

#hpBanner .carousel-control-prev {
  left: 24px
}

#hpBanner .carousel-control-next {
  right: 24px
}

#hpBanner .carousel-indicators {
  position: initial;
  margin: 0
}

#hpBanner .carousel-indicators [data-bs-target] {
  background-color: var(--psa-black-dd);
  opacity: 1;
  width: 33.333333%
}

#hpBanner .carousel-indicators .active {
  background-color: var(--psa-aladaam)
}

.bannerItem {
  height: 350px;
  padding-left: 2px;
  padding-right: 2px
}

.bannerItem a {
  overflow: hidden
}

.hp-calendar-icon {
  width: 64px
}

.period-from {
  font-size: 20px;
  line-height: 24px
}

.opd-group {
  font-family: var(--psa-primary-font);
  margin-left: .5rem
}

.card.solid {
  border: 1px solid var(--psa-black-dd);
  padding: 1rem;
  color: var(--psa-black-28)
}

a.bi-firstChild {
  display: flex;
  justify-content: space-between;
  padding: 2rem 1.5rem !important
}

.bannerItem h1 {
  padding-top: 1rem
}

a.bi-firstChild h2 {
  font-weight: 500;
  margin-bottom: 0;
  font-size: 24px
}

.bi-firstChild h1,
.bi-firstChild h2,
.bi-firstChild h3,
.bi-firstChild h4 {
  color: var(--psa-white) !important
}

.explore-banner {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 1rem
}

.explore-text {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  padding-right: .5rem
}

.arrow-right-circled {
  background: url(../../images/arrow-right-circled.svg);
  transform: rotate(0)
}

.opd-qms-list .section-heading {
  width: 160px
}

.opd-qms-icons {
  width: calc(100% - 160px)
}

.primary-bg h1,
.primary-bg h2,
.primary-bg p,
.primary-bg div,
.secondaryblue-bg h1,
.secondaryblue-bg h2,
.secondaryblue-bg p,
.secondaryblue-bg div,
.secondary-bg h1,
.secondary-bg h2,
.secondary-bg p,
.secondary-bg div {
  color: var(--psa-white) !important
}

.mapBuilder {
  background-image: url(../../images/explore-catalog-img.png);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover
}

.mapBuilder-caption {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, .7);
  width: 100%;
  padding: .5rem;
  text-align: center;
  color: var(--psa-white)
}

.mapBuilder-caption h2 {
  margin: 0;
  color: var(--psa-white) !important
}

.primary-font {
  font-family: var(--psa-primary-font)
}

.fs-24 {
  font-size: 24px
}

.building-icon {
  margin-right: 1.5rem
}

.hp-pbi {
  text-align: center;
  margin: 2rem
}

.pbi-heading {
  font-family: var(--psa-primary-font);
  font-size: 34px;
  line-height: 36px;
  margin-top: 1rem
}

.pbi-subtitle {
  font-size: 28px
}

.hp-census-pop h2 {
  margin: 0
}

.hpCensusDate {
  background: var(--psa-white);
  color: var(--psa-black-28);
  padding: .25rem .5rem;
  margin-left: .35rem
}

.pop-month {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.pop-month h2 {
  margin: 0
}

.pop-month p {
  margin-bottom: 0
}

.secondaryblue-bg h1,
.secondaryblue-bg h2,
.secondaryblue-bg h3,
.secondaryblue-bg h4 {
  color: var(--psa-white) !important
}

.hp-total-population {
  font-size: calc(5.5rem + 1.1vw);
  font-family: var(--psa-primary-font);
  line-height: 148px
}

.hp-census-pop {
  display: flex;
  height: 100%;
  justify-content: center
}

.hp-total-population:after {
  width: 1px;
  background: var(--psa-black-c8);
  height: 100px;
  display: inline-block;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%)
}

.mf-pop label {
  color: var(--psa-white);
  text-transform: uppercase;
  font-size: 18px
}

.mf-pop {
  padding-right: 2rem
}

.hp-census-value {
  font-size: 30px;
  color: var(--psa-aladaam);
  line-height: 30px;
  font-family: var(--psa-primary-font)
}

.hp-speaker-content {
  padding: 1rem
}

.hp-name-title,
.hp-name {
  font-size: 22px;
  font-family: var(--psa-primary-font);
  line-height: 26px
}

.hp-designation {
  font-size: 15px;
  font-weight: 300
}

.events-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%
}

.events-caption h2 {
  width: 100px
}

.partners-logo-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center
}

.partner-logo-item {
  width: calc(100%/3);
  padding: 1rem
}

@media(max-width:1280px) and (min-width:1025px) {
  .bannerItem h1 {
    padding-top: 0;
    font-size: 30px;
    line-height: 36px
  }

  .bannerItem h2 {
    font-size: 24px
  }

  .opd-qms-list.flex-space {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center
  }

  .opd-qms-list .section-heading {
    width: 100%
  }

  .opd-qms-icons {
    width: calc(100% - 89px)
  }
}

@media (max-width: 1024px) {
  #hpBanner .col-md-12 {
    flex: 0 0 auto;
    width: 100%
  }

  #hpBanner .col-md-6 {
    flex: 0 0 auto;
    width: 50%
  }

  .period-from {
    font-size: 18px;
    line-height: 22px
  }
}

@media (min-width: 1024px) {
  .month-range {
    font-size: 24px
  }
}

@media(max-width:1600px) {
  .hp-total-population {
    font-size: calc(8rem + 1.5vw)
  }

  .hp-census-list .col-md-12 {
    flex: 0 0 auto;
    width: 100%
  }

  .hp-total-population:after {
    display: none
  }
}

input[type=button]:hover,
input[type=reset]:hover,
input[type=submit]:hover,
button:hover {
  background: inherit;
  border-color: inherit
}

input[type=button],
input[type=reset],
input[type=submit],
button {
  min-width: 1px
}

@media(max-width:767px) {
  .bannerItem {
    height: auto
  }

  .bannerItem:nth-child(2),
  .bannerItem:nth-child(3) {
    display: none
  }

  .opd-catalog-list.flex-center {
    padding-left: 0;
    padding-right: 0
  }

  .opd-catalog-item {
    padding-bottom: 1rem
  }

  .bannerItem h1 {
    margin-top: 0
  }

  .hp-total-population:after {
    display: none
  }

  .hp-total-population {
    font-size: calc(4rem + 1vw);
    line-height: 100px
  }
}

@media (min-width:1245px) and (max-width:1600px) {
  .hp-total-population {
    font-size: calc(4rem + 1.5vw);
    line-height: 110px
  }

  .hp-pbi-icon img {
    width: 68px
  }
}

@media (min-width:1025px) and (max-width:1244px) {
  .hp-total-population {
    font-size: calc(6rem + 1.5vw)
  }

  .hp-census-list.flex-center {
    flex-direction: column;
    align-items: flex-start
  }

  .hp-census-list .col-md-7 {
    width: 100%
  }

  #bannerBlock3 .col-lg-5 {
    width: 100%
  }
}

@media (min-width:767px) and (max-width:1023px) {
  .hp-total-population {
    font-size: calc(6rem + 1.5vw)
  }
}

@media (max-width:767px) {
  .hp-census-pop {
    align-items: center
  }

  .hp-census-list,
  .hp-census-pop .section-heading {
    text-align: center
  }

  .hp-census-list .flex-start {
    align-items: center;
    justify-content: center
  }

  .mf-pop {
    padding: 0 1rem
  }
}

@media(max-width:520px) {
  .partner-logo-item {
    width: calc(100%/2)
  }
}

@media (max-width:375px) {
  .hp-total-population {
    font-size: 3.5rem;
    line-height: 100px
  }

  .partner-logo-item {
    width: calc(100%/1)
  }

  .hp-census-pop {
    padding: 0 !important
  }
}

@media (max-width:1440px) {
  #hpBanner .carousel-control-prev {
    left: 0
  }

  #hpBanner .carousel-control-next {
    right: 0
  }

  #hpBanner .carousel-control-prev,
  #hpBanner .carousel-control-next {
    width: 24px
  }
}

.ms-rtestate-field p,
p.ms-rteElement-P {
  margin: 0 0 15px;
  line-height: inherit
}

.nds-intro-img {
  text-align: center;
  margin-bottom: 24px
}

.pattern-white {
  background: url(../../images/pattern-white.png) no-repeat 50%
}

.designation {
  background: var(--psa-aladaam);
  display: inline;
  color: var(--psa-white);
  padding: .15rem 1rem;
  font-size: 20px
}

.content-section {
  padding-top: 2rem
}

.blockquote {
  background: var(--psa-white);
  color: var(--psa-black-28);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 2rem;
  margin: 1.5rem 0;
  border: 1px solid var(--psa-dune);
  border-left-width: 4px
}

.blockquote-content {
  position: relative;
  width: 85%
}

.blockquote-content p {
  margin: 0;
  font-family: var(--psa-primary-font);
  font-size: 39px;
  font-weight: 400;
  line-height: 46px;
  text-align: center
}

.blockquote-content:before,
.blockquote-content:after {
  display: block;
  height: 64px;
  width: 70px;
  position: absolute
}

.blockquote-content:before {
  background: url(../../images/quote-left.svg) no-repeat;
  left: -72px;
  top: -15px
}

.blockquote-content:after {
  background: url(../../images/quote-right.svg) no-repeat;
  right: -43px;
  bottom: -24px
}

.our-ambitions-item {
  padding: 1rem;
  height: calc(100% - 15px)
}

.white-bg {
  background: var(--psa-white)
}

.underlined {
  position: relative
}

.underlined:after {
  content: '';
  background: var(--psa-aladaam);
  height: 2px;
  width: 75px;
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%)
}

.our-priorities h1.underlined {
  margin-bottom: 2rem
}

.our-priorities h3 {
  color: var(--psa-black-28)
}

.our-priorities .card-icon {
  margin-bottom: 1rem
}

.our-priority-col {
  width: 45%
}

.our-priorities .nds-qnv-seperator {
  width: 10%
}

.box-container {
  align-items: center;
  display: flex;
  justify-content: space-around;
  padding: 0;
  width: 100%;
  flex-wrap: wrap
}

.flip-box-front.nds-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--psa-aladaam)
}

.flip-box-front.nds-logo .card-img {
  text-align: center
}

@media screen and (min-width:1380px) {
  .box-container {
    flex-direction: row
  }
}

a.box-item {
  position: relative;
  -webkit-backface-visibility: hidden;
  width: calc(33.333333% - 24px);
  margin: 12px;
  max-width: 100%
}

.flip-box {
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  perspective: 1000px;
  -webkit-perspective: 1000px;
  overflow: hidden
}

.flip-box-front,
.flip-box-back {
  background-size: cover;
  background-position: center;
  border-radius: 0;
  min-height: 200px;
  -ms-transition: transform .7s cubic-bezier(.4, .2, .2, 1);
  transition: transform .7s cubic-bezier(.4, .2, .2, 1);
  -webkit-transition: transform .7s cubic-bezier(.4, .2, .2, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

.flip-box-front {
  background: var(--psa-white);
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: translateY(0);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  padding: 1rem
}

.flip-box:hover .flip-box-front {
  -ms-transform: rotateY(-180deg);
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d
}

.flip-box-back {
  background: var(--psa-aladaam);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  -ms-transform: rotateY(180deg);
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  overflow: hidden
}

.flip-box:hover .flip-box-back {
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d
}

.flip-box .inner {
  position: absolute;
  left: 0;
  width: 100%;
  outline: 1px solid transparent;
  -webkit-perspective: inherit;
  perspective: inherit;
  z-index: 2;
  transform: translateY(-50%) translateZ(60px) scale(.94);
  -webkit-transform: translateY(-50%) translateZ(60px) scale(.94);
  -ms-transform: translateY(-50%) translateZ(60px) scale(.94);
  top: 50%;
  padding: 1rem
}

.animated-box {
  position: relative;
  display: flex;
  color: var(--psa-white);
  font-size: 20px;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  transition: .3s;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: var(--psa-dune);
  font-family: var(--psa-primary-font);
  height: calc(100% - 24px);
  padding: 3rem
}

.animated-box::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: var(--psa-aladaam);
  transition: transform .3s;
  z-index: 9
}

.anime-skew {
  overflow: hidden
}

.anime-skew::before {
  left: -5%;
  right: auto;
  bottom: auto;
  width: 110%;
  height: 180%;
  transform-origin: left bottom;
  transform: skewY(-10deg) scale(1, 0)
}

.anime-skew:hover::before {
  transform-origin: left top;
  transform: skewY(-10deg) scale(1, 1)
}

.oa-icon {
  display: block;
  height: 48px;
  width: 48px
}

.target {
  background: url(../../images/target-alt.svg)
}

.animated-box:hover .our-ambition-wrapper {
  z-index: 99
}

.icon-box {
  border: 1px solid var(--psa-black-d8);
  padding: 2rem 2rem 1rem;
  height: calc(100% - 24px);
  margin-bottom: 24px
}

.rv-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 30px;
  border-radius: 1.5rem 0;
  background: #f1f6f7
}

.rv-img-right img {
  width: 100%;
  border-radius: 100rem 0 10rem 10rem
}

.rv-img-left img {
  width: 100%;
  border-radius: 10rem 10rem 100rem 0
}

.rv-desc {
  font-size: 16px;
  line-height: 26px;
  padding-bottom: 20px
}

.rv-play a {
  background: #006c80;
  color: #fff;
  padding: 10px 20px 10px 15px;
  border-radius: 50px;
  font-size: 16px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  text-transform: uppercase
}

.rv-play a .fa-play-circle {
  font-size: 32px;
  margin-right: 10px
}

.rv-play a:hover {
  text-decoration: none !important;
  background: #9e6826
}

.rd-list-item .front img {
  width: 100%
}

.video-wrapper {
  background: url(../../images/video-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50%;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center
}

.video-wrapper a img {
  width: 80px
}

.video-wrapper a:hover {
  opacity: .8
}

.prime-minister-photo {
  text-align: center
}

.our-ambitions-item h5 {
  color: var(--psa-white);
  font-size: 24px
}

.our-ambitions-item .card-numbers {
  padding-top: 1rem;
  line-height: 35px;
  font-size: 36px
}

.sno-content {
  margin-top: -24rem;
  padding: 0
}

.sno-desc {
  text-align: center;
  padding: 1rem;
  font-size: 18px;
  color: var(--psa-black-28)
}

.sno-content p,
.sno-content h5 {
  color: var(--psa-black-28)
}

.color-white p,
.color-white h3,
.color-white h2 {
  color: var(--psa-white)
}

ul.sno-list {
  padding: 0;
  margin: 0 0 1rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  text-align: left;
  width: 50%;
  margin: 0 auto
}

ul.sno-list li {
  width: calc(25% - .5rem);
  font-size: 20px;
  color: var(--psa-white);
  font-family: var(--psa-primary-font);
  line-height: 22px;
  background: var(--psa-aladaam);
  margin: .25rem .25rem 2rem;
  padding: .5rem;
  text-align: center
}

.zoomD-area {
  position: relative;
  z-index: 1;
  width: 100%;
  overflow: hidden;
  margin-top: 3rem
}

.zoomDItem {
  padding: 0 15px;
  width: 80px;
  overflow: hidden;
  float: left;
  position: relative;
  transition: .3s ease
}

.zoomDItemTitle {
  position: absolute;
  left: 40px;
  z-index: 1;
  width: 670px;
  color: #fff !important;
  transform: rotate(-90deg);
  transform-origin: left;
  text-align: center;
  margin: 0 auto;
  top: 621px;
  height: 80px;
  line-height: 80px !important;
  background: rgba(0, 0, 0, .3);
  cursor: pointer;
  font-size: 30px
}

.zoomD-content {
  border: 1px solid var(--psa-dune);
  padding: 2rem 3rem;
  height: calc(100% - 24px);
  border-radius: .5rem;
  background: rgba(255, 255, 255, .9);
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 24px;
  justify-content: center;
  text-align: center
}

.zoomDItem.active {
  background: #fff;
  width: calc(100% - 3 * 80px)
}

.zoomDItem.active .zoomD-detail {
  width: 100%
}

.zoomDItem.active .zoomD-img {
  max-width: 415px
}

.zoomDItem.active .zoomD-detail .row .col:first-child {
  max-width: 30% !important
}

.zoomDslide:after {
  content: "";
  clear: both;
  display: block
}

.zoomDItemTitle.hide {
  display: none
}

.zoomDItem.active .zoomD-content {
  transition: .3s ease;
  opacity: 1
}

.col.zoomD-content-row {
  min-height: 670px;
  overflow-y: auto;
  padding: 1rem
}

.zoomD-list {
  flex-basis: 33.333333%
}

.zoomDslide {
  height: 670px;
  overflow: hidden;
  margin: 2rem 0
}

@media (max-width: 1280px) {
  .zoomDItem.active .zoomD-content {
    margin-left: 0
  }

  h4.zoomDItemTitle {
    height: auto;
    line-height: 50px;
    top: 94%;
    text-align: left;
    padding-left: 15px;
    position: relative;
    transform: rotate(0);
    border-bottom: 1px solid var(--psa-white);
    width: 100%;
    left: 0;
    background: var(--psa-dune)
  }

  .zoomDItem {
    width: 100%
  }

  .zoomD-detail {
    width: 100%;
    max-height: unset;
    display: none
  }

  .zoomDItemTitle.hide {
    background: var(--psa-aladaam);
    display: block
  }

  .zoomDItem.active .zoomD-detail {
    width: 100%;
    display: block
  }

  .zoomDItem.active .zoomD-detail .row .col:first-child {
    max-width: 50% !important
  }

  .zoomDItem.active {
    width: 100%
  }

  .zoomDslide {
    height: auto
  }

  .zoomDItem.active .zoomD-detail .row .col:first-child {
    max-width: 30% !important
  }

  .zoomD-list {
    flex-basis: 50%
  }

  .zoomDItem.active .zoomD-detail {
    margin-top: 1rem
  }
}

@media (max-width: 574px) {
  .zoomDItem.active .zoomD-detail .row {
    display: block
  }

  .zoomDItem.active .zoomD-detail .row .col {
    max-width: 100% !important
  }

  .zoomD-content {
    transform: translate(0);
    margin-bottom: 24px;
    padding: 2rem;
    height: auto
  }

  .zoomDItem.active .zoomD-detail .row .col:first-child {
    max-width: 100% !important
  }

  .zoomD-list {
    flex-basis: 100%
  }
}

@media(max-width:1640px) {
  a.box-item {
    width: calc(33.333333% - 24px)
  }
}

@media(max-width:1340px) {
  a.box-item {
    width: calc(50% - 24px)
  }
}

@media(max-width:767px) {
  a.box-item {
    width: 100%
  }

  .animated-box {
    padding: 3rem 1.5rem
  }
}

@media(max-width:567px) {
  a.box-item {
    width: 100%;
    margin: 12px 0
  }

  ul.sno-list li {
    width: 100%
  }
}

.tabs-block {
  display: flex;
  align-items: center;
  justify-content: center
}

.tabs {
  display: flex
}

.tab-list {
  background: var(--psa-black-48)
}

.tabs .tab-head {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 55px;
  background: var(--psa-black-48)
}

.tabs .tab-head li {
  display: block
}

.tabs .tab-head li:not(:last-child) {
  border-bottom: 1px solid var(--psa-black-88)
}

.tabs .tab-head li a,
.tabs .tab-head li a:visited {
  display: flex;
  border-bottom: none;
  text-decoration: none;
  background-color: var(--psa-black-48);
  color: #fff;
  padding: 1rem;
  transition: all .2s ease-in-out;
  word-wrap: break-word;
  font-family: var(--psa-primary-font);
  font-size: 24px;
  font-weight: 300
}

.tabs .tab-head li a:hover,
.tabs .tab-head li a:focus,
.tabs .tab-head li a:active {
  border-bottom: none;
  outline: 0
}

.tabs .tab-head li a.active {
  background-color: var(--psa-aladaam);
  color: var(--psa-white)
}

.tabs .tab-head li a:hover:not(.active) {
  color: var(--psa-black-18);
  background: var(--psa-black-c8)
}

.tabs section {
  width: calc(100% - 55px);
  background-color: #fff;
  padding: 1rem;
  display: none;
  word-wrap: break-word;
  border-bottom: 6px solid var(--psa-black-48)
}

.tabs section>* {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.2s, transform .2s
}

.tabs section> :nth-child(1) {
  transition-delay: .2s
}

.tabs section> :nth-child(2) {
  transition-delay: .3s
}

.tabs section> :nth-child(3) {
  transition-delay: .4s
}

.tabs section> :nth-child(4) {
  transition-delay: .5s
}

.tabs section> :nth-child(5) {
  transition-delay: .6s
}

.tabs section> :nth-child(6) {
  transition-delay: .7s
}

.tabs section> :nth-child(7) {
  transition-delay: .8s
}

.tabs section> :nth-child(8) {
  transition-delay: .9s
}

.tabs section> :nth-child(9) {
  transition-delay: 1s
}

.tabs section> :nth-child(10) {
  transition-delay: 1.1s
}

.tabs section> :nth-child(11) {
  transition-delay: 1.2s
}

.tabs section> :nth-child(12) {
  transition-delay: 1.3s
}

.tabs section> :nth-child(13) {
  transition-delay: 1.4s
}

.tabs section> :nth-child(14) {
  transition-delay: 1.5s
}

.tabs section> :nth-child(15) {
  transition-delay: 1.6s
}

.tabs section> :nth-child(16) {
  transition-delay: 1.7s
}

.tabs section> :nth-child(17) {
  transition-delay: 1.8s
}

.tabs section> :nth-child(18) {
  transition-delay: 1.9s
}

.tabs section> :nth-child(19) {
  transition-delay: 2s
}

.tabs section> :nth-child(20) {
  transition-delay: 2.1s
}

.tabs section.active {
  display: block;
  background: var(--psa-white-f4)
}

.tabs section.active-content>* {
  opacity: 1;
  transform: translateY(0)
}

span.mobile-text {
  display: none
}

span.sno-icon-mobile {
  display: flex
}

@media (min-width: 786px) {
  .tabs .tab-head {
    width: 300px
  }

  .tabs .tab-head li a {
    flex-wrap: wrap
  }

  .tabs section {
    width: calc(100% - 300px);
    padding: 1rem
  }

  span.mobile-text {
    display: flex
  }

  span.sno-icon-mobile {
    display: none
  }
}

.card-box {
  padding: 1.5rem
}

.card-box.blue {
  background: var(--psa-skyline);
  color: var(--psa-white)
}

.card-box.blue h2,
.card-box.blue h3 {
  color: var(--psa-white)
}

.card-box ul {
  list-style: none;
  padding: 0;
  margin: 0
}

.card-box ul li {
  padding: .5rem;
  line-height: 25px;
  display: flex;
  font-size: 20px;
  padding: .5rem 0 .5rem 1.8rem;
  align-items: start
}

.card-box ul li:before {
  content: '';
  height: 24px;
  width: 24px;
  display: flex;
  margin-left: .5rem;
  position: absolute;
  left: 0
}

.card-box.blue ul li:before {
  background: url(../../images/flower-bullet-alt.svg) no-repeat center
}

.card-box.white ul li:before {
  background: url(../../images/flower-bullet.svg) no-repeat center
}

.card-box.white {
  background: var(--psa-white);
  color: var(--psa-black-48)
}

.full.grey.underlined:after {
  width: 100%;
  background: var(--psa-black-d8)
}

.outcome-title-box-wrapper {
  height: calc(100% - 24px)
}

.outcome-title-box {
  height: 100%;
  background: var(--psa-skyline);
  padding: 3rem 2rem;
  border-radius: 15px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between
}

.outcome-title-box h1 {
  color: var(--psa-white)
}

.arrow-left-64 {
  display: flex;
  justify-content: end
}

.image-box {
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: flex-start;
  position: relative;
  border-radius: 1rem;
  border: none;
  overflow: hidden;
  padding: 3rem;
  text-decoration: none;
  cursor: pointer;
  width: 100%;
  min-height: 500px;
  margin-bottom: 24px
}

.image-box-overlay {
  position: absolute;
  inset: 0;
  opacity: .75;
  background: linear-gradient(0deg, #1f2041 0%, rgba(31, 32, 65, 0.5) 50%, rgba(31, 32, 65, 0) 100%);
  z-index: 5
}

.image-box-thumbnail {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: all .2s ease-in
}

.oib-text {
  font-size: 24px;
  text-transform: none;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--psa-body-font);
  z-index: 10;
  transition: margin ease-in-out .12s;
  font-family: var(--psa-primary-font);
  line-height: 35px;
  line-height: 30px;
  margin-top: .5rem
}

.image-box:hover .image-box-thumbnail {
  transform: scale(1.1)
}

.section-body {
  margin-top: 2rem
}

.banner-title {
  text-shadow: 2px 2px var(--psa-black-48);
  text-align: center;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 3;
  width: 100%;
  font-family: var(--psa-primary-font);
  font-size: 2.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-top: 12.5rem
}

.banner-title span {
  font-size: 4.5rem;
  line-height: 5.5rem;
  display: block
}

.ndsmessage-box {
  width: 50%
}

.nds-message {
  display: flex;
  justify-content: end
}

.nds-message-container:hover {
  background-color: var(--psa-aladaam)
}

#s4-workspace {
  overflow-x: hidden
}

.service-box {
  padding: 2rem;
  text-align: center;
  transition: all .5s;
  background: var(--psa-dune);
  height: calc(100% - 24px)
}

.service-box .icon img {
  width: 48px;
  height: 48px
}

.service-box .icon {
  width: 80px;
  margin: 0 auto 4rem;
  text-align: center;
  border-radius: 50%;
  background-color: #fff;
  position: relative;
  top: 30px;
  z-index: 3;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center
}

.service-box .icon:before {
  transition: all .5s;
  content: " ";
  width: 100px;
  height: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background-color: var(--psa-white);
  opacity: .6;
  z-index: -1
}

.service-box:hover .icon:before {
  width: 140px;
  height: 140px
}

.service-box .img-in {
  position: relative;
  border-radius: 10px
}

.service-box .img-in img {
  width: 100%;
  height: auto;
  transition: all .5s;
  border-radius: 10px;
  -webkit-filter: grayscale(70%);
  filter: grayscale(70%)
}

.service-box:hover .img-in img {
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%)
}

.img-icon-box-content {
  padding: 0 20px
}

.service-box .title {
  font-size: 24px;
  font-weight: 500;
  margin: 20px auto;
  display: block;
  position: relative;
  color: var(--psa-white);
  font-family: 'Lusail'
}

.service-box .title:before {
  transition: all .5s;
  content: " ";
  display: block;
  position: absolute;
  bottom: -10px;
  height: 5px;
  border-radius: 15px;
  width: 0;
  margin: auto;
  background-color: var(--psa-white);
  opacity: 1;
  left: 0;
  right: 0
}

.service-box:hover .title:before {
  width: 100px
}

.service-box .wasf {
  font-size: 16px;
  font-weight: 500;
  color: var(--psa-white);
  margin-bottom: 10px
}

.service-box a.more {
  color: var(--psa-aladaam);
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 500
}

.seg-readmore {
  margin-top: 2rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  border-top: 1px dashed var(--psa-black-c8)
}

@-webkit-keyframes slide {
  100% {
    left: 0
  }
}

@keyframes slide {
  100% {
    left: 0
  }
}

@media(max-width:1600px) {
  ul.sno-list {
    width: 75%
  }
}

@media(max-width:1100px) {
  ul.sno-list {
    width: 100%
  }

  .nds-message-title {
    font-size: 34px;
    line-height: 40px;
    padding: 2rem
  }

  .ndsmessage-box {
    width: 100%
  }

  .nds-message-container {
    background-size: cover;
    background-position: center
  }

  .outcome-goals .our-ambitions-list {
    margin: -6.5rem 0 0
  }

  .outcome-goals .our-ambitions-list .col-lg-3 {
    width: 50%
  }

  .outcome-ambitions .col-md-12 {
    width: 100%
  }
}

@media(max-width:830px) {
  ul.sno-list li {
    width: calc(50% - 0.5rem);
    margin-bottom: .5rem
  }
}

@media(max-width:480px) {
  ul.sno-list li {
    width: 100%;
    margin-bottom: .5rem
  }

  .nds-message-title {
    font-size: 24px;
    line-height: 30px;
    padding: 2rem 1rem
  }
}

.white-ef-bg {
  background: var(--psa-white-ef)
}

.flip-box-front {
  margin-top: 0
}

.zoomD-content-row {
  justify-content: center;
  align-items: center;
  display: flex
}

.oa-wrapper {
  height: 100%;
  background: #fff;
  padding: 1.5rem
}

.tabs h3 {
  font-size: 3rem;
  margin-bottom: 0
}

.oa-wrapper ul {
  margin: 0;
  padding: 0;
  list-style: none
}

.oa-wrapper ul li {
  font-size: 22px;
  padding: .2rem 1.8rem;
  display: flex;
  align-items: center;
  position: relative;
  margin-bottom: 1rem
}

.oa-wrapper ul li:before {
  background: url(../../images/flower-bullet.svg);
  content: '';
  display: flex;
  width: 24px;
  height: 24px;
  position: absolute;
  left: 0
}

@media (max-width:991px) {
  .zoomD-img {
    margin-bottom: 2rem;
    height: 600px;
    overflow: hidden
  }
}

.pm-message {
  font-size: 26px;
  font-family: var(--psa-primary-font);
  text-align: center;
  line-height: 34px
}

.quoteby {
  margin-top: 2rem;
  text-align: center
}

.section-heading p {
  font-size: 18px;
  font-family: var(--psa-primary-font);
  font-weight: 300;
  line-height: 22px;
  margin-top: .5rem
}

a.box-item.seg-box {
  width: calc(100% - 24px)
}

.zoom-bg {
  background-image: url(../../images/EconomicPriorityClusters-bg.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover
}

.zoom-diverse {
  padding-bottom: 2rem
}

.nds-logo,
.expo-logo {
  position: relative;
  padding-left: 1.25rem
}

.dwnld-document {
  background: var(--psa-aladaam) url(../../images/dwnld-document-bg.svg);
  border-radius: .5rem;
  color: #fff;
  background-repeat: no-repeat;
  background-position: top right;
  background-size: auto
}

.dd-title {
  color: #FFF;
  font-family: Lusail;
  font-size: 44px;
  line-height: 55px;
  font-weight: 300;
  padding-top: .5rem
}

.dd-year {
  font-size: 28px;
  padding: .4rem .5rem .2rem;
  font-family: var(--psa-primary-font);
  line-height: 35px;
  display: inline
}

.dd-clickhere a {
  color: var(--psa-aladaam);
  background: var(--psa-white);
  padding: .5rem 1rem;
  border: 1px solid #fff
}

.dwnld-content {
  padding: 1rem 2rem
}

.dd-clickhere {
  margin-top: 1rem
}

.dd-clickhere a:hover {
  background: transparent;
  color: var(--psa-white)
}

.seg-content p {
  font-size: 20px;
  font-family: 'Lusail';
  font-weight: 300
}

.seg-content {
  margin-bottom: 3rem
}

.seg-inner {
  display: flex;
  align-items: center
}

.seg-icon-title {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 300px;
  position: relative
}

.seg-icon-title h2 {
  margin: 1rem
}

.seg-icon-title:after {
  content: '';
  background: url(../../images/seperator-primary.svg) no-repeat;
  height: 70px;
  width: 7px;
  display: block;
  position: absolute;
  top: 50%;
  right: -1rem;
  transform: translateY(-50%)
}

.seg-icon-content {
  padding: 0 3rem
}

.seg-flip {
  margin: 12px;
  min-height: 100px
}

.ms-srch-sb-border {
  border: 0
}

.ms-srch-sb {
  display: flex;
  flex-direction: row-reverse
}

.ms-srch-sb-border:hover,
.ms-srch-sb-borderFocused {
  border: 0
}

a.box-item:first-child {
  width: 100%
}

.nds-mobile-view,
.expo-mobile-view {
  display: none
}

.navbar-brand {
  padding: 0;
  margin: 0
}

.seperator-primary {
  background: url(../../images/seperator-primary.svg);
  height: 70px;
  width: 8px;
  display: flex;
  margin: .5rem;
  background-repeat: no-repeat;
  background-position: 50%
}

.logo-seperator {
  height: 40px;
  width: 2px;
  margin-left: 1.25rem;
  margin-right: 1.25rem;
  background: var(--psa-aladaam)
}

@media(min-width:991px) and (max-width:1150px) {
  .site-logos img {
    height: 58px
  }

  li.menu-item {
    padding: 0
  }

  a.navLink {
    font-size: 18px
  }

  .outcome-goals .our-ambitions-list .col-lg-3 {
    width: 50%
  }
}

@media(max-width:590px) {
  .site-logos {
    flex-direction: column;
    padding: .5rem 0
  }

  .seperator-primary,
  .navbar-brand.nds-logo,
  .navbar-brand.expo-logo,
  .logo-seperator {
    display: none
  }

  .navbar-brand.site-logo {
    margin-bottom: .5rem;
    text-align: center
  }

  .banner-title {
    font-size: 2rem;
    line-height: 2rem
  }

  .banner-title span {
    font-size: 3.5rem;
    line-height: 3.5rem
  }

  .nds-mobile-view .nds-logo img,
  .expo-mobile-view .expo-logo img {
    height: 60px
  }

  .nds-mobile-view,
  .expo-mobile-view {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: .5rem;
    border-top: 1px dashed var(--psa-dune);
    padding-top: .5rem
  }
}

@media(max-width:1024px) {
  .sno-wrapper {
    padding-left: 24px;
    padding-right: 24px
  }
}

.backtoHome {
  position: relative;
  display: inline-block;
  text-decoration: none;
  padding: 0 10px 10px 40px
}

.backtoHome h4 {
  color: #4A4F6A;
  font-size: 20px;
  transform: translateY(8px);
  transition: transform 500ms 0 cubic-bezier(0.2, 0, 0, 1);
  line-height: 20px;
  margin: 0
}

.backtoHome span {
  opacity: 0;
  color: var(--psa-black-88);
  font-size: 14px;
  font-weight: 300;
  display: inline-block;
  transform: translateY(10px);
  transition: transform 500ms 0 cubic-bezier(0.2, 0, 0, 1), opacity 500ms 0 cubic-bezier(0.2, 0, 0, 1)
}

.backtoHome div {
  top: 1px;
  left: 0;
  content: '';
  width: 30px;
  height: 30px;
  display: block;
  overflow: hidden;
  position: absolute;
  border-radius: 50%;
  transform: scale(1);
  background-color: #E9E7F2;
  transition: transform 400ms 0 cubic-bezier(0.2, 0, 0, 1.6)
}

.backtoHome div::after {
  top: 0;
  left: 0;
  content: '';
  width: 60px;
  height: 30px;
  position: absolute;
  background-position: 0 0;
  background-image: url(../../images/back2Home.svg);
  transition: transform 400ms 0 cubic-bezier(0.2, 0, 0, 1)
}

.backtoHome:hover h4 {
  color: #171922
}

.backtoHome:hover h4,
.backtoHome:hover span {
  opacity: 1;
  transform: translateY(0px)
}

.backtoHome:hover div {
  transform: scale(1.1);
  background-color: #fff;
  box-shadow: 0 2px 10px 0 rgba(185, 182, 198, 0.00), 0 1px 3px 0 rgba(175, 172, 189, 0.25)
}

.backtoHome:hover div::after {
  transform: translateX(-30px)
}

.sno-title-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 1rem;
  padding-bottom: 2rem
}

@media(max-width:767px) {
  .sno-title-section {
    flex-direction: column
  }
}

@media(max-width:786px) {
  .tab-body .column-5 {
    width: 100%;
    margin-bottom: 0
  }

  .outcome-goals h3 {
    padding: 2rem 0
  }

  .outcome-goals .our-ambitions-item {
    margin-bottom: 0
  }

  .tab-body .zoomD-list {
    flex-basis: 100%
  }
}

@media(max-width: 992px) {
  .blockquote-content p {
    font-size: 30px;
    line-height: 35px
  }

  .blockquote {
    padding: 1rem .5rem
  }

  .pm-content {
    padding: 1rem !important;
    margin-top: -6rem
  }

  .pm-content .content-section {
    padding-top: 0
  }

  .our-ambitions-list .column-5 {
    width: 100%;
    margin: 0
  }

  .banner-title span {
    font-size: 2.3rem;
    line-height: 2.7rem
  }

  .banner-title {
    padding: 0 2rem;
    bottom: 0;
    font-size: 1.5rem;
    height: auto
  }
}

@media(max-width:800px) {
  .our-ambitions-list .column-5 {
    width: 100% !important
  }
}

@media(max-width:350px) {
  .banner-title {
    top: 235px
  }
}

.ms-signInLink {
  display: none !important
}

@media(max-width:640px) {
  .bg-video-wrap {
    height: 450px;
    display: flex
  }

  video {
    display: none
  }

  .banner-title span {
    font-size: 2.5rem;
    line-height: 3rem
  }

  .video-overlay {
    display: none
  }

  .banner-title {
    font-size: 1.5rem;
    display: inline;
    top: 268px
  }

  .outcome-goals .our-ambitions-list .col-lg-3 {
    width: 100%
  }
}

@media(max-width:786px) {
  .tabs h3 {
    font-size: 2rem
  }

  .oa-wrapper ul li {
    font-size: 18px;
    line-height: 22px
  }

  .oa-wrapper {
    padding: .5rem
  }

  span.sno-icon-mobile img {
    width: 32px
  }

  .tabs .tab-head li a,
  .tabs .tab-head li a:visited {
    padding: .65rem
  }

  .section-heading p {
    font-size: 18px;
    line-height: 20px
  }

  .outcome-goals .our-ambitions-item h4 {
    font-size: 22px;
    line-height: 24px;
    margin-bottom: 0
  }

  .zoom-diverse {
    padding-bottom: 0
  }

  .zoom-diverse+div {
    padding: 0
  }

  .zoom-diverse>.col-md-12 {
    padding: 0
  }

  .card-box ul li {
    font-size: 18px
  }

  span.sno-icon-mobile img {
    width: 32px
  }
}

@media(max-width:850px) {
  .our-ambitions-list .col-sm-12 {
    width: 100% !important
  }
}

@media(max-width:1280px) {
  #ms-designer-ribbon {
    display: none
  }
}

.news-wrapper {
  position: relative
}

.newsBanner-bg {
  background-image: url(../../images/newsBanner-bg.png);
  min-height: 600px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.container.news-detail {
  background: var(--psa-white);
  margin-top: -23rem
}

.news-left {
  padding: 2rem
}

.news-heading {
  font-family: 'Lusail';
  border-bottom: 1px dashed var(--psa-dune);
  margin-bottom: 2rem
}

.newsType {
  text-align: center;
  font-size: 20px;
  color: var(--psa-aladaam);
  margin-bottom: 2rem;
  display: flex;
  align-items: center;
  justify-content: center
}

.newsType:before,
.newsType:after {
  content: '';
  background: var(--psa-black-48);
  height: 1px;
  width: 50px;
  display: flex;
  margin: 0 .75rem
}

.news-date {
  display: inline-flex;
  background: var(--psa-dune);
  color: var(--psa-white);
  padding: .6rem 1rem;
  border-radius: 3px;
  font-size: 18px;
  line-height: 18px;
  margin-bottom: 2rem
}

.news-byline p,
.news-byline {
  font-size: 24px;
  padding-bottom: 1.5rem;
  line-height: 30px
}

.news-byline ul {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0
}

.news-byline ul li {
  font-size: 25px;
  display: flex;
  align-items: center;
  line-height: 25px;
  padding-bottom: 1.25rem
}

.news-byline ul li:last-child {
  padding-bottom: 0
}

.news-byline ul li:before {
  content: '';
  width: 24px;
  height: 24px;
  background: url(../../images/listStyleType-1.svg);
  background-size: contain;
  margin-right: 10px;
  margin-top: -5px
}

.news-hashtags {
  padding-bottom: 1rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.news-hashtags a,
.news-hashtags span {
  background: var(--psa-skyline);
  color: var(--psa-white);
  font-family: 'Lusail';
  font-size: 18px;
  margin: 0 .5rem 1rem;
  padding: .5rem 1rem;
  line-height: 18px
}

.news-hashtags a:hover {
  background: var(--psa-white-ef);
  color: var(--psa-black-28)
}

.news-body p {
  font-size: 18px
}

.news-sub-content {
  padding: 1rem 0
}

.news-links {
  font-size: 20px;
  font-family: 'Lusail'
}

.news-links a {
  font-size: 22px;
  color: var(--psa-aladaam);
  display: inline;
  position: relative;
  transition: all .2s ease-in
}

.news-links a:hover:after {
  width: 100%;
  right: 0;
  left: auto
}

.news-links a:after {
  content: '';
  display: flex;
  height: 3px;
  width: 0;
  background: var(--psa-aladaam);
  position: absolute;
  left: 0;
  transition: all .2s ease-in
}

.related-news h2 {
  font-size: 26px
}

.related-news {
  padding-left: 12px;
  padding-right: 12px
}

.news-detail .related-news h3 {
  color: var(--psa-white)
}

.news-detail .related-news .tag {
  display: none
}

.news-detail .related-news .news-content h3 a {
  color: var(--psa-white)
}

.news-detail .related-news .calendar-io {
  background: url(../../images/news-calendar-icon-alt.svg)
}

.news-detail .related-news .primaryBtn {
  background: var(--psa-white);
  color: var(--psa-aladaam) !important;
  border-color: transparent;
  width: 100%;
  text-align: center;
  justify-content: center;
  margin-top: 1rem
}

.stats-flex {
  display: flex;
  align-items: start;
  position: relative
}

.stats-left-content {
  background-color: var(--psa-white-f8);
  padding: 1rem;
  border: 1px solid #E1E1E1;
  border-radius: 12px;
  box-shadow: 4px 4px 15px 0 rgba(0, 0, 0, .1);
  width: 380px
}

.slc-title,
.subject-title {
  font-size: 30px;
  font-family: var(--psa-primary-font)
}

.slc-title:after {
  content: '';
  background-color: var(--psa-aladaam);
  height: 2px;
  width: 50px;
  display: block;
  margin-top: -5px;
  border-radius: 5px
}

.stats-header {
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between
}

.closeLeftMenu span {
  height: 3px;
  width: 22px;
  background-color: #6D7983;
  display: block;
  border-radius: 10px
}

.closeLeftMenu span:nth-child(2) {
  width: 16px;
  margin-top: 4px;
  margin-bottom: 4px
}

.closeLeftMenu {
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: end;
  cursor: pointer
}

.closeLeftMenu span:nth-child(3) {
  width: 18px
}

.closeLeftMenu:hover span {
  width: 24px
}

.slc-accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 20px;
  color: var(--psa-black-48);
  text-align: left;
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  transition: var(--bs-accordion-transition);
  text-transform: uppercase;
  padding-top: 1rem;
  padding-bottom: .5rem
}

.slc-accordion-button:not(.collapsed)::after {
  background-image: var(--bs-accordion-btn-active-icon);
  transform: var(--bs-accordion-btn-icon-transform)
}

.slc-accordion-button::after {
  flex-shrink: 0;
  width: var(--bs-accordion-btn-icon-width);
  height: var(--bs-accordion-btn-icon-width);
  margin-left: auto;
  content: "";
  background-image: var(--bs-accordion-btn-icon);
  background-repeat: no-repeat;
  background-size: var(--bs-accordion-btn-icon-width);
  transition: var(--bs-accordion-btn-icon-transition)
}

.slc-accordion-item {
  border-bottom: 1px dashed #ccc;
  padding-top: .5rem;
  padding-bottom: .5rem
}

.slc-accordion-item:last-child {
  border: 0
}

.slc-accordion-body ul {
  padding: 0;
  margin: 0;
  list-style: none
}

.slc-accordion-body ul li {
  padding-top: .25rem;
  padding-bottom: .25rem;
  display: flex;
  align-items: center
}

.slc-accordion-body ul li a {
  font-family: var(--psa-primary-font);
  font-size: 20px;
  color: var(--psa-black);
  display: flex;
  align-items: center;
  width: 100%;
  padding-top: .5rem;
  padding-bottom: .5rem;
  transition: all .2s ease-in
}

.slc-accordion-body ul li a:hover,
.slc-accordion-body ul li a.active {
  background: var(--psa-skyline);
  color: var(--psa-white);
  border-radius: 50px;
  padding: .5rem 1rem
}

.slc-icon {
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  height: 32px;
  width: 32px;
  display: flex;
  margin-right: .5rem
}

.population {
  background-image: url(../../images/statistics/population.svg)
}

.marriages-and-divorces {
  background-image: url(../../images/statistics/marriage.svg)
}

.births-and-deaths {
  background-image: url(../../images/statistics/birth.svg)
}

.health {
  background-image: url(../../images/statistics/health.svg)
}

.time-usage {
  background-image: url(../../images/statistics/timeusage.svg)
}

.labor-force {
  background-image: url(../../images/statistics/laborforce.svg)
}

.special-needs {
  background-image: url(../../images/statistics/disability.svg)
}

.media-culture-and-tourism {
  background-image: url(../../images/statistics/microphone.svg)
}

.security-and-jurisprudence {
  background-image: url(../../images/statistics/law.svg)
}

.research-and-development {
  background-image: url(../../images/statistics/research.svg)
}

.education {
  background-image: url(../../images/statistics/education.svg)
}

.employment-wages-and-working-hours {
  background-image: url(../../images/statistics/wages.svg)
}

.civil-society-services {
  background-image: url(../../images/statistics/management.svg)
}

.general-social-statistics {
  background-image: url(../../images/statistics/GSocialStats.svg)
}

.sport {
  background-image: url(../../images/statistics/sports.svg)
}

.household-income-and-expenditure {
  background-image: url(../../images/statistics/income.svg)
}

.training {
  background-image: url(../../images/statistics/training.svg)
}

.electricity-and-water {
  background-image: url(../../images/statistics/electricity.svg)
}

.building-permits-and-buildings-completed {
  background-image: url(../../images/statistics/buildings.svg)
}

.foreign-investment {
  background-image: url(../../images/statistics/investment.svg)
}

.business-services {
  background-image: url(../../images/statistics/businessman.svg)
}

.building-and-construction {
  background-image: url(../../images/statistics/crane.svg)
}

.confidence-index {
  background-image: url(../../images/statistics/confidenceindex.svg)
}

.hotels-and-restaurants {
  background-image: url(../../images/statistics/hotels.svg)
}

.wholesale-and-retail-trade {
  background-image: url(../../images/statistics/shopping-cart.svg)
}

.price-indices {
  background-image: url(../../images/statistics/pricesindices.svg)
}

.general-economic-statistics {
  background-image: url(../../images/statistics/GeconomicStats.svg)
}

.foreign-trade {
  background-image: url(../../images/statistics/foreign-trade.svg)
}

.transport-and-communications {
  background-image: url(../../images/statistics/transport.svg)
}

.banking-and-insurance {
  background-image: url(../../images/statistics/banking.svg)
}

.maritime-navigation {
  background-image: url(../../images/statistics/marine.svg)
}

.agriculture {
  background-image: url(../../images/statistics/agriculture.svg)
}

.social-and-personal-services {
  background-image: url(../../images/statistics/socialPersonalServices.svg)
}

.energy-and-industry {
  background-image: url(../../images/statistics/energy.svg)
}

.national-accounts {
  background-image: url(../../images/statistics/nationalaccounts.svg)
}

.district-cooling {
  background-image: url(../../images/statistics/districtcooling.svg)
}

.water {
  background-image: url(../../images/statistics/water.svg)
}

.environmental-statistics {
  background-image: url(../../images/statistics/environmentalStatistics.svg)
}

.physical-and-climate-features {
  background-image: url(../../images/statistics/climarte.svg)
}

.qatar-in-figures {
  background-image: url(../../images/statistics/qatarInFigures.svg)
}

.annual-statistical-abstract {
  background-image: url(../../images/statistics/annualStatsAbstract.svg)
}

.census {
  background-image: url(../../images/statistics/census.svg)
}

.qatar-monthly-statistics {
  background-image: url(../../images/statistics/qms.svg)
}

.slc-accordion-body ul li a:hover .population,
.slc-accordion-body ul li a.active .population {
  background-image: url(../../images/statistics/population-alt.svg)
}

.slc-accordion-body ul li a:hover .marriages-and-divorces,
.slc-accordion-body ul li a.active .marriages-and-divorces {
  background-image: url(../../images/statistics/marriage-alt.svg)
}

.slc-accordion-body ul li a:hover .births-and-deaths,
.slc-accordion-body ul li a.active .births-and-deaths {
  background-image: url(../../images/statistics/birth-alt.svg)
}

.slc-accordion-body ul li a:hover .health,
.slc-accordion-body ul li a.active .health {
  background-image: url(../../images/statistics/health-alt.svg)
}

.slc-accordion-body ul li a:hover .time-usage,
.slc-accordion-body ul li a.active .time-usage {
  background-image: url(../../images/statistics/timeusage-alt.svg)
}

.slc-accordion-body ul li a:hover .labor-force,
.slc-accordion-body ul li a.active .labor-force {
  background-image: url(../../images/statistics/laborforce-alt.svg)
}

.slc-accordion-body ul li a:hover .special-needs,
.slc-accordion-body ul li a.active .special-needs {
  background-image: url(../../images/statistics/disability-alt.svg)
}

.slc-accordion-body ul li a:hover .media-culture-and-tourism,
.slc-accordion-body ul li a.active .media-culture-and-tourism {
  background-image: url(../../images/statistics/microphone-alt.svg)
}

.slc-accordion-body ul li a:hover .security-and-jurisprudence,
.slc-accordion-body ul li a.active .security-and-jurisprudence {
  background-image: url(../../images/statistics/law-alt.svg)
}

.slc-accordion-body ul li a:hover .research-and-development,
.slc-accordion-body ul li a.active .research-and-development {
  background-image: url(../../images/statistics/research-alt.svg)
}

.slc-accordion-body ul li a:hover .education,
.slc-accordion-body ul li a.active .education {
  background-image: url(../../images/statistics/education-alt.svg)
}

.slc-accordion-body ul li a:hover .employment-wages-and-working-hours,
.slc-accordion-body ul li a.active .employment-wages-and-working-hours {
  background-image: url(../../images/statistics/wages-alt.svg)
}

.slc-accordion-body ul li a:hover .civil-society-services,
.slc-accordion-body ul li a.active .civil-society-services {
  background-image: url(../../images/statistics/management-alt.svg)
}

.slc-accordion-body ul li a:hover .general-social-statistics,
.slc-accordion-body ul li a.active .general-social-statistics {
  background-image: url(../../images/statistics/GSocialStats-alt.svg)
}

.slc-accordion-body ul li a:hover .sport,
.slc-accordion-body ul li a.active .sport {
  background-image: url(../../images/statistics/sports-alt.svg)
}

.slc-accordion-body ul li a:hover .household-income-and-expenditure,
.slc-accordion-body ul li a.active .household-income-and-expenditure {
  background-image: url(../../images/statistics/income-alt.svg)
}

.slc-accordion-body ul li a:hover .training,
.slc-accordion-body ul li a.active .training {
  background-image: url(../../images/statistics/training-alt.svg)
}

.slc-accordion-body ul li a:hover .electricity-and-water,
.slc-accordion-body ul li a.active .electricity-and-water {
  background-image: url(../../images/statistics/electricity-alt.svg)
}

.slc-accordion-body ul li a:hover .building-permits-and-buildings-completed,
.slc-accordion-body ul li a.active .building-permits-and-buildings-completed {
  background-image: url(../../images/statistics/buildings-alt.svg)
}

.slc-accordion-body ul li a:hover .foreign-investment,
.slc-accordion-body ul li a.active .foreign-investment {
  background-image: url(../../images/statistics/investment-alt.svg)
}

.slc-accordion-body ul li a:hover .business-services,
.slc-accordion-body ul li a.active .business-services {
  background-image: url(../../images/statistics/businessman-alt.svg)
}

.slc-accordion-body ul li a:hover .building-and-construction,
.slc-accordion-body ul li a.active .building-and-construction {
  background-image: url(../../images/statistics/crane-alt.svg)
}

.slc-accordion-body ul li a:hover .confidence-index,
.slc-accordion-body ul li a.active .confidence-index {
  background-image: url(../../images/statistics/confidenceindex-alt.svg)
}

.slc-accordion-body ul li a:hover .hotels-and-restaurants,
.slc-accordion-body ul li a.active .hotels-and-restaurants {
  background-image: url(../../images/statistics/hotels-alt.svg)
}

.slc-accordion-body ul li a:hover .wholesale-and-retail-trade,
.slc-accordion-body ul li a.active .wholesale-and-retail-trade {
  background-image: url(../../images/statistics/shopping-cart-alt.svg)
}

.slc-accordion-body ul li a:hover .price-indices,
.slc-accordion-body ul li a.active .price-indices {
  background-image: url(../../images/statistics/pricesindices-alt.svg)
}

.slc-accordion-body ul li a:hover .general-economic-statistics,
.slc-accordion-body ul li a.active .general-economic-statistics {
  background-image: url(../../images/statistics/GeconomicStats-alt.svg)
}

.slc-accordion-body ul li a:hover .foreign-trade,
.slc-accordion-body ul li a.active .foreign-trade {
  background-image: url(../../images/statistics/foreign-trade-alt.svg)
}

.slc-accordion-body ul li a:hover .transport-and-communications,
.slc-accordion-body ul li a.active .transport-and-communications {
  background-image: url(../../images/statistics/transport-alt.svg)
}

.slc-accordion-body ul li a:hover .banking-and-insurance,
.slc-accordion-body ul li a.active .banking-and-insurance {
  background-image: url(../../images/statistics/banking-alt.svg)
}

.slc-accordion-body ul li a:hover .maritime-navigation,
.slc-accordion-body ul li a.active .maritime-navigation {
  background-image: url(../../images/statistics/marine-alt.svg)
}

.slc-accordion-body ul li a:hover .agriculture,
.slc-accordion-body ul li a.active .agriculture {
  background-image: url(../../images/statistics/agriculture-alt.svg)
}

.slc-accordion-body ul li a:hover .social-and-personal-services,
.slc-accordion-body ul li a.active .social-and-personal-services {
  background-image: url(../../images/statistics/socialPersonalServices-alt.svg)
}

.slc-accordion-body ul li a:hover .energy-and-industry,
.slc-accordion-body ul li a.active .energy-and-industry {
  background-image: url(../../images/statistics/energy-alt.svg)
}

.slc-accordion-body ul li a:hover .national-accounts,
.slc-accordion-body ul li a.active .national-accounts {
  background-image: url(../../images/statistics/nationalaccounts-alt.svg)
}

.slc-accordion-body ul li a:hover .district-cooling,
.slc-accordion-body ul li a.active .district-cooling {
  background-image: url(../../images/statistics/districtcooling-alt.svg)
}

.slc-accordion-body ul li a:hover .water,
.slc-accordion-body ul li a.active .water {
  background-image: url(../../images/statistics/water-alt.svg)
}

.slc-accordion-body ul li a:hover .environmental-statistics,
.slc-accordion-body ul li a.active .environmental-statistics {
  background-image: url(../../images/statistics/environmentalStatistics-alt.svg)
}

.slc-accordion-body ul li a:hover .physical-and-climate-features,
.slc-accordion-body ul li a.active .physical-and-climate-features {
  background-image: url(../../images/statistics/climarte-alt.svg)
}

.slc-accordion-body ul li a:hover .qatar-in-figures,
.slc-accordion-body ul li a.active .qatar-in-figures {
  background-image: url(../../images/statistics/qatarInFigures-alt.svg)
}

.slc-accordion-body ul li a:hover .annual-statistical-abstract,
.slc-accordion-body ul li a.active .annual-statistical-abstract {
  background-image: url(../../images/statistics/annualStatsAbstract-alt.svg)
}

.slc-accordion-body ul li a:hover .census,
.slc-accordion-body ul li a.active .census {
  background-image: url(../../images/statistics/census-alt.svg)
}

.slc-accordion-body ul li a:hover .qatar-monthly-statistics,
.slc-accordion-body ul li a.active .qatar-monthly-statistics {
  background-image: url(../../images/statistics/qms-alt.svg)
}

.stats-right-content {
  width: calc(100% - 380px);
  padding-left: 30px
}

.src-left {
  width: calc(100% - 350px)
}

.src-flex {
  display: flex;
  align-items: start
}

.src-right {
  width: 380px;
  background: var(--psa-white-f8);
  padding: 24px;
  margin-left: 24px
}

.curved-card {
  background: var(--psa-white);
  padding: 24px;
  border-radius: 20px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .08);
  border: 1px solid var(--psa-white-ef)
}

.chart-title {
  font-size: 22px;
  font-family: var(--psa-primary-font);
  font-weight: 500;
  margin-bottom: .5rem
}

.related-news .news-list {
  padding-top: .5rem
}

.related-news h4 {
  font-size: 20px
}

.related-news .news-content p {
  font-size: 15px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden
}

.related-news .text-end {
  text-align: center !important
}

.key-documents h3 {
  margin-bottom: .75rem
}

.src-left h1 {
  font-weight: 600;
  margin: 0;
  line-height: 40px
}

.card-sub-title {
  font-size: 18px
}

.noCurve-card {
  border: 1px solid var(--psa-black-d8);
  padding: 24px 0 0;
  display: flex;
  flex-direction: column;
  height: 100%
}

.growth-rate-group {
  display: flex;
  align-items: center;
  padding: 1rem 12px
}

.growth-indicator {
  margin-right: .25rem
}

.growth-percentage {
  font-family: var(--psa-primary-font);
  font-size: 19px;
  font-weight: 500;
  line-height: 0;
  margin-right: .25rem
}

.growth-indicator img {
  margin-top: -4px
}

.by-gender {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100px;
  border-top: 1px solid var(--psa-black-d8);
  padding-left: 24px;
  padding-right: 24px
}

.chart-img {
  display: flex;
  align-items: center;
  justify-content: center
}

.population-count {
  padding: 0 12px
}

.switches-container {
  width: 119px;
  position: relative;
  display: flex;
  padding: 0;
  position: relative;
  background: var(--psa-aladaam);
  border-radius: 3rem
}

.switches-container input {
  visibility: hidden;
  position: absolute;
  top: 0
}

.switches-container label {
  width: 50%;
  padding: 0;
  margin: 0;
  text-align: center;
  cursor: pointer;
  color: var(--psa-white)
}

.switch-wrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  padding: .15rem;
  z-index: 3;
  transition: transform .5s cubic-bezier(0.77, 0, 0.175, 1)
}

.switch {
  border-radius: 3rem;
  background: var(--psa-white);
  height: 100%
}

.switch div {
  width: 100%;
  text-align: center;
  opacity: 0;
  display: block;
  color: var(--psa-aladaam);
  transition: opacity .2s cubic-bezier(0.77, 0, 0.175, 1) .125s;
  will-change: opacity;
  position: absolute;
  top: 0;
  left: 0
}

.switches-container input:nth-of-type(1):checked~.switch-wrapper {
  transform: translateX(0%)
}

.switches-container input:nth-of-type(2):checked~.switch-wrapper {
  transform: translateX(100%)
}

.switches-container input:nth-of-type(1):checked~.switch-wrapper .switch div:nth-of-type(1) {
  opacity: 1
}

.switches-container input:nth-of-type(2):checked~.switch-wrapper .switch div:nth-of-type(2) {
  opacity: 1
}

.chart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--psa-black-dd);
  margin-bottom: 1rem
}

.filterBy-label {
  color: var(--psa-black-58);
  margin-right: .5rem
}

.p-24 {
  padding: 24px
}

.filter-toggler {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap
}

.chart-header .chart-title {
  margin-bottom: 0
}

.publication-item {
  border: 1px solid var(--psa-black-d8);
  border-radius: 10px;
  padding: .5rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem
}

.publication-name .title {
  font-weight: 600;
  width: calc(100% - 48px)
}

.published-on {
  font-size: 14px;
  font-style: italic;
  color: var(--psa-black-58)
}

.action-items a {
  padding-right: .5rem;
  padding-left: .5rem
}

.publication-item:hover {
  background: #EFF5F8;
  border-color: #CBE3EF;
  transform: scale(1.01);
  box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1)
}

.publication-name:before {
  content: '';
  background-image: url(../../images/statistics/book-reader.svg);
  height: 36px;
  width: 36px;
  display: flex;
  margin-right: .5rem
}

.publication-name {
  display: flex;
  align-items: center
}

.card.blue {
  background-color: var(--psa-skyline)
}

.card.blue h1 {
  color: var(--psa-white) !important
}

.h-auto {
  height: auto !important
}

.release-date {
  display: inline-flex;
  padding: .15rem 1rem;
  font-family: var(--psa-primary-font);
  font-size: 18px;
  font-weight: 500;
  margin-top: .25rem;
  margin-bottom: .5rem
}

.download-arrow-blue {
  background-image: url(../../images/download-boxArrow-blue.svg)
}

.dwnld-monthly-pop .whiteBtn {
  border-radius: 20rem;
  border: 1px solid transparent;
  padding: .2rem 1rem
}

.dwnld-monthly-pop .whiteBtn:hover {
  background-color: var(--psa-skyline);
  color: var(--psa-white) !important;
  border-color: var(--psa-white)
}

.dwnld-monthly-pop .whiteBtn:hover .download-arrow-blue {
  background-image: url(../../images/download-boxArrow-alt.svg)
}

.lp-label {
  font-family: var(--psa-primary-font);
  font-size: 24px;
  color: var(--psa-white)
}

.lp-number {
  font-family: var(--psa-primary-font);
  font-size: 38px;
  color: var(--psa-white)
}

.lp-number.tp {
  font-size: 5.25rem
}

.lp-gender {
  display: flex;
  align-items: center;
  justify-content: center
}

.gender-figure {
  padding-right: 1rem;
  padding-left: 1rem
}

.lp-pop {
  align-items: flex-end;
  display: flex
}

.openLeftMenu1 span {
  height: 3px;
  width: 22px;
  background-color: #fff;
  display: block;
  border-radius: 10px
}

.openLeftMenu1 span:nth-child(2) {
  width: 16px;
  margin-top: 4px;
  margin-bottom: 4px
}

.openLeftMenu1 {
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: end;
  cursor: pointer;
  position: fixed;
  background: var(--psa-dunedark);
  padding: .75rem;
  left: -100px;
  top: 100px;
  border-radius: 0 5px 20px 0;
  z-index: 9
}

.openLeftMenu1 span:nth-child(3) {
  width: 18px
}

.openLeftMenu1:hover span {
  width: 24px
}

.openSubject {
  transform: rotate(-90deg) scaleX(-1);
  transform-origin: top left;
  cursor: pointer;
  position: fixed;
  background: var(--psa-skyline);
  padding: .4rem 1rem;
  z-index: 9;
  color: #fff;
  font-family: var(--psa-primary-font);
  left: -100px;
  top: 51px;
  font-size: 18px;
  transition: all .3s ease-in
}

.openSubject .content {
  transform: scaleX(-1)
}

.src-filter {
  padding-top: 1rem;
  padding-bottom: 1rem
}

.closeLeftMenu {
  display: none
}

.src-filter {
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.src-filter-year {
  margin-right: 1rem
}

.qms-title .qms-month {
  margin-top: 0
}

.src-filter .form-select {
  padding: .15rem 2rem .15rem .5rem;
  font-size: 14px
}

.qms-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap
}

.sf-control-inline {
  display: flex;
  align-items: center
}

.name-wrapper {
  width: calc(100% - 36px)
}

.action-items {
  display: flex
}

.close.slc-close {
  display: none
}

@media(max-width:1680px) {
  .src-left {
    width: 100%
  }
}

@media(max-width:1480px) and (min-width:1025px) {

  .ls-pop,
  .ls-gender {
    flex: 0 0 100%;
    margin-bottom: 1rem
  }

  .lp-content .col-lg-4 {
    flex: 0 0 100%;
    margin-top: 1rem;
    margin-bottom: 1rem
  }

  .lp-content .col-lg-4:not(:first-child) {
    flex: 0 0 50%
  }
}

@media(max-width:1024px) {
  .close.slc-close {
    display: block
  }

  .closeLeftMenu {
    display: block
  }

  .stats-left-content {
    position: absolute;
    left: 0;
    transform: translateX(-120%)
  }

  .openLeftMenu1 {
    left: 0
  }

  .openSubject {
    left: 0
  }

  .src-flex {
    flex-direction: column
  }

  .src-right {
    width: 100%;
    margin-left: 0;
    margin-top: 2rem
  }

  .stats-right-content {
    width: 100%;
    padding-left: 0
  }

  .stats-left-content {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9;
    bottom: 0;
    overflow-y: auto;
    border-radius: 0;
    transition: all .3s ease-in
  }

  .stats-left-content.show {
    transform: translateX(0)
  }

  .menuoverlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, .8);
    z-index: 9;
    display: none
  }

  .menuoverlay.show {
    display: flex
  }

  .ftavdSearch .stats-flex {
    flex-direction: column
  }

  .ftavdSearch .stats-left-content {
    transform: translateX(0);
    position: initial;
    border-radius: 12px;
    z-index: auto;
    transition: all .3s ease-in;
    width: 100%;
    margin-bottom: 2rem
  }
}

@media(max-width:767px) {
  .lp-content .col-lg-4 {
    flex: 0 0 100%;
    margin-top: 2rem;
    margin-bottom: 2rem
  }

  .lp-pop {
    justify-content: center
  }

  #yearly,
  #ftasYearly {
    margin-bottom: 1rem
  }
}

@media(max-width:540px) {
  .lp-number.tp {
    font-size: 3.5rem
  }
}

@media(max-width:375px) {
  .sf-control-inline:last-child {
    margin-top: .75rem
  }

  .stats-left-content {
    width: 100%
  }
}

.page-wrapper {
  position: relative
}

.dr-wrapper {
  background: #fff;
  margin-left: 0;
  margin-right: 0
}

.dataRequestBanner-bg {
  background-image: url(../../images/dataRequest-banner.png);
  min-height: 480px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: auto
}

.dr-intro {
  margin-top: -12rem;
  background: var(--psa-white);
  color: var(--psa-black-18);
  padding: 24px
}

.dr-intro h1 {
  color: var(--psa-aladaam);
  margin-bottom: 1rem
}

.dr-intro p {
  font-size: 20px;
  line-height: 28px
}

.dr-intro .highlighted-list-alt ul {
  margin: 0;
  padding: 0;
  list-style: none
}

.dr-intro .highlighted-list-alt ul li {
  position: relative;
  display: flex;
  align-items: flex-start;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.dr-intro .highlighted-list-alt ul li::before {
  content: "";
  width: 24px;
  height: 24px;
  background-image: url(../../images/listStyleType-1.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 10px;
  transform: rotate(0deg)
}

.dr-indicators .card-content {
  padding-top: 1rem;
  padding-bottom: 1rem
}

.dr-indicators {
  margin-top: -4rem
}

.dr-indicators a.card.flat-type {
  background-color: #f8f8f8;
  padding: 1.5rem;
  display: flex;
  justify-content: center
}

.dr-indicators .data {
  padding-top: 3rem
}

.left.underlined:after {
  left: 0;
  transform: translateX(0)
}

.how-it-works {
  background: var(--psa-white-f8);
  height: 100%;
  padding: 24px
}

.hiw-list {
  padding-top: 2rem
}

.hiw-item {
  border-bottom: 1px dashed var(--psa-black-c8);
  margin-bottom: 1.5rem;
  padding-bottom: .5rem
}

.hiw-icon-title {
  display: flex;
  align-items: center
}

h2.underlined {
  margin: 0
}

.hiw-icon-title h3 {
  font-size: 20px;
  margin: 0
}

.hiw-body {
  padding: .35rem 0 0;
  font-size: 16px
}

.icon-32 {
  height: 32px;
  width: 32px;
  display: flex;
  margin-right: .32rem;
  margin-bottom: .25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.select-data {
  background-image: url(../../images/select-data.svg)
}

.provide-specifics {
  background-image: url(../../images/provide-specifics.svg)
}

.user-privacy {
  background-image: url(../../images/user-privacy.svg)
}

.data-retrieval {
  background-image: url(../../images/data-retrieval.svg)
}

.delivery-date {
  background-image: url(../../images/data-delivery.svg)
}

.data-request-form {
  padding: 1.5rem
}

.form-icon {
  height: 16px;
  width: 16px;
  display: flex;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.user {
  background-image: url(../../images/user.svg)
}

.mobile-icon {
  background-image: url(../../images/mobile.svg)
}

.email {
  background-image: url(../../images/mail.svg)
}

.brief {
  background-image: url(../../images/brief.svg)
}

.send {
  background-image: url(../../images/send-alt.svg)
}

.reset {
  background-image: url(../../images/reset-alt.svg)
}

.userManual {
  background-image: url(../../images/userManual-alt.svg)
}

.id-card {
  background-image: url(../../images/id-card.svg)
}

.poBox {
  background-image: url(../../images/postbox.svg)
}

.employer {
  background-image: url(../../images/employer.svg)
}

.location {
  background-image: url(../../images/address.svg)
}

.date {
  background-image: url(../../images/date.svg)
}

.userManual-text {
  margin-top: 4px;
  line-height: 20px
}

.primaryBtn:hover .userManual {
  background-image: url(../../images/userManual.svg)
}

.primaryBtn:hover .send {
  background-image: url(../../images/send.svg)
}

.secondaryBtn:hover .reset {
  background-image: url(../../images/reset.svg)
}

.button-group-center button {
  margin-left: .25rem;
  margin-right: .25rem
}

.indicator-item {
  margin-bottom: 24px
}

.dr-form-title h3 {
  background: var(--psa-aladaam);
  display: inline-flex;
  color: var(--psa-white);
  padding: .5rem .75rem;
  border-radius: .75rem .75rem 0 0;
  font-family: var(--psa-primary-font);
  font-size: 22px;
  margin-bottom: 0 !important
}

.dr-form-controls {
  background: var(--psa-white-f8);
  padding: 30px;
  margin-bottom: 2rem
}

.dr-form-controls .input-group {
  border-radius: .35rem;
  font-family: var(--psa-primary-font);
  background: var(--psa-white);
  align-items: flex-start
}

.data-request-form label {
  margin-bottom: .35rem;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.fs-16 {
  font-size: 16px !important
}

.statement-txt {
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.dr-declaration {
  border-top: 1px dashed var(--psa-black-c8);
  padding-top: 2rem
}

.dr-declaration .label-text {
  line-height: 20px;
  width1: auto;
  margin-top: .2rem
}

.primary-text.underlined:after {
  background-color: var(--psa-black-68);
  width: 50px
}

.dr-declaration .checkboxes-container {
  gap: 0
}

.dr-declaration .checkboxes-container .option {
  width: 100%;
  margin-top: .5rem;
  margin-bottom: 0;
  gap: .5rem
}

.dr-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2rem;
  flex-wrap: wrap;
  gap: 1rem
}

abbr.required {
  color: #B70B0B;
  font-size: 14px;
  font-weight: 600;
  margin-left: .25rem
}

abbr.required-alt {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  margin-left: .5rem
}

@media(max-width:767px) {
  .dr-indicators {
    margin-top: 0
  }

  .data-request-form {
    padding: 1.5rem 0 0
  }
}

.form-control:focus {
  box-shadow: none
}

@-webkit-keyframes fading {
  from {
    opacity: 0;
    width: 0
  }

  to {
    opacity: 1
  }
}

@-moz-keyframes fading {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes fading {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.input-group {
  align-items: center
}

.input-group-text {
  padding: .6rem .75rem
}

.input-group>.form-control {
  text-align: left
}

.qnv2030Banner-bg {
  background-image: url(../../images/qnv2030-banner.png);
  min-height: 480px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.qnv-wrapper {
  background: var(--psa-white);
  padding: 2rem;
  margin-top: -12rem
}

.qnv-intro {
  display: flex;
  align-items: flex-start
}

.qnv-logo {
  margin-right: 2rem;
  width: 200px;
  height: auto
}

.qnv-desc {
  width: calc(100% - 200px)
}

.qnv-content {
  margin-top: 2rem
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active,
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  border-color: transparent;
  background: none;
  border-bottom: 2px solid var(--psa-aladaam);
  color: var(--psa-aladaam)
}

.nav-tabs .nav-link {
  font-size: 24px;
  font-family: var(--psa-primary-font);
  padding-left: 24px;
  padding-right: 24px;
  position: relative;
  color: var(--psa-black)
}

.nav-tabs .nav-link.active:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-top-color: var(--psa-aladaam);
  border-width: 12px;
  margin-left: -16px
}

#qnv-tabs+.tab-content {
  padding: 1.5rem 0
}

.inline-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1rem
}

.inline-header h2 {
  width: 175px;
  margin-bottom: 0
}

.inline-header .title-img {
  display: flex;
  align-items: center;
  width: 275px
}

.inline-header p {
  width: calc(100% - 250px);
  margin-bottom: 0;
  border-left: 1px solid var(--psa-black-d8);
  padding-left: 1rem
}

.inline-header p:before {
  content: '';
  background: var(--psa-black-d8);
  height: 100%
}

.inline-header .title-img img {
  width: 80px;
  margin-right: 1rem
}

.inline-icon-box {
  display: flex;
  align-items: center;
  border-radius: .5rem;
  padding: 1rem;
  min-height: 115px
}

.col-lg-3:has(.inline-icon-box) {
  height: 100%
}

.inline-icon-box p {
  width: calc(100% - 50px);
  padding-left: 1rem;
  margin: 0
}

.nav-section {
  padding-top: 2rem;
  padding-bottom: 1rem
}

.ep-item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%
}

.tab-body h2 {
  margin: 0
}

.tab-body h3 {
  font-size: 20px;
  font-family: var(--psa-primary-font);
  line-height: 24px;
  margin: 0
}

.tab-body h4 {
  font-size: 18px;
  font-family: var(--psa-primary-font);
  line-height: 24px;
  margin: 0
}

.ep-item:after {
  content: '';
  background: url(../../images/seperator-primary.svg);
  height: 70px;
  width: 20px;
  display: flex;
  background-position: center;
  background-repeat: no-repeat;
  margin-left: 1rem
}

.icon-48 {
  height: 48px;
  width: 48px;
  display: flex;
  margin-right: .32rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.edu-target {
  background-image: url(../../images/edu-target.svg)
}

.edu-claimb-stairs {
  background-image: url(../../images/edu-claimb-stairs.svg)
}

.edu-bookcap {
  background-image: url(../../images/edu-bookcap.svg)
}

ul.bulleted {
  list-style: none;
  margin: .5rem 0 0;
  padding: 0
}

ul.bulleted li {
  padding: .5rem
}

ul.bulleted li:before {
  content: "";
  background-size: contain;
  display: inline-block;
  width: 14px;
  height: 14px;
  position: relative;
  top: .1rem;
  margin-right: .5rem
}

ul.bulleted.tick.secondary li:before {
  background-image: url(../../images/bullet-style-tick-gold.svg)
}

ul.bulleted.flower.primary li:before {
  background-image: url(../../images/flower-primary.svg);
  height: 18px;
  width: 18px;
  top: .25rem;
  margin-right: .25rem
}

ul.bulleted.flower li {
  padding: .25rem
}

ul.bulleted.flower li:last-child {
  padding-bottom: 1rem
}

.nav-section .row {
  align-items: center
}

@media(max-width:992px) {
  .ep-item:after {
    display: none
  }

  .inline-header {
    flex-direction: column;
    align-items: flex-start
  }

  .ep-item {
    display: flex;
    flex-direction: column
  }

  .inline-icon-box,
  .ep-item {
    height: calc(100% - 1rem);
    margin-bottom: 1rem
  }

  .inline-header p {
    width: 100%;
    border-left: 0;
    padding-top: 1rem
  }

  .nav-section:last-child .row {
    flex-direction: column-reverse
  }

  .hp-body {
    margin-bottom: 1rem
  }
}

.gray-bg {
  background: var(--psa-white-f8)
}

.sign-language {
  padding-top: 4rem;
  padding-bottom: 4rem
}

.sign-language .container-fluid {
  width: 100vw
}

.swiper-flex {
  display: flex;
  align-items: center;
  padding-top: 1.5rem
}

.swiper-button-next,
.swiper-button-prev {
  position: inherit;
  border-radius: 100%;
  border: 1px solid var(--psa-black-48);
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center
}

.video-title {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem .5rem;
  color: #fff;
  background: var(--psa-dunedark)
}

.sl-subTitle {
  text-transform: uppercase;
  font-size: 14px
}

.sl-video-number {
  font-size: 70px;
  color: rgba(255, 255, 255, .1);
  font-family: var(--psa-primary-font);
  line-height: 70px;
  padding-top: .75rem
}

.title-group {
  margin-left: -.5rem
}

.sl-video-title {
  font-size: 26px;
  font-family: var(--psa-primary-font);
  line-height: 30px
}

.video-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 250px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left
}

.signLanguage .swiper-slide:nth-child(odd) .video-thumb {
  background-image: url(../../images/sl-video-thumb-left.png)
}

.signLanguage .swiper-slide:nth-child(even) .video-thumb {
  background-image: url(../../images/sl-video-thumb-right.png)
}

.signLanguage {
  width: calc(100% - 100px) !important
}

.signLanguage .swiper-slide a {
  width: 100%
}

.paly-video {
  background: rgba(134, 122, 77, .5);
  width: 100%;
  height: 250px;
  display: flex;
  align-items: center;
  justify-content: center
}

.swiper-button-next:after,
.swiper-button-prev:after {
  color: var(--psa-black-48);
  font-size: 18px;
  transform: rotate(0deg)
}

a.mobileTab {
  font-family: var(--psa-primary-font);
  font-size: 26px;
  background: var(--psa-white-ef);
  display: none;
  padding: .5rem 1rem .2rem;
  margin-bottom: .5rem
}

.tab-content>.active a.mobileTab {
  background: var(--psa-aladaam);
  color: var(--psa-white);
  margin-bottom: 2rem
}

@media(max-width:997px) {
  a.mobileTab {
    display: flex;
    color: var(--psa-black-28)
  }

  .nav-tabs {
    display: none
  }

  .tab-content>.tab-pane {
    display: block;
    opacity: 1
  }

  .tab-pane.fade .tab-body {
    display: none
  }

  .tab-pane.fade.active .tab-body {
    display: block
  }
}

@media(max-width:767px) {
  .qnv-wrapper {
    padding: 1rem .5rem
  }

  .qnv-intro {
    flex-direction: column
  }

  .qnv-logo {
    margin: 0 auto 1rem
  }

  .qnv-desc {
    width: 100%
  }
}

.nds-documents {
  display: flex;
  align-items: center;
  justify-content: stretch;
  flex-wrap: wrap
}

.nds-documents a {
  background: var(--psa-skyline);
  color: var(--psa-white);
  padding: .5rem 1rem;
  width: calc(50% - 24px);
  margin: 12px;
  border-radius: 5px;
  font-size: 18px;
  display: flex;
  align-items: center;
  font-family: 'Lusail'
}

@media(max-width:767px) {
  .nds-documents a {
    width: 100%;
    margin: 12px 0
  }
}

.icon-28 {
  display: block;
  width: 32px;
  height: 32px;
  margin-right: .5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover
}

.document-download {
  background-image: url(../../images/document-download-alt.svg)
}

.nds-documents a:hover {
  background: var(--psa-white-ef);
  color: var(--psa-black-48)
}

.nds-documents a:hover .document-download {
  background-image: url(../../images/document-download.svg)
}

.nds-program-list {
  position: relative
}

.nds-program-item {
  border: 1px solid var(--psa-black-d8);
  padding: 2rem 1.5rem;
  min-height: 400px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between
}

.pillerType {
  background: var(--psa-dunedark);
  padding: .1rem .5rem .2rem;
  color: var(--psa-white);
  display: inline-flex;
  border-radius: 4px;
  margin-bottom: .25rem
}

.simpleBtn {
  display: flex;
  align-items: center;
  color: var(--psa-aladaam) !important
}

.simpleBtn:hover {
  filter: grayscale(1)
}

.download-arrow {
  background-image: url(../../images/download-arrow-alt.svg)
}

.primaryBtn:hover .download-arrow {
  background-image: url(../../images/download-arrow.svg)
}

.readmore {
  background-image: url(../../images/openbook.svg);
  height: 24px;
  width: 24px;
  display: flex;
  margin-right: .35rem;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: .25rem
}

@media (min-width: 1200px) {
  .column-5 {
    flex: 0 0 auto;
    width: 20%;
    margin-bottom: 1.5rem;
    flex: 1
  }
}

@media (max-width: 1199px) {
  .column-5 {
    flex: 0 0 auto;
    width: 33.3333%;
    margin-bottom: 1.5rem
  }

  .our-ambitions-list .column-5 {
    width: 50%
  }
}

@media (max-width: 768px) {
  .column-5 {
    flex: 0 0 auto;
    width: 50%
  }

  .our-ambitions-list .column-5 {
    width: 100%
  }
}

@media (max-width: 560px) {
  .column-5 {
    flex: 0 0 auto;
    width: 100%
  }
}

a.goal-benefits-item {
  background: var(--psa-skyline);
  padding: 1rem 2rem;
  border-radius: 5rem;
  color: var(--psa-white);
  font-size: 20px;
  font-family: var(--psa-primary-font);
  display: flex;
  line-height: 24px;
  align-items: center;
  height: calc(100% - 24px);
  margin-bottom: 24px;
  justify-content: space-between
}

a.goal-benefits-item:hover {
  background: var(--psa-white-ef);
  color: var(--psa-skyline)
}

.goal-title {
  width: calc(100% - 24px)
}

.arrow-right {
  background-image: url(../../images/arrow_alt_right_alt.svg);
  margin-left: .5rem
}

a.goal-benefits-item:hover .arrow-right {
  background-image: url(../../images/arrow_alt_right_blue.svg)
}

.go-corner {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 32px;
  height: 32px;
  overflow: hidden;
  top: 0;
  right: 0;
  background-color: var(--psa-dune);
  border-radius: 0 4px 0 32px
}

.download-pdf {
  margin-top: -4px;
  margin-right: -4px;
  background-image: url(../../images/download-arrow-alt.svg);
  height: 20px;
  width: 20px;
  background-repeat: no-repeat
}

.es-card {
  display: flex;
  position: relative;
  background-color: var(--psa-white);
  border-radius: 4px;
  padding: 1rem 2rem;
  text-decoration: none;
  z-index: 0;
  overflow: hidden;
  height: calc(100% - 24px);
  margin-bottom: 24px;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--psa-black-d8);
  color: var(--psa-black-48)
}

.es-card:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -16px;
  right: -16px;
  background: var(--psa-dune);
  height: 32px;
  width: 32px;
  border-radius: 32px;
  transform: scale(1);
  transform-origin: 50% 50%;
  transition: transform .25s ease-out;
  border: 1px solid var(--psa-dune)
}

.es-card:hover:before {
  transform: scale(38)
}

.es-card p {
  margin-bottom: 0
}

.es-card:hover p {
  transition: all .3s ease-out;
  color: var(--psa-white)
}

.es-card .small-text {
  visibility: hidden
}

.es-card:hover .small-text {
  visibility: visible;
  color: var(--psa-white);
  transition: all .3s ease-out
}

.outcome-goal-box {
  background-color: var(--psa-white-f8);
  padding: 40px 40px 39px;
  text-align: left !important;
  margin-top: 24px;
  height: calc(100% - 24px)
}

.ogb-icon-wrapper {
  position: relative;
  z-index: 2
}

.ogb-icon {
  margin: 0 0 30px
}

.ogb-icon:before {
  top: -14px;
  left: 14px;
  z-index: -1;
  content: '';
  width: 54px;
  height: 54px;
  position: absolute;
  border-radius: 100%;
  background: rgba(13, 20, 39, .05);
  -webkit-transition: .3s cubic-bezier(.34, 1.56, .64, 1);
  -o-transition: .3s cubic-bezier(.34, 1.56, .64, 1);
  transition: .3s cubic-bezier(.34, 1.56, .64, 1)
}

.outcome-goal-body p {
  color: #54565c;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px
}

.outcome-goal-body span {
  opacity: 0;
  display: block;
  color: var(--psa-black-a8);
  font-size: 12px;
  font-weight: 500;
  line-height: 10px;
  margin-bottom: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  -webkit-transition: opacity .3s ease-out .02s;
  -o-transition: opacity .3s ease-out .02s;
  transition: opacity .3s ease-out .02s
}

.outcome-goal-box:hover .outcome-goal-body span {
  opacity: 1
}

.outcome-goal-body h3 {
  display: block;
  color: #0d1427;
  font-size: 24px;
  font-weight: 500;
  line-height: 28px;
  margin-bottom: 13px
}

.outcome-goal-box:hover .ogb-icon:before {
  top: -14px;
  left: 4px;
  -webkit-transform: scale(.8);
  -ms-transform: scale(.8);
  transform: scale(.8);
  background: rgba(138, 21, 56, .05)
}

.ogb-icon img {
  -webkit-transition: .3s cubic-bezier(.34, 1.56, .64, 1);
  -o-transition: .3s cubic-bezier(.34, 1.56, .64, 1);
  transition: .3s cubic-bezier(.34, 1.56, .64, 1)
}

.outcome-goal-box:hover .ogb-icon img {
  transform: scale(.85);
  transition-delay: .01s
}

.outcome-goal-box:hover h3 {
  font-size: 28px
}

@media(max-width:1200px) and (min-width:992px) {
  .outcome-goal-wrapper.col-lg-3 {
    width: 33.333333%;
    flex: 0 0 33.333333%
  }
}

.ps-timeline-sec {
  position: relative
}

.ps-timeline-sec .tm-container {
  position: relative
}

@media screen and (max-width: 992px) {
  .ps-timeline-sec .tm-container ol:before {
    background: var(--psa-aladaam);
    width: 10px;
    height: 10px;
    border-radius: 100%;
    position: absolute;
    top: 130px !important;
    left: 36px !important
  }

  .ps-timeline-sec .tm-container ol:after {
    background: var(--psa-aladaam);
    width: 10px;
    height: 10px;
    border-radius: 100%;
    position: absolute;
    top: inherit !important;
    left: 36px
  }

  .ps-timeline-sec .tm-container ol.ps-timeline {
    margin: 0 !important;
    border-left: 2px solid var(--psa-aladaam);
    padding-left: 0 !important;
    padding-top: 2rem !important;
    border-top: 0 !important;
    margin-left: 2rem !important
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li {
    float: none !important;
    width: inherit !important;
    display: flex;
    padding-top: 0 !important;
    padding-left: 0;
    display: flex;
    align-items: flex-start;
    position: initial !important;
    margin-left: -1rem;
    margin-bottom: 3rem
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li span.circled {
    width: 64px;
    height: 64px;
    padding: .25rem;
    border-width: 3px;
    left: 0 !important;
    position: initial !important;
    order: 1;
    display: flex !important
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li:last-child .ps-top {
    margin-bottom: 0 !important;
    width: calc(100% - 100px) !important;
    position: inherit !important
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li p {
    text-align: left !important;
    width: 100% !important;
    margin: 0 auto !important;
    margin-top: 0 !important
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li .ps-top {
    width: calc(100% - 100px) !important;
    top: -40px;
    position: inherit !important;
    order: 2;
    padding-left: 1rem;
    margin-bottom: 0 !important
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li .ps-bot {
    width: calc(100% - 96px) !important;
    position: initial !important;
    order: 2;
    padding-left: 1rem;
    margin: 0 !important
  }

  .ps-timeline-sec .tm-container ol.ps-timeline li:first-child {
    padding-top: 0 !important
  }
}

.ps-timeline-sec .tm-container ol.ps-timeline {
  margin: 225px 0 390px;
  padding: 0;
  border-top: 1px dashed var(--psa-black-48);
  list-style: none
}

.ps-timeline-sec .tm-container ol.ps-timeline li {
  float: left;
  width: 25%;
  padding-top: 30px;
  position: relative;
  padding-top: 1rem !important
}

.ps-timeline-sec .tm-container ol.ps-timeline li span.circled {
  width: 96px;
  height: 96px;
  margin-left: -25px;
  background: #fff;
  border: 5px solid #519032;
  border-radius: 50%;
  box-shadow: 0 0 0 0 #fff;
  text-align: center;
  line-height: 50px -10;
  color: var(--psa-black-48);
  font-size: 2em;
  font-style: normal;
  position: absolute;
  top: -52px;
  left: 50%;
  font-family: var(--psa-primary-font);
  font-weight: 500;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center
}

.ps-sp-top img,
.ps-sp-bot img {
  padding: .25rem
}

.ps-timeline-sec .tm-container ol.ps-timeline li p {
  margin: 0 auto;
  line-height: normal;
  font-size: 16px;
  margin-bottom: .5rem !important;
  background-image: url(../../images/flower-gold.svg);
  background-repeat: no-repeat;
  background-position: 0 -3px;
  padding-left: 28px
}

.ps-timeline-sec .tm-container ol.ps-timeline li .ps-top {
  position: absolute;
  bottom: 0;
  margin-bottom: 64px;
  font-family: var(--psa-primary-font)
}

.ps-timeline-sec .tm-container ol.ps-timeline li .ps-bot {
  position: absolute;
  margin-top: .5rem;
  font-family: var(--psa-primary-font)
}

.tm-year-txt {
  font-size: 13px;
  text-transform: uppercase;
  color: var(--psa-black-48)
}

.tm-year-number {
  font-size: 28px;
  font-weight: 600;
  line-height: 32px;
  color: #519032;
  margin-bottom: .5rem
}

.ps-timeline-sec .tm-container ol.ps-timeline li:nth-child(2) span {
  border-color: #710043
}

.ps-timeline-sec .tm-container ol.ps-timeline li:nth-child(3) span {
  border-color: #8A1538
}


.ps-timeline-sec .tm-container ol.ps-timeline li:nth-child(4) span {
  border-color: var(--psa-dune)
}

.ps-timeline-sec .tm-container ol.ps-timeline li:nth-child(2) .tm-year-number {
  color: #710043
}

.ps-timeline-sec .tm-container ol.ps-timeline li:nth-child(3) .tm-year-number {
  color: #8A1538
}

.ps-timeline-sec .tm-container ol.ps-timeline li:nth-child(4) .tm-year-number {
  color: var(--psa-dunedark)
}

.ps-bot ul.bulleted.tick.secondary,
.ps-top ul.bulleted.tick.secondary {
  margin: 0
}

.ps-bot ul.bulleted.tick.secondary li,
.ps-top ul.bulleted.tick.secondary li {
  clear: both;
  float: none;
  width: 100%;
  margin: 0;
  padding: .5rem 0 0;
  line-height: 19px
}

.readmore-content {
  display: flex;
  transform: translateX(-120%);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  border: 1px solid var(--psa-black-d8);
  background: var(--psa-white);
  padding: 2rem;
  transition: all .3s ease-in;
  overflow: hidden
}

.readmore-content.show {
  left: 0;
  transform: translateX(0%)
}

.program-content {
  overflow-y: auto;
  max-height: 275px;
  padding-bottom: 1.5rem
}

.program-content p {
  margin-bottom: .6rem
}

.program-content a {
  color: var(--psa-aladaam)
}

.readmore-content a:hover {
  color: var(--psa-dunedark)
}

.return {
  background-image: url(../../images/return.svg);
  height: 18px;
  width: 18px;
  display: flex;
  margin-right: .35rem;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: .25rem
}

.return2qnv {
  position: fixed;
  bottom: 0;
  padding: .5rem 1rem;
  background: var(--psa-white-ef);
  left: 0;
  cursor: pointer
}

[class^=closeProgram] {
  text-decoration: none;
  margin-right: 20px;
  background: transparent;
  box-shadow: none;
  border: none;
  box-sizing: border-box;
  cursor: pointer
}

[class^=closeProgram]:last-child {
  margin-right: 0
}

.closeProgram {
  height: 50px;
  position: absolute;
  right: 0;
  top: 10px
}

.closeProgram .inner {
  display: block;
  position: relative;
  height: 100%;
  display: flex;
  align-items: center
}

.closeProgram .inner:before {
  content: "";
  position: absolute;
  height: 2px;
  width: 36px;
  background-color: var(--psa-aladaam);
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  transition: ease-out .2s all
}

.closeProgram .inner:after {
  content: "";
  position: absolute;
  height: 2px;
  width: 36px;
  background-color: var(--psa-aladaam);
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  transition: ease-out .2s all
}

.closeProgram .label {
  color: var(--psa-aladaam);
  opacity: 0;
  transition: all .2s ease-out
}

.closeProgram:hover .inner:before,
.closeProgram:focus .inner:before {
  transform: translate(-50%, 0%) rotate(0);
  top: 25%
}

.closeProgram:hover .inner:after,
.closeProgram:focus .inner:after {
  transform: translate(-50%, 0%) rotate(0);
  top: 76%
}

.closeProgram:hover .label,
.closeProgram:focus .label {
  opacity: 1
}

::-webkit-scrollbar {
  width: 10px
}

::-webkit-scrollbar-track {
  background-color: #ebebeb;
  -webkit-border-radius: 10px;
  border-radius: 10px
}

::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: #6d6d6d
}

.close {
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 32px;
  height: 32px;
  opacity: .3;
  display: flex;
  z-index: 999
}

.close:hover {
  opacity: 1
}

.close:before,
.close:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 31px;
  width: 2px;
  background-color: #333
}

.close:before {
  transform: rotate(45deg)
}

.close:after {
  transform: rotate(-45deg)
}

.modal-content {
  border-radius: 0;
  border: 0;
  padding: 1rem 2rem 2rem
}

.modal-header {
  border: 0;
  border-radius: 0
}

@media (min-width: 992px) {

  .modal-lg,
  .modal-xl {
    --bs-modal-width: 900px
  }
}

@media(max-width:1200px) {
  .program-content {
    max-height: none
  }

  .return2qnv {
    position: inherit;
    margin-top: 2rem
  }

  .program-content p {
    margin-bottom: 1rem
  }

  .nds-program-item {
    min-height: auto
  }
}

@media(max-width:375px) {

  .ps-timeline-sec .tm-container ol.ps-timeline li .ps-top,
  .ps-timeline-sec .tm-container ol.ps-timeline li .ps-bot,
  .ps-timeline-sec .tm-container ol.ps-timeline li:last-child .ps-top {
    width: calc(100% - 64px) !important
  }

  .ps-timeline-sec .tm-container {
    padding-bottom: 5rem
  }
}

@media(max-width:13200px) {
  .nds-documents a {
    min-height: 60px
  }
}

#hpSearchBox div {
  width: 100%
}

#hpSearchBox .ms-webpartzone-cell {
  margin: 0
}

.ms-srch-sbLarge {
  background: var(--psa-white);
  border-radius: var(--bs-border-radius);
  padding: .15rem .5rem
}

.ms-srch-sbLarge>input {
  font-size: 16px;
  font-family: var(--psa-primary-font);
  width: calc(100% - 40px)
}

.global-search {
  background-color: var(--psa-aladaam)
}

h1#searchTitle {
  color: var(--psa-white)
}

.over-banner-content {
  background: var(--psa-white);
  margin-top: -12rem;
  padding: 2rem
}

.whiteBlue {
  background-color: var(--psa-white);
  color: var(--psa-skyline) !important
}

.whitePrimary {
  background-color: var(--psa-white);
  color: var(--psa-aladaam) !important
}

.whiteGold {
  background-color: var(--psa-white);
  color: var(--psa-dune) !important
}

.line-clamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden
}

.line-clamp:after {
  content1: ...;
  position: absolute;
  bottom: 0;
  right: 0;
  padding-left: 20px;
  background: linear-gradient(to right, rgba(255, 255, 255, 0), #2B32B2)
}

.line-clamp--5 {
  -webkit-line-clamp: 5
}

.line-clamp--3 {
  -webkit-line-clamp: 3
}

.line-clamp--2 {
  -webkit-line-clamp: 2
}

.ms-rtestate-field h3,
h3.ms-rteElement-H3 {
  line-height: 1.2;
  margin: 0 0 .5rem
}

.inner-banner {
  min-height: 475px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.npc-services-bg {
  background-image: url(../../images/npc-services-banner.png);
  background-size: cover;
  background-position: center
}

.subhead {
  font-family: var(--psa-primary-font);
  font-size: 26px
}

.linewrapper {
  position: relative;
  width: 2px;
  height: 100%
}

.dashed-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, transparent 50%, #d8d8d8 50%);
  background-size: 100% 16px
}

.col-md-1.column-0 {
  width: 2px
}

.col-md-6.column-6 {
  width: 55%
}

.psa-services-form {
  padding: 1rem
}

.more-info a {
  color: var(--psa-aladaam);
  font-weight: 600;
  position: relative
}

.more-info a:after {
  content: '';
  width: 0;
  height: 2px;
  display: block;
  background: var(--psa-dune);
  position: absolute;
  left: -25px;
  opacity: 0
}

.more-info a:hover:after {
  width: 100%;
  left: 0;
  transition: all .3s ease-in;
  opacity: 1
}

.checkboxes-container {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem
}

.option {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
  cursor: pointer;
  font-size: 16px;
  color: var(--psa-black-28);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.option input {
  position: absolute;
  opacity: 0;
  cursor: pointer
}

.checkbox {
  position: relative;
  height: 18px;
  width: 18px;
  background-color: var(--psa-white);
  border: 1px solid var(--psa-black-c8);
  transition: all .15s;
  border-radius: 3px
}

.option input:focus-visible~.checkbox {
  border: 1px solid var(--psa-aladaam)
}

.option:hover input~.checkbox {
  border: 1px solid var(--psa-aladaam)
}

.checkboxAnime1:after {
  content: "";
  position: absolute;
  top: 9px;
  left: 2px;
  width: 0;
  height: 0;
  border: solid var(--psa-dune);
  border-width: 2px 2px 0 0;
  opacity: 0;
  transform-origin: left top;
  transform: scaleX(-1) rotate(135deg);
  transition: width .08s ease 0.1s, height .1s ease, border-color .3s ease, opacity .1s ease 0.2s, border-width .1s ease
}

.option input:checked~.checkboxAnime1:after {
  opacity: 1;
  width: 6px;
  height: 11px;
  border-color: var(--psa-white);
  transition: width .1s ease, height .08s ease 0.1s, border-color .3s ease, border-width .1s ease
}

.option input:checked~.checkbox {
  background: var(--psa-aladaam);
  border-color: var(--psa-aladaam)
}

span.label-text {
  width: calc(100% - 46px)
}

.checkboxAnime2:after {
  content: "";
  position: absolute;
  top: 14px;
  left: 12px;
  width: 0;
  height: 0;
  border: solid;
  border-width: 2px 2px 0 0;
  opacity: 0;
  transform: scaleX(-1) rotate(135deg);
  animation: unchecked .15s ease-in
}

.option input:checked~.checkboxAnime2:after {
  opacity: 1;
  top: 2px;
  left: 8px;
  width: 10px;
  height: 18px;
  border-color: var(--psa-aladaam);
  transform: scaleX(-1) rotate(135deg);
  animation: checked .3s
}

.checkboxes-container .option {
  width: calc(50% - 1rem)
}

@keyframes checked {
  0% {
    top: 2px;
    left: 8px;
    width: 0;
    height: 0;
    opacity: 0;
    border-color: var(--color-secondary);
    transform: scaleX(-1) rotate(135deg)
  }

  10% {
    width: 2px;
    height: 18px
  }

  50% {
    border-color: var(--color-secondary);
    transform: scale(300%) scaleX(-1) rotate(135deg)
  }

  100% {
    width: 10px;
    height: 18px;
    opacity: 1;
    border-color: var(--psa-aladaam);
    transform: scale(100%) scaleX(-1) rotate(135deg)
  }
}

@keyframes unchecked {
  0% {
    top: 2px;
    left: 8px;
    width: 10px;
    height: 18px;
    opacity: 1;
    border-width: 2px 2px 0 0;
    border-color: var(--psa-aladaam)
  }

  20% {
    opacity: 1
  }

  50% {
    opacity: .1
  }

  100% {
    top: -15px;
    left: 0;
    width: 30px;
    height: 40px;
    border-width: 15px 15px 0 0;
    opacity: 0
  }
}

.psa-services-form .form-label {
  font-size: 20px;
  font-family: var(--psa-primary-font)
}

.radio-container {
  display: flex;
  align-items: center;
  gap: .5rem
}

.radio-container .options {
  margin-right: 2rem
}

.custom-radio:checked,
.custom-radio:not(:checked) {
  position: absolute;
  left: -9999px
}

.custom-radio:checked+label,
.custom-radio:not(:checked)+label {
  position: relative;
  padding-left: 28px;
  cursor: pointer;
  line-height: 20px;
  display: inline-block;
  color: var(--psa-black-28)
}

.custom-radio:checked+label:before,
.custom-radio:not(:checked)+label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  border: 1px solid var(--psa-black-c8);
  border-radius: 100%;
  background: #fff
}

.custom-radio:checked+label:after,
.custom-radio:not(:checked)+label:after {
  content: '';
  width: 12px;
  height: 12px;
  background: var(--psa-aladaam);
  position: absolute;
  top: 3px;
  left: 3px;
  border-radius: 100%;
  -webkit-transition: all .2s ease;
  transition: all .2s ease
}

.custom-radio:not(:checked)+label:after {
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0)
}

.custom-radio:checked+label:after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1)
}

.custom-radio:checked+label:before {
  border-color: var(--psa-aladaam)
}

@media(max-width:1100px) {
  .checkboxes-container .option {
    width: 100%
  }

  .over-banner-content {
    margin-top: -23rem
  }
}

@media(max-width:825px) {
  .col-md-6.column-6 {
    width: 50%
  }

  .radio-container {
    flex-direction: column;
    align-items: flex-start
  }
}

@media(max-width:767px) {
  .col-md-1.column-0 {
    display: none
  }

  .col-md-6.column-6 {
    width: 100%;
    border-top: 2px dashed var(--psa-black-d8);
    margin-top: 1rem
  }

  .over-banner-content {
    margin-top: -28rem;
    padding: 1rem
  }
}

.search-bg {
  background-image: url(../../images/search-banner.svg);
  background-position: bottom left
}

.ba-line {
  display: flex;
  flex-direction: row;
  justify-content: center;
  text-align: center
}

.ba-line:before,
.ba-line:after {
  background-color: var(--psa-white);
  content: "";
  height: 2px;
  position: relative;
  top: .5em;
  width: 100px
}

.ba-line:before {
  margin-right: .35em
}

.ba-line:after {
  margin-left: .35em
}

.t-white {
  color: var(--psa-white)
}

.g-search-ctrl {
  padding-top: 1rem;
  padding-bottom: 1rem
}

.sr-content {
  margin-top: -25rem
}

.ms-ref-ctrl {
  background: var(--psa-white-ef);
  border-radius: 24px;
  padding: 24px;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center
}

.ms-srch-item {
  width: 95% !important;
  -webkit-box-shadow: 0 1px 5px 0 rgba(45, 62, 80, 0.15);
  -moz-box-shadow: 0 1px 5px 0 rgba(45, 62, 80, 0.15);
  box-shadow: 0 1px 5px 0 rgba(45, 62, 80, 0.15);
  padding: 1rem
}

.sr-searBox {
  width: 800px;
  margin: 1rem auto
}

.sr-searBox div {
  width: 100%
}

h3.ms-srch-ellipsis a {
  color: var(--psa-282828) !important
}

.ms-srch-result {
  background: var(--psa-white);
  padding: 2rem;
  border-radius: 24px;
  margin: 0;
  display: flex;
  flex-direction: column
}

.ms-srch-item-path {
  color: var(--psa-aladaam);
  width: 100% !important
}

.ms-srch-item-deepLinks ul {
  display: flex;
  width: auto;
  align-items: center;
  margin-right: 20px;
  position: relative
}

.ms-srch-item-deepLinks-noPreview li {
  width: auto;
  display: flex;
  align-items: center;
  position: relative;
  overflow: visible
}

.ms-srch-item-deepLinks {
  display: flex;
  align-items: center
}

.ms-srch-item-deepLinks-noPreview li a {
  color: var(--psa-aladaam);
  font-weight: 500;
  font-family: var(--psa-primary-font);
  font-size: 16px;
  display: flex;
  align-items: center;
  position: relative
}

.ms-srch-item-summary {
  font-family: var(--psa-primary-font);
  font-size: 16px;
  line-height: 24px
}

.ms-srch-item-deepLinks li:first-child::after {
  content: '';
  height: 16px;
  width: 2px;
  display: flex;
  background: var(--psa-black-d8);
  position: absolute;
  top: 3px;
  right: -12px
}

.ms-srch-result-groups {
  margin: 0
}

.ms-srch-result #Paging {
  margin: 1rem 0
}

.sr-sbLarge {
  padding: .5rem;
  border-radius: revert-layer
}

.sr-sbLarge>.ms-srch-sb-searchLink:before {
  content: '';
  background: var(--psa-black-c8);
  height: 28px;
  width: 1px;
  display: block;
  position: absolute;
  left: -10px
}

.sr-sbLarge>.ms-srch-sb-searchLink {
  display: flex;
  align-items: center;
  position: relative;
  overflow: visible
}

.sr-sbLarge>input {
  padding-right: 1.5rem
}

.sr-sbLarge .ms-srch-sb-searchLink:active,
.sr-sbLarge .ms-srch-sb-searchLink:hover {
  background: transparent
}

.sr-sbLarge .ms-srch-sb-searchLink:hover img {
  transform: scale(1.2)
}

.ms-ref-ctrl .ms-disabled.ms-alignCenter {
  font-size: 24px;
  font-family: var(--psa-primary-font);
  font-weight: 300;
  color: var(--psa-black-a8)
}

.ms-ref-refiner {
  width: 100%
}

.ms-srch-item-deepLinks ul:not(:first-child):before {
  content: '';
  height: 16px;
  width: 2px;
  display: flex;
  background: var(--psa-black-d8);
  position: absolute;
  top: 50%;
  left: -12px;
  transform: translateY(-50%)
}

.ms-srch-resultscount {
  color: var(--psa-black-38);
  font-size: 20px;
  font-family: var(--psa-primary-font);
  margin-bottom: 1rem
}

.showingResults {
  color: var(--psa-aladaam);
  font-size: 20px;
  font-family: var(--psa-primary-font);
  text-align: center;
  margin-bottom: 1rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto
}

.showingResults:before,
.showingResults:after {
  content: '';
  height: 1px;
  width: 100px;
  margin-left: .5rem;
  margin-right: .5rem;
  display: flex;
  background: var(--psa-aladaam);
  position: relative
}

.showingResults:before {
  left: 0
}

.showingResults:after {
  right: 0
}

.search-keyword {
  font-weight: 600;
  margin-left: .25rem
}

.ms-srch-hover-outerContainer {
  right: 0 !important;
  left: auto !important
}

.ms-promlink-button,
.ms-promlink-button-enabled {
  background: transparent;
  border: 0;
  width: 56px;
  height: 18px;
  display: flex;
  padding: 0
}

.ms-srch-pagingNext,
.ms-srch-pagingPrev {
  position: inherit
}

.ms-srch-result #Paging {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 1rem 0;
  direction: ltr
}

.ms-srch-result #PagingLink a {
  font-family: var(--psa-primary-font);
  font-size: 16px;
  padding: .25rem 1rem;
  color: var(--psa-black-48);
  position: initial
}

.ms-srch-result #Paging li#PagingSelf a,
.ms-srch-result #Paging li#PagingLink a {
  top: 0;
  font-family: var(--psa-primary-font);
  font-size: 16px;
  border-radius: 5rem;
  width: 32px;
  height: 32px;
  position: initial;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: .25rem;
  margin-right: .25rem
}

.ms-srch-result #Paging li#PagingSelf a {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

.ms-srch-result #Paging li#PagingLink a {
  background: transparent;
  color: var(--psa-black-58)
}

.ms-srch-result #Paging li#PagingLink a:hover {
  background: var(--psa-white-ef);
  color: var(--psa-aladaam)
}

.ms-srch-result #Paging a#PageLinkPrev:hover {
  background: transparent;
  transform: translateX(-10px)
}

.ms-srch-result #Paging a#PageLinkNext:hover {
  background: transparent;
  transform: translateX(10px)
}

.ms-qSuggest-container {
  width: auto !important
}

.ms-ref-refinername:link,
.ms-ref-refinername:visited {
  width: 100%;
  font-family: var(--psa-primary-font);
  font-size: 20px;
  color: var(--psa-black-28);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0
}

.ms-ref-refiner #Container {
  border-bottom: 1px dashed var(--psa-black-c8);
  padding: 0;
  margin-bottom: 0;
  padding-top: 1rem;
  padding-bottom: 1rem
}

.ms-ref-refiner:nth-child(3) #Container {
  border: 0
}

div#Container>a.ms-ref-refinername>div.ms-displayInlineBlock {
  width: calc(100% - 24px)
}

.ms-ref-uparrow,
.ms-ref-downarrow {
  width: 24px;
  height: 24px;
  margin-top: 0;
  margin-bottom: 5px;
  transition: all .3s ease-in;
  float: n
}

.ms-ref-refinername:hover>.ms-ref-uparrow,
.ms-ref-downarrow {
  background: url(../../images/accord-arrow-up.svg)
}

.ms-ref-uparrow {
  background: url(../../images/accord-arrow-down.svg);
  display: flex
}

.ms-ref-name {
  color: var(--psa-black-38);
  padding-top: .2rem;
  padding-bottom: .2rem
}

div#unselShortList {
  padding-top: .5rem
}

.ms-ref-unsel-toggle {
  font-family: var(--psa-primary-font);
  margin-top: 1rem;
  background: var(--psa-white);
  padding: .5rem 1rem .25rem;
  width: 100%;
  text-align: center;
  border-radius: 3px
}

.ms-ref-unsel-toggle:hover {
  color: var(--psa-white);
  background: var(--psa-skyline)
}

.slider_extent_label_section {
  width: 100%;
  color: var(--psa-black-48);
  font-family: var(--psa-primary-font)
}

.ajax__multi_slider_default .outer_rail_horizontal {
  width: 100% !important;
  display: flex;
  align-items: center
}

.ajax__multi_slider_default .handle_horizontal_left,
.ajax__multi_slider_default .handle_horizontal_right,
.ajax__multi_slider_default .handle_forcepressed,
.ajax__multi_slider_default .handle_noforcepressed {
  background: var(--psa-skyline);
  border: 0;
  border-radius: 5px
}

.ajax__multi_slider_default .inner_rail_horizontal {
  height: 4px;
  background: var(--psa-skyline);
  border: var(--psa-skyline)
}

.slider_tick_active {
  background: var(--psa-white);
  border: var(--psa-white)
}

.ajax__multi_slider_default .outer_rail_horizontal {
  background: #C3CBD4;
  border: #C3CBD4
}

.ms-ref-ctrl .ms-ref-selSec .ms-ref-filterSel,
.ms-ref-ctrl .ms-ref-allSec .ms-ref-filterSel,
.handle_label {
  color: var(--psa-aladaam);
  font-family: var(--psa-primary-font)
}

.ms-srch-item-summary .ms-srch-item-highlightedText {
  color: var(--psa-black-38);
  font-size: 20px;
  font-weight: 600
}

.statistical-calendar {
  padding-top: 2rem;
  border-bottom: 1px dashed var(--psa-black-d8);
  padding-bottom: 2rem;
  margin-bottom: 2rem
}

.sc-banner {
  background-image: url(../../images/statisticalCalender-banner.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 422px;
  min-height: 100%;
  border-radius: 12px
}

.sc-calendar-container {
  width: calc(100% - 362px);
  margin-left: -60px;
  background: var(--psa-white-f8);
  padding: 2rem;
  margin-top: 2rem;
  margin-bottom: 2rem
}

.sc-calendar-month {
  padding-top: 1.8rem;
  padding-bottom: 1rem
}

.sc-month-events {
  border-top: 1px dashed #b8b8b8;
  padding-top: 1rem
}

a.sc-month {
  background: var(--psa-white);
  display: flex;
  margin-bottom: 1rem;
  padding: .5rem 1rem;
  color: var(--psa-black-48);
  border-radius: 5px;
  font-family: var(--psa-primary-font);
  font-size: 20px
}

a.sc-month:before {
  content: '';
  background: url(../../images/sc-calendar.svg);
  height: 24px;
  width: 24px;
  display: block;
  margin-right: .35rem;
  transition: all .2s ease-in
}

a.sc-month:hover,
a.sc-month.active {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

a.sc-month:hover:before,
a.sc-month.active:before {
  background: url(../../images/sc-calendar-alt.svg)
}

.sc-month-events h2 {
  font-size: 28px
}

.sc-event-list {
  height: 375px;
  overflow-y: auto;
  overflow-x: hidden
}

.sc-item {
  border: 1px solid var(--psa-white-ef);
  border-radius: 10px;
  padding: .5rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .5rem;
  background: var(--psa-white);
  height: calc(100% - .5rem)
}

.sc-item:hover {
  background: #EFF5F8;
  border-color: #CBE3EF;
  transform: scale(1.01);
  box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1)
}

.col-md-6:nth-child(odd) .sc-item:hover {
  transform: translateX(5px)
}

.col-md-6:nth-child(even) .sc-item:hover {
  transform: translateX(-5px)
}

.sc-name {
  display: flex;
  align-items: center;
  width: 100%
}

.sc-name:before {
  content: '';
  background-image: url(../../images/statistics/book-reader.svg);
  height: 36px;
  width: 36px;
  display: flex;
  margin-right: .5rem
}

.sc-name .title {
  width: calc(100% - 48px);
  color: var(--psa-black-48);
  font-weight: 400;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

@keyframes fadeIn {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes fadeOut {
  from {
    opacity: 1
  }

  to {
    opacity: 0
  }
}

.scMonthLists.hide {
  display: none;
  animation: fadeOut .5s ease-in-out;
  animation-fill-mode: forwards
}

.scMonthLists {
  animation: fadeIn .5s ease-in-out;
  animation-fill-mode: forwards
}

#selectedMonth,
#currentYear {
  animation: fadeIn .5s ease-in-out;
  animation-fill-mode: forwards
}

.chart-topic {
  font-size: 18px;
  color: var(--psa-black-68);
  font-weight: 400;
  line-height: 22px
}

.sc-even-chart {
  height: auto
}

.sc-event-indicators {
  padding-top: 2rem
}

.sc-indicator-grp .card.card.flat-type {
  background-color: var(--psa-white-f8);
  height: calc(100% - 24px)
}

.sc-month span {
  width: calc(100% - 28px);
  transition: none
}

.monthColumn {
  margin-top: var(--bs-gutter-y);
  flex: 0 0 auto;
  padding-right: calc(var(--bs-gutter-x)* .5)
}

.sc-event-details .secondary-bg.news-right {
  height: 100%;
  padding: 1rem
}

.sc-news .related-news .news-content h3 a {
  color: var(--psa-white)
}

.sc-news .related-news .tag {
  display: none
}

.sc-news .related-news .calendar-io {
  background: url(../../images/news-calendar-icon-alt.svg)
}

.sc-news .related-news .primaryBtn {
  background: var(--psa-white);
  color: var(--psa-aladaam) !important;
  border-color: transparent;
  width: 100%;
  text-align: center;
  justify-content: center;
  margin-top: 1rem
}

@media(min-width:1281px) {
  .monthColumn {
    width: 16.66666667%
  }
}

@media(min-width:1024px) and (max-width:1280px) {
  .monthColumn {
    width: 25%
  }
}

@media(min-width:420px) and (max-width:1023px) {
  .monthColumn {
    width: 50%
  }
}

@media(max-width:1200px) {
  .sc-banner {
    width: 300px
  }

  .sc-calendar-container {
    width: calc(100% - 240px)
  }
}

@media(max-width:767px) {
  .sc-banner {
    display: none
  }

  .sc-calendar-container {
    width: 100%;
    margin: 0;
    padding: 2rem 1rem
  }

  .sc-event-list {
    height: auto
  }
}

#qms .btnGroup {
  margin-top: 1.5rem
}

.qms-date {
  color: var(--psa-black-48);
  margin-bottom: 1rem;
  font-family: var(--psa-primary-font);
  font-size: 20px
}

.total-population {
  font-family: var(--psa-primary-font)
}

.qms-indicators {
  align-items: center;
  justify-content: space-between;
  display: flex
}

.total-pop .qms-tp-value {
  font-size: 4.5vw;
  color: var(--psa-aladaam);
  line-height: 4.5vw;
  margin-top: 1rem;
  margin-right: 1rem
}

.diff-value {
  font-size: 36px;
  line-height: 36px;
  margin-right: .5rem;
  margin-top: .65rem;
  display: flex;
  align-items: center
}

.qms-gender .qms-tp-value {
  font-size: 50px;
  color: var(--psa-black-28);
  line-height: 50px;
  margin-top: 1.5rem
}

.qms-gender-content {
  width: calc(60% - 2rem)
}

.qms-gender-pie {
  width: calc(100% - 40%);
  padding: .5rem 3rem .5rem 1rem
}

.qms-male .qms-gender-pie {
  padding: .5rem 1rem .5rem 3rem
}

.qms-flat-card {
  padding: 1rem;
  background: var(--psa-white);
  height: 100%
}

#qms .diff-arrow {
  display: flex;
  align-items: center;
  font-size: 24px
}

.difference {
  display: flex;
  align-items: center;
  justify-content: center
}

.total-pop {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 2rem
}

.circle-chart {
  width: 100%;
  height: 100%
}

.circle-chart__circle {
  stroke-width: 1;
  stroke-linecap: square;
  fill: none;
  animation: circle-chart-fill 2s reverse;
  transform: rotate(-90deg);
  transform-origin: center
}

.circlechart {
  position: relative
}

.gender-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.circle-chart__circle--negative {
  transform: rotate(-90deg) scale(1, -1)
}

.circle-chart__background {
  stroke: #efefef;
  stroke-width: .5;
  fill: none
}

.male-stroke {
  stroke: #3D4CCE
}

.female-stroke {
  stroke: #E850AB
}

@keyframes circle-chart-fill {
  to {
    stroke-dasharray: 0 100
  }
}

@keyframes circle-chart-appear {
  to {
    opacity: 1;
    transform: translateY(0)
  }
}

.circle-chart__background {
  stroke: #ccc;
  stroke-width: .5
}

.qms-gender {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.total-pop .difference {
  flex-direction: column;
  align-items: flex-start
}

.qms-male .difference {
  flex-direction: row-reverse
}

.qms-male .diff-value {
  margin-right: 0;
  margin-left: .5rem
}

.diff-text {
  font-family: var(--psa-body-font)
}

@media(max-width:1300px) and (min-width:993px) {
  .qms-gender .qms-tp-value {
    font-size: 36px;
    line-height: 36px
  }

  .total-pop {
    padding: 0 1rem
  }

  .qms-gender-pie {
    padding: .5rem 2rem .5rem 1rem;
    width: calc(100% - 30%)
  }

  .qms-male .qms-gender-pie {
    padding: .5rem 1rem .5rem 2rem
  }

  .qms-gender-content {
    width: 70%
  }

  .diff-value {
    font-size: 26px;
    line-height: 26px
  }

  .diff-text {
    font-size: 14px
  }
}

@media(max-width:1024px) and (min-width:993px) {
  .total-pop .difference {
    flex-direction: row;
    align-items: center
  }

  .qms-indicators {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start
  }

  .total-pop .qms-tp-value {
    margin-right: 0
  }

  .qms-male .difference {
    flex-direction: column;
    align-items: flex-end
  }

  .diff-value {
    margin-top: .25rem
  }

  .difference {
    flex-direction: column;
    align-items: flex-start
  }

  .qms-gender .qms-tp-value {
    margin-top: .75rem
  }
}

@media(max-width:992px) {
  .qms-gender {
    flex-direction: column;
    justify-content: center
  }

  .qms-indicators {
    flex-direction: column
  }

  .qms-gender-content {
    width: 100%;
    text-align: center !important
  }

  .difference {
    flex-direction: row !important;
    align-items: center !important
  }

  .qms-male .diff-value {
    margin-right: .5rem
  }

  .diff-value {
    margin-top: .5rem
  }

  .qms-gender-pie,
  .qms-male .qms-gender-pie {
    padding: .5rem 0
  }

  .qms-gender .qms-tp-value {
    font-size: 36px
  }

  .diff-value {
    font-size: 22px
  }

  .diff-text {
    text-align: left
  }
}

@media(max-width:767px) {
  .total-population h3 {
    font-size: calc(1.4rem + .2vw)
  }

  .qms-gender-pie {
    width: 150px
  }

  .qms-flat-card {
    height: calc(100% - 24px);
    text-align: center
  }

  .total-pop {
    padding: 1rem 0
  }

  .qms-tp-value {
    margin-top: .75rem !important;
    line-height: 36px !important
  }

  .qms-gender {
    padding-bottom: 1rem
  }

  .qms-gender.qms-female {
    flex-direction: column-reverse
  }

  .total-pop .qms-tp-value {
    font-size: calc(1.5rem + 7vw);
    line-height: 42px
  }
}

#pag-right {
  display: flex;
  justify-content: center;
  align-items: center
}

.pag-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap
}

.pag-wrapper {
  border: 1px dashed var(--psa-dune);
  border-radius: 0 7rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  font-family: var(--psa-primary-font);
  color: var(--psa-black-38);
  background: var(--psa-white)
}

#pag-right .col-md-6:first-child .pag-wrapper,
#pag-right .col-md-6:last-child .pag-wrapper {
  background: var(--psa-dune);
  color: var(--psa-white)
}

#pag-right .col-md-6:nth-child(2) .pag-wrapper,
#pag-right .col-md-6:nth-child(3) .pag-wrapper {
  border-radius: 7rem 0
}

.pag-indicators {
  display: flex;
  align-items: center;
  margin-top: 1rem
}

.pag-title {
  font-size: 24px;
  transition: none
}

.pag-subtitle {
  font-size: 20px;
  line-height: 20px
}

.indicator-value {
  font-size: calc(1.3rem + .6vw)
}

.indicator-percentage {
  font-size: calc(1.1rem + .6vw);
  line-height: 28px;
  font-weight: 500
}

.pag-legend-circle {
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 100%;
  margin-top: .1rem
}

.pag-legend-circle.male {
  background-color: var(--psa-male)
}

.pag-legend-circle.female {
  background-color: var(--psa-female)
}

ul.pag-legend {
  margin: 0;
  padding: 0;
  list-style: none
}

li.pag-legend-item {
  display: flex;
  align-items: center
}

span.pag-egend-label {
  font-size: 14px;
  margin-left: .25rem
}

.pag-indicator-icon {
  width: 80px;
  height: 80px;
  display: flex;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.lessthan15 {
  background-image: url(../../images/qms/lessthan15-alt.svg)
}

.between15to24 {
  background-image: url(../../images/qms/between15to24.svg)
}

.between25to64 {
  background-image: url(../../images/qms/between25to64.svg)
}

.above65 {
  background-image: url(../../images/qms/above65-alt.svg)
}

@media(max-width:1200px) {

  #pag-left,
  #pag-right {
    width: 100%
  }

  .pag-row .col-md-6 {
    width: 50%
  }

  .pag-wrapper {
    background: var(--psa-dune) !important;
    color: var(--psa-white) !important;
    border: 1px solid var(--psa-white);
    border-radius: .5rem !important;
    flex-direction: row;
    padding: 1rem
  }

  .pag-title {
    line-height: 24px;
    margin-bottom: .5rem
  }

  .pag-row {
    margin-top: 2rem
  }

  .pag-indicators {
    margin-top: 0
  }

  .above65 {
    background-image: url(../../images/qms/above65-alt.svg)
  }

  .between15to24 {
    background-image: url(../../images/qms/between15to24-alt.svg)
  }

  .between25to64 {
    background-image: url(../../images/qms/between25to64-alt.svg)
  }
}

@media(max-width:640px) {
  .pag-row .col-md-6 {
    width: 100%
  }
}

@media(max-width:375px) {
  .pag-wrapper {
    flex-direction: column !important;
    align-items: flex-start
  }

  .pag-header {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap
  }

  .pag-indicators {
    justify-content: space-between;
    display: flex;
    width: 100%
  }

  .pag-title {
    margin-bottom: 0
  }
}

.mdbd {
  padding-bottom: 4rem;
  padding-top: 1.5rem
}

#qms .card.solid {
  height: calc(100% - 24px);
  margin-bottom: 0;
  display: flex;
  justify-content: center
}

#qms .data-values {
  color: var(--psa-black-28)
}

.date-as-on {
  color: var(--psa-black-48);
  font-family: var(--psa-primary-font);
  font-size: 16px;
  line-height: 16px
}

.data-diff {
  font-family: var(--psa-primary-font);
  font-weight: 500;
  font-size: 20px
}

#qms h2 {
  font-size: calc(1.315rem + .8vw);
  line-height: calc(1.3rem + .8vw)
}

#qms h3 {
  font-size: calc(1.3rem + .4vw)
}

@media(max-width:1150px) {
  .data-diff {
    font-size: 18px
  }
}

@media(max-width:1024px) {

  .md-wrapper .col-lg-6.col-md-12.col-sm-6,
  .bd-wrapper .col-lg-6.col-md-12.col-sm-12 {
    width: 100%
  }

  .mdbd .qms-content {
    margin-bottom: 1.5rem
  }

  .bd-wrapper .qms-data-group {
    flex-wrap: nowrap !important
  }
}

@media(max-width:767px) {
  .mdbd {
    padding-bottom: 1rem
  }

  .card.solid {
    height: auto !important;
    margin-bottom: 1.5rem !important
  }

  .md-wrapper .col-lg-6.col-md-12.col-sm-6,
  .bd-wrapper .col-lg-6.col-md-12.col-sm-12 {
    width: 50%
  }

  .bpre-wrapper .curved-card {
    height: calc(100% - 24px) !important;
    margin-top: 24px
  }
}

@media(max-width:600px) {
  .bd-wrapper .col-lg-6.col-md-12.col-sm-12 {
    width: 100%
  }
}

@media(max-width:480px) {
  .md-wrapper .col-lg-6.col-md-12.col-sm-6 {
    width: 100%
  }
}

.qms-flex {
  display: flex;
  align-items: center
}

.qms-eco-aladaam {
  background: var(--psa-aladaam);
  color: var(--psa-white);
  border-radius: .5rem;
  padding: 2rem 1rem
}

.qms-eco-aladaam h2,
.qms-eco-aladaam .date-as-on {
  color: var(--psa-white)
}

.gray-bg .qms-content {
  color: var(--psa-black-28)
}

.qms-economic {
  padding-top: 6rem;
  padding-bottom: 2rem
}

.millionQR::after {
  content: 'Million QR';
  color: var(--psa-black-48)
}

.thousandTon::after {
  content: 'Thousand Ton';
  color: var(--psa-black-48)
}

.properties::after {
  content: 'Properties';
  color: var(--psa-black-48)
}

.bpre-flex {
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.bp-idicators {
  margin-right: 1.5rem
}

.bpre-wrapper {
  margin-top: -5rem
}

.bpre-wrapper .curved-card {
  height: 100%
}

.bpre-wrapper .card-numbers {
  color: var(--psa-aladaam)
}

@media(max-width:1100px) {
  .qms-flex {
    flex-wrap: wrap;
    justify-content: center
  }

  .bpre-wrapper .qms-icon {
    margin-bottom: 1rem
  }
}

@media(max-width:767px) {
  .qms-economic {
    padding-top: 2rem
  }

  .bpre-wrapper {
    margin-top: 0
  }
}

.eServices-item {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between
}

.es-item-title {
  font-family: var(--psa-primary-font);
  font-size: 20px;
  font-weight: 500;
  margin-top: .5rem
}

.es-item-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1rem
}

.eServices-item-col {
  padding-right: 30px;
  padding-left: 30px;
  position: relative
}

.eServices-item-col:nth-child(2) {
  padding-left: 15px !important
}

.eServices-item-col:last-child {
  padding-right: 15px
}

.eServices-item-col:after {
  content: '';
  width: 1px;
  height: 100%;
  background: transparent;
  border: 1px dashed var(--psa-black-d8);
  display: flex;
  position: absolute;
  top: 0;
  right: 0
}

.eServices-item-col:last-child:after {
  display: none
}

.gwh::after {
  content: 'GWh'
}

.thousandQR::after {
  content: 'Thousand QR'
}

.br-10 {
  border-radius: 10px !important
}

.thousandm {
  display: flex;
  align-items: start
}

.thousandm span {
  font-size: 14px;
  white-space: nowrap
}

.thousandm span::before {
  content: 'Thousand m';
  margin-left: .25rem
}

.thousandm span sup {
  display: none1
}

.ew-col .qms-icon {
  margin-right: 0
}

.es-item-flex .data {
  margin-right: 1rem
}

@media(max-width:1150px) {
  .ew-col {
    width: 100%
  }
}

@media(max-width:991px) {
  .eServices-item-col:nth-child(even) {
    padding-left: 15px !important;
    border-right: 1px dashed var(--psa-black-d8)
  }

  .eServices-item-col:nth-child(odd) {
    padding-right: 15px !important
  }

  .eServices-item-col:after {
    display: none
  }

  .eServices-item-col {
    border-bottom: 1px dashed var(--psa-black-d8);
    padding-bottom: 1.5rem;
    padding-top: 1rem
  }

  .eServices-item-col:nth-child(4),
  .eServices-item-col:nth-child(5) {
    border-bottom: 0
  }
}

@media(max-width:1200px) and (min-width:992px), (max-width:375px) {
  .es-item-flex {
    flex-direction: column;
    align-items: center
  }

  .es-item-flex .data {
    margin-bottom: 1rem
  }

  .eServices-item {
    align-items: center;
    text-align: center
  }
}

@media(max-width:767px) {
  .eServices-item-col {
    border-right: 0 !important;
    border-bottom: 1px dashed var(--psa-black-d8) !important;
    padding-left: 15px !important;
    padding-right: 15px !important
  }

  .eServices-item-col:last-child {
    border-bottom: 0 !important
  }

  .ew-col {
    width: 50%
  }

  .qms-flex {
    flex-wrap: nowrap
  }
}

@media(max-width:580px) {
  .ew-col {
    width: 100%
  }
}

@media(max-width:375px) {
  .qms-flex {
    flex-wrap: wrap
  }
}

.h-200 {
  height: 200px
}

@media(max-width:1250px) {
  .tac-col {
    width: 100%
  }
}

.qms-transport-aladaam {
  background: var(--psa-aladaam);
  color: var(--psa-white);
  border-radius: .5rem;
  height: 200px
}

.qms-transport-aladaam h2,
.qms-transport-aladaam .date-as-on {
  color: var(--psa-white)
}

.qms-aladaam-title {
  padding: 2rem
}

.transport-col {
  margin-top: 2rem
}

.qms-transport-aladaam {
  margin-bottom: 3.5rem
}

@media(min-width:1250px) and (max-width:1558px) {
  .qms-transport-aladaam {
    margin-bottom: 5rem
  }
}

@media(max-width:1250px) {
  .qms-transport-aladaam {
    height: auto;
    background: transparent;
    border-radius: 0;
    margin-bottom: 0
  }

  .qms-aladaam-title {
    background: var(--psa-aladaam);
    color: var(--psa-white);
    border-radius: .5rem
  }

  .transport-col {
    margin-top: 24px
  }

  .tv-col {
    width: 66.66666667%
  }

  .vm-col {
    width: 33.33333333%
  }
}

@media(max-width:1080px) and (min-width:767px) {
  .transport-col .tac-qms .qms-data-group .data {
    width: 50%;
    margin-bottom: 1rem
  }
}

@media(max-width:767px) {

  .tv-col,
  .vm-col {
    width: 100%
  }
}

@media(max-width:480px) {
  .transport-col .tac-qms .qms-data-group .data {
    display: flex;
    align-items: center;
    flex-direction: column;
    border-bottom: 1px dashed var(--psa-black-d8);
    padding-bottom: 1.5rem
  }

  .transport-col .tac-qms .qms-data-group .data:last-child {
    border: 0
  }
}

.qms-visitors h3 {
  font-size: calc(1.3rem + .28vw) !important
}

.para-with-icon {
  display: flex;
  align-items: center;
  line-height: 28px;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.para-with-icon p {
  font-size: 18px
}

.visitor-icon {
  padding-right: 1rem
}

.qms-visitors .card.dahsed {
  display: flex;
  align-items: flex-start;
  justify-content: space-between
}

.linebar-group {
  width: 100%
}

.linebar-values {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--psa-primary-font)
}

.linebar-data {
  font-size: calc(1.3rem + .28vw)
}

.linebar-percentage {
  font-size: calc(1rem + .21vw)
}

.linebar {
  height: 10px;
  position: relative;
  background: var(--psa-white-ef);
  border-radius: 8px
}

.linebar>span {
  display: block;
  height: 100%;
  background-color: var(--psa-aladaam);
  position: relative;
  overflow: hidden;
  border-radius: 20px 8px 8px 20px;
  -webkit-border-radius: 20px 8px 8px 20px;
  -moz-border-radius: 20px 8px 8px 20px
}

.linebar>span:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
  -webkit-background-size: 20px 20px;
  -moz-background-size: 20px 20px;
  background-size: 20px 20px;
  -webkit-animation: move 2s linear infinite;
  overflow: hidden;
  border-radius: 20px 8px 8px 20px;
  -webkit-border-radius: 20px 8px 8px 20px;
  -moz-border-radius: 20px 8px 8px 20px
}

@-webkit-keyframes move {
  0% {
    background-position: 0 0
  }

  100% {
    background-position: 30px 30px
  }
}

@-moz-keyframes move {
  0% {
    background-position: 0 0
  }

  100% {
    background-position: 30px 30px
  }
}

@media(max-width:1100px) {
  .visitors-col {
    width: 100%
  }

  .visitors-col:last-child {
    margin-top: 2rem
  }
}

@media(max-width:480px) {
  .para-with-icon {
    flex-direction: column
  }

  .visitor-icon {
    padding-bottom: 1rem
  }
}

.contact-list {
  padding-top: 2rem
}

.contact-item {
  margin-bottom: 24px;
  padding: 24px;
  background-color: var(--psa-white)
}

.contact-icon-title {
  display: flex;
  align-items: center
}

h2.underlined {
  margin: 0
}

.contact-icon-title h3 {
  font-size: 20px;
  margin: 0
}

.contact-body {
  padding: .35rem 0 0;
  font-size: 16px
}

.office-location {
  background-image: url(../../images/location.svg)
}

.office-email {
  background-image: url(../../images/email-envelope.svg)
}

.office-phone {
  background-image: url(../../images/office-phone.svg)
}

.office-hours {
  background-image: url(../../images/workinghours.svg)
}

.contact-body a {
  color: var(--ps-black-28)
}

.contact-body a:hover {
  text-decoration: underline !important;
  color: var(--psa-aladaam)
}

.contact-flex {
  display: flex;
  align-items: center
}

.contact-flex span {
  padding-right: 24px;
  display: flex;
  align-items: center;
  position: relative
}

.contact-flex span:after {
  content: '';
  height: 16px;
  width: 2px;
  background: var(--psa-black-88);
  display: flex;
  position: absolute;
  top: 50%;
  right: 11px;
  transform: translateY(-50%)
}

.contact-flex span:last-child:after {
  display: none
}

@media(min-width:768px) and (max-width:1380px), (max-width:500px) {
  .contact-flex {
    flex-direction: column;
    align-items: flex-start
  }

  .contact-flex span:after {
    display: none
  }

  .contact-flex span {
    display: flex;
    margin-top: .5rem
  }
}

.paging-container {
  display: flex;
  align-items: center;
  justify-content: center
}

ul.paging {
  list-style: none;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0
}

.paging-wrapper>span {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1.5rem
}

.paging-prev:hover {
  transform: translateX(-10px)
}

.paging-next:hover {
  transform: translateX(10px)
}

.paging-prev img,
.paging-next img {
  transform: rotate(0deg)
}

.paging-prev .disabled,
.paging-next .disabled,
.paging-prev[disabled="disabled"],
.paging-next[disabled="disabled"] {
  filter: grayscale(100%);
  opacity: .3;
  pointer-events: none;
  margin-right: 1rem
}

.paging-next .disabled {
  margin-left: 1rem
}

.paging-prev .disabled {
  margin-right: 1rem
}

.page-count a,
a.page-count,
.page-active {
  font-family: var(--psa-primary-font);
  font-size: 16px;
  border-radius: 5rem;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: .25rem;
  margin-right: .25rem;
  background: transparent;
  color: var(--psa-black-58)
}

.page-count a:hover,
a.page-count:hover {
  background: var(--psa-white-ef);
  color: var(--psa-aladaam)
}

.page-count a.active,
.page-active {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

.events-wrapper {
  margin-top: -8rem
}

#event-intro {
  background: #fff;
  margin-top: -2.5rem;
  padding-top: 5rem
}

@media(max-width:1200px) {
  .events-wrapper {
    margin-top: 1.5rem
  }
}

.so-icon {
  height: 36px;
  width: 36px;
  display: flex;
  margin-right: .32rem;
  margin-bottom: .25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.so-date {
  background-image: url(../../images/events/events-date.svg)
}

.so-location {
  background-image: url(../../images/events/event-location.svg)
}

.so-speakers {
  background-image: url(../../images/events/speakers.svg)
}

.row.so-list {
  justify-content: center
}

.so-item {
  color: var(--psa-white);
  font-family: var(--psa-primary-font);
  width: 25%
}

.so-flex {
  display: flex;
  align-items: center;
  padding: 1rem 1.5rem;
  background: var(--psa-skyline);
  height: 100%
}

.so-content {
  padding-left: 1rem;
  width: calc(100% - 42px)
}

.so-title {
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 500
}

.so-desc {
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.so-endDate,
.so-startDate {
  padding-right: .5rem
}

.so-startDate:after {
  content: '-';
  margin-left: .5rem
}

.speaker-count {
  padding-right: .5rem
}

.ba-line-gray {
  display: flex;
  flex-direction: row;
  font-size: 20px;
  font-family: var(--psa-primary-font);
  color: var(--psa-black-68);
  text-align: left !important;
  justify-content: flex-start
}

.ba-line-gray:before,
.ba-line-gray:after {
  content: "";
  position: relative;
  top: .5em;
  background-color: var(--psa-black-68);
  top: .8rem;
  height: 1px;
  width: 50px
}

.ba-line-gray:before {
  margin-right: .35em
}

.ba-line-gray:after {
  margin-left: .35em
}

.highlighted-list ul {
  margin: 0;
  padding: 0;
  list-style: none
}

.highlighted-list ul li {
  position: relative;
  display: flex;
  align-items: flex-start;
  margin-top: .5rem
}

.highlighted-list ul li::before {
  content: "";
  width: 24px;
  height: 24px;
  background-image: url(../../images/listStyleType-1.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 10px;
  transform: rotate(0deg)
}

.hl-content {
  width: calc(100% - 24px)
}

.li-title {
  font-size: 20px;
  font-family: var(--psa-primary-font);
  color: var(--psa-aladaam);
  font-weight: 500
}

.event-intro-body .primaryBtn {
  border-radius: .25rem;
  font-size: 16px;
  font-family: var(--psa-primary-font);
  text-transform: uppercase;
  font-weight: 500
}

.curve-download-arrow {
  background-image: url(../../images/events/curve-download-alt.svg)
}

.primaryBtn:hover .curve-download-arrow {
  background-image: url(../../images/events/curve-download.svg)
}

@media(max-width:1200px) {
  .so-item {
    width: 33.33333333%
  }
}

@media(max-width:786px) and (min-width:681px) {
  .so-flex {
    flex-direction: column;
    justify-content: center
  }

  .so-content {
    padding: 0;
    text-align: center;
    justify-content: center;
    align-items: center
  }

  .so-desc {
    justify-content: center
  }

  .so-endDate,
  .so-startDate {
    padding: 0;
    margin: 0
  }

  .so-startDate:after {
    display: none
  }
}

@media(max-width:680px) {
  .so-item {
    width: 100%;
    margin-bottom: 12px
  }
}

.row-seperator-dashed {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 2px dashed var(--psa-black-d8)
}

.gray-title {
  font-size: 16px;
  color: var(--psa-black-68)
}

#event-tabs.nav-tabs .nav-link {
  font-size: 18px;
  border: 0;
  background: var(--psa-white-ef);
  color: var(--psa-black-58);
  margin-right: .5rem
}

#event-tabs.nav-tabs .nav-item.show .nav-link,
#event-tabs.nav-tabs .nav-link.active,
#event-tabs.nav-tabs .nav-link:focus,
#event-tabs.nav-tabs .nav-link:hover {
  background: var(--psa-skyline);
  color: var(--psa-white)
}

#event-tabs.nav-tabs .nav-link.active:after {
  display: none
}

.session-list {
  background: #F5F9FE;
  padding: 12px 24px 24px;
  height: 100%
}

.session-list a {
  color: var(--psa-aladaam);
  text-decoration: underline !important
}

.session-item {
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-family: var(--psa-primary-font)
}

.time-slot {
  display: flex;
  align-items: flex-start
}

.schedule-time {
  font-size: 15px;
  font-weight: 500;
  width: 125px;
  padding-top: .15rem
}

.schedule-content {
  width: calc(100% - 125px)
}

.schedule-time.simpleTime {
  width: 75px
}

.schedule-content.simpleTime {
  width: calc(100% - 75px)
}

.schedule-title {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: .5rem
}

.schedule-speakers {
  margin-bottom: .75rem
}

.speaker-name {
  font-size: 18px;
  line-height: 20px
}

.speaker-position {
  font-size: 14px;
  font-style: italic;
  font-family: var(--psa-body-font)
}

.schedule-speakers.inline {
  display: flex;
  align-items: center
}

.schedule-speakers.inline .speaker-name {
  font-size: 16px;
  font-weight: 600;
  margin-right: .35rem
}

@media(max-width:767px) {
  .schedule-speakers.inline {
    flex-wrap: wrap
  }
}

.session-item h3 {
  font-size: 26px;
  color: var(--psa-black)
}

.session-title {
  font-size: 18px;
  font-weight: 500;
  padding-top: .5rem;
  line-height: 20px;
  padding-bottom: .5rem
}

.session-moderator {
  font-family: var(--psa-body-font);
  margin-bottom: .75rem
}

.session-moderator .speaker-name {
  font-weight: 500;
  font-size: 16px;
  font-family: var(--psa-primary-font)
}

.es-content a.mobileTab {
  font-size: 22px
}

.es-content .tab-content>.active a.mobileTab {
  background: var(--psa-skyline) !important;
  margin: 0
}

.swiper {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: var(--psa-white);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%
}

.swiper-wrapper {
  height: 100%
}

.speaker-persona {
  text-align: center;
  overflow: hidden;
  position: relative;
  width: 96px
}

.speaker-persona .picture {
  display: inline-block;
  height: 90px;
  width: 90px;
  z-index: 1;
  position: relative
}

.speaker-persona .picture::before {
  content: "";
  width: 100%;
  height: 0;
  border-radius: 50%;
  background-color: var(--psa-dune);
  position: absolute;
  bottom: 135%;
  right: 0;
  left: 0;
  opacity: .9;
  transform: scale(3);
  transition: all .3s linear 0
}

.speaker-persona .picture::after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--psa-dune);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1
}

.speaker-persona .picture img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  transform: scale(1);
  transition: all .9s ease 0;
  font-size: 14px
}

.speaker-persona:hover .picture img {
  box-shadow: 0 0 0 4px #f7f5ec;
  transform: scale(0.85)
}

.speaker-card {
  border: 1px solid var(--psa-black-d8);
  border-radius: 3px;
  display: flex;
  align-items: center;
  padding: 1rem;
  min-height: 165px;
  width: 100%
}

.speaker-details {
  width: calc(100% - 96px);
  text-align: left;
  font-family: var(--psa-primary-font)
}

.speakerSwiper .speaker-name {
  padding: 0 1rem;
  font-weight: 500
}

.speakerSwiper .speaker-position {
  font-style: normal;
  padding: .25rem 1rem
}

.plainBtn {
  background: var(--psa-white);
  color: var(--psa-aladaam) !important;
  padding: .25rem 1rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid transparent
}

.icon-16 {
  height: 16px;
  width: 16px;
  display: flex;
  margin-right: .32rem;
  margin-bottom: .25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.biography {
  background-image: url(../../images/events/biography.svg)
}

.woeota-card {
  background: var(--psa-white-f8);
  padding: 1.5rem;
  height: 100%
}

.woeota-icon {
  margin-bottom: .5rem
}

.woeota-body {
  margin-top: 1rem
}

@media(max-width:991px) {
  .woeota-card {
    height: auto;
    margin-bottom: 24px
  }
}

.swiper.partnerSwiper {
  width: 87vw;
  height: 100%
}

.partnerSwiper .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center
}

.partnerSwiper .swiper-slide img {
  display: flex;
  justify-content: center;
  align-items: center
}

.pos-init {
  position: initial;
  margin-top: 1rem
}

.swiper-next,
.swiper-prev {
  position: initial;
  border-radius: 100%;
  border: 1px solid var(--psa-black-48);
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center
}

.swiper-container {
  display: flex;
  align-items: center;
  justify-content: center
}

.partner-img {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--psa-white);
  margin: 0 15px;
  padding: 1rem;
  border: 1px solid var(--psa-black-d8);
  border-radius: 3px
}

.partner-img img {
  height: 95px
}

.arrow-down-blue {
  background-image: url(../../images/arrow-down-blue.svg)
}

.tube-link-lists {
  margin-top: 1rem
}

.tube-link {
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 5rem;
  height: calc(100% - 24px);
  margin-bottom: 24px
}

.tube-link:hover {
  transform: scale(.95)
}

.tube-link:hover .tube-link-text {
  font-size: 20px
}

.tube-link:hover .arrow-down-blue,
.tube-link:hover .tube-link-text {
  transform: translateY(5px)
}

.tube-link-text {
  color: var(--psa-skyline);
  font-family: var(--psa-primary-font);
  font-size: 18px;
  padding-left: 1rem;
  width: calc(100% - 30px)
}

.swiper.speakerSwiper {
  width: 91vw;
  margin: 0
}

.speaker-carousel .section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.section-swiper {
  display: flex;
  align-items: center
}

.section-swiper .swiper-prev,
.section-swiper .swiper-next {
  border-radius: 3px;
  width: 30px;
  height: 30px;
  border: 2px solid var(--psa-black-58);
  margin-top: -3px
}

.section-swiper .swiper-button-prev.swiper-prev {
  margin-right: .5rem
}

.section-swiper .swiper-next:after,
.section-swiper .swiper-prev:after {
  font-size: 14px;
  font-weight: 600
}

.skyline-text {
  color: var(--psa-skyline)
}

.ba-line.skyline-text:before,
.ba-line.skyline-text:after {
  background-color: var(--psa-skyline);
  width: 50px;
  top: .6em
}

.mg-box {
  background: var(--psa-white-f8);
  min-height: 550px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-radius: 16px;
  padding: .5rem 1.5rem
}

.skylineBtn {
  background: var(--psa-skyline);
  color: var(--psa-white) !important;
  padding: .25rem 1rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid transparent;
  font-family: var(--psa-primary-font)
}

.skylineBtn:hover {
  background: var(--psa-white-ef);
  color: var(--psa-skyline) !important;
  border-color: var(--psa-black-dd);
  transform: scale(1.02)
}

.skylineBtn:hover .explore-more-icon {
  background: url(../../images/exploremore-arrow-blue.svg) no-repeat 50%
}

.br-3 {
  border-radius: 3px
}

.media-title {
  font-size: calc(2.25rem + .9vw);
  font-family: var(--psa-primary-font);
  color: var(--psa-aladaam);
  line-height: 55px;
  text-align: center
}

.media-title span {
  color: var(--psa-black-38)
}

.mg-box .skyline-text {
  font-family: var(--psa-primary-font);
  font-size: 26px;
  padding-top: 1.5rem;
  padding-bottom: .5rem
}

.mediaGallery1 {
  padding-left: 24px;
  padding-right: 24px
}

@media(min-width:1441px) {
  .mediaGallery1 {
    padding-left: 80px;
    padding-right: 0
  }
}

.photoSwiper .swiper-slide,
.photoSwiper .swiper-wrapper {
  height: auto;
  background: transparent
}

a.gallery-item img {
  border-radius: 16px;
  width: 100%;
  height: 500px;
  object-fit: cover
}

.photoSwiper.swiper {
  height: 550px;
  width: 75vw
}

.photoSwiper .swiper-pagination {
  bottom: .5rem
}

@media(max-width:76px) {
  .mediaGallery1 {
    padding-left: 24px;
    padding-right: 24px
  }
}

@keyframes zoomin {
  0% {
    transform: scale(1)
  }

  50% {
    transform: scale(1.05)
  }

  100% {
    transform: scale(1)
  }
}

.gallery-item {
  display: block
}

.lightbox-modal.show {
  background: rgba(0, 0, 0, .8)
}

.lightbox-modal .modal-content {
  background-color: var(--lightbox)
}

.lightbox-modal .btn-close {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  font-size: 1.25rem;
  z-index: 10;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
  background-color: transparent
}

.lightbox-modal .btn-close:hover {
  transform: scale(.7)
}

.lightbox-modal .modal-body {
  display: flex;
  align-items: center;
  padding: 0
}

.lightbox-modal .lightbox-content {
  width: 100%
}

.lightbox-modal .carousel-indicators {
  margin-bottom: 0
}

.lightbox-modal .carousel-indicators [data-bs-target] {
  background-color: var(--psa-white) !important
}

.lightbox-modal .carousel-inner {
  width: 75%
}

.lightbox-modal .carousel-inner img {
  animation: zoomin 10s linear infinite
}

.lightbox-modal .carousel-item .carousel-caption {
  right: 0;
  bottom: 0;
  left: 0;
  padding-bottom: 2rem;
  background-color: var(--lightbox);
  color: var(--psa-white) !important
}

.lightbox-modal .carousel-control-prev,
.lightbox-modal .carousel-control-next {
  width: auto
}

.lightbox-modal .carousel-control-prev {
  left: 1.25rem
}

.lightbox-modal .carousel-control-next {
  right: 1.25rem
}

@media (min-width: 1400px) {
  .lightbox-modal .carousel-inner {
    max-width: 65%
  }
}

[data-bs-theme="dark"] .lightbox-modal .carousel-control-next-icon,
[data-bs-theme="dark"] .lightbox-modal .carousel-control-prev-icon {
  filter: none
}

.btn-fullscreen-enlarge,
.btn-fullscreen-exit {
  position: absolute;
  top: 1.25rem;
  right: 3.5rem;
  z-index: 10;
  border: 0;
  background: transparent;
  opacity: .6;
  font-size: 1.25rem
}

.bi {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -.035em;
  fill: currentcolor
}

#eventsVideo .mg-box {
  padding: 0 2rem
}

#eventsVideo .mg-box .button-group {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap
}

.mg-box .primaryBtn {
  margin: .5rem;
  font-size: 20px;
  text-align: center
}

.event-video-banner img {
  width: 100%
}

.event-video-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%
}

@media(max-width:767px) {

  .mg-box,
  #eventsVideo .mg-box {
    min-height: auto;
    margin-bottom: 1.5rem;
    padding: 1.5rem
  }

  .event-video-banner {
    padding-bottom: 1.5rem
  }
}

.foreignTrade-bg {
  background-image: url(../../images/ft-banner.png);
  min-height: 500px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

.fc-card-row {
  align-items: center;
  padding: 2rem
}

.highlight-text {
  font-size: calc(1rem + .5vw);
  font-family: var(--psa-primary-font);
  margin-top: 1rem
}

.ft-blue-card {
  background: var(--psa-skyline);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #fff;
  padding: 2rem;
  border-radius: 5px;
  margin-bottom: 24px;
  font-family: var(--psa-primary-font)
}

.ft-bc-title {
  font-size: 24px;
  margin-top: 1rem
}

.ft-bc-number {
  font-size: 32px;
  margin-bottom: 1.5rem
}

.ft-bc-number span {
  font-size: 18px
}

.ft-linebar .linebar>span {
  background: var(--psa-white)
}

.ft-linebar .linebar {
  background: #8A99B1
}

.fts-box-icon .ft-shaped-icon,
.ft-shaped-icon {
  width: 80px;
  height: 80px;
  line-height: 90px;
  background: var(--psa-white-ef);
  margin-bottom: 33px;
  border-radius: 33% 66% 70% 30%/49% 62% 38% 51%;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  transition: .5s;
  display: flex;
  align-items: center;
  justify-content: center
}

.ft-shaped-icon:after {
  content: '';
  height: 48px;
  width: 48px
}

.bilateral-trade:after {
  background: url(../../images/bilateral-trade.svg)
}

.ft-advSearch:after {
  background: url(../../images/ft-advanced-search.svg)
}

.ft-reports:after {
  background: url(../../images/ft-reports-system.svg)
}

.fts-title {
  font-size: 26px;
  font-family: var(--psa-primary-font)
}

.fts-item {
  display: flex
}

.fts-box-body {
  width: calc(100% - 100px);
  padding-left: 1rem
}

.fts-list {
  padding-top: 2rem
}

.fts-item {
  padding-bottom: 2rem;
  padding-top: 1rem
}

a.plainLink {
  color: var(--psa-aladaam);
  font-size: 18px;
  font-family: var(--psa-primary-font);
  display: flex;
  padding-top: 1rem;
  display: inline-flex;
  align-items: center
}

a.plainLink.withArrow:after {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='11' viewBox='0 0 21 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 5.58044H20M20 5.58044L16.5 1.08044M20 5.58044L16.5 10.0804' stroke='%238A1538' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  height: 11px;
  width: 21px;
  margin-left: .5rem;
  transition: all .2s ease-in
}

a.plainLink.withArrow:hover:after {
  transform: translateX(10px)
}

.exports-col,
.imports-col {
  margin-bottom: 24px
}

.exports {
  background-image: url(../../images/export-alt.svg)
}

.imports {
  background-image: url(../../images/import-alt.svg)
}

.exports-title,
.imports-title {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--psa-white);
  font-family: var(--psa-primary-font);
  font-size: 22px;
  font-weight: 500;
  padding: .5rem 1rem;
  border-radius: 12px 12px 0 0
}

.exports-title {
  background: var(--psa-aladaam)
}

.imports-title {
  background: var(--psa-dune)
}

.country-list {
  border: 1px solid var(--psa-black-d8);
  padding: 1rem
}

.country-item {
  display: flex;
  align-items: center;
  padding: 1rem 0;
  border-bottom: 1px dashed var(--psa-black-d8)
}

.country-item:last-child {
  border: 0
}

.country-item-body {
  width: calc(100% - 80px);
  padding-left: 1rem
}

.country-name {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  font-weight: 500
}

.country-item-body .linebar {
  border-radius: 2px
}

.country-item-body .linebar>span {
  border-radius: 2px
}

.imports-col .country-item-body .linebar>span {
  border-radius: 2px;
  background-color: var(--psa-dune)
}

.top-ei-worldmap {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center
}

.ft-article-left {
  display: flex;
  align-items: center;
  padding-bottom: 1rem
}

.subtitleWithbg {
  background: var(--psa-skyline);
  display: inline-flex;
  color: var(--psa-white);
  font-family: var(--psa-primary-font);
  padding: .25rem 1rem;
  font-size: 22px;
  margin-bottom: .75rem
}

.withLongArrow:after {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg width='56' height='9' viewBox='0 0 56 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M55.0356 4.85355C55.2309 4.65829 55.2309 4.34171 55.0356 4.14645L51.8537 0.964466C51.6584 0.769204 51.3418 0.769204 51.1465 0.964466C50.9513 1.15973 50.9513 1.47631 51.1465 1.67157L53.975 4.5L51.1465 7.32843C50.9513 7.52369 50.9513 7.84027 51.1465 8.03553C51.3418 8.2308 51.6584 8.2308 51.8537 8.03553L55.0356 4.85355ZM0 5H54.6821V4H0V5Z' fill='%23555555'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  height: 11px;
  width: 58px;
  margin-left: .5rem;
  display: flex;
  transition: all .2s ease-in
}

.download-article {
  display: flex;
  align-items: center;
  margin-top: .5rem;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.bar.bar-big {
  height: 4px;
  width: 100px;
  background: #aec6ef;
  position: relative;
  border-radius: 30px
}

.bar.bar-big::before {
  content: "";
  position: absolute;
  left: 0;
  top: -4px;
  height: 12px;
  width: 13px;
  background-image: url(../../images/double-arrow-left.svg);
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: move-arrow;
  animation-name: move-arrow
}

@-webkit-keyframes move-arrow {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  to {
    -webkit-transform: translateX(88px);
    transform: translateX(88px)
  }
}

@keyframes move-arrow {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  to {
    -webkit-transform: translateX(88px);
    transform: translateX(88px)
  }
}

@media(max-width:400px) {
  .fts-item {
    flex-direction: column
  }

  .fts-box-body {
    width: 100%
  }
}

.policies-bg {
  background-image: url(../../images/terms-of-use.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

.policyTab-body .highlight-text {
  font-size: 20px;
  margin-bottom: 1rem
}

.policytab-item {
  padding: 1rem 0
}

.policytab-item h3 {
  font-weight: 500;
  color: var(--psa-aladaam);
  font-size: 24px;
  line-height: 28px
}

.policytab-item h4 {
  font-weight: 500;
  color: var(--psa-black-28)
}

.policytab-item p.strong {
  font-size: 20px;
  font-family: var(--psa-primary-font);
  margin-bottom: 0
}

.policytab-item ul.bulleted {
  margin: 0
}

a.logo-box-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin-bottom: 24px
}

.lg-logo-box {
  width: 100%;
  text-align: center;
  padding: 1.5rem 1.5rem 3rem;
  border-radius: 16px;
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='16' ry='16' stroke='%23A29475' stroke-width='2' stroke-dasharray='6%2c 14' stroke-dashoffset='3' stroke-linecap='round'/%3e%3c/svg%3e");
  border-radius: 16px;
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column
}

.dwnld-guidelines {
  width: 80%;
  text-align: center;
  background: var(--psa-aladaam);
  margin-top: -20px;
  color: var(--psa-white);
  padding: 1rem;
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-radius: 16px
}

.lg-title {
  font-size: 24px;
  font-family: var(--psa-primary-font);
  line-height: 30px;
  margin-top: 1rem
}

.square-download {
  height: 36px;
  width: 36px
}

.square-download img {
  width: 100%
}

a.logo-box-item:hover .dwnld-guidelines {
  transform: translateY(-30px)
}

a.logo-box-item:hover .dwnld-guidelines .square-download {
  animation: bounce .7s infinite;
  position: relative
}

@keyframes bounce {
  0% {
    bottom: 0
  }

  50% {
    bottom: .5em
  }

  100% {
    bottom: 0
  }
}

.policytab-item ol li {
  padding: 5px
}

#termsOfUse a.mobileTab {
  color: var(--psa-black)
}

.classifications-bg {
  background-image: url(../../images/classification-banner.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

.flex-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column
}

.classifications-search {
  padding-top: 1.5rem;
  padding-bottom: 1rem;
  display: flex;
  justify-content: flex-end
}

.classifications-list {
  padding-bottom: 2rem
}

.classification-wrapper {
  position: relative
}

.classifications-item {
  border: 1px solid var(--psa-black-d8);
  border-radius: 10px;
  padding: .5rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem
}

.classifications-name .title {
  font-weight: 400;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.classifications-on {
  font-size: 14px;
  font-style: italic;
  color: var(--psa-black-58)
}

.classifications-item:hover {
  background: #EFF5F8;
  border-color: #CBE3EF;
  transform: scale(1.01);
  box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1)
}

.classifications-name:before {
  content: '';
  background-image: url(../../images/statistics/book-reader.svg);
  height: 36px;
  width: 36px;
  display: flex;
  margin-right: .5rem
}

.classifications-name {
  display: flex;
  align-items: center
}

ul.dropdown-menu {
  padding: 1rem;
  min-width: 196px;
  border-radius: 1rem;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .2)
}

.more-action .dropdown-header {
  color: var(--psa-black-68);
  font-size: 18px;
  font-weight: 500;
  font-family: var(--psa-primary-font);
  padding: 0
}

a.dropdown-item.dd-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: 0
}

.dropdown-item:focus,
.dropdown-item:hover {
  background: transparent;
  transform: translateX(10px)
}

.dropdown-item.active,
.dropdown-item:active {
  background: transparent;
  color: var(--psa-black)
}

.dd-label {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  padding-top: .5rem
}

hr.dropdown-divider {
  border-top: 1px dashed var(--psa-black-d8);
  margin: 1rem 0
}

.ft-adv-search .slc-accordion-button {
  text-transform: none;
  font-weight: 500
}

.ft-adv-search .slc-accordion-body {
  margin-bottom: 1rem
}

.selectBox {
  margin-top: 1rem;
  margin-bottom: 1rem;
  width: 100%
}

.reCaptcha-center {
  text-align: center;
  width: 100%;
  margin-bottom: 1rem
}

.ft-adv-search .button-group {
  text-align: right
}

.ft-adv-search .primaryBtn,
.ft-adv-search .secondaryBtn {
  font-size: 18px;
  line-height: 20px
}

.monthYear-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem
}

.monthYear-flex input {
  margin-right: .25rem
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0
}

input[type=number] {
  -moz-appearance: textfield
}

.ft-adv-search {
  font-family: var(--psa-primary-font)
}

.ftas-item {
  padding-top: .5rem;
  padding-bottom: 1rem
}

.ftas-label {
  font-size: 18px
}

.limitResults {
  border-top: 1px dashed #ccc;
  padding-top: 1rem
}

.fileNote {
  font-size: 14px;
  margin-top: .5rem
}

.ftavdSearch .src-left h1 {
  font-weight: 400
}

.ft-search-container {
  margin-top: 1rem;
  padding-top: 1.25rem;
  border-top: 1px dashed var(--psa-black-d8)
}

.filter-tags {
  text-align: center
}

.filter-tags ul {
  margin: 1rem 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap
}

.filter-tags ul li {
  background: var(--psa-skyline);
  color: var(--psa-white);
  padding: .5rem 1rem;
  border-radius: 3rem;
  margin: .5rem .2rem;
  font-family: var(--psa-primary-font);
  font-size: 16px;
  font-weight: 300
}

.ft-tabbed-content {
  padding-top: 1rem
}

#ftAdvSearch-tabs.nav-tabs .nav-link {
  font-size: 18px;
  border: 0;
  background: var(--psa-white-ef);
  color: var(--psa-black-58);
  margin-right: .5rem
}

#ftAdvSearch-tabs.nav-tabs .nav-item.show .nav-link,
#ftAdvSearch-tabs.nav-tabs .nav-link.active,
#ftAdvSearch-tabs.nav-tabs .nav-link:focus,
#ftAdvSearch-tabs.nav-tabs .nav-link:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

#ftAdvSearch-tabs.nav-tabs .nav-link.active:after {
  display: none
}

.ft-tabbed-content .skylineBtn {
  font-size: 18px;
  padding: .5rem 1.5rem
}

.dwnld-excel {
  background: url(../../images/dwnld-excel-alt.svg);
  background-repeat: no-repeat;
  background-position: top right;
  background-size: auto
}

.rounded {
  border-radius: 50px !important
}

.dataTable-search {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem
}

.dataTable-search input {
  width: 250px
}

table.dataTable.table {
  border-top: 1px solid var(--psa-black-d8);
  margin-top: 1.5rem;
  font-family: var(--psa-primary-font);
  margin-bottom: 1rem
}

table.dataTable.table th {
  font-size: 18px;
  white-space: nowrap;
  text-align: left
}

table.dataTable.table td {
  font-size: 16px
}

.table>:not(caption)>*>* {
  padding: 1rem .5rem
}

.showingResultItems {
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.ft-tabbed-content .paging-container {
  justify-content: flex-end
}

.ft-card-body {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem
}

.linebar-group.dark {
  padding: 0 2rem 2rem
}

.linebar-group.dark .linebar {
  background: #CAD4E5
}

.linebar-group.dark .ft-linebar .linebar>span {
  background: var(--psa-skyline)
}

.ft-card-data {
  font-family: var(--psa-primary-font)
}

.ftAdvSearch-right {
  background: var(--psa-white-f8);
  padding: 24px
}

.ft-indicators {
  margin-top1: 2rem
}

@media(max-width:1360px) {

  .ftAdvSearch-left,
  .ftAdvSearch-right {
    width: 100%;
    flex: 0 0 100%
  }
}

@media(max-width:767px) {
  .ft-search-container {
    margin-bottom: 2rem
  }

  .ft-search-container .tab-content>.active a.mobileTab {
    margin-bottom: 0
  }

  .dt-buttons {
    margin: .5rem 0
  }
}

.select2-container .select2-search--inline .select2-search__field {
  box-sizing: border-box;
  border: none;
  font-size: 100%;
  margin-top: 0;
  padding: 0;
  width: 159px !important
}

.select2-results__option:before {
  content: "";
  display: inline-block;
  position: relative;
  height: 20px;
  width: 20px;
  border: 2px solid #e9e9e9;
  border-radius: 4px;
  background-color: #fff;
  margin-right: 20px;
  vertical-align: middle
}

.select2-results__option[aria-selected=true]:before {
  content: "";
  color: #fff;
  background: #8A1538 url(../../images/checkbox-selected.svg);
  border: 0;
  display: inline-block;
  padding-left: 3px;
  background-repeat: no-repeat
}

.select2-results__option {
  font-family: var(--psa-primary-font)
}

.select2-container .select2-selection--multiple {
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  min-height: 32px;
  max-height: 32px;
  user-select: none;
  -webkit-user-select: none
}

.select2-container {
  width: 100% !important
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: transparent;
  border: 1px solid transparent
}

.loading-state {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center
}

.loading {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  border: 10px solid #ddd;
  border-top-color: #8A1538;
  animation: loading 1s linear infinite
}

@keyframes loading {
  to {
    transform: rotate(360deg)
  }
}

.dt-paging-button {
  border: 0
}

div.dt-container .dt-length select.dt-input {
  margin-right: .5rem;
  font-family: var(--psa-primary-font);
  line-height: 22px;
  font-size: 16px;
  border-radius: 6px;
  border-color: var(--psa-black-c8);
  padding: .25rem .5rem .05rem
}

div.dt-container .dt-length label {
  font-family: var(--psa-primary-font);
  font-size: 18px
}

div.dt-container .dt-paging .dt-paging-button.current,
div.dt-container .dt-paging .dt-paging-button.current:hover {
  background: var(--psa-aladaam) !important;
  color: #fff !important;
  border-radius: 50rem;
  border: none
}

div.dt-container .dt-paging .dt-paging-button:hover {
  background: var(--psa-aladaam) !important;
  color: #fff !important;
  border-radius: 50rem;
  border: none
}

div.dt-container .dt-paging .dt-paging-button {
  border: none
}

div.dt-container .dt-paging .dt-paging-button.disabled,
div.dt-container .dt-paging .dt-paging-button.disabled:hover,
div.dt-container .dt-paging .dt-paging-button.disabled:active {
  background: transparent !important
}

div.dt-container .dt-paging .dt-paging-button.next:hover {
  background: transparent !important;
  transform: translateX(10px)
}

div.dt-container .dt-paging .dt-paging-button.previous:hover {
  background: transparent !important;
  transform: translateX(-10px)
}

div.dt-container .dt-paging .dt-paging-button.next {
  padding: 0 0 0 1em
}

.dt-paging-button.disabled.previous img,
.dt-paging-button.disabled.next img {
  filter: grayscale(1);
  opacity: .3
}

.allnews-bg {
  background-image: url(../../images/all-news-statistics-banner.png);
  min-height: 475px;
  background-position: center left;
  background-repeat: no-repeat;
  background-size: cover
}

.error-message {
  font-size: 14px;
  color: #c00;
  padding-top: .15rem;
  display: none
}

.dt-table-title {
  font-size: 22px;
  font-family: cursive;
  font-family: var(--psa-primary-font);
  display: inline-flex;
  padding-top: 1rem
}

button.dt-button.buttons-excel {
  background: var(--psa-skyline) url(../../images/dwnld-excel-alt.svg);
  background-repeat: no-repeat;
  color: var(--psa-white) !important;
  display: inline-flex;
  align-items: center;
  border: 1px solid transparent;
  font-family: var(--psa-primary-font);
  border-radius: 50px !important;
  font-size: 18px;
  padding: .5rem 1.5rem .35rem 2.8rem;
  background-position: 15px center;
  margin: 0
}

button.dt-button.buttons-excel:hover {
  background: var(--psa-white-ef) url(../../images/dwnld-excel-alt.svg) !important;
  color: var(--psa-skyline) !important;
  border-color: var(--psa-black-dd) !important;
  transform: scale(1.02);
  padding: .5rem 1.5rem .35rem 2.8rem;
  background-position: 15px center !important;
  background-repeat: no-repeat !important;
  margin-left: .1rem
}

button.dt-button.buttons-excel span {
  transition: none
}

.select2-container .select2-selection--multiple {
  border: var(--bs-border-width) solid var(--bs-border-color);
  padding: .25rem .5rem .375rem .75rem !important;
  max-height: 38px
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
  padding: 0
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  margin-top: 3px;
  max-width: 300px;
  overflow: hidden
}

.year-highlight {
  margin-top: -2px !important;
  background: var(--psa-palm);
  display: inline-flex;
  padding: .25rem .5rem;
  border-radius: 8px 5px 8px 5px;
  color: var(--psa-white)
}

.country-table .dt-container {
  margin-bottom: 2rem;
  padding-bottom: 2rem
}

h2.dt-table-title {
  font-size: 26px;
  font-weight: 500;
  flex-direction: column;
  margin-bottom: 1rem
}

h2.dt-table-title:after {
  content: "";
  height: 3px;
  width: 50px;
  display: block;
  background: var(--psa-aladaam);
  margin-top: -3px
}

.dt-container {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: center
}

.dt-length {
  width: 50%;
  flex: 0 0 auto;
  order: 2;
  text-align: right
}

.dt-buttons {
  width: 50%;
  flex: 0 0 auto;
  order: 1;
  text-align: left
}

table.dataTable.table {
  width: 100%;
  order: 3
}

.dt-info {
  width: 25%;
  flex: 0 0 auto;
  order: 4
}

.dt-paging {
  width: 75%;
  flex: 0 0 auto;
  text-align: right;
  order: 5;
  padding-right: 1rem
}

.table-info.alert-warning.alert {
  margin-bottom: 0;
  margin-top: 1rem;
  font-family: var(--psa-primary-font);
  color: var(--psa-black);
  font-size: 20px;
  padding: .5rem 1rem;
  text-align: center;
  display: none
}

.bilateral .dt-buttons {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  margin-top: -2.3rem;
  width: 100%
}

.dt-table-title {
  font-size: 22px;
  font-family: var(--psa-primary-font);
  display: flex;
  padding-top: 1rem;
  flex-direction: column
}

.dt-table-title:after {
  content: "";
  height: 3px;
  width: 50px;
  display: block;
  background: var(--psa-aladaam);
  margin-top: -3px
}

@media(max-width:590px) {
  .bilateral .dt-buttons {
    margin-top: .5rem
  }
}

.bilateral .tab-content>.active a.mobileTab {
  margin-bottom: 0
}

.related-news h4 {
  line-height: 26px
}

.related-news h4 a {
  color: var(--psa-black-28);
  text-decoration: none !important;
  font-size: 18px;
  line-height: 20px !important
}

.related-news h4 a:hover {
  color: var(--psa-aladaam)
}

.related-news #hp-news-date {
  margin-top: .5rem;
  font-family: var(--psa-primary-font)
}

#ASImports .dt-container {
  padding-top: 1.5rem
}

.nsdp-bg {
  background-image: url(../../images/nsdp-banner.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

#nsdpAccordion .accordion-item {
  border: 1px solid #d8d8d8;
  border-radius: 24px;
  margin-bottom: 24px;
}

#nsdpAccordion .accordion-header .accordion-button {
  background: #F8F8F8;
  font-size: 25px;
  border-bottom: 2px solid var(--psa-black-c8);
  border-radius: 24px !important;
}

#nsdpAccordion .accordion-button::after {
  background-image: var(--accordion-open)
}

#nsdpAccordion .accordion-button:not(.collapsed)::after {
  background-image: var(--accordion-closed)
}

#nsdpAccordion .accordion-button:not(.collapsed) {
  background: #fff;
  box-shadow: none;
  color: var(--psa-aladaam);
  border-bottom: 0;
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  margin: 0
}

.no-icon .classifications-list {
  padding-bottom: 0
}

.no-icon .classifications-name:before {
  display: none
}

.no-icon .name-wrapper {
  width: auto
}

.no-icon .classifications-name .title {
  font-weight: 400;
  font-family: var(--psa-primary-font);
  font-size: 18px;
  color: var(--psa-black-28)
}

.no-icon.classifications-item {
  padding: .75rem 1rem
}

.no-icon.classifications-item:hover {
  transform: none
}

.browse-icon {
  background: url(../../images/browse-icon-alt.svg) no-repeat 50%;
  height: 24px;
  width: 24px;
  display: flex;
  margin-right: .5rem
}

.primaryBtn:hover .browse-icon {
  background: url(../../images/browse-icon.svg) no-repeat 50%;
  height: 24px;
  width: 24px
}

.stats-questionnaire-bg {
  background-image: url(../../images/statisticalQuestionnaire-banner.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

.stats-questionnaire {
  border-radius: 24px !important;
  padding: 1.5rem
}

.stats-questionnaire h2 {
  font-size: 28px
}

.stats-questionnaire .classifications-list {
  padding-bottom: 0
}

.stats-questionnaire ul.dropdown-menu.show {
  padding: 0 0 1rem;
  min-width: 170px
}

.stats-questionnaire ul.dropdown-menu.show li {
  padding-left: 1rem;
  padding-right: 1rem
}

.stats-questionnaire ul.dropdown-menu.show li.dropdown-title {
  padding: .65rem;
  background: var(--psa-white-f8);
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  text-align: center;
  font-family: var(--psa-primary-font);
  font-size: 18px;
  color: var(--psa-aladaam);
  border-bottom: 1px dashed var(--psa-black-d8);
  margin-bottom: 1rem
}

.stats-questionnaire .more-action .dropdown-header {
  font-size: 16px;
  font-weight: 400
}

.card.stats-questionnaire {
  height: auto
}

.library-bg {
  background-image: url(../../images/libraryBanner.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

ul.bulleted.book li:before {
  background-image: url(../../images/book-font.svg);
  width: 24px;
  height: 24px;
  top: 6px
}

.rounded-1 {
  border-radius: 16px !important
}

.section-heading img {
  margin-bottom: .5rem
}

.councilServices-bg {
  background-image: url(../../images/councilServices-banner.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

.ba-line-gray.center {
  justify-content: center
}

.rounded24 {
  border-radius: 24px !important
}

.card-image {
  height: 250px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-top-left-radius: 24px;
  border-top-right-radius: 24px
}

.services-knowledgeCenter {
  background-image: url(../../images/services-knowledgeCenter.png)
}

.services-gis {
  background-image: url(../../images/services-gis.png)
}

.services-library {
  background-image: url(../../images/services-library.png)
}

.services-publicationRequest {
  background-image: url(../../images/services-publicationRequest.png)
}

.services-dataRequest {
  background-image: url(../../images/services-dataRequest.png)
}

.generalServices .card-body {
  padding: 1rem 2rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between
}

.ondemandServices .card {
  border: 0;
  background: var(--psa-white-f8);
  padding: 2rem
}

.ondemandServices .ft-shaped-icon {
  background-color: var(--psa-white)
}

.ondemand-training:after {
  background: url(../../images/trainning.svg)
}

.ondemand-review:after {
  background: url(../../images/customer-review.svg)
}

.ondemand-maintenance:after {
  background: url(../../images/maintenance.svg)
}

.ondemandServices .card-body {
  padding: .25rem 0
}

.ondemandServices .card-body p {
  margin-bottom: 0
}

.ms-webpartzone-cell {
  margin: auto auto 0
}

.surveyOpinion-bg {
  background-image: url(../../images/surveyOpinions-Banner.png);
  min-height: 475px;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: cover
}

#surveysOpinions-tabs {
  justify-content: center
}

#surveysOpinions-tabs.nav-tabs .nav-link {
  font-size: 18px;
  border: 0;
  background: var(--psa-white-ef);
  color: var(--psa-black-58);
  margin-right: .5rem;
  min-width: 200px;
  text-align: center
}

#surveysOpinions-tabs.nav-tabs .nav-item.show .nav-link,
#surveysOpinions-tabs.nav-tabs .nav-link.active,
#surveysOpinions-tabs.nav-tabs .nav-link:focus,
#surveysOpinions-tabs.nav-tabs .nav-link:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

#surveysOpinions-tabs.nav-tabs .nav-link.active:after {
  border-width: 10px;
  margin-left: -8px
}

.surveysOpinions .card {
  padding: 1rem
}

.surveysOpinions .card-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between
}

.surveysOpinions .tab-body h3 {
  font-size: 24px;
  margin-bottom: .75rem;
  color: var(--psa-skyline);
  line-height: initial
}

.surveysOpinions p {
  margin-bottom: 1.25rem;
  line-height: 24px
}

.allIndicators-bg {
  background-image: url(../../images/allIndicators-banner.png);
  min-height: 475px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.all-indicator-list {
  padding-top: 2rem
}

.all-indicator-list .card {
  padding: 1.5rem;
  display: flex;
  justify-content: center;
  min-height: 250px
}

.all-indicator-list .column-5 {
  flex: 0 0 20%
}

.all-indicator-list .card-numbers:after {
  width: 100%
}

.downloadMobileApp {
  padding-top: 2rem
}

.app {
  padding-top: 4rem;
  padding-bottom: 2rem;
  border-bottom: 1px dashed var(--psa-black-d8)
}

.app h1 {
  font-size: calc(2.5rem + .65vw);
  line-height: calc(2.5rem + .65vw)
}

.app p {
  font-size: calc(1rem + .35vw);
  line-height: calc(1.3rem + .35vw)
}

.app-qrcode {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2rem
}

.qrcode {
  background: var(--psa-white-ef);
  padding: 1.5rem;
  border-radius: 22px
}

.scanCode {
  color: var(--psa-black-68);
  font-size: 20px
}

.qrcode-content {
  font-family: var(--psa-primary-font)
}

.deviceName {
  font-size: 30px;
  font-weight: 500
}

.icon-card {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 1rem;
  padding: 24px;
  border: none
}

.app-content {
  font-family: var(--psa-primary-font);
  font-size: 20px;
  line-height: 26px
}

.app.ppc {
  border: none
}

.app.ppc .row {
  align-items: center
}

.ppc .icon-card {
  padding: 1rem;
  margin-bottom: 1rem
}

.ppc h1 {
  color: #98387A
}

.qs-app-banner.mobile {
  display: none
}

@media(max-width:991px) {
  .qs-app-banner.desktop {
    display: none
  }

  .qs-app-banner.mobile {
    display: block
  }

  .app-qrcode {
    margin-bottom: 1.5rem
  }
}

@media (min-width: 1300px) and (max-width:1700px) {
  .all-indicator-list .column-5 {
    flex: 0 0 auto;
    width: 25%
  }
}

@media (max-width: 1299px) {
  .all-indicator-list .column-5 {
    flex: 0 0 33.333333%
  }
}

@media (max-width: 996px) {
  .all-indicator-list .column-5 {
    flex: 0 0 50%
  }
}

@media (max-width: 560px) {
  .all-indicator-list .column-5 {
    flex: 0 0 100%
  }
}

.fliptext {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  padding-top: .5rem;
  text-align: center
}

.qrcode {
  width: 160px;
  height: 190px;
  position: relative;
  transform-style: preserve-3d;
  transition: transform .8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center
}

.qrcode div {
  position: absolute;
  height: 100%;
  width: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: -ms-flexbox;
  display: flex;
  -o-box-pack: center;
  justify-content: center;
  -o-box-align: center;
  align-items: center;
  -webkit-font-smoothing: antialiased;
  flex-direction: column
}

.qrcode .back {
  transform: rotateY(180deg)
}

.qrcode.flipped {
  transform: rotateY(180deg)
}

#div_validationMessage {
  height: 100%
}

.success-message {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.thankYou {
  font-size: 24px;
  padding-top: 1rem
}

ul.error-list {
  list-style: none;
  padding: 0;
  margin-top: .5rem
}

ul.error-list li a {
  color: var(--bs-danger-text-emphasis)
}

.err-msg-txt {
  font-size: 20px;
  font-family: var(--psa-primary-font)
}

.inputErr {
  border: 1px solid #cd0000 !important
}

#successModal .modal-footer {
  justify-content: center;
  border: 0;
  padding: 0
}

.staff-only-bg {
  background-image: url(../../images/staffOnly-banner.png);
  min-height: 475px;
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: auto
}

.btn-label {
  transition: none
}

.italics {
  font-style: italic
}

.npc-webmail {
  border-right: 2px dashed var(--psa-black-d8);
  padding-right: 2rem
}

.npc-webmail .button-group-center {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem
}

@media(max-width:767px) {
  .linewrapper-absolute {
    display: none
  }

  .npc-webmail {
    border-right: 0;
    border-bottom: 2px dashed var(--psa-black-d8);
    margin-bottom: 1rem;
    padding-bottom: 2rem
  }

  .dt-paging {
    width: 100%;
    text-align: center;
    padding-top: 1rem
  }

  .dt-info {
    width: 100%;
    text-align: center
  }
}

@media(max-width:420px) {

  .dt-length,
  .dt-buttons {
    width: 100%;
    text-align: right
  }

  h2.dt-table-title {
    justify-content: center;
    align-items: center
  }
}

:root {
  --level-1: #fff;
  --level-2: #fff;
  --level-3: #fff;
  --black: #d8d8d8
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box
}

ol {
  list-style: none
}

.rectangle {
  position: relative
}

.rectangle a {
  padding: 15px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
  text-align: center;
  border-radius: 8px;
  display: block;
  background-color: var(--psa-white);
  color: var(--psa-black-28);
  border: 1px dashed transparent;
  transition: all .3s ease-in
}

.rectangle a:hover {
  transform: scale(1.03);
  color: var(--psa-aladaam);
  border: 1px dashed var(--psa-black-c8);
  box-shadow: none
}

.rectangle.level-title {
  padding: 15px;
  text-align: center;
  border-radius: 8px;
  display: block;
  background-color: var(--psa-white-ef);
  color: var(--psa-black-28);
  border: 1px dashed transparent
}

.level-1 {
  width: 50%;
  margin: 0 auto 40px !important;
  background: var(--level-1);
  font-size: calc(1.2rem + .5vw)
}

.level-1::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 20px;
  background: var(--black)
}

.level-1.rectangle a {
  background: var(--psa-aladaam);
  color: var(--psa-white);
  display: block
}

.level-2-wrapper {
  position: relative;
  display: flex;
  grid-template-columns: repeat(2, 1fr)
}

.level-2-wrapper::before {
  content: "";
  position: absolute;
  top: -20px;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--black)
}

.level-2-wrapper::after {
  display: none;
  content: "";
  position: absolute;
  left: -20px;
  bottom: -20px;
  width: calc(100% + 20px);
  height: 1px;
  background: var(--black)
}

.level-2-wrapper li {
  position: relative;
  width: 90%
}

.level-2-wrapper>li::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 20px;
  background: var(--black)
}

.level-2 {
  width: 90%;
  margin: 0 auto 20px !important;
  background: var(--level-2);
  font-size: calc(1.2rem + .25vw)
}

.level-2::before {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 20px;
  background: var(--black)
}

.level-2::after {
  display: none;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-100%, -50%);
  width: 20px;
  height: 1px;
  background: var(--black)
}

.level-3-wrapper {
  position: relative;
  width: 90%;
  margin-left: auto
}

.level-3-wrapper::before {
  content: "";
  position: absolute;
  top: -20px;
  left: 12px;
  width: 1px;
  height: calc(100% + 20px);
  background: var(--black)
}

.level-3-wrapper li+li {
  margin-top: 20px
}

.level-3 {
  font-weight: 400;
  background: var(--level-3);
  font-size: calc(.9rem + .25vw)
}

.level-3::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-100%, -50%);
  width: 20px;
  height: 1px;
  background: var(--black)
}

@media screen and (max-width: 1023px) {
  .rectangle a {
    padding: 20px 10px
  }

  .level-1,
  .level-2 {
    width: 100%
  }

  .level-1 {
    margin-bottom: 0 !important
  }

  .level-1::before,
  .level-2-wrapper>li::before {
    display: none
  }

  .level-2-wrapper,
  .level-2::after {
    display: block
  }

  .level-2-wrapper {
    width: 90%;
    margin-left: 10%
  }

  .level-2-wrapper::before {
    left: 11px;
    width: 1px;
    height: calc(100% + 40px)
  }

  .level-2-wrapper>li:not(:first-child) {
    margin-top: 50px
  }

  #sitemap .section-heading h1 {
    margin-bottom: 0 !important
  }

  h4.level-3.rectangle {
    padding: 0
  }
}

.qvnr2021-bg {
  background-image: url(../../images/qvnr2021-banner.png);
  min-height: 475px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.cards {
  margin-top: 3em;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-left: 24px;
  margin-right: 24px
}

.cards .card {
  width: calc(25% - 24px);
  cursor: pointer;
  border: 0
}

.card__outer {
  background: var(--psa-white-ef);
  position: relative;
  border-radius: .625rem;
  display: flex;
  padding: 0 1.25rem 1.25rem 0;
  transition: .2s ease-in-out;
  flex-direction: column
}

.card__outer a,
.card-readmore {
  display: flex;
  align-items: center;
  text-decoration: none;
  text-transform: capitalize;
  color: var(--psa-black-38);
  font-family: var(--psa-primary-font);
  font-size: 18px;
  padding-top: 1rem;
  padding-left: 1rem
}

.card__outer a svg,
.card__outer .card-readmore svg {
  margin-left: .375em;
  width: 1.125rem
}

.card__inner {
  bottom: 3.75rem;
  right: 1.25rem;
  width: 100%;
  height: 100%;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  background: #fff;
  top: 0;
  margin-top: -1rem;
  margin-left: -1rem
}

.card__inner img {
  border-radius: 24px;
  border: 1px dashed var(--psa-black-d8)
}

.card.active .card__outer a,
.card.card--aladaam:hover .card-readmore {
  color: #fff
}

.card.active .card__inner svg {
  color: var(--psa-aladaam)
}

.card.active .card__outer {
  background: var(--psa-aladaam);
  box-shadow: 3px 8px 13px rgba(0, 0, 0, 0.15)
}

.card.card--aladaam:hover .card__outer {
  background: var(--psa-aladaam)
}

.card.card--aladaam:hover .card__outer a {
  color: #fff
}

.wrap-word {
  white-space: normal;
  word-break: break-all
}

.wrap-text {
  width: calc(100% - 24px)
}

.line-arrow {
  background: url(../../images/line-arrow.svg) no-repeat 50%;
  height: 24px;
  width: 24px;
  display: flex;
  margin-left: .5rem;
  transform: rotate(0)
}

.card.card--aladaam:hover .line-arrow {
  background: url(../../images/line-arrow-alt.svg) no-repeat 50%
}

@media(max-width:1100px) {
  .cards .card {
    width: calc(50% - 24px)
  }
}

@media(max-width:600px) {
  .cards {
    margin-left: 12px;
    margin-right: 0
  }

  .cards .card {
    width: 100%
  }

  .card__outer a {
    font-size: 16px
  }
}

.vr-news-txt {
  font-size: 26px;
  font-family: var(--psa-primary-font)
}

.vr-link-date {
  padding: 1rem 0
}

.vr-link-day {
  font-size: calc(2rem + 1vw);
  font-family: var(--psa-primary-font);
  line-height: calc(2rem + 1vw)
}

.vr-link-month {
  font-size: 20px;
  font-family: var(--psa-primary-font);
  margin-top: -.5rem
}

.vr-news-title {
  font-size: 20px;
  font-family: var(--psa-primary-font);
  margin-bottom: 1rem
}

.qvr2021,
.rdl-video {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  height: 100%;
  border-radius: 24px
}

.qvr2021 {
  background-image: url(../../images/vr-link-img-1.png)
}

.rdl-video {
  background-image: url(../../images/vr-link-img-2.png)
}

.vr2021-title {
  position: absolute;
  top: 70%;
  background: rgba(138, 21, 56, .8);
  color: #fff;
  font-weight: 500;
  font-family: var(--psa-primary-font);
  font-size: 24px;
  left: 0;
  right: 0;
  padding: 1rem .5rem;
  display: flex;
  justify-content: center;
  transition: all .3s ease-in-out
}

.card a:hover.qvr2021 .vr2021-title,
.vr2021-title:hover {
  align-items: center;
  top: 50%;
  transform: translateY(-50%);
  height: 100%
}

.overflow-hidden {
  overflow: hidden
}

.video-play-button {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  border-radius: 50%;
  padding: 18px 20px 18px 28px
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 55px;
  height: 55px;
  background: var(--psa-dune);
  border-radius: 50%;
  animation: pulse-border 1100ms ease-out infinite
}

.video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 60px;
  height: 60px;
  background: #eb2055;
  border-radius: 50%;
  transition: all 200ms
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 19px solid #fff;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  top: 10px;
  left: 5px
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1
  }

  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0
  }
}

.vr-video-box {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center
}

.vr-video-image img {
  border-radius: 24px
}

.vr-video-body {
  background: var(--psa-white);
  border-radius: 24px;
  margin-top: -3rem;
  padding: 1.5rem;
  z-index: 999;
  position: relative;
  width: 85%
}

.vr-video-title {
  font-family: var(--psa-primary-font);
  font-size: calc(.9rem + .45vw);
  margin-bottom: 1rem
}

.emblem-seperator:before {
  content: '';
  background: var(--psa-black-a8);
  height: 100%;
  width: 1px;
  display: block;
  position: absolute;
  left: 50%;
  z-index: 5
}

.emblem-seperator img {
  z-index: 99;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.emblem-seperator {
  position: relative
}

@media(max-width:767px) {
  .emblem-seperator:before {
    height: 1px;
    width: 100%;
    left: 0
  }

  .emblem-seperator {
    padding-top: 4rem;
    padding-bottom: 4rem
  }

  .vr-video-body {
    padding-bottom: 0
  }

  .vr-video-body .btnGroup .primaryBtn {
    margin-bottom: 0 !important
  }

  .emblem-seperator img {
    width: 48px
  }
}

.about-npc {
  padding-top: 2rem;
  padding-bottom: 2rem
}

.about-container {
  width: calc(100% - 462px);
  margin-left: -60px;
  background: var(--psa-white-f8);
  padding: 2rem;
  margin-top: 2rem;
  margin-bottom: 2rem
}

.sg-banner {
  background-image: url(../../images/Abdulaziz_bin_Nasser_bin_Mubarak_Al_Khalifa.png);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 522px;
  min-height: 100%;
  border-radius: 12px
}

.about-banner {
  background-image: url(../../images/about-npc-banner.png);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 522px;
  min-height: 100%;
  border-radius: 12px
}

.council-ministers-bg {
  background-image: url(../../images/council-ministers-banner.png);
  min-height: 475px;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover
}

.about-npc .section-heading h2 {
  font-size: 28px
}

.secretary-message {
  padding-top: 1.5rem
}

.secretary-message p {
  font-size: 18px;
  font-family: var(--psa-primary-font)
}

@media(max-width:1200px) {

  .sg-banner,
  .about-banner {
    width: 300px
  }

  .about-container {
    width: calc(100% - 240px)
  }
}

@media(max-width:767px) {

  .sg-banner,
  .about-banner {
    width: 100%;
    height: 400px;
    margin: 0 auto
  }

  .about-container {
    width: 95%;
    margin: -2rem auto 0;
    padding: 2rem;
    border-radius: 2rem
  }
}

@media(max-width:600px) {

  .sg-banner,
  .about-banner {
    height: 300px
  }
}

@media(max-width:550px) {

  .sg-banner,
  .about-banner {
    height: 250px
  }
}

@media(max-width:300px) {

  .sg-banner,
  .about-banner {
    height: 180px !important
  }

  .navbar-brand.site-logo img {
    width: 100%;
    height: auto
  }

  .appStoreBtn img {
    width: 100%;
    height: auto
  }
}

.first-members {
  justify-content: center;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem
}

.first-members .com-card-body {
  background: var(--psa-aladaam)
}

.first-members .com-card-title,
.first-members .com-card-jobTitle {
  color: var(--psa-white)
}

.board-members {
  background: var(--psa-white-f8);
  padding: 2rem;
  border: 1px dashed var(--psa-black-c8);
  border-radius: 2rem
}

.com-card {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: var(--psa-primary-font);
  margin-top: 1.5rem;
  height: calc(100% - 1.5rem)
}

.com-card-title {
  color: var(--psa-aladaam);
  font-size: calc(.9rem + .8vw);
  line-height: calc(1rem + 1vw);
  font-weight: 500
}

.com-card-jobTitle {
  color: var(--psa-black-38);
  font-size: calc(.8rem + .5vw);
  line-height: calc(.8rem + .8vw);
  margin-top: 1rem
}

.board-members .com-card-title {
  font-size: calc(.7rem + .7vw);
  line-height: calc(.9rem + .9vw)
}

.board-members .com-card-jobTitle {
  font-size: calc(.55rem + .55vw);
  line-height: calc(.75rem + .75vw);
  margin-top: .5rem
}

.com-card-body {
  padding: 1.5rem;
  background: var(--psa-white);
  border-radius: 1.5rem;
  margin-top: -2rem;
  width: calc(100% - 2rem);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center
}

.com-card-image img {
  border-radius: 2rem;
  transition: all .2s ease-in;
  width: 100%
}

@media(min-width:1240px) {
  .com-card-image img {
    width: 65%
  }
}

@media(max-width:767px) {
  .com-card-title {
    font-size: calc(1rem + 1vw);
    line-height: calc(1.2rem + 1vw)
  }

  .com-card-jobTitle {
    font-size: calc(.9rem + .8vw);
    line-height: calc(1rem + .8vw)
  }

  .com-card-body {
    margin-top: -2.5rem;
    width: 100%
  }
}

@media(min-width:767px) {
  .first-members .com-card {
    flex-direction: row
  }

  .first-members .com-card-image {
    width: 320px
  }

  .first-members .com-card-image img {
    width: 100%;
    border-radius: 2rem 0 0 2rem
  }

  .first-members .com-card-body {
    background: var(--psa-aladaam);
    margin: 0;
    width: calc(100% - 320px);
    border-radius: 0 2rem 2rem 0;
    align-items: self-start
  }

  .first-members .com-card-title,
  .first-members .com-card-jobTitle {
    text-align: left
  }
}

@media(max-width:1440px) {
  .first-members .col-lg-8 {
    width: 100%;
    flex: 0 0 100%
  }

  .first-members .com-card-title {
    font-size: calc(1.2rem + 1vw);
    line-height: calc(1.5rem + 1vw)
  }

  .com-card-jobTitle {
    font-size: calc(1rem + .7vw);
    line-height: calc(1.2rem + 1vw)
  }
}

.ms-webpart-controlBox .ms-core-menu-box div {
  color: #000 !important
}

.form-control {
  padding: .375rem .75rem !important
}

.censusOverview-bg {
  background-image: url(../../images/census-banner.png);
  min-height: 480px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

.censusLists .card__inner {
  border: 1px solid var(--psa-black-d8);
  padding: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem
}

.censusTitle {
  font-family: var(--psa-primary-font);
  font-size: 25px;
  font-weight: 600;
  color: var(--psa-aladaam)
}

.highlighted-list a {
  color: var(--psa-aladaam)
}

.censusLists .card__inner img {
  border: none;
  border-radius: 0
}

.welcome-letter {
  padding-top: 2rem;
  padding-bottom: 2rem
}

.qsaPresident-banner {
  background-image: url(../../images/Hamad_Bin_Jaber.gif);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 522px;
  min-height: 100%;
  border-radius: 12px
}

.censusGeneral-bg {
  background-image: url(../../images/doha-1.png);
  min-height: 480px;
  background-position: top left;
  background-repeat: no-repeat;
  background-size: cover
}

.censusLogo {
  width: 100%;
  padding: 0 1rem
}

#census2010 h4 {
  font-weight: 500;
  color: var(--psa-aladaam);
  font-size: 22px;
  line-height: 25px
}

.logo-content {
  width: 240px
}

.intro-content {
  width: calc(100% - 256px)
}

@media(max-width:1023px) {
  .censusIntroContent {
    flex-direction: column
  }

  .intro-content {
    width: 100%
  }

  .censusLogo {
    padding: 0 0 2rem
  }
}

@media(max-width:580px) {
  .logo-content {
    width: 100%
  }
}

.breadcrumb {
  display: none
}

.signatures {
  font-family: var(--psa-primary-font);
  padding-top: .5rem
}

.signatures .name {
  font-size: 20px;
  color: var(--psa-aladaam)
}

.pnf-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  font-family: var(--psa-primary-font)
}

.pageNotFound {
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center
}

.label-404 {
  font-size: calc(10rem + 6vw);
  line-height: calc(7rem + 2vw);
  color: var(--psa-black-d8)
}

.pnf-label {
  font-size: calc(2rem + 1.5vw);
  font-weight: 600;
  position: absolute;
  bottom: 0
}

.wrapper-404 {
  position: relative;
  padding-bottom: 2rem
}

.message-en {
  font-size: calc(1rem + .5vw);
  line-height: calc(calc(.8rem + .9vw));
  margin-bottom: 1rem;
  text-align: left
}

.message-ar {
  font-size: calc(1rem + .5vw);
  line-height: calc(calc(.8rem + .9vw));
  margin-bottom: 1rem;
  direction: rtl;
  text-align: right
}

.pnf-wrapper .copyright {
  text-align: center;
  padding-top: 1rem;
  border-top: 1px dashed var(--psa-black-d8);
  margin-top: 2rem
}

@media(max-width:1024px) {
  .pageNotFound {
    flex-wrap: wrap
  }
}

@media(max-width:767px) {

  .message-en,
  .message-ar {
    line-height: calc(calc(1rem + .9vw))
  }
}

@media(max-height:767px) {
  .pnf-wrapper {
    align-items: start;
    padding-top: 4rem;
    height: auto
  }
}

.mm-Submenu-Item p {
  display: none
}

.event-wrapper {
  display: flex;
  align-items: center;
  height: 100%
}

.event-content {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  height: 100%
}

.event-register {
  background: url(../../images/registerNow-bg.svg);
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-family: var(--psa-primary-font)
}

.register-txt {
  font-size: calc(1.3rem + 1vw);
  line-height: calc(2rem + 1vw)
}

.now-txt {
  font-size: calc(2rem + 1.5vw);
  font-weight: 500;
  line-height: calc(2rem + 1vw)
}

.btnGroup-banner {
  display: flex;
  align-items: center;
  justify-content: end
}

@media(max-width:767px) {
  .event-image {
    display: none
  }

  .ms-srch-item {
    width: 100% !important
  }

  .sr-results .ms-webpart-zone,
  .sr-results .ms-webpart-cell-vertical,
  .sr-results .ms-webpart-chrome-vertical,
  .ms-srch-item-body {
    display: block
  }

  div#Result {
    padding: 2rem 0
  }

  .ms-srch-item {
    margin: 10px 0
  }
}

@media(max-width:800px) {
  .sr-searBox {
    width: auto
  }

  .showingResults {
    flex-direction: column
  }

  .showingResults:before,
  .showingResults:after {
    display: none
  }
}

.gccDomains-list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem
}

.gccDomains-list .classification-wrapper {
  width: calc(50% - 1rem)
}

#qnvrYears-tabs {
  justify-content: center
}

#qnvrYears-tabs.nav-tabs .nav-link {
  font-size: 18px;
  border: 0;
  background: var(--psa-white-ef);
  color: var(--psa-black-58);
  margin-right: .5rem;
  min-width: 200px;
  text-align: center
}

#qnvrYears-tabs.nav-tabs .nav-item.show .nav-link,
#qnvrYears-tabs.nav-tabs .nav-link.active,
#qnvrYears-tabs.nav-tabs .nav-link:focus,
#qnvrYears-tabs.nav-tabs .nav-link:hover {
  background: var(--psa-aladaam);
  color: var(--psa-white)
}

#qnvrYears-tabs.nav-tabs .nav-link.active:after {
  border-width: 10px;
  margin-left: -8px
}

.gccDomain-list .card {
  min-height: 250px
}

.gccDomain-list .card-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.5rem
}

.gccDomain-list h3 {
  font-size: 24px
}

.pdf-icon-alt {
  background: url(../../images/dwnld-pdf-alt.svg)
}

.primaryBtn:hover .pdf-icon-alt {
  background: url(../../images/dwnld-pdf.svg)
}

.gccDomain-list .primaryBtn {
  line-height: 18px
}

.bismillah p {
  font-size: 16px
}

.signature {
  font-family: var(--psa-primary-font);
  padding-top: 1rem
}

.regards {
  font-style: italic;
  color: var(--psa-black-58)
}

.signatoryName {
  font-weight: 600;
  color: var(--psa-aladaam);
  font-size: 18px
}

.signatoryDesignation {
  color: var(--psa-black-58)
}

.yt-embed {
  position: relative;
  overflow: hidden;
  display: inline-block
}

.yt-embed:hover {
  cursor: pointer
}

.yt-embed img {
  max-width: 100%;
  height: auto;
  display: block
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

.play {
  background: red;
  border-radius: 50% / 10%;
  color: #FFF;
  font-size: 1em;
  height: 3em;
  margin: auto;
  padding: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  text-align: center;
  text-indent: .1em;
  transition: all 150ms ease-out;
  width: 4em
}

.play:hover {
  background: #ff8c00
}

.play::before {
  background: inherit;
  border-radius: 5% / 50%;
  bottom: 9%;
  content: "";
  left: -5%;
  position: absolute;
  right: -5%;
  top: 9%
}

.play::after {
  border-style: solid;
  border-width: 1em 0 1em 1.732em;
  border-color: transparent transparent transparent rgba(255, 255, 255, 0.75);
  content: ' ';
  font-size: .75em;
  height: 0;
  margin: -1em 0 0 -.75em;
  top: 50%;
  position: absolute;
  width: 0
}

.legislativeInstruments-bg {
  background-image: url(../../images/legislativeInstruments.png);
  min-height: 475px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: cover
}

#legislativeInstruments .highlighted-list ul li {
  background: url(../../images/listStyleType-1.svg);
  background-repeat: no-repeat;
  background-size: auto;
  padding-left: 1.8rem
}

#legislativeInstruments .highlighted-list ul li::before {
  display: none
}

#legislativeInstruments .tube-link {
  border-radius: 1rem
}

.dwnld-pdf-arrow {
  background-image: url(../../images/dwnld-pdf-arrow.svg)
}

#legislativeInstruments .tube-link:hover {
  transform: scale(.99)
}

#legislativeInstruments .tube-link:hover .dwnld-pdf-arrow,
#legislativeInstruments .tube-link:hover .tube-link-text {
  transform: translateY(2px)
}

#legislativeInstruments .tube-link:hover .tube-link-text {
  font-size: 19px
}

@media(max-width:580px) {
  #legislativeInstruments .tube-link {
    flex-direction: column
  }
}

#legislativeInstruments .li-title {
  color: var(--psa-black-28)
}

.powerBI-wrapper {
  height: 100vh;
  position: relative;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
}

.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: calc(100% - 10px);
  height: 100%;
  padding: 0
}

.monthly-figures {
  margin-bottom: 1rem;
}

.monthly-population {
  background-color: var(--psa-white-f8);
  border-radius: 24px;
  border: 1px dashed #c8c8c8;
  padding: 2rem 2rem 2.5rem;
}

.monthly-population h2 {
  font-size: 26px;
}

.card-white {
  background-color: var(--psa-white);
  padding: .5rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-family: var(--psa-primary-font);
}

.mp-gender-population {
  padding: .5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}

.mp-Totallabel {
  font-size: 24px;
}

.mp-TotalNumber {
  font-size: 36px;
  font-weight: 500;
  color: var(--psa-aladaam);
}

.mp-label {
  font-size: 20px;
}

.mp-number {
  font-size: 28px;
  font-weight: 500;
}

.mp-populationCount {
  margin-top: 1rem;
  padding-bottom: 1rem;
}

.note-yellow {
  background: var(--psa-note-yellow) url(../../images/notes-icon.svg);
  color: #342E0B;
  border-radius: 5px;
  font-family: var(--psa-primary-font);
  font-size: 20px;
  padding: 8px 15px 6px 3rem;
  background-position: 15px center;
  background-size: auto;
  background-repeat: no-repeat;
}

@media(max-width:1600px) {
  .mp-gender-population {
    text-align: center;
    flex-wrap: wrap;
  }
}

.event-content {
  font-family: var(--psa-primary-font);
}

.patronage {
  font-size: 20px;
  font-weight: 300;
}

.ministerName {
  font-size: 22px;
  font-weight: 500;
}

.ministerJobtitle {
  font-size: 18px;
  font-weight: 300;
}

.banner-event-tagline {
  font-size: 20px;
  font-weight: 300;
  text-transform: uppercase;
}

.banner-event-date {
  font-size: 20px;
  margin-top: 1rem;
}

.event-content .whiteBtn {
  color: var(--psa-dunedark) !important;
}

.bannerBtn,
.bannerBtn:visited {
  font-size: 18px;
  background: #fff;
  color: var(--psa-black-38);
  padding: .5rem 1rem;
  margin-right: .5rem;
  margin-bottom: .5rem;
  border: 1px solid transparent;
}

.bannerBtn:hover {
  background: transparent;
  color: #fff;
  border-color: #fff;
}

@media(min-width:768px) {
  a.bannerBtn.mobile {
    display: none
  }
}

@media(max-width:767px) {
  .event-image {
    display: none;
  }

  a.bannerBtn.mobile {
    display: block
  }

  .bannerBtn,
  .bannerBtn:visited {
    font-size: 16px
  }
}

@media(max-width:1600px) {
  .event-image {
    display: none;
  }
}

@media(min-width:850px) and (max-width:1024px) {
  .event-image {
    display: block;
  }
}

#webinarEvent .btnGroup {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

@media(max-width:1065px) {
  .banner-event-date {
    margin: 0;
  }

  #webinarEvent .card.flat-type {
    padding: 1rem 1.5rem;
  }
}

.download-excel {
  margin-top: 1rem;
}

.exportPopulationXls {
  background-color: var(--psa-palm);
  background-image: url(../../images/download-arrow-alt.svg);
  background-repeat: no-repeat;
  background-size: auto;
  color: #fff;
  font-family: var(--psa-primary-font);
  font-size: 20px;
  border: 1px solid transparent;
  border-radius: .25rem;
  text-align: center;
  padding: .25rem 1rem .25rem 2.5rem;
  background-position: 10px;
}

.exportPopulationXls:hover {
  background-color: var(--psa-white);
  background-image: url(../../images/download-arrow-palm.svg);
  border-color: var(--psa-palm);
  color: var(--psa-palm);
}

li#contactus {
  display: none;
}

.login-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: url(../../images/pattern-gray.svg);
  background-size: auto;
  background-position: center;
  flex: 1;
  font-family: var(--psa-primary-font);
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.login-container.container {
  max-width: 100%;
}

.login-row {
  display: flex;
  align-items: center;
  justify-content: center;
}

.login-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.loginTitle {
  width: 40%;
  padding-right: 3rem;
}

.login-col {
  border-left: 1px dashed var(--psa-black-c8);
  padding: 3rem 0 3rem 3rem;
}

.login-container .primaryBtn {
  font-size: 18px;
}

.login-container .primaryBtn:hover {
  transform: none;
}

.login-container .plainBtn {
  flex-direction: column;
  position: relative;
  padding: 0;
  font-size: 18px;
}

.login-container .plainBtn:after {
  content: '';
  background: var(--psa-aladaam);
  height: 2px;
  width: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  transition: all .2s ease-in;
}

.login-container .plainBtn:hover:after {
  width: 50%;
}

.otp-wrapper {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.otp-wrapper.show {
  display: flex;
}

#otp-input {
  display: flex;
  gap: .5rem;
  direction: ltr
}

#otp-input input {
  width: 4rem;
  padding: .5rem 0;
  font-size: 30px;
  text-align: center;
  border: 1px solid var(--psa-black-d8);
  border-radius: .25rem;
}

#otp-input input::-webkit-outer-spin-button,
#otp-input input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#otp-input input[type=number] {
  -moz-appearance: textfield;
}

.label {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  text-align: center;
  margin-bottom: .25rem;
}

.highlightedText {
  font-size: 22px;
  font-weight: 500;
  font-family: var(--psa-primary-font);
}

.inline-form-field {
  display: flex;
  justify-content: end;
}

.inline-form-field .col-form-label {
  padding-right: .5rem;
}

@media(max-width:992px) {
  .login-row {
    flex-direction: column;
  }

  .loginTitle {
    width: 100%;
    padding-right: 0;
  }

  .login-col {
    padding: 1rem 0;
    width: 100%;
    border-left: 0;
    border-top: 1px dashed var(--psa-black-c8);
    margin-top: 1rem;
    text-align: center;
  }

  .login-row {
    justify-content: start;
    padding-top: 2rem;
  }
}

@media(max-width:640px) {
  #otp-input input {
    width: 2.75rem;
    font-size: 24px;
  }
}

.login-container .copyright {
  display: block;
  padding-top: 24px;
  padding-bottom: 15px
}

@media(max-height:600px) {
  .login-row1 {
    height: auto !important
  }
}

.login-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: url(../../images/pattern-gray.svg);
  background-size: auto;
  background-position: center;
  flex: 1;
  font-family: var(--psa-primary-font);
  padding-left: 1.5rem;
  padding-right: 1.5rem
}

.login-container.container {
  max-width: 100%
}

.login-row {
  display: flex;
  align-items: center;
  justify-content: center
}

.login-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center
}

.loginTitle {
  width: 40%;
  padding-right: 3rem
}

.login-col {
  border-left: 1px dashed var(--psa-black-c8);
  padding: 3rem 0 3rem 3rem
}

.login-container .primaryBtn {
  font-size: 18px
}

.login-container .primaryBtn:hover {
  transform: none
}

.login-container .plainBtn {
  flex-direction: column;
  position: relative;
  padding: 0;
  font-size: 18px
}

.login-container .plainBtn:after {
  content: '';
  background: var(--psa-aladaam);
  height: 2px;
  width: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  transition: all .2s ease-in
}

.login-container .plainBtn:hover:after {
  width: 50%
}

.otp-wrapper {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center
}

.otp-wrapper.show {
  display: flex
}

#otp-input {
  display: flex;
  gap: .5rem;
  direction: ltr
}

#otp-input input {
  width: 4rem;
  padding: .5rem 0;
  font-size: 30px;
  text-align: center;
  border: 1px solid var(--psa-black-d8);
  border-radius: .25rem
}

#otp-input input::-webkit-outer-spin-button,
#otp-input input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0
}

#otp-input input[type=number] {
  -moz-appearance: textfield
}

.label {
  font-family: var(--psa-primary-font);
  font-size: 18px;
  text-align: center;
  margin-bottom: .25rem
}

.highlightedText {
  font-size: 22px;
  font-weight: 500;
  font-family: var(--psa-primary-font)
}

.inline-form-field {
  display: flex;
  justify-content: end
}

.inline-form-field .col-form-label {
  padding-right: .5rem
}

@media(max-width:992px) {
  .login-row {
    flex-direction: column
  }

  .loginTitle {
    width: 100%;
    padding-right: 0
  }

  .login-col {
    padding: 1rem 0;
    width: 100%;
    border-left: 0;
    border-top: 1px dashed var(--psa-black-c8);
    margin-top: 1rem;
    text-align: center
  }

  .login-row {
    justify-content: start;
    padding-top: 2rem
  }
}

@media(max-width:640px) {
  #otp-input input {
    width: 2.75rem;
    font-size: 24px
  }
}

.login-container .copyright {
  display: block
}

@media(max-height:640px) {
  .login-row {
    height: auto !important
  }
}

.highlighted-indices {
  background: var(--psa-white-f8);
  padding-top: 2rem;
  padding-bottom: 2rem
}

.indices-card {
  border: 1px solid var(--psa-black-d8);
  border-radius: 1rem;
  background: var(--psa-white);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-family: var(--psa-primary-font);
  height: 100%
}

.indices-title {
  font-size: 22px;
  margin-top: .65rem;
  text-align: center
}

.indices-source-wrapper {
  text-align: center
}

.indices-source {
  font-size: 18px;
  color: var(--psa-black-38);
  background: url(../../images/link.svg);
  background-repeat: no-repeat;
  background-position: left 3px;
  padding-left: 1.25rem;
  text-align: center
}

.indices-source-wrapper a {
  color: var(--psa-aladaam) !important;
}

.indices-year {
  background: #f1f1f1;
  padding: .25rem .75rem;
  border-radius: 5px;
  margin-right: 1rem
}

.rs-label {
  background: var(--psa-dune);
  color: #fff;
  text-align: center;
  border-radius: .5rem;
  padding: .2rem .5rem .1rem;
  display: inline-block;
  margin-bottom: .25rem
}

.rs-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem
}

.rs-item {
  padding: 0 2rem
}

.rs-item:nth-child(2) {
  border-left: 1px solid var(--psa-black-d8)
}

.rs-value {
  font-size: 22px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: .5rem
}

.indice-note ul {
  margin: 0;
  padding: 0;
  list-style: none
}

.indice-note ul li {
  position: relative;
  display: flex;
  align-items: flex-start;
  margin-top: .5rem;
  background-image: url(../../images/listStyleType.svg);
  background-repeat: no-repeat;
  background-position: left -1px;
  padding-left: 1.75rem;
  transform: rotate(0deg)
}

.indices-card-header {
  display: flex;
  flex-direction: column;
  align-items: center
}

.indices-readmore {
  margin-top: .5rem;
  margin-bottom: 1.5rem
}

@media(max-width:1450px) and (min-width:992px) {
  .rs-item {
    padding: 0 .5rem
  }
}

@media (min-width: 992px) {
  .highlighted-indices .col-lg-3 {
    flex: 0 0 auto;
    width: 33.333333%
  }
}

@media (min-width: 1440px) {
  .highlighted-indices .col-lg-3 {
    flex: 0 0 auto;
    width: 25%
  }
}

.all-indices-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  gap: 1rem
}

.all-indices-header .skylineBtn {
  font-size: 18px
}

#allIndicesAccordion .accordion-item {
  border: 1px solid #d8d8d8;
  border-radius: 24px;
  margin-bottom: 24px
}

#allIndicesAccordion .accordion-header .accordion-button {
  background: #F8F8F8;
  font-size: 25px;
  border-bottom: 2px solid var(--psa-black-c8);
  border-radius: 24px !important
}

#allIndicesAccordion .accordion-button::after {
  background-image: var(--accordion-open)
}

#allIndicesAccordion .accordion-button:not(.collapsed)::after {
  background-image: var(--accordion-closed);
  margin-right: 0
}

#allIndicesAccordion .accordion-button:not(.collapsed) {
  background: #fff;
  box-shadow: none;
  color: var(--psa-aladaam);
  border-bottom: 0;
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  margin: 0
}

.indicator-count {
  font-size: 18px;
  background: var(--psa-white);
  padding: .3rem .5rem .15rem;
  border: 1px solid var(--psa-black-d8);
  border-radius: .5rem;
  color: var(--psa-skyline);
  margin-left: .65rem;
  font-weight: 500
}

.group-kpis {
  font-family: var(--psa-primary-font);
  background: var(--psa-white-f8);
  margin-bottom: 1.5rem
}

.kpis-card-list {
  display: flex;
  align-items: start;
  gap: 1rem
}

.group-kpis-header {
  padding-bottom: 1rem
}

.kpis-card-text .indices-title {
  margin: 0;
  text-align: left
}

.kpis-card-text .indices-source-wrapper {
  text-align: left
}

.kpis-card-text .indices-year {
  background: var(--psa-white);
  display: inline-flex
}

.nested-indices .group-kpis-header {
  display: flex;
  justify-content: space-between
}

.nested-indices .rs-wrapper {
  padding: 0;
  justify-content: start
}

.nested-indices .rs-wrapper .rs-item {
  display: flex;
  gap: .5rem;
  padding: 0
}

.nested-indices .rs-wrapper .rs-item:nth-child(1) {
  padding-right: 1rem
}

.nested-indices .rs-wrapper .rs-item:nth-child(2) {
  padding-left: 1rem
}

.complex .rs-wrapper {
  padding: 1rem
}

.complex .indices-card {
  border: 1px dashed var(--psa-black-d8)
}

.title-wrapper {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 64px);
  flex-wrap: wrap;
  font-family: var(--psa-primary-font)
}

.accord-title {
  display: inline;
  flex-direction: column
}

.accord-title .indicator-count {
  margin: 0;
  display: inline-block
}

@media(min-width: 992px) {
  .accordion-body .col-lg-3 {
    flex: 0 0 auto;
    width: 33.333333%
  }
}

@media (min-width: 1440px) {
  .accordion-body .col-lg-3 {
    flex: 0 0 auto;
    width: 25%
  }
}

@media(max-width:992px) {
  .nested-indices .group-kpis-header {
    flex-direction: column;
    align-items: start
  }

  .nested-indices .indices-title {
    padding-bottom: .5rem
  }

  .nested-indices .indices-readmore {
    margin-top: 1rem;
    margin-bottom: 0
  }
}

@media(max-width:640px) {

  .kpis-card-list,
  .title-wrapper {
    flex-direction: column;
    width: 100%;
    align-items: center
  }

  .kpis-card-text {
    width: 100%;
    display: flex;
    flex-direction: column;
  }

  .kpis-card-text .indices-title {
    text-align: center;
  }

  .kpis-card-text .indices-source-wrapper {
    text-align: center;
  }

  .kpis-card-text .indices-year {
    justify-content: center;
  }
}

@media(max-width:500px) {
  .complex .rs-wrapper .rs-item {
    display: inline
  }

  .rs-item {
    padding: 0 1rem
  }

  .indicator-count {
    font-size: 16px;
    margin-left: .5rem;
    margin-right: .5rem
  }

  #allIndicesAccordion .accordion-header .accordion-button {
    font-size: 22px
  }

  .rs-value {
    font-size: 20px
  }

  .nested-indices .rs-item {
    display: inline !important
  }
}

@media(max-width:375px) {
  .indices-card {
    padding: 1rem
  }

  .group-kpis {
    padding: .5rem !important
  }
}

@media(max-width:320px) {
  .rs-item {
    padding: 0 !important;
    border: 0 !important;
    display: flex;
    gap: 1rem
  }

  .rs-wrapper {
    justify-content: end;
    flex-direction: column;
    gap: .5rem
  }
}

@media(max-width:1240px) and (min-width:768px) {
  .complex .rs-wrapper .rs-item {
    display: inline
  }
}

@media(max-width:860px) and (min-width:768px) {
  .nested-indices .rs-wrapper .rs-item {
    display: inline
  }
}

#s4-workspace.freeze {
  overflow: hidden
}

.kpi-detail-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -100%;
  width: 100%;
  background: #fff;
  z-index: 9999;
  overflow-y: auto;
  transition: all .5s ease-in
}

.kpi-detail-container.show {
  left: 0;
  width: 100%
}

.backToDashboard {
  background: var(--psa-aladaam) url(../../images/pattern-AlAdaam.png);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  height: 48px;
  display: flex;
  align-items: center
}

.backBtn {
  display: flex;
  justify-content: end
}

.returnArrow-alt-icon {
  background: url(../../images/returnArrow-alt.svg) no-repeat 50%;
  height: 24px;
  width: 24px;
  display: flex;
  margin-left: .5rem;
  transform: rotate(0deg)
}

.backBtn a {
  color: var(--psa-white) !important;
  padding: .45rem 1rem;
  display: flex;
  align-items: center;
  border: 1px solid transparent;
  font-family: var(--psa-primary-font);
  gap: .65rem
}

.backBtn a:hover {
  transform: translateX(-10px)
}

.backBtn a span {
  margin-top: -4px
}

.kpi-detail-title {
  background: var(--psa-white-f8);
  padding: 1rem;
  display: flex;
  width: 100%
}

.reading-wrapper .rs-wrapper .rs-item {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 0
}

.reading-row {
  display: flex;
  justify-content: space-between;
  align-items: end
}

.kpis-card-text {
  width: calc(100% - 130px);
}

.reading-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.reading-wrapper .rs-wrapper {
  padding: 0;
  gap: 1rem
}

.kpi-detail-header {
  display: flex;
  justify-content: stretch;
  align-items: stretch
}

.kpi-detail-download a {
  font-size: 18px
}

.kpi-detail-download a:hover {
  background: #fff;
  border: 1px solid transparent
}

.kpi-detail-wrapper {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem
}

.kpi-content {
  font-family: var(--psa-primary-font);
  margin-top: 2rem
}

.kpi-content-title {
  font-size: 28px
}

.kpi-content-desc {
  font-size: 18px;
  font-weight: 300
}

.indice-note.kpi-content-note ul li {
  font-family: var(--psa-primary-font);
  font-size: 18px
}

.indice-note.kpi-content-note {
  margin-top: 2rem
}

.kpi-content-chart {
  background: #e8e8e8;
  padding: 1.5rem;
  border-radius: 1.5rem;
  margin-top: .5rem
}

.chart-wrapper {
  background: var(--psa-white);
  border-radius: 1rem;
  padding: 1.5rem
}

.reading-wrapper .rs-wrapper .rs-item:nth-child(2) {
  padding-left: 1rem
}

@media(max-width:992px) {
  .kpi-detail-header {
    flex-direction: column
  }

  .kpi-detail-title {
    width: 100%
  }

  .kpi-content-chart {
    border-radius: 1rem;
    padding: 1rem
  }

  .chart-wrapper {
    border-radius: .5rem;
    padding: 1rem
  }

  .kpis-card-text {
    flex-wrap: wrap
  }
}

@media(max-width:640px) {
  .reading-row {
    flex-direction: column;
    align-items: self-start
  }

  .kpi-detail-download {
    margin-top: 1rem
  }
}

@media(max-width:500px) {
  .reading-wrapper .rs-wrapper .rs-item {
    flex-direction: column;
    gap: 0;
    align-items: start
  }
}

@media(max-width:375px) {
  .kpi-detail-title {
    flex-direction: column
  }

  .reading-wrapper .rs-wrapper {
    flex-direction: row
  }

  .reading-wrapper .rs-wrapper .rs-item:nth-child(2) {
    padding-left: 1rem !important;
    border-left: 1px solid #d8d8d8 !important
  }
}

@media(max-width:350px) {
  .all-indices-header {
    flex-direction: column;
    align-items: start
  }
}

.kpi-search-result {
  background: var(--psa-white-f8);
  display: flex;
  gap: .5rem;
  flex-direction: column;
  padding: 1rem;
  margin-top: 1rem
}

.kpi-search-item {
  display: flex;
  justify-content: space-between;
  font-family: var(--psa-primary-font);
  padding: .65rem;
  background: var(--psa-white)
}

.kpi-item-left .indices-title {
  font-size: 20px;
  text-align: left
}

.kpi-item-left .indices-source-wrapper {
  text-align: left
}

.kpi-item-right {
  display: flex;
  align-items: center;
  gap: 2rem
}

.kpi-item-right .rs-wrapper {
  padding: 0
}

.kpi-item-right .rs-item {
  display: flex;
  gap: .5rem;
  padding: 0 .5rem
}

.kpi-item-right .rs-label {
  margin: 0;
  padding: .1rem .5rem .05rem;
  display: flex;
  align-items: center
}

.kpi-item-right .rs-value {
  font-size: 20px
}

.kpi-item-right .indices-readmore {
  margin: 0
}

.kpi-item-right .primaryBtn {
  padding: .15rem 1rem
}

.kpi-item-right .primaryBtn:hover {
  background: #fff;
  transform: none;
  border-color: var(--psa-aladaam)
}

@media(max-width:1200px) {
  .kpi-item-right .rs-item {
    display: inline
  }

  .kpi-item-right .rs-label {
    display: inline-block
  }
}

@media(max-width:992px) {

  .kpiReleaseDate,
  .kpiSearch-col {
    width: 100%;
    text-align: center
  }

  .kpiSearch-col {
    margin-top: 1rem
  }
}

@media(max-width:767px) {
  #kpi .inline-form-field {
    flex-direction: column
  }
}

@media(max-width:580px) {
  .kpi-item-right .rs-item {
    display: inline;
    border-left: 0
  }

  .kpi-item-right .rs-label {
    display: inline-block
  }

  .kpi-item-left .indices-title,
  .kpi-item-left .indices-source-wrapper {
    text-align: center
  }
}

@media(max-width:580px) {
  .kpi-search-item {
    flex-direction: column;
    align-items: center;
    gap: .5rem
  }

  .kpi-item-right {
    flex-direction: column;
    gap: .5rem
  }
}

a.closeSearch {
  position: relative;
  display: flex;
  justify-content: flex-end;
  padding: 0 2.8rem;
  color: #000;
  align-items: center;
  font-size: 16px;
  font-family: var(--psa-primary-font)
}

.kpi-search-result .close {
  width: 24px;
  height: 24px;
  top: 2px;
  opacity: .5rem
}

.kpi-search-result .close:before,
.kpi-search-result .close:after {
  height: 24px
}

.kpi-search-result .section-heading {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem
}

@media(max-width:374px) {
  .kpi-search-result .section-heading {
    flex-direction: column-reverse
  }

  .kpi-search-result .close {
    top: -1px
  }
}

.form-control {
  padding: .375rem .75rem !important;
}

.contrastMode,
.contrastMode p,
.contrastMode div,
.contrastMode ul {
  background: var(--psa-black) !important;
  color: var(--psa-white) !important
}

.contrastMode a {
  background: var(--psa-black);
  color: #ff0 !important
}

.contrastMode h1.primary-text,
.contrastMode .indices-source,
.contrastMode .li-title,
.contrastMode h2,
.contrastMode h3 {
  color: #fff !important
}

.contrastMode #allIndicesAccordion .accordion-header .accordion-button {
  background: #000;
  border-bottom: 0
}

.contrastMode #allIndicesAccordion .accordion-button::after {
  background-image: var(--accordion-open-alt)
}

.contrastMode #allIndicesAccordion .accordion-button:not(.collapsed)::after {
  background-image: var(--accordion-closed-alt)
}

.contrastMode .underlined:after {
  background: #fff
}

.contrastMode footer {
  border-top-color: #fff
}

.contrastMode .navbar-brand {
  background: #fff !important
}

.contrastMode .indice-note ul li,
.contrastMode .highlighted-list ul li::before {
  background-image: url(../../images/listStyleType-alt.svg)
}

.contrastMode .indices-source {
  background-image: url(../../images/link-alt.svg)
}

.contrastMode .primaryBtn,
.contrastMode .skylineBtn,
.contrastMode .primaryBtn:hover,
.contrastMode .skylineBtn:hover {
  border: 1px solid #ff0 !important;
  background: #000;
  color: #ff0 !important
}

.contrastMode footer img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%)
}

.contrastMode .link-hover-line a:after {
  background: #ff0
}

.contrastMode nav.navbar.navbar-expand-lg {
  border-bottom: 1px solid;
  border-top: 1px solid
}

.contrastMode .logo-seperator {
  background: #fff
}

.contrastMode #piconIndices {
  padding-right: 1rem;
}

.contrastMode #iconIndices img,
.contrastMode #piconIndices img {
  background: #fff;
  border-radius: .5rem;
}

.contrastMode .primaryBtn:hover .explore-more-icon,
.contrastMode .skylineBtn:hover .explore-more-icon {
  background: url(../../images/exploremore-arrow-w.svg) no-repeat 50%
}

.dataCollectionBanner-bg {
  background-image: url(../../images/dataCollection-banner.png);
  min-height: 480px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: auto;
}

/*Main Speaker*/
.ms-profile-title {
  font-size: calc(1.2rem + .5vw);
  font-weight: 500;
  color: var(--psa-aladaam);
}

.main-speaker {
  font-family: var(--psa-primary-font);
}

.ms-profile-jobTitle {
  font-size: calc(.8rem + .5vw);
}

.ms-subTitle {
  font-size: 28px;
  font-weight: 500;
}

.main-speaker p {
  font-size: 20px;
}

.ms-speech {
  padding-left: 3rem;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.ms-speech .icon-16.biography {
  height: 24px;
  width: 24px;
  margin-right: .75rem;
}

.main-speaker .plainBtn {
  font-size: 18px !important;
  padding: 0;
  position: relative;
}

.ms-btnGroup {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.main-speaker .plainBtn:hover:before {
  width: 97%;
  transition: all .3s ease-in;
}

.main-speaker .plainBtn:before {
  content: "";
  height: 1px;
  width: 0;
  position: absolute;
  background: #cecece;
  bottom: 4px;
  left: 5px;
}

.main-speaker .row {
  align-items: center;
}

.ms-speech:before {
  content: "";
  background-image: url(../../images/events/seperator-diamond-line.svg);
  height: 182px;
  width: 17px;
  display: flex;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  background-repeat: no-repeat;
}

@media(max-width:1200px) {
  .ms-speech {
    border-left: 2px solid var(--psa-aladaam);
  }

  .ms-speech:before {
    background: #fff url(../../images/events/seperator-diamond-line.svg);
    left: -10px
  }
}

@media(max-width:1024px) {

  .main-speaker .row .col-md-4,
  .main-speaker .row .col-md-8 {
    width: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    text-align: center;
  }
}

@media(max-width:767px) {

  .main-speaker,
  .ms-speech {
    width: 100%;
    border-left: 0;
    padding-left: 15px;
    padding-right: 15px;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .ms-speech:before {
    display: none;
  }

  .main-speaker {
    gap: 2rem;
  }
}

/*Datathon*/
#datathon .card {
  background: #000 url(../../images/aura.png) no-repeat top left;
  color: #fff;
  font-family: var(--psa-primary-font);
  justify-content: center;
  padding-left: calc(3rem + 2vw)
}

#datathon .col-lg-9.col-md-8 {
  justify-content: center;
  display: flex;
  flex-direction: column
}

.datathon-subtitle {
  font-weight: 500;
  color: #FDF39D;
  font-size: 21px
}

#datathon h1 {
  font-size: calc(2rem + 1vw);
  color: #fff;
  padding: 0;
  line-height: calc(2rem + 1.5vw)
}

#datathon p {
  font-size: calc(.8rem + .5vw);
  font-weight: 300;
  line-height: calc(.8rem + .8vw)
}

.datathonBtnGrp {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  flex-wrap: wrap
}

.datathonBtn {
  background: #fff;
  border-radius: 3rem;
  color: #8A1538;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .75rem 1.5rem;
  font-size: 18px
}

.datathonBtn span {
  inset-block-start: 2px;
  position: relative;
  padding-left: .5rem;
  padding-right: .5rem;
  color: var(--psa-aladaam);
}

.datathonBtn:nth-child(2) {
  padding: .2rem .2rem .2rem 1.5rem
}

.datathonBtn .explore-more-icon {
  background: url(../../images/exploremore-arrow.svg) no-repeat 50%
}

.place {
  background: var(--psa-skyline);
  color: #fff;
  border-radius: 3rem;
  padding: .5rem 1rem;
  margin-left: .5rem
}

@media(max-width:992px) {
  #datathon .col-lg-9.col-md-8 {
    width: 100%
  }

  #datathon .col-lg-3.col-md-4 {
    display: none
  }

  #datathon .card {
    padding-left: 30px
  }

  #datathon p {
    line-height: initial
  }

  #datathon .card:after {
    content: "";
    display: block;
    background: #000 url(../../images/aura.png) no-repeat top left
  }
}

@media(max-width:525px) {
  .datathonBtnGrp {
    justify-content: center
  }

  .datathonBtn:nth-child(2) {
    padding: .5rem;
    flex-wrap: wrap;
    gap: .25rem
  }

  .datathon-subtitle {
    font-size: 18px
  }

  #datathon p {
    font-size: 16px
  }

  .place {
    padding: 1rem;
    margin: 0;
    text-align: center
  }
}

#datathonPopup {
  overflow: initial;
  1position: relative
}

#datathonPopup .modal-content {
  background: var(--psa-aladaam) url(../../images/datathon-globe-maroon.svg) no-repeat bottom right;
  border-radius: 2rem;
  background-size: 50%;
  padding: 3rem 1rem;
  min-height: 500px;
}

#datathonPopup .modal-content h1 {
  color: #fff;
}

#datathonPopup .modal-content p {
  font-size: 22px;
  font-family: var(--psa-primary-font);
  width: 80%;
  padding-top: 1rem;
  font-weight: 300;
}

.datathonDatePopup {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-top: 2rem;
}

.DDP {
  font-family: var(--psa-primary-font);
  font-size: 20px;
}

#datathonPopup .datathonBtn {
  font-size: 22px;
  font-weight: 600;
  font-family: var(--psa-primary-font);
  color: #000;
  margin-top: 1rem;
}

#datathonPopup .datathonBtn:hover {
  transform: translateX(3px);
}

.closePopup {
  top: -16px;
  position: absolute;
  right: -16px;
  z-index: 99;
  background: #fff;
  border-radius: 100%;
  height: 48px;
  width: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.closePopup button.btn-close {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%238A1538'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
  transition: none;
}

@media(max-width:991px) {
  #datathonPopup .modal-content p {
    width: 100%;
    font-size: 18px
  }
}

@media(max-width:575px) {
  .closePopup {
    left: 50%;
    transform: translateX(-50%);
    right: auto;
  }
}

a.datathonBtn img {
  transform: rotateY(0deg);
}

.joinusBanner-bg {
  background-image: url(../../images/joinus-banner.png);
  min-height: 480px;
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: auto;
}

.joinus-request-form {
  padding: .7rem;
}

.datepicker {
  padding: 1rem;
}

.datepicker td,
.datepicker th {
  padding: .5rem;
}

.datepicker .datepicker-switch,
.datepicker .next,
.datepicker .prev,
.datepicker tfoot tr th {
  font-size: 1.5rem;
}

/*Staff Only*/
.staffOnly-bg {
  background-color: var(--psa-aladaam);
  min-height: 100%;
  font-family: var(--psa-primary-font);
}

.staffOnly-bg .container-fluid {
  padding-left: 30px;
  padding-right: 30px;
}

.header-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  flex-wrap: wrap;
  gap: 2rem;
}

.dropdown-toggle::after {
  border: 0;
  background-image: url(../../images/staffOnly/down-arrow.svg);
  display: block;
  content: "";
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: auto;
  margin: 0;
}

/* profile menu */
.soProfile {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  text-align: end;
}

.soProfile h3 {
  text-align: end;
  line-height: 1;
  margin-bottom: 4px;
  font-weight: 500;
  color: var(--psa-white);
  font-size: 22px;
}

.soProfile p {
  line-height: 1;
  font-size: 16px;
  color: var(--psa-white);
  margin-bottom: 0;
}

.soProfile .initial-box {
  position: relative;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--psa-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  color: var(--psa-black);
}

/* menu (the right one) */
.soMenu {
  position: absolute;
  top: 3.5rem;
  right: 0;
  width: 200px;
  min-height: 100px;
  background: #fff;
  box-shadow: 0 10px 20px rgba(0, 0, 0, .2);
  opacity: 0;
  transform: translateY(-10px);
  display: none;
  transition: 300ms;
}

.soMenu::before {
  content: '';
  position: absolute;
  top: -10px;
  right: 14px;
  width: 20px;
  height: 20px;
  background: #fff;
  transform: rotate(45deg);
  z-index: -1;
}

.soMenu.active {
  opacity: 1;
  transform: translateY(0);
  display: block;
  padding: 0;
  border-radius: 3px;
}

/* menu links */
.soMenu ul {
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: 10;
  background: #fff;
  padding-left: 0;
  margin-bottom: 0;
}

.soMenu ul li {
  list-style: none;
}

.soMenu ul li:hover {
  background: #eee;
}

.soMenu ul li a {
  text-decoration: none;
  color: #000;
  display: flex;
  align-items: center;
  padding: 15px 20px;
  gap: 6px;
}

.language {
  background-image: url(../../images/staffOnly/language.svg)
}

.signout {
  background-image: url(../../images/staffOnly/signout.svg)
}

.mainContent {
  background-color: var(--psa-white);
  border-top-left-radius: 40px;
  border-top-right-radius: 40px;
  padding: 2rem;
}

.soCard {
  background: #EEEEEE;
  border-radius: 1.5rem;
  padding: 1.5rem 2rem 1rem;
  margin-bottom: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  height: calc(100% - 1.5rem);
  /* align-items: center; */
}

a.soCard:hover {
  transition: all .2s ease-in;
  transform: scale(1.05);
}

.soCardImg {
  width: 32px;
  height: 32px;
}

.soCardImg img {
  width: 100%;
}

.soCardTitle {
  font-size: 20px;
  color: #282828;
  line-height: 24px;
}

.helpdesk {
  background: var(--psa-skyline);
  border-radius: 40px;
  padding: 2rem;
  color: var(--psa-white);
  min-height: 100%
}

.hdTitle {
  font-size: 32px;
  padding-bottom: 1rem;
  font-weight: 500;
}

.hdTitle:after {
  content: "";
  display: block;
  background: var(--psa-white);
  border-radius: 3px;
  height: 3px;
  width: 50px;
  margin-bottom: 1rem;
  margin-top: -4px;
}

.helpDesk-item {
  border-bottom: 1px dashed rgba(255, 255, 255, .4);
  margin-bottom: 1rem;
  padding-bottom: 1rem;
}

.helpDesk-phone,
.helpDesk-mail {
  font-size: 20px;
  display: flex;
  align-items: center;
  gap: .3rem;
  padding-bottom: .5rem;
}

.item-title {
  font-size: 25px;
  padding-bottom: .7rem;
}

.helpDesk-phone .phone-number:before {
  content: "+974";
  color: rgba(255, 255, 255, .5);
  margin-right: .35rem;
  font-size: 20px;
  position: initial;
  direction: ltr;
}

.icon-20 {
  height: 20px;
  width: 20px;
  display: flex;
  margin-right: .35rem
}

.phone {
  background-image: url(../../images/staffOnly/phone.svg)
}

.mail {
  background-image: url(../../images/staffOnly/mail.svg)
}

.mainContent h1 {
  font-size: 32px;
  font-weight: 500;
  margin-bottom: 1rem;
}

.userManuals {
  background: var(--psa-dune);
  padding-top: 1rem;
  border-radius: 30px 30px 50px 50px;
}

.userManuals h2 {
  padding-left: 2rem;
  padding-right: 2rem;
  color: var(--psa-white);
  font-size: 25px;
  margin-bottom: .25rem;
}

.userManual-wrapper {
  background: var(--psa-white);
  border-radius: 40px 40px 50px 50px;
  border: 2px solid var(--psa-dune);
  padding: 1.5rem 1.5rem .5rem;
}

.userManual-item {
  background: var(--psa-white-ef);
  display: block;
  margin-bottom: 1.5rem;
  padding: 1rem;
  border-radius: 1rem;
  display: flex;
  align-items: center;
  gap: .75rem;
  height: calc(100% - 1.5rem);
}

.userManual-icon {
  width: 28px;
  height: 28px;
}

.userManual-icon img {
  width: 100%;
}

.userManual-title {
  font-size: 18px;
  color: #383838;
  display: flex;
  flex-direction: column;
  width: calc(100% - 30px);
}

.userManual-title span {
  background: var(--psa-palm);
  font-size: 15px;
  padding: .15rem .5rem;
  border-radius: 8px 5px;
  color: var(--psa-white);
}

.userManual-item:hover .userManual-title,
.userManual-item:hover .userManual-icon {
  transform: translateX(10px);
}

.right-info {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.lang a {
  color: #fff;
  display: flex;
  align-items: center;
  background: transparent;
  border: 2px solid #fff;
  border-radius: 100px;
  padding: .25rem .5rem;
  font-size: 18px;
}

.lang a:hover {
  border-color: rgba(255, 255, 255, .7)
}

a.logout {
  color: #fff;
  line-height: 16px;
  font-size: 16px;
}

.soCopyright {
  text-align: center;
  padding: 1.5rem 0;
}

@media(max-width:1200px) {

  .dashboard .col-lg-9.col-md-12,
  .dashboard .col-lg-3.col-md-12 {
    width: 100%;
  }

  .userManuals {
    margin-bottom: 1.5rem
  }
}

@media(max-width:767px) {
  .header-wrapper {
    justify-content: center;
    gap: 1rem;
  }

  .mainContent h1,
  .hdTitle {
    font-size: 28px;
  }

  .item-title {
    font-size: 22px;
  }

  .soProfile h3 {
    font-size: 20px;
  }

  .soCardTitle,
  .helpDesk-phone,
  .helpDesk-mail {
    font-size: 18px;
  }

  .mainContent,
  .userManual-wrapper,
  .helpdesk {
    padding: 1.5rem 1rem;
  }

  .userManuals h2 {
    font-size: 22px
  }
}

@media(max-width:375px) {
  .soUser {
    width: 180px;
    white-space: normal;
  }

  .mainContent h1,
  .hdTitle {
    font-size: 26px;
  }

  .item-title {
    font-size: 20px;
  }

  .soProfile h3 {
    font-size: 18px;
  }

  .soCardTitle,
  .helpDesk-phone,
  .helpDesk-mail,
  .userManual-title {
    font-size: 16px;
    line-height: 20px;
  }

  .userManual-item {
    flex-direction: column;
    justify-content: flex-start;
    align-items: self-start;
    gap: .5rem;
  }

  .right-info {
    flex-direction: column-reverse;
    gap: 1rem;
    padding-top: .5rem;
  }

  .site-logo img {
    height: 65px;
  }

  .staffOnly-bg .container-fluid {
    padding-left: 15px;
    padding-right: 15px
  }
}

a.empLogin {
  font-family: var(--psa-primary-font);
  color: var(--psa-white);
  font-size: 16px;
  border-right: 2px solid rgba(255, 255, 255, .9);
  padding-right: 1rem;
  line-height: 20px;
  margin-right: .25rem;
}

a.empLogin:after {
  content: "";
  background: var(--psa-white);
  height: 2px;
  width: 0;
  display: block;
  border-radius: 3px;
  transition: all .3s ease-in
}

a.empLogin:hover:after {
  width: 100%;
}

@media(min-width:992px) {
  li#empPortal {
    display: none;
  }

}


/*Employee Portal Login*/

.employeeLogin {
  background: var(--psa-aladaam) url(../../images/staffOnly/employee-login-img.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom center;
  justify-content: end;
  display: flex;
}

.emplogin-content {
  width: 57%;
  min-height: 100vh;
  background: var(--psa-white);
  border-top-left-radius: 2.5rem;
  border-bottom-left-radius: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  padding: 2rem;
  text-align: center;
  font-family: var(--psa-primary-font);
}

@media(min-width:768px) {
  .emplogin-content {
    margin-left: -50px;
  }
}

.resetPassword a {
  font-size: 20px;
  color: var(--psa-aladaam);
  transition: all .3s ease-in;
}

.resetPassword a:after {
  content: "";
  height: 2px;
  display: block;
  width: 100%;
  background-color: var(--psa-aladaam);
  margin-top: -2px;
}

.resetPassword a:hover {
  color: var(--psa-skyline);
}

.resetPassword a:hover:after {
  background-color: #5688a5
}

.emplogin-help {
  width: 550px;
  font-size: 18px;
}

.emploginBtn a {
  background-color: var(--psa-aladaam);
  color: var(--psa-white);
  padding: .75rem 2.2rem;
  border-radius: 5rem;
  font-size: 20px;
}

.emploginBtn a:hover {
  background: var(--psa-dune);
}

@media (max-width:1100px) {
  .emplogin-help {
    width: 100%;
  }
}

@media (max-width:992px) {
  .employeeLogin h1 {
    font-size: 30px;
  }
}

@media (max-width:800px) {
  .emplogin-content {
    padding: 1rem 2rem;
  }

  .emplogin-help {
    font-size: 16px;
  }
}

@media (max-width:767px) {
  .emplogin-content {
    position: relative;
    z-index: 99;
    width: 100%;
    border-top-right-radius: 2.5rem;
    border-bottom-left-radius: 0;
    min-height: auto;
  }

  .employeeLogin {
    padding-top: 8rem;
  }
}


@media(min-width:2000px) {
  .emplogin-content {
    gap: 3rem;
  }

  .npc-logo img {
    width: 100%;
  }

  .npc-logo {
    width: 400px;
  }

  .emplogin-content h1 {
    font-size: 50px;
  }

  .emploginBtn a {
    font-size: 30px;
  }

  .resetPassword a {
    font-size: 30px;
  }

  .emplogin-help {
    font-size: 26px;
    width: 800px;
  }

}

/* PODCAST STYLES */
.podcast-container {
  background-image: url(../../images/podcast/podcastIntroBG.png);
  background-position: top center;
  height: 934px;
}

.podcast-banner {
  height: 100%;
  padding: 80px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.podcast-header h1 {
  font-size: calc(3rem + 2vw);
  color: #fff;
  text-transform: uppercase;
  width: 50%;
  text-align: center;
  font-weight: 600;
  padding-top: 3rem;
  line-height: calc(3rem + 2vw);
}

.podcast-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.btn-altanmiya,
.btn-altanmiya:visited {
  background: transparent;
  color: white;
  border: 1px solid;
  border-radius: 0;
  font-family: var(--psa-primary-font);
  padding: .5rem 1rem .35rem;
  font-size: 20px;
}

.btn-altanmiya:hover {
  background: #fff;
  color: var(--psa-aladaam);
}

.podcast-banner-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.podcast-intro {
  background: var(--psa-aladaam);
  padding: 1.5rem 80px 0;
}



.podcast-intro-wrapper {
  display: flex;
  align-items: center;
  gap: 5rem;
}

.podcast-intro-img {
  width: 500px;
  display: flex;
  align-items: end;
  justify-content: center;
}

.podcast-intro-content {
  font-size: calc(1.56rem + .525vw);
  line-height: calc(2.5rem + .525rem);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #fff;
  font-weight: 300;
  font-family: var(--psa-primary-font);
  width: calc(100% - 600px);
}

.podcast-askQuestion {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  position: relative;
}

.podcast-guestInfo {
  background: #000 url(../../images/podcast/guestInfoBg-en.svg);
  min-height: 941px;
  padding: 41px 80px;
  font-family: var(--psa-primary-font);
  color: #fff;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: contain;
  min-height: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.episode-no {
  border: 1px solid #fff;
  display: inline-block;
  padding: .75rem 1.5rem .5rem;
  text-transform: uppercase;
  font-size: 25px;
  line-height: 25px;
}

.episode-intro {
  font-size: 25px;
  font-weight: 300;
  padding-top: 2rem;
  padding-bottom: .75rem;
  line-height: 28px;
}

.podcast-content {
  padding-bottom: 3rem;
}

.guest-name {
  font-size: calc(4rem + 2vw);
  font-weight: 600;
  line-height: calc(4rem + 2vw);
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.guest-position {
  font-size: 25px;
  font-weight: 300;
}

.episode-intro:after {
  content: '';
  height: 1px;
  display: block;
  width: 50%;
  background: #fff;
  margin-top: .65rem;
}

.podcast-askQuestion-formContainer {
  background: #f8f8f8 url(../../images/podcast/askQuestion-pattern-bg.svg);
  padding: 4rem 4rem 1rem;
  background-position: top left;
  background-repeat: no-repeat;
  position: relative;
}

.podcast-askQuestion-header h2 {
  font-size: 50px;
  font-weight: 600;
  padding-bottom: 2rem;
  padding-top: 2.5rem;
}

.podcast-askQuestion-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.podcast-askQuestion-form .form-control {
  border-radius: 30px;
  border: none;
  padding-left: 1.75rem !important;
  padding-top: 2rem !important;
  height: calc(4.5rem + calc(var(--bs-border-width) * 5));
  font-family: var(--psa-primary-font);
  font-size: 24px;
}

.podcast-askQuestion-form .form-floating>label {
  padding-left: 1.75rem;
  font-family: var(--psa-primary-font);
  font-size: 22px;
  color: #BABABA;
  font-weight: 300;
}


.podcast-askQuestion-form .form-floating>.form-control-plaintext~label::after,
.podcast-askQuestion-form .form-floating>.form-control:focus~label::after,
.podcast-askQuestion-form .form-floating>.form-control:not(:placeholder-shown)~label::after,
.podcast-askQuestion-form .form-floating>.form-select~label::after {
  display: none;
}

.podcast-askQuestion-form textarea.form-control {
  height: 350px;
}

.action-buttons {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.podcast-askQuestion-form .btn-aladaam {
  background: var(--psa-aladaam);
  color: #fff;
  text-transform: uppercase;
  font-family: var(--psa-primary-font);
  font-size: 22px;
  padding: .75rem 2rem .5rem;
  border-radius: 3rem !important;
  border: 1px solid transparent;
}

.podcast-askQuestion-form .btn-aladaam:hover {
  background: var(--psa-white);
  color: var(--psa-aladaam);
  border-color: var(--psa-aladaam);
}

.podcast-askQuestion-form .btn-aladaam:focus {
  background: var(--psa-aladaam);
  color: #fff;
}

.podcast-askQuestion-formContainer:before {
  content: '';
  background: var(--psa-aladaam);
  height: 2px;
  width: 100%;
  position: absolute;
  right: 0;
}

.episode-wrapper {
  display: flex;
  align-items: center;
}

.episode-wrapper:after {
  content: '';
  background: var(--psa-aladaam);
  height: 2px;
  width: calc(100% - 280px);
  position: absolute;
  right: 0;
}

@media(max-width:1250px) {
  .podcast-intro-img {
    width: auto;
  }

  .podcast-intro-img img {
    width: 100%;
  }

  .podcast-intro-content {
    width: calc(100% - 300px);
    font-size: 24px;
    line-height: inherit;
  }
}

@media(max-width:992px) {

  .podcast-intro,
  .podcast-guestInfo,
  .podcast-askQuestion-formContainer,
  .podcast-banner {
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 1rem;
  }

  .episode-wrapper:after {
    width: calc(100% - 195px);
  }

  .episode-intro {
    font-size: 20px;
  }

  .guest-name {
    font-size: calc(3rem + 1.5vw);
    line-height: calc(3rem + 1.75vw);
  }

  .episode-no {
    font-size: 21px;
  }

  .guest-position {
    font-size: 20px;
  }

  .podcast-askQuestion-header h2 {
    font-size: 35px;
    padding: 1.5rem 0;
  }

  .podcast-askQuestion-form .form-control {
    height: calc(3.5rem + calc(var(--bs-border-width) * 5));
  }

  .podcast-askQuestion-form {
    gap: 1rem;
  }

  .podcast-header h1 {
    width: 75%;
  }

  .podcast-askQuestion-form .btn-aladaam {
    font-size: 18px;
  }
}

@media(max-width:767px) {
  .podcast-banner-footer {
    flex-direction: column;
    gap: 2rem;
  }

  .podcast-askQuestion {
    grid-template-columns: 1fr;
  }

  .podcast-guestInfo {
    min-height: 700px;
  }

  .podcast-askQuestion-formContainer {
    min-height: auto;
    padding-top: 0;
  }

  .podcast-header h1 {
    font-size: calc(2rem + 2vw);
    width: 100%;
  }

  .episode-wrapper:after {
    width: calc(100% - 150px);
  }

  .episode-wrapper:after {
    width: calc(100% - 195px);
  }

  .podcast-intro-img {
    width: 50%;
  }

  .podcast-intro-wrapper {
    flex-direction: column-reverse;
    gap: 1rem
  }

  .podcast-intro-content {
    width: 100%;
  }

  .podcast-intro,
  .podcast-guestInfo {
    padding-bottom: 0;
  }

  .action-buttons {
    justify-content: center;
    flex-direction: column;
    gap: 1rem;
  }
}

.processRequest {
  font-size: 20px;
  font-family: var(--psa-primary-font);
  width: 300px;
}

@media(max-width:575px) {
  .podcast-logo img {
    width: 100%;
  }

  .processRequest {
    width: 100%;
  }
}

/*HR Guidelines*/
.hr-guidelines .slc-accordion-body ul li a {
  background: #fff;
  padding: .75rem 1rem;
  border-radius: 50px;
  margin-bottom: .5rem;
}

.hr-guidelines .slc-accordion-body ul li a:hover,
.hr-guidelines .slc-accordion-body ul li a.active {
  background: var(--psa-skyline);
  color: var(--psa-white);
}

.hr-guidelines .slc-accordion-body ul {
  padding-bottom: 1rem;
}

.hr-guidelines .slc-menu-list {
  padding-top: 1rem;
}

.hr-guidelines .stats-left-content {
  padding: 1.5rem;
  border-radius: 1rem;
}

.hr-guidelines .slc-title:after {
  display: none
}

.hrg-header h1 {
  color: #8A1538;
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 1.5rem;
}

.hrg-article {
  padding-top: 1rem;
}

.hrg-resolution h2 {
  color: #383838;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.75rem;
}

h2.accordion-header {
  background: transparent;
}

.hrg-accordion .accordion-button {
  border-radius: 1rem;
  border: none;
  background: transparent;
  box-shadow: none;
}

.hrg-accordion .accordion-item {
  border: none;
  margin-bottom: 1rem;
  border-radius: 1rem;
  border: 1px dashed #CCC;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.hrg-accordion .accordion-item .accordion-button,
.accordion-item .accordion-button.collapsed {
  border-radius: 1rem 1rem 0 0 !important
}

.hrg-accordion .accordion-button:not(.collapsed),
.accordion-collapse.collapse.show {
  background: #F3F4F6;
  border-radius: 0 0 1rem 1rem;
}

.hrg-article {
  padding-top: 1rem;
}

.hrg-article-no {
  color: #8A1538;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
}

.hrg-article-title {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.hrg-accordion .hrg-article-divider {
  background: #696969;
  width: 3.125rem;
  height: 2px;
  display: flex;
}

.hrg-article-subtitle {
  color: #383838;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
}

.hrg-accordion .accordion-button:not(.collapsed) .hrg-article-no,
.hrg-accordion .accordion-button:not(.collapsed) .hrg-article-subtitle {
  font-size: 1.25rem;
  font-weight: 600;
  color: #8A1538;
}

.conclusion {
  margin-top: 2rem;
}

.conclusion h2 {
  color: #282828;
  font-size: 1.875rem;
  font-weight: 400;
  margin-bottom: .5rem;
}

@media(max-width:1024px) {
  .stats-flex.hr-guidelines {
    padding-left: 40px;
  }
}

@media(max-width:767px) {
  .hrg-article-title {
    flex-wrap: wrap;
  }
}