@font-face {
     font-family: paragraph;
     src: url(../fonts/paragraph.woff2);
}

@font-face {
     font-family: sfpro;
     src: url(../fonts/sf-pro-icons_regular\ \(2\).woff2);
}

.firstcont{
     margin: auto;
     width: 90vw;
     display: flex;
     flex-direction: row;
     gap: 100px;
     margin-top: 100px;
}

.name{
     font-size: 40px;
     text-align: center;
     font-family: sfpro;
}

.aboutprofile{
     width: 40%;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     object-fit: contain;
}

.aboutprofile img{
     width: 100%;
}

#scrollsection1 {
     height: auto;
     width: 70%;
     /* display: grid; */
     place-content: center;
     text-align: justify;
  }
   #scrollsection1 p {
     font-size: 25px;
  }


  .scrollsec p{
     color: rgb(64, 64, 64);
     font-family: sfpro;
  }

  @media screen and (min-width: 300px) and (max-width:500px){
     .firstcont{
          display: flex;
          flex-direction: column;
          width: 90vw;
     }
     .aboutprofile{
          width: 100%;
     }
     #scrollsection1{
          width: 100%;
          margin-top: -50px;
     }
     #scrollsection1 .heading{
          font-size: 25px;
     }
     #scrollsection1 .reveal-type{
          font-size: 20px;
     }
     #scrollsection .reveal-type{
          font-size: 20px;
     }
     .heading{
          font-size: 35px !important;
     }
  }