.about {

  
  width: 100vw;
  padding-top: 2rem;
  padding-bottom: 2rem;
  
  h2 {
    text-align: center;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }

  .aboutImg {
    width: 100%;
    height: 50dvh;
    padding-top: 1rem;
    position: relative;
    overflow-x: hidden;

    .imgC {
      background-color: var(--l);
      width: 250px;
      height: 250px;
      border-radius: 50%;
      margin-left: auto;
      margin-right: auto;
    }

    .imgL {
      background-color: var(--g);
      width: 200px;
      height: 200px;
      border-radius: 50%;
      position: absolute;
      z-index: -1;
      top: 60%;
      left: 50%;
      transform: translate(-128%, -50%);
    }

    .imgR {
      background-color: var(--gr);
      width: 200px;
      height: 200px;
      border-radius: 50%;
      position: absolute;
      z-index: -1;
      top: 60%;
      left: 50%;
      transform: translate(28%, -50%);
      
    }

    
  }

  p {
    width: 70%;
    color: aliceblue;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    line-height: 2.5rem;
  }
}

/* mobile */
/* @media (min-width: 320px) {
 
} */

/* landscape mobile */
/* @media (min-width: 568px) {

} */

/* tablet */
@media (min-width: 768px) {
  .about {
    p {
      width: 45%;
    }
  }
}

/* desktop */
/* @media (min-width: 1024px) {
 
} */