.header-logo {
  position: absolute;
  margin-left: 2vw;
  top: 1.5vw;
  z-index: 9999;
}

.header-logo > a > img {
  width: 5.5vw;
  position: fixed;
}

.mobile-workout-img {
  display: none;
}

.video-mobile {
  display: none;
}

@media screen and ( orientation: landscape ) and ( max-width: 812px ) {

  .header-logo {
    width: 100vw;
    margin-left: 0;
    top: 0;
    text-align: center;
    margin-top: 4vh;
  }

  .header-logo > a > img {
    width: 5.5vw;
    position: relative;
  }

  .workout-img {
    display: none;
  }

  .mobile-workout-img {
    display: block;
    width: 100vw;
    margin-left: auto;
    margin-right: auto;
    background-color: #f0f0f0;
    text-align: center;
  }

  .mobile-workout-img > img {
    width: 50%;
    padding-top: 10vw;
  }

  .mobile-workout-img > img:last-child {
    padding-bottom: 10vw;
  }

  .video-mobile {
    display: block;
  }

  .video-desktop {
    display: none;
  }

}

@media screen and (max-width: 479px) {

  .header-logo {
    width: 100vw;
    margin-left: 0;
    top: 0;
    text-align: center;
    margin-top: 5vh;
  }

  .header-logo > a > img {
    width: 15vw;
    left: 50%;
    transform: translate(-50%, 0%);
    position: absolute;
  }

  .margin-container {
    margin-top:10vw;
  }

  .workout-img {
    display: none;
  }

  .mobile-workout-img {
    display: block;
    width: 100vw;
    margin-left: auto;
    margin-right: auto;
    background-color: #f0f0f0;
    text-align: center;
  }

  .mobile-workout-img > img {
    width: 70%;
    padding-top: 10vw;
    padding-bottom: 10vw;
  }

  .video-mobile {
    display: block;
  }

  .video-desktop {
    display: none;
  }

}