@charset "UTF-8";

/*
Theme Name: Lumina
Author: the 22feet team
Description: Customised theme for Lumina website
Requires at least: 5.3
Tested up to: 6.2
Requires PHP: 5.6
*/

section.resources
  .resourceCard
  .resourceWrapper
  .resourceContent
  .know-more
  span
  img {
  width: auto;
  display: inline;
  margin-left: 1rem;
}

.master-container {
  position: relative;
  z-index: 1;
}
.video-bg {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0px;
  top: 0px;
  background: #ccc;
}

.video-bg video {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
}
.iconcontainer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.iconcontainer .playIcon img {
  width: auto !important;
  height: 34px;
}

section.resources .resourceCard .resourceWrapper .resourceContent h3,
section.resources .resourceCard .resourceWrapper .resourceContent h3 p {
  display: -webkit-box !important; /* Required for clamping */
  -webkit-box-orient: vertical; /* Vertical flow for clamping */
  overflow: hidden; /* Hide extra text */
  -webkit-line-clamp: 4; /* Limit to 3 lines */
  margin: 0; /* Prevent margin issues */
  padding: 0 !important; /* Prevent padding issues */
  white-space: normal; /* Allow wrapping */
  min-height: 90px !important;
  color: #cbcbcb;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  text-overflow: ellipsis; /* Add ellipsis at the end */
}

/*popup*/
.resourceCard .resourceWrapper .resourceContent .iconcontainer .playIcon {
  cursor: pointer;
}

.youtube-video .modal-dialog .modal-content .close-button {
  cursor: pointer;
  z-index: 99;
}
.no-scroll {
  overflow: hidden;
}

/**about-us page **/
@media screen and (max-width: 991px) {
  .banner.about-us-banner {
    min-height: 100%;
    position: relative !important;
  }
  .banner.about-us-banner::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #0000006e;
  }
  .unitGrid .iconBox-wrapper .iconBox-airoli .textBox h4 {
    font-size: 18px;
    word-wrap: break-word;
  }
}

/**/
@media (max-width: 1024px) {
  .resources .resources-lists .nav-center .nav-tabs {
    background: transparent !important;
  }
}

@media screen and (min-width: 992px) and (max-width: 1205px) {
  section.resources
    .resourceCard
    .resourceImage
    + .resourceWrapper
    .resourceContent
    a.know-more {
    padding: 10px !important;
    font-size: 14px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1366px) {
  button.slick-prev.slick-arrow {
    left: 42% !important;
  }
  button.slick-next.slick-arrow {
    right: 42% !important;
  }
}

/*coustmer experience*/
.case-studies .case-studies-slider .slick-slide a {
  display: flex !important;
  align-items: center;
  width: fit-content;
}
.case-studies .case-studies-slider .slick-slide a span img {
  width: 40px;
}
@media (max-width: 1024px) {
  .case-studies .case-studies-slider .slick-slide a span img {
    width: 30px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .why-choose .iconBox-wrapper._animate.ami._inview {
      min-height: 370px !important;
  }
}

/*home page banner video*/
.page-template-home section.banner {
  background: unset !important;
}

.page-template-home .banner {
  position: relative;
  overflow: hidden;
  height: 100vh; /* Full height for desktop/tablet */
  display: flex;
  align-items: center;
  justify-content: center;
}
 
.page-template-home .banner .banner-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures the video covers the entire section */
  z-index: -1;
}
 
.page-template-home .banner .container {
  z-index: 2; /* Ensures content is above the video */
  position: relative;
}

@media (max-width: 1024px) {
  .page-template-home .banner {
    flex-direction: column;
    height: auto; /* Allow height to adjust for stacked layout */
    gap: 20px;
  }

  .page-template-home section.banner {
    background: #051322 !important;
  }
 
  .page-template-home .banner .banner-video {
    position: relative; /* Make video inline for stacking */
    height: auto;
    width: 100%;
    object-fit: contain;
    z-index: 1;
  }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
  .page-template-home .banner .slide-caption {
    text-align: left !important;
  }
}

/*ABOUT-US*/
@media screen and (max-width: 767px) {
  .customerSatisfaction .rhs {
      text-align: center;
      margin-bottom: 0px !important;
      margin-top: 30px !important;
  }
}

@media (min-width: 768px ) and (max-width : 1024px) {
  .meetTheTeamGrid .mb-md-5 {
    justify-content: center;
  }
  .meetTheTeamGrid  .container .heading {
    text-align : center;
   }
}
@media screen and (min-width: 1400px) {
  .aboutUsBanner .caption p {
      margin-right: 75px;
  }
}
.page-template-about-us .flipBoxSlider .slick-arrow {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor: pointer;
  border: none;
  position: absolute;
  background: #FFF;
  overflow: hidden;
  text-indent: 1000px;
  z-index: 1;
  font-family: "re cw";
  padding: 0px;
  bottom: -60px;
}

.page-template-about-us .flipBoxSlider button.slick-prev.slick-arrow {
  left: 46%;
}
.page-template-about-us .flipBoxSlider button.slick-next.slick-arrow {
  right: 46%;
}
.page-template-about-us .flipBoxSlider button.slick-prev.slick-arrow::before {
  border-left: 2px solid #001424;
  transform: rotate(45deg);
  margin-left: -2px;
}
.page-template-about-us .flipBoxSlider button.slick-next.slick-arrow::before {
  border-right: 2px solid #001424;
  transform: rotate(-45deg);
  margin-left: -5px;
}

.page-template-next-gen .flipBoxSlider button.slick-prev, .page-template-next-gen .flipBoxSlider button.slick-next {
  display: none !important;
}

.page-template-enterprise-service .unitGrid .container .row .heading p {
  max-width: 100%;
}
.unitGrid .heading h3 {
  text-align: center;
}
.unitGrid .advantage .iconBox-wrapper .textBox p {
  max-width: 100%;
}
span.slide-caption-text {
    color: red;
}

.lifeAtLumina p {
  color: #CACACA;
    font-size: 24px;
    line-height: 32px;
}

@media screen and (max-width: 749px) {
    .lifeAtLumina p{
        font-size: 16px;
        line-height: 24px;
    }
}

@media screen and (min-width: 750px) and (max-width: 992px) {
   .lifeAtLumina p{ 
     font-size: 20px;
        line-height: 28px;
   }
}

.lifeAtLumina .heading h3  {
  line-height: 96px !important;
}