:root {
  --primary-color: #1b1464;
  --secondary-color: #00aeef;
  --primary-hover-color: #ec0d36;
  --secondary-hover-color: #9138ea;

  --body-bg: #f2f9fe;

  --yellow-color: #ffc107;
  --red-color: #ec0d36;
  --text-color: rgba(0, 0, 0, 0.53);
  --white-color: #ffffff;
  --ofwhite-color: #f2f2f2;
  --black-color: #000000;
  --light-color: #fcfcfc;
  --light-color2: #aaaaaa;
  --dark-color: #242424;
  --sky-color: #647589;
  --border-color: #e7e7e7;
  --border-color2: #e4e4e4;
  --border-color3: #dddddd;
  --border-dark: #383434;
  --bg-gray-color: #fcfcfc;
  --bg-light-blue: rgba(207, 239, 252, 0.4);
  --bg-light-gray: #ebf0fa;
  --dark-blue: #0071bb;
  --gray-color: #fafbfe;
  --gray-color2: #f5f5f5;

  --body-font: "Spline Sans", sans-serif;
  --heading-font: "Spline Sans", sans-serif;
  --poppins-font: "Poppins", sans-serif;
  --plus-jakarta-font: "Plus Jakarta Sans", sans-serif;

  --body-font-size: 18px;
  --body-font-weight: 400;
  --body-line-height: 37px;
  --body-weight: 400;
  --headings-weight: 500;
  --transition: all 0.3s ease 0s;
  --container-fluid-offset: 19rem;
}

/*---------------------------------
  =======> Base css start <========
  ---------------------------------*/

*,
*::before,
*::after {
  box-sizing: inherit;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  box-sizing: border-box;
  font-size: 62.5%;
  height: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: transparent;
}

.no-js:not(html) {
  display: none !important;
}

html.no-js .no-js:not(html) {
  display: block !important;
}

.no-js-inline {
  display: none !important;
}

html.no-js .no-js-inline {
  display: inline-block !important;
}

html.no-js .no-js-hidden {
  display: none !important;
}

/*------------ base CSS ------------*/
body,
html {
  height: 100%;
  position: relative;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

a {
  color: var(--black-color);
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a:hover,
a:focus {
  color: var(--primary-color);
  text-decoration: none;
  transition: var(--transition);
}

img {
  max-width: 100%;
  height: auto;
}

/*---------------------------------
      typography css start 
  ---------------------------------*/

body {
  background: var(--body-bg);
  color: var(--text-color);
  font-size: var(--body-font-size);
  line-height: 29px;
  font-family: var(--body-font);
  font-weight: var(--body-weight);
  font-style: normal;
  visibility: visible;
  overflow-x: hidden;
  margin: 0 auto;
}

/*------------ GLobal Settings: Heading-------------*/
a {
  text-decoration: none;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--primary-color);
  font-family: var(--heading-font);
  font-weight: var(--headings-weight);
  font-style: normal;
}

h1 {
  font-size: 70px;
  line-height: 82px;
}

h2 {
  font-size: 50px;
  line-height: 62px;
}

h3 {
  font-size: 40px;
  line-height: 52px;
}

h4 {
  font-size: 30px;
  line-height: 32px;
}

h5 {
  font-size: 20px;
  line-height: 24px;
}

h6 {
  font-size: 16px;
  line-height: 22px;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  display: inherit;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-transform: inherit;
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

br:empty,
hr:empty,
iframe:empty,
path:empty,
line:empty,
circle:empty,
use:empty,
img:empty,
input:empty,
rect:empty,
textarea:empty,
.display-empty:empty,
shopify-payment-terms:empty,
shopify-installments-modal:empty,
model-viewer:empty,
polyline:empty,
polygon:empty {
  display: inline-block;
}

a {
  color: var(--color-link);
  cursor: pointer;
  border: none;
  box-shadow: none;
  text-decoration: none;
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

body:not(.safari) a {
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

hr {
  border: none;
  height: 0.1rem;
  display: block;
  margin: 5rem 0;
  background-color: var(--black-color);
}

details > * {
  box-sizing: border-box;
}

.break {
  word-break: break-word;
}

ul {
  margin: 0px;
  padding: 0px;
}

p {
  margin-bottom: 15px;
}
p:last-child {
  margin-bottom: 0;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a:focus,
a:hover {
  color: inherit;
  text-decoration: none;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
}

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="url"],
textarea {
  outline: none;
  background-color: var(--white-colo);
  height: 56px;
  width: 100%;
  line-height: 56px;
  font-size: var(--body-font-size);
  color: var(--black-color);
  padding-left: 20px;
  padding-right: 20px;
  font-family: var(--body-font);
  border: 1px solid var(--border-color);
}
input[type="text"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="url"]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: var(--light-color2);
}
input[type="text"]::-moz-placeholder,
input[type="email"]::-moz-placeholder,
input[type="tel"]::-moz-placeholder,
input[type="number"]::-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="url"]::-moz-placeholder,
textarea::-moz-placeholder {
  /* Firefox 19+ */
  color: var(--light-color2);
}
input[type="text"]:-moz-placeholder,
input[type="email"]:-moz-placeholder,
input[type="tel"]:-moz-placeholder,
input[type="number"]:-moz-placeholder,
input[type="password"]:-moz-placeholder,
input[type="url"]:-moz-placeholder,
textarea:-moz-placeholder {
  /* Firefox 4-18 */
  color: var(--light-color2);
}
input[type="text"]:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder,
input[type="tel"]:-ms-input-placeholder,
input[type="number"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="url"]:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  /* IE 10+  Edge*/
  color: var(--light-color2);
}
input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="tel"]::placeholder,
input[type="number"]::placeholder,
input[type="password"]::placeholder,
input[type="url"]::placeholder,
textarea::placeholder {
  /* MODERN BROWSER */
  color: var(--light-color2);
}
[dir="rtl"] input[type="text"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="number"],
[dir="rtl"] input[type="password"],
[dir="rtl"] input[type="url"],
[dir="rtl"] textarea {
  text-align: right;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="url"]:focus,
textarea:focus {
  border-color: var(--black-color);
}
input[type="text"]:focus::placeholder,
input[type="email"]:focus::placeholder,
input[type="tel"]:focus::placeholder,
input[type="number"]:focus::placeholder,
input[type="password"]:focus::placeholder,
input[type="url"]:focus::placeholder,
textarea:focus::placeholder {
  opacity: 0;
}

textarea {
  line-height: 1.4;
  padding-top: 17px;
  padding-bottom: 17px;
}

input[type="color"] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background: none;
  border: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  padding: 0;
  border-radius: 50%;
}

*::-moz-selection {
  background: var(--black-color);
  color: var(--white-color);
  text-shadow: none;
}

::-moz-selection {
  background: var(--black-color);
  color: var(--white-color);
  text-shadow: none;
}

::selection {
  background: var(--black-color);
  color: var(--white-color);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--black-color);
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: var(--black-color);
  font-size: 14px;
  opacity: 1;
}

html body .dl {
  display: inline-block;
}

html body .db {
  display: block;
}

.text-blue {
  color: #002154;
}

.font-regular {
  font-weight: 400;
}

.font-bold {
  font-weight: 700;
}

.font-extra-bold {
  font-weight: 800;
}

/*---------------------------------
     Button css start 
  ---------------------------------*/

.btn {
  border-radius: 35px;
  line-height: 59px;
  font-family: var(--body-font);
  font-size: 25px;
  color: var(--white-color);
  font-weight: 500;
  height: 59px;
  padding: 0px 30px;
  display: inline-block;
  position: relative;
}
.btn-small {
  border-radius: 16px;
  line-height: 42px;
  color: var(--white-color);
  height: 42px;
  padding: 0px 30px;
  display: inline-block;
  position: relative;
}

.btn-small::before,
.btn-small::after,
.btn::before,
.btn::after {
  content: "";
  position: absolute;
  display: block;
  box-sizing: border-box;
  top: 0;
  left: 0;
}

.btn-small:hover,
.btn-small:focus,
.btn:hover,
.btn:focus {
  background: transparent;
  color: var(--white-color);
}

.btn::after,
.btn-small::after {
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  z-index: 1;
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
  border-radius: 35px;
}
.btn-small::after {
  border-radius: 16px;
}

.btn:hover:after,
.btn-small:hover:after,
.btn:focus:after,
.btn-small:focus:after,
.btn:active:after,
.btn-small:active:after {
  width: 100%;
  height: 100%;
}

:not(.btn-check) + .btn:active {
  color: var(--white-color);
}
.btn:first-child:active {
  color: var(--white-color);
}
.btn-small:first-child:active {
  color: var(--white-color);
}
:not(.btn-check) + .btn-small:active {
  color: var(--white-color);
}
.btn--primary::after {
  background: var(--primary-hover-color) 0% 0% no-repeat padding-box;
}
.btn--primary {
  background: var(--primary-color) 0% 0% no-repeat padding-box;
}
.btn--primary:hover,
.btn--primary:focus {
  background: transparent;
  color: var(--white-color);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

.btn--secondary::after {
  background: var(--secondary-hover-color) 0% 0% no-repeat padding-box;
}
.btn--secondary {
  background: var(--secondary-color) 0% 0% no-repeat padding-box;
}
.btn--secondary:hover,
.btn--secondary:focus {
  background: transparent;
  color: var(--white-color);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

.btn-outline--primary::after {
  background: var(--primary-hover-color) 0% 0% no-repeat padding-box;
}
.btn-outline--primary {
  background-color: var(--white-color);
  color: var(--primary-color);
  border: 1px solid var(--primary-color);
}
.btn-outline--primary:hover,
.btn-outline--primary:focus {
  color: var(--white-color);
  border: 1px solid var(--primary-hover-color);
  background: transparent;
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

.btn-outline--secondary::after {
  background: var(--secondary-hover-color) 0% 0% no-repeat padding-box;
}

.btn-outline--secondary {
  background-color: var(--white-color);
  color: var(--secondary-color);
  border: 1px solid var(--secondary-color);
}
.btn-outline--secondary:hover,
.btn-outline--secondary:focus {
  background: transparent;
  border: 1px solid var(--secondary-hover-color);
  color: var(--white-color);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

.btn span,
.btn-small span {
    position: relative;
    z-index: 999;
}


@media (max-width: 991px) {
 .btn{
  font-size: 20px;
 }

}
/*---------------------------------
     Overlay start 
  ---------------------------------*/

[data-overlay] {
  position: relative;
}

[data-overlay]:before {
  position: absolute;
  content: "";
  background: #000000;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

[data-overlay] > div {
  z-index: 2;
}

[data-overlay].image--light:before {
  background: #fff;
}

[data-overlay].bg--primary:before {
  background: #4a90e2;
}

[data-overlay="1"]:before {
  opacity: 0.1;
}

[data-overlay="2"]:before {
  opacity: 0.2;
}

[data-overlay="3"]:before {
  opacity: 0.3;
}

[data-overlay="4"]:before {
  opacity: 0.4;
}

[data-overlay="5"]:before {
  opacity: 0.5;
}

[data-overlay="6"]:before {
  opacity: 0.6;
}

[data-overlay="7"]:before {
  opacity: 0.7;
}

[data-overlay="8"]:before {
  opacity: 0.8;
}

[data-overlay="9"]:before {
  opacity: 0.9;
}

[data-overlay="10"]:before {
  opacity: 1;
}

[data-overlay="0"]:before {
  opacity: 0;
}

/*---------------------------------
     helper css
  ---------------------------------*/

.mb-10 {
  margin-bottom: 10px;
}

.mb-15 {
  margin-bottom: 15px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-25 {
  margin-bottom: 25px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-35 {
  margin-bottom: 35px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-45 {
  margin-bottom: 45px;
}

.mb-50 {
  margin-bottom: 50px;
}

.mb-55 {
  margin-bottom: 55px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-68 {
  margin-bottom: 68px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-15 {
  margin-top: 15px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-30 {
  margin-top: 30px;
}

.mt-35 {
  margin-top: 35px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-45 {
  margin-top: 45px;
}

.mt-50 {
  margin-top: 50px;
}

.mt-55 {
  margin-top: 55px;
}

.mt-60 {
  margin-top: 60px;
}

.mt-68 {
  margin-top: 68px;
}

.gap-40 {
  gap: 40px;
}

.gap-10 {
  gap: 10px;
}

.max-content-400 {
  max-width: 400px;
}

.max-content-430 {
  max-width: 430px;
}

.max-content-450 {
  max-width: 450px;
}

/*---------------------------------
      Slider 
  ---------------------------------*/

.slick-btn {
  width: 40px;
  height: 40px;
  position: absolute;
  z-index: 1;
  top: 50%;
}
.slick-prev {
  left: 20px;
}
.slick-next {
  right: 20px;
}

.slick-btn svg {
  width: 24px;
  height: 24px;
}

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir="rtl"] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}


.slick-dots {
  display: flex;
  align-items: center;
  justify-content: center;
}
 .slick-dots li button {
  height: 14px;
  width: 14px;
  margin: 0px 5px;
  cursor: pointer;
  display: inline-block;
  background: var(--white-color);
  border: 1px solid var(--secondary-color);

  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  border-radius:30px;
  text-indent: -9999px;
}
 .slick-dots li.slick-active button {
  background: var(--secondary-color);
  border: 1px solid var(--secondary-color);
  border-radius:30px;
}
 .slick-dots li {
  margin: 0 5px;
  width: auto;
  height: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
 .slick-dots li button::before {
  font-family: slick;
  content: "";
  font-size: 6px;
  line-height: 20px;
  position: absolute;
   display: none;
  border-radius: 50%;
  text-align: center;
  opacity: 1;
  color: #121111;
  -webkit-font-smoothing: antialiased;
  left: 50%;
  top: 50%;
}
.slick-dots li.slick-active button::before {
  background:#000000;
  opacity:9;
}





/* swiper */

.swiper-pagination-bullet {
  height: 14px;
  width: 14px;
  background: var(--white-color);
  border: 1px solid var(--secondary-color);
  opacity: 1;
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  background-color: var(--secondary-color);
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets
  .swiper-pagination-bullet {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 13px);
}
.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 30px;
}
.swiper-button-next,
.swiper-button-prev {
  color: var(--light-color2);
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
  color: var(--secondary-color);
}

.has-map .fancybox__content,
.has-youtube .fancybox__content {
  border-radius: 30px !important;
  border: 5px solid var(--white-color);
}

.has-map .fancybox__iframe,
.has-youtube .fancybox__iframe {
  border-radius: 30px !important;
}

.has-map .fancybox__content,
.has-youtube .fancybox__content {
  max-width: 1352px !important;
  margin: 0 auto !important;
  height: 656px !important;
}

.has-map [data-fancybox-close],
.has-youtube [data-fancybox-close] {
  width: 50px;
  height: 50px;
  border-radius: 50% !important;
  background: var(--red-color) !important;
  color: var(--white-color) !important;
  top: 0px !important;
}

.fancybox__backdrop {
  --fancybox-opacity: 0.5;
}
@media (max-width: 991px) {
.has-youtube .fancybox__content,
 .has-vimeo .fancybox__content,
.has-html5video .fancybox__content {
  width: 100% !important;
  height: 525px !important;
}

.has-map [data-fancybox-close],
.has-youtube [data-fancybox-close] {
  width: 30px;
  height: 30px;
}

}


@media (max-width: 576px) {
  .has-youtube .fancybox__content,
   .has-vimeo .fancybox__content,
  .has-html5video .fancybox__content {
    height: 300px !important;
  }
  }
/* img.lazyload */

.lazyload,
.lazyloading {
  opacity: 0;
}
.lazyloaded {
  opacity: 1;
  transition: opacity 300ms;
}

/*---------------------------------
      container Css 
  ---------------------------------*/
@media (min-width: 1200px) {
  .container {
    max-width: 1700px;
  }
}


/*---------------------------------
      Loader Css 
  ---------------------------------*/

.loftloader-wrapper {
  height: 100vh;
  position: fixed;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
  background-color: var(--body-bg);
}


 .pl-imgloading .loader {
  width: 532px;
  height: auto;
  position: relative;
}
 .pl-imgloading .loader span {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 3;
  display: block;
  width: 100%;
  height: 0%;
  background: url('../assets/loader-color.png') center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-animation: imgLoading 5s linear infinite;
  animation: imgLoading 5s linear infinite;
  transition: 0s;
}
 .pl-imgloading .loader img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.3;
}
.loaders ol:after {
  display: block;
  clear: both;
  content: "";
  position: relative;
}


@-webkit-keyframes imgLoading {
  0% {
    width: 100%;
    height: 0%;
    opacity: 1;
  }
  95% {
    width: 100%;
    height: 100%;
    opacity: 1;
  }
  100% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}
@keyframes imgLoading {
  0% {
    width: 100%;
    height: 0%;
    opacity: 1;
  }
  95% {
    width: 100%;
    height: 100%;
    opacity: 1;
  }
  100% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}

/*---------------------------------
      Header Css 
  ---------------------------------*/

  .position__relative {
    position: relative;
  }
  
  .header__main {
    position: relative;
    margin-left: 50px;
    margin-right: 50px;
  }
  
  .header__section {
    max-width: 1700px;
    margin: 60px auto 0;
    border-radius: 50px;
  }
  
  .header__transparrent {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 50px 5px #48abe0;
    width: 100%;
    background: rgba(255, 255, 255, 0.21);
    backdrop-filter: blur(10px);
    z-index: 1;
  }
  
  .header__bottom--inner {
    padding: 5px 30px;
    
  }
  
  .header__bottom--inner .main__logo {
    flex: 1;
  }
  
  .main__logo--img {
    max-width: 120px;
  }
  
  .main__logo--title {
    margin-bottom: 0;
    line-height: 0;
  }
  
  .header__bottom--inner .header__menu {
    flex: 4;
  }
  .header__menu--navigation {
    gap: 20px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-evenly;
  }
  
  .header__menu--navigation li {
    list-style: none;
  }
  
  .header__menu--link {
    color: rgba(0, 0, 0, 0.7);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 19.5px;
    text-transform: uppercase;
    font: var(--poppins-font);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  .header__menu--link:hover,
  .header__menu--link:focus {
    color: var(--secondary-color);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  .header__menu--link {
    padding: 5px 5px;
  }
  
  .header__sub--menu {
    position: absolute;
    z-index: 9;
    top: 50%;
    left: 0;
    visibility: hidden;
    width: 220px;
    margin: 0;
    margin-top: 50px;
    padding: 0;
    list-style: none;
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
    opacity: 0;
    background-color: var(--white-color);
    -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    border-radius: 0;
  }
  /* Multi-level menu style start */
  .header__sub--menu__items_2{
    border-bottom: 1px solid var(--border-color);
    border-left: 1px solid var(--border-color);
  
  }
  .header__sub--menu__items_2:last-child{
    border-bottom: 0;
  }
  .header__sub--menu .header__sub--menu__items ul{
    position: absolute;
    left: 100%;
    width:220px;
    top:0%;
    display: none;
  }
  .header__sub--menu .header__sub--menu__items .header__sub--menu_3{
    position: absolute;
    left: 100%;
    width:220px;
    top:33%;
    display: none;
  }
  .header__sub--menu .header__sub--menu__items .header__sub--menu_4{
    position: absolute;
    left: 100%;
    width:220px;
    top:66%;
    display: none;
  }
  .header__sub--menu .header__sub--menu__items ul li{
    width:100%;
  }
  .header__sub--menu .header__sub--menu__items:focus-within > .header__sub--menu_2,
  .header__sub--menu .header__sub--menu__items:hover > .header__sub--menu_2{
    display: initial;
  }
  .header__sub--menu .header__sub--menu__items:focus-within > .header__sub--menu_3,
  .header__sub--menu .header__sub--menu__items:hover > .header__sub--menu_3{
    display: initial;
  }
  .header__sub--menu .header__sub--menu__items:focus-within > .header__sub--menu_4,
  .header__sub--menu .header__sub--menu__items:hover > .header__sub--menu_4{
    display: initial;
  }
  
  
  /* Multi-level menu style end */
  
  .header__sub--menu__link {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    display: block;
    font-family: var(--poppins-font);
    background-color: var(--white-color);
    padding: 5px 10px;
    text-align: center;
    position: relative;
    z-index: 1;
  }
  .header__sub--menu__link::before,
  .header__sub--menu__link::after {
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    top: 0;
    left: 0;
  }
  .header__sub--menu__link::after {
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    z-index: -1;
    background: var(--red-color);
    transition: all 0.5s cubic-bezier(0.42, 0, 0.58, 1);
  }
  .header__sub--menu__link:hover,
  .header__sub--menu__link:focus {
    background: transparent;
    color: var(--white-color);
  }
  
  .header__sub--menu__link:hover:after {
    width: 100%;
    height: 100%;
  }
  
  .header__sub--menu__items {
    border-bottom: 1px solid var(--border-color);
  }
  
  .header__sub--menu__items:last-child {
    border-bottom: 0;
  }
  
  .header__menu--items {
    position: relative;
  }
  .mega__menu--items {
    position: static;
  }
  
  .header__mega--menu {
    position: absolute;
    z-index: 9;
    top: 100%;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    margin: 0;
    margin-top: 20px;
    padding: 25px;
    list-style: none;
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
    visibility: hidden;
    opacity: 0;
    background-color: var(--white-color);
    -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    border-radius: 20px;
  }
  
  .header__mega--menu__li {
    padding: 3px 15px;
  }
  
  .header__mega--subtitle {
    font-weight: 600;
    font-size: 22px;
    font-family: var(--poppins-font);
    color: var(--primary-color);
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 15px;
    position: relative;
    display: block;
  }
  .header__mega--subtitle::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 150px;
    bottom: 0;
    height: 7px;
    background-color: var(--secondary-color);
  }
  .header__mega--sub__menu li {
    border-bottom: 1px solid var(--border-color);
  }
  .header__mega--sub__menu li:last-child {
    border-bottom: 0;
  }
  .header__mega--sub__menu--link {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    display: block;
    font-family: var(--poppins-font);
    background-color: var(--white-color);
    padding: 10px 10px;
    text-align: center;
    position: relative;
    z-index: 1;
  }
  
  .header__mega--sub__menu--link::before,
  .header__mega--sub__menu--link::after {
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    top: 0;
    left: 0;
  }
  .header__mega--sub__menu--link::after {
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    z-index: -1;
    background: var(--red-color);
    transition: all 0.5s cubic-bezier(0.42, 0, 0.58, 1);
  }
  
  .header__mega--sub__menu--link:hover,
  .header__mega--sub__menu--link:focus {
    background: transparent;
    color: var(--white-color);
  }
  
  .header__mega--sub__menu--link:hover:after {
    width: 100%;
    height: 100%;
  }
  
  .header__mega--sub__menu_li img {
    border-radius: 20px;
  }
  
  .header__menu--items:hover .header__sub--menu {
    visibility: visible;
    margin-top: 30px;
    opacity: 1;
  }
  
  .header__menu--items:hover .header__mega--menu {
    visibility: visible;
    margin-top: 0;
    opacity: 1;
  }
  @media (min-width:1367px) {
    .header__menu--link {
      font-size: 14px;
    }
  }
  @media (max-width: 1440px) {
    .header__menu--navigation {
      gap: 10px;
    }
  }
  @media (max-width: 1366px) {
    .header__menu--link {
      font-size: 14px;
    }
    .header__bottom--inner .header__menu {
      flex: 4;
    }
  
    .header__menu--navigation {
      gap: 0px;
    }
  }
  
  @media (max-width: 1280px) {
    .main__logo--img {
      max-width: 120px;
    }
    .header__menu--link {
      font-size: 14px;
    }
  }
  @media (max-width: 1170px) {
    .header__menu--navigation {
      gap: 8px;
    }
  }
  
  .search-user-wrapper {
    display: flex;
    align-items: center;
    position: relative;
    flex: 1;
    justify-content: end;
    gap: 20px;
  }
  .search-user-wrapper:hover{
    color:var(--secondary-color)
  }
  .input-wrapper {
    display: flex;
    justify-content: space-between;
    border-radius: 30px;
    border: 1px solid rgba(0, 0, 0, 0.14);
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(35px);
    padding: 0 10px;
    align-items: center;
    position: absolute;
    top: -3px;
    width: 0;
    visibility: hidden;
    opacity: 0;
    right: 35px;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
  }
  
  .input-wrapper.active {
    visibility: visible;
    opacity: 1;
    width: 100%;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
  }
  
  .input-wrapper .searchbox-input {
    border: 0;
    outline: 0;
    box-shadow: none;
    height: 33px;
    padding: 0 10px;
  }
  .input-wrapper .close-icon {
    cursor: pointer;
  }
  
  .search-toggle {
    border-radius: 30px;
    border: 0.5px solid rgba(0, 0, 0, 0.56);
    background: rgba(217, 217, 217, 0.5);
    height: 33px;
    min-width: 137px;
    padding: 0 17px;
    display: flex;
    align-items: center;
    gap: 15px;
  }
  .search-toggle.active {
    visibility: hidden;
  }
  
  .submit--btn {
    width: 35px;
    height: 17px;
    border-right: 1px solid #808c92;
    padding-right: 15px;
    display: flex;
    align-items: center;
  }
  
  /*---------------------------------
       mobile__menu css
    ---------------------------------*/
  
  .mobile__menu-header {
    display: block;
    position: relative;
  }
  
  .header__bottom {
    display: none;
  }
  @media (min-width: 1040px) {
    .mobile__menu-header {
      display: none;
    }
  
    .header__bottom {
      display: block;
    }
  }
  
  .mobile__menu-header {
    border-radius: 50px;
    border: 2px solid rgba(166, 166, 166, 0.68);
    background: var(--white-color);
    padding: 5px;
    overflow: hidden;
  }
  .mobile__menu-header .main__logo--img {
    max-width: 120px;
  }
  
  .header__search ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .mobile__menu-header .input-wrapper {
    border: 0;
    right: 0;
    padding: 0;
    height: 30px;
  }
  @media screen and (max-width:450px) {
    .mobile__menu-header .input-wrapper{
      height: 48px;
    }
  }
  .offcanvas__logo img {
    max-width: 150px;
  }
  
  .offcanvas__header--menu__open--btn > * {
    pointer-events: none;
  }
  
  .offcanvas__header--menu__open--svg {
    width: 32px;
  }
  
  .offcanvas__header {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 300px;
    height: 100%;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    background-color: var(--body-bg);
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
  }
  
  @media only screen and (min-width: 480px) {
    .offcanvas__header {
      max-width: 320px;
    }
  }
  .offcanvas__header.open {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
  }
  
  .offcanvas__header.open ~ .offcanvas-overlay {
    visibility: visible;
    opacity: 0.75;
  }
  
  .offcanvas-overlay {
    position: fixed;
    z-index: 9998;
    top: 0;
    left: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    opacity: 0;
    background-color: var(--black-color);
  }
  
  .offcanvas__inner {
    position: relative;
    height: 100%;
  }
  
  .offcanvas__logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 20px 15px;
  }
  
  .offcanvas__close--btn {
    position: relative;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    width: 1.6rem;
    height: 1.6rem;
    padding: 0;
    text-indent: -9999px;
    border: none;
    background-color: transparent;
  }
  
  .offcanvas__close--btn::after,
  .offcanvas__close--btn::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    margin-top: -1px;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    background-color: #808c92;
    border-radius: 15px;
  }
  
  .offcanvas__close--btn::after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  
  .offcanvas__menu {
    overflow-y: auto;
    height: 100%;
  }
  
  .offcanvas__menu_ul {
    overflow: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: calc(100% - 100px);
  }
  
  .offcanvas__menu_li {
    position: relative;
    border-bottom: 1px solid var(--border-color2);
  }
  
  .offcanvas__menu_li:first-child {
    border-top: 1px solid var(--border-color2);
  }
  
  .offcanvas__menu_item {
    line-height: 1;
    display: block;
    font-size: 15px;
    padding: 10px 20px;
    text-transform: uppercase;
  }
  
  .offcanvas__sub_menu {
    display: none;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .offcanvas__sub_menu_li {
    position: relative;
    font-size: 15px;
    border-top: 1px solid var(--border-color2);
  }
  
  .offcanvas__sub_menu_item {
    line-height: 1;
    display: block;
    padding: 10px 0 10px 30px;
  }
  
  .offcanvas__sub_menu_item ~ .offcanvas__sub_menu .offcanvas__sub_menu_item {
    padding-left: 40px;
  }
  
  .offcanvas__sub_menu_toggle {
    font-size: 15px;
    position: absolute;
    z-index: 9;
    top: 0;
    right: 0;
    width: 4rem;
    height: 3.6rem;
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: transparent;
  }
  
  .offcanvas__sub_menu_toggle::after,
  .offcanvas__sub_menu_toggle::before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 2px;
    content: "";
    -webkit-transition: var(--transition);
    transition: var(--transition);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-color: #808c92;
  }
  
  .offcanvas__sub_menu_toggle:not(.active)::after {
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg);
    transform: translateX(-50%) translateY(-50%) rotate(90deg);
  }
  
  .offcanvas__sub-wrapper {
    padding: 20px 30px;
  }
  
  .offcanvas__footer {
    padding: 30px 17px 30px;
    position: fixed;
    bottom: 0;
    width: 100%;
    background: var(--body-bg);
    border-top: 1px solid var(--border-color2);
    z-index: 9;
  }
  
  .offcanvas__account--items__icon {
    width: 3rem;
    height: 3rem;
    text-align: center;
    background: red;
    line-height: 2.8rem;
    border-radius: 50%;
    color: #fff;
  }
  
  .offcanvas__account--items__label {
    font-size: 1.5rem;
    font-weight: 600;
    margin-left: 6px;
  }
  
  .mobile_menu_open,
  .offCanvas__minicart_active,
  .offcanvas__filter--sidebar_active,
  .predictive__search--box_active,
  body.overlay__active {
    overflow-y: hidden;
  }
  
  .mobile_menu_open::before,
  .offCanvas__minicart_active::before,
  .offcanvas__filter--sidebar_active::before,
  .predictive__search--box_active::before,
  body.overlay__active::before {
    position: absolute;
    content: "";
    background: #000;
    width: 100%;
    height: 100%;
    z-index: 999;
    opacity: 0.5;
    cursor: crosshair;
  }
  
  @media only screen and (max-width: 480px) {
    .input-wrapper {
      top: -7px;
    }
  
    .header__section {
      margin: 20px auto 0;
    }
    .mobile__menu-header .main__logo--img {
      max-width: 100px;
    }
    .header__main {
      margin-left: 20px;
      margin-right: 20px;
    }
  }
  
  /*---------------------------------
       mobile-siticky-header start 
    ---------------------------------*/
  
  .mobile-siticky-header {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    z-index: 3;
    background: #001f42;
    border-radius: 4px 4px 0px 0px;
    -webkit-box-shadow: 0px -5px 15px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px -5px 15px 0px rgba(0, 0, 0, 0.1);
    display: none;
    padding: 15px;
  }
  .mobile-siticky-header ul {
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0;
    margin: 0;
  
    gap: 10px;
  }
  
  @media (max-width: 1024px) {
    .mobile-siticky-header {
      display: block;
    }
  }
  
  .sticky-menu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--secondary-color);
    font-family: var(--poppins-font);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 17px;
  }
  
  .sticky-menu li .circle-icon {
    display: none;
  }
  .sticky-menu li.active .circle-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
  }
  .sticky-menu li.active .primary-icon {
    display: none;
  }
  
  .secondary-icon {
    position: absolute;
    top: -30px;
    width: 60px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
  
    border-radius: 0 0 50px 50px / 0 0 70px 70px;
  }
  .menu-text {
    margin-top: 10px;
  }
  
  .secondary-icon::before {
    content: "";
    position: absolute;
    left: 5px;
    right: 0;
    top: 24px;
    width: 50px;
    height: 34px;
    background: #f2f9fe;
    z-index: -1;
    border-radius: 0 0 50px 50px / 0 0 66px 66px;
  }
  

/*---------------------------------
     hero-slider start 
  ---------------------------------*/

.hero-slider {
  position: relative;
}

.slide-item {
  position: relative;
  overflow: hidden;
}

.hero-slider .slider-track {
  -webkit-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
}

.ss_img {
  -webkit-transition: opacity 0.8s cubic-bezier(0.44, 0.13, 0.48, 0.87);
  transition: opacity 0.8s cubic-bezier(0.44, 0.13, 0.48, 0.87);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
  z-index: 1;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  -webkit-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  -webkit-transform: scale(1.2);
  transform: scale(1.2);

  transition: all 500ms ease-in-out;
  transform: scale(1.25, 1.25);
}

.slick-active .ss_img,
.no-js .ss_img {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-animation: cssAnimation 5000ms 1 ease-in-out forwards;
  animation: cssAnimation 5000ms 1 ease-in-out forwards;
}

@keyframes cssAnimation {
  from {
    -webkit-transform: scale(1) translate(0px);
  }
  to {
    -webkit-transform: scale(1.25) translate(0px);
  }
}
@-webkit-keyframes cssAnimation {
  from {
    -webkit-transform: scale(1) translate(0px);
  }
  to {
    -webkit-transform: scale(1.25) translate(0px);
  }
}

.slide-item.small {
  height: 550px;
}
.slide-item.medium {
  height: 720px;
}
.slide-item.large {
  height: 1000px;
}
.slide-item.fullscreen {
  height: 100vh;
}
@media (min-width: 1025px) and (max-width: 1300px) {
  .slide-item.large {
    height: 720px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .slide-item.small {
    height: 290px;
  }
  .slide-item.medium {
    height: 350px;
  }
  .slide-item.large {
    height: 500px;
  }
  .slide-item.fullscreen {
    height: 70vh;
  }
}
@media (max-width: 767px) {
  .slide-item.small {
    height: 290px;
  }
  .slide-item.medium {
    height: 350px;
  }
  .slide-item.large {
    height: 500px;
  }
  .slide-item.fullscreen {
    height: 70vh;
  }
}

@media (max-width: 414px) {
  .slide-item.small {
    height: 270px;
  }

  .slide-item.medium {
    height: 270px;
  }

  .slide-item.large {
    height: 330px;
  }

  .slide-item.fullscreen {
    height: 40vh;
  }
}

/*---------------------------------
     category start 
  ---------------------------------*/
.category_home {
    padding: 30px 0;
    margin-bottom: 30px;
    margin-top: -88px;
    position: relative;
}

    .category_home .inner-container {
        max-width: 800px;
        margin: 0 auto;
        padding: 10px;
        background-color: #f2f9fe;
        box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
        border-radius: 30px;
    }

.cat-item {
    text-align: center;
    align-items: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.cat-title {
    font-family: var(--plus-jakarta-font);
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0em;
    text-align: center;
    color: rgba(0, 0, 0, 1);
    margin-top: 15px;
}

.category_home .slick-btn {
    top: 30%;
}

.category_home .slick-prev {
    left: 40px;
}

.category_home .slick-next {
    right: 40px;
}

.category-slider .slick-slide {
    margin: 0 5px;
}

@media (max-width: 767px) {
    .category_home .slick-prev {
        left: 0;
    }

    .category_home .slick-next {
        right: 0;
    }

    .cat-item img {
        max-width: 35px;
    }

    .cat-title {
        font-size: 1.4rem;
        line-height: 19.5px;
        color: rgba(42, 63, 84, 1);
        margin-top: 4px;
    }

    .category_home .slick-btn {
        top: 14%;
    }
}


/* ----------- sections and container start------- */

.branch-section {
  position:relative;
  padding: 50px 0;
  margin-bottom: 30px;
}
.branch-section .branch__container {
  background-color: #CFEFFC;
  border-radius: 37px;
  padding: 16px 0;
  max-width: 1200px;
    width:1150px;
}
.container_faq{
  display: flex;
  justify-content: center;
}
@media screen and (min-width:1024px) {
  
  .branch-section {
    position:relative;
    padding: 50px 0;
    margin-bottom: 30px;
  }
  .branch-section .branch__container {
    background-color: #CFEFFC;
    border-radius: 37px;
    padding: 16px 0;
    max-width: 1200px;
    width:1150px;
  }
  .container_faq{
    display: flex;
    justify-content: center;
  }
}
 @media screen and (max-width:767px) {
  .branch-section {
    position:relative;
    padding: 20px 0;
    display: flex;
    align-items: center;
    margin: 1rem 2rem;
    
  }
  .branch-section .branch__container {
    max-width: 100%;
    width: 100%;
    background-color: #CFEFFC;
    border-radius: 37px;
    padding: 16px 10px;
  }
 }
 @media screen and (min-width:768px) and (max-width:1024px) {
  .branch-section .branch__container{
    width: 90% !important;
  }
 }
/* ----------- sections and container end------- */


/*---------------------------------
     about-section start 
  ---------------------------------*/

.about-section {
  position: relative;
  padding: 50px 0;
  margin-bottom: 60px;
}

.about__container {
  background-color: rgba(207, 239, 252, 0.4);
  border-radius: 37px;
  padding: 16px 0;
}


.about__title {
  margin-bottom: 35px;
  font-size: 3rem;
  line-height: 4rem;
  font-weight: 500;
  letter-spacing: 0em;
  margin-bottom: 10px;
}


@media (max-width: 400px) {
    #pro_consu {
        font-size: 1.4rem !important;
    }
}

.about_logo_home{
    margin-bottom:20px;
}

.about_logo_home img {
    width: 20%;
}

/*.about__logo-slider {
  list-style: none;
  padding: 0;
  margin: 0;
  margin-bottom: 30px;
}*/

.about__logo-slider .slick-slide {
  margin: 0 10px;
}

.about__logo-slider .slick-slide img {
  margin: 0 auto;
}

.about__brand-slider {
  padding: 20px;
  margin: 0;
  background-color: #ffffff;
  border-radius: 12px;
}

.about__brand-slider .slick-slide img {
  margin: 0 auto;
}
.about__brand-slider .slick-slide {
  margin: 0 10px;
}
@media (max-width: 991px) {
  .about-section {
    padding: 0;
    margin-bottom: 40px;
}
  .about__container {
    padding: 24px 15px 30px;
  }
  .about__box-wrap {
    padding: 10px;
    text-align: center;
  }

     .about_logo_home img {
        max-width: 150px;
    }

  .about__title {
    font-size: 30px;
    font-weight: 500;
    line-height: 4rem;
    letter-spacing: 0em;
    margin-bottom: 15px;
  }
}
@media (max-width: 767px) {
  .about__brand-slider {
    padding: 10px;
  }
  .about__title {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2rem;
    letter-spacing: 0em;
    
  }
  .about__container {
    margin: 15px;
    padding: 24px 10px 30px;
  }
  .about__logo-slider {
    margin-bottom: 24px;
  }
  .about__box-wrap {
    padding: 10px;
    text-align: center;
  }

     .about_logo_home img {
        max-width: 100px;
    }

  .about__card {
    padding: 15px;
  }
  .about__card .mb-60 {
    margin-bottom: 20px;
  }
}




/*---------------------------------
       rev_slider start 
  ---------------------------------*/

.rev_slider .slick-slider {
  margin-left: -12%;
  margin-right: -12%;
}

.rev_slider .slick-list {
  padding-top: 0% !important;
  padding-bottom: 10% !important;
  padding-left: 0% !important;
  padding-right: 0% !important;
}

.rev_slider .slick-dots {
  text-align: right;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.rev_slider .slick-track {
  max-width: 100% !important;
  transform: translate3d(0, 0, 0) !important;
  perspective: 100px;
}

.rev_slider .slick-slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  width: 100% !important;
  transform: translate3d(0, 0, 0);
  transition: transform 1s, opacity 1s;
}

.rev_slider .slick-snext,
.rev_slider .slick-sprev {
  display: block;
}

.rev_slider .slick-current {
  z-index: 4;
  opacity: 1;
  position: relative;
  display: block;
  transform: translate3d(3%, 21%, 0px);
}
.rev_slider .slick-sprev {
  z-index: 3;
  opacity: 1;
  transform: translate3d(13%, 7%, 0px);
}

.rev_slider .slick-pprev {
  z-index: 2;
  opacity: 1;
  transform: translate3d(17%, 1%, 0px);
}

.rev_slider .slick-snext {
  z-index: 3;
  opacity: 1;
  transform: translate3d(8%, 14%, 0px);
}
.project__item .img-wrap{
  padding:1rem 1rem;
}
.project__item .img-wrap img{
  border-radius: 30px;
}
/* .rev_slider .img-wrap{
  width: 100%;
} */

.rev_slider img {
  border-radius: 30px;
  padding: 28px;
  width: 95%;
  border-radius: 68px;
  transition: transform 0.5s ease-in-out;
  transform-origin: 100% 0;
}

.rev_slider .slick-slide {
  transition: transform 0.5s ease-in-out;
  transform-origin: 100% 0;
}
/* .rev_slider .slick-current.slick-slide:hover {
  transform: scale(1.2) translate(16%);
  transition: transform 0.5s, opacity 1s;
} */

.project__wrap {
  position: relative;
  padding: 1rem 0 3rem;
}
.project_wrap_details {
    padding: 0 15px 0 0;
}
@media (max-width:991px){
    .project_wrap_details {
        padding: 0;
    }
}
.project__card {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 40px;
    padding: 20px 18px;
}

.project-overview {
  position: relative;
  margin-bottom: 60px;
}

.project-overview__container {
  padding: 50px 70px 60px;
  background-color: rgba(235, 240, 250, 1);
  border-radius: 40px;
}

.project__info-links {
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
  list-style: none;
  gap: 24px;
}

.project__info-links li img {
  max-width: 50px;
}

.rev_slider .slick-track {
  height: 550px;
}
@media (max-width: 991px) {
  .project-overview {
    margin-bottom: 40px;
}
  .project-overview__container {
    padding: 30px 15px 30px;
}

.rev_slider img {
  padding: 15px;
  width: 95%;
  border-radius: 30px;
}

.rev_slider .slick-track {
  
  height: auto;
}
.rev_slider {
  margin-bottom: 30px;
}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
  top: 40%;
  bottom: auto;
}
.project__card {
  padding: 15px;
}

.project__nfo{
  flex-direction: column-reverse;
}
.project__info-links li img {
  max-width: 40px !important;
}

.project__info-links {
  gap: 30px;
  margin-bottom: 20px !important;
}
}
@media (max-width: 768px) {
    .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
        top: 38%;
        bottom: auto;
    }
}
@media (max-width: 600px) {
    .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
        top: 41%;
        bottom: auto;
    }
}
@media (max-width: 500px) {
    .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
        display:none;
        /*top: 25%;
        bottom: auto;*/
    }
}
    /*---------------------------------
      btn__heading start 
  ---------------------------------*/
    .btn__heading {
        background-color: var(--secondary-color);
        color: var(--white-color);
        font-family: var(--body-font);
        font-size: 25px;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: 0em;
        text-align: center;
        padding: 14px 20px;
        min-width: 240px;
        border-radius: 10px;
        display: inline-block;
        margin-bottom: 32px;
    }

    @media (max-width: 991px) {
        .btn__heading {
            font-size: 20px;
            margin-bottom: 15px;
        }
    }
    /*---------------------------------
       invest-section start 
  ---------------------------------*/

/*========================================
=        21. Video Popup Css            =
==========================================*/
.single-popup-wrap {
    position: relative;
}

.video-link {
    -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    display: block;
}

    .video-link .ht-popup-video.video-button {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
    }

        .video-link .ht-popup-video.video-button .video-mark {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translateY(-50%, -50%);
            -ms-transform: translateY(-50%, -50%);
            transform: translateY(-50%, -50%);
            pointer-events: none;
        }

            .video-link .ht-popup-video.video-button .video-mark .wave-pulse {
                width: 1px;
                height: 0;
                margin: 0 auto;
            }

                .video-link .ht-popup-video.video-button .video-mark .wave-pulse::after, .video-link .ht-popup-video.video-button .video-mark .wave-pulse::before {
                    opacity: 0;
                    content: "";
                    display: block;
                    position: absolute;
                    width: 200px;
                    height: 200px;
                    top: 50%;
                    left: 50%;
                    border-radius: 50%;
                    border: 3px solid #086AD8;
                    -webkit-animation: zoomBig 3.25s linear infinite;
                    animation: zoomBig 3.25s linear infinite;
                    -webkit-animation-delay: 0s;
                    animation-delay: 0s;
                }

                .video-link .ht-popup-video.video-button .video-mark .wave-pulse::before {
                    -webkit-animation-delay: 0.75s;
                    animation-delay: 0.75s;
                }

    .video-link .ht-popup-video .video-button {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
    }

    .video-link .ht-popup-video .video-button__one {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

        .video-link .ht-popup-video .video-button__one .video-play {
            width: 72px;
            height: 72px;
            background: transparent;
            border: 6px solid #fff;
            border-radius: 50%;
            -webkit-transition: all 1s cubic-bezier(0, 0, 0.2, 1) !important;
            -o-transition: all 1s cubic-bezier(0, 0, 0.2, 1) !important;
            transition: all 1s cubic-bezier(0, 0, 0.2, 1) !important;
        }

        .video-link .ht-popup-video .video-button__one .video-play-icon {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            line-height: 1;
            margin-left: 1px;
        }

            .video-link .ht-popup-video .video-button__one .video-play-icon::before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 0;
                height: 0;
                -webkit-transform: translate(-50%, -50%);
                -ms-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
                border-top: 11px solid transparent;
                border-bottom: 11px solid transparent;
                border-left: 17px solid #fff;
            }

    .video-link .ht-popup-video .video-button__two {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

        .video-link .ht-popup-video .video-button__two .video-play {
            width: 78px;
            height: 78px;
            background: #086AD8;
            -webkit-box-shadow: 0 2px 41px 0 rgba(91, 99, 254, 0.36);
            box-shadow: 0 2px 41px 0 rgba(91, 99, 254, 0.36);
            border-radius: 50%;
            -webkit-transition: all 1s cubic-bezier(0, 0, 0.2, 1) !important;
            -o-transition: all 1s cubic-bezier(0, 0, 0.2, 1) !important;
            transition: all 1s cubic-bezier(0, 0, 0.2, 1) !important;
            -webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.07);
            box-shadow: 0 20px 30px rgba(0, 0, 0, 0.07);
        }

        .video-link .ht-popup-video .video-button__two .video-play-icon {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            line-height: 1;
            margin-left: 1px;
        }

            .video-link .ht-popup-video .video-button__two .video-play-icon::before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 0;
                height: 0;
                -webkit-transform: translate(-50%, -50%);
                -ms-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
                border-top: 11px solid transparent;
                border-bottom: 11px solid transparent;
                border-left: 17px solid #fff;
                border-top-width: 12px;
                border-bottom-width: 12px;
                border-left-width: 19px;
                border-left-color: #ffffff;
            }

    .video-link:hover .video-play {
        -webkit-transform: scale3d(1.15, 1.15, 1.15);
        transform: scale3d(1.15, 1.15, 1.15);
    }

@-webkit-keyframes zoomBig {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(0);
        transform: translate(-50%, -50%) scale(0);
        opacity: 1;
        border-width: 3px;
    }

    40% {
        opacity: 0.5;
        border-width: 2px;
    }

    65% {
        border-width: 1px;
    }

    100% {
        -webkit-transform: translate(-50%, -50%) scale(1);
        transform: translate(-50%, -50%) scale(1);
        opacity: 0;
        border-width: 1px;
    }
}









    .video-wrapper {
        position: relative;
        padding: 0 1rem;
    }

    /*.video__play-btn {
        z-index: 1;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }*/

    .poster-img-wrap img {
        width: 100%;
        border: 5px solid var(--white-color);
        margin: 0rem;
        border-radius: 20px;
    }

    .invest__container {
        background-color: #cfeffc;
        padding: 50px 70px 60px;
        border-radius: 40px;
    }

    .invest__title {
        margin-bottom: 50px;
    }

    .invest__description {
        max-width: calc(100% - 120px);
    }

    .invest-section {
        position: relative;
        margin-bottom: 60px;
    }

    .invest__description a {
        text-decoration: underline;
        text-transform: uppercase;
    }

    @media (max-width: 991px) {

        .invest-section {
            margin-bottom: 40px;
        }

        .invest__container {
            padding: 30px 15px 30px;
        }

        .invest__title {
            font-size: 30px;
            font-weight: 500;
            line-height: 40px;
            letter-spacing: 0em;
            text-align: center;
            margin-bottom: 15px;
        }

        .invest__description {
            max-width: 100%;
            text-align: center;
        }

        .video-wrapper {
            margin-top: 20px;
            padding: 0 !important;
        }

        .video__play-btn svg {
            width: 40px;
            height: 40px;
        }
    }
    /*---------------------------------
     benefits start 
  ---------------------------------*/
    .benefits {
        position: relative;
        margin-bottom: 60px;
    }

    .benefits__list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        margin-top: 20px;
        list-style: none;
        padding: 0;
        margin: 0;
        gap: 20px;
    }

    .benefits__container {
        background-color: #ebf0fa;
        padding: 50px 80px 60px;
        border-radius: 40px;
    }


    .benefit__box-wrap {
        display: flex;
        align-items: center;
        gap: 40px;
    }

    .benefit-text {
        padding: 33px 0;
        position: relative;
    }

        .benefit-text h3 {
            font-family: var(--body-font);
            font-size: 1.6rem;
            font-weight: 500;
            line-height: 2.5rem;
            letter-spacing: 0em;
            text-align: left;
            margin-bottom: 0;
        }

    .benefit__box-wrap {
        position: relative;
        max-height: 50px;
    }

        .benefit__box-wrap::before,
        .benefit__box-wrap::after {
            content: "";
            position: absolute;
            display: block;
            box-sizing: border-box;
            top: 0;
            left: 0;
        }

        .benefit__box-wrap::after {
            top: 0;
            left: 0;
            width: 0;
            height: 100%;
            -webkit-transition: var(--transition);
            -moz-transition: var(--transition);
            -ms-transition: var(--transition);
            -o-transition: var(--transition);
            transition: var(--transition);
            border-radius: 0 35px 35px 0;
        }

        .benefit__box-wrap:hover::after {
            width: 100%;
            height: 100%;
            -webkit-transition: var(--transition);
            -moz-transition: var(--transition);
            -ms-transition: var(--transition);
            -o-transition: var(--transition);
            transition: var(--transition);
        }

        .benefit__box-wrap img {
            -webkit-transition: var(--transition);
            -moz-transition: var(--transition);
            -ms-transition: var(--transition);
            -o-transition: var(--transition);
            transition: var(--transition);
            width: 35px;
            border-radius:7px;
        }

        .benefit__box-wrap:hover img {
            transform: scale(1.25);
            z-index: 99;
            -webkit-transition: var(--transition);
            -moz-transition: var(--transition);
            -ms-transition: var(--transition);
            -o-transition: var(--transition);
            transition: var(--transition);
        }

    .green-color:hover::after {
        background-color: #bdffff;
    }

    .paste-color:hover::after {
        background-color: rgba(76, 200, 250, 0.25);
    }

    .olive-color:hover::after {
        background-color: rgba(247, 255, 198, 1);
    }

    .green-color h3 {
        color: rgba(30, 84, 57, 1);
    }

    .paste-color h3 {
        color: rgba(18, 90, 112, 1);
    }

    .olive-color h3 {
        color: rgba(100, 107, 34, 1);
    }

    @media (max-width: 991px) {
        .benefits {
            margin-bottom: 40px;
        }

        .benefits__container {
            padding: 30px 15px 30px;
        }

        .benefits__list {
            display: grid;
            grid-template-columns: repeat(1, 1fr);
        }

        .benefit-text h3 {
            font-size: 20px;
            font-weight: 300;
            line-height: 20px;
            letter-spacing: 0.025em;
        }

        .benefit__box-wrap img {
            max-width: 37px;
        }

        .benefit__box-wrap {
            gap: 24px;
        }

        .benefit__box-wrap {
            max-height: 58px;
            min-height: 58px;
        }

        .benefit-text {
            padding: 10px 0;
        }

        .benefit__box-wrap::after {
            border-radius: 0 12px 12px 0;
        }

        .benefits__list {
            gap: 10px;
        }
    }

    @media (max-width: 991px) {
        .benefit-text h3 {
            font-size: 1.4rem;
        }
    }
    /*---------------------------------
       goldsands-card-section start 
  ---------------------------------*/

    .goldsands-card-section {
        position: relative;
        padding: 50px 0;
        margin-bottom: 30px;
    }
    /* .goldsands__container {
  background-color: rgba(207, 239, 252, 0.4);
  padding: 50px 50px calc(100% - 70%);
  border-radius: 40px;
  max-width: 1200px;
  width:1150px;
} */
    .goldsands__container {
        background-color: rgba(207, 239, 252, 0.4);
        padding: 50px 50px;
        border-radius: 40px;
        max-width: 1200px;
        width: 1150px;
    }

    .goldsands__card {
        background-color: rgba(0, 33, 84, 1);
        padding: 100px 50px 50px;
        border-radius: 40px;
    }

    .goldsands__title {
        font-family: var(--heading-font);
        font-size: 50px;
        font-weight: 600;
        line-height: 59px;
        letter-spacing: -0.30000001192092896px;
        color: rgba(247, 184, 1, 1);
        margin-bottom: 20px;
    }

    .offer-text {
        margin-bottom: 95px;
    }

        .offer-text h4 {
            font-family: var(--heading-font);
            font-size: 30px;
            font-weight: 500;
            line-height: 36px;
            letter-spacing: -0.30000001192092896px;
            color: var(--white-color);
        }

    .card-img-wrap {
        position: relative;
    }

        .card-img-wrap img {
            position: absolute;
            transform: translateY(-90%);
        }

    .offer__wrapper {
        position: relative;
        width: 1150px;
        padding-top: 30px;
    }

    /* .offer__wrapper {
  position: absolute;
  transform: translateY(-70%);
  width: 100%;
  left: 0;
} */

    .offer-card {
        padding: 20px 14px 28px;
        background-color: var(--white-color);
        border-radius: 20px;
        /*box-shadow: 0px 0px 30px 0px rgba(22, 22, 22, 0.2);*/
        margin: 10px 0 15px;
        text-align: center;
        border-radius: 40px;
    }

    .offer__slider .slick-slide {
        margin: 0 20px;
    }

    .offer-card .img-wrap {
        margin-bottom: 15px;
/*        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);*/
        border-radius: 20px;
        text-align: center;
    }

        .offer-card .img-wrap img {
            border-radius: 20px;
            margin: 0 auto;
        }

    .offer__slider .slick-prev {
        left: 0;
    }

    .offer__slider .slick-next {
        right: 0;
    }
    .offer__wrapper .offer__slider .slick-dots {
        display: none !important;
    }

    @media (max-width: 1025px) {

        .goldsands-card-section {
            margin-bottom: 40px;
        }

        .offer__wrapper {
            width: 85%;
        }

        .goldsands__container {
            padding: 30px 15px 30px;
            background-color: rgba(207, 239, 252, 0.4);
        }

        .offer__wrapper {
            position: relative;
            transform: none;
            margin-top: 30px;
        }

        .goldsands__card {
            background-color: transparent;
            padding: 15px;
        }

        .card-img-wrap img {
            position: relative;
            transform: none;
        }

        .goldsands__title {
            font-size: 36px;
            font-weight: 600;
            line-height: 42px;
            letter-spacing: -0.30000001192092896px;
            text-align: center;
            margin-bottom: 5px;
        }

        .offer-text h4 {
            font-size: 18px;
            font-weight: 500;
            line-height: 22px;
            letter-spacing: -0.30000001192092896px;
            text-align: center;
            color: rgba(27, 49, 79, 1);
        }

        .offer-text {
            margin-bottom: 0;
        }

        .offer__slider .slick-slide {
            margin: 0 10px;
        }

        .offer-card .img-wrap {
            margin-bottom: 14px;
            border-radius: 5px;
        }

        .offer-card {
            padding: 10px 8px 10px;
        }

        .btn-wrapper.mt-50 {
            margin-top: 25px;
        }

        .offer-card .img-wrap img {
            border-radius: 5px;
        }
    }

    @media (max-width: 768px) {

        .offer-card {
            border-radius: 10px;
        }

            .offer-card .btn-small {
                font-size: 15px;
                font-weight: 500;
                line-height: 20px;
                letter-spacing: 0em;
                padding: 5px 10px;
                height: 30px;
            }
    }

    @media screen and (min-width:1024px) {

        .goldsands-card-section {
            position: relative;
            padding: 50px 0;
            margin-bottom: 30px;
        }

            .goldsands-card-section .goldsands__container {
                .goldsands__container {
      background-color: rgba(207, 239, 252, 0.4);
      padding: 50px 80px ;
      border-radius: 40px;
      max-width: 1200px;
      width:1150px;
    }
  }
  
}
 @media screen and (max-width:767px) {
  .goldsands-card-section {
    position:relative;
    padding: 20px 0;
    margin: 1rem 2rem;
    
  }
  .goldsands-card-section .goldsands__container {
    max-width: 100%;
    width: 100%;
    background-color: #CFEFFC;
    border-radius: 37px;
    padding: 16px 10px;
  }
 }
 @media screen and (min-width:768px) and (max-width:1024px) {
  .goldsands-card-section .goldsands__container{
    width: 90%;
  }
 }
/*---------------------------------
     testimonial start 
  ---------------------------------*/

.testimonial {
  position: relative;
  margin-bottom: 100px;
  overflow: hidden;
}

.testimonial-wrap {
  background-color: #ebf0fa;
  border-radius: 20px;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.author-box {
  text-align: center;
  flex: 1;
}

.author-box img {
  max-width: 100px;
  max-height: 100px;
  height: auto;
  border-radius: 50%;
  border: 3px solid var(--primary-color);
  margin: 0 auto 20px;
}

.author__name {
  font-family: var(--heading-font);
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -0.30000001192092896px;
  color: var(--primary-color);
}

.autho__nfo {
  font-size: 1rem;
  line-height: 1.5rem;
  font-family: var(--body-font);
}

.ratting-list {
  display: flex;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 10px;
  justify-content: center;
}

.card-test {
  padding: 40px 15px;
  border-radius: 20px;
  background-color: var(--white-color);
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 2rem;
  font-family: var(--body-font);
  color: var(--black-color);
}

.test__item {
  margin: 0 10px;
}

.testimonial-slider .slick-slide {
  transform: scale(0.8);
  transition: all 0.4s ease-in-out;
}

.testimonial-slider .slick-slide,
.testimonial-slider
  .slick-slide[aria-hidden="true"]:not(.slick-cloned)
  ~ .slick-cloned[aria-hidden="true"] {
  transform: scale(0.8, 0.8);
  transition: all 0.4s ease-in-out;
}

.testimonial-slider .slick-center,
.testimonial-slider
  .slick-slide[aria-hidden="true"]:not([tabindex="-1"])
  + .slick-cloned[aria-hidden="true"] {
  transform: scale(1.1);
}

.testimonial-slider .slick-current.slick-active {
  transform: scale(1.1);
}

.testimonial-slider .slick-list {
  padding: 24px 20px !important;
}

@media (max-width: 1280px) {
  .testimonial-wrap {
    display: block;
}

.card-test{
  text-align: center;
  padding: 19px 15px;
  margin-top: 30px;
}

.author-box img {
  margin-top: -65px;
}
.testimonial-slider .slick-list {
  padding: 80px 20px 30px !important;
}

.test__item {
  margin: 0;
}
}

@media (max-width: 600px) {
    .testimonial-slider .slick-list {
        padding: 80px 20px 20px !important;
    }
    .testimonial-slider .slick-initialized .slick-slider .slick-dotted .slick-dots{
        padding: 0 0 1rem;
    }
}
    /*---------------------------------
    offer__section start 
  ---------------------------------*/
    .hero-image-header-compliance {
        /*  This creates an image overlay  */
        background: url("../assets/sale-banner.png");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        /* to ensure the image takes up the entire viewport */
        height: 65vh;
        position: relative;
    }

    @media screen and (max-width:991px) {
        .hero-image-header-compliance {
            height: 50vh;
        }
    }

    .offer__section {
        position: relative;
        padding: 50px 0;
    }

        .offer__section .offer-card {
            box-shadow: 0px 4px 10px 0px rgba(22, 22, 22, 0.1);
        }

    @media (min-width: 1280px) {
        .offer__section .container .row {
            --bs-gutter-x: 5rem;
        }
    }

    .sub-heading {
        font-size: 2rem;
        line-height: 2.5rem;
    }

    @media (max-width:991px) {
        .offer__section .offer-card {
            margin: 0 0 30px;
        }

        .offer__section .mb-60 {
            margin-bottom: 30px;
        }
    }


    /*---------------------------------
    discount-section
  ---------------------------------*/

    .discount-section {
        position: relative;
        padding: 60px 0;
    }


    .innner__container-discount {
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        border-radius: 40px;
        padding: 70px;
        background-color: rgba(207, 239, 252, 0.4);
    }

    .inner__heading {
        color: var(--primary-color);
        font-family: var(--poppins-font);
        font-size: 80px;
        font-weight: 700;
        line-height: 85px;
        letter-spacing: 0em;
        margin-bottom: 40px;
    }

    .inner__title {
        color: var(--primary-color);
        font-family: var(--poppins-font);
        font-size: 124px;
        font-weight: 700;
        line-height: 136px;
        letter-spacing: 0em;
        margin-bottom: 40px;
    }


    .inner_des {
        font-family: var(--body-font);
        font-size: 40px;
        font-weight: 500;
        line-height: 61px;
        letter-spacing: 0em;
        text-align: center;
        max-width: 945px;
        margin: 0 auto;
        color: rgba(119, 119, 119, 1);
    }

    @media (max-width:1280px) {
        .innner__container-discount {
            padding: 40px;
        }

        .inner__heading {
            font-size: 62px;
            line-height: 70px;
            letter-spacing: 0em;
            margin-bottom: 20px;
        }

        .inner__title {
            font-size: 96px;
            line-height: 116px;
            letter-spacing: 0em;
            margin-bottom: 45px;
        }
    }

    @media (max-width:991px) {
        .discount-section {
            padding: 30px 0;
        }

        .innner__container-discount {
            padding: 30px 20px;
            border-radius: 15px;
        }

        .inner__heading {
            font-size: 30px;
            line-height: 30px;
            letter-spacing: 0em;
            margin-bottom: 15px;
        }

        .inner__title {
            font-size: 40px;
            line-height: 85px;
            letter-spacing: 0em;
            margin-bottom: 5px;
        }

        .inner_des {
            font-size: 20px;
            font-weight: 400;
            line-height: 25px;
            letter-spacing: 0.025em;
        }
    }







    /*--CSS New Start different Pages -----*/

    /*-----Golsands Group Blog start-------*/
    .section__header {
        font-size: 2.4rem;
        line-height: 2.5rem;
        margin-bottom: 10px;
        color: #038A45;
        font-weight: 600;
    }

    @media (min-width: 1024px) {
        .section__header {
            font-size: 2.4rem;
            line-height: 2.5rem;
            margin-bottom: 10px;
            font-weight: 600;
        }
    }

    @media screen and (min-width:768px) and (max-width: 1023px) {
        .section__header {
            font-size: 2rem;
            font-weight: 500;
            line-height: 2.2rem;
            letter-spacing: 0em;
        }
    }

    @media (max-width: 767px) {
        .section__header {
            font-size: 1.8rem;
            font-weight: 500;
            line-height: 2rem;
            letter-spacing: 0em;
        }
    }



    /*-----Golsands Group Blog end-------*/
    /* ------------offer details page css start --------- */
    /*---------------------------------
    discount-section
  ---------------------------------*/
    .hero-image-header-compliance {
        /*  This creates an image overlay  */
        background: url("../../assets/offer7.png");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        /* to ensure the image takes up the entire viewport */
        height: 70vh;
        position: relative;
    }

    @media screen and (max-width:991px) {
        .hero-image-header-compliance {
            height: 50vh;
        }
    }

    .discount-section {
        position: relative;
        padding: 60px 0;
    }


    .innner__container-discount {
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        border-radius: 40px;
        padding: 70px;
        background-color: rgba(207, 239, 252, 0.4);
    }

    .inner__heading {
        color: var(--primary-color);
        font-family: var(--poppins-font);
        font-size: 40px;
        font-weight: 700;
        line-height: 40px;
        letter-spacing: 0em;
        margin-bottom: 40px;
    }

    .inner__title {
        color: var(--primary-color);
        font-family: var(--poppins-font);
        font-size: 60px;
        font-weight: 700;
        line-height: 60px;
        letter-spacing: 0em;
        margin-bottom: 40px;
    }


    .inner_des {
        font-family: var(--body-font);
        font-size: 2.25rem;
        width: 60%;
        font-weight: 500;
        line-height: 40px;
        letter-spacing: 0em;
        text-align: center;
        max-width: 945px;
        margin: 0 auto;
        color: rgba(119, 119, 119, 1);
    }

    @media (max-width:1280px) {
        .innner__container-discount {
            padding: 40px;
        }

        .inner__heading {
            font-size: 60px;
            line-height: 70px;
            letter-spacing: 0em;
            margin-bottom: 20px;
        }

        .inner__title {
            font-size: 96px;
            line-height: 116px;
            letter-spacing: 0em;
            margin-bottom: 45px;
        }

        .inner_des {
            width: 75% !important;
        }
    }

    @media (max-width:991px) {
        .discount-section {
            padding: 30px 0;
        }

        .innner__container-discount {
            padding: 30px 20px;
            border-radius: 15px;
        }

        .inner__heading {
            font-size: 30px;
            line-height: 20px;
            letter-spacing: 0em;
            margin-bottom: 15px;
        }

        .inner__title {
            font-size: 40px;
            line-height: 85px;
            letter-spacing: 0em;
            margin-bottom: 5px;
        }

        .inner_des {
            font-size: 20px;
            font-weight: 400;
            line-height: 25px;
            letter-spacing: 0.025em;
        }
    }

    /*---------------------------------
       offer__card-slider
  ---------------------------------*/
    .offer__card-section {
        position: relative;
        padding: 60px 0;
    }

    .offer_brand_logo {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .offer_brand_logo img {
            padding: 1rem;
            width: 100%;
            height: 100%;
            border-radius: 40px;
        }

    @media (max-width:991px) {
        .brand_offer_header {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .offer_brand_logo {
            width: 40%;
        }

        .offer__card-slider {
            display: flex;
            flex-direction: column !important;
            align-items: center;
        }
    }

    .offer__card-slider {
        display: flex;
        flex-direction: row;
        justify-content: center;
        column-gap: 35px;
    }

        .offer__card-slider .slider__item {
            max-width: 350px;
            width: 300px;
        }

    .offer__card-box {
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        border-radius: 40px;
        padding: 48px;
        justify-content: center;
        display: flex;
        min-height: 320px;
        align-items: center;
    }

        .offer__card-box h3 {
            font-family: var(--poppins-font);
            font-size: 40px;
            font-weight: 700;
            text-align: center;
            line-height: 50px;
            letter-spacing: 0em;
            color: var(--primary-color);
        }

        .offer__card-box p {
            font-size: 20px;
            font-weight: 500;
            line-height: 45px;
            text-align: center;
            letter-spacing: 0em;
            color: rgba(0, 0, 0, 0.6);
        }

    @media (max-width:1367px) {
        .offer__card-box {
            padding: 30px;
        }

        .offer__card-slider .slider__item {
            margin: 26px;
        }
    }

    @media (max-width:1280px) {
        .offer__card-slider .slider__item {
            margin: 20px;
        }

        .offer__card-box {
            padding: 20px;
            min-height: inherit;
            border-radius: 30px;
            min-height: 265px;
            box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
        }

            .offer__card-box h3 {
                font-size: 42px;
                font-weight: 500;
                line-height: 44.5px;
                margin-bottom: 20px;
            }

            .offer__card-box p {
                font-size: 26px;
                font-weight: 400;
                line-height: 32px;
                letter-spacing: 0.025em;
            }
    }

    @media (max-width:991px) {

        .offer__card-section {
            padding: 30px 0;
        }

        .offer__card-box h3 {
            font-size: 25px;
            font-weight: 500;
            text-align: center;
            line-height: 19.5px;
            margin-bottom: 20px;
        }

        .offer__card-box p {
            font-size: 16px;
            font-weight: 400;
            text-align: center;
            line-height: 19px;
            letter-spacing: 0.025em;
        }

        .offer__card-box {
            padding: 16px;
            min-height: inherit;
            border-radius: 30px;
            min-height: 158px;
            box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .offer__card-slider .slider__item {
            margin: 15px;
            max-width: 100%;
            width: 100%;
        }

        .offer__card-slider .slick-list {
            padding: 0px 80px 0 0 !important;
        }
    }










    /*---------------------------------
     offer__card--details start 
  ---------------------------------*/
    .offer__card--details {
        position: relative;
        padding: 60px 0;
    }

    .innner__container-details {
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        padding: 30px 70px;
        border-radius: 40px;
    }

    .details-bg-blue {
        background-color: rgba(207, 239, 252, 0.4);
    }

    .details-bg-light {
        background-color: rgba(235, 240, 250, 0.4);
    }

    .details__title {
        text-align: center;
        font-family: var(--poppins-font);
        font-size: 30px;
        font-weight: 700;
        line-height: 60px;
        letter-spacing: 0em;
        color: var(--primary-color);
        margin-bottom: 20px;
    }

    .offer__details-list li {
        font-family: var(--body-font);
        font-size: 2rem;
        font-weight: 500;
        line-height: 3rem;
        letter-spacing: 0em;
        color: rgba(0, 0, 0, 0.7);
        margin-bottom: 15px;
    }

        .offer__details-list li:last-child {
            margin-bottom: 0;
        }

    @media (max-width:991px) {
        .offer__card--details {
            padding: 30px 0;
        }

        .innner__container-details {
            padding: 30px;
            border-radius: 20px;
        }

        .offer__details-list li {
            font-size: 1.4rem;
            font-weight: 400;
            line-height: 2.5rem;
            letter-spacing: 0.025em;
        }

        .details__title {
            font-size: 28px;
            font-weight: 500;
            line-height: 35px;
            letter-spacing: 0em;
        }
    }
    /*---------------------------------
     fair-details-list  start 
  ---------------------------------*/

    .fair-details-list {
        padding: 60px 0;
        position: relative;
    }

    .innner__container-fair {
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        padding: 40px 40px 90px;
        border-radius: 40px;
        background-color: rgba(255, 255, 255, 1);
    }

    .fair-details__title {
        font-family: var(--poppins-font);
        font-size: 40px;
        font-weight: 700;
        line-height: 60px;
        letter-spacing: 0em;
        text-align: center;
        color: var(--primary-color);
        margin-bottom: 30px;
    }

    .fair-details__list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .fair-details__list li {
            display: flex;
            align-items: center;
            margin-bottom: 30px;
        }

            .fair-details__list li:last-child {
                margin-bottom: 0;
            }


    .fair-details__heading {
        flex: 1;
        display: flex;
        align-items: center;
        align-self: stretch;
    }

    .list__box {
        flex: 4;
        border: 1px solid rgba(99, 94, 94, 0.2);
        background-color: rgba(243, 243, 244, 1);
        color: rgba(0, 0, 0, 0.7);
        padding: 10px;
        font-family: var(--poppins-font);
        font-size: 2rem;
        font-weight: 400;
        line-height: 24px;
        letter-spacing: 0em;
        text-align: center;
    }

    .list__title {
        color: rgba(0, 0, 0, 0.7);
        font-family: var(--heading-font);
        font-size: 2rem;
        font-weight: 400;
        line-height: 24px;
        letter-spacing: 0em;
    }

    @media (max-width:991px) {
        .innner__container-fair {
            padding: 20px;
            border-radius: 20px;
        }

        .fair-details__list li {
            display: block;
            margin-bottom: 10px;
        }

        .list__box {
            padding: 10px;
            font-size: 1.4rem;
            font-weight: 500;
            line-height: 24px;
            letter-spacing: 0em;
            text-align: left;
        }

        .list__title {
            margin-bottom: 10px;
            font-size: 1.5rem;
            font-weight: 500;
            line-height: 24px;
            letter-spacing: 0em;
            text-align: left;
        }

        .fair-details__title {
            font-size: 30px;
            font-weight: 500;
            line-height: 20px;
            letter-spacing: 0em;
            text-align: center;
        }
    }

    /*---------------------------------
   fare-description 
  ---------------------------------*/

    .fare-description {
        padding: 60px 0;
        position: relative;
    }

    .inner__container--description {
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        padding: 40px 40px 90px;
        border-radius: 40px;
        background-color: rgba(207, 239, 252, 0.4);
    }

    .fare-description__title {
        font-family: var(--poppins-font);
        font-size: 40px;
        font-weight: 700;
        line-height: 60px;
        letter-spacing: 0em;
        text-align: center;
        color: var(--primary-color);
        margin-bottom: 20px;
    }

    .img-box-card {
        border-radius: 10px;
        padding: 5px;
        box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);
        max-width: 300px;
        margin: 0 auto;
    }

    .fare-description-text {
        font-family: var(--body-font);
        font-size: 2rem;
        font-weight: 400;
        line-height: 3rem;
        text-align: justify;
        letter-spacing: 0em;
        text-align: justified;
        color: #333;
    }

    @media (max-width:991px) {
        .inner__container--description {
            padding: 20px;
            border-radius: 20px;
        }

        .fare-description__title {
            font-size: 30px;
            font-weight: 500;
            line-height: 20px;
            letter-spacing: 0em;
            text-align: center;
        }

        .fare-description-text {
            font-size: 1.5rem;
            font-weight: 400;
            line-height: 2.5rem;
            letter-spacing: 0.025em;
            text-align: center;
            margin-bottom: 20px !important;
        }
    }




    /* ------------offer details page css end --------- */
    /* ---------- about us page start ------------- */
    /* ------ About Us  --------*/
    @media screen and (min-width:768px) and (max-width:1023px) {

        .container_faq {
            max-width: 100%;
            width: 100%;
        }

        .about_csr_container {
            width: 80% !important;
        }

        .about__box-wrap {
            padding: 10px;
        }
    }

    @media screen and (max-width:767px) {
        .about__box-wrap {
            padding: 10px;
        }

        .container_faq {
            max-width: 100%;
            width: 100%;
        }

        .about_csr_container {
            width: 80% !important;
        }

            .about_csr_container h2 {
                text-align: center;
                font-size: 1.8rem;
            }

        .about__description {
            font-family: var(--plus-jakarta-font);
            font-size: 1.4rem !important;
            font-weight: 400;
            text-align: justify;
            line-height: 2rem;
            margin-bottom: 1rem;
        }
    }

    @media screen and (min-width:1024px) {
        .about_csr_container {
            max-width: 65%;
            width: 50%;
        }

        .aboutus__img img {
            max-width: 100%;
            height: 100%;
        }
    }

    .csr_section {
        position: relative;
        padding: 60px 0 0 0;
    }

    .about_csr_container {
        border-radius: 37px;
        padding: 16px 0;
        max-width: 80%;
        width: 60%;
        margin: 5rem 2rem 2rem 2rem;
        font-family: var(--body-font);
        color: #2E3542;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
        background-color: #F5F6EE;
    }

    .container_faq {
        margin-top: 35px;
        display: flex;
        justify-content: center;
    }

    .aboutus__img {
        padding: 2rem;
        max-width: 100%;
    }

        .aboutus__img img {
            width: 100%;
            height: 100%;
            border-radius: 2rem;
            background-color: transparent;
        }

    .aboutus__title {
        margin-bottom: 0.5rem;
        text-align: center;
        font-size: 2.6rem;
        font-weight: 600;
        line-height: 2.5rem;
    }

    @media screen and (max-width:767px) {
        .aboutus__title {
            text-align: center;
            font-size: 2rem;
            padding: 0.5rem;
            line-height: 2.5rem;
        }
    }



    .btn_event_ct {
        width: fit-content;
        padding: 0.5rem 1rem;
        border-radius: 2rem;
        margin: 2rem;
        background-color: var(--white-color);
        color: var(--secondary-color);
        border: solid var(--secondary-color) 0.1rem;
        transition: all 0.3s ease-in-out;
    }

        .btn_event_ct:hover {
            background-color: var(--secondary-color);
            color: var(--white-color);
        }

    @media screen and (max-width:767px) {
        .btn_event_ct span {
            font-size: 1.2rem;
        }
    }

    @media screen and (min-width:768px) and (max-width:1023px) {
        .btn_event_ct span {
            font-size: 1.4rem;
        }
    }
    /*_________Mission__________________*/

    /*-----------mission start -----------*/
    @media screen and (min-width:768px) and (max-width:1023px) {
        .mission-section {
            position: relative;
            padding: 2rem 0;
            display: flex;
            align-items: center !important;
            margin: 2rem 2rem;
        }

        .mission-container {
            display: flex;
            flex-direction: column;
            align-items: center !important;
            width: 100%;
            max-width: 100%;
            padding: 2rem 5rem;
        }

            .mission-container .mission-list li {
                font-size: 1.4rem !important;
                line-height: 2rem;
                font-weight: 400;
            }

        .mission-image img {
            max-width: 180px !important;
            height: auto;
        }
    }

    @media screen and (max-width:767px) {
        .mission-section {
            position: relative;
            padding: 1rem 0;
            display: flex;
            align-items: center !important;
            margin: 1rem 1rem;
        }

        .mission-container {
            display: flex;
            flex-direction: column;
            align-items: center !important;
            width: 100%;
            max-width: 100%;
            padding: 2rem 5rem;
        }

            .mission-container .mission-list li {
                font-size: 1rem !important;
                line-height: 1.2rem;
                font-weight: 400;
            }

        .mission-image img {
            max-width: 140px !important;
            height: auto;
        }
    }

    @media screen and (max-width:500px) {
        .mission-container {
            padding: 2rem 2rem;
        }
    }
    /* animation start */

    .reveal {
        position: relative;
        transform: translateY(150px);
        opacity: 0;
        transition: all 2.5s ease;
    }

        .reveal.active {
            transform: translateY(0px);
            opacity: 1;
        }
    /* animation end */

    .mission-section {
        position: relative;
        padding: 50px 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 2rem 2rem;
    }

    .misstion_content {
        background-color: #EBF0FA;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
        border-radius: 37px;
        padding: 16px 10px;
        max-width: 88%;
        font-family: var(--body-font)
    }

        .misstion_content h2 {
            font-size: 2.25rem;
            font-weight: 700;
            text-align: center;
            line-height: 2rem;
        }

    .mission-container {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 100%;
        padding: 5rem 5rem auto;
    }

    .mission-image {
        margin-right: 20px;
        padding: 0 3rem 0;
    }

        .mission-image img {
            max-width: 160px;
            height: auto;
            margin: 1rem auto;
        }

    .mission-list {
        list-style: none;
        padding: 0;
    }

        .mission-list li {
            transition: opacity 0.8s, transform 0.8s;
            margin: 5px 0;
            font-size: 1.4rem;
            color: #333;
            line-height: 2rem;
            font-weight: 400;
        }

        .mission-list i {
            margin-right: 10px;
            font-size: 1.2rem;
        }
    /* .animate {
  animation: slideIn 1s forwards;
} */
    @keyframes slideIn {
        to {
            opacity: 1;
            transform: translateX(0);
        }
    }
    /*-----------mission end -----------*/


    /* CSS Document */

    /******* Common Element CSS Start ******/
    /* @media screen and (max-width:420px) {
  .center-logo img {
    max-width: 60px !important;
  }
  .center-logo {
    position: absolute;
    top: 25% !important;
  }
  .big-circle {
  height: 50% !important;
  }
  .circle {
    position: absolute;
    top: 25% !important;
    left: 50%;
    width: 60% !important;
    height: 30% !important;
    border: 3px solid #6495f2;
  }
  .icon-block_text {
    width: 60px !important;
    height: 60px !important;
  }
  .icon-block_text h5 {
      font-size: 1rem !important;
  }
  .icon-block {
    width: 45px !important;
    height: 45px !important;
  }
  .main {

    height: 40rem;

  }
    
} */
    @media screen and (max-width:600px) {
        .center-logo img {
            max-width: 40px !important;
        }

        .center-logo {
            position: absolute;
            top: 50% !important;
        }

        .big-circle {
            height: 100% !important;
            top: 0;
            width: 100% !important;
        }

        .circle {
            position: absolute;
            top: 50% !important;
            left: 50%;
            width: 50% !important;
            height: 50% !important;
            border: 3px solid #6495f2;
        }

        .icon-block_text {
            width: 70px !important;
            height: 70px !important;
        }

            .icon-block_text h5 {
                font-size: 1.2rem !important;
            }

        .icon-block {
            width: 45px !important;
            height: 45px !important;
        }

        .main {
            height: 20rem !important;
            width: 40rem !important;
        }

        .main-container {
            padding: 7rem !important;
        }
    }

    .main-container {
        min-height: 100%;
        display: flex;
        padding: 5rem;
        display: -webkit-flex;
        align-items: center;
        -webkit-align-items: center;
        height: 100%;
        overflow: hidden;
    }

    .main {
        margin: 0px auto;
        width: 40rem;
        height: 40rem;
        position: relative;
    }

    .big-circle {
        height: 100%;
        width: 100%;
        position: relative;
        border: 3px solid #6495f2;
        border-radius: 50%;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        -webkit-align-items: center;
        justify-content: center;
        -webkit-justify-content: center;
        animation: Rotate 20s linear infinite;
        -webkit-animation: Rotate 20s linear infinite;
    }

    .icon-block {
        width: 75px;
        height: 75px;
        position: absolute;
        border-radius: 50%;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        -webkit-align-items: center;
        justify-content: center;
        -webkit-justify-content: center;
        background-image: linear-gradient(180deg, #4967e6 0%, #627bf4 100%);
        -webkit-background-image: linear-gradient(180deg, #4967e6 0%, #627bf4 100%);
        box-shadow: 0 2px 4px 0 #3e5ada;
        -webkit-box-shadow: 0 2px 4px 0 #3e5ada;
    }
    /* ------------------- */
    .icon-block_text {
        width: 90px;
        height: 90px;
        position: absolute;
        border-radius: 50%;
        display: flex;
        display: -webkit-flex;
        align-items: center;
        -webkit-align-items: center;
        justify-content: center;
        -webkit-justify-content: center;
        background-image: linear-gradient(180deg, #4967e6 0%, #627bf4 100%);
        -webkit-background-image: linear-gradient(180deg, #4967e6 0%, #627bf4 100%);
        box-shadow: 0 2px 4px 0 #3e5ada;
        -webkit-box-shadow: 0 2px 4px 0 #3e5ada;
    }

        .icon-block_text h5 {
            margin: 0px auto;
            width: 86%;
            text-align: center;
            font-size: 1.4rem;
            color: white;
            animation: Rotate-reverse 20s linear infinite;
            -webkit-animation: Rotate-reverse 20s linear infinite;
        }

        .icon-block_text img {
            margin: 0px auto;
            width: 86%;
            animation: Rotate-reverse 20s linear infinite;
            -webkit-animation: Rotate-reverse 20s linear infinite;
        }

        .icon-block_text:first-child {
            top: 0;
            left: 50%;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
        }

        .icon-block_text:nth-child(2) {
            top: 50%;
            right: 0;
            transform: translate(50%, -50%);
            -webkit-transform: translate(50%, -50%);
        }

        .icon-block_text:nth-child(3) {
            bottom: 0;
            left: 50%;
            transform: translate(-50%, 50%);
            -webkit-transform: translate(-50%, 50%);
        }

        .icon-block_text:nth-child(4) {
            top: 50%;
            left: 0;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
        }

    /* ----------------- */






    .icon-block h5 {
        margin: 0px auto;
        width: 86%;
        animation: Rotate-reverse 20s linear infinite;
        -webkit-animation: Rotate-reverse 20s linear infinite;
    }

    .icon-block img {
        margin: 0px auto;
        width: 86%;
        animation: Rotate-reverse 20s linear infinite;
        -webkit-animation: Rotate-reverse 20s linear infinite;
    }

    .icon-block:first-child {
        top: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
    }

    .icon-block:nth-child(2) {
        top: 50%;
        right: 0;
        transform: translate(50%, -50%);
        -webkit-transform: translate(50%, -50%);
    }

    .icon-block:nth-child(3) {
        bottom: 0;
        left: 50%;
        transform: translate(-50%, 50%);
        -webkit-transform: translate(-50%, 50%);
    }

    .icon-block:nth-child(4) {
        top: 50%;
        left: 0;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
    }


    /* circle content */
    .circle {
        animation: circle-rotate 20s linear infinite;
        -webkit-animation: circle-rotate 20s linear infinite;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) rotate(45deg);
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        width: 75%;
        height: 75%;
        border: 3px solid #6495f2;
        border-radius: 50%;
    }

        .circle .icon-block img {
            animation: img-rotate 20s linear infinite;
            -webkit-animation: img-rotate 20s linear infinite;
        }
    /* center logo */
    .center-logo {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
    }

        .center-logo img {
            max-width: 150px;
        }

    /* keyframe animation */

    @keyframes Rotate {
        from {
            transform: rotate(0deg);
        }

        to {
            transform: rotate(360deg);
        }
    }

    @-webkit-keyframes Rotate {
        from {
            -webkit-transform: rotate(0deg);
        }

        to {
            -webkit-transform: rotate(360deg);
        }
    }

    @keyframes Rotate-reverse {
        from {
            transform: rotate(360deg);
        }

        to {
            transform: rotate(0deg);
        }
    }

    @-webkit-keyframes Rotate-reverse {
        from {
            -webkit-transform: rotate(360deg);
        }

        to {
            -webkit-transform: rotate(0deg);
        }
    }

    @keyframes circle-rotate {
        from {
            transform: translate(-50%, -50%) rotate(45deg);
        }

        to {
            transform: translate(-50%, -50%) rotate(405deg);
        }
    }

    @-webkit-keyframes circle-rotate {
        from {
            -webkit-transform: translate(-50%, -50%) rotate(45deg);
        }

        to {
            -webkit-transform: translate(-50%, -50%) rotate(405deg);
        }
    }

    @keyframes img-rotate {
        from {
            transform: rotate(-45deg);
        }

        to {
            transform: rotate(-405deg);
        }
    }

    @-webkit-keyframes img-rotate {
        from {
            -webkit-transform: rotate(-45deg);
        }

        to {
            -webkit-transform: rotate(-405deg);
        }
    }




    /*----------------Circle Vission ------------------*/

    /* .menu {
  position: relative;
  margin-top: 15%;
  left: 50%;
  width: 0px;
  transform: translate(-50%, 55%);
}

.toggle {
  display: none;
}

.toggle + .style {
    width: 200px;
    height: 124px;
    border-radius: 50%;
    cursor: pointer;
    transform: translate(-50%, -50%) scale(1);
    z-index: 5;
    display: block;
    max-width: 200px;
    margin-bottom: 0;
    background: #ff0000;
    color: #fff;
    font-size: 2.5em;
    padding-top: 75px;
    text-align: center;
   -webkit-transition: all .8s;
   -moz-transition: all .8s;
   -o-transition: all .8s;
   -ms-transition: all .8s;
   transition: all .8s;
}

.menu p{
    max-width: 85px;
    text-align: center;
    margin: 0 auto;
    line-height: 15px;
    padding-top: 50px;
    font-weight: 700;
    font-size: 2em;
}

.toggle + .style:hover{
	-webkit-box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, .7);
    -ms-box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, .7);
    -o-box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, .7);
    box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, .7);
}

.toggle:checked + .style {
  transform: translate(-50%, -50%) scale(.5);
}

.menu input[type=checkbox] + label:before {
    content: "";
    position: absolute;
}

.toggle + .style:before, .toggle + .style:after {
  content: "";
  position: absolute;
  margin: -3px;
  border-radius: 5px;
  transition: all 0.3s;
}

.toggle + .style:before {
  width: 30px;
  height: 0px;
  left: 10px;
  top: 25px;
}

.toggle + .style:after {
  width: 0px;
  height: 30px;
  left: 25px;
  top: 10px;
}

.toggle:checked + .style:before, .toggle:checked + .style:after {
  transform: rotate(135deg);
}

.toggle ~ .tab {
    position: absolute;
    background: #ff0000;
    color: #fff;
    width: 120px;
    height: 120px;
    left: 0px;
    top: 0px;
    transform: translate(-50%, -50%) scale(0);
    transition: all 0.3s;
    opacity: 0;
    border-radius: 50%;
}

.toggle:checked ~ .tab {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.menu > .toggle:checked ~ .tab:nth-of-type(1) {
  top: -122px;
  left: 0px;
  transition-delay: 0s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(2) {
  top: -74px;
  left: 120px;
  transition-delay: 0.125s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(3) {
  top: 56px;
  left: 115px;
  transition-delay: 0.25s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(4) {
  top: 122px;
  left: 0px;
  transition-delay: 0.375s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(5) {
  top: 56px;
  left: -115px;
  transition-delay: 0.5s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(6) {
  top: -74px;
  left: -120px;
  transition-delay: 0.625s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(7) {
  top: 0px;
  left: -133.33333px;
  transition-delay: 0.75s;
}

.menu > .toggle:checked ~ .tab:nth-of-type(8) {
  top: -94.2809px;
  left: -94.2809px;
  transition-delay: 0.875s;
}
 */

    /*--------- Circle Mission ------------*/
    @media screen and (min-width:1024px) {
        #circle-shape-example {
            margin: 2rem;
        }

            #circle-shape-example .moto .moto__img {
                position: relative;
                box-sizing: border-box;
                background-color: transparent;
                -moz-box-sizing: border-box;
                -webkit-box-sizing: border-box;
                border: 4px solid lightblue;
                border-image: linear-gradient(to right, #3acfd5 0%, #3a4ed5 100%);
                border-image-slice: 1;
                transform: rotate(45deg);
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 0px;
                height: 70px;
                width: 70px;
                margin-top: 10px;
            }

                #circle-shape-example .moto .moto__img img {
                    transform: rotate(-45deg);
                    width: 100%;
                }


            #circle-shape-example .moto {
                display: flex;
                position: initial;
                flex-direction: row;
                background-color: transparent;
                justify-content: space-evenly;
                padding: 1rem;
            }

        .sister__brand {
            width: 60%;
            height: 80px;
            background: #7fb8fd;
            position: relative;
            transition: 0.5s all ease-in;
            cursor: pointer;
            &:after {
        content: '';
        position: absolute;
        left: 0; bottom: 0; width: 0; height: 0;
        border-top: 50px solid transparent;
        border-bottom: 50px solid transparent;
      }
    
      &:before {
        content: '';
        position: absolute;
        right: -50px;
        bottom: 0;
        width: 0;
        height: 0;
        border-left: 50px solid #7fb8fd;
        border-top: 35px solid transparent;
        border-bottom: 35px solid transparent;
      }
    
  }
  .sister__brand h4{
    font-size: 1.4rem;
    color:#000;
    line-height: 1rem;
    padding: 1rem 0 0;
  }
#circle-shape-example p {
    line-height: 1.8rem !important;
    font-size: 1.4rem !important;
    font-weight: 400;
}
  #circle-shape-example .curve { 
    width: 90%; height: auto;
    display: block;
    min-width: 100%;
    float: left;
    padding: 0rem 1rem;
    margin-right:0; 
    border-radius: 50%;
    
  }
  #circle-shape-example-goal{
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: flex-start;
  }
  #circle-shape-example-goal img{
   width: 30%;
   height: 30%;
  }
  
  
}
@media screen and (min-width:768px) and (max-width:1023px) {
    #circle-shape-example p {
        line-height: 1.25rem !important;
        font-size: 1.1rem !important;
        font-weight: 400;
    }
}
@media screen  and (max-width:500px) {
    #circle-shape-example p {
        line-height: 1.4rem !important;
        font-size: 0.9rem !important;
        font-weight: 400;
    }
}
@media screen and (max-width:767px) {
  #circle-shape-example .col-lg-8{
    margin-top: 20px;
  }
  #circle-shape-example .col-lg-8 .sister__brand h4{
    font-size: 1.1rem;
    line-height: 1.1rem !important;
    font-weight: 700 !important;
    padding: 0.7rem 0 0;
  }
  #circle-shape-example .row .col-lg-4 {
    width: 150px !important;
  }
  #circle-shape-example .row{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #circle-shape-example .moto{
    padding:0.2rem;
  }
  #circle-shape-example .moto .moto__img{
    height: 60px !important;
    width: 60px !important;
    margin-top: 10px !important;
  }
  #circle-shape-example .moto .moto__img img{
    height: 30px;
    width: 100%;
  }
    #circle-shape-example p {
        line-height: 1.6rem !important;
        font-size: 1.1rem !important;
        font-weight: 400;
    }
  .sister__brand{
    
    width: 60%;
    height: 70px;
    background: #7fb8fd;
    position: relative;
    transition:0.5s all ease-in;
    cursor:pointer; 
  
    &:after {
      content: '';
      position: absolute;
      left: 0; bottom: 0; width: 0; height: 0;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
    }
  
    &:before {
      content: '';
      position: absolute;
      right: -50px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid #7fb8fd;
      border-top: 10px solid transparent;
      border-bottom: 10px solid transparent;
    }
  
}
}
#circle-shape-example { 
  margin: 2rem; 
}
    #circle-shape-example .moto .moto__img {
        position: relative;
        box-sizing: border-box;
        background-color: transparent;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        border: 4px solid lightblue;
        border-image: linear-gradient(to right, #3acfd5 0%, #3a4ed5 100%);
        border-image-slice: 1;
        transform: rotate(45deg);
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0px;
        height: 70px !important;
        width: 70px !important;
        margin-top: 10px !important;
    }
#circle-shape-example .moto .moto__img img{
  transform: rotate(-45deg);
  width: 100%;
}


#circle-shape-example .moto{
  display: flex;
  position: initial;
  flex-direction: row;
  background-color: transparent;
  justify-content: space-evenly;
  padding:1rem;
}

.sister__brand{
  
    width: 60%;
    height: 70px;
    background: #7fb8fd;
    position: relative;
    transition:0.5s all ease-in;
    cursor:pointer; 
  
    &:after {
      content: '';
      position: absolute;
      left: 0; bottom: 0; width: 0; height: 0;
      border-top: 50px solid transparent;
      border-bottom: 50px solid transparent;
    }
  
    &:before {
      content: '';
      position: absolute;
      right: -50px;
      bottom: 0;
      width: 0;
      height: 0;
      border-left: 50px solid #7fb8fd;
      border-top: 35px solid transparent;
      border-bottom: 35px solid transparent;
    }
  
}
.sister__brand h4{
  font-size: 1.4rem;
  line-height: 1rem;
  color:#000;
  padding: 1rem 0 0;
}
.sister__brand:hover h4{
  color:#fff;
}




#circle-shape-example p {
    line-height: 1.8rem;
    font-size: 1.4rem;
    font-weight: 400;
}
#circle-shape-example .curve { 
  width: 90%; height: auto;
  display: block;
  min-width: 100%;
  float: left;
  padding: 0rem 1rem;
  margin-right:0; 
  border-radius: 50%;
  
}
#circle-shape-example-goal{
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: flex-start;
}
#circle-shape-example-goal img{
 width: 30%;
 height: 30%;
}
@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.1, 1.1);
  }
  100% {
    transform: scale(1, 1);
  }
}


/* ---------- about us page end ------------- */

/* -----------------------News and Blogs 10 pages start------------------------ */
/*-----Golsands Group Blog start-------*/
.section__header {
  font-size: 70px;
  line-height: 78px;
  margin-bottom: 30px;
}
@media (max-width: 1200px) {
  .section__header{
      font-size: 50px;
      font-weight: 600;
      line-height: 50px;
      letter-spacing: 0em;
  }

}
@media (max-width: 991px) {
  .section__header{
      font-size: 30px;
      font-weight: 500;
      line-height: 40px;
      letter-spacing: 0em;
  }

}



/*-----Golsands Group Blog end-------*/


/*-----Branch Section Start------ */

.branch-section {
  position:relative;
  padding: 50px 0;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
}


.img__button{
  width: 20%;
  height: fit-content;
  background-color: var(--white-color);
  border: solid 0.1rem var(--secondary-color);
  border-radius: 4rem;
  cursor: pointer;
  color: #333;
  text-align: center;
  padding: 3px;
  font-size: 1.5rem;
  font-weight: 500;
  margin: 2rem 2.5rem;
  transition: all 0.5s ease;
}
.img__button:hover{
  background-color: var(--secondary-color);
  color: var(--white-color);
}
.img_button_div .active {
    background-color: var(--secondary-color);
    color: var(--white-color);
}

.branch-section .branch_head h2{
  font-size: 2rem;
    font-family: var(--body-font);
    font-weight: 700;
    text-align: center;
    line-height: 2rem;
}
.branch-section .branch_head span{
  color: crimson;
  cursor: pointer;
  font-size: 2.5vw;
  line-height: 6vh;
}
.branch-section .branch_lists_blog{
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;
  align-items: center;
  justify-content: space-around;
  padding:1rem;
  width:100%;
}
.main_blog{
  display: none;
}
.branch-section .branch_cols_blog{
  display: flex;
  flex-direction: column;
  font-family: var(--body-font);
  align-items: initial;
  background: #CFEFFC;
  height: auto;
  width: 30%;
  padding: 1rem 1rem;
  border-radius: 1rem;
  margin-bottom: 3rem;
}
.branch-section .branch_cols_blog .blog_img{
  width: 320px;
  max-width: 320px;
  width:320px;
  max-height: 320px;
  height:180px;
  border: solid #fff 1rem;
  border-radius: 1rem;
  background: #FFDED6;
}
.branch-section .branch_cols_blog h2{
  font-size: 2rem;
  font-family: var(--body-font);
  font-weight: 700;
  text-align: center;
  line-height: 2.5rem;
  text-transform: uppercase;
  margin-top: 1rem;
}
.branch-section .branch_address_blog{
  display: flex;
  flex-direction: column;
  padding: 1rem;
  font-family: var(--body-font);
  color: var(--sky-color);
  align-content: center;
  align-items: center;
  justify-content: space-between;
}
.branch_cols_blog:hover{
  box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
}
.branch-section .branch_address_blog .col_left{
 width: 100%;
 font-size: 1.4rem;
 color:#333;
 font-weight: 400;
 text-align: justify;
 line-height: 2rem;
}
.branch-section .branch_address_blog .col_right{
  width: 95%;
  font-size: 0.85rem;
  font-weight: 400;
  text-align: left;
  line-height: 3rem;
 }
 @media screen and (min-width:1024px) {
  .branch-section {
    position:relative;
    padding: 50px 0;
    display: flex;
    align-items: center;
  }
  .branch-section .branch__container {
    background-color: #CFEFFC;
    border-radius: 37px;
    padding: 16px 0;
    max-width: 1200px;
    width:1150px;
  
  }
  .img_button_div{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  .img__button{
    width:15%;
    font-size: 1.2rem;
    margin: 0.5rem;
    font-weight: 500;
  }
  .branch-section .branch_head h2{
    font-size: 2.2rem;
      font-family: var(--body-font);
      font-weight: 700;
      text-align: center;
      line-height: 2rem;
  }
 
  .branch-section .branch_lists_blog{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    align-items: center;
    justify-content: space-around;
    padding:1rem;
    width:100%;
  }
  
  .branch-section .branch_cols_blog{
    display: flex;
    flex-direction: column;
    font-family: var(--body-font);
    align-items: initial;
    background: #CFEFFC;
    height: auto;
    width: 30%;
    padding: 1rem 1rem;
    border-radius: 1rem;
    margin-bottom: 3rem;
  }
    .branch-section .branch_cols_blog .blog_img {
        width: 320px;
        max-width: 320px;
        width: 320px;
        max-height: 320px;
        height: 180px;
        border: solid #fff 0.5rem;
        border-radius: 1rem;
        background: #FFDED6;
    }
  .branch-section .branch_cols_blog h2{
    font-size: 2rem;
    font-family: var(--body-font);
    font-weight: 700;
    text-align: center;
    line-height: 2.5rem;
    text-transform: uppercase;
    margin-top: 1rem;
  }
  .branch-section .branch_address_blog{
    display: flex;
    flex-direction: column;
    padding: 1rem;
    font-family: var(--body-font);
    color: var(--sky-color);
    align-content: center;
    align-items: center;
    justify-content: space-between;
  }
  .branch_cols_blog:hover{
    box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
  }
  .branch-section .branch_address_blog .col_left{
   width: 100%;
   font-size: 1.4rem;
   font-weight: 400;
   text-align: justify;
   line-height: 2rem;
  }
  .branch-section .branch_address_blog .col_right{
    width: 95%;
    font-size: 0.85rem;
    font-weight: 400;
    text-align: left;
    line-height: 3rem;
   }
 }
 @media screen and (max-width:450px) {
    #blog_img img {
        width: 100% !important;
        height: 150px !important;
        align-self: center !important;
    }
 }
 @media screen and (max-width:767px) {
  .branch-section {
    position:relative;
    padding: 20px 0;
    display: flex;
    align-items: center;
    margin: 1rem 2rem;
  }
  .branch-section .branch__container {
    max-width: 100%;
    width: 100%;
    background-color: #CFEFFC;
    border-radius: 37px;
    padding: 16px 10px;
  }

    .img_button_div {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
  .img__button{
    width:50%;
    font-size: 1.25rem;
    margin: 0.5rem;
    
  }
  .branch__container{
    width: 95%;
  }
  .branch-section .branch_head h2{
    font-size: 2.25rem !important;
    line-height: 1.5rem;
  }
  .branch-section .branch_lists_blog{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding:2rem;
    width:100%;
  }
  .branch-section .branch_cols_blog .blog_img{
    border: solid #fff .4rem;
  }
  #blog_img img{
    width:100%;
    max-width:415px;
    height:200px;
    display: flex;
    align-self: center !important;
  }
  .branch-section .branch_cols_blog{
    width: 100%;
    padding:2.5rem;
  }
  .branch-section .branch_cols_blog h2{
    font-size: 1.6rem;
  }
  .branch-section .branch_address_blog .col_left{
    width: 100%;
    font-size: 1.3rem;
    font-weight: 400;
    text-align: justify;
    line-height: 2rem;
   }
   
 }
 @media screen and (min-width:768px) and (max-width:1023px) {
  
  
  .img_button_div{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
  }
  .img__button{
    width:33%;
    font-size: 1.25rem;
    margin: 0.5rem;
  }
  .branch__container{
    width: 90%;
  }
  .branch-section .branch_head h2{
    font-size: 1.5rem;
    line-height: 1.5rem;
  }
  .branch-section .branch_lists_blog{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding:3rem;
    width:100%;
  }
  .branch-section .branch_cols_blog .blog_img{
    border: solid #fff .4rem;
  }
  #blog_img img{
    max-width:520px;
    width:100%;
    height:220px;
    display: flex;
    align-self: center !important;
  }
  .branch-section .branch_cols_blog{
    width: 100%;
    padding:3rem !important;
  }
  .branch-section .branch_cols_blog h2{
    font-size: 2rem;
  }
  .branch-section .branch_address_blog .col_left{
    width: 100%;
    font-size: 1.3rem;
    font-weight: 400;
    text-align: justify;
    line-height: 2rem;
   }
 }
 
 /*-----Branch Section End------ */


/*------award start ------*/
.award_container{
  background-color: transparent;
  border-radius: 37px;
  padding: 16px 0;
  max-width: 1200px;
  width:1150px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: var(--body-font);
  
}
.award_head{
  max-width: 80%;
  width:75%;
}
.award_head_title{
  font-weight: 600;
  font-size: 2.25rem;
  text-align: center;
  line-height: 3rem;
}
.award_head_detail{
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 2.5rem;
  color:#333;
}

.program_list a{
  display: block;
  overflow: hidden;
  padding:1rem;
}
.program_list .award_subtitle{
  font-weight: 600;
  font-size: 1.4rem;
  line-height: 2rem;
}
.award_program_details{
  font-weight: 400;
  font-size: 1.4rem;
  line-height: 2rem;
  color: #333;
}
/*.award_program_section{
  display: flex;
}*/
.award_program{
  display: flex;
  position: relative;
  text-align: start;
  flex-direction: row;
  font-family: var(--body-font);
  color: gray;
  justify-content: space-between;
  flex-wrap: wrap;
}
.program_list{
  max-width: 33%;
  width: 32%;
  border-radius: 2rem;
  padding: 0.8rem;
  height: fit-content;
  box-shadow: rgba(0, 174, 239, 0.25) 0px 13px 27px -5px,
    rgba(0, 174, 239, 0.3) 0px 8px 16px -8px;
    
}
.program_list:hover img{
  transform: scale(1.05);
}
.program_list img{
  max-width: 332px;
  width: 332px;
  max-height:200px;
  height: 200px;
  border-radius: 1rem;
  transition: transform .4s ease-in-out;
}
.award_subtitle{
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 1.8rem;
}

.event_span{
  font-size: 1.4rem;
  line-height: 2rem;
  color: #333;
 
}
@media screen and (max-width:767px) {
  .award_container{
    background-color: transparent;
    max-width: 100%;
    width:100%;
  } 
  
  .award_program{
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .program_list{
    max-width: 100%;
    width: 95%;
    text-align: center;
    margin-bottom: 1rem;
    height: fit-content;
  }
  .event_span{
    font-size: 1.4rem;
    line-height: 2rem;
  }
  .program_list img{
    max-width: 100%;
    width: 100%;
    height: 50%;
    border-radius: 1rem;
    transition: transform .4s ease-in-out;
  }
  .award_head_title{
    font-weight: 600;
    font-size: 2.25rem;
  }
  .award_head_detail{
    font-weight: 400;
    font-size: 1.5rem;
    line-height: 2rem;
    text-align: center;
  }
  .award_subtitle{
    font-size: 1.4rem !important;
    line-height: 1.8rem;
    text-align: center;
  }
  .award_program_details{
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 2rem;
    text-align: justify;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .award_container{
    background-color: transparent;
    max-width: 100%;
    width:100%;
  } 
  .award_program{
    display: flex;
    position: relative;
    align-items: center;
    flex-direction: column;
    text-align: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .program_list{
    max-width: 75%;
    width: 70%;
  }
  .event_span{
    font-size: 1.8rem;
    line-height: 2rem;
  }
  .award_head .award_head_title{
    font-weight: 600;
    font-size: 2rem;
    line-height: 2.5rem;
  }
 
  .award_head_detail{
    font-weight: 400;
    font-size: 1.5rem;
    line-height: 2.5rem;
    text-align: center;
  }
  .award_subtitle{
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 1.8rem;
    
  }
  .award_program_details{
    font-weight: 400;
    font-size: 1.4rem;
    line-height: 2rem;
  }
} 


/*------award gallery -----*/
.award_gallery {
  margin: 0 auto;
  text-align: center;
  width: 75%;
  max-width: 80%;
}

figure {
  border: 0.25rem solid #DADCDB;
  margin: 1rem 1rem;
  box-shadow: rgba(0, 174, 239, 0.25) 0px 13px 27px -5px,
    rgba(0, 174, 239, 0.3) 0px 8px 16px -8px;
  border-radius: 1rem;
  padding: 0;
}
/* ------------border animation start on image---- */
figure::after, figure::before {
  border-radius: 4px;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: scale(0);
  transition: all 0.5s ease-in-out 0s;
  width: 100%;
  z-index: 3;
}

figure::before {
  border-bottom: 0.25rem solid #f52c2c;
  border-left: 0.25rem solid #f52c2c;
  transform-origin: 0 100% 0;
}

figure::after {
  border-right: 0.25rem solid #f52c2c;
  border-top: 0.25rem solid #f52c2c;
  transform-origin: 100% 0 0;
}

figure:hover::after, figure:hover::before {
  transform: scale(1);
}
figure:hover {
  border: 0.25rem solid rgba(0, 160, 80, 0);
}
/* ------------border animation end---- */





figure.image {
  display: inline-block;
  position: relative;
  max-width: 25%;
  width: 25%;
  min-width: 25%;
}
figure.image:hover img{
  transform: scale(1);
}
figure img {
  display: block;
  height: auto;
  border-radius: 0.5rem 0.5rem 1rem 1rem;
  max-width: 100%;
  width: 100%;
  height: 15rem;
  transition: transform .4s ease-in-out;
}

figcaption {
  background: #1CABE2; 
  color: white;
  padding: .2em 0;
  position: absolute;
  font-size: 1.5rem;
  line-height: 3rem;
  bottom: 0;
  text-align: center;
  width: 100%;
  border-radius: 0 0 0.5rem 0.5rem;
}
@media screen and (max-width:767px) {
  .award_gallery {
    width: 90%;
    max-width: 95%;
  }
  figure.image {
    max-width: 45%;
    width: 40%;
    min-width: 38%;
  }
  figure img {
    max-width: 100%;
    width: 100%;
    height: 12rem;
  }
  figcaption {
    font-size: 1rem;
    line-height: 2.2rem;
  }
}
@media screen and (min-width:768px) and (max-width:1023px) {
  .award_gallery {
    width: 75%;
    max-width: 80%;
  }
  figure.image {
    max-width: 28%;
    width: 28%;
    min-width: 28%;
  }
  figure img {
    max-width: 100%;
    width: 100%;
    height: 12rem;
  }
  figcaption {
    font-size: 1.2rem;
    line-height: 2.4rem;
  }
}


/* -----------slider----------- */
.slider {
  margin: 0 auto;
  max-width: 640px;
}

.slide_viewer {
  height: 384px;
  overflow: hidden;
  position: relative;
}

.slide img{
	width: 100%;
	display: block;
    margin-left: auto;
    margin-right: auto;
}

.slide_group {
  height: 100%;
  position: relative;
  width: 100%;
}

.slide {
  display: none;
  height: 100%;
  position: absolute;
  width: 100%;
}

.slide:first-child {
  display: block;
}

/* .slide:nth-of-type(1) {
  background: #D7A151;
}

.slide:nth-of-type(2) {
  background: #F4E4CD;
}

.slide:nth-of-type(3) {
  background: #C75534;
}

.slide:nth-of-type(4) {
  background: #D1D1D4;
} */

.slide_buttons {
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
}

a.slide_btn {
  color: #474544;
  font-size: 42px;
  margin: 0 0.175em;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

/* .slide_btn.active, .slide_btn:hover {
  color: #428CC6;
  cursor: pointer;
} */

.directional_nav {
  height: 270px;
  margin: 0 auto;
  max-width: 820px;
  position: relative;
  top: -340px;
}

.previous_btn {
  bottom: 0;
  left: 100px;
  margin: auto;
  position: absolute;
  top: 0;
}

.next_btn {
  bottom: 0;
  margin: auto;
  position: absolute;
  right: 100px;
  top: 0;
}

.previous_btn, .next_btn {
  cursor: pointer;
  height: 65px;
  opacity: 0.5;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -ms-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
  width: 65px;
}

.previous_btn:hover, .next_btn:hover {
  opacity: 1;
}

@media only screen and (max-width: 767px) {
  .previous_btn {
    left: 10px;
  }
  .next_btn {
    right: 10px;
  }
  .directional_nav {
    height: 30px;
    margin: 0 auto;
    max-width: 830px;
    position: relative;
    top: -100px;
  }
  .slide_viewer {
    height: 270px;
  }
}
@media only screen and (min-width: 768px) and (max-width:1023px) {
  .previous_btn {
    left: 30px;
  }
  .next_btn {
    right: 30px;
  }
  .directional_nav {
    height: 30px;
    margin: 0 auto;
    max-width: 800px;
    position: relative;
    top: -160px;
  }
  .slide_viewer {
    height: 337px;
  }
}
/*-------award gallery end ----*/



/*--latest event start--*/
 .event_button{
  display: flex;
  flex-direction: row;
  align-items: center;

  justify-content: space-evenly !important;
}
@media screen and (max-width:991px) {
  .event_button{
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 40%;
  }
  .event_button button{
    font-size: 1.2rem;
    margin: 0.5rem auto;
  }
}
.event_button button{
  width: fit-content;
  color: #1CABE2;
  border: solid #1CABE2 1px ;
  background: white;
  font-family: var(--body-font);
  font-size: 1.5rem;
  border-radius: 2rem;
  padding:0.5rem 2rem;
  margin: 1rem auto;
}
.event_button button:hover{
  color: white;
  background-color: #1CABE2;
}



/*---event popup ----*/

.popup__dis {
  margin: 60px auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
  width: 60%;
  position: relative;
  transition: all 5s ease-in-out;
}

.popup__dis h2 {
  margin-top: 0;
  font-size: 2rem;
  text-align: center;
  color: #333;
  line-height: 1.8rem;
  font-family: var(--body-font);
}
.popup__dis .close {
  position: absolute;
  top: 15px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup__dis .close:hover {
  color: #06D85F;
}
.popup__dis .content {
  max-width: 100%;
  width:100%;
  display: flex;
  flex-direction: column;
  align-content: center;

  overflow: auto;
}
.popup__dis .content p{
  font-size: 1.5rem;
  line-height:1.75rem;
  font-weight: 400;
  text-align: justify;
  color: #333;
}
#popup_img img{
  width: 70%;
  display: flex;
  align-self: center;
  padding: 2rem 0rem;
  height: 40%;
}




.about__container_popup{
    background-color: rgba(207, 239, 252, 0.4);
    border-radius: 37px;
    padding: 2vh 0;
    margin: 1vh;
}
.about__container_popup h4{
  font-size: 2.5vw;
  margin-bottom: 1vh;
}
.about__box-wrap_popup {
  padding: 4vh;
}


@media screen and (max-width: 600px){
 
  .popup__dis{
    width: 95%;
    height: 85%;
    margin: 10px auto;
  }
  .popup__dis .content{
    width:100%;
  }
 
  
    .popup__dis .content ul li{
  font-size: 1.25rem !important;
  line-height: 2rem;
  margin: 0.5rem;
  color:#333;
    }
    .popup__dis .content .popup__button{
        margin-inline:6rem !important;
        width:50% !important;
    }
    @keyframes zoom-in-zoom-out {
        0% {
      transform: scale(0, 0);
    }
    50% {
      transform: scale(0, 0);
    }
    100% {
      transform: scale(0, 0);
    }
  }
}


/* event gallery start */
  .container_img_gallery{
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5rem 8%;
  }
  .img_gallery{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-gap:30px;
  }
  .img_gallery img{
    width: 100%;
    transition: all 0.3s ease;
  }
.img__gallery_div:hover img {
    transform: scale(1.05);
}
/*.img_gallery img:hover {
    transform: scale(1.1);
}*/
/* event gallery end */


.wrapper{
  max-width: 1100px;
}
.gallery{
  display: flex;
  flex-wrap: wrap;
}
.gallery .image{
  padding: 7px;
  
  width: calc(100% / 3);
}
.gallery .image span{
  display: flex;
  width: 100%;
  overflow: hidden;
}
.gallery .image img{
  width: 100%;
  vertical-align: middle;
  border-radius: 1rem;
  transition: all 0.3s ease;
}
.gallery .image:hover img{
  transform: scale(1.1);
  
}
.preview-box{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  background: #fff;
  max-width: 700px;
  width: 100%;
  z-index: 5;
  opacity: 0;
  pointer-events: none;
  border-radius: 3px;
  padding: 0 5px 5px 5px;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
}
.preview-box.show{
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%) scale(1);
  transition: all 0.3s ease;
}
.preview-box .details{
  display: flex;
  align-items: center;
  padding: 12px 15px 12px 10px;
  justify-content: space-between;
}
.preview-box .details .title{
  display: flex;
  font-size: 18px;
  font-weight: 400;
}
.details .title p{
  margin: 0 5px;
}
.details .title p.current-img{
  font-weight: 500;
}
.details .icon{
  color: #007bff;
  font-size: 20px;
  cursor: pointer;
}
.preview-box .image-box{
  display: flex;
  width: 100%;
  position: relative;
}
.image-box .slide{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-size: 30px;
  cursor: pointer;
  height: 80px;
  width: 60px;
  line-height: 50px;
  text-align: center;
  border-radius: 3px;
}
.slide.prev{
  left: 0px;
}
.slide.next{
  right: 0px;
}
.image-box img{
  width: 100%;
  border-radius: 0 0 3px 3px;
}
.shadow{
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 2;
  display: none;
  background: rgba(0,0,0,0.45);
}
@media(max-width: 1000px){
  .gallery .image{
    width: calc(100% / 2);
  }
}
@media(max-width: 600px){
  .gallery .image{
    width: 100%;
    padding: 4px;
  }
}

/*----ongoing event start-----*/
@media  (max-width:767px) {
  .container .event_details_tab{
    display: flex;
    flex-direction: column;
    font-family: var(--body-font);
    padding: 16px 0;
    max-width: 100%;
    width:100%;
    align-items: center;
    justify-content: space-evenly;
    
  }
  .container .event_details_tab .event_details{
    width:70%;
    max-width: 80%;
    height: 120px;
    border-radius: 2rem;
    color: grey;
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0.1rem;
    margin: 5px 5px;
  }
}
@media (min-width: 768px) and (max-width:1024px) {
  .container .event_details_tab{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: var(--body-font);
    width: 70%;
    align-items: center;
    justify-content: space-evenly;
    max-width: 80%;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .container .event_details_tab .event_details{
    width:40%;
    max-width: 50%;
    height: 120px;
    border-radius: 2rem;
    color: grey;
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0.1rem;
    margin: 5px 5px;
  }
}
@media screen and (min-width:1024px) {
  .event_details_tab{
    display: flex;
    flex-direction: row;
    font-family: var(--body-font);
    max-width: 1200px;
    width:1150px;
    align-items: center;
    justify-content: space-between;
    
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .event_details{
    width:22%;
    max-width: 30%;
    height: 120px;
    border-radius: 2rem;
    color: grey;
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0.1rem;
    margin: 5px 5px;
  }
  .event_schedule{
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    width: 100%;
    height: 100px;
    padding: 0.5rem 0.75rem;
    background-color: white;
    justify-content: space-between;
    text-align: start;
    border-radius: 0 0 10px 10px;
  }
    .on_event_head {
        font-size: 1.8rem;
        text-align: center;
        color: white;
        background-color: #00aeef;
        border-radius: 10px 10px 0 0;
    }
  .on_event_head span svg{
    height: 25px;
    width: 25px;
    
  }
  .schedule_logo{
    flex:1;
  }
  .schedule_logo svg{
    height: 25px;
    width: 25px;
  }
  .schedule_text{
    flex:4;
    font-size: 1.1rem;
    color:#000000;
    line-height: 2.3rem;
    font-weight: 500;
  }
}
.event_details_tab{
  display: flex;
  flex-direction: row;
  font-family: var(--body-font);
  max-width: 1200px;
  width:1150px;
  align-items: center;
  justify-content: space-between;
  
  margin-top: 10px;
  margin-bottom: 10px;
}
.event_details{
  width:22%;
  max-width: 30%;
  height: 120px;
  border-radius: 2rem;
  color: grey;
  display: flex;
  flex-direction: column;
  padding: 0.5rem 0.1rem;
  margin: 5px 5px;
}
.event_schedule{
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
  width: 100%;
  height: 100px;
  padding: 0.5rem 0.75rem;
  background-color: white;
  justify-content: space-between;
  text-align: start;
  border-radius: 0 0 10px 10px;
}
.on_event_head {
    font-size: 1.8rem;
    text-align: center;
    color: white;
    background-color: #00aeef;
    border-radius: 10px 10px 0 0;
}
.on_event_head span svg{
  height: 25px;
  width: 25px;
  
}
.schedule_logo{
  flex:1;
}
.schedule_logo svg{
  height: 25px;
  width: 25px;
}
.schedule_text {
    flex: 4;
    font-size: 1.2rem;
    color: #000000;
    line-height: 2.3rem;
    font-weight: 500;
}
/*----ongoing event end-----*/




/*--latest event end--*/








.award_img{
  width: 100%;
  height: auto;
}
.award_img img{
  width: 100%;
  padding:2vw 4vw;
  height: auto;
}
.award_blog_img{
  width: 100%;
  height: 80vh;
  overflow-y:scroll;
  border: solid white 1px;
  border-radius: 20px;
}
.award_blog_img img{
  width: 95%;
  height: 78vh;
  padding:2vw 5vw;
  
  
}
/*------award end -------*/





  .poster_banner_faq{
    position: relative;
    padding: 10vw 0 2vw;
    margin-bottom: 0px;
  }

  .poster_banner_section{
    position: relative;
    padding: 10vw 0 2vw;
    margin-bottom: 0px;
  }
  .poster_container{
    background-color: #1CABE2;
    max-width: 50%;
    width:40%;
    padding: 2rem 3rem 2rem;
    border-radius: 0px 0px 1rem 1rem;
    margin: 1rem 2rem auto;
    text-align: center;
    color: var(--white-color);
    font-size: 3.2rem;
    font-family: var(--body-font);
    font-weight: 700;
  }
  @media screen and (min-width:1024px) {
    .poster_container{
      background-color: #1CABE2;
      max-width: 50%;
      width:40%;
      padding: 2rem 3rem 2rem;
      border-radius: 0px 0px 1rem 1rem;
      margin: 1rem 2rem auto;
      text-align: center;
      color: var(--white-color);
      font-size: 3.2rem;
      font-family: var(--body-font);
      font-weight: 700;
    }
  }
  @media screen and (min-width:768px) and (max-width:1023px)  {
    .poster_container{
      background-color: #1CABE2;
      max-width: 50%;
      width:35%;
      padding: 1rem 2rem 1rem;
      border-radius: 0px 0px 1rem 1rem;
      margin: 1rem 2rem auto;
      text-align: center;
      color: var(--white-color);
      font-size: 2rem;
      font-family: var(--body-font);
      font-weight: 700;
    }
   
  }
  @media screen and (max-width:767px) {
    .poster_container{
      background-color: #1CABE2;
      max-width: 60%;
      width:50%;
      padding: 1rem 2rem 1rem;
      border-radius: 0px 0px 1rem 1rem;
      margin: 1rem 2rem auto;
      text-align: center;
      color: var(--white-color);
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 700;
    }
   .container_faq{
    margin-top: 35px;
    padding-top: 0;
    max-width: 540px;
    align-items: center;
   }
  }
  
  .poster_container_compliance{
    background-color: transparent;
    max-width: 1200px;
    width:1150px;
    border-radius: 37px;
    padding: 16px 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .poster_container_compliance h2{
    font-size: 2.25rem;
    font-family: var(--body-font);
    font-weight: 600;
    line-height: 4rem;
  }
  .poster_container_compliance p{
    font-size: 1.4rem;
    font-family: var(--body-font);
    font-weight: 400;
    width: 80%;
    color:#2E3542;
    line-height: 2.5rem;
  }
  @media screen and (min-width:1024px) {
    .poster_container_compliance{
      max-width: 1200px;
      width:1150px;
      background-color: transparent;
      max-width: 1200px;
      width:1150px;
      border-radius: 37px;
      padding: 16px 0;
    }
    .poster_container_compliance h2{
      font-size: 2rem;
      font-family: var(--body-font);
      font-weight: 600;
      line-height: 4rem;
    }
    .poster_container_compliance p{
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 400;
      color:#2E3542;
      line-height: 2.5rem;
    }
  }
  @media screen and (min-width:768px) and (max-width:1024px) {
    .poster_container_compliance{
      width: 90%;
    }
    .poster_container_compliance h2{
      font-size: 2.0rem;
      font-family: var(--body-font);
      font-weight: 600;
      line-height: 4rem;
    }
    .poster_container_compliance p{
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 400;
      color:#2E3542;
      line-height: 2.5rem;
    }
  }
  @media screen and (max-width:767px) {
    .poster_container_compliance{
      background-color: transparent;
      max-width: 100%;
      width:100%;
    }
    .poster_container_compliance h2{
      font-size: 1.5rem;
      font-family: var(--body-font);
      font-weight: 600;
      line-height: 4rem;
    }
    .poster_container_compliance p{
      font-size: 1.2rem;
      font-family: var(--body-font);
      font-weight: 400;
      color:#2E3542;
      line-height: 2rem;
      text-align: center;
    }
  }

.about-section {
  position: relative;
  padding: 50px 0;
  margin-bottom: 60px;
}
.complience_section{
  position: relative;
  padding: 50px 0;
  margin-bottom: 30px;
  margin-top: 0px;
}
.about__container {
  background-color: rgba(207, 239, 252, 0.4);
  border-radius: 37px;
  padding: 16px 0;
}
.about_complience_container{
  max-width: 1200px;
  width:1150px;
  border-radius: 37px;
  padding: 16px 0;
  display: flex;
  flex-direction: column;
  font-family: var(--body-font);
  color:#2E3542;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  background-color: var(--white-color);
}
.complience_main{
  display: flex;
  flex-direction: column;
  padding: 4rem 4rem;
}
.compliance_head{
  font-size: 2rem;
  font-weight: 600;
  line-height: 2rem;
  margin-bottom: 1rem;
}
.compliance_text{
  font-size: 1.4rem;
  font-weight: 400;
  margin-bottom: 1rem;
  line-height: 2rem;

}
@media srceen and  (min-width:1024px) {
  .compliance_head{
    font-size: 2rem;
    font-weight: 600;
    line-height: 2rem;
    margin-bottom: 1rem;
  }
  .compliance_text{
    font-size: 1.4rem;
    font-weight: 400;
    margin-bottom: 1rem;
    line-height: 2rem;
  }
  .about_complience_container{
    max-width: 1200px;
    width:1150px;
    border-radius: 37px;
    padding: 16px 0;
    display: flex;
    flex-direction: column;
    font-family: var(--body-font);
    color:#2E3542;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    background-color: var(--white-color);
    }
}
@media screen and (min-width:768px) and  (max-width:1024px) {
  .about_complience_container{
    max-width: 100% !important;
  }
  .compliance_head{
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.5rem;
    margin-bottom: 1rem;
  }
  .compliance_text{
    font-size: 1.2rem;
    font-weight: 400;
    margin-bottom: 1rem;
    line-height: 1.8rem;
  }
}
@media screen and (max-width:767px) {
  .about_complience_container{
    max-width: 100%;
    width:100%;
    border-radius: 37px;
    padding: 16px 10px;
  }
  .compliance_head{
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.5rem;
    margin-bottom: 0.8rem;
  }
  .compliance_text{
    font-size: 1.25rem;
    font-weight: 400;
    margin-bottom: 0.8rem;
    line-height: 1.8rem;
  }
  .complience_main{
    padding:2rem 2rem;
  }
}

/* blog start */

@media screen and (min-width:768px) and (max-width:1023px) {
  .about__container__blog{
    max-width: 90% !important;
    width:90% !important;
    background-color: rgba(235, 240, 250, 1);
  }
  .blog_container .heading_text #blog_h2{
    font-size: 2rem;
    color: #000000;
    line-height: 2.2rem;
  }
  .blog_container .heading_text #blog_h4{
    font-size: 1.8rem;
    color: #757575;
    line-height: 2.2rem;
  }
  .blog_container .heading_text #blog_p{
    font-size: 1.7rem;
    color: #757575;
    line-height: 2.2rem;
    margin-bottom: 1rem;
  }
  .blog_container .about_blog_dsc{
    display: flex;
    flex-direction: column;
  }
  .blog_container #event_heading{
    font-size: 2.5rem;
    color: #1CABE2;
    font-weight: 600;
    line-height: 2.2rem;
    padding:1rem 0rem;
  }
    .about_blog_dsc .blog_content {
     padding: 10px 0px 0px 0px !important;
    }
  .blog_container .about_blog_dsc .blog_content #blg_content{
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2.4rem;
  }
  .about_blog_dsc .recent_content{
    padding: 1rem 10rem !important;
  }
  .blog_container .about_blog_dsc .recent_content h4{
    font-size: 1.8rem;
  }
  .blog_container .about_blog_dsc .recent_content .related_content .related_img svg{
    width: 35px;
  }
  .blog_container .about_blog_dsc .recent_content .related_content .related_des{
    display: flex;
    justify-content: start;
    align-items: center;
  }
  .blog_container .about_blog_dsc .recent_content .related_content .related_des p{
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .related_img img{
    width:150px !important;
    height: 100px !important;
    border-radius: 1rem;
   }
   
}
@media screen and (max-width:767px) {
  .about__container__blog{
    max-width: 95% !important;
    padding-top: 0 !important;
    width:95% !important;
    background-color: rgba(235, 240, 250, 1);
  }
  .blog_container{
    padding: 1rem 1.5rem !important;
    font-family: var(--body-font);
  }
  .blog_container .heading_text #blog_h2{
    font-size: 1.8rem;
    color: #000000;
    line-height: 2rem;
  }
  .blog_container .heading_text #blog_h4{
    font-size: 1.6rem;
    color: #757575;
    line-height: 2rem;
  }
  .blog_container .heading_text #blog_p{
    font-size: 1.5rem;
    color: #757575;
    line-height: 2rem;
    margin-bottom: 1rem;
  }
  .blog_container .about_blog_dsc{
    display: flex;
    flex-direction: column;
  }
  .blog_container #event_heading{
    font-size: 1.5rem;
    color: #1CABE2;
    font-weight: 600;
    line-height: 2rem;
    padding: 1rem 0rem;
  }
  .blog_container .about_blog_dsc .blog_content #blg_content{
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.8rem;
  }
    .about_blog_dsc .blog_content {
        padding: 10px 0px 0px 0px !important;
    }
  .blog_container .about_blog_dsc .recent_content h4{
    font-size: 1.5rem;
  }
  .about_blog_dsc .recent_content{
    padding: 1rem 4rem !important;
  }
  .blog_container .about_blog_dsc .recent_content .related_content .related_img svg{
    width: 30px;
  }
  .blog_container .about_blog_dsc .recent_content .related_content .related_des{
    display: flex;
    justify-content: start;
    align-items: center;
  }
  .blog_container .about_blog_dsc .recent_content .related_content .related_des p{
    font-size: 1.4rem;
    line-height: 2rem;
  }
  .related_img{
    flex: 2;
    padding:5px;
  }
   .related_img img{
    width:120px !important;
    height: 80px !important;
    border-radius: 1rem;
   }
   
}
#event_heading{
  font-size: 3.2rem;
  color: #1CABE2;
  font-weight: 600;
  line-height: 3rem;
  padding:1rem 0;
}
.about__container__blog{
  border-radius: 37px;
  padding: 16px 0;
  max-width: 1200px;
  width:1150px;
  background-color: rgba(235, 240, 250, 1);
}
.blog_container{
  padding: 10px 40px;
  font-family: var(--body-font);
}
.blog_container .heading_text h1{
  font-size: 2.25rem;
  color: #000000;
  line-height: 3rem;
}
.blog_container .heading_text h4{
  font-size: 2rem;
  color: #333;
  line-height: 3rem;
}
.blog_container .heading_text p{
  font-size: 1.5rem;
  color: #333;
  line-height: 2.8rem;
  margin-bottom: 1rem;
}
.blog_wall_img{
  width: 100%;
}
.blog_wall_img img{
  border-radius: 3rem;
}
.about_blog_dsc{
  display: flex;
  flex-direction: row;
}
.about_blog_dsc .blog_content{
  flex:4;
  padding:10px 30px 0px 0px;
  display: flex;
  flex-direction: column;
}

.about_blog_dsc .blog_content p{
  font-size: 1.4rem;
  line-height: 2.5rem;
  font-weight: 400;
  color: #333;
  text-align: justify;
}
.about_blog_dsc .recent_content{
  flex:2;
  display: flex;
  align-content: center;
  flex-direction: column;
  padding:10px 0;

}
.about_blog_dsc .recent_content .blog__heading{
  color: var(--black-color);
  font-size: 1.8rem;
  line-height: 2rem;
}

.related_content{
  display: flex;
  flex-direction: row;
}
.related_img{
  flex: 2;
  padding:5px;
}
 .related_img img{
  width:75px;
  height: 75px;
  border-radius: 1rem;
 }
.related_des{
  flex: 4;
  padding:5px;
  
}
.recent_content .related_content .related_des p{
  font-size: 1.4rem;
  color:#333;
}
.blog_content_footer{
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  justify-content: space-around;
}
.blog_content_footer_event{
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  justify-content: space-around;
  border-bottom: solid 0.1rem lightgray;
  border-top: solid 0.1rem lightgray;
  border-width: 80%;
  margin: 1rem 1rem auto;
}
.blog_content_footer_event .love_react span{
  font-size: 1.5rem;
}
.blog_content_footer_event .love_react svg{
  width: 2rem;
  max-width: 2rem;
  height: 2rem;
}
.blog_main_footer_img{
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  width: 100%;
}
.blog_main_footer_img a{
  margin-top: 10px;
}

.blog_footer_img{
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  width: 100%;
}
.blog_footer_img a{
  margin-top: 10px;
}
.blog_content_footer .love_react span{
  font-size: 1.5rem;
}
.blog_content_footer .love_react svg{
  width: 2rem;
  max-width: 2rem;
  height: 2rem;
}
.about_blog_dsc .recent_content h4{
  font-size: 1.4vw;
  margin-bottom: 0;
  line-height: 3.5vh;
}
.about_blog_dsc .recent_content p{
  font-size: 1vw;
  margin-bottom: 0;
  line-height: 3.5vh;
}
@media (max-width:600px) {
  .blog_footer_img{
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    width: 100%;
    margin: 5px;
  }
  .blog_footer_img img{
    width: 100%;
  }
}
@media (max-width:600px) {
  .blog_main_footer_img{
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    width: 100%;
    margin: 5px;
  }
  .blog_main_footer_img img{
    width: 100%;
  }
  .ongoing_stiker{
    font-size: 1.4rem !important;
    padding: 0rem 0.2rem !important;
    
  }
}
@media screen and (max-width: 450px) {
    .related_img img {
        width: 80px !important;
        height: 80px !important;
        border-radius: 1rem;
    }
}

/* ------ongoing event start -------- */
.ongoing_stiker {
    font-size: 2rem;
    position: relative;
    border-radius:1.1rem;
    top: -2%;
    background-color: #00aeef;
    width: fit-content;
    line-height: 2.5rem;
    padding: 0.5rem 1rem;
    color: var(--white-color);
    font-weight: 600;
}
.img_span_date{
  position:relative;
  top:-30%;
  font-size: 1rem;
  text-align: start;
  display: flex;
  align-items: center;
  line-height: 2rem;
  background-color: #6ABE52;
  height: 10%;
  padding: 0.5rem 1rem;
  color: var(--white-color);
  font-weight: 400;
}
.img_span_details{
  position:relative;
  top:-30%;
  background-color: rgba(0, 0, 0, 0.8);
  padding: 0.5rem 1rem;
  border-radius: 0 0 2rem 2rem;
}
.event_name_span{
  font-size: 1.6rem;
  text-align: start;
  color:white;
  text-align: start;
  display: flex;
  align-items: center;
  line-height: 1.5rem;
}
.event_para_span{
  font-size: 1.6rem;
  text-align: start;
  color:#6ABE52;
  text-align: start;
  display: flex;
  align-items: center;
  line-height: 1.5rem;
}

.carousel-container {
  border-radius: 30px;
  overflow: hidden;
  max-width: 1070px;
  position: relative;
  box-shadow: 0 0 30px -20px #223344;
  margin: auto;
  z-index: 0;
}

/* Hide the images by default */
.mySlides {
  display: none;
}
.mySlides img {
  display: block;
  width: 100%;
}




/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  width: auto;
  padding: 20px;
  color: white;
  font-weight: bold;
  font-size: 24px;
  border-radius: 0 8px 8px 0;
  background: rgba(173, 216, 230, 0.1);
  user-select: none;
}
.next {
  right: 0;
  border-radius: 8px 0 0 8px;
}
.prev:hover,
.next:hover {
  background-color: rgba(173, 216, 230, 0.3);
}

/* Caption text */
.text {
  color: #f2f2f2;
  background-color: rgba(10, 10, 20, 0.1);
  backdrop-filter: blur(6px);
  border-radius: 10px;
  font-size: 20px;
  padding: 8px 12px;
  position: absolute;
  bottom: 60px;
  left: 50%;
  transform: translate(-50%);
  text-align: center;
}

/* Number text (1/3 etc) */
.number {
  color: #f2f2f2;
  font-size: 16px;
  background-color: rgba(173, 216, 230, 0.15);
  backdrop-filter: blur(6px);
  border-radius: 10px;
  padding: 8px 12px;
  position: absolute;
  top: 10px;
  left: 10px;
}
.dots-container {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translate(-50%);
}

/* The dots/bullets/indicators */
.dots {
  cursor: pointer;
  height: 14px;
  width: 14px;
  margin: 0 4px;
  background-color: rgba(173, 216, 230, 0.2);
  backdrop-filter: blur(2px);
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.3s ease;
}


/* transition animation */
.animate {
  -webkit-animation-name: animate;
  -webkit-animation-duration: 1s;
  animation-name: animate;
  animation-duration: 2s;
}

@keyframes animate {
  from {
    transform: scale(1.1) rotateY(10deg);
  }
  to {
    transform: scale(1) rotateY(0deg);
  }
}
/* ------ongoing event end -------- */





.about__box-wrap {
  padding: 40px;
}




.about__card {
  box-shadow: rgba(0, 174, 239, 0.25) 0px 13px 27px -5px,
    rgba(0, 174, 239, 0.3) 0px 8px 16px -8px;
  padding: 40px 40px 60px;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 27px;
}


.about__logo-slider {
  list-style: none;
  padding: 0;
  margin: 0;
  margin-bottom: 20px;
}

.about__logo-slider .slick-slide {
  margin: 0 10px;
}

.about__logo-slider .slick-slide img {
  margin: 0 auto;
}

.about__brand-slider {
  padding: 20px;
  margin: 0;
  background-color: #ffffff;
  border-radius: 12px;
}

.about__brand-slider .slick-slide img {
  margin: 0 auto;
}
.about__brand-slider .slick-slide {
  margin: 0 10px;
}
@media (max-width: 991px) {
  .about-section {
    padding: 0;
    margin-bottom: 40px;
}
  .about__container {
    padding: 24px 15px 30px;
  }
  .about__box-wrap {
    padding: 10px;
    text-align: center;
  }

  .about_logo img {
    max-width: 150px;
  }

 
}
@media (max-width: 767px) {
  .about__brand-slider {
    padding: 10px;
  }
  .aboutus__description{
    margin-bottom: 0.5rem;
    text-align: justify;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.2rem;
    letter-spacing: 0em;
  }
  .about__container {
    margin: 15px;
    padding: 24px 10px 30px;
  }
  .about__logo-slider {
    margin-bottom: 24px;
  }
  .about__box-wrap {
    padding: 10px;
    text-align: center;
  }

  .about_logo img {
    max-width: 100px;
  }

  .about__card {
    padding: 15px;
  }
  .about__card .mb-60 {
    margin-bottom: 20px;
  }
}

.section__header {
  font-size: 70px;
  line-height: 78px;
  margin-bottom: 30px;
}
@media (max-width: 991px) {
  .section__header{
      font-size: 30px;
      font-weight: 500;
      line-height: 40px;
      letter-spacing: 0em;
  }

}


/*---FAQ start---*/
.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: all 2.5s ease;
}
.reveal.active{
  transform: translateY(0px);
  opacity: 1;
}
.container_faq{
  display: flex;
  justify-content: center;
  align-items: center;
}
.faq_container_compliance{
  background-color: transparent;
  padding: 16px 0;
  max-width: 1200px;
    width:1150px;
  position: relative;
  margin: 2rem 2rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  color: var(--white-color);
  font-size: 1rem;
  font-family: var(--body-font);
  font-weight: 600;
}
.faq_container_compliance h1{
  font-size: 2.25rem;
  font-weight: 700;
}
.project_view_buttons{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.project_view{
  width: 25%;
  padding: 2rem 2rem;
  border-radius: 3rem;
  margin: 2.2rem 1.8rem auto;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  transition:0.5s ease-in-out;
}
.project_view:hover{
    transform:translateY(-5px);
}
    .project_view img {
        max-width: 100px;
        max-height: 100px;
        height: 100px;
        width: 100px;
    }
.project_view h2{
  font-size: 1.6rem;
  font-weight: 500;
}
.project_view:hover{
  border: solid 1px red;
 box-shadow:  rgba(0, 174, 239, 0.6) 0px 8px 19px;
}

@media screen and (min-width:1024px) {
  .container_faq{
    display: flex;
    justify-content: center;
  }
  .faq_container_compliance{
    background-color: transparent;
    max-width: 75%;
    width:65%;
    position: relative;
    padding: 1rem 2rem auto;
    margin: 2rem 2rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    color: var(--white-color);
    font-size: 1rem;
    font-family: var(--body-font);
    font-weight: 600;
  }
  .faq_container_compliance h1{
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 2rem;
  }
  .project_view_buttons{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
  .project_view{
    width: 25%;
    padding: 2rem 2rem;
    border-radius: 2rem;
    margin: 2.2rem 1.8rem auto;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  }
    .project_view img {
        max-width: 100px;
        max-height: 100px;
        height: 100px;
        width: 100px;
    }
  .project_view h2{
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
  }
  .project_view:hover{
    border: solid 1px red;
   box-shadow:  rgba(0, 174, 239, 0.6) 0px 8px 19px;
  }
}
@media screen and (min-width:768px) and (max-width:1023px){
  .faq_container_compliance{
    background-color: transparent;
    max-width: 75%;
    width:70%;
  }
   .project_view h2{
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
  }
  .project_view{
    width: 25%;
    padding: 1rem 1rem;
    border-radius: 2rem;
    margin: 1rem 1rem auto;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  }
}
@media screen and (min-width:350px) and (max-width:767px){
  .faq_container_compliance{
    background-color: transparent;
    max-width: 95%;
    width:90%;
  }
  .project_view_buttons{
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  .project_view{
    width: 25%;
    padding: 0.5rem 0.5rem;
    border-radius: 1.5rem;
    margin: 1rem 1rem auto;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  }
    .project_view img {
        max-width: 50px;
        max-height: 50px;
        height: 50px;
        width: 50px;
    }
  .project_view h2{
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 2rem;
  }
}


.container_faq_item {
  margin: 0 auto;
  padding: 1rem;
  width: 100%;
  border: solid 2px #000000;
  border-radius: 20px;
}

.accordion .accordion-item {
  border-bottom: 1px solid #e5e5e5;
  padding: 2px 30px;
}

.accordion .accordion-item button[aria-expanded='true'] {
  border-bottom: 1px solid #03b5d2;
}

.accordion button {
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  padding: 1em 0;
  color: #7288a2;
  font-size: 1.15rem;
  font-weight: 400;
  border: none;
  background: none;
  outline: none;
}

.accordion button:hover,
.accordion button:focus {
  cursor: pointer;
  color: #03b5d2;
}

.accordion button:hover::after,
.accordion button:focus::after {
  cursor: pointer;
  color: #03b5d2;
  border: 1px solid #03b5d2;
}

.accordion button .accordion-title {
  padding: 1em 1.5em 1em 0;
  font-size: 1.35rem;
  line-height: 1.8rem;
  color:#333;
}

.accordion button .icon {
  display: inline-block;
  position: absolute;
  top: 18px;
  right: 0;
  width: 22px;
  height: 22px;
  border: 1px solid;
  border-radius: 22px;
}

.accordion button .icon::before {
  display: block;
  position: absolute;
  content: '';
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background: currentColor;
}
.accordion button .icon::after {
  display: block;
  position: absolute;
  content: '';
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background: currentColor;
}

.accordion button[aria-expanded='true'] {
  color: #03b5d2;
}
.accordion button[aria-expanded='true'] .icon::after {
  width: 0;
}
.accordion button[aria-expanded='true'] + .accordion-content {
  opacity: 1;
  max-height: 9em;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content p {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.8rem;
  color: #000000;
  margin: 2em 0;
  text-align:start;
}










/*---FAQ end---*/

/*__________hero-image-header start _________*/
/*-------- faq hero img -------*/
.hero-image-header-faq {
  /*  This creates an image overlay  */
   background: url("../../assets/faq-hero.jpg"); 
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 60vh;  
  position: relative;
}
@media screen and (max-width:991px) {
  .hero-image-header-faq {height: 50vh;}
}
.hero-image-header-compliance {
  /*  This creates an image overlay  */
  background:url("../../assets/Compliance.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 60vh;  
  position: relative;
}
@media screen and (max-width:991px) {
  .hero-image-header-compliance {height: 50vh;}
}
.hero-image-header-csr {
  /*  This creates an image overlay  */
  background:url("../../assets/DoSomethingGreat.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 60vh;  
  position: relative;
}
@media screen and (max-width:991px) {
  .hero-image-header-csr {height: 50vh;}
}
.hero-image-header-event {
  /*  This creates an image overlay  */
  background:url("../../assets/DoSomethingGreat.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 60vh;  
  position: relative;
}
@media screen and (max-width:991px) {
  .hero-image-header-event {height: 50vh;}
}
.hero-image-header-award {
    /*  This creates an image overlay  */
    background: url("../../assets/monthly_meeting.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* to ensure the image takes up the entire viewport */
    height: 60vh;
    position: relative;
}
@media screen and (max-width:991px) {
  .hero-image-header-award {height: 50vh;}
}


/*-------- faq hero img -------*/


.hero-image-header {
  /*  This creates an image overlay  */
  background: url("https://i.postimg.cc/GhmvMRWG/header.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 60vh;  
  position: relative;
  margin-bottom: 1rem;
}
@media screen and (max-width:991px) {
  .hero-image-header {height: 50vh;}
}
/* centers the content on the viewport */
.hero-text-header {
  text-align: center;
  position: absolute;
  top: 52.5%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Lato', sans-serif;
  font-weight: 400;
  color: #fff;
  /*  words remain as is without breaking up  */
  white-space: nowrap;
  
  /*  This creates a text shadow around the the text within the hero-text div  */
  text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.4),
               0px 8px 13px rgba(0, 0, 0, 0.1),
               0px 16px 23px rgba(0, 0, 0, 0.1);
  
}

.hero-text-header h1 {
  font-size: 4.3em;
  font-weight: 300;
  
}

.hero-text-header p {
  font-size: 1em;
  text-transform: uppercase;
  letter-spacing: 5px;
  font-weight: 700;
}

.btn-default,
.btn-default:visited {
  margin-top: 50px;
  padding: 13px 25px;
  border-radius: 5px;
  border: none;
  font-size: .9em;
  font-weight: 700;
  text-transform: uppercase;
  background-color: #FFC312;
  transition: background-color 0.1s;
}

.btn-default:hover,
.btn-default:active {
  background-color: #896600;
}

/*__________hero-image-header end  _________*/


/*________CSR start _______*/

.csr_section{
  position: relative;
  padding: 50px 0;
  margin-bottom: 30px;
  margin-top: 50px;
}

.about_csr_container{
  border-radius: 37px;
  padding: 16px 0; 
  max-width: 80%;
  width: 70%;
  margin: 5rem 2rem 2rem 2rem;
  font-family: var(--body-font);
  color:#2E3542;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  background-color: #F5F6EE;
}
.csr_activity{
  width: 100%;
  margin-bottom: 1rem;
}
.csr__main{
  display: flex;
  flex-direction: row;
  align-items: center;
  font-family: var(--body-font);
  align-content: center;
  padding: 2rem 2rem 0;
  text-align: center;
  
}
.btn_event_ct{
  width: fit-content;
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  background-color: var(--white-color);
  color: var(--secondary-color);
  border: solid var(--secondary-color) 0.1rem ;
  transition: all 0.3s ease;
}
.btn_event_ct:hover{
  background-color: var(--secondary-color);
  color: var(--white-color);
  
}
.csr_img{
  align-self: center;
  width: 100%;
  height: 100%;
}
.csr_img img{
  max-width: 100%;
  width: 90%;
  
  border-radius: 2rem;
}
.csr_head{
  font-size: 2rem;
  line-height: 3rem;
  font-weight: 600;
}
.csr_subtitle{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
}
.csr_description{
  font-size: 1.4rem;
  line-height: 2rem;
  text-align: justify;
  color:#333;
  font-weight: 400;
}
@media screen and (max-width:767px) {
  .branch__container .csr__main{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: var(--body-font);
    align-content: center;
    padding: 1rem 1rem 1rem;
    text-align: center;
  }
  .csr_img img{
    max-width: 100%;
    width: 100%;
    height: 25rem;
  }
  .csr_head{
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 600;
  }
  .csr_description{
    font-size: 1.25rem;
    line-height: 2rem;
    text-align: justify;
    font-weight: 400;
  }
  .award_head_title{
    font-weight: 600;
    font-size: 2rem;
    text-align: center;
    line-height: 3rem;
  }
  .btn_event_ct span{
    font-size:1.2rem ;
  }
}
@media screen and (min-width:768px) and (max-width:1023px) {
  .branch__container .csr__main{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: var(--body-font);
    align-content: center;
    padding: 2rem 2rem 2rem;
    text-align: center;
  }
  .csr_head{
    font-size: 1.8rem;
    line-height: 3rem;
    font-weight: 600;
  }
  .csr_description{
    font-size: 1.4rem;
    line-height: 2rem;
    text-align: justify;
    font-weight: 400;
  }
  .award_head_title{
    font-weight: 600;
    font-size: 2.5rem;
    text-align: center;
  }
  .btn_event_ct span{
    font-size:1.4rem ;
  }
}







/*________csr activity start ________*/

.poster_container_csr{
  background-color: transparent;
  border-radius: 37px;
  padding: 16px 0;
  max-width: 1200px;
  width:1150px;
  text-align: initial;
  align-items: center;
  display: flex;
  flex-direction: column;
  color: var(--white-color);
  font-family: var(--body-font);
}
.poster_container_csr h2{
  text-align: center;
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 3.5rem;
}
.poster_container_csr p{
  text-align: center;
  font-size: 1.8rem;
  color: var(--black-color);
  line-height: 3rem;
}
.csr_activities_data{
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  row-gap: 1.5rem;
}
.csr_activity_img{
  width: 270px;
}
.csr_activity_sec{
  width:100%;
  height: 60%;
  background-color: red;
  background-image: url(/assets/csr-activity.png);
}
@media screen and (max-width:600px) {
  .read_more_button{
    width:45% !important;
  }
}
.read_more_button:hover {
  background-color: var(--secondary-color);
  color:  #fff;
}
.read_more_button{
 
  font-size: 1.4rem;
  border-radius: 4rem ;
  font-weight: 500;
  padding: 0.5rem 0.8rem;
  cursor: pointer;
  background-color: #fff;
  color: var(--secondary-color);
  border: solid 0.1rem var(--secondary-color);
  transition: var(--transition);
}
.activity_button{
  position: absolute;
  display: inline-block;
  width: 50%;
  top:0rem;
  left: 7rem;
  font-size: 1.5rem;
  padding: 0.2rem 0.5rem;
  border-radius: 1.25rem ;
  background-color: #03b5d2;
}


.activity_button_career:hover {
  background-color: var(--secondary-color);
  color:  #fff;
}
.activity_button_career{
  
  font-size: 1.5rem;
  border-radius: 4rem ;
  font-weight: 500;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  background-color: #fff;
  color: var(--secondary-color);
  border: solid 0.1rem var(--secondary-color);
  transition: var(--transition);
}

.executive_apply_btn:hover {
  background-color: var(--primary-hover-color);
  color:  #fff;
}
.executive_apply_btn{
  width: 100%;
  height: 20%;
  font-size: 1.5rem;
  padding: 0.1rem 0.5rem;
  font-weight: 500;
  border-radius: 4rem ;
  cursor: pointer;
  background-color: #fff;
  color: var(--secondary-color);
 
  transition: var(--transition);
}
.executive_apply_btn_plus:hover {
  background-color: var(--primary-hover-color);
  color:  #fff;
}
.executive_apply_btn_plus{
  width: 100%;
  height: 100%;
  font-size: 1.5rem;
  padding: 0.1rem 0.5rem;
  font-weight: 500;
  border-radius: 4rem ;
  cursor: pointer;
  background-color: #fff;
  color: var(--secondary-color);
  
  transition: var(--transition);
}
.apply_btn:hover {
  background-color: var(--primary-hover-color);
  color:  #fff;
}
.apply_btn{
  width: 30%;
  height: 100%;
  font-size: 1.5rem;
  font-weight: 500;
  padding: 0.1rem 0.5rem;
  border-radius: 4rem ;
  cursor: pointer;
  background-color: #fff;
  color: var(--secondary-color);
  
  transition: var(--transition);
}
@media screen and (max-width:767px) {
  .apply_btn{
    width: 42%;
    font-size: 1.15rem;
  }
  .executive_apply_btn{
    font-size: 1rem;
  }
}
@media screen and (min-width:768px) and (max-width:1023px) {
  .apply_btn{
    width: fit-content;
    font-size: 1.25rem;
  }
  .executive_apply_btn{
    font-size: 1.25rem;
  }
}
@media screen and (min-width:1024px) {
  .apply_btn{
    width: fit-content;
    font-size: 1.3rem;
  }
  .executive_apply_btn{
    font-size: 1.3rem;
  }
}

@media screen and (min-width:550px) and (max-width:991px) {
  .poster_container_csr{
    width: 90%;
  }
  .csr_container {
    max-width: 540px !important;
    margin: 0 auto;
  }
  .gallery-item {
    width: 210px !important;
    height: 150px !important;
    margin: 10px;
    text-decoration: none;
  }
  .gallery-item img{
    width:210px !important;
    height: 150px !important;
  }
  .text-wrapper {
    position: relative;
    width: 210px !important;
    height: 150px !important;
    background: rgba(0, 0, 0, 0.6);
  opacity: 1;
  }
  .activity_button{
    width: 60%;
    left:4rem;
  }
  .csr_gallery_event{
    width:100% !important;
  }
  .text-wrapper-event{
    background: rgba(0, 0, 0, 0.4);
    opacity: 1 !important;
  }
}
@media screen and (max-width:550px) {
  .poster_container_csr{
    width: 95%;
  }
    .text-wrapper {
        background: rgba(0, 0, 0, 0.4);
        height: 152px !important;
    }
  .text-wrapper-event{
    background: rgba(0, 0, 0, 0.4);
    opacity: 1 !important;
  }
    .gallery-item {
        width: 270px;
        height: 150px;
    }
}
.csr_container {
  max-width: 1125px;
  margin: 0 auto;
}
.csr_gallery_event{
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  width: 100%;
}
.csr_gallery {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.gallery-item-event{
  width: 100px;
  height: 100px;
  margin: 10px 5px auto;
  text-decoration: none;
}
.gallery-item {
  width: 280px;
  height: 200px;
  margin: 10px;
  text-decoration: none;
}
.gallery-item-event img {
  position: absolute;
  width:100px;
  height: 100px;
  border-radius:1rem;
}
.gallery-item img {
  position: absolute;
  width:270px;
  height: auto;
  border-radius: 1rem;
}
.text-wrapper-event{
  position: relative;
  width: 100px;
  height: 100px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  color: #fff;
  opacity: 0;
  border-radius:1rem;
  padding:0.5rem;
}
.text-wrapper {
  position: relative;
  width: 270px;
  height: 152px;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  color: #fff;
  opacity: 0;
  padding:0.5rem;
}
.text-wrapper-event .activity_button_event{
  font-size: 1.25rem;
  font-weight: 400;
}
.text-wrapper-event:hover {
  transition: all 0.8s ease;
  background: rgba(0, 0, 0, 0.6);
  opacity: 1;
}
.text-wrapper:hover {
  transition: all 0.8s ease;
  background: rgba(0, 0, 0, 0.6);
  opacity: 1;
}

.csr_name {
  font-size: 1.2rem;
  line-height: 2rem;
}
.csr_title{
  font-size: 0.60em;
  line-height: 1.5rem;

}


/* Because there is no hover on a touch devide, we need to move the text to the bottom of the image and display it by default */

@media only screen and (max-width: 1024px) {
  .text-wrapper {
    opacity: 1;
    justify-content: flex-center;
    text-shadow: 1px 1px 1px #000;
  }
  .title {
    margin-bottom: 1em;
  }
}



/*________csr activity end ________*/


/*________CSR end _______*/










/*---------------------------------
       rev_slider start 
  ---------------------------------*/

.rev_slider .slick-slider {
  margin-left: -12%;
  margin-right: -12%;
}

.rev_slider .slick-list {
  padding-top: 0% !important;
  padding-bottom: 10% !important;
  padding-left: 0% !important;
  padding-right: 15% !important;
}

.rev_slider .slick-dots {
  text-align: right;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.rev_slider .slick-track {
  max-width: 100% !important;
  transform: translate3d(0, 0, 0) !important;
  perspective: 100px;
}

.rev_slider .slick-slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  width: 100% !important;
  transform: translate3d(0, 0, 0);
  transition: transform 1s, opacity 1s;
}

.rev_slider .slick-snext,
.rev_slider .slick-sprev {
  display: block;
}

.rev_slider .slick-current {
  z-index: 4;
  opacity: 1;
  position: relative;
  display: block;
  transform: translate3d(3%, 21%, 0px);
}
.rev_slider .slick-sprev {
  z-index: 3;
  opacity: 1;
  transform: translate3d(13%, 7%, 0px);
}

.rev_slider .slick-pprev {
  z-index: 2;
  opacity: 1;
  transform: translate3d(17%, 1%, 0px);
}

.rev_slider .slick-snext {
  z-index: 3;
  opacity: 1;
  transform: translate3d(8%, 14%, 0px);
}

.rev_slider img {
  border-radius: 30px;
  padding: 28px;
  border-radius: 68px;
  transition: transform 0.5s ease-in-out;
  transform-origin: 100% 0;
}

.rev_slider .slick-slide {
  transition: transform 0.5s ease-in-out;
  transform-origin: 100% 0;
}
.rev_slider .slick-current.slick-slide:hover {
  transform: scale(1.2) translate(16%);
  transition: transform 0.5s, opacity 1s;
}







/* ---------about sectors start--------- */

.card {
  display: flex;
  position: relative;
/*   transform: translateY(100%);
  opacity: 0; */
/*   transition: transform .3s .5s, opacity .3s .5s; */
}

.card .card__text {
  transform: translateY(100%);
  opacity: 0;
  transition: transform .3s .5s, opacity .3s .5s;
}

.card .card__image {
  transform: translateY(100%);
  opacity: 0;
  transition: transform .3s .5s, opacity .3s .5s;
}

.swiper-slide-active .card {
  opacity: 1;
  transform: translateY(0);
/*   transition: transform .3s, opacity .3s; */
}

.swiper-slide-active .card .card__text {
  opacity: 1;
  transform: translateY(0);
  transition: transform 1s .5s, opacity 1s .5s;
}

.swiper-slide-active .card .card__image {
  opacity: 1;
  transform: translateY(0);
  transition: transform 1s .2s, opacity 1s .2s;
}

.card__text {
  width: 50%;
}

.card__image {
  width: 50%;
}
















/* ---------about sectors end--------- */
@media screen and (min-width:768px) and (max-width:1023px) {
 .branch-section  .branch__container{
    width: 90%;
  }
  .project-overview-blog{
    display: flex;
    flex-direction: column;
  }
  .project__wrap .about__blog__title{
    font-size: 2rem;
    line-height: 4rem;
    text-align: center;
  }
  .project__wrap .about__blog__title span{
    font-size: 2.5rem;
    font-family: var(--plus-jakarta-font);
    font-weight: 500;
  }
  .project__decription{
    font-size: 1.5rem !important;
    line-height: 2.5rem;
  }
  .project_navigation__slider #swiper-pagination{
    top: 85%;
  }
}
@media screen and (max-width:767px) {
  .project-overview__container-blog{
    width: 90%;
  }
  .project-overview-blog{
    display: flex;
    flex-direction: column;
  }
  .project__wrap .about__blog__title{
    font-size: 1.6rem;
    font-weight: 800 !important; 
    line-height: 3rem !important;
    text-align: center;
  }
  .project__wrap .about__blog__title span{
    font-size: 1.8rem; 
    font-family: var(--plus-jakarta-font);
    font-weight: 600 !important;
  }
  .project_navigation__slider #swiper-pagination{
    top: 50%;
  }
}
@media (max-width:600px) {
  .project_navigation__slider #swiper-pagination{
    top: 60%;
  }
  .project__wrap .about__blog__title span{
    font-size: 1.6rem; 
    font-family: var(--plus-jakarta-font);
    font-weight: 600 !important;
  }
}

.project-overview-blog{
  max-width: 85%;
  width:80%;
  height: fit-content;
  position: relative;
  margin: 30px 30px;
}
.project-overview__container-blog{
  background-color: rgba(207, 239, 252, 0.4);
  width: 90%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 30px 30px 30px;
  border-radius: 40px;
}
.about__blog__title{
  font-size: 2rem;
  line-height: 4rem;
  font-weight: 800;
  font-family: var(--plus-jakarta-font);
}
.about__blog__title span{
  font-size: 2.5rem;
  font-family: var(--plus-jakarta-font);
  font-weight: 600;
}
.project__decription{
  font-size: 1.4rem;
  line-height: 2.5rem;
  text-align: justify;
  color: #333;
  font-family: var(--body-font);

}
.img-wrap-blog img{
  width: 100%;
  border: solid var(--white-color) 0.5rem;
  border-radius: 1.5rem;
}






.project-overview {
  position: relative;
  margin-bottom: 60px;
}

.project-overview__container {
  padding: 50px 70px 60px;
  background-color: rgba(235, 240, 250, 1);
  border-radius: 40px;
}

.project__info-links {
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
  list-style: none;
  gap: 24px;
}



.project__info__links {
  display: flex;
  align-items: center;
  padding: 0;
  justify-content: space-evenly;
  margin: 0;
  list-style: none;
  gap: 24px;
}

.project__info__links .hov__button img {
  max-width: 50px;
  border: var(--secondary-color);
  border-width: 2px;
  border-radius: 20px;
}
.rev_slider .slick-track {
  height: 550px;
}
@media (max-width: 991px) {
  .project-overview {
    margin-bottom: 40px;
}
  .project-overview__container {
    padding: 30px 15px 30px;
}

.rev_slider img {
  padding: 15px;
  border-radius: 30px;
}

.rev_slider .slick-track {
  height: auto;
}
.rev_slider {
  margin-bottom: 80px;
}



.project__info-links .hov__button img {
  max-width: 40px;
}

.project__nfo{
  flex-direction: column-reverse;
}
.project__info__links .hov__button img {
  max-width: 45px;
}

.project__info-links {
  gap: 30px;
  margin-bottom: 20px;
}
}
/* -----------------------News and Blogs 10 pages start------------------------ */






/* -----------career start ------ */
.hero-image-header-career {
  /*  This creates an image overlay  */
  
  background-size: cover;
  background-position: center;
  
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 70vh;  
  position: relative;
}
@media screen and (max-width:991px) {
    .hero-image-header-career {
        height: 40vh;
    }
}
/* apply start*/
.aboutus__description{
  margin-bottom: 0.5rem;
  text-align: justify;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2.5rem;
  color: #333;
  letter-spacing: 0em;
}
.apply {
  padding: 30px 0;
  margin-bottom: 30px;
  position: relative;
}

.apply .inner-container_apply {
  max-width: 800px;
  width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px;
  background-color: #f2f9fe;
  box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
  border-radius: 30px;
}
.apply__now{
  display: flex;
  flex-direction: column;
  position: relative;
  max-width: 100%;
  padding:2rem 3rem;
  justify-items: center;
  justify-content: center;
}
.apply_container{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding:1rem 1rem;
  width: 100%;
  max-height: 15%;
  background: #00AEEF;
  color:var(--white-color);
  font-family: var(--body-font);
  border-radius: 1rem;
  margin-bottom: 1rem;
}
.apply_con_hide{
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  padding: 1rem 1rem;
  width: 100%;
  height: 15%;
  background: #00AEEF;
  color:var(--white-color);
  font-family: var(--body-font);
  margin-bottom: 1rem;
  border-radius: 1rem;
}
.apply_container .executive{
  flex: 2;
  display: flex;
  flex-direction: column;
  align-items: start;
  
}
.apply_container .executive h3{
  font-size: 1.25rem;
  line-height: 1.5rem;
  color: var(--white-color);
  font-weight: 500;
}
.apply_container .executive p{
  font-size: 1.1rem;
  line-height: 1.5rem;
  color: var(--white-color);
  font-weight: 500;
}
.apply_container  .executive__button{

  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.apply__now .apply__button{
  flex-direction: row;
  align-items: center;
  justify-content: center;
  justify-content: space-evenly;
  
}
#deletebtn {
  width:3rem;
  height:3rem;
  background:red;
  text-align:center;
  cursor:pointer;
  border-radius: 1.5rem;
  position:absolute;
  right:6%;
}
#deletebtn1 {
  width:3rem;
  height:3rem;
  background:red;
  text-align:center;
  cursor:pointer;
  border-radius: 1.5rem;
  position:absolute;
  right:6%;
  
}

@media screen and (max-width:600px) {
  .apply .inner-container_apply {
    max-width: 90%;
    width: 90%;
  }
  .apply__now{
    padding:1rem 1rem;
  }
  .apply_container .executive h3{
    font-size: 1.25rem;
 
  }
  .apply_container .executive p{
    font-size: 1.25rem;
  }
/*  .apply_container  .executive__button{
    flex: 2;
  }*/
  .apply__now .apply__button{
    width: 100%;
    justify-content: space-between;
  }
}
@media screen and (min-width:601px) and  (max-width:1023px) {
  .apply .inner-container_apply {
    max-width: 90%;
    width: 75%;
  }
  .apply__now{
    padding:1rem 1rem;
  }
  .apply_container .executive h3{
    font-size: 1.3rem;
 
  }
  .apply_container .executive p{
    font-size: 1.3rem;
  }
  .apply_container  .executive__button{
    flex: 1;
  }
  .apply__now .apply__button{
    width: 100%;
    justify-content: space-between;
  }
}



/*______PopUp_________*/
/*.overlay__popup1 {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    transition: opacity 500ms;
    visibility: hidden;
    opacity: 0;
    z-index: 99;
}

    .overlay__popup1:target {
        visibility: visible;
        opacity: 1;
    }*/
/* "updated" */

.overlay__popup {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  z-index: 99;
}

#popup2 {
    display: none;
}
#popup1 {
    display: none;
}
#popup3 {
    display: none;
}
.popup__dis {
    margin: 20px auto;
    padding: 20px;
    background: #fff;
    border-radius: 5px;
    box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
    max-width: 1100px;
    width: 1000px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    transition: all 5s ease-in-out;
    margin: 0 auto;
}
.overlay__popup_discription{
  font-size: 1.6rem !important;
  color: #333;
  font-family: var(--body-font);
}
.popup__dis h2 {
  margin-top: 0;
  font-size: 2rem;
  color: #333;
  font-family: var(--body-font);
}
.popup__dis .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup__dis .close:hover {
  color: #06D85F;
}
.popup__dis .content {
  width: 95%;
  max-width: 100%;
  overflow: auto;
}
.popup__dis .content p{
  font-size: 1.4rem;
  line-height: 1.5rem;
  margin: 0.5rem;
}
.popup__dis .content ul li{
  font-size: 1.4rem;
  line-height: 2rem;
  margin: 0.5rem;
  color:#333;
}
.popup__dis .content .popup__button{
  width:30%;
  height: 15%;
  background-color: #00AEEF;
  font-size: 2.5rem;
  font-weight: 700;
  font-family: var(--body-font);
  text-align: center;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
  color: var(--white-color);
  margin-inline:30rem ;
  animation: zoom-in-zoom-out 2s ease-out infinite;
}
@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(0.8, 0.8);
  }
  50% {
    transform: scale(1, 1);
  }
  100% {
    transform: scale(0.8, 0.8);
  }
}
.popup__dis .content .popup__button img{
  width:50px;
  background-color:#00AEEF;
  margin-right: 3rem;
  padding: 1rem;
}
.about__container_popup{
    background-color: rgba(207, 239, 252, 0.4);
    border-radius: 37px;
    padding: 2vh 0;
    margin: 1vh;
}
.about__container_popup h4{
  font-size: 2.5rem;
  margin-bottom: 5px;
}
.about__box-wrap_popup {
  padding: 2rem;
}
.aboutus__img__popup img{
  width: 50%; 
  height: auto;
  background-color: transparent;
  border-radius:30px;
}
@media screen and (min-width:601px) and (max-width: 1023px) {
  .popup__dis{
    width: 600px;
    height: 80%;
    margin: 10px auto;
  }
  .popup__dis .content .popup__button{
    font-size: 2rem;
    width:40%;
    margin-inline:15rem;
  }
}
@media screen and (max-width: 600px){
  .popup__dis{
    width: 95%;
    height: 70%;
    margin: 10px auto;
  }
  .popup__dis .content{
    width:100%;
  }
  .popup__dis .content p{
    width: 100%;
    font-size: 1.25rem;
    text-align: justify;
    line-height: 2.2vh;
    font-weight: 500;
    margin: 0.1vh;
    padding: 0;
  }
  
  .overlay__popup_discription{
    font-size: 1.4rem !important;
  }
 
}










/*apply end*/




/*______upload file start _____________*/
.upload_file {
  padding: 30px 0;
  margin-bottom: 30px;
  position: relative;
}

.upload_file .upload_file__container {
  max-width: 800px;
  width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 10px;
  justify-content: space-between;
  align-items: center;
  background-color: #f2f9fe;
  box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
  border-radius: 30px;

}
.upload_cv {
  flex: 2;
  background-color: var(--white-color);
  color: var(--black-color);
  width: 30%;
  padding:1rem 1rem;
  border: solid black 3px;
  border-style: dashed;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  text-align: center;
  border-radius: 1rem;
  margin: 0.5rem;
}
.upload_cv .upload_button{
  flex:2;
}
.upload_cv .icon_upload img{
  height:4rem;
  width:4rem;
  margin-bottom: 1rem;
}
.upload_cv .upload_button a{
  cursor: pointer;
  padding: 0.5rem;
  width: fit-content;
  background-color: #00AEEF;
  border-radius: 1rem;

}
.upload_cv .upload_detail{
  flex:4;
  width: 100%;
}
.upload_cv .upload_detail h4{
  font-size: 2rem;
  padding:0.5rem;
  line-height: 2rem;
  font-weight: 500;
}
.upload_cv .upload_detail p{
  font-size: 1.3rem;
  padding:0.5rem;
  line-height: 2rem;
  font-weight: 400;
}

@media screen and (max-width: 600px){
  .upload_file .upload_file__container {
    display: flex;
    flex-direction: column;
    max-width: 90%;
    width: 90%;
  }
  .upload_cv {
    width: 100%;
  }
  .upload_cv .upload_detail h4{
    font-size: 2rem;
  }
  .upload_cv .upload_detail p{
    font-size: 1.4rem;
  }
  .upload_cv .upload_button a{
    width: fit-content;
    font-size: 1.5rem;
    padding:0.6rem;
  }
}
 @media screen and (min-width: 601px) and (max-width: 1023px){

  .upload_file .upload_file__container {
    display: flex;
    flex-direction: column;
    max-width: 90%;
    width: 75%;
  }
  .upload_cv {
    flex: 2;
    width: 100%;
  }
  .upload_cv .upload_detail h4{
    font-size: 2rem;
  }
  .upload_cv .upload_detail p{
    font-size: 1.4rem;
  }
  .upload_cv .upload_button a{
    width: fit-content;
    font-size: 1.5rem;
    
  }
} 
@media screen and (min-width:1024px) {
  .upload_file {
    padding: 30px 0;
    margin-bottom: 30px;
    position: relative;
  }
  .aboutus__description{
    margin-bottom: 0.5rem;
    text-align: justify;
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: 0em;
  }
  .upload_file .upload_file__container {
    max-width: 800px;
    width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 10px;
    justify-content: space-between;
    align-items: center;
    background-color: #f2f9fe;
    box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
    border-radius: 30px;
  
  }
  .upload_cv {
    flex: 2;
    background-color: var(--white-color);
    color: var(--black-color);
    width: 30%;
    padding:1rem 1rem;
    border: solid black 3px;
    border-style: dashed;
    display: flex;
    flex-direction: row;
    align-items: center;
    align-content: center;
    text-align: center;
    border-radius: 1rem;
    margin: 0.5rem;
  }
  .upload_cv .upload_button{
    flex:2;
  }
  .upload_cv .icon_upload img{
    height:4rem;
    width:4rem;
    margin-bottom: 1rem;
  }
  .upload_cv .upload_button button{
    cursor: pointer;
    padding: 1rem;
    width: fit-content;
    background-color: #00AEEF;
    border-radius: 1rem;
  
  }
  .upload_cv .upload_detail{
    flex:4;
    width: 100%;
  }
  .upload_cv .upload_detail h4{
    font-size: 2rem;
    padding:0.5rem;
    line-height: 2rem;
    font-weight: 500;
  }
  .upload_cv .upload_detail p{
    font-size: 1.3rem;
    padding:0.5rem;
    line-height: 2rem;
    font-weight: 400;
  }
  
}
/*______upload file end _____________*/


/* --------career form start ---------- */
@media screen and (max-width:600px) {
  .container_contact {
    max-width: 90%;
    width: 90% !important;
  }
}
@media screen and (min-width:601px) and (max-width:1023px) {
  .container_contact {
    max-width: 90%;
    width: 90% !important;
  }
  .container_contact h1{
    font-size: 1.8rem;
    line-height: 5rem;
    text-align: center;
  }
  .container_contact form label{
    font-size: 1.5rem;
    font-family: var(--plus-jakarta-font);
  }
}

.branch__container_contact{
  max-width: 100%;
  width: 70%;
  background-color: #EBF0FA;
  border-radius: 37px;
  margin-top: 10%;
  padding: 16px 10px;
  box-shadow: 0px -5px 15px 0px rgba(0, 0, 0, 0.1); 
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
.container_contact {
  max-width: 1000px;
  width: 800px;
  margin:  0 auto;
  margin-top: 10%;
  margin-bottom: 10%;
  background: white;
  padding: 20px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s;
}
.contact_head{
  font-size: 2.5rem;
  line-height: 3rem;
  text-align: center;
}
.container_contact:hover {
  transform: scale(1.02);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

input[type="text"],
        input[type="email"],
        input[type="file"],
        textarea {
            width: 100%;
            padding: 2px 2px;
            margin: 5px 0;
            height: 35px;
            border: 1px solid #ccc;
            border-radius: 3px;
            transition: border-color 0.3s;
        }

        input[type="text"]:focus,
        input[type="email"]:focus,
        textarea:focus {
            border-color: #555;
        }

input[type="submit"][type="file"] {
    background-color: #333;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 3px;
    margin: 1rem;
    cursor: pointer;
    transition: background-color 0.3s;
}

    input[type="submit"][type="file"]:hover {
        background-color: #555;
    }

    input[type="submit"][type="file"]:active {
        transform: scale(0.95);
    }

    input[type="submit"][type="file"]:focus {
        outline: none;
    }
/* --------career form end ---------- */






/* ------------------contact us page start ----------------- */
/* Hero img contact start  */
.hero_image_header_contact {
  /*  This creates an image overlay  */
  /*background: url("https://i.postimg.cc/GhmvMRWG/header.jpg");*/
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* to ensure the image takes up the entire viewport */
  height: 70vh;  
  position: relative;
  margin-bottom: 1rem;
}
@media screen and (max-width:991px) {
  .hero_image_header_contact {
  height: 35vh;
}
}
/* Hero img contact end  */
/*---------------------------------
     category start 
  ---------------------------------*/
 
  .category .inner-container_contact {
    max-width: 65%;
    margin: 0 auto;
    display: flex;
    width:55%;
    flex-direction: column;
    justify-content: center;
    padding: 10px;
    background-color: #f2f9fe;
    box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
    border-radius: 30px;
  }
  .category .contact_head h1{
    font-size: var(--heading-font);
    font-family: var(--body-font);
    font-weight: 500;
    text-align: center;
    line-height: 5rem;
  }
  .category .contact_head p{
    font-size: .75em;
    font-family: var(--body-font);
    font-weight: var(--body-font-weight);
    text-align: center;
    line-height: var(--body-line-height);
    color: #000000;
  }
  .category .contact_items{
    position:unset;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    font-family: var(--body-font);
    padding: 2rem 8rem;
  }
  
  .category .call{
    display: flex;
    width: 50%;
    flex-direction: row;
    align-items: center;
    justify-items: stretch;
    justify-content: space-around;
    font-family: var(--body-font);
    padding: 1rem;
  }
  .category .call img{
    width: 6rem;
    max-width: 7rem;
    border: none;
    background-color: #e9e9e9;
    border-radius: 50%;
    padding:0.7rem;
  }
  .category .call .call_text h3{
    font-size: 1.5rem;
    font-family: var(--body-font);
    font-weight: 600;
    text-align: center;
    line-height: 2.5rem;
  }
  .category .call .call_text p{
    font-size: 0.8vw;
    font-family: var(--body-font);
    font-weight: 400;
    text-align: center;
    color: #000000;
    line-height: 1rem;
  }
  .category .call a{
    
    background-color: blue;
    width: 20%;
    color: white;
    font-size: 0.8vw;
    font-weight: 600;
    font-family: var(--body-font);
    border-radius: 40px;
    max-width: 25%;
    border:  solid  skyblue;
    border-width: 0.2vw;
    transition: 0.3s ease;
    text-align:center !important;
  }
  .category .call a:hover{
    background-color: white;
    color: black;
    border-color: crimson;
    letter-spacing: 0.2rem;
  }
  .branch_cols_button{
  max-width: 45%;
  width: 35%;
  border: solid .1rem #00AEEF;
  border-radius: 20px;
  font-size: var(--body-font);
  color: #00AEEF;
  display: flex;
  align-self: center;
  justify-content: center;
  transition: 0.3s ease;
  }
  .branch_cols_button:hover{
    background-color: #00AEEF;
    color: var(--white-color);
  }
  
  
  @media (min-width: 1024px) {
    .category {
      padding: 30px 0;
      margin-bottom: 30px;
      margin-top: -100px;
      
      position: relative;
    }
    .category .inner-container_contact {
      max-width: 800px;
      margin: 0 auto;
      display: flex;
      width:800px;
      flex-direction: column;
      justify-content: center;
      padding: 5px;
    }
    .category .contact_head h1{
      font-size: 2rem;
      font-family: var(--body-font);
      font-weight: 700;
      text-align: center;
      line-height: 2rem;
      margin-top: 0.8rem;
    }
    .category .contact_head p{
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 400;
      text-align: center;
      line-height: 4rem;
      color: #000000;
    }
    .category .contact_items{
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-evenly;
      font-family: var(--body-font);
      padding: 1rem 1rem;
      margin: 0.5rem;
    }
    
    .category .call{
      display: flex;
      width: 48%;
      flex-direction: row;
      align-items: center;
      justify-items: stretch;
      justify-content: space-evenly;
      font-family: var(--body-font);
      padding: 0.2rem;
    }
    .category .call img{
      width: 4rem;
      max-width: 5rem;
      border: none;
      background-color: #e9e9e9;
      border-radius: 50%;
      padding:0.7rem;
    }
    .category .call .call_text h3{
      font-size: 1.5rem;
      font-family: var(--body-font);
      font-weight: 600;
      text-align: center;
      line-height: 2.3rem;
    }
    .category .call .call_text p{
      font-size: 1.1rem;
      font-family: var(--body-font);
      font-weight: 500;
      text-align: center;
      color: #000000;
      line-height: 1rem;
    }
        .category .call a {
            border: none;
            background-color: blue;
            max-width: 50%;
            width: 30%;
            color: white;
            font-size: 1.1rem;
            font-weight: 500;
            font-family: var(--body-font);
            border-radius: 40px;
            max-width: 12vw;
            border: solid skyblue;
            border-width: 0.2rem;
            text-align: center !important;
        }
  }
  
  @media screen and (min-width:768px) and (max-width: 1023px) {
    .category {
      padding: 30px 0;
      margin-bottom: 30px;
      margin-top: -150px;
    
      position: relative;
    }
    .category_home {
        padding: 30px 0;
        margin-bottom: 30px;
        margin-top: -120px;
        position: relative;
    }
    .category .inner-container_contact {
      max-width: 85%;
      margin: 0 auto;
      display: flex;
      width:80%;
      flex-direction: column;
      justify-content: center;
      padding: 5px;
    }
    .category .contact_head h1{
      font-size: 2rem;
      font-family: var(--body-font);
      font-weight: 700;
      text-align: center;
      line-height: 3rem;
    }
    .category .contact_head p{
      font-size: 1.3rem;
      font-family: var(--body-font);
      font-weight: 400;
      text-align: center;
      line-height: 4rem;
      color: #000000;
    }
    .category .contact_items{
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      font-family: var(--body-font);
      padding: 0rem .5rem;
      margin: 0.5rem;
    }
    
    .category .call{
      display: flex;
      width: 50%;
      flex-direction: row;
      align-items: center;
      justify-items: stretch;
      justify-content: space-evenly;
      font-family: var(--body-font);
      padding: 0.2rem;
    }
    .category .call img{
      width: 4rem;
      max-width: 5rem;
      border: none;
      background-color: #e9e9e9;
      border-radius: 50%;
      padding:0.7rem;
    }
    .category .call .call_text h3{
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 600;
      text-align: center;
      line-height: 2.3rem;
    }
    .category .call .call_text p{
      font-size: 1.1rem;
      font-family: var(--body-font);
      font-weight: 500;
      text-align: center;
      color: #000000;
      line-height: 1rem;
    }
        .category .call a {
            border: none;
            background-color: blue;
            max-width: 50%;
            width: 35%;
            color: white;
            font-size: 1.1rem;
            font-weight: 500;
            font-family: var(--body-font);
            border-radius: 40px;
            max-width: 12vw;
            border: solid skyblue;
            border-width: 0.2rem;
            text-align: center !important;
        }
  }
  @media (max-width: 767px) {
    .category {
      padding: 30px 0;
      margin-bottom: 30px;
      margin-top: -150px;
  
      position: relative;
    }
    .category_home {
        padding: 30px 0;
        margin-bottom: 30px;
        margin-top: -80px;
        position: relative;
    }
    .category .inner-container_contact {
      max-width: 95%;
      width: 95%;
    }
    .category .contact_head h1{
      font-size: 1.6rem;
      font-family: var(--body-font);
      font-weight: 800;
      text-align: center;
      line-height: 3rem;
    }
    .category .contact_head p{
      font-size: 1.2rem;
      font-family: var(--body-font);
      font-weight: 500;
      text-align: center;
      line-height: 2rem;
      color: #000000;
    }
    .category .contact_items{
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      font-family: var(--body-font);
      padding: 0.15rem 0.1rem;
    }
    
    .category .call{
      display: flex;
      width: 95%;
      max-width: 100%;
      flex-direction: row;
      align-items: center;
      justify-items: stretch;
      justify-content: space-between;
      font-family: var(--body-font);
      padding: 0.5rem;
    }
    .category .call img{
      width: 4rem;
      max-width: 5rem;
      border: none;
      background-color: #e9e9e9;
      border-radius: 50%;
      padding:0.7rem;
    }
    .category .call .call_text h3{
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 600;
      text-align: center;
      line-height: 2rem;
    }
    .category .call .call_text p{
      font-size: 1.2rem;
      font-family: var(--body-font);
      font-weight: 500;
      text-align: center;
      color: #000000;
      line-height: 1rem;
    }
        .category .call a {
            border: none;
            background-color: blue;
            width: 30%;
            max-width: 35%;
            color: white;
            font-size: 1.2rem;
            font-weight: 500;
            font-family: var(--body-font);
            border-radius: 40px;
            border: solid skyblue;
            border-width: 0.2rem;
            text-align: center !important;
        }
  }
   @media (max-width: 600px) {
    .category {
      padding: 30px 0;
      margin-bottom: 30px;
      margin-top: -150px;
      position: relative;
    }
    .category_home {
        padding: 30px 0;
        margin-bottom: 30px;
        margin-top: 0px;
        position: relative;
    }
    .category .inner-container_contact {
      max-width: 100%;
      margin: 0 auto;
      display: flex;
      width:90%;
      flex-direction: column;
      justify-content: center;
      padding: 5px;
    }
    .category .contact_head h1{
      font-size: 1.5rem;
      font-family: var(--body-font);
      font-weight: 800;
      text-align: center;
      line-height: 3rem;
    }
    .category .contact_head p{
      font-size: 1.25rem;
      font-family: var(--body-font);
      font-weight: 500;
      padding: 0.5rem 2.5rem;
      text-align: center;
      line-height: 2rem;
      color: #000000;
    }
    .category .contact_items{
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      font-family: var(--body-font);
      padding: 0.15rem 0.1rem;
    }
    
    .category .call{
      display: flex;
      width: 95%;
      max-width: 100%;
      flex-direction: row;
      align-items: center;
      justify-items: stretch;
      justify-content: space-between;
      font-family: var(--body-font);
      padding: 0.5rem;
    }
    .category .call img{
      width: 4rem;
      max-width: 5rem;
      border: none;
      background-color: #e9e9e9;
      border-radius: 50%;
      padding:0.7rem;
    }
    .category .call .call_text h3{
      font-size: 1.4rem;
      font-family: var(--body-font);
      font-weight: 600;
      text-align: center;
      line-height: 2rem;
    }
    .category .call .call_text p{
      font-size: 1.2rem;
      font-family: var(--body-font);
      font-weight: 500;
      text-align: center;
      color: #000000;
      line-height: 1rem;
    }
        .category .call a {
            border: none;
            background-color: blue;
            width: 30%;
            max-width: 35%;
            color: white;
            font-size: 1.2rem;
            font-weight: 500;
            font-family: var(--body-font);
            border-radius: 40px;
            border: solid skyblue;
            border-width: 0.2rem;
            text-align: center !important;
        }
  } 
/*-----Branch Section Start------ */
.branch-section {
  position:relative;
  padding: 50px 0;
  display: flex;
  align-items: center;
  
}

.branch-section .branch_head h2{
  font-size: 2.25rem;
    font-family: var(--body-font);
    font-weight: 700;
    text-align: center;
    line-height: 3rem;
}
.branch-section .branch_head span{
  color: crimson;
  cursor: pointer;
  font-size: 2.8rem;
  line-height: 3rem;
}
.branch-section .branch_lists{
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;
  align-items: center;
  justify-content: space-around;
  padding:2rem;
  width:100%;
}

.branch-section .branch_cols{
  display: flex;
  flex-direction: column;
  font-family: var(--body-font);
  align-items: initial;
  background: white;
  height: auto;
  width: 30%;
  padding:1rem 1rem;
  border-radius: 1.5rem;
  margin-bottom: 2rem;
}
.branch-section .branch_cols iframe{
  width: 100%;
  max-width: 100%;
  height: 50%;
  border:none;
  background: #FFDED6;
}
.branch-section .branch_cols h2{
  font-size: 1.5rem;
  font-family: var(--body-font);
  font-weight: 700;
  text-align: center;
  line-height: 3rem;
  text-transform: uppercase;
  border-bottom: solid #aaaaaa;
  
  margin-top: 1.5rem;
}
.branch-section .branch_address{
  display: flex;
  flex-direction: row;
  font-family: var(--body-font);
  color: var(--sky-color);
  align-items: center;
  justify-content: space-between;
}
.branch-section .branch_address .col_left{
 width: 40%;
 font-size: 1.5rem;
 font-weight: 500;
 text-align: left;
 line-height: 3.5rem;
}
.branch-section .branch_address .col_right{
  width: 95%;
  font-size: 1.25rem;
  font-weight: 400;
  text-align: left;
  line-height: 2rem;
 }
 .branch_cols_button{
  max-width: 45%;
  width: 35%;
  border: solid .1rem #00AEEF;
  border-radius: 20px;
  font-size: var(--body-font);
  color: #00AEEF;
  display: flex;
  align-self: center;
  justify-content: center;
  transition: 0.3s ease;
  }
  .branch_cols_button:hover{
    background-color: #00AEEF;
    color: var(--white-color);
    letter-spacing: 0.15rem;
  }
@media screen and (min-width:1024px) {
  .branch-section {
    position:relative;
    padding: 50px 0;
    display: flex;
    align-items: center;
    
    
  }
 
  .branch-section .branch_head h2{
    font-size: 2.25rem;
      font-family: var(--body-font);
      font-weight: 700;
      text-align: center;
      line-height: 3rem;
  }
  .branch-section .branch_head span{
    color: crimson;
    cursor: pointer;
    font-size: 2.8rem;
    line-height: 3rem;
  }
  .branch-section .branch_lists{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    align-items: center;
    justify-content: space-around;
    padding:2rem;
    width:100%;
  }
  
  .branch-section .branch_cols{
    display: flex;
    flex-direction: column;
    font-family: var(--body-font);
    align-items: initial;
    background: white;
    height: auto;
    width: 30%;
    padding:1rem 1rem;
    border-radius: 1.5rem;
    margin-bottom: 2rem;
  }
  .branch-section .branch_cols iframe{
    width: 100%;
    max-width: 100%;
    height: 50%;
    border:none;
    background: #FFDED6;
  }
  .branch-section .branch_cols h2{
    font-size: 1.2rem;
    font-family: var(--body-font);
    font-weight: 700;
    text-align: center;
    line-height: 3rem;
    text-transform: uppercase;
    border-bottom: solid #aaaaaa;
    margin-top: 1.5rem;
  }
  .branch-section .branch_address{
    display: flex;
    flex-direction: row;
    font-family: var(--body-font);
    color: var(--sky-color);
    align-items: center;
    padding: 0 1.5rem;
    justify-content: space-between;
  }
  .branch-section .branch_address .col_left{
   width: 40%;
   font-size: 1.2rem;
   font-weight: 500;
   text-align: left;
   line-height: 3rem;
  }
  .branch-section .branch_address .col_right{
    width: 95%;
    font-size: 1.1rem;
    font-weight: 400;
    text-align: left;
    line-height: 2rem;
   }
   .branch_cols_button{
    max-width: 45%;
    width: 35%;
    border: solid .1rem #00AEEF;
    border-radius: 20px;
    font-size: 1.2rem;
    color: #00AEEF;
    display: flex;
    align-self: center;
    justify-content: center;
    transition: 0.3s ease;
    }
    .branch_cols_button:hover{
      background-color: #00AEEF;
      color: var(--white-color);
    }

}
@media screen and (min-width:768px) and (max-width:1023px) {
  .branch-section .branch_lists{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding:2rem;
    width:100%;
  }
  .branch-section .branch_cols{
    display: flex;
    flex-direction: column;
    font-family: var(--body-font);
    align-items: initial;
    background: white;
    height: auto;
    width: 90%;
    padding:1rem 1rem;
    border-radius: 1.5rem;
    margin-bottom: 2rem;
  }
  .branch-section .branch_address{
    padding: 0 2rem;
  }
  .branch-section .branch_address .col_left{
    width: 40%;
    font-size: 1.4rem;
    font-weight: 500;
    text-align: left;
    line-height: 2.5rem;
   }
   .branch-section .branch_address .col_right{
     width: 95%;
     font-size: 1.3rem;
     font-weight: 400;
     text-align: left;
     line-height: 1.8rem;
    }
    .branch_cols_button{
     max-width: 35%;
     width: 25%;
     border: solid .1rem #00AEEF;
     border-radius: 20px;
     font-size: 1.3rem;
     color: #00AEEF;
     display: flex;
     align-self: center;
     justify-content: center;
     transition: 0.3s ease;
     }
    
 
}
@media screen and  (max-width:767px)  {
  .branch-section {
    position:relative;
    padding: 20px 0;
    display: flex;
    align-items: center;
    margin: 1rem 2rem;
  }
  .branch-section .branch__container {
    max-width: 100%;
    width: 100%;
    background-color: #CFEFFC;
    border-radius: 37px;
    padding: 16px 10px;
  }
  .branch-section .branch_head h2{
    font-size: 2rem;
      font-family: var(--body-font);
      font-weight: 700;
      text-align: center;
      line-height: 2.8rem;
  }
  .branch-section .branch_head span{
    color: crimson;
    cursor: pointer;
    font-size: 2.25rem;
    line-height: 2.8rem;
  }
  .branch-section .branch_lists{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding:2rem;
    width:100%;
  }
  .branch-section .branch_cols{
    display: flex;
    flex-direction: column;
    font-family: var(--body-font);
    align-items: initial;
    background: white;
    height: auto;
    width: 100%;
    padding:1rem 1rem;
    border-radius: 1.5rem;
    margin-bottom: 2rem;
  }
  .branch-section .branch_address{
    padding: 0 2rem;
  }
  .branch-section .branch_address .col_left{
    width: 40%;
    font-size: 1.35rem;
    font-weight: 500;
    text-align: left;
    line-height: 2.5rem;
   }
   .branch-section .branch_address .col_right{
     width: 95%;
     font-size: 1.3rem;
     font-weight: 400;
     text-align: left;
     line-height: 1.8rem;
    }
    .branch_cols_button{
     max-width: 35%;
     width: 30%;
     border: solid .1rem #00AEEF;
     border-radius: 20px;
     font-size: 1.3rem;
     color: #00AEEF;
     display: flex;
     align-self: center;
     justify-content: center;
     transition: 0.3s ease;
     }
    
}

 @media screen and (max-width:600px){
  .branch-section .branch_address{
    padding: 0 1rem;
  }
  .branch-section .branch_address .col_right{
    font-size: 1.25rem;
  }
 }
 /*-----Branch Section End------ */

/* ------contact form start--------- */

.form-control{
  border-radius:30px;
  border:0px;
  background-color: wheat;
  text-align: center;
  z-index: 1;
}
#contact_form input {
  background-color: white;
  height: 4rem;
  border-radius: 30px;
  margin: 0.5rem;
}

 .message_control input{
  height: 10rem;
}
.font-primary{
  font-family: var(--body-font);
  font-size: 1.3rem;
  font-weight: 500;
}
.font-secondary{
  font-family: var(--body-font);
  font-size: 1.6rem;
  font-weight: 500;
}



/* ------contact form end--------- */  
/* ------------------contact us page end ----------------- */












/* -------------bay hills page start --------------*/
/* Hero img bay hills start  */
.hero_image_header_bayHills {
    /*  This creates an image overlay  */
   /* background: url("../assets/bayHillsPromo.jpg");*/
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* to ensure the image takes up the entire viewport */
    height: 70vh;
    position: relative;
    margin-bottom: 1rem;
}
@media screen and (max-width:767px) {
  .hero_image_header_bayHills {
  height: 50vh;
}
}

/*______PopUp project pages_________*/

/* Hero img contact start  */
.hero_image_header_goldPalace {
    /*  This creates an image overlay  */
    background: url("../assets/GoldPalaceHero.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* to ensure the image takes up the entire viewport */
    height: 70vh;
    position: relative;
    margin-bottom: 1rem;
}

@media screen and (max-width:767px) {
    .hero_image_header_goldPalace {
        height: 50vh;
    }
}
/* Hero img contact end  */




.popup__dis_project {
  margin: 20px auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
  max-width: 1000px;
  width: 800px;
  max-height: 800px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  transition: all 5s ease-in-out;
  margin: 0 auto;
}


.popup__dis_project .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup__dis_project .close:hover {
  color: #06D85F;
}
.popup__dis_project .content {
  width: 95%;
  max-width: 100%;
}
.popup__dis_project .content p{
  font-size: 1.4rem;
  line-height: 2rem;
  margin: 0.5vh;
}
.popup__dis_project .about_logo_project img{
  width: 100% !important;
  height: 50%;
  border-radius: 40px !important;
}





@media screen and (min-width:601px) and (max-width: 1024px) {
  
  .popup__dis_project{
    width: 550px;
    height: 65%;
    left: 0%;
    top:5%;
    margin: 10px auto;
  }
  
  .popup__dis_project .about_logo_project img{
    width: 95% !important;
  }
}
@media screen and (max-width: 600px){
 
  .popup__dis_project{
    width: 75%;
    height: 65%;
    margin: 10px auto;
  }
  .popup__dis_project .content{
    width:100%;
  }
  .popup__dis_project .content p{
    width: 100%;
    font-size: 1.25rem;
    text-align: justify;
    line-height: 2rem;
    font-weight: 500;
    margin: 0.5rem auto;
    padding: 0;
  }
}

/* -------Project pages Popup end -------- */

/* Video gallery*/


/*-------------2nd video gallery*/


/* Hero img bay hills end  */
/*-------------------------
project_consultant_section start
-------------------------*/
.project_consultant_section {
    position: relative;
    padding: 25px 25px;
}

.project_consultant_container {
  background-color: var(--white-color);
  border-radius: 0px;
  padding: 16px 0;
  margin: -90px 0px 0px 0px ;
}

.consultant_div{
text-align: center;
font-family: var(--body-font);
}
.about__title_slider{
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 2.4rem;
}
.about__description_slider{
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 2rem;
  color: var(--black-color);
}
.about__logo__span{
  width:fit-content;
  background: var(--secondary-color);
  font-family: var(--body-font);
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--white-color);
  border-radius: 5px;
  padding:5px;
  max-width: 750px;
  margin-bottom: 20px;
}

@media screen and (min-width:1024px) {
  .aboutus__img img{
    max-width: 100%; 
    height: 100%;
  }
}

.aboutus__img img{
  width: 100%; 
  height: 100%;
  border-radius: 1rem;
  background-color: transparent;
}

/*-------------------------
project_consultant_section end
-------------------------*/
/*--------Video Gallery css start ---------*/
.youtube_videos {
    padding: 0;
    text-align: center;
}

.youtube,
.youtube_video {
    position: relative;
    display: inline-block;
    margin: 0.5em;
}

.youtube_videos img,
.youtube_video {
    width: 380px;
    max-width: 100%;
    height: 250px;
    cursor: pointer;
    vertical-align: middle;
    border: 0;
}

.youtube:after {
    content: "PLAY VIDEO";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    color: transparent;
    background: rgba(33, 150, 253, 0.25);
    font-weight: bolder;
    line-height: 250px;
    text-align: center;
    transition: all 0.8s ease;
    cursor: pointer;
}

.youtube:hover:after {
    top: 110px;
    left: 110px;
    width: 165px;
    height: 40px;
    color: #FFF;
    line-height: 40px;
    background: rgb(33, 150, 253);
    transition: all 0.8s ease;
}
.video_gallery_container{
    display:none;
}
/*--------Video Gallery css end ---------*/
/* ---------video carousal start --------- */
.video_container {
    margin: 0 auto;
    width: 250px;
    height: 230px;
    position: relative;
    perspective: 1000px;
}

.video_carousel {
  height: 100%;
  width: 100%;
  position: absolute;
  transform-style: preserve-3d;
  transition: transform 1s;
}

.video_item {
  display: block;
  position: absolute;
  background: #000;
  width: 250px;
  height: 200px;
  
  font-size: 5em;
  text-align: center;
  color: #FFF;
  opacity: 0.95;
  border-radius: 10px;
}
.video_item img{
    width: 250px;
  height: 200px;
  border-radius: 1rem;
}
.play_button{
  cursor: pointer;
  position: absolute;
  top: 45%;
  left: 45%;
}
.play_button img{
  width: 3rem;
  height: 3rem;
}
.a {
  transform: rotateY(0deg) translateZ(250px);
  background: transparent;
  border:solid 0.1rem #ed1c24;
  border-radius: 1rem;
}
.b {
  transform: rotateY(60deg) translateZ(250px);
  border:solid 0.1rem #0072bc;
  border-radius: 1rem;
}
.c {
  transform: rotateY(120deg) translateZ(250px);
  border:solid 0.1rem #39b54a;
  border-radius: 1rem;
  background: #39b54a;
}
.d {
  transform: rotateY(180deg) translateZ(250px);
  border:solid 0.1rem #f26522;
  border-radius: 1rem;
}
.e {
  transform: rotateY(240deg) translateZ(250px);
  border:solid 0.1rem #630460;
  border-radius: 1rem;
} 
.f {
  transform: rotateY(300deg) translateZ(250px);
  border:solid 0.1rem #8c6239;
  border-radius: 1rem;
}

.video_next, .video_prev {
  color: #333;
  position: absolute;
  top: 100px;
  padding: 0.5em 1em;
  cursor: pointer;
  background: #CCC;
  border-radius: 5px;
  border-top: 1px solid #FFF;
  box-shadow: 0 5px 0 #999;
  transition: box-shadow 0.1s, top 0.1s;
}
@media screen and (min-width:767px) and (max-width:1024px) {
  .video_next, .video_prev {
    top:100px !important;
  }
}
@media screen and (min-width:500px) and (max-width:767px) {
  .video_next, .video_prev {
    top:150px !important;
  }
  .video_container{
    width:200px;
    height: 240px;
    margin-top: 40px;
    perspective: 2000px;
  }
  .video_next { right: 1em !important; }
.video_prev { left: 1em !important; }
}
@media screen and (max-width:500px) {
  .video_next, .video_prev {
    top:150px !important;
  }
  .video_container{
    width:250px;
    height: 240px;
    margin-top: 40px;
    perspective: 2000px;
  }
  .video_next { right: .5em !important; }
.video_prev { left: .5em !important; }
}
.video_next:hover, .video_prev:hover { color: #000; }
.video_next:active, .video_prev:active {
  top: 104px;
  box-shadow: 0 1px 0 #999;
}
.video_next { right: 7em; }
.video_prev { left: 7em; }
/* ---------video carousal end --------- */





/*---------------------------------
     about-section start 
  ---------------------------------*/

  .about-section {
    position: relative;
    padding: 50px 0;
    margin-bottom: 60px;
  }
  
  .about__container {
    background-color: rgba(207, 239, 252, 0.4);
    border-radius: 37px;
    padding: 16px 0;
  }
  
  .aboutus__title{
    margin-bottom: 0.5rem;
    text-align: center;
    font-size: 2.2rem;
    font-weight: 600;
    padding-top:1.5rem;
    line-height: 2.5rem;
  }
  @media screen and (max-width:767px) {
    .aboutus__title{
      text-align: center;
      font-size: 2rem;
      padding: 0.5rem;
    }
    .project_row{
      display: flex;
      flex-direction: column;
    }
    
  }
  
  .about__title_bw{
    width:50%;
    display: flex;
    justify-content: center;
  }
  .about__title_bw img{
    padding: 5px;
    width:50%;
    max-width: 50%;
  }
  @media screen and (max-width:767px) {
    .about__subhead .subhead__p{
      font-size: 1.2rem !important;
    }
    
  }
  .about__subhead{
    width: 100%;
    padding: 15px 10px 15px;
    font-family: var(--plus-jakarta-font);
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    background-color: var(--secondary-color);
    border-radius: 15px;
    margin-bottom: 2rem;
  }
  .about__subhead .subhead__p{
    color: var(--white-color);
    text-align: center;
    font-size: 1.4rem;
    line-height: 2rem;
    letter-spacing: 0.025em;
    
  }
  .about__description {
    font-family: var(--plus-jakarta-font);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    text-align: justify;
    color: #333;
    margin-bottom: 1rem;
  }
  
  .about__description span{
    color: var(--secondary-color);
  }
  .about__card {
    padding: 40px 40px 60px;
    border-radius: 27px;
  }
  
  .about_logo {
    margin-bottom: 23px;
  }
  .about_logo img{
    
    border-radius: 25px;
    border-width: 4px;
    max-height: 450px;
  }
.about_logo_project{
    padding: 0 1rem 0 0;
}
@media (max-width:991){
    .about_logo_project {
        padding: 0 !important;
    }
}
.about_logo_project img {
    border: solid #fff;
    border-radius: 25px;
    border-width: 4px;
    max-height: 450px;
    margin-top: 20px;
}
 /* .about__logo-slider {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: 60px;
  }*/
  
  .about__logo-slider .slick-slide {
    margin: 0 10px;
  }
  
  .about__logo-slider .slick-slide img {
    margin: 0 auto;
  }
  .about_logo_list a img{
    max-width: 120px;
    height:50px;
  }
  @media screen and (max-width:767px) {
    .about__logo-slider .about_logo_list {
      width: 800px;
    }
    .about__logo__span{
      width:fit-content;
      font-size: 0.8rem;
    }
    .about_logo_list a img{
      max-width: 70px;
      height:35px;
    }
    .col-lg-8 .about__card {
      padding: 20px 20px 20px !important;
      border-radius: 27px;
  }
  }
  @media screen and (min-width:768px) and (max-width:1023px) {
    .about__logo-slider .about_logo_list {
      width: 800px;
    }
    .about__logo__span{
      width:fit-content;
      font-size: 1.2rem;
    }
    .about_logo_list a img{
      max-width: 100px;
      height:40px;
    }
    .col-lg-8 .about__card {
      padding: 20px 20px 20px !important;
      border-radius: 27px;
  }
  }
  .about__brand-slider {
    padding: 20px;
    margin: 0;
    background-color: #ffffff;
    border-radius: 12px;
  }
  
  .about__brand-slider .slick-slide img {
    margin: 0 auto;
  }
  .about__brand-slider .slick-slide {
    margin: 0 10px;
  }
  
  .hov__button{
    background-color: white;
    color: var(--secondary-color);
    text-decoration: none;
    border-radius: 1rem;
    height: 50px;
    display: inline-flex;
    align-items: center;
    overflow:hidden;
    width: auto;
    max-width: 50px; /** I'm animating max-width because width needs to be auto, and auto can't be animated **/
    -webkit-transition: max-width 0.5s;
    transition: max-width 0.5s;
  }
  
  .hov__button:hover {
    max-width: 300px;
    color: var(--secondary-color);
    font-size: 1.4rem;
    font-weight: 500;
  }
  .map__hov {
    font-family: "Font Awesome 5 Free";
    font-size: 2rem;
    margin-right: 5px;
    padding: 0px 8px;
    display: flex;
    align-items: center;
  }
  .hov__text{
    white-space: nowrap;
    padding-right: 15px;
  }
  @media (max-width: 991px) {
    .hov__button{
      background-color: white;
      color: var(--secondary-color);
      text-decoration: none;
      border-radius: 1rem;
      height: 45px;
      display: inline-flex;
      align-items: center;
      overflow:hidden;
      width: auto;
      max-width: 45px; /** I'm animating max-width because width needs to be auto, and auto can't be animated **/
      -webkit-transition: max-width 0.5s;
      transition: max-width 0.5s;
    }
    
    .hov__button:hover {
      max-width: 300px;
      color: var(--secondary-color);
      font-size: 1.4rem;
      font-weight: 400;
    }
    .map__hov {
      font-family: "Font Awesome 5 Free";
      font-size: 2rem;
      padding: 0px 6px;
      display: flex;
      align-items: center;
    }
    .hov__text{
      white-space: nowrap;
      padding-right: 15px;
    }
  }
  .show {
    display: block;
  }
  .btn_Expand{
    font-size:1.1em;
    padding:20px 0;
    background-color:#E94751;
    color:#fff;
    border-radius:50px;
    margin: auto;
    border:2px solid #E94751;
  }
  .btn_Expand span{
    color:white;
    font-size:0;
    padding:10px 30px;
  }
  .btn_Expand:hover{
    padding:20px 50px 20px 10px;
    border:2px solid #E94751;
  }
  .btn_Expand:hover span {
    font-size:1.0em;
  }
  .btn_Expand:hover .lazyload_img {
    margin-left: 0px;
    transform:rotate(360deg);
  }
  .btn_Expand:hover .span {
    visibility:visible;
  }
  .lazyload_img {
    transition:all 0.5s;
    background-color:white;
    color:#E94751;
    width: 40px;
    height: 40px;
    padding: 5px;
    border-radius: 20px;
    position: absolute;
    margin-left: -50px; 
    margin-top: -10px;
    font-size: 1.5em;
  }
  .lazyload_img::before {
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    content: "\f2c3" !important;
    font-family:Ionicons;
    margin-left:-5px;
  }
  .btn_Expand:hover .lazyload_img::before {
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    content: "\f10b" !important;
    font-family:Ionicons;
    margin-left:-5px;
  }
  
  @media (max-width: 991px) {
    .about-section {
      padding: 0;
      margin-bottom: 40px;
  }
    .about__container {
      padding: 24px 15px 30px;
    }
    .about__box-wrap {
      padding: 15px;
      padding-bottom: 0;
      text-align: center;
    }
  
    .about_logo img {
      max-width: 500px;
    }
    
   
    .about__description {
      font-family: var(--plus-jakarta-font);
      font-size: 1.25rem;
      font-weight: 400;
      line-height: 25px;
      text-align: justify;
      letter-spacing: 0.025em;
      margin-bottom: 30px;
    }
    .about__title_bw{
      width:50%;
      display: flex;
      justify-content: center;
    }
    .about__title_bw img{
      padding: 5px;
      width:50%;
      max-width: 50%;
    }
  }
  @media (max-width: 767px) {
    .about__brand-slider {
      padding: 10px;
    }
  
    .about__container {
      margin: 15px;
      padding: 24px 10px 30px;
    }
    .about__logo-slider {
      margin-bottom: 24px;
    }
    .about__box-wrap {
      padding: 10px;
      text-align: center;
    }
  
    .about_logo img {
      max-width: 300px;
    }
  
    .about__card {
      padding: 15px;
    }
    .about__card .mb-60 {
      margin-bottom: 20px;
    }
    .about__title {
      font-size: 27px;
      font-weight: 500;
      line-height: 4rem;
      letter-spacing: 0em;
      margin-bottom: 30px;
    }
    .about__description {
      font-family: var(--plus-jakarta-font);
      font-size: 1.25rem;
      font-weight: 400 !important;
      line-height: 25px;
      text-align: justify;
      letter-spacing: 0.025em;
      margin-bottom: 50px;
    }
    .about__title_bw{
      width:50%;
      display: flex;
      justify-content: center;
    }
    .about__title_bw img{
      padding: 5px;
      width:50%;
      max-width: 50%;
    }
  }
  @media (max-width: 600px) {
    .about__brand-slider {
      padding: 10px;
    }
  
    .about__container {
      margin: 15px;
      padding: 24px 10px 30px;
    }
    .about__logo-slider {
      margin-bottom: 24px;
    }
    .about__box-wrap {
      padding: 10px;
      text-align: center;
    }
  
    .about_logo img {
      max-width: 250px;
    }
  
    .about__card {
      padding: 15px;
    }
    .about__card .mb-60 {
      margin-bottom: 20px;
    }
    .about__title {
      font-size: 27px;
      font-weight: 500;
      line-height: 28px;
      letter-spacing: 0em;
      margin-bottom: 30px;
    }
    .about__description {
      font-family: var(--plus-jakarta-font);
      font-size: 1.25rem;
      font-weight: 400;
      line-height: 2rem;
      text-align: justify;
      letter-spacing: 0.005em;
      margin-bottom: 20px;
    }
    .about__title_bw{
      width:70%;
      display: flex;
      justify-content: center;
    }
    .about__title_bw img{
      padding: 5px;
      width:70%;
      max-width: 70%;
    }
  }
  .section__header {
    font-size: 2.4rem;
    line-height: 2.5rem;
    margin-bottom: 10px;
    font-weight: 600;
  }
  @media (min-width: 1024px) {
    .section__header{
      font-size: 2.4rem;
      line-height: 2.5rem;
      margin-bottom: 10px;
      font-weight: 600;
    }
  
  }
  @media screen and (min-width:768px) and (max-width: 1023px) {
    .section__header{
        font-size: 2rem;
        font-weight: 500;
        line-height: 2.2rem;
        letter-spacing: 0em;
    }
  }
  @media (max-width: 767px) {
    .section__header{
        font-size: 1.8rem;
        font-weight: 500;
        line-height: 2rem;
        letter-spacing: 0em;
    }
  }
  
  .img__gallery_div{
    width:260px;
    height: 170px;
    text-align:center;
    display: block;
    padding:0px;
    background-color: var(--secondary-color);
    box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
    border-radius: 20px;
    color:white;
    text-align: center;
    justify-content: center;
    font-weight: 500;
    letter-spacing: 1px;
    transition: all 0.3s ease-in-out;
    text-transform: uppercase;
  }
  /*.img__gallery_div:hover{
    transform: scale(1.2);
  }*/
  .img_des{
    font-size:1.2rem; margin-left:0px;
    line-height: 1.3rem;
  }
  .image_gallery_container{
    display: none;
  }
  .img__gallery_row{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    justify-items: center;
  }
  .img_gallery{
    border: solid var(--gray-color);
    border-width: 4px;
    border-radius: 20px;
  }
  .img_button_div{
    display: flex;
    flex-direction: row;
    align-content: space-between;
    justify-content: space-around;
  }
.img__button .video__button {
    width: 160px;
    height: fit-content;
    background-color: var(--white-color);
    border: solid var(--secondary-color);
    border-radius: 40px;
    cursor: pointer;
    color: #58595B;
    text-align: center;
    padding: 0.5rem;
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 10px;
}
.video__button .img__button:hover {
    background-color: var(--secondary-color);
    color: var(--white-color);
}
  
   @media screen and (min-width:1024px)  {
    .img__gallery_div{
      width:260px;
      height: 170px;
      text-align:center;
      display: block;
      padding:0px;
      background-color: var(--secondary-color);
      box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
      border-radius: 20px;
      color:white;
      text-align: center;
      justify-content: center;
      font-weight: 500;
      letter-spacing: 1px;
      transition: all 0.5s ease-in-out;
      text-transform: uppercase;
    }
    /*.img__gallery_div:hover{
      transform: scale(1.2);
    }*/
    .img_des{
      font-size:1.2rem; margin-left:0px;
      line-height: 1.3rem;
    }
    .image_gallery_container{
    display: none;
  }
    .img__gallery_row{
      display: flex;
      
      justify-content: space-evenly;
      justify-items: center;
    }
    .img_gallery{
      border: solid var(--gray-color);
      border-width: 4px;
      border-radius: 20px;
    }
    .img_button_div{
      display: flex;
      flex-direction: row;
      align-content: space-between;
      justify-content: space-around;
    }
    .video__button .img__button {
        width: 170px;
        height: fit-content;
        background-color: var(--white-color);
        border: solid var(--secondary-color);
        border-radius: 40px;
        cursor: pointer;
        color: #58595B;
        text-align: center;
        padding: 0.5rem;
        font-size: 1rem;
        font-weight: 500;
        margin-bottom: 10px;
    }
        .video__button .img__button:hover {
            background-color: var(--secondary-color);
            color: var(--white-color);
        }
  }
  @media screen and (min-width:768px) and (max-width:1024px) {
    .img__gallery_div{
      max-width:170px;
      max-height: 120px;
      text-align:center;
      display: block;
      padding:0px;
      background-color: var(--secondary-color);
      box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
      border-radius: 20px;
      color:white;
      text-align: center;
      justify-content: center;
      font-weight: 500;
      letter-spacing: 0.5px;
      transition: all 0.3s ease-in-out;
      text-transform: uppercase;
    }
    /*.img__gallery_div:hover{
      transform: scale(1.2);
    }*/
    .img_des{
      font-size:1rem; margin-left:0px;
      line-height: 1.5rem;
      padding: 10px;
    }
    .image_gallery_container{
    display: none;
  }
    .img__gallery_row{
      display: flex;
      justify-content: space-evenly;
      justify-items: center;
      align-items: center;
    }
    .img_gallery{
      border: solid var(--gray-color);
      border-width: 4px;
      border-radius: 20px;
    }
    .img_button_div{
      display: flex;
      flex-direction: row;
      align-content: space-between;
      justify-content: space-around;
    }
    .video__button .img__button {
        width: 125px;
        height: fit-content;
        background-color: var(--white-color);
        border: solid var(--secondary-color);
        border-radius: 40px;
        cursor: pointer;
        color: #58595B;
        text-align: center;
        padding: 0.5rem;
        font-size: 0.8rem;
        font-weight: 500;
        margin-bottom: 10px;
    }
        .video__button .img__button:hover {
            background-color: var(--secondary-color);
            color: var(--white-color);
        }
  }
  @media screen and (min-width:601px)  and  (max-width:767px) {
    .img__gallery_div{
      width:150px;
      height: 110px;
      text-align:center;
      display: block;
      margin:1rem;
      background-color: var(--secondary-color);
      box-shadow: rgba(0, 174, 239, 0.6) 0px 8px 19px;
      border-radius: 20px;
      color:white;
      text-align: center;
      justify-content: center;
      font-weight: 500;
      letter-spacing: 1px;
      transition: all 0.3s ease-in-out;
      text-transform: uppercase;
    }
    .img__gallery_div:hover{
      transform: scale(1.2);
    }
    .img_des{
      font-size:0.85rem; margin-left:0px;
      line-height: 1.4rem;
    }
    .image_gallery_container{
    display: none;
  }
    .img__gallery_row{
      margin-bottom: 0;
      margin-top: 0;
      
      display: flex;
      flex-direction: row;
      align-items: center;
    }
    .img_gallery{
      border: solid var(--gray-color);
      border-width: 4px;
      border-radius: 20px;
    }
    .img_button_div{
      display: flex;
      align-content: space-evenly;
      justify-content: space-around;
    }
    .video__button .img__button {
        width: 170px;
        height: fit-content;
        background-color: var(--white-color);
        border: solid var(--secondary-color);
        border-radius: 40px;
        cursor: pointer;
        color: #58595B;
        text-align: center;
        padding: 0.25rem;
        font-size: 0.8rem;
        font-weight: 500;
        margin-bottom: 10px;
    }
        .video__button .img__button:hover {
            background-color: var(--secondary-color);
            color: var(--white-color);
        }
  }
  @media screen  and  (max-width:600px) {
    .img__gallery_row{
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .img__gallery_div{
      margin-bottom: 1rem;
    }
  }
/* ------------category ownership ------------ */
.ownership__suite{
  padding: 20px 20px;
  display: flex;
  text-align: center;
  margin-left: 60px;
  flex-direction: row;
  justify-content: space-around;
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  letter-spacing: 0em;

}
.suite__box{
  position: relative;
  width:40%;
  height: 75px;
  font-size: 1.5rem;
  color:var(--white-color);
  padding: 5px;
  cursor: pointer;
  border-radius: 20px;
  background: var(--secondary-color);
  box-shadow: -10px 0px 10px 5px rgba(0, 0, 0, 0.1);
  transition: all .2s ease-in-out;
}
.suitebox_down{
  max-width:95%;
  border-radius:  0 0 20px  20px;
  font-size: 1.5rem;
  font-weight: 500;
  padding: 0.6rem;
  color: var(--black-color);
  position: absolute;
  bottom: 0;
  background: #F2F9FE;
  transition: all .2s ease-in-out;
}
.suitebox_down:hover{
  background-color: var(--secondary-color);
  color: white;
  letter-spacing: 0.1rem;
  font-size: 1.8rem;
}
.suite__box:hover{
  background-color: var(--secondary-color);
  color: black;
  letter-spacing: 0.1rem;
  font-size: 1.8rem;
}
/* .div_grow  .suite__box{
    display: inline-block;
    &.grow {
      transition: all .2s ease-in-out;
      &:hover {
        transform: scale(1.5);
      }
    }
} */
@media screen and (max-width:420px) {
  .ownership__suite{
    width: 100%;
    margin: 0px !important;
  }
  .suitebox_down{
    max-width: 92%;
  }
  .suite__box{
    font-size: 0.9rem !important;
  }
  .poster-img-wrap{
    max-width: 100%;
  }
  .suitebox_down:hover{
    font-size: 1rem !important;
  }
  .suite__box:hover{
    font-size: 0.95rem !important;
    letter-spacing: 0.04rem !important;
  }
}
@media (max-width: 600px) {
  .ownership__suite{
    width: 100%;
    margin: 0px !important;
  }
  .poster-img-wrap{
    max-width: 100% !important;
  }
  .suite__box{
    position: relative;
    width:100%;
    height: 120px;
    padding: 5px;
    font-size: 1.1rem !important;
    font-weight: 500;
    line-height: 16px;
  }
  .suitebox_down{
    font-size: 1.1rem !important;
  }
  .suitebox_down:hover{
    font-size: 1.4rem !important;
  }
  .suite__box:hover{
    font-size: 1.4rem !important;
  }
}
@media (max-width: 991px) {
  .poster-img-wrap{
    max-width: 100%;
  }
  .invest-section{
    margin-bottom: 40px;
  }
  .invest__container{
    padding: 30px 15px 30px;
  }
  .invest__title{
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0em;
    text-align: center;
    margin-bottom: 15px;
  }

  .invest__description{
    max-width: 100%;
    text-align: center;
  }

  

  .video__play-btn svg{
    width: 40px;
    height: 40px;
  }
  
  .ownership__suite{
    width: 100%;
    margin: 0px !important;
    padding: 20px 20px;
    display: flex;
    text-align: center;
    flex-direction: row;
    justify-content: space-around;
    font-size: 30px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0em;
  
  }
  .suite__box{
    position: relative;
    width:40%;
    height: 80px;
    color:var(--white-color);
    padding:  5px;
    cursor: pointer;
    border-radius: 20px;
    font-size: 1.5rem;
    background: var(--secondary-color);
    box-shadow: -10px 0px 10px 5px rgba(0, 0, 0, 0.1);
  
  }
  .suitebox_down{
    width:100% !important;
    border-radius:  0 0 20px  20px;
    color: var(--black-color);
    height: 15px;
    background: #F2F9FE;
  }

}
@media (max-width: 1080px) {
  
  .ownership__suite{
    width: 100%;
    margin: 0px !important;
    padding: 10px 10px;
    display: flex;
    text-align: center;
    flex-direction: row;
    justify-content: space-around;
  }
  .suite__box{
    position: relative;
    width:45%;
    height: 60px;
    color:var(--white-color);
    padding: 5px;
    font-size: 1.4rem;
    line-height: 2rem;
    cursor: pointer;
    border-radius: 20px;
    background: var(--secondary-color);
    box-shadow: -10px 0px 10px 5px rgba(0, 0, 0, 0.1);
  
  }
  .suitebox_down{
    width:100%;
    border-radius:  0 0 20px  20px;
    color: var(--black-color);
    height: 35px;
    font-size: 1.4rem;
    line-height: 2rem;
    background: #F2F9FE;
  }
  .suitebox_down:hover{
    font-size: 1.6rem !important;
  }
  .suite__box:hover{
    font-size: 1.6rem !important;
  }
}
@media (min-width: 1025px) {
  .ownership__suite{
    padding: 10px 10px;
    width: 100%;
    display: flex;
    text-align: center;
    margin: 0px;
    flex-direction: row;
    justify-content: space-around;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0em;
  
  }
  .suite__box{
    position: relative;
    width:45%;
    height: 60px;
    color:var(--white-color);
    padding: 5px;
    cursor: pointer;
    border-radius: 20px;
    background: var(--secondary-color);
    box-shadow: -10px 0px 10px 5px rgba(0, 0, 0, 0.1);
  
  }
  .suitebox_down{
    width:100%;
    border-radius:  0 0 20px  20px;
    color: var(--black-color);
    height: 35px;
    background: #F2F9FE;
  }
}
.btn_event_ct{
  width: fit-content;
  padding: 0.5rem 1rem ;
  border-radius: 2rem;
  margin: 2rem;
  background-color: var(--white-color);
  color: var(--secondary-color);
  border: solid var(--secondary-color) 0.1rem ;
  transition: all 0.3s ease-in-out;
}
.btn_event_ct:hover{
  background-color: var(--secondary-color);
  color: var(--white-color);
  
}
@media screen and (max-width:767px) {
  .btn_event_ct span{
    font-size:1.2rem ;
  }
}
@media screen and (min-width:768px) and (max-width:1023px) {
  .btn_event_ct span{
    font-size:1.4rem ;
  }
}
/* -------------bay hills page end -------------- */



/* ----------------amin city start -------------- */
/* Hero img amin city start  */
.hero_image_header_aminCity {
    /*  This creates an image overlay  */
    background: url("../assets/amincityhero1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* to ensure the image takes up the entire viewport */
    height: 70vh;
    position: relative;
    margin-bottom: 1rem;
}

@media screen and (max-width:767px) {
    .hero_image_header_aminCity {
        height: 50vh;
    }
}

/* Hero img amin city end  */


.ownership__category{
  padding: 20px 20px;
  display: flex;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  letter-spacing: 0em;

}
.category__box{
  position: relative;
  width:70%;
  height: 40px;
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  color:#333;
  padding: 5px;
  margin: 1.5rem;
  cursor: pointer;
  border-radius: 8px;
  background:   #07f57a;
  box-shadow: -10px 0px 10px 5px rgba(0, 0, 0, 0.1);
  
}
.categorybox_down{
  max-width:60px;
  width: 50px;
  height: 40px;
  position: absolute;
  border-radius:  8px;
  position: absolute;
  bottom: 0;
  left: 0;
  border: solid 3px white;
  background: palevioletred;
  transition: all .2s ease-in-out;
}
@media screen and (min-width: 768px) and (max-width: 1023px){
.ownership__category {
    align-items: center;
}
.category__box {
  width: 50% !important;
}
.category_flex {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
}
@media screen and (max-width: 767px){
.ownership__category {
    align-items: center;
    margin-top: 0 !important;
}
.category__box {
  font-size: 1.3rem !important;
  width: 60% !important;
}
.category_flex {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
}
/* ----------right decision start------- */
.flex {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
}
@media screen and (max-width:991px) {
  .flex .card {
    width: 100%;
    max-width: calc(100% / 2 - 1rem) !important;
  }
}
@media screen and (max-width:600px) {
  .flex .card {
    width: 100%;
    max-width: calc(100% / 1 - 1rem) !important;
  }
}
.flex .card {
  width: 100%;
  max-width: calc(100% / 3 - 1rem);
  padding: 1rem;
  background-color: #fff;
  height: 10rem;
  border-radius: 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  cursor: pointer;
  position: relative;
  z-index: 1;
  transition: all .3s ease-in;
}
.flex .card::after{
  content: '';
  background-color: #038A45;
  border-radius: 1rem;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top:0;
  z-index: 0;
  clip-path: circle(10% at 0% 0%);
}


.flex .card img{
  width: 50px;
}
.flex .card .card_discription{
  display: flex;
  flex-direction: column;
  font-family: var(--plus-jakarta-font);
  padding: 1rem;
  text-align: start;
}
.card_discription .card_header{
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 2rem;
  color: #000;
  
}
.card_discription .card_subtitle{
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.5rem;
  color: #333;
  
}
@media screen and (max-width:767px) {
  .about__subhead .subhead__p{
    font-size: 1.2rem !important;
  }
  
}
.about__subhead{
  width: 100%;
  padding: 15px 10px 15px;
  font-family: var(--plus-jakarta-font);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 2rem;
  background-color: var(--secondary-color);
  border-radius: 15px;
  margin-bottom: 2rem;
}
.about__subhead .subhead__p{
  color: var(--white-color);
  text-align: center;
  font-size: 1.4rem;
  line-height: 2rem;
  letter-spacing: 0.025em;
  
}
.subhead__para{
  color: #333;
  text-align: center;
  font-size: 1.4rem;
  line-height: 2rem;
  padding: 0.25rem 2rem;
  letter-spacing: 0.025em; 
}
/* ----------right decision end------- */

/* -----facilities start ------- */
@media screen and (max-width:767px) {
  .accordion_para img{
    width:20px !important;
    padding: 0;
    margin: 0;
  }
  .accordion_para{
    font-size: 0.8rem !important;
    width: 100%;
  }
}
@media screen and (max-width:539px) {
  .accordion_para img{
    display: none;
  }}
.accordion_para{
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  text-align: start;
  font-size: 1.3rem;
  line-height: 2rem;
  font-weight: 500;
}
.accordion_para img{
  width: 30px;
  padding: 0.5rem;
  margin: 0.5rem;
}
/* -----facilities end ------- */


/* ----------------amin city end -------------- */







/*--CSS New end different Pages -----*/











/*---------------------------------
     footer start 
  ---------------------------------*/

.footer-bg {
    position: relative;
    background-position: center;
    background: url("../image/footer.png") lightgray 50% / cover no-repeat;
    border-radius: 100px 100px 0px 0px;
    box-shadow: 0px 4px 80px 0px rgba(47, 150, 255, 0.8);
}
  .footer-top {
    padding-top: 200px;
    padding-bottom: 0px;
    
  }
  .footer__col{
    margin-top:40px;
  }
  .footer-menu {
    list-style: none;
    padding: 0;
    margin-top: 30px !important;
  }
  .footer-menu li a {
    color: var(--white-color);
    text-align: center;
    font-family: var(--poppins-font);
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.3px;
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  
  .footer-menu li a:hover {
    color: var(--yellow-color);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  .footer-menu li {
    margin-bottom: 0px;
  }
  .footer-menu li:last-child {
    margin-bottom: 0;
  }
  
  .footer-bottom {
    background-color: #0071bb;
    padding: 7px 18px;
  }
  
  .footer-bottom ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }
  
  .powered-by {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--body-font);
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: -0.30000001192092896px;
    text-align: center;
    color: var(--white-color);
  }
    .powered-by span:hover {
        color: var(--yellow-color);
        -webkit-transition: var(--transition);
        -moz-transition: var(--transition);
        -ms-transition: var(--transition);
        -o-transition: var(--transition);
        transition: var(--transition);
    }
    .powered-by a:hover img {
        opacity: 1;
        -webkit-animation: flash 1.5s;
        animation: flash 3s;
    }

@-webkit-keyframes flash {
    0% {
        opacity: .4;
    }

    100% {
        opacity: 1;
    }
}

@keyframes flash {
    0% {
        opacity: .4;
    }

    100% {
        opacity: 1;
    }
}
  .copyright {
    font-family: var(--body-font);
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: -0.30000001192092896px;
    color: var(--white-color);
  }
  
  .privacy-menu {
    display: flex;
    flex-direction: column;
    justify-content: start;
  }
  
  .privacy-menu a {
    font-family: var(--body-font);
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: -0.30000001192092896px;
    color: var(--white-color);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  .privacy-menu a:hover {
    color: var(--yellow-color);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  
  @media (max-width: 1600px) {
    .payment-icon img {
      max-width: 745px;
    }
    .powered-by img {
      max-width: 138px;
    }
  }
  @media (max-width: 1366px) {
    .payment-icon img {
      max-width: 600px;
    }
    .powered-by img {
      max-width: 112px;
      height: 20px;
    }
  }
  @media (max-width: 1170px) {
    .payment-icon img {
      max-width: 545px;
    }
  }
  
  @media (max-width: 1080px) {
    .payment-icon img {
      max-width: 430px;
    }
    .powered-by img {
      max-width: 91px;
      height: 20px;
    }
  }
  
  .footer__desktop {
    display: block;
  }
  .footer__mobile {
    display: none;
  }
  @media (max-width: 991px) {
    .footer__desktop {
      display: none;
    }
  
    .footer__mobile {
      display: block;
    }
  }
  
  .social-list {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 12px;
    margin-bottom: 5px;
  }
  
  .social-list li > a svg path {
    
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);



    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    filter: none; 
    -webkit-transition: all .6s ease;
    opacity: 1;

  }
  .social-list li > a:hover svg path {
    
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);




    opacity: 0.5;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    filter: gray ;
  }
  
  .subscribe-form {
    border-radius: 70px;
    box-shadow: 0px 4px 4px 0px #0000004d inset;
    box-shadow: 0px -4px 4px 0px #0000004d inset;
    height: 40px;
    background-color: #f1efef;
    align-items: center;
    margin-top: 5px;
  }
  .subscribe-form input {
    background: transparent;
    border: 0;
    outline: 0;
    border-radius: 70px;
    font-family: var(--poppins-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 27px;
    letter-spacing: -0.30000001192092896px;
    color: #1a477ab2;
    height: 30px;
    padding-right: 15px;
  }
  .subscribe-form .form-control:focus {
    border: 0;
    outline: 0;
    background: transparent;
    border-radius: 70px;
    color: #1a477ab2;
    box-shadow: none;
  }
  
  .subscribe-form input::placeholder {
    font-family: var(--poppins-font);
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    line-height: 27px;
    letter-spacing: -0.30000001192092896px;
    color: #1a477ab2;
  }
  
  .subscribe-form input::-webkit-input-placeholder {
    font-family: var(--poppins-font);
    font-size: 16px;
    font-weight: 500;
    line-height: 27px;
    letter-spacing: -0.30000001192092896px;
    color: #1a477ab2;
  }
  
  .subscribe-form .btn-subscribe {
    background-color: #1a477a;
    font-family: var(--poppins-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 27px;
    letter-spacing: -0.30000001192092896px;
    text-align: center;
    height: 33px;
    margin-right: 4px;
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
    border: 0;
  }
  
  .subscribe-form .btn-subscribe:hover {
    background-color: var(--yellow-color);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
    border: 0;
    color: var(--white-color);
  }
  
  .button-group {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 33px;
    padding: 0;
    background: #fff;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
    border-radius: 200px;
    position: relative;
    max-width: 130px;
    margin: 0 0 0 auto;
  }
  .button-group::before {
    content: "";
    position: absolute;
    width: 50%;
    bottom: 0;
    top: 0;
    left: 0;
    border-radius: 100px;
    background-image: radial-gradient(89% 83%, #f48444 10%, #f48444 100%);
  }
  .button-group.left::before {
    transform: translatex(0);
    transition: all 0.3s cubic-bezier(1, -0.01, 0, 1.01);
  }
  .button-group.right::before {
    transform: translatex(calc(100% - 0px));
    transition: all 0.3s cubic-bezier(1, -0.01, 0, 1.01);
  }
  .button-group .button {
    width: 50%;
    height: 33px;
    text-align: center;
    position: relative;
    z-index: 1;
    cursor: pointer;
    color: #1a477a;
    transition: color 0.3s cubic-bezier(1, -0.01, 0, 1.01);
    font-family: var(--poppins-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 23px;
    letter-spacing: -0.30000001192092896px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .button-group .button.active {
    color: #fff;
    transition: color 0.3s cubic-bezier(1, -0.01, 0, 1.01);
  }
  
  .pl-30p {
    padding-left: 30%;
  }
  
  .pl-15p {
    padding-left: 15%;
  }
  
  .footer-mobile-bg {
    position: relative;
  }

    .footer-mobile-bg::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background-position: center;
        background: url("../assets/footer.png") lightgray 50% / cover no-repeat;
        border-radius: 50px 50px 0px 0px;
        box-shadow: 0px 4px 30px 0px rgba(47, 150, 255, 0.3);
    }
  
  .footer-top__mobile{
    position: relative;
    z-index: 1;
  }
  .footer__mobile .footer-bottom {
    background-color: #071E3E;
  }
  
  .footer-bottom__mobile{
    position: relative;
    z-index: 1;
    background-color: #071E3E;
  }
  
  .footer-top__mobile {
    position: relative;
    z-index: 1;
  }
  
  .footer__mobile-flex{
    height: 400px;
    display: flex;
    align-items: end;
    justify-content: center;
  }
  
  .footer-top__menu{
    position: relative;
    z-index: 1;
    padding: 10px 0;
    background: -webkit-linear-gradient(89deg, hsla(212, 65%, 29%, 0.6) 0%, hsla(209, 94%, 87%, 0.4) 100%);
  }
  
  .footer-bottom__mobile{
    padding: 15px 0;
  }
  
  @media (max-width: 991px) {
  
    .footer-bottom__mobile .payment-icon img {
      max-width: 100%;
  }
  .footer-mobile__inner {
    padding: 6px 10px 10px;
  }
  
    .footer-menu{
      column-count: 2;
      column-gap: 40px;
    }
    .footer-menu li {
      border-bottom: 2px solid var(--white-color);
      margin-bottom: 5px;
      padding-bottom: 5px;
    }
    .footer-menu li a {
        font-size: 16px;
        line-height: 20px;
        font-weight: 400;
        margin-left: 15px;
    }
  
  
    .social-list {
      margin-top: 5px;
      margin-bottom: 5px;
      justify-content: center;
  }
  
  .subscribe-form {
    margin-top: 0;
    margin-bottom: 10px;
  }
  .button-group {
  
    justify-content: center;
    max-width: 159px;
    margin: 0 auto;
  }
  
  .button-group {
    height: 35px;
  }
  .button-group .button {
    height: 35px;
  }
  
  .powered-by {
    justify-content: center;
    margin:  5px 0;
  }
  .privacy-menu {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 16px;
    margin: 5px 0;
  }
  
  .copyright{
    text-align: center;
  }
  .social-list li > a svg path {
    
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);



    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    filter: none; 
    -webkit-transition: all .6s ease;
    opacity: 1;

  }
  .social-list li > a:hover svg path {
    
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);




    opacity: 0.5;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    filter: gray ;
  }
  }
  