#experience {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 50px 5vw;
  gap: 40px;

  h1 {
    font-size: 60px;
  }

  main {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    > div{
        width: 23%;
    }
}

  .left{
      display: flex;
    flex-direction: column;
    gap: 80px;
}
  .right{
      display: flex;
      flex-direction: column;
      gap: 50px;
      width: 33%;
  }

  .mid {
    display: flex;
    flex-direction: column;
    align-items: center;

    .element-1 {
      height: 30px;
      width: 30px;
      border-radius: 20px;
      background-color: #f7a901;
      position: relative;
      box-shadow: 0px 0px 0px 10px #f7a90154;
    }

    .element-2 {
      height: 120px;
      border-left: 5px dashed #f7a90154;
    }
    .element-3 {
      height: 30px;
      width: 30px;
      border-radius: 20px;
      background-color: #a9a9a9;
      position: relative;
      box-shadow: 0px 0px 0px 10px #a9a9a954;
    }

    .element-4 {
      height: 120px;
      border-left: 5px dashed #f7a90154;
    }
    .element-5 {
      height: 30px;
      width: 30px;
      border-radius: 20px;
      background-color: #f7a901;
      position: relative;
      box-shadow: 0px 0px 0px 10px #f7a90154;
    }
  }
}