@import url('https://fonts.googleapis.com/css2?family=Chewy&display=swap') ;
@import url('https://fonts.googleapis.com/css2?family=Chango&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap');



body{
  height: 1920px ;
    background: linear-gradient(to bottom, #FFBDD6, #FF70A7);
    
    margin: 0px; 
 }
 

              h1{ 

                font-family : 'Chewy', sans-serif; 
                font-size: 100px; }
                
                
                h2{ 
                  color: white;
                font-family : 'Chewy', sans-serif; 
                font-size: 70px; }
                
                h3{
                  color: black ;
                  font-family : 'Chewy', sans-serif; 
                  font-size: 70px; 
                  
                  margin:0px;
                  }
                
                p{
                  font-family: "M PLUS Rounded 1c", sans-serif;
                  font-weight: 400;
                  font-style: normal;
                  font-size: 17px;}
                  
                hr{
                  border-radius: 25px;
                  border: 6px solid #8F1768; }


.wrapper {
  
  width: 1400px;
  height: 1880px ;
  
  margin-left: 13%;
  text-align: center ;
  
}
  

          .hero-image {
            background-image : linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('banner.jpg');
          
          width: 100%;
            height: 50%;
          
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            position: relative;
          }
          
          .hero-text {
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            color: white;
          }



.about{
  margin:auto; 
  margin-top: 50px;
  margin-left: 17%;
  height:400px; 
  width: 900px;
 justify-content : center;
 
 
  
  }
                
                .row1 {
                  margin-top: 70px;
                
                 height : 550px ;
                
                  display: grid;
                  grid-template-columns:  1fr 2fr 3fr 4fr;
                  }
                  
                  
                  
                  .row2 {
                  margin-top: 100px;
                
                 height : 500px ;
                
                  display: grid;
                  grid-template-columns:  1fr 2fr 3fr 5fr ;
                  }

        .button{
          font-family: "Chango", sans-serif;
           font-weight: 400;
            font-style: normal;
  
  
          margin-top:10px;
            border-radius: 25px;
            background-color: #FF8CBB;
            border: none;
              color: black;
              padding: 15px 32px;
              text-align: center;
              
              transition: 1s;}
              
              
              
                    button:hover {
                        border-radius: 25px;
                        text-align: center;
                        background-color: #FF247E;
                        box-shadow: 5px 10px #8F1768;}
  
            
  .image1{
      border: 6px solid #B8A3B2;
      padding: 10px;
      border-radius: 25px;
        
      background:white;  
      
      transition: 1s;
     }    
              .image1:hover {
                display: block;
                position: sticky;
                transform: scaleY(110%);}
  
  
  
  .image2{
    float: left;
    margin-left: 35px;
    
      border: 6px solid #B8A3B2;
      border-radius: 25px;
      padding: 10px;
      background: white;  
      
      transition: 1s;
      }

          .image2:hover {
            display: block;
            position: sticky;
            transform: scaleY(110%);}
             
         
             
.footer {
  float:left ;
  background:white ;
  height:200px;
  width:100%; 
  
  padding: 10px;}