/* hero sec */
.hero-sec{
    width: 85%;
    margin:4rem auto;
}
.hero-container-wrapper{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
}
.hero-container-wrapper .hero-left img{
    height: 75vh;
}
.hero-container-wrapper .hero-right .hero-text-container h1{
   font-size: 2.9rem;
   letter-spacing: 3px;
   font-weight: 700;
   
}
.hero-container-wrapper .hero-right .hero-text-container h1 span{
  color: #3498db;
  
}
.hero-container-wrapper .hero-right .hero-text-container p{
   margin-top: 2rem;
   margin-bottom: 1rem!important;
   font-size: 19px;
  font-weight: 600;
}


/* third sec  */
.third-sec{
    width: 85%;
    margin: 4rem auto;
}
.third-sec h1{
    font-weight: 800;
}
.third-sec .third-sec-p-start{
    width: 55%;
}
.third-sec .third-sec-about{
    display: flex;
    justify-content: space-between;
    margin-top: 2.5rem;
    /* align-items: center; */
}
.third-sec .third-sec-about .third-sec-about-card{
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 30%;
}
.third-sec .third-sec-about .third-sec-about-card .icon i{
   color: rgb(255, 225, 0);
   font-size: 2rem;
}
.third-sec .third-sec-about .third-sec-about-card{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.third-sec .third-sec-about .third-sec-about-card .third-sec-about-card-text h3{
    font-weight: 700;
}
.third-sec .third-sec-about .third-sec-about-card .third-sec-about-card-text p{
    text-align: justify;
}


/* forth-se  */
.forth-sec{
    width: 85%;
    margin: 4rem auto;
}
.forth-sec .forth-sec-card-wrapper{
    display: flex;
    justify-content: center;
    gap: 1.5rem;
}
.forth-sec .forth-sec-card-wrapper .forth-sec-card{
    width: 300px;
}
.forth-sec .forth-sec-card-wrapper .forth-sec-card .forth-sec-card-img img{
    height: 60vh;
    width: 300px;
    object-fit: cover;
}
.forth-sec .forth-sec-card-wrapper .forth-sec-card .forth-sec-card-text h2{
    font-size: 1.7rem;
    font-weight: 700;
    margin-top: 11px;
}

/* fifth-sec */
.fifth-sec{
    margin: 2rem 0;
    padding: 3rem 0;
    background: #000;
    color: #fff;
}
.fifth-sec .fifth-sec-container{
    width: 85%;
    margin: auto;
}
.fifth-sec .fifth-sec-container .fifth-sec-img-cont{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 3rem;
    margin-bottom: 2rem;
}
.fifth-sec .fifth-sec-container .fifth-sec-img-cont img{
    height: 50vh;
    width: 25vw;
    border-radius: 5px;
}

/* sixth-sec */
.sixth-sec{
    width: 85%;
    margin: 4rem auto;
    display: flex;
    justify-content: center;
    gap: 2rem;
}
.sixth-sec .sixth-sec-text-left, .sixth-sec .sixth-sec-text-right{
    width: 50%;
}
.sixth-sec .sixth-sec-text-right p{
    font-size: 19px;
    font-weight: 400;
}
.sixth-sec .sixth-sec-text-left h1{
    font-size: 2.7rem;
    font-weight: 700;
}

/* seventh-sec */
.seventh-sec{
    width: 85%;
    margin: 5rem auto;
}
.seventh-sec .seventh-sec-card-wrapper{
    display: flex;
    justify-content: center;
    gap: 1.5rem;
}
.seventh-sec .seventh-sec-card-wrapper .seventh-sec-card{
    width: 370px;
    border: 1px solid #747474;
    border-radius: 5px;
}
.seventh-sec .seventh-sec-card-wrapper .seventh-sec-card .seventh-sec-card-img img{
    width: 369px;
    height: 300px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    object-fit: cover;
}
.seventh-sec .seventh-sec-card-wrapper .seventh-sec-card .seventh-sec-card-text{
    padding: 1rem;
}


.eight-sec{
    width: 85%;
    margin: 5rem auto;
}
.eight-sec .eight-sec-card-wrapper{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.eight-sec .eight-sec-card-wrapper .eight-sec-card{
    width: 370px;
}
.eight-sec .eight-sec-card-wrapper .eight-sec-card h3{
    font-weight: 700;
}
.eight-sec .eight-sec-card-wrapper .eight-sec-card .eight-sec-card-icon{
    display: flex;
    justify-content: center;
}
.eight-sec .eight-sec-card-wrapper .eight-sec-card .eight-sec-card-icon i{
    font-size: 3rem;
}


/* ninth-sec  */
.ninth-sec{
    width: 85%;
    margin: 3rem auto;
}
.ninth-sec h1{
    font-weight: 700;
}
.ninth-sec .ninth-sec-card-wrapper{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3rem;
    margin-top: 3rem;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card{
    width: 100%;
    padding-bottom: 1rem;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card{
    width: 100%;
    padding-bottom: 1rem;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-img img{
   height: 88vh;
   width: 100%;
   object-fit: cover;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text{
  padding: 2rem;
  display: flex;
  justify-content: space-between;
  gap: 3rem;
  background: #000;
  color: #fff;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text .ninth-sec-card-text-left{
  width: 43%;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text .ninth-sec-card-text-right{
  width: 55%;
}
.ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text .ninth-sec-card-text-left h3{
  font-weight: 700;
}




@media (max-width: 1283px) {
    .hero-container-wrapper .hero-left img {
        height: 55vh;
    }
    .forth-sec .forth-sec-card-wrapper .forth-sec-card .forth-sec-card-img img {
        height: 42vh;
        width: 272px;
    }
    .forth-sec .forth-sec-card-wrapper .forth-sec-card .forth-sec-card-text h2 {
        font-size: 1.4rem;
    }
    .fifth-sec .fifth-sec-container .fifth-sec-img-cont img {
        height: 42vh;
    }
}
@media (max-width: 1176px) {
    .forth-sec .forth-sec-card-wrapper {
        flex-wrap: wrap;
    }
    .seventh-sec .seventh-sec-card-wrapper {
        gap: 3.5rem;
        flex-wrap: wrap;
    }
}
@media (max-width: 1029px) {
    .hero-container-wrapper .hero-left img {
        height: 50vh;
    }
    .hero-container-wrapper .hero-right .hero-text-container h1 {
        font-size: 2rem;
    }
    .hero-container-wrapper .hero-right .hero-text-container p {
        font-size: 17px;
    }
    .third-sec h1 {
        font-size: 2.2rem;
    }
    .third-sec .third-sec-about .third-sec-about-card .third-sec-about-card-text h3 {
        font-size: 1.5rem;
    }
    .sixth-sec .sixth-sec-text-left h1 {
        font-size: 2.3rem;
    }
}
@media (max-width: 933px) {
    .fifth-sec .fifth-sec-container .fifth-sec-img-cont img {
        object-fit: cover;
    }
}
@media (max-width: 844px) {
    .hero-container-wrapper {
        flex-direction: column;
    }
    .hero-left{
        width: 100%;
    }
    .hero-container-wrapper .hero-left img {
        width: 100%;
        object-fit: cover;
    }
    .third-sec .third-sec-about .third-sec-about-card {
        min-width: 250px;
    }
    .third-sec .third-sec-about {
        flex-wrap: wrap;
        justify-content: center;
        gap: 3rem;
    }
}
@media (max-width: 808px) {
    .fifth-sec .fifth-sec-container .fifth-sec-img-cont img {
        min-width: 271px;
    }
    .third-sec h1 {
        text-align: center;
    }
    .third-sec .third-sec-p-start {
        width: 80%;
        text-align: center;
        margin: auto;
    }
}
@media (max-width: 687px) {
    .sixth-sec {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 90%;
    }
    .sixth-sec .sixth-sec-text-left, .sixth-sec .sixth-sec-text-right {
        width: 100%;
    }
    .ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text .ninth-sec-card-text-left {
        width: 100%;
    }
    .ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-text .ninth-sec-card-text-right {
        width: 100%;
    }
    .forth-sec .forth-sec-card-wrapper .forth-sec-card {
        width: 300px;
        display: flex
    ;
        flex-direction: column;
        align-items: center;
    }
}
@media (max-width: 522px) {
    
    .ninth-sec .ninth-sec-card-wrapper .ninth-sec-card .ninth-sec-card-img img {
        height: 43vh;
    }
    .ninth-sec h1 {
        font-size: 2rem;
    }
    .third-sec .third-sec-p-start {
        width: 100%;
    }
    .third-sec h1 {
        font-size: 1.9rem;
    }
    .fifth-sec .fifth-sec-container .fifth-sec-img-cont img {
        min-width: 300px;
    }
}