/* ----------- Overrides ----------- */
.btn-unido-blue {
  background-color: #009cdc !important;
  border-color: #009cdc !important;
}

.btn-unido-blue:active,
.btn-unido-blue:hover {
  background-color: #008ac3 !important;
  border-color: #008ac3 !important;
}

.btn-unido-orange {
  background-color: #f47a42 !important;
  border-color: #f47a42 !important;
}

.btn-unido-orange:active,
.btn-unido-orange:hover {
  background-color: #f26c55 !important;
  border-color: #f47a42 !important;
}

.bg-unido-blue {
  background-color: #009cdc !important;
}

.bg-unido-orange {
  background-color: #f47a42 !important;
}

.text-unido-blue {
  color: #009cdc;
}

.text-unido-orange {
  color: #f47a42;
}

.text-very-small {
  font-size: 0.7rem;
}

.darker-backdrop .modal-backdrop {
  opacity: .85;
}

.bg-light-subtle .fp-arrow.fp-prev::before,
.bg-light-subtle .fp-arrow.fp-next::before {
  color: #009cdc;
}

.bg-unido-blue .fp-arrow.fp-prev::before,
.bg-unido-blue .fp-arrow.fp-next::before {
  color: #000;
}

.fp-prev::before {
  content: "\F129";
}

.fp-next::before {
  content: "\F133";
}

.fp-watermark {
  display: none !important;
}

#fp-nav.fp-left {
  left: 0;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
  background-color: #f47a42;
}

.fp-arrow.fp-prev,
.fp-arrow.fp-next {
  border: none;
  opacity: 0.6;
  width: auto;
  font-size: 3em;
}

.fp-arrow.fp-prev {
  left: 2.5rem;
}

.fp-arrow.fp-next {
  right: 2.5rem;
}

.carousel-unido-orange .carousel-control-prev:hover,
.carousel-unido-orange .carousel-control-next:hover,
.fp-arrow.fp-prev:hover,
.fp-arrow.fp-next:hover {
  opacity: 1;
}

#fp-nav ul li .fp-tooltip {
  background-color: #f47a42;
  color: #fff;
  padding: 1px 2px;
  border-radius: 1px;
  box-shadow: rgba(0, 0, 0, 0.075) 0px 2px 4px 0px;
}

.old-ie-message {
  display: none;
}

/* ----------- Laoding ----------- */

#loading-status {
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: #000;
  z-index: 1200;
}

/* ----------- Nav toggles ----------- */

#nav-toggles {
  position: fixed;
  top: 1rem;
  right: 2rem;
  z-index: 998;
}

#nav-toggles .btn {
  background-color: rgba(0, 0, 0, .3);
  border-color: transparent;
}

#nav-toggles .btn:hover {
  background-color: rgba(0, 0, 0, .7);
}

#main-search-box,
#main-nav-box {
  width: 16rem;
}

.search-result-box.list-group .list-group-item,
.fp-menu-box.list-group .list-group-item {
  background-color: transparent;
  padding: 0;
}

.search-result-box.list-group .list-group-item:hover,
.fp-menu-box.list-group .list-group-item:hover,
.fp-menu-box.list-group .list-group-item.active {
  background-color: #009cdc;
}

.search-result-box.list-group .list-group-item a,
.fp-menu-box.list-group .list-group-item a {
  color: #fff;
  text-decoration: none;
  display: block;
  padding: .75rem 1.5rem;
}

/* ----------- Photo Lightbox ----------- 

#photo-lightbox .modal--footer-caption{
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0,0,0,.6);
  border-radius: 0;
} */

/* ----------- Home ----------- */

.video-in-background::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,.2);
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADAQMAAABs5if8AAAAA3NCSVQICAjb4U/gAAAABlBMVEUAAAD///+l2Z/dAAAAAnRSTlP/AOW3MEoAAAAJcEhZcwAAAuwAAALsAe0ztPoAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDQvMTMvMTGrW0T6AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M1cbXjNgAAAA5JREFUCJljSGBYwHAAAASGAcENz5GAAAAAAElFTkSuQmCC");
  z-index: 4;
}
.video-in-background .bg-video {
  position: absolute;
  right: 0;
  bottom: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-color: black;
  background-position: center center;
  background-size: contain;
  object-fit: cover;
  /*cover video background */
  z-index: 3;
}

.video-in-background .logo-wrap {
  position: absolute;
  z-index: 5;
  width: 100%;
  left: 3rem;
  top: 3rem;
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  width: 12rem;
  height: auto;
}

.video-in-background .layer{
  position: absolute;
  z-index: 5;
  width: 100%;
  left: 0;
  top: 43%;
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

/* ----------- Map ----------- */

.leaflet-map-fullscreen {
  width: 100%;
  height: 100%;
  background-color: #000;
}

.leaflet-popup-content-wrapper {
  border-radius: 0;
}

.leaflet-map-fullscreen .leaflet-map-attribution {
  position: absolute;
  bottom: .5rem;
  right: .5rem;
  z-index: 1100;
}

.leaflet-map-fullscreen .demo-plant-list-wrap {
  width: 12rem;
  position: absolute;
  bottom: 0;
  left: 0;
  max-height: 100%;
  overflow: hidden;
  z-index: 1200;
}

.leaflet-map-fullscreen .demo-plant-list-wrap .demo-plant-list-toggle {
  background-color: rgba(0, 156, 220, .8);
  text-align: left;
  pointer-events: auto;
}

.demo-plant-list-toggle::after {
  display: inline-block;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\F229';
}

.demo-plant-list-toggle.collapsed::after {
  content: '\F231';
}

.leaflet-map-fullscreen .demo-plant-list-wrap .demo-plant-list-content {
  overflow-y: auto;
}

/* ----------- Tech demo ----------- */


.carousel-item-elex2 .row .carousel-item-ele:not(:first-child) {
  display: none;
}

.carousel-unido-orange .carousel-control-prev,
.carousel-unido-orange .carousel-control-next {
  color: #f47a42;
  width: auto;
}

.carousel-unido-orange .report-cover-wrap {
  max-width: 40%;
}

.carousel-unido-orange .report-cover-wrap img.report-cover {
  max-height: 160px;
}

/* ----------- Institutional outputs ----------- */
.ins-output-item::before {
  display: inline-block;
  margin-right: .5rem;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\F3B9';
  color: #009cdc;
}

.ins-output-item.active::before {
  content: '\F4EA';
  color: #f47a42;
}

/* ----------- Knowledge tree ----------- */

.bs-tree {
  height: 50vh;
  overflow-y: auto;
}

.bs-tree .list-group:not(:first-child) .list-group-item:first-child {
  border-top-width: var(--bs-list-group-border-width);
}

.bs-tree .list-group-item {
  padding-right: 0;
}

.bs-tree .list-group.collapsing,
.bs-tree .list-group.show {
  margin-top: .5rem;
  margin-bottom: -.5rem;
}

.kh-folder,
.kh-term,
.kh-item {
  display: block;
  text-indent: -.6rem;
  padding-left: .6rem;
}

.fp-arrow.fp-prev::before,
.fp-arrow.fp-next::before,
.kh-term::before,
.kh-folder::before,
.kh-item::before {
  display: inline-block;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-right: .3rem;
  color: #009cdc;
}

.kh-folder::before {
  content: "\F3D3";
}

.kh-folder[aria-expanded="true"]::before {
  content: "\F3D2";
}

.kh-item::before {
  content: "\f38b";
}

.kh-term::before {
  content: "\F19F";
}

/* ----------- Project stats ----------- */

.container-chart {
  aspect-ratio: 1/1 auto;
  max-height: 90vh;
}

.container-chart p.small {
  line-height: .98rem;
}

/* ----------- Photo walls ----------- */

.photo-desc {
  font-size: .75rem;
}

.img-fluid.partner-logo {
  max-height: 64px;
}

/* ----------- Follow us ----------- */

.img-fluid.img-qr-code {
  max-height: 128px;
}

@media (min-width: 768px) {
  .container-chart {
    aspect-ratio: 4/3 auto;
    max-height: 90vh;
  }
}


@media (min-width: 992px) {

  .leaflet-map-fullscreen .demo-plant-list-wrap {
    position: relative;
    width: 16rem;
  }
  
  .leaflet-map-fullscreen .demo-plant-list-wrap .demo-plant-list-content {
    display: block;
  }
  
  .asr-fixed {
    padding-bottom: 50%;
  }

  .carousel-item-elex2 .row .carousel-item-ele:last-child {
    display: block;
  }

  .carousel-item-elex2 .carousel-item-end.active,
  .carousel-item-elex2 .carousel-item-next {
    transform: translateX(50%);
  }

  .carousel-item-elex2 .carousel-item-next .carousel-item-ele:first-child {
    visibility: hidden;
  }

  .carousel-item-elex2 .carousel-item-start.active,
  .carousel-item-elex2 .carousel-item-prev {
    transform: translateX(-50%);
  }

  .carousel-item-elex2 .carousel-item-prev .carousel-item-ele:last-child {
    visibility: hidden;
  }

  .carousel-item-elex2 .carousel-item-end,
  .carousel-item-elex2 .carousel-item-start {
    transform: translateX(0);
  }
  
  .carousel-unido-orange .report-cover-wrap {
    max-width: unset;
  }
  
  .carousel-unido-orange .report-cover-wrap img.report-cover {
    max-height: 240px;
  }
  
  .container-chart {
    aspect-ratio: 16/9 auto;
    max-height: 90vh;
  }

}

@media (min-width: 1200px) {

  .container-limited {
    max-width: 992px;
  }

  .img-fluid.partner-logo {
    max-height: 80px;
  }

}

@media (max-width: 767px) {

  #inst-outputs-expl .alert {
    position: absolute;
    top: 2rem;
    right: 1rem;
    max-width: 80%;
    z-index: 3;
  }
  
  .carousel-unido-orange .desc-truncate {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }

}

/* Safari bug fix for #8068. */
@supports (-webkit-touch-callout: none) {
  .leaflet-map-fullscreen .leaflet-map-attribution,
  .leaflet-map-fullscreen .demo-plant-list-wrap,
  .leaflet-control-container .leaflet-top,
  .leaflet-control-container .leaflet-bottom {
    transform: translate3d(0, 0, 0);
    will-change: transform;
  }
}