.innerBanner {
  position: relative;
  height: 400px;
}

.innerBanner img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  
}

.innerBanner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgb(0 77 102 / 70%) 100%);

  
  
}

.innerBanner-text {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  color: white;
  text-align: center;
  width: 100%; 
  z-index: 1;
}

.innerBanner h2 {
  font-size: 2rem; 
  margin-bottom: 2rem;
}

.InnerTitle {
  color: #fff;
  font-size: 2rem;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
  display: inline-block; 
  margin: 0;
  text-align: center;
}

.InnerTitle span {
  /* position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  color: #ffffff10; 
  transform: scale(2);
  z-index: -1; */
  display: block;
  font-size: 2.8rem;
  margin-bottom: .5rem;
}

@media(max-width:575.99px){
  .innerBanner {height: 200px;}
}

/* Profile Page */
.achievmentWrp {background: var(--white); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);}
.achievementListing {padding: 1rem; border: 0.5px solid var(--white); transition: all 0.3s ease-in-out; padding-left: 25px;}
.swiper-slide-active .achievementListing  {border: 0.5px solid var(--Gradient, #00B4F6);  background: rgba(0, 77, 102, 0.05);}
.achievementListing li {font-weight: 300; margin-bottom: 1rem; list-style: disc;}

.achievementSwiper {position: relative;}

.achievementSwiper .swiper-button-prev, .achievementSwiper .swiper-button-next {top: 4.7rem; width: 2rem; height: 2rem; background: var(--white); border: 1px solid #323232;}


@media (min-width: 1920px) { 
  .achievementSwiper .swiper-button-prev, .achievementSwiper .swiper-button-next {top: 5.4rem;}
}


.achievementSwiper .swiper-button-prev:hover, .achievementSwiper .swiper-button-next:hover {background: var(--blue);}
.achievementSwiper .swiper-button-prev {left: 0;}
.achievementSwiper .swiper-button-next {right: 0; color: #000;}
.achievementSwiper .swiper-button-next:hover {right: 0; color: #ffffff;}

.achYear { width: 100%; display: block; text-align: center; color: var(--blue); height: 8rem; position: relative;}
.achYear::before {content: ''; position: absolute; bottom: 30px; left: 0; width: 100%; height: 2px; border-top: 1px dashed var(--blue);}
.swiper-slide-active .achYear {font-weight: 500; font-size: 2rem;}
.achYear  span {position: absolute;bottom: 0;left: 0;width: 100%;}


.achYear span::before {content: '';display: block;width: 1rem;height: 1rem;background: var(--gradient);z-index: 1;  position: absolute;border-radius: 100rem;bottom: 1.7rem;left: 50%;transform: translateX(-50%) scale(0); transition: all 0.3s ease-in-out;}
.swiper-slide-active .achYear span::before {transform:translateX(-50%) scale(1.4);}

.achYear span::after {content: '';margin: 12px auto; width: 2.5rem;height: 2.5rem;background: var(--white);border: 1px solid var(--blue);margin: 1rem auto;border-radius: 100rem;display: block;}
.swiper-slide-active .achYear span::after {transform: scale(1.3); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05); border: 1px solid var(--white);}


.aboutImgs {width:100%;height:100%;object-fit:cover;object-position:center}
.whatIsWrp {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05); position: relative;}
.whatIsImg {height: 350px; position: relative; }
.whatIsImg img {width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0;}
.whatIsImg::after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.85) 40.49%, #FFF 92.19%);}
.whatIsTxt {position: absolute; bottom: 20px; left: 0; width: 100%; text-align: center;}
.whatIsTxt h3 {/*text-transform: uppercase;*/ margin-bottom: 1rem;}
.whatIsTxt p {font-weight: 300;}
@media(max-width:575.99px){
.whatIsTxt {position: relative; bottom: auto;}
.whatIsImg {height: auto; margin-bottom: 1.5rem;}
.whatIsImg img {position: relative;}
.whatIsImg::after {display: none;}
.whatIsWrp {padding-bottom: 1.5rem;}
}


.valuesTxtBox {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05); padding:4rem 2rem; text-align: center; height: 100%;}
.valueBox {border: 1px solid rgba(0, 77, 102, 0.20); padding: 2rem; z-index: 1; position: relative; transition: all 0.3s ease-in-out; height: 100%;}
.valueBox img {position: absolute; top: 5px; right: 5px; width: 60px; height: 60px;  z-index: -1;  transition: all 0.3s ease-in-out; } 

.valueBox h4 {text-transform: uppercase;}
.valueBox p:last-child {margin: 0;}
.valueBox:hover {background: var(--blue); color: var(--white);}
.col:nth-child(even) .valueBox {margin-top: 2rem;}
@media(max-width:575.99px){
.valuesTxtBox {padding: 2rem;}
.col:nth-child(even) .valueBox {margin-top: 0;}

}

/* Team Page */
.teamBox {position: relative; border:5px solid var(--white);  margin: 2px auto; max-width:25rem; transition: all 0.3s ease-in-out;}
.teamBox:hover {border:5px solid rgba(0, 77, 102, 0.15); box-shadow: 0px 0px 0px 2px rgba(0,77,102,1);}
.teamPic {height: 0; width: 100%; padding-bottom: 115%;  position: relative; }
.teamBox img {width: 100%; height: 100%; position: absolute; top: 0; left: 0; object-fit: cover; display: block;}
.teamInfo {position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; color: var(--white); background: rgba(0, 0, 0, 0.40);
backdrop-filter: blur(15px); padding-top: 1rem; text-transform: capitalize;} 
.teamInfo h4 {font-weight: 400; font-size: 1.3rem;}
.teamInfo span {margin-bottom: 1rem; display: block; font-weight: 300; font-size: 0.90rem;}
.teamInfo a {display: block; border-top: 1px solid rgba(255, 255, 255, 0.20); padding: 1rem; transition: all 0.3s ease-in-out;}
.teamInfo a svg {fill: var(--white); width: 16px; height: 16px; margin-right: .5rem; vertical-align: middle; display: inline-block;}
.teamBox:hover .teamInfo a {background: #0A66C2;}
.teamProfile {display:none;max-width:800px;}
.teamProfile .teamInfo {opacity:1;}
.teamName {color:var(--black);margin-bottom:.2rem}
.teamProfile p {font-weight: 300; line-height: 24px;}

@media(max-width:1280.99px){
  .teamBox {max-width: 20rem;}
  }


@media(max-width:768.99px){
/* .teamInfo {position: relative; bottom: auto;} */
.teamInfo h4 {font-size: 1rem; font-weight: 500;}
}

/* Services */

.sideImgBox {position: relative;}
.sideImgBox img {width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0;}
.sideImgTxtBox h3 {/*text-transform: capitalize;*/ margin-bottom: 1.5rem;}
.sideImgTxtBox ul {padding-left: 15px;}
.sideImgTxtBox li {list-style: disc; margin-bottom: 1rem; font-size: 1.1rem;}

@media(max-width:991.99px){
.sideImgBox {height: 0; padding-top: 40%;}
.sideImgTxtBox h4 { margin-bottom: 1rem;}
}
@media(max-width:575.99px){
.sideImgBox {height: 0; padding-top: 50%;}
}

.whyComplyWrp {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);}
.whyUsBox {text-align: center; border: 1px solid rgba(61, 61, 61, 0.16); border-radius: 1rem; padding:2rem .5rem; height: 100%; transition: all 0.3s ease-in-out; background: var(--white);}
.whyUsBox:hover {border-color: var(--white); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.10);}
.whyUsBox h3 {color: var(--blue); font-size: 1.8rem; margin-bottom: 1rem; text-transform: capitalize;}
.whyUsBox p:last-child {margin: 0;}

@media (max-width:1200.99px){
.whyUsBox h3 {font-size: 1.5rem;} 
}

.serviceAcc .accordion-item {--bs-accordion-border-color:#F1F2F2; margin-bottom: 1.5rem; --bs-border-radius:15px;}
.serviceAcc .accordion-item .accordion-button:not(.collapsed) {--bs-accordion-active-bg:#fff;}
.serviceAcc  .accordion-item:not(:first-of-type) {border-top: 1px solid var(--bs-accordion-border-color);}
.serviceAcc .accordion-item .accordion-button:focus {box-shadow: none;}
.serviceAcc .accordion-item p:last-child {margin: 0;}

.takeCareWrp {box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.05);}
.takeCareBox {border: 1px solid rgba(61, 61, 61, 0.16); background: var(--white); padding: 2rem; border-radius: 15px; height: 100%; transition: all 0.3s ease-in-out;}
.takeCareBox h6 {font-size: 1.5rem; line-height:2.2rem;}
.takeCareBox:hover {border-color: var(--white); box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.05);}
.takeCareBox:hover h6 {color: var(--blue);}
.takeSwiper .swiper-slide {height: auto; padding:10px 5px;}
.takeCareBox p {font-size: 1.1rem; line-height: 2rem;}
.takeCareBox p:last-child {margin: 0;}
.degreeSwiper  .swiper-slide {height: auto; padding: 5px;}
.degreeBox {text-align: center; height: 100%; padding: 1rem; box-shadow: 0 0 5px 0 rgb(0 0 0 / 10%);}
.degreePic {height: 0; padding-bottom: 56.56%; position: relative; margin-bottom: 2rem; margin-top: -1rem; margin-left: -1rem; margin-right: -1rem;}
.degreeBox h5 {font-size:1.3rem; text-transform: uppercase; margin-bottom: 1rem; color: var(--blue); font-weight: 600;}
.degreePic img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

@media(max-width:991.99px){
  .takeCareBox h6 {font-size: 1.5rem;}
  .takeCareBox p {font-size: 1.1rem; line-height: 1.8rem;}
}
@media(max-width:575.99px){
  .takeCareBox {padding: 1rem;}
  .takeCareBox h6 {font-size: 1.2rem; line-height: 1.8rem;}
}

.raWrp {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);}

.actBox {box-shadow: 2px 2px 22px 0px rgba(0, 0, 0, 0.05); padding: 1rem; border-radius: 20px; font-size: 1.2rem;}
.actBox:hover {color: var(--blue); font-weight: 600;}
.actIcon {width: 60px; height: 70px; border-radius: 20px; background: url(../images/actIcon.svg) no-repeat center #EBEBEB;   margin-right: 1rem; background-size: 50%; transition: all 0.3s ease-in-out;}
.actBox:hover .actIcon {background: url(../images/actIconWhite.svg) no-repeat center, var(--gradient) }

  

  .relatedBlogs .card-cta {border-bottom: 1px solid #C4C4C4; padding-bottom: 1rem; position: relative;}
  .relatedBlogs .blogDate {position: relative; margin-top: 1rem;}
  .relatedBlogs h6 {font-weight: normal;}
  .relatedBlogs .card-cta:hover h6 {text-decoration: underline; color: var(--blue);}

  .relatedHead {border-left: 5px solid var(--blue); font-size: 1.5rem; border-bottom: 1px solid var(--blue); padding:0 0  1.2rem 1.2rem ; font-weight: normal!important;}

  .tabStyle li {margin: 0 15px;}
  .tabStyle button {border: 0; padding: 1rem; background: var(--white); color: var(--blue); text-transform: capitalize; font-size: 1.1rem;}
  .tabStyle button.active {background: var(--blue); color: var(--white);}
  a.button {
    background-color: #004D66;
    padding: 10px;
    color: #fff;
}
a.sign {
    font-weight: 600;
}
.libraryHead ul li ul  {
      background: #fff;
      visibility: hidden;
  opacity: 0;
  min-width: 5rem;
      position: absolute;
  transition: all 0.5s ease;
  z-index: 99;
  display: none;
     padding-top:8px ;
  padding-bottom: 8px;
 
 
}
.libraryHead ul li ul:hover{
      background-color: var(--blue);
      color: #000;
      border-radius: 8px;
}

.libraryMenu .logindropdown a:last-child{
      height: 30px !important;
/*      padding-bottom: 10px ;*/
        padding: 1.5rem 2rem!important;
/*      padding: 0 30px;*/
      
}
.libraryMenu .logindropdown a:last-child:hover{
    background-color:transparent;
}
.libraryHead ul li:hover > ul,
ul li ul:hover {
  visibility: visible;
  opacity: 1;
  display: block;
}
.libraryMenu .logindropdown a:last-child{
  color:#000;
}