@media all and (max-width: 1600px) {
  #home main .tags {
    width: 15vw; }
  #home main #videos {
    padding-right: 15.5vw; }
  #home main #currentShow .showsList ul li {
    font-size: 18px;
    line-height: 23px; }
  #home main #currentShow #episode .videoContent iframe {
    width: 75vw;
    height: calc(75vw * 9 / 16); }
  #home main #currentShow #episode .cartouche {
    width: 75vw; } }

@media all and (max-width: 1400px) {
  #home main .shows {
    font-size: 28px; }
  #home main .tags {
    width: 20vw; }
  #home main #videos {
    padding-right: 20.5vw; }
  #home.screenMode main #currentShow .content .showsList {
    width: calc(100% / 4); }
  #home.screenMode main #currentShow .content #episode {
    width: calc(100% / 4 * 3); }
  #about #descriptionImg {
    max-height: 40vh; } }

@media all and (max-width: 1200px) {
  #home header h1 {
    position: fixed;
    z-index: -1; }
  #home .shows {
    bottom: 14px;
    top: initial;
    left: 0;
    z-index: 99999;
    width: 80vw;
    mix-blend-mode: normal; }
    #home .shows h2 {
      background: #000;
      margin: 0 0 0 15px;
      padding: 0; }
    #home .shows ul {
      display: flex;
      flex-wrap: wrap; }
      #home .shows ul li {
        height: 70px;
        margin: -15px 10px -15px 0; }
  #home main {
    margin-top: 2vw;
    z-index: 1;
    left: 0; }
    #home main .tags {
      width: 25vw; }
    #home main #videos {
      padding: 6vw 25.5vw 0 0; }
  #about #descriptionImg {
    max-height: 40vh; } }

@media all and (max-width: 1000px) {
  #home main {
    margin-top: 3vw; }
    #home main #videos {
      padding-right: 25.5vw; }
      #home main #videos .video {
        width: 50%;
        margin: -3px 0 0 0; }
    #home main .tags {
      width: 25vw; }
    #home main .shows {
      width: 75%; }
  #home.screenMode main #currentShow #close {
    right: 1rem; }
  #home.screenMode main #currentShow .content {
    display: block; }
    #home.screenMode main #currentShow .content .showsList {
      padding-top: 2rem;
      width: 100%; }
    #home.screenMode main #currentShow .content #episode {
      position: relative;
      width: 100%; }
      #home.screenMode main #currentShow .content #episode .videoContent iframe {
        width: 95vw;
        height: calc(95vw * 9 / 16);
        margin-left: 0.5vw; }
      #home.screenMode main #currentShow .content #episode .cartouche {
        width: 95vw;
        margin-left: 0.5vw; }
  #about main #descriptionImg {
    max-width: 100%;
    position: relative;
    margin-top: 0; } }

@media all and (max-width: 800px) {
  #home main #videos {
    padding: 6vw calc(100% / 3) 0 0; }
    #home main #videos .video {
      width: 100%; }
  #home main .tags {
    width: calc(100% / 3); }
  #about #descriptionImg {
    position: relative;
    margin: 10px;
    width: calc(100% - 20px);
    height: auto;
    max-height: initial;
    left: 0; }
  #about main {
    font-size: 1.4rem;
    margin-top: 12vw; }
    #about main #description {
      margin: 0;
      padding: 0 1rem 0 1rem;
      max-width: 100%; }
    #about main #description p {
      transform: skewX(0deg);
      padding-left: 0;
      text-align: left; } }

@media all and (max-width: 550px) {
  body > header,
  body > header h1 {
    width: 100%; }
  body > header h1 {
    padding: 5px; }
  #home .shows {
    width: 100%;
    position: relative;
    top: 0;
    mix-blend-mode: difference; }
    #home .shows h2 {
      margin: 0; }
    #home .shows ul {
      display: block;
      max-height: unset; }
      #home .shows ul li {
        font-size: 12vw;
        height: auto;
        padding: 4vw 2vw 4vw 2vw;
        margin-right: 0; }
  #home main {
    width: 100vw;
    margin-top: 8vw; }
    #home main #videos {
      padding: 0; }
      #home main #videos .video {
        width: 100%; }
        #home main #videos .video:nth-of-type(odd) img {
          transform: skewY(5deg); }
        #home main #videos .video:nth-of-type(even) img {
          transform: skewY(-5deg); }
    #home main .tags {
      display: none; }
    #home main .shows {
      width: 100%;
      margin: 0 0 6vw 0; }
      #home main .shows h2,
      #home main .shows ul {
        padding: 5px; }
  #home.screenMode main #currentShow #close {
    position: fixed;
    bottom: 0;
    background: #000;
    width: 100%;
    padding: 0 1rem 0 0;
    left: 0;
    z-index: 9999999999; }
  #home.screenMode main #currentShow .content .showsList {
    padding-top: 2rem;
    padding-bottom: 8rem;
    width: 100%;
    border-top: solid 1px; }
    #home.screenMode main #currentShow .content .showsList h2 {
      font-size: 3rem;
      transform: scale(0.75); }
    #home.screenMode main #currentShow .content .showsList .episodes {
      margin: 0rem 0 0 0; }
  #home.screenMode main #currentShow .content #episode {
    padding: 0; }
    #home.screenMode main #currentShow .content #episode .videoContent {
      padding: 1.5rem 0.5rem 0.5rem 0.5rem; }
      #home.screenMode main #currentShow .content #episode .videoContent iframe {
        width: 90vw;
        height: calc(90vw * 9 / 16);
        margin-left: 0.5vw; }
    #home.screenMode main #currentShow .content #episode .cartouche {
      border-top: solid 1px;
      padding: 0.5rem;
      width: 100%;
      margin-left: 0.5vw;
      flex-wrap: wrap;
      font-size: 1rem;
      overflow: hidden;
      margin: 1rem 0 0 0; }
      #home.screenMode main #currentShow .content #episode .cartouche .description,
      #home.screenMode main #currentShow .content #episode .cartouche .epTags .epTag {
        border: none; }
      #home.screenMode main #currentShow .content #episode .cartouche * h3 {
        font-size: 1.25rem;
        border: none;
        margin: 0 0 0.5rem 0;
        padding: 0; } }
