/*shared section styles*/ 
*{
    margin: 0;
    padding: 0;
}
body{
    font-family: 'Open Sans', sans-serif;
}
main{
    text-align: center;
}
footer{
    text-align: center;
}

.primary-color{
    background: #E55473;
}
.section-back-color{
    background: rgba(229, 84, 115, 0.10);
}
.section-two-three-photos-back-color{
    border-radius: 300px 300px 0px 0px;
    width: 464px;
    height: 538px;
}
.section-three-color{
    border-radius: 8px;
    background: rgba(39, 39, 39, 0.05);
}
.section-four-color{
    border-radius: 8px;
    background: rgba(229, 84, 115, 0.05);
}
.section-seven-color{
    background: #111010;
}
.primary-button{
    border-radius: 8px;
    background: #E55473;
    padding: 20px 40px;
    border: 1px solid #ef476f;
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    margin-top: 10px;
}
.primary-button:hover{
    background-color: #f72585;
   
}

/*----header section start----*/
/*------ banner section ------*/

#banner{
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.banner-info{
       padding-top: 100px;
}


.banner-info-title{
    color: #272727;
    font-family: Lato;
    font-size: 80px;
    font-weight: 800;
    padding:0 0 20px 10px;
         
}
.banner-details{
    color: rgba(39, 39, 39, 0.60);
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin: 10px 0;
    padding: 0 30px 0 10px;
}
#pr-btn{
    margin: 10px 0 0 10px;
}
.banner-profile{
    margin-top: 50px;
    margin-bottom: 0px;
     
}

/*----header section end----*/


/*----main section start----*/
/*----section one start----*/

.section-title{
    color: #272727;
    text-align: center;
    font-family: Lato;
    font-size: 40px;
    font-weight: 800;
    margin-top: 50px;
    margin-bottom: 25px;
}
.section-information{
    margin: 0 auto;
    color: rgba(39, 39, 39, 0.60);
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin-bottom: 30px;
    padding: 10px 50px;
}
.photos{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin-top: 40px;
}
.image-one{

    width: 310px;
    height: 428px;
    border-radius: 300px 300px 0px 0px;
    background: rgba(167, 33, 98, 0.15);
    text-align: center;
    padding: 100px 78px 0;
    
}
.image-two{
   width: 370px;
    height: 370px;
  text-align: center;
    border-radius: 300px 300px 0px 0px;
    background: rgba(5, 151, 160, 0.15);
    padding: 132px 47px 29px 47px;
}
.image-three{
    width: 314px;
    height: 471px;
    text-align: center;
    border-radius: 300px 300px 0px 0px;
    background: rgba(71, 125, 17, 0.15);
    padding: 55px 75px 0px 75px;
}
.paragraph-lines{
    color: #272727;
    font-family: Lato;
    font-size: 24px;
    font-weight: 700;
    line-height: 35px;
    text-decoration-line: underline;
    margin: 20px;
    padding: 5px;
}
#paragraph-lines-two{
     margin-top: 50px;
}

/*----section one end----*/

/*----section two start----*/
.section-two-para{
    max-width: 80%;
    display: flex;
    justify-content: space-around;
    margin: 150px auto 20px auto;
    padding: 40px 20px;
    background: rgba(39, 39, 39, 0.05);  
    border-radius: 8px;
}
/*----section two end----*/

/*----section three start----*/

#section-three{
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.colorful{
    color:#E55473;
}
#ban-title{
    color: #272727;
    font-size: 40px;
    font-weight: 800;
    display: inline;
    margin: 10px 0px 10px 0px;
}
#ban-detail{
    margin: 10px 0;
    color: rgba(39, 39, 39, 0.60);
    text-align: center;
    font-family: Lato;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}
#picture{
    margin-bottom: 20px ;
    
}
/*----section three end----*/

/*----section four start----*/

.section-four-title{
    color: #272727;
    text-align: center;
    font-family: Lato;
    font-size: 40px;
    font-weight: 800;
    margin-top: 50px;
    margin-bottom: 15px;
}
.section-four-information{
    margin: 0 auto;
    color: rgba(39, 39, 39, 0.60);
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin-bottom: 30px;
    padding: 10px 50px;
}
.photos1{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin-bottom: 40px;
}
/*----section four end----*/

/*----section four start----*/
.section-five{
     max-width: 80%;
     margin: 0 auto;
     height: 400px;
     background-image: url('../assets/Rectangle\ 9.png');
     background-size: cover;
     background-repeat: no-repeat;
     align-items: center;
     display: flex;
     justify-content: center;
     margin-top: 100px;
     border-radius: 10px;

}
.banner-two-title{
    color: #272727;
    text-align: center;
    font-size: 40px;
    font-weight: 800;
}
.banner-two-info{
    color: rgba(39, 39, 39, 0.60);
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin: 15px 0 25px 0;
}

.email-into{
    width: 700px;
    height: 64px;
    border-radius: 8px;
    background: #FFF;
    padding-left: 25px;
    margin: 0 10px;
}
#email-into-text{
    color: rgba(39, 39, 39, 0.60);
    text-align: left;
    font-size: 16px;
    font-weight: 400;
}
/*----section four end----*/
/*----main section end----*/

/*----footer start----*/

.foot-header{
    max-width: 100%;
    background: #000;
    color: #FFFFFF;
    margin-top: 80px;
    padding: 50px 80px 0 80px;
}
#section-title-one{
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 800;
    line-height: normal;
    margin-top: 100px;
    margin-bottom: 40px;
}
.footer-paragraph{
    color: rgba(255, 255, 255, 0.90);
    padding: 0 350px;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
 
}
.footer-paragraph-one{
    color: rgba(255, 255, 255, 0.40);
    text-align: center;
    font-family: Lato;
    font-size: 16px;
    font-weight: 400;
    margin-top: 34px;
    padding-bottom: 100px;
}

/*----footer end----*/


/*-----media query------*/

@media(max-width: 767px) {

   #banner{
    flex-direction: column;
    text-align: center;
    justify-content: center;
    margin: 0 auto;
   }
   .banner-info{
    padding-top: 20px;
    margin: 0 auto;
}
   .banner-info-title{
    font-size: 50px;
    margin: 0 auto;
    padding: 0 10px;
         
}
   .banner-details{
     font-size: 14px;
     padding: 0 10px;
   }
   .primary-button{
    padding: 15px 25px;
    font-size: 18px;
    margin-top: 10px;
   }
   #banner img{
     width: 90%;  
}

.section-title{
    text-align: center;
    font-size: 25px;
}
.section-information{
    margin: 0 auto;
    text-align: center;
    font-size: 15px;
    line-height: 25px;
}

.photos {
   flex-direction: column;
  
}
img{
  height: 100%;
  width: 100%;
  margin: 0 auto;
}
.image-one{
    width: 150px;
    height: 300px;
    border-radius: 150px 150px 0px 0px;
    background: rgba(167, 33, 98, 0.15);
    margin-bottom: 40px;
   
}
.image-two{
    width: 210px;
    height: 240px;
    border-radius: 150px 150px 0px 0px;
    background: rgba(5, 151, 160, 0.15);
    margin: 20px 0 20px 0;
}
.image-three{
    width: 150px;
    height: 300px;
    border-radius: 150px 150px 0px 0px;
    background: rgba(71, 125, 17, 0.15);
    margin-top: 20px;
}
.photos .paragraph-lines{
    font-size: 15px;
    line-height: 25px;
}
.section-two-para{
    margin: 100px auto 40px auto;
    flex-direction: column;
    gap: 30px;
    padding: 0 10px;
}
.section-two-para img{
    width: 50%;
    padding: 10px;
}
.section-two-para p{
    padding: 15px 10px;
}
#section-three{
    flex-direction: column;
    align-items: center;
}

#ban-title{
    font-size: 25px;
    margin: 20px 0px 10px 0px;
}
.banner-details {
    text-align: center;
    font-size: 15px;
    line-height: 20px;
    padding: 15px 10px 10px 10px;
}
#picture{
    width: 50%;
    margin-bottom: 20px ;
    
}

.section-four-title{
    text-align: center;
    font-size: 30px;
}
.section-four-information{
    text-align: center;
    font-size: 15px;
    line-height: 20px;
}
.photos1{
    width: 80%;
   flex-wrap: wrap;
   margin: 0 auto;
   
}
.section-five{
     margin: 0 auto;
     align-items: center;
     margin-top: 80px;
     padding: 10px 10px;

}
.banner-two-title{
    text-align: center;
    font-size: 20px;
}
.banner-two-info{
    text-align: center;
    font-size: 18px;
    line-height: 20px;
    margin: 15px 0 25px 0;
}

.email-into{
    width: 180px;
    height: 64px;
    margin: 0 10px;
}
#email-into-text{
    text-align: left;
    font-size: 14px;
}
#subscribe-btn{
    border-radius: 8px;
    background: #E55473;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 500;
    margin-top: 20px;
}
#subscribe-btn:hover{
    background-color: #f72585;
   
}
.foot-header{
    margin-top: 80px;
    align-items: center;
    
}
#section-title-one{
    font-size: 30px;
    font-weight: 800;
    margin-top: 50px;
    margin-bottom: 30px;

}
.footer-paragraph{
    padding: 5px 5px;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
 
}
.footer-paragraph-one{
    font-size: 12px;
    font-weight: 400;
    margin-top: 30px;
    padding-bottom: 80px;
}

}


@media only screen and (min-width: 768px) and (max-width: 1024px) {
   #banner{
    flex-direction: column;
    text-align: center;  
   }
   .banner-info{
    padding-top: 20px;
   
}
   .banner-info-title{
    font-size: 40px;      
}
   .banner-details{
     font-size: 14px;
     padding: 0 100px;
   }
   .primary-button{
    padding: 15px 25px;
    font-size: 18px;
    margin-top: 10px;
   }
   #banner img{
     width: 50%;  
}
.section-title{
    text-align: center;
    font-size: 30px;
}
.section-information{
    margin: 0 auto;
    text-align: center;
    font-size: 20px;
    line-height: 25px;
    padding: 0 40px;
    margin-bottom: 20px;
}
.photos {
   flex-wrap: wrap;
   margin: 0 auto;
   
}
.image-one{
    margin-bottom: 40px;
}
.image-two{
    margin-bottom: 40px;
}

.section-two-para{
  gap: 30px;
}
#section-three{
    align-items: center;
}

#ban-title{
    font-size: 25px;
    margin: 20px 0px 10px 0px;
}
.banner-details {
    text-align: center;
    font-size: 15px;
    line-height: 20px;
    padding: 15px 10px 10px 10px;
}
#picture{
    width: 50%;
}
.section-four-title{
    text-align: center;
    font-size: 35px;
}
.section-four-information{
    text-align: center;
    font-size: 18px;
    line-height: 25px;
}
.photos1 img{
   width: 90%;
   flex-wrap: wrap;
   margin: 0 auto;
   
}
.email-into{
    width: 500px;
    height: 64px;
    margin: 0 10px;
}
#email-into-text{
    text-align: left;
    font-size: 14px;
}
#subscribe-btn{
    background: #E55473;
    padding: 20px 30px;
    font-size: 20px;
    font-weight: 700;
    margin-top: 20px;
}
#subscribe-btn:hover{
    background-color: #f72585;
   
}
.foot-header{
    margin-top: 80px;
    align-items: center;
    
}
#section-title-one{
    font-size: 35px;
    font-weight: 800;
    margin-top: 50px;
    margin-bottom: 30px;

}
.footer-paragraph{
    padding: 5px 5px;
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
 
}
.footer-paragraph-one{
    font-size: 12px;
    font-weight: 400;
    margin-top: 30px;
    padding-bottom: 80px;
}

 }