text: .wheel {
    position: absolute;
    width: 500px;
    height: 500px;
    border: 2px solid black;
    border-radius: 50%;
    margin-left: 50px;
    
  }
  
  .line {
    position: absolute;
    width: 50%;
    height: 2px;
    left: 50%;
    top: 50%;
    background-color: black;
    transform-origin: 0% 0%;
  }
  
  .line:nth-of-type(2) {
    transform: rotate(60deg);
  }
  .line:nth-of-type(3) {
    transform: rotate(120deg);
  }
  .line:nth-of-type(4) {
    transform: rotate(180deg);
  }
  .line:nth-of-type(5) {
    transform: rotate(240deg);
  }
  .line:nth-of-type(6) {
    transform: rotate(300deg);
  }
  
  .cabin {
    position: absolute;
    width: 80px;
    height: 100px;
    border: 2px solid;
    background-color: red;
    transform-origin: 50% 0%;
  
  }
  
  .cabin:nth-of-type(1) {
    right: -8.5%;
    top: 50%;
  }
  .cabin:nth-of-type(2) {
    right: 17%;
    top: 93.5%;
  }
  .cabin:nth-of-type(3) {
    right: 67%;
    top: 93.5%;
  }
  .cabin:nth-of-type(4) {
    left: -8.5%;
    top: 50%;
  }
  .cabin:nth-of-type(5) {
    left: 17%;
    top: 7%;
  }
  .cabin:nth-of-type(6) {
    right: 17%;
    top: 7%;
  }
  
  /* Now create another section inside the `keyframes` rule to specify the condition of the element at "100%". Inside `100%`, set the rotation transformation to "360deg". The "wheel" animation will now rotate an element from 0 degrees to 360 degrees.
   */
  @keyframes wheel {
    0% {
      transform: rotate(0deg);
    }
  
  }
  