html, body {
  background: black;
  overflow-y: unset!important;
  overflow-x: hidden;
}
.fancynavbar {
  position: fixed;
  top: 0;
  z-index: 10000;
  width: 100%;
  font-family: Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
}

@media (min-width: 992px) {
  .fancynavbar {
      right:0;
      height: 100vh;
      width: 4.375rem
  }

  .fancynavbar.fancynavbar-left {
      left: 0;
      right: auto
  }
}

.fancynavbar-togglerbar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between
}

@media (max-width: 991.98px) {
  .fancynavbar-togglerbar {
      background-color: rgba(0,0,0,.9);
      -webkit-box-align:center;
      -ms-flex-align: center;
      align-items: center;
      height: 3rem
  }
}

@media (min-width: 992px) {
  .fancynavbar-togglerbar {
      height:100%;
      text-align: center;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      background-color: #000;
      padding-top: .5rem;
      padding-bottom: .5rem
  }

}

.fancynavbar-brand {
  color: #fff;
  padding: .5rem 1rem
}

.fancynavbar-brand-img {
  opacity: 1!important
}
@media (max-width: 991.98px) {
  .fancynavbar-brand-img {
      height: 2em;
  }
}


.fancynavbar-toggler {
  cursor: pointer;
  width: 4.375rem;
  height: 4.375rem;
  opacity: 1!important
}

@media (max-width: 991.98px) {
  .fancynavbar-toggler {
      -webkit-transform:translateY(4%);
      -ms-transform: translateY(4%);
      transform: translateY(4%)
  }
}

.fancynavbar-toggler-icon path {
  fill: none;
  stroke: #fff;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2px
}

.fancynavbar-addon {
  padding-left: 0
}

@media (max-width: 991.98px) {
  .collapsed .fancynavbar-addon {
    display:none!important;
    opacity: 0;
  }
  .show .fancynavbar-addon {
    animation: fancynavbar-addon-zanim-lg 0.8s 0.7s 1 alternate forwards;
    animation-timing-function: cubic-bezier(.77, 0, .18, 1);

    position: fixed;
    bottom: 15px;
    left: 30px;
    padding-left: 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
   
    opacity: 0;
    .fancynavbar-addon-item {
      margin-left: 12px;
      margin-right: 12px;
      img {
        bottom: 3px!important;
        
      }
    }
    transition: opacity 0.3s ease-in-out;
  }
}

.fancynavbar-addon-item {
  display: block;
  color: #fafafa;
  margin-top: .5rem;
  font-size: 1.333rem;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.fancynavbar-addon-item:focus,.fancynavbar-addon-item:hover {
  color: rgba(250,250,250,.75)
}

.fancynavbar-collapse {
  height: 100vh;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
  position: absolute;
  text-align: left;
  width: calc(40vw - 2.1875rem);
  right: calc(50% + 2.1875rem);
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  top: 0;
  padding: 0;
  z-index: -1;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  background-color: #000;
  opacity: .92
}

@media (max-width: 991.98px) {
  .fancynavbar-collapse {
      width:100vw;
      top: 3rem;
      right: 0;
      height: calc(100vh - 3rem)
  }
}

@media (min-width: 992px) {
  .fancynavbar-collapse {
      padding-left:4.375rem;
      padding-right: 4.375rem
  }
}

.fancynavbar-left .fancynavbar-collapse {
  left: calc(50% + 2.1875rem);
  right: auto
}

@media (max-width: 991.98px) {
  .fancynavbar-left .fancynavbar-collapse {
      left:0
  }
}

.fancynavbar-nav {
  height: auto;
  width: 100%;
  list-style-type: none;
  list-style-image: none;
  padding-left: 1rem;
  padding-right: 1rem;
  margin: auto 0
}

@media (min-width: 992px) {
  .fancynavbar-nav {
      padding-left:0;
      padding-right: 0
  }
}

.fancynav-link {
  position: relative;
  display: block;
  font-size: 1.777rem
}

@media (min-width: 576px) and (max-width:991.98px) {
  .fancynav-link {
      font-size:2.369rem
  }
}

@media (min-width: 1200px) {
  .fancynav-link {
      font-size:2.369rem
  }
}

@media (min-width: 992px) {
  .fancynav-link {
      padding-right:3rem;
      padding-left: 3rem
  }
}

.fancynav-link:before {
  content: '';
  position: absolute;
  height: 2px;
  width: 0;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 2px;
  -webkit-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
  background-color: rgba(255,255,255,.5);
  z-index: 0
}

.fancynav-link.fancy-dropdown-toggle .fancynav-link-content {
  padding-right: 3rem
}

.fancynav-link.fancy-dropdown-toggle .fancynav-link-content:after {
  position: absolute;
  left: calc(100% - 2.1875rem);
  top: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12.33 7.03"><defs><style>.cls-1{fill:rgba(255, 255, 255, 0.85);}</style></defs><title>Asset 9sparrow</title><g id="Layer_2" data-name="Layer 2"><g id="Capa_1" data-name="Capa 1"><path class="cls-1" d="M6.17,7a.86.86,0,0,1-.61-.25L.25,1.47A.86.86,0,1,1,1.47.25L6.17,4.95,10.86.25a.86.86,0,0,1,1.22,1.22l-5.3,5.3A.86.86,0,0,1,6.17,7Z"/></g></g></svg>');
  text-align: center;
  color: #fff;
  width: 15px;
  height: 10px;
  background-color: transparent;
  z-index: 99;
  
}

.fancynav-link.show:before {
  width: 100%
}

.fancynav-link.show .fancynav-link-content:after {
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.5 9.41"><defs><style>.cls-1{fill:rgba(255, 255, 255, 0.85);}</style></defs><title>Asset 6sparrow</title><g id="Layer_2" data-name="Layer 2"><g id="Capa_1" data-name="Capa 1"><path class="cls-1" d="M8.25,0a1.15,1.15,0,0,1,.82.34l7.09,7.09a1.16,1.16,0,0,1-1.63,1.63L8.25,2.79,2,9.07A1.16,1.16,0,1,1,.34,7.43L7.43.34A1.15,1.15,0,0,1,8.25,0Z"/></g></g></svg>')
}

.fancynav-link-content {
  color: rgba(255,255,255,.85);
  background-color: #000;
  display: inline-block;
  padding-left: 1rem;
  padding-right: 1rem;
  position: relative;
  z-index: 1;
  white-space: nowrap;
}

.fancynav-item {
  overflow: hidden;
  -webkit-transition: height .4s cubic-bezier(.77,0,.18,1);
  -o-transition: height .4s cubic-bezier(.77,0,.18,1);
  transition: height .4s cubic-bezier(.77,0,.18,1);
  height: 41px
}

@media (min-width: 576px) and (max-width:991.98px) {
  .fancynav-item {
      height:54px
  }
}

@media (min-width: 1200px) {
  .fancynav-item {
      height:54px
  }
}

.fancynav-item:focus .fancynav-link-content,.fancynav-item:hover .fancynav-link-content {
  text-decoration: none;
  color: #fff
}

.fancynav-item:focus .fancynav-link:before,.fancynav-item:hover .fancynav-link:before {
  width: 100%
}

.fancy-dropdown-menu {
  -webkit-transition: height .2s cubic-bezier(.77,0,.18,1);
  -o-transition: height .2s cubic-bezier(.77,0,.18,1);
  transition: height .2s cubic-bezier(.77,0,.18,1)
}

/* scrolled scenario */
/* Paths - cross / burger */
#path-middle {
  transition: all .2s cubic-bezier(.77,0,.18,1);
}
#path-top,  #path-bottom {
  transition: all .6s cubic-bezier(.77,0,.18,1);
}
#path-top {
  stroke-dasharray: 30px, 88px; stroke-dashoffset: 0px;
}
.show #path-top {
  stroke-dasharray: 30px, 88px; stroke-dashoffset: -81px;
}
#path-middle {
  stroke-dasharray: 30px, 30px; stroke-dashoffset: 0px;
}
.show #path-middle {
  stroke-dasharray: 0px, 30px; stroke-dashoffset: -15px;
}

#path-bottom {
  stroke-dasharray: 30px, 88.1px; stroke-dashoffset: -88px;
}
.show #path-bottom {
  stroke-dasharray: 30px, 88.1px; stroke-dashoffset: -6px;
}
/*  ----  */

.fancynavbar-addon {
  animation: fancynavbar-addon-zanim-lg 0.8s 0.4s 1 alternate forwards;
  animation-timing-function: cubic-bezier(.77,0,.18,1);

  /* data-zanim-lg='{"from":{"opacity":0,"x":45},"to":{"opacity":1,"x":0},"ease":"CubicBezier","duration":0.8,"delay":0.4}' data-zanim-trigger="scroll" */
}

@keyframes fancynavbar-addon-zanim-lg {
  0%   { opacity: 0; right: 45px }
  100% { opacity: 1; right: 0px }
}

.fancynavbar-toggler-icon {
  animation: fancynavbar-toggler-icon-zanim-lg 0.8s 0.5s forwards;
  animation-timing-function: cubic-bezier(.77,0,.18,1);
}
@keyframes fancynavbar-toggler-icon-zanim-lg {
  0%   { opacity: 0; right: 45px }
  100% { opacity: 1; right: 0px }
}
.fancynavbar-brand-img {
  animation: fancynavbar-brand-img-zanim-lg 0.8s 0.3s 1 alternate forwards;
  animation-timing-function: cubic-bezier(.77,0,.18,1);
}
@keyframes fancynavbar-brand-img-zanim-lg {
  0%   { opacity: 0; right: 45px }
  100% { opacity: 1; right: 0px }

}

.fancynavbar {
  transition: all 0.8s 0.3s cubic-bezier(.77,0,.18,1);
}
.fancynavbar-collapse {
  transition: all 0.8s 0.3s cubic-bezier(.77,0,.18,1);
}
@media (min-width: 992px) {
  .fancynavbar-collapse {
    transform: translate(100%, 0%) matrix(1, 0, 0, 1, 0, 0);
  }
  .show .fancynavbar-collapse {
    transform: matrix(1, 0, 0, 1, 0, 0);
  }
}
@media (max-width: 991.98px) {

  .fancynavbar-collapse {
    transform: translate(100%, 0%) matrix(1, 0, 0, 1, 0, 0);
  }

  .show .fancynavbar-collapse {
    transform: matrix(1, 0, 0, 1, 0, 0);
  }


  .fancy-dropdown-menu {
      margin-left:.5rem;
      margin-right: .5rem;
      padding-right: 1.8rem;
      padding-left: 1.8rem
  }
}

@media (min-width: 992px) {
  .fancy-dropdown-menu {
      padding-right:4rem;
      padding-left: 4rem
  }
}

.fancy-dropdown-item {
  color: rgba(255,255,255,.6);
  font-weight: 700;
  display: block;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.fancy-dropdown-item:focus,.fancy-dropdown-item:hover {
  color: #fff;
  text-decoration: none
}

@media (min-width: 992px) {
  .has-sidemenu .main {
      width:calc(100% - (4.375rem - .0625rem))
  }
}

@media (min-width: 992px) {
  .has-sidemenu .footer {
      width:calc(100% - 4.375rem)
  }

  .has-sidemenu .remodal {
      right: 2.1875rem
  }
}

@media (min-width: 992px) {
  .has-sidemenu-left .footer,.has-sidemenu-left .main {
      margin-left:4.375rem
  }
}

.ie .fancynav .fancynavbar {
  height: 100vh
}

@media (max-width: 991.98px) {
  .ie .fancynav .fancynavbar {
      height:calc(100vh - 3rem)
  }
}

.ie .fancynav .fancynavbar .fancynavbar-content {
  height: 100vh
}

@media (max-width: 991.98px) {
  .ie .fancynav .fancynavbar .fancynavbar-content {
      height:calc(100vh - 3rem)
  }
}
.fancynavbar-addon {
  display: inline-block; /* Ensure it behaves properly with inline elements */
  
}
.clickable {
  position: relative; /* Absolutely position the tooltip */
  cursor: pointer;
  outline: none;
}

.tooltip-text {
  position: absolute; /* Absolutely position the tooltip */
  top: 50%; /* Align vertically to the middle of the icon */
  left: 4px; /* Adjust the horizontal position to be left of the icon */
  transform: translate(-100%, -50%); /* Center vertically */
  background-color: rgba(0, 0, 0, 1); /* Dark background */
  color: #fff; /* White text */
  padding: 5px 10px; /* Add spacing inside the tooltip */
  border-radius: 5px; /* Rounded corners */
  white-space: nowrap; /* Prevent wrapping */
  font-size: 1rem; /* Tooltip font size */
  visibility: hidden; /* Hide by default */
  opacity: 0; /* Fully transparent by default */
  transition: opacity 0.3s ease, visibility 0.3s ease; /* Smooth appearance */
  z-index: 10; /* Ensure it appears above other elements */
}
@media (max-width:991.98px) {
  .tooltip-text {
    top: -0px; /* Align vertically to the middle of the icon */
    left: 50%; /* Adjust the horizontal position to be left of the icon */
    transform: translate(-50%, -100%); /* Center vertically */
  }
}
.clickable:hover .tooltip-text {
  visibility: visible; /* Show the tooltip on hover */
  opacity: 1; /* Make it fully opaque */
}


/* Overlay styles */
#donation-overlay.hide {
  opacity: 0;
  display: none;
}
#donation-overlay {
  position: fixed;
  display: flex;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 99999;
  justify-content: center;
  align-items: center;
  opacity: 1;
  transition: all 0.8s 0.3s cubic-bezier(.77,0,.18,1);
}

#donation-overlay iframe {
  border: none;
  max-height: 600px;
  min-width: 400px;
  background: #fff;
  transition: all 0.8s 0.3s cubic-bezier(.77,0,.18,1);

}

#donation-overlay .close-button {
  position: absolute;
  top: 30px;
  left: 50%;
  width: 50px;
  height: 50px;
  transform: translate(-50%, -50%);
  font-size: 20px;
  color: white;
  cursor: pointer;
  background: rgba(0,0,0,.8);
  border: none;
  outline: none;
  border-radius: 25px;

}

