/*** About & Feature ***/
.about-img,
.feature-img {
    position: relative;
    height: 100%;
    min-height: 400px;
}

.about-img img,
.feature-img img {
    position: absolute;
    width: 60%;
    height: 80%;
    object-fit: cover;
}

.about-img img:last-child,
.feature-img img:last-child {
    margin: 20% 0 0 40%;
}

.about-img::before,
.feature-img::before {
    position: absolute;
    content: "";
    width: 60%;
    height: 80%;
    top: 10%;
    left: 20%;
    border: 5px solid gray;
    z-index: -1;
}




/*** who we are  Start ***/
.about .text {
    position: relative;
}

.about .text::after {
    content: "";
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: gray;
}
/*** who we are End ***/

/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/
.services .service-item {
    padding: 40px;
    background: #fff;
    height: 100%;
  }
  
  .services .service-item .icon {
    width: 48px;
    height: 48px;
    position: relative;
    margin-bottom: 50px;
  }
  
  .services .service-item .icon i {
    color: var(--color-secondary);
    font-size: 40px;
    transition: ease-in-out 0.3s;
    z-index: 2;
    position: relative;
    line-height: 1.8;
  }
  
  .services .service-item .icon:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    background: #f0f1f2;
    border-radius: 50px;
    z-index: 1;
    top: 10px;
    right: -15px;
    transition: 0.3s;
  }
  
  .services .service-item h3 {
    color: var(--color-default);
    font-weight: 700;
    margin: 0 0 20px 0;
    padding-bottom: 8px;
    font-size: 15px;
    position: relative;
    display: inline-block;
    /*border-bottom: 4px solid #ebebed;*/
    transition: 0.3s;
  }
  
  .services .service-item p {
    line-height: 24px;
    font-size: 14px;
    margin-bottom: 0;
  }
  
  .services .service-item .readmore {
    margin-top: 15px;
    display: inline-block;
    color: var(--color-primary);
  }
  
  .services .service-item:hover .icon:before {
    background: var(--color-primary);
  }
  
  .services .service-item:hover h3 {
    border-color: var(--color-primary);
  }
  

 /*Plans*/
 .block__62272 .section-title {
  font-size: 2rem; }
  .site-section {
    padding-top: 7rem;
    padding-bottom: 7rem;
    position: relative;
    z-index: 0; }
    .filters .btn {
      border-color: transparent;
      font-size: 12px;
      margin: 5px;
      background: rgba(52, 58, 64, 0.05);
      color: #343a40;
      text-transform: uppercase; }
      .filters .btn:hover {
        border-color: transparent;
        background: #b4b4b4;
        color: #fff; }
      .filters .btn.active {
        background: #b4b4b4 !important;
        color: black;
        }

        .item {
          border: none; }
          .item a {
            display: block;
            overflow: hidden;
            position: relative; }
            .item a img {
              position: relative;

              height: 18rem;
              width: 100%;
              object-fit: fill;


              -webkit-transform: scale(1);
              -ms-transform: scale(1);
              transform: scale(1);
              -webkit-transition: .3s all ease-in-out;
              -o-transition: .3s all ease-in-out;
              transition: .3s all ease-in-out; }
              .itemshahan a img {
                position: relative;
  
                height: 45rem;
                width: 100%;}
                .itemindustry a img {
                  position: relative;
    
                  height: 50rem;
                  width: 100%;}
                .itemceo a img {
                  position: relative;
    
                  height: 100%;
                  width: 100%;}
                .itemfrench a img {
                  position: relative;
    
                  height: 20rem;
                  width: 100%;
                  object-fit: cover;
                }
          .item .item-wrap {
            display: block;
            position: relative; }
            .item .item-wrap:after {
              z-index: 2;
              position: absolute;
              content: "";
              top: 0;
              left: 0;
              right: 0;
              bottom: 0;
              background: rgba(0, 0, 0, 0.4);
              visibility: hidden;
              opacity: 0;
              -webkit-transition: .3s all ease-in-out;
              -o-transition: .3s all ease-in-out;
              transition: .3s all ease-in-out; }
            .item .item-wrap > span {
              position: absolute;
              top: 50%;
              left: 50%;
              z-index: 3;
              -webkit-transform: translate(-50%, -50%) scale(0);
              -ms-transform: translate(-50%, -50%) scale(0);
              transform: translate(-50%, -50%) scale(0);
              color: #fff;
              font-size: 1.7rem;
              opacity: 0;
              visibility: hidden;
              -webkit-transition: .3s all ease;
              -o-transition: .3s all ease;
              transition: .3s all ease; }
            .item .item-wrap:hover:after {
              opacity: 1;
              visibility: visible; }
            .item .item-wrap:hover span {
              margin-top: 0px;
              opacity: 1;
              visibility: visible;
              -webkit-transform: translate(-50%, -50%) scale(1);
              -ms-transform: translate(-50%, -50%) scale(1);
              transform: translate(-50%, -50%) scale(1); }
          .item:hover a img {
            -webkit-transform: scale(1.05);
            -ms-transform: scale(1.05);
            transform: scale(1.05);
            -webkit-transition: .3s all ease-in-out;
            -o-transition: .3s all ease-in-out;
            transition: .3s all ease-in-out; }
            .no-gutters {
              margin-right: 0;
              margin-left: 0; }
              .no-gutters > .col,
              .no-gutters > [class*="col-"] {
                padding-right: 0;
                padding-left: 0; }
                @media (max-width: 768px) {
                  .item a img {
                    position: relative;
      
                    height: 15rem;
                    width: 100%;
                    object-fit: fill;}
                    .itemshahan a img {
                      position: relative;
        
                      height: 20rem;
                      width: 100%;}
                      .itemfrench a img {
                        position: relative;
          
                        height: 20rem;
                        width: 100%;
                        object-fit: cover;
                      }
              }

              .filters .btn-primary{
                box-shadow: none !important;
              }




  /* Cavali Location */


#contact .text-danger {
	color: black;
	text-align: left;
}
label {
	font-size: 12px;
	font-weight: 400;
	font-family: 'Open Sans', sans-serif;
	float: left;
}

#contact .contact-item {
	margin: 20px 0 40px 0;
}
#contact .contact-item span {
	font-weight: 400;
	color: #aaa;
	text-transform: uppercase;
	margin-bottom: 6px;
	display: inline-block;
}
#contact .contact-item p {
	font-size: 16px;
}            

.dropdown li a{
  font-size: 12px !important;
  font-weight: bold !important;
}



/* ROJO POGI PLAY BUTTON */

.video-play-button {
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  /* background: #fa183d; */
  border-radius: 50%;
  padding: 18px 20px 18px 28px;
}

.video-play-button:before {
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: black;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: black;
  border-radius: 50%;
  transition: all 200ms;
}

.video-play-button:hover:after {
  background-color: black;
}
.video-play-button:before {
  content: "";
  color: #f8f8f8;
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: #f8f8f8;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button img {
  position: relative;
  z-index: 3;
  max-width: 100%;
  width: auto;
  height: auto;
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 32px solid #fff;
	border-top: 22px solid transparent;
	border-bottom: 22px solid transparent;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}



.video-overlay {
  position: relative;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.80);
  opacity: 0;
  transition: all ease 500ms;
}

.video-overlay.open {
  position: fixed;
  z-index: 1000;
  opacity: 1;
}

.video-overlay-close {
  position: absolute;
  z-index: 1000;
  top: 15px;
  right: 20px;
  font-size: 36px;
  line-height: 1;
  font-weight: 400;
  color: white;
  text-decoration: none;
  cursor: pointer;
  transition: all 200ms;
}

.video-overlay-close:hover {
  color: #f8f8f8;
  transform: scale(1.5);
}

.video-overlay iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  /* width: 90%; */
  /* height: auto; */
  box-shadow: 0 0 15px rgba(0,0,0,0.75);
}

/* ENTRANCE ANIMATION OF THE PLAY BUTTON */

.video-play-button {
	-webkit-animation: scale-up-center 1s cubic-bezier(0.680, -0.550, 0.265, 1.550) both;
	        animation: scale-up-center 1s cubic-bezier(0.680, -0.550, 0.265, 1.550) both;
}


@keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/* ENTRANCE ANIMATION OF THE PLAY BUTTON */
/* ROJO POGI PLAY BUTTON */

.hero__text a{
  text-transform: capitalize !important;
}