@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap');

body {
  font-family: 'Host Grotesk', serif;
  font-weight: 400;
  width: 100%;
  color: #000000;
  overflow-x: hidden;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}

.flexy {
  display: flex;
  align-items: center;
  justify-content: center;
}

.btnPadd {
  padding: 0.5rem 1.5rem;
}

.aboutUs {
  position: relative;
}
.circle_popup {
  width: 60%;
  margin: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: auto;
  border: none;
  padding: 22px;
}
.aboutUs::before {
  position: absolute;
  content: '';
  height: 85vh;
  width: 100%;
  z-index: -1;
  background-image: url('/assets/images/aboutPat.svg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
img.imgsize {
  width: 160px !important;
}
.contactImg {
  position: relative;
}
.contactImg::before {
  position: absolute;
  content: '';
  z-index: -1;
  height: 100%;
  width: 100%;
  background-image: url('/assets/images/contactIm.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.services {
  position: relative;
}

.services::before {
  position: absolute;
  content: '';
  height: 89vh;
  width: 100%;
  z-index: -1;
  background-image: url('/assets/images/aboutPat.svg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.servicesFrame {
  position: relative;

}

.brandsLogoMarquee  .slick-track{display: flex; align-items: center;}
.navbar-row .active::after {
  width: 80%;
  height: 2px;
  position: absolute;
  transition-duration: 300ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  background-color: #000;
  top: 1.75rem;
  content: '';
}



/* .servicesFrame::before {
  position: absolute;
  content: '';
  height: 89vh;
  width: 100%;
  z-index: -1;
  background-image: url('/assets/images/servicesFram.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
} */


/* .serviceThumbnail:hover .servicesThumbhover {
  opacity: 1;
}

.servicesThumbhover {
  opacity: 0;
  width: 300px;
  height: 300px;
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 75%;
  overflow: hidden;
  pointer-events: none;
  transition: opacity 0.3s, transform 0.7s cubic-bezier(0.23, 1, 0.32, 1),
    -webkit-transform 0.7s cubic-bezier(0.23, 1, 0.32, 1);
  margin: -3rem 54%;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
} */
 
.circle_popup .modal-content{
  background: url(../images/popup-bg.jpg);
  background-size: cover;
  background-position: center center;
  border:1px solid #646464;
  border-radius: 15px;
  overflow: hidden;
}
.circle_popup .modal-dialog{max-width:100%; position: relative;}
.circle_popup .modal-dialog .modal-header .btn-close{
  position: absolute;
  right: 14px;
  top: 14px;
  background-color: #919191;
  border-radius: 20px;
  padding: 7px;
}
.circle_popup .modal-dialog .modal-header{
  border: none;
  padding: 0;
}
.circle_popup .modal.show .modal-dialog{border:1px solid #646464}
.circle_popup .slick-slide img{ border: 1px solid #646464; border-radius: 10px;}
.modal-backdrop.show{opacity: 0.9;}
.spadd{position: absolute; bottom: 0; width: 100%;}

.socialicon img {
  width: 50px;
}


@media (max-width:1366px) {
.bird-img {
  max-width: 360px;
}
}
@media screen and (max-width: 1280px) and (max-height: 600px) {
  .bird-img {
    max-width:75%;
  }
}

@media screen and (max-width: 1180px) and (max-height: 820px) {
  .bird-img {
    max-width:100%;
  }
}


@media (max-width:1024px) {
.circle_popup{
  width: 100%;
  height: 100%;
}

.circle_popup .circle_popup{height: auto;}

}

@media screen and (max-width:767px){

  .spadd{margin-top: 0; position:static;}
  .navbar-row .active::after {content: none;}
 
}
@media (max-width: 639px) {
  .spadd{position: static;}
  .bird-img{width: 90%; margin-right: 40px;}
  
}

@media (max-width: 575px) {
  .btnPadd {
    padding: 0.5rem 1rem;
  }

  .aboutUs::before {
    height: 100vh;
  }
  .services::before {
    height: 85vh;
  }
  
}

@media (min-width: 1024px) {
  .padRightLeft3 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }
}