styles.css

.background{
    z-index: 2;
    background: radial-gradient(ellipse at center, rgb(46, 46, 46) 0%, rgb(59, 59, 59) 100%);
}

.App-header {
    overflow: hidden;
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: calc(10px + 2vmin);
    color: white;
    z-index: 0;
  }

  .App-header:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border: 1px solid black;
    background: radial-gradient(ellipse at center, rgb(86, 75, 121) 0%, #3E3658 100%);
    transform-origin: 0 100%;
    transform: rotate(-4deg) scale(1.2,1.2);
    z-index: -1;
  }

  .logo{
    width: 100%;
    height: auto;
    max-width: 200px;
    max-height: 200px;
    border: rgb(57, 49, 82) 1px solid;
    animation: shadow-drop-2-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  }

  .subheading{
    color: white;
    text-align: center;
    width: 100%;
    margin-bottom: 2rem;
    margin-top: 2rem;
    font-weight: 600;
  }

  .landing-title{
      font-weight: 700;
      font-size: 2.5rem;
  }

  .avatar{
      max-width: 15rem;
      max-height: 15rem;
      width: auto;
      height: auto;
      margin: auto;
  }

  .about-description{
    color: white;
    text-align: center;
  }

  @-webkit-keyframes shadow-drop-2-center {
    0% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
    100% {
      -webkit-transform: translateZ(50px);
              transform: translateZ(50px);
      box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
    }
  }