html, body {   height: 100%;margin:0; padding:0;  scroll-behavior: smooth;} 
body {  }
  

selector { font-style: normal; }
 

body { margin: 0; font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; background: #FFF;  color: #222; }

.wrapper {   width: 100%;  max-width: 1920px;   margin: 0 auto;}

a  { font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;  text-decoration: none;    border:none; margin:0;}
a.link:hover  { -webkit-transition-timing-function: ease-in; -webkit-transition-duration: 150ms;  -moz-transition-timing-function: ease-in;  -moz-transition-duration: 150ms; transition: background-position 0.5s ease;}

 
p.eyebrow {color: #CD128A; font-size: 18px;  } 

h2, h3{  font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-style: normal; font-weight: 400; font-size: 37px; line-height: 53px;  color: #FFFFFF; } .team h2{ color: #333; }
p {  font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-style: normal; font-weight: 400; font-size: 20px; line-height: 30px; color: #414042; }


header {  background-color: transparent;  padding: 0; margin:0;   }

#navcontainer {z-index: 9; width:100%; margin-left: 0%; margin-right: 0%;  }
  

.navbar { width:100%; height: 50px; margin: 0 auto;   align-items: center; text-align: center;   display:  inline-block; position:relative; right: 33px;  margin-top:0%; left:0;  z-index:999999;} 

.navbar .logo  {position: absolute;width: 314px; height: 89px; left: 150px; top: 30px;   font-size: 1.5rem; font-weight: bold; color: #e63946; background: url(...); background-size: cover;   }  .navbar .logo a { margin:0; padding:0;  } .navbar .logo a:hover { border-bottom: 0 solid #Fff;   }

 
.cta, .iframe-container .cta {position: relative; color:#fff;  width:220px; height:40px; display:  inline-block;  top:30px; right:60px; float:right;  padding: 0.5rem 0.0rem;  
	
	background: linear-gradient(to right, rgba(3,72,178,1), rgba(170,24,141,1));  overflow: hidden;  transition: all 0.5s ease; 
	
	vertical-align: middle;   border-radius: 40px; text-align: center; text-transform: uppercase;   
font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-style: normal;  font-weight:700;  font-size: 18px; line-height: 40px; cursor: pointer;  } 

.cta img {position: relative; color:#fff;  width:11%; height:auto; display:  inline-block; left:10px;     } 

.cta:hover, .cta::after, .cta-box .cta:hover, .bottom .cta:hover, .iframe-container .cta:hover { background: linear-gradient(to right, rgba(104,35,146,1), rgba(205,18,138,1));   } 

.cta:hover::after {
  opacity: 1; /* fade-in the hover image */
}


.hero  { position: relative; top:0px; margin:0; width: 100%; height: 600px; z-index: 0;  background-color:  transparent; text-align: left; }


.hero-text { position: relative; width:42%; top:100px; margin:0; padding:0; margin-left:150px;  height: 40%;   z-index: 9;  background-color: transparent;
     text-align: left;   }

.hero h1  { font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-style: normal;  font-weight:700;  font-size: 60px; line-height: 78px; color: #FFFFFF; }
.hero p  { position: relative; top:-1rem;   max-width: 89%;   font-weight: 400;  font-size: 28px;  line-height: 42px;  color: #FFFFFF;   }

 
.hero-text .cta-box { position: relative;  display:inline-block; top:0rem;;  width:500px; height:200px;   float:left; margin-left:2rem; z-index:999999999999999999;  } 
.hero-text .cta { position: relative;  display:inl-block;  float:left; top:0px; right:30px;  width:220px; height:40px;   border: 2px solid #FFFFFF; background: transparent;  } 
.hero-text .cta-extension, .bottom .cta-extension { position: relative;  display:inline-block; font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-style: normal;  font-weight:400;  font-size: 20px; line-height: 56px; color: #FFFFFF; vertical-align: middle; } .hero-text span{line-height:6rem;}
  
  


.slider { position: absolute; top:70px;  width: 96%; max-width: 100%; height: 550px;  margin: 2%; overflow: hidden; z-index: -5; border-radius: 25px;
 background: transparent url('images/hero-slider/hero-bg.jpg') no-repeat top center; background-size: cover;}
 
.about, .team  {  position:relative; display: block;   top:20px;  padding:0; margin:0; margin-bottom: 60px;   width:80%; height:auto;  text-align: center;  }

.about-detail, .team-members  { position:relative; display: block;  width:60%; margin-bottom: 1rem;  padding:0; margin:0; margin-left:18%; margin-right: 18%; left:15%; text-align: center;  color:#001427;  }

.about-detail h2 {margin-top: 30px; margin-bottom: 30px; width: 80%; margin-left:10%; margin-right: 10%; color:#001427;   font-weight:700;  font-size: 40px; line-height: 50px;  margin-top:18px;}
.about-detail p { width: 100%;  text-align: center; color:#001427;}
.about-detail .cta-box { height: 50px; width: 80%;  margin-left:10%; margin-right: 10%; text-align: center;  margin-top:40px; }
.about-detail .cta-box .cta {float:none; top:0; left:0; right:0;  }

.practice  {left:2%; width:96%; height:auto;  top:40px;  position:relative; display: inline-block;    z-index: 9; background-color: #585858; border-radius: 25px;
    background: transparent url('images/how-it-works-bg.jpg') no-repeat top center; background-size: cover;  margin-bottom:60px;  }
.practice-intro { width:42%; margin-top:0px;  display: inline-block; margin-right:0;  padding: 7rem; float: left; } 
 
.practice  h2 { font-weight:700; font-size: 40px; line-height: 50px;  margin-top:18px;   width:100%; color:#001427;  } 
.practice  p { top:-15px; margin:0; color:#001427;  } .practice .cta { float: left; right:0;  }

.how-works-img {position:relative; display: inline-block;  height:auto;   width:40%; max-width: 670px; float: right;  vertical-align: middle; top:40px;   }  
.how-works-img img {position:relative; display: block;     width:90%; height:auto; border-radius:30px;  }
 
 
.team  {top:80px;  margin:0px;   padding:0; height:auto; width:100%;  } 
.team h2  {margin-bottom:70px; font-weight:700; font-size: 45px; line-height: 58px; margin-top:0;  }  
  
 
.team-members { float: left; width:100%; height: auto; padding: 0; margin:0;   left:0; margin-top:-10px;  margin-bottom:100px; z-index: 9; position: relative;  display: inline-block;    }

.team-members .member, .team-members .note  { display: block; margin:0; top:0;  width:50%;  margin-left:25%;  margin-right:25%;   height: auto;   vertical-align: top;   border-top: 1px solid #999;     }  
.team-members .note .detail {   background-color: #F1F1FD;  height: 200px;    }  

.member .detail, .team-members .note .detail { position:relative;  display: block; width: 100%; margin:0; padding:0; padding-top:0.1%; margin-top:4%; margin-bottom:4%;  
	color:#fff;   z-index:8; text-align: left;     vertical-align: middle;  }  .team-members .note { top:60px; }

.member .detail h3, .team-members .note h3 {  position:relative;  display: inline-block;   width:85%; margin:0; padding:0;  margin-left: 20px; font-size: 20px; line-height:30px; font-weight: normal;   color: #001427;   vertical-align: middle; text-align: left;   }   .team-members .note h3 {   margin-left: 80px; margin-top:4%; }

.member .detail img {  position:relative;  display: inline-block; height:auto;  margin:0; padding:0; top:0;   width:60px;  vertical-align: middle; } 


.bottom { width: 100%; height: 400px; position:relative;  display:inline-block;  top: 100px; margin-bottom: 100px; left: 0;  text-align: center;   padding-top:4%; } 
.bottom h2,  .bottom p { position:relative;  display:block;  margin:0; padding: 0%; text-align: center;  color: white;  z-index:99; } 
.bottom h2  {font-size:40px; font-weight: normal; padding-bottom:2%;   width:40%;  margin-left:30%; margin-right: 30%;}
.bottom p { font-size:20px; position:relative;  display:block;  height: auto; margin:0;  width: 60%; margin-left:20% ; margin-right:20% ; margin-top: 5%; text-align: center;  color: white;  z-index:9; } 

.bottom .cta {position:relative;  display:block; text-align: center;  width: 12%; margin-left:39.5% ; margin-right:40.5% ; z-index:99; top:0;  border: 2px solid #FFFFFF; background: transparent;   }
.bottom .cta-extension { position:absolute;  display:block;  font-size: 20px; line-height: 25px; width:500px;  left:50%; margin-left:-250px; top:90%; z-index:108;   } 

.bottom .bg { position:absolute;  display:block; top:0; margin:0; padding:0; width:70%; margin-right:15%; margin-left:15%;  height:420px;    border-radius: 25px; z-index:2; background: transparent url('images/bottom-bg.jpg') no-repeat top center; background-size: cover;      }


 

.about .logo {  position: relative;  display:block;  height: auto;  padding-top: 80px; width:20%; margin-right:30%; margin-left:52%;   }
.about p.copyright {  position: relative;  display:block; text-align: center;  width:40%;  margin-right:10%; margin-left:42%;  height: 80px;  padding-top: 30px; font-size:18px; line-height: 25px;    }

 

.full-width-bottom-section {    height:auto ;      background-image: url('images/footer-BG.jpg'); background-size:cover; background-position: center bottom;   position: fixed;  left: 50%;  right: 50%;  z-index: -35;
	
 margin-left: -50vw; margin-right: -50vw;  width: 100vw; height:100%;   bottom: 0; list-style-type: none;  } 
 


.form-group {
	
  max-width: 400px;
  margin: auto;
  padding: 0px;
  background: #ffffff; 
}

.form-group h2 {
  margin-bottom: 15px;
  text-align: left;
  color: #333; font-weight: bold; margin-left:-20px;   }

.form-group label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
  color: #555;}

.form-group input,
.form-group textarea {
  width: 100%;
  padding: 10px;
  margin-bottom: 15px;
  border: 1px solid #222;
  border-radius: 5px;
	margin-left:-15px; 
  font-family: 'Roboto', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-style: normal;  font-weight:normal;  font-size: 18px; line-height: 24px; 
}


#popupModal {
  display: none; 
  position: fixed; 
  z-index: 1000; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto;
  background-color: rgba(0,0,0,0.5); /* semi-transparent background */
}

/* Modal content box */
.modal-content {
  background-color: #fff;
  margin: 10% auto; 
  padding: 30px; height: 450px; 
  border-radius: 25px; top: -30px;
  max-width: 500px;margin-bottom:100px; 
  position: relative;
}

/* Close button */
.close-btn {
  position: absolute;
  top: 15px;
  right: 15px; width:39px; height:39px;
  font-size: 23px;
  cursor: pointer;  border-radius: 25px;   border-color:#292F7E; 
} .close-btn:hover {  color: #CD128A; border-color:#CD128A; }



.iframe-container {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* controls aspect ratio, 65% = taller iframe */
  height: 0; top: 30px;
  overflow: hidden;
}

.iframe-container h3 { 
	color:#000; font-size:30px; font-weight: bold; margin:0; padding:10px; margin-left:0; text-align: center;}
	
.iframe-container a { font-size: 18px; line-height:30px; font-weight: 600; padding:4%;  color: #292F7E; text-align: center; 
  position: relative; display: block; padding:20px;  top: 0;  left: 0;   width: auto; height: auto;  border: none;
	}  
	.iframe-container .link {  position:relative; display: block; width:100%;  height:200px;  }  
	.iframe-container .cta { font-size: 16px; line-height:40px;float:none; margin-left:20%; margin-right:20%; width:60%;   top:10px; }
	.iframe-container .cta img { width:7%;   left:10px;     } 




/* Basic form styling */
form input, form textarea {
  width: 100%;
  padding: 10px;
  margin: 10px 0; 
}

form button {position: absolute;  color:#fff; width:220px; height:60px; display: block; float:left;  padding: 0.5rem 0.0rem;  background: transparent url('images/CTA-bg.png') no-repeat top center; background-size: cover; vertical-align: middle;   border-radius: 40px; text-align: center; text-transform: uppercase; left:60px;   margin-top:20px;  
font-family: 'Roboto', sans-serif; font-style: normal;  font-weight:700;  font-size: 18px; line-height: 40px; border: none; cursor: pointer;}  
form button  img {position: relative; color:#fff;  width:11%; height:auto; display:  inline-block; left:10px; }