.body {

  /* padding: 0px; */

}



.hover-item {

  min-width: 300px;

  height: 200px;

  position: absolute;

  /* margin-left: 200px; */

  /* margin-top: 200px; */

  /* background-color: pink; */

  display: inline-block;

  pointer-events: none;

  z-index: 10000;

  text-shadow: 0px 0px 3px rgba(0,0,0,0.5)

}

.hover-content {

  height: 100%;

  width: calc(100% - 100px);

  margin-left: 100px;

  /* background-color: whitesmoke; */

  position: relative;

}



.hover-content::before {

  content: "";

  background: white;

  position: absolute;

  display: inline-block;

  vertical-align: top;

  width: 100%;

  height: 2px;

  transition: transform 0.3s;

  transform-origin: bottom left;

  transform: scale(0, 1);

  transition-timing-function: ease-out;

}



.hover-item.active .hover-content::before {

  transform: scale(1);

  transition-delay: 0.3s;

}



.hover-item::before {

  content: "";

  background: white;

  position: absolute;

  display: inline-block;

  vertical-align: top;

  width: 2px;

  height: 222px;

  transform: rotate(26deg) translate(-9px, -21px) scale(1, 0);

  transition: transform 0.3s;

  transform-origin: bottom left;

  transition-timing-function: ease-in;

  transition-delay: 0.3s;

}



.hover-item.active::before {

  transform: rotate(26deg) translate(-9px, -21px) scale(1);

  transition-delay: 0s;

}

.hover-item .image {

  width: 200px;

  height: 90px;

  object-fit: cover;

  /* margin: 15px; */

  transition: all 0.5s;

  transform: translateY(25%);

  opacity: 0;

  /* margin-left: 10px; */

}



.hover-item.active .image {

  opacity: 1;

  transform: translateY(0%);

  transition-delay: 0.3s;

}



.sub-topic {

opacity: 0;

font-size: 14px

}

.hover-item.active .sub-topic {

  opacity: 1;

  transform: translateY(0%);

  transition-delay: 0.3s;

}



.hover-content .header {

  transform: translateY(-100%);

  position: absolute;

  margin: 0px;

  font-size: 17px;

  padding: 10px;

  transition: all 0.5s;

  transform: translateY(-150%);

  opacity: 0;

  padding-left: 10px;

  color: white;

}



.hover-item.active .header {

  opacity: 1;

  transform: translateY(-100%);

  transition-delay: 0.3s;

}



.cls-7 {

  cursor: pointer;

  stroke-width: 20px !important;

}

.p-r {

  position: relative;

}



.cls-1 {

  transition: all 0.5s;

  cursor: pointer;

}

.cls-23 {

  transition: all 0.5s;

}



.cls-1.active {

  fill: #87bb00;

}

.cls-23.active {

  fill: #87bb00;

}

.cls-24 {

  pointer-events: none;

}

.cls-28 {

  pointer-events: none;

}



.cls-1::before {

  content: "";

  background: white;

  position: absolute;

  display: inline-block;

  vertical-align: top;

  width: 20px;

  height: 20px;

  transition: transform 0.3s;

  transform-origin: bottom left;

  /* transform: scale(0, 1); */

  border: 1px solid white;

}

/* body {

  background: #7c99bf;

} */



/* .concetric{

display: none;

}



.active .concetric{

display: inline-block;

} */



.concetric::after {

  position: absolute;

  height: 10px;

  width: 10px;

  border-radius: 10px;

  transform: translate(-30%, -55%) scale(0);

  content: "";

  position: absolute;

  display: inline-block;

  vertical-align: top;

  transition: transform 0.3s;

  border: 1px solid white;

  opacity: 0;

  background: #3e6cbd;

}



.active .concetric::after {

  transform: translate(-30%, -55%) scale(1);

  opacity: 1;

}



.concetric::before {

  position: absolute;

  height: 10px;

  width: 10px;

  border-radius: 10px;

  transform: translate(-30%, -55%) scale(0);

  content: "";

  position: absolute;

  display: inline-block;

  vertical-align: top;

  transition: all 0.3s;

  border: 1px solid white;

  opacity: 0;

}



.active .concetric::before {

  transform: translate(-30%, -55%) scale(2);

  opacity: 1;

}



.cls-7::before {

  content: "";

  background: white;

  position: absolute;

  display: inline-block;

  vertical-align: top;

  width: 20px;

  height: 20px;

  transition: transform 0.3s;

  transform-origin: bottom left;

  /* transform: scale(0, 1); */

  transition-timing-function: ease-out;

}



.radar-item {

  display: inline-block;

  position: absolute;

  opacity: 0;

  pointer-events: none;

  z-index: 1000;

}



.radar-item::before {

  width: 10px;

  height: 10px;

  border: 1px solid white;

  content: "";

  position: absolute;

  display: inline-block;

  border-radius: 10px;

  animation-name: radar-wave;

  animation-iteration-count: infinite;

  animation-duration: 1s;

}



.radar-item::after {

  width: 10px;

  height: 10px;

  border: 1px solid white;

  content: "";

  position: absolute;

  display: inline-block;

  border-radius: 10px;

  animation-name: radar-wave;

  animation-iteration-count: infinite;

  animation-duration: 1s;

  animation-delay: 0.5s;

}



@keyframes radar-wave {

  from {

    transform: scale(0.5);

    opacity: 1;

  }

  to {

    transform: scale(2);

    opacity: 0;

  }

}



.visible-radar {

  opacity: 1;

}



.map-section{

  /* min-height: 100vh;

   max-width:98vw; */

  overflow-x: hidden;

  transition: all 0.5s;

}



#map_svg{

  margin-top: 50vh;

  transform: translateY(-50%);

}



.map-parent{

  /* height: 100%; */

  width: 100%;

  position: sticky;

  top: 0px;



}



.v-h{

 min-height: 100vh;



}



.theme-green{

  background: #87bb00;

}



.desc-parent{

  animation-delay: 0.5s;

}





.v-center{
  margin-top:50vh;
  transform: translateY(-50%);
  max-height: 80vh;
  overflow-y:scroll 
}



tspan{
  z-index: 30000;
  position: absolute;
}



.airline-logo {
	width: 100%;
	height:100px;
	transition: all 0.5s;
	object-fit: contain;
}



.afraa_map{
  max-width: 100%;
  width: 100%;
}



.active.active-color {

  fill: #3e6cbd !important;

}

.swiper-slide .card {
  margin:0px 0px 32px;
}

.swiper-slide .col-md-4:hover .card {
  border:1px solid #3e6cbd;
  cursor: pointer;
}

.latest-posts .card-body {
  overflow: hidden;
}