styles.css

@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;400&display=swap');
*{
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
.header{
  width: 100%;
  height: 80px;
  padding: 10px 1% 10px 4%;
  /* background-color: red; */
  display: flex;
  justify-content: space-between;
}
.logo{
  width: fit-content;
  /* height:; */
  background-color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}
.name{
  font-family: roboto;
  font-weight:900;
  font-size: 32px;
  line-height: 24px;
}
.astrik{
  color: red;
  font-size: 32px;
  font-weight: bold;
}
.nav 
{
  width: 70%;
  /* background-color: green; */
  display: flex;
  justify-content: flex-end;
  align-items: center;
  row-gap: 6px;
  /* margin-left: 250px; */
  font-weight: bold;
}


.nav-links {
  list-style-type: none;
  display: flex;
}
.nav-link{
  padding: 0px 22px;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: bold;
}
.border{
  width: 1px;
  height: 18px;
  background-color: rgb(210, 206, 206);
  
}
.search{
  width:5px;
  /* background-color: pink; */
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0px 30px;
 
}
.search-icon{
  width: 18px;
  height: 18px;
}
.social-media{
  width:20%;
  background-color: white;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.social-media-icon{
  height: 17px;
  width: 17px;
}
.banner-container{
  width: 100%;
  height: 700px;
  background-color: gray;
  display: flex;
}
.banner-text{
  width: 50%;
  height: 100%;
  background-color: #ff214f;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
}
.banner-text :nth-child(1){
  font-size: 100px;
  line-height: 95px;
  font-family: Montserrat, sans-serif;
  font-weight: bold;
  margin-top: -10px;
  margin-right: 100px;
  padding-bottom: 30px;
}
.banner-text :nth-child(2){
  font-family: roboto;
  font-size: 18px;
  line-height: 26px;
  text-decoration: line-through;
  margin-right: 220px;

}
.banner-image{
  width: 50%;
  /* height: 100%; */
  background-color: yellow;
  background-image: url(./images/banner-image.jpg);
  background-size: 1050px 710px;
  background-repeat: no-repeat;
  background-position: -220px -10px ;
  overflow: hidden;
}
.banner-image img{
  width: 100%;
  height: 600px;
  overflow: hidden;
}
.note{
  width: 100%;
  height:fit-content;
  /* background-color: gray; */
  display: flex;
  flex-direction: column;  
  margin-bottom: 110px;
}
.note-1{
  width: 100%;
  height: 350px;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* padding-top: 20px; */
}
.note-1 :nth-child(1){
  color: #ff214f;
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 23px;
  padding-bottom: 5px;
}
.note-1 :nth-child(2), 
.note-1 :nth-child(3)
{
  font-family: Roboto, sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 40px;
  color: black;
}
.features{
  width: 100%;
  height: 100%;
  /* background-color: aqua; */
  /* padding-top: 20px; */
  display: flex;
  justify-content: space-evenly;
}
.feature{
  width: 30%;
  height: fit-content;
  /* background-color: blue; */
  display: flex;
  justify-content: space-evenly;
}

.feature img{
  width: 40px;
  height: 40px;
}
.img-border{
  width: 2px;
  height: 24px;
  background-color: #ff214f;
  margin-top: 5px;
}
.feature-desc :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 23px;
  color: #232323;
  padding-bottom: 10px;
}
.feature-desc :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.banner-2{
  width: 100%;
  height: 600px;
  background-color: rgb(28, 26, 26);
  display: flex;
}
.banner-2-text{
  width: 50%;
  height: 100%;
  background-color: rgb(28, 26, 26);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding-left: 5%;
}
.banner-2-text :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: #939393;
  margin-bottom: 10px;
}
.banner-2-text :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 25px;
  font-weight: 500 ;
  line-height: 30px;
  color: #d6d5d5;
  margin-bottom: 20px;
}
.banner-2-text :nth-child(3){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
  margin-bottom: 20px;
}

.banner-2-text button{
  width: fit-content;
  height: fit-content;
  border: 2px solid black;
  border-radius: 6px;
  background-image: url(./images/play-icon.webp);
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-position: 10px;
  background-color: white;
  color: black;
  font-family: Montserrat, sans-serif;
  font-size: 11px;
  font-weight: 900;
  line-height: 24px;
  padding: 4px 24px 4px 34px;
  transition: 0.3s;
}
.banner-2-text button:hover{
  background-color: black;
  border-color: white;
  color: white;
}


.banner-2-image{
  width: 50%;
  height: 100%;
  background-color: rgb(28, 26, 26);
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  padding-right: 26px;
}
.banner-2-img{
  width: 42%;
  height:60%;
  background-color: #ff214f;
}
.banner-2-img img{
  width: 258px;
  height: 360px;
}
.banner-2-img-text{
  width: 100%;
  height: 100%;
  background-color:#ff214f;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding-left: 30px;
  color: white;
}
.banner-2-img-text :nth-child(1){
  font-family: Roboto, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px; 
}
.banner-2-img-text :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  padding-top: 20px;
}
.achievements{
  width: 100%;
  height: 500px;
  /* background-color: yellowgreen; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 5%;
  /* padding: 200px 0px; */
  /* margin-top: 100px; */
}
.achievement{
  width: 23%;
  height: 50%;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px;
  border-style: solid;
  border-color: #ededed;
  /* transition: 0.3s; */
}
.achievement:hover{
  border: 6px solid #ff214f;
}
.achievement img{
  width: 50px;
  height: 50px;
  margin-bottom: 10px;
}
.achievement p:nth-of-type(1){
  font-family: Montserrat, sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 30px;
}
.achievement p:nth-of-type(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
/* Banner -3 */
.banner-3{
  width: 100%;
  height: 990px;
  background-color: #6f6f6f;
  position: relative;
}
.banner-3-image{
  width: 100%;
  height: 600px;
  background-color: #ff214f;
  overflow: hidden;
  position: absolute;
}
.banner-3-image img{
  width: 100%;
  /* opacity: 0.5; */
}
.overlay{
  position: absolute;
  width: 100%;
  height: 100%;
  /* background-color: red; */
  background-color: rgba(34, 33, 33, 0.8);
  display: flex;
  flex-direction: column;
  row-gap: 5px;
  /* z-index: 2; */
}
.banner-3-part1{
  width: 100%;
  height: 45%;
  background-color: transparent;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.banner-3-part1 img{
  width: 130px;
  height: 130px;
}
.banner-3-part1 p{
  font-family: Montserrat, sans-serif;
  font-size: 40px;
  font-weight: 500;
  line-height: 46px;
  color: #ffffff;
  text-align: center;
}
.banner-3-part2{
  width: 100%;
  height: 30%;
  background-color: transparent;
  display: flex;
  justify-content: space-between;
  /* column-gap: 50px; */
  padding: 0px 5%;
  z-index: 1;

}
.banner-3-feature{
  width: 23%;
  height: 100%;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.banner-3-feature h1{
  font-family: Montserrat, sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 46px;
  color: #ff214f;
  margin-top: 30px;
}
.banner-3-feature :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  color: #232323;
  padding-top: 10px;
}
.banner-3-feature :nth-child(3){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
  text-align: center;
  padding-top: 10px;
}
.banner-3-part3{
  width: 100%;
  /* height: 10%; */
  background-color: #ff214f;
  position: absolute;
  /* bottom: 0px; */
  top: 600px;
}
.banner-3-qualities{
  width: 100%;
  /* height: 100%; */
  background-color: #f7f7f7;
  display: flex;
  justify-content: space-between;
  padding: 230px 5% 120px 5%;
}
.banner-3-quality{
  width: 23%;
  /* height: 100%; */
  background-color: transparent;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 30px;
}
.banner-3-quality i{
  color: #ff214f;
  font-size: 40px;
  font-weight: 100px;
  padding-right: 10px;
  -webkit-text-stroke: 1px;
}
.banner-3-quality-text{
  display: flex;
  flex-direction: column;
}
.banner-3-quality-text :nth-child(1){
  font-style: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}
.banner-3-quality-text :nth-child(2){
  font-style: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #6f6f6f;
}

/* Section 2 Start */

.section-2{
  width: 100%;
  height: 1000px;
  /* background-color: #ff214f; */
}
.section-2 .part-1{
  width: 100%;
  height: 200px;
  background-color: white ;
  display: flex;
  justify-content: center;
  align-items: center;
}
.section-2-nav-links{
  display: flex;
  list-style-type: none;
  justify-content: center;
  align-items: center;
  column-gap: 30px;
}
.section-2-nav-links :nth-child(1){
  text-decoration: underline;
}
.section-2-nav-link{
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #232323;
}
.animations-1-container{
  width: 100%;
  height: 460px;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* margin: 0px 20px; */
  /* padding: 0px 5%; */
}
.animation-row{
  display: flex;
  justify-content: space-between;
  align-items: center;
  
   padding: 0px 2%;
}
.animation-box{
  width: 24%;
  height: 220px;
  /* background-color: #ff214f; */
  overflow: hidden;
}

.animation{
  width: 100%;
  height: 330px;
  background-color: white;
  transition: 0.4s;
}
.animation:hover{
  margin-top: -110px;
}
.animation img{
  width: 100%;
  height: 220px;
}
.animation-text{
  width: 100%;
  height: 110px;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.animation-text :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  color: #232323;
}
.animation-text :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: 14px;
  color: #939393;
}
/* Part-3- Start */
.section-2-features{
  width: 100%;
  height: 340px;
  /* background-color: aqua; */
  padding: 0px 5%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.section-2-feature{
  width: 28%;
  height: 50%;
  /* background-color: #ff214f; */
  display: flex;
  align-items: center;
  position: relative;
  /* transition: s; */
}
.section-2-feature-div{
  width: 100%;
  height: 46%;
  /* background-color: blue; */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
  transition: opacity 0.5s;
}
.section-2-feature:hover .section-2-overlay {
  z-index: 2;
  opacity: 1;
  transform: scale(1);
}
.section-2-overlay{
  width: 100%;
  height: 100%;
  background-color: rgb(39, 36, 36);
  position: absolute;
  opacity: 0;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start; 
  row-gap: 10px;
  padding-left: 30px;
  /* transition: 1s; */
}
.section-2-overlay :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: #c5bebe;
}
.section-2-overlay :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-2-feature-icon{
  width: 26%;
  height: 100%;
  /* background-color: wheat; */
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid rgb(206, 202, 202);
  border-radius: 4px;
}
.section-2-feature-icon img{
  width: 35px;
  height: 35px;
}
.section-2-feature-text{
  width: 70%;
  height: 100%;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 20px;
} 
.section-2-feature-text :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 23px;
  color: #232323;
}
.section-2-feature-text :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}


/* section -2 End */

/* Section-3 Start */

.section-3{
  width: 100%;
  height: 560px;
  background-color: #ff214f;
  display: flex;

}
.section-3-part1{
  width: 50%;
  height: 100%;
  background-color: aqua;
  background-image: url(./images/section-3-image.jpg);
  background-position: -130px 0px;
}
.section-3-part2{
  width: 50%;
  height: 100%;
  background-color: rgb(29, 28, 28);
  display: flex;
  justify-content: center;
  align-items: center;
}
.section-3-text{
  width: 80%;
  height: 80%;
  background-color: rgb(29, 28, 28);
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
  align-items: start;
  row-gap: 30px;
  padding-left: 30px;
  padding-top: 10px;
}
.section-3-text :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 23px;
  color: #6f6f6f;
}
.section-3-text :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 40px;
  font-weight: 500;
  line-height: 46px;
  color: #d6d5d5;
}
.section-3-text :nth-child(3){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-3-text :nth-child(4){
  font-family: Montserrat, sans-serif;
  font-size: 11px;
  font-weight: 600;
  line-height: 24px;
  color: white;
  background-color: #232323;
  border: 2px solid white;
  border-radius: 4px;
  padding: 4px 24px;
}
/* Section-3 End */
/* Section-4 Start */

.section-4{
  width: 100%;
  height: 800px;
  /* background-color: aqua; */
}
.section-4-part1{
  width: 100%;
  height: 290px;
  /* background-color: #ff214f; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 10px;
}
.section-4-part1 :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #939393;
}
.section-4-part1 :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 32px;
  font-weight: bold;
  line-height: 40px;
  color: #232;
}
.section-4-part1 :nth-child(3){
  color: #ff214f;

}
.section-4-part2{
  width: 100%;
  height: 510px;
  /* background-color: aqua; */
  display: flex;
  justify-content: space-between;
  padding: 0px 5%;
}
.section-4-image-div{
  width: 23%;
  height: 100%;
  /* background-color: blue; */
}
.section-4-image{
  width: 100%;
  height: 66%;
  position: relative;
  /* background-color: #ededed; */
}
.section-4-image img{
  height: 100%;
}
.section-4-overlay{
  width: 100%;
  height: 0;
  background-color: rgba(0, 0, 0, 0.7);
  position: absolute;
  transition: .3s;
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.section-4-overlay :nth-child(1){
  position: absolute;
  opacity: 0;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  color: #ffffff;
  margin-top: 60px;

}
.section-4-overlay :nth-child(2){
  position: absolute;
  opacity: 0;
  width: 80%;
  height: 1px;
  background-color: #ff214f;
  margin-top: 180px;
}
.section-4-icons{
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  font-size: 0;
}
.section-4-image:hover > .section-4-overlay{
  height: 100%;
}
.section-4-image:hover > .section-4-overlay > :nth-child(1){
  opacity: 1;
}
.section-4-image:hover > .section-4-overlay > :nth-child(2){
  opacity: 1;
}
.section-4-image:hover > .section-4-overlay > .section-4-icons > .i{
  font-size: 50px;
  color: white;

}
.section-4-image-text :nth-child(1){
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #232323;
  text-align: center;
  padding-top: 10px;
}
.section-4-image-text :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: 14px;
  color: #939393;
  text-align: center;
}


/* Sction-4 End */

/* Section-5 Start */
.section-5{
  width: 100%;
  height:560px;
  background-color: #ff214f; 
  display: flex; 
}
.section-5-part1{
  width: 50%;
  height: 100%;
  background-color: aqua;
  background-image: url('./images/section-5-image.jpg');
  background-size:  130% 100%;
  background-position: -80px 0px;
  background-repeat: no-repeat;
}
.section-5-part2{
  width: 50%;
  height: 100%;
  background-color: rgb(27, 27, 27);
  display: flex;
  flex-direction: column;
  padding: 0px 5%;
}
.section-5-text-1{
  width: 100%;
  height: 34%;
  /* background-color:#ff214f; */
  display: flex;
  justify-content: center;
  align-items: center;
}
.section-5-text-1 p{
  font-family: Montserrat, sans-serif;
  font-size: 40px;
  font-weight: 500;
  line-height: 46px;
  color: #ffffff;
}
.section-5-text-2-container-1{
  width: 100%;
  height: 33%;
  /* background-color: aqua; */
  display: flex;
  justify-content: space-between;
}
.section-5-text-2-container-1 div{
  width: 48%;
  height: 100%;
  /* background-color: gray; */
  display: flex;
  flex-direction:column;
  row-gap: 10px;
}
.section-5-text-2-container-1 div :nth-child(1),
.section-5-text-2-container-2 div :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: #d6d5d5;
}
.section-5-text-2-container-1 div :nth-child(2),
.section-5-text-2-container-2 div :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-5-text-2-container-2{
  width: 100%;
  height: 33%;
  /* background-color: wheat; */
  display: flex;
  justify-content: space-between;
} 
.section-5-text-2-container-2 div{
  width: 48%;
  height: 100%;
  /* background-color: green; */
}


/* Section-5 End */

/* Section-6 Start */

.section-6{
  width:100%;
  height: 480px;
  /* background-color: #ff214f; */
  display: flex;
}
.section-6-part1{
  width: 50%;
  height: 100%;
  /* background-color: violet; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 0px 5%;
  row-gap: 30px;
}
.section-6-part1 :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 30px;
  color: #232323;
}
.section-6-part1 :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-6-part2{
  width: 50%;
  height: 100%;
  /* background-color: gray; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* align-items: center; */
  row-gap: 10px;
}
.section-6-part2-containers{
  width: 80%;
  height: 50px;
  /* background-color: #ff214f; */
}
.section-6-part2-text{
  width: 100%;
  /* height: 20%; */
  /* background-color: yellow; */
  display: flex;
  align-items: center;
}
.section-6-part2-text p{
  font-family: Roboto, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: 14px;
  color: #626262;
}
.section-6-bar-container{
  width: 100%;
  height: 50%;
  /* background-color: blue; */
  display: flex;
}
.section-6-bar-container :nth-child(1){
  width: 90%;
  height: 100%;
  /* background-color: green; */
  display: flex;
  align-items: center;
}
.section-6-bar-container :nth-child(1) :nth-child(1){
  width: 100%;
  height: 5px;
  background-color: gray;
  border-radius: 4px;
}
.section-6-bar-container :nth-child(1) :nth-child(1) .section-6-bar-1{
  width: 92%;
  height: 5px;
  background-color: black;
  border-radius: 4px;
}
.section-6-bar-container :nth-child(1) :nth-child(1) .section-6-bar-2{
  width: 97%;
  height: 5px;
  background-color: black;
  border-radius: 4px;
}
.section-6-bar-container :nth-child(1) :nth-child(1) .section-6-bar-3{
  width: 98%;
  height: 5px;
  background-color: black;
  border-radius: 4px;
}
.section-6-bar-container :nth-child(1) :nth-child(1) .section-6-bar-4{
  width: 92%;
  height: 5px;
  background-color: black;
  border-radius: 4px;
}

.section-6-bar-container :nth-child(2){
  width: 10%;
  height: 100%;
  background-color: white;
  display: flex;
  justify-content: center;
  
}
.section-6-bar-container :nth-child(2) p{
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  color: #6f6f6f;
  padding-left: 5px;
}

/* Section-6 End */

/* Section-7 Start */

.section-7{
  width: 100%;
  height: 730px;
  background-color: #f7f7f7;
  display: flex;
}
.section-7-part1{
  width: 50%;
  height: 100%;
  background-color: #f7f7f7;
  background-image: url('./images/section-7-image.jpg');
  background-size: 100% 70%;
  background-position: 70px 100px;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  padding-left: 220px;
}
.section-7-part1-text-box{
  width: 390px;
  height: 480px;
  background-color: black;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 20px;
  padding-top: 20px;
}
.section-7-part1-text-box :nth-child(1){
  font-family: Roboto, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 23px;
  color: #ffffff;
}
.section-7-part1-text-box :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-7-part1-text-box :nth-child(3){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
  margin-right: 20px;
}
.section-7-part1-text-box :nth-child(4){
  display: flex;
  justify-content: start;
  align-items: flex-start;
  margin-right: 90px;
}
.section-7-part1-text-box :nth-child(4) p{
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: white;
  cursor: pointer;
  /* margin-right: 70px; */
}
.section-7-part1-text-box :nth-child(4) p:hover{
  color: #ff214f;

}
.section-7-part1-text-box :nth-child(4) img{
  width: 30px;
  height: 20px;
  padding-left: 10px;
}


.section-7-part2{
  width: 50%;
  height: 100%;
  /* background-color: blue; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  row-gap: 30px;
  padding: 0px 7%;
}
.section-7-part2 :nth-child(1){
  font-size: 35px;
  color: #ff214f;
  line-height: 35px;
}
.section-7-part2 :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 40px;
  color: #232323;
}
.section-7-part2 :nth-child(3){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-7-part2 :nth-child(5) :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 26px;
  color: #232323;
}
.section-7-part2 :nth-child(5) :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
/* Section-7 End */

/* Section-8 Start */
.section-8{
  width: 100%;
  height: 360px;
  /* background-color: #ff214f; */
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

/* Section-8 End */
/* Section-9 Start */

.section-9{
  width: 100%;
  height: 860px;
  background-color: #ff214f;
}
.section-9-part1{
  width: 100%;
  height: 290px;
  background-color: black;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.section-9-part1 :nth-child(1){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-9-part1 :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 40px;
  color: #ffffff;
}
.section-9-part2{
  width: 100%;
  height: 570px;
  background-color: rgb(15, 12, 12);
  display: flex;
  justify-content: space-between;
  padding: 0px 5%;
}
.section-9-image-container{
  width: 31%;
  height: 380px;
  background-color: #1c1c1c;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 30px;

}
.section-9-image-container img{
  border-radius: 50%;
  width: 100px;
  height: 100px;
}
.section-9-image-container :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-9-image-container :nth-child(3) :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 10px;
  color: #ff214f;
}
.section-9-image-container :nth-child(3) :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: 14px;
  color: #939393;
  text-align: center;
  padding-top: 10px;
}
/* Section-9 End */

/* Section-10 Start */
.section-10{
  width: 100%;
  height: 650px;
  /* background-color: #ff214f; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0px 5%;
}
.section-10-part1{
  width: 100%;
  height: 150px;
  /* background-color: aqua; */
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.section-10-features{
  width: 22%;
  height: 100%;
  /* background-color: yellow; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* row-gap: 5PX; */
}
.section-10-features img{
  width: 60px;
  height: 60px;
}
.section-10-features :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  color: #232323;
}
.section-10-part2{
  width: 100%;
  height: 260px;
  /* background-color: green; */
  display: flex;
  justify-content: space-between;
}
.section-10-highlights{
  width: 31%;
  height: 100%;
  /* background-color:blue; */
  display: flex;
}
.section-10-part2 :nth-child(1) img{
  /* background-image: url(./images/section-10-image.jpg); */
  height: 260px;
}
.section-10-part2 :nth-child(2){
  display:flex;
  justify-content: center;
  align-items: center;
  border: 2px solid rgb(232, 229, 229);
}
.section-10-part2 :nth-child(2) :nth-child(1){
  /* width: 80%; */
  /* height: 80%; */
  /* background-color: wheat; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  row-gap: 10px;
  
} 
.section-10-part2 :nth-child(2) :nth-child(1) :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 23px;
  color: #232323;
}
.section-10-part2 :nth-child(2) :nth-child(1) :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 23px;
  color: #939393;
  border: none;
}
.section-10-part2 :nth-child(3){
  display: flex;
  justify-content:center;
  align-items: center;
 background-color: #f7f7f7;;

}
.section-10-part2 :nth-child(3) :nth-child(1){
  width: 80%;
  /* height: 80%; */
  /* background-color: #ff214f; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  row-gap: 20px;
}
.section-10-part2 :nth-child(3) :nth-child(1) :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 23px;
  color: #232323;
}
.section-10-part2 :nth-child(3) :nth-child(1) :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
  border: none;
}
.section-10-part2 :nth-child(3) :nth-child(1) button{
  font-family: Montserrat, sans-serif;
  font-size: 9px;
  font-weight: 600;
  line-height: 22px;
  background-color: #212529;
  color: white;
  padding: 1px 17px;
  border: 2px solid black;
}

/* Section-10 End */

/* Section-11 Start */

.section-11{
  width: 100%;
  height: 400px;
  background-color: #1c1c1c;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 5%;
}
.section-11-container{
  width: 100%;
  height: 160px;
  /* background-color: aqua; */
  display: flex;
}
.section-11-container-part1{
  width: 35%;
  height: 100%;
  /* background-color: yellow; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  row-gap: 10px;
}
.section-11-container-part1 :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 26px;
  color: #ffffff;
}
.section-11-container-part1 :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-11-container-part2{
  width: 65%;
  height: 100%;
  /* background-color: blue; */
  display: flex;
  justify-content: space-between;
}
.section-11-container-part2-features{
  width: 25%;
  height: 100%;
  /* background-color: wheat; */
  border-right: 2px solid #363636;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 10px;
}
.section-11-container-part2 :nth-child(1),
.section-11-container-part2 :nth-child(2),
.section-11-container-part2 :nth-child(3),
.section-11-container-part2 :nth-child(4)
{
  font-family: Roboto, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 23px;
  color: #b7b7b7;
}

.section-11-container-part2 :nth-child(4){
  border: none;
}
/* Section-11 End */
/* Section-12 Start */

.section-12{
  width: 100%;
  height: 1000px;
  /* background-color: #ff214f; */
  padding: 0px 6%;
}
.section-12-part1{
  width: 100%;
  height: 300px;
  /* background-color: aqua; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* row-gap: 10px; */
}
.section-12-part1 :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  color: #939393;
}
.section-12-part1 :nth-child(2){
  font-family: Montserrat, sans-serif;
  font-size: 32px;
  font-weight: 900;
  line-height: 40px;
  color: #232323;
}
.section-12-part2{
  width: 100%;
  height: 530px;
  /* background-color: green; */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  column-gap: 30px;
}
.section-12-part2-container{
  width: 32%;
  height: 100%;
  /* background-color: blue; */
  display: flex;
  flex-direction: column;
}
.section-12-image{
  width: 100%;
  height: 250px;
  /* background-color: wheat; */
  position: relative;
  overflow: hidden;
}
.section-12-image img{
  height: 100%;
  width: 350px;
}
.section-12-overlay{
  width: 100%;
  height: 0;
  background-color: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  /* transition: s; */
  /* opacity: 0; */
 }
 .section-12-overlay p{
  font-family: Roboto, sans-serif;
  font-size: 0;
  font-weight: 400;
  line-height: 26px;
  color: #ffffff;
 }
.section-12-image:hover > .section-12-overlay{
  height: 100%;
  /* font-size: 50px; */
  /* opacity: 1; */
}
.section-12-image:hover > .section-12-overlay > p{
  font-size: 48px;
}

.section-12-text{
  width: 100%;
  height: 280px;
  background-color: rgb(245, 244, 244);
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 20px;
  padding-left: 50px;
}
.section-12-text :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 23px;
  color: #232323;
  cursor: pointer;
}
.section-12-text :nth-child(1):hover{
  color: #ff214f;
}

.section-12-text :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
}
.section-12-text :nth-child(3){
  width: 85%;
  height: 2px;
  background-color: #b7b7b7;
}
.section-12-text :nth-child(4){
  font-family: Roboto, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: 14px;
  color: #939393;
}
/* Section-12 End */

/* Section-13 Start*/

.footer{
  width: 100%;
  height: 560px;
  background-color: black;
  display: flex;
  flex-direction: column;
  /* padding: 0px 5%; */
}
.footer-part1{
  width: 100%;
  height: 130px;
  /* background-color: aqua; */
  display: flex;
  justify-content: space-evenly;
  padding: 0px 5%;
}
.footer-part1-1{
  width: 30%;
  height: 100%;
  /* background-color: wheat; */
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  color: #6f6f6f;
}
.footer-part1-2{
  width: 20%;
  height: 100%;
  /* background-color: blue; */
  display: flex;
  justify-content: center;
  align-items: center;
  
}
.footer-name{
    font-family: roboto;
    font-weight:900;
    font-size: 32px;
    line-height: 24px;
    color: white;
  }

.footer-part1-3{
  width: 30%;
  height: 100%;
  /* background-color: yellow; */
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.footer-social-media-text{
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  color: #6f6f6f;
}
.footer-part1-3 :nth-child(2){
  display: flex;
  justify-content: space-between;
  column-gap: 16px;

}
.footer-part1-3 i{
 color: white;
}


.footer-part2{
  width: 100%;
  height: 310px;
  background-color: #151414;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgb(116, 111, 111);
  padding: 0px 5%
}
.footer-part2-containers{
  width: 23%;
  height: 80%;
  /* background-color: blue; */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.footer-part2-container-text{
  color: #939393;
  margin-right:  140px;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #939393;
}

.footer-part2-container-1:nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #939393;
}
.footer-part2-container-1-text-2{
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  color: #6f6f6f;
  margin-top: 20px;
}
.footer-part2-container-2-box{
  width: 100%;
  height: 28%;
  /* background-color: yellow; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgb(116, 112, 112);
  /* padding: 6% 5%; */
}
.footer-image{
  width: 25%;
  height: 50%;
  /* background-color: red; */
  overflow: hidden;
}
.footer-image img{
  width: 100%;
  height: 100%;
}
.footer-image-text{
  width: 70%;
  height: 50%;
  /* background-color: white; */
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  color: #6f6f6f;
}
.footer-part2-container-2-box :nth-child(4){
  border: none;
}

.footer-part2-container-3{
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  row-gap: 20px;
  margin-right: 30px;
}
.footer-part2-container-3 :nth-child(1){
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #939393;
}
.footer-part2-container-3 :nth-child(2){
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #6f6f6f;
}
.footer-textbox-div{
  display: flex;
  width: 100%;
  height: 50px;
}

.text-placeholder{
  width: 100%;
  height: 32px;
  margin-top: 1px;
  border: none;
  background-color: #212529;
}
.text-placeholder::placeholder {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #6f6f6f;
  padding-left: 20px;
}
.footer-textbox-div img{
  width: 30px;
  height: 34px;
  /* padding-bottom: 15px; */
  margin-left: 0;
  top: 0;
  background-color: #545252;
  border:none;
  /* border-left: 1px solid darkgray; */
}
.footer-part2-container-4{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.footer-part2-container-4 :nth-child(1){
 margin-right: 90px;
 font-family: Montserrat, sans-serif;
 font-size: 12px;
 font-weight: 600;
 line-height: 20px;
 color: #939393;
}
.footer-part2-container-4 :nth-child(2){
  margin-left: 90px;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #6f6f6f;
  margin-top: 20px;
 }

.footer-part3{
  width: 100%;
  height: 120px;
  background-color: #151414;
  display: flex;
  justify-content: space-between;
  padding: 0px 5%;
}
.footer-part3-box{
  width: 30%;
  height: 100%;
  /* background-color: wheat; */
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  color: #6f6f6f;
  padding: 20px;
  padding-left: 0px;
}
.footer-part3-2{
  width: 30%;
  height: 100%;
  background-color: wheat;
}
/* Section-13 End */