.show-page,
.broadcast-page {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 5px;
}

/* Primary / Head */

.broadcast-page-header,
.show-page-header {
  margin: 24px 5px 0 5px;
}

.broadcast-page-backbutton,
.show-page-backbutton {
  display: inline-block;
  height: 15px;
  padding: 4px 0 4px 16px;
  background: no-repeat url('/static/images/arrow_large_left.png');
  background-size: 8px 15px;
  background-position-y: 7px;
  background-position-x: left;
  margin: 0 2em 1em 0;
}

.show-page-head,
.show-page-row,
.broadcast-page-head,
.broadcast-page-row {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.show-page-head-right,
.broadcast-page-head-right {
  width: calc(100% * 2 / 3 - 5px); /* magically works */
  margin-bottom: 15px;
}
.show-page-head__has-left .show-page-head-right,
.broadcast-page-head__has-left .broadcast-page-head-right,
.show-page__primary,
.broadcast-page__primary {
  width: calc((100% / 3 * 2) - 10px); /* Two thirds */
  padding-left: 20px;
}
.show-page-head-left,
.broadcast-page-head-left {
  width: calc((100% / 3) - 10px); /* One third */
  margin-bottom: 15px;
}
.show-page__secondary,
.broadcast-page__secondary {
  width: calc((100% / 3) - 10px); /* One third */
}
.show-image,
.broadcast-image {
  width: 100%;
  height: auto;
  display: block;
}

/* Lower part */

.show-infos,
.broadcast-infos {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.show-infos__show-comments,
.show-infos__show-playlist,
.broadcast-infos__show-list,
.broadcast-infos__show-description {
  width: calc(50% - 10px);
}

/* MQs */

@media (max-width: 960px) {
  .show-page__primary,
  .broadcast-page__primary {
    padding-left: 10px;
  }
  .show-page__primary,
  .show-page__secondary,
  .broadcast-page__primary,
  .broadcast-page__secondary {
    width: calc(50% - 5px);
  }
  .show-page-head-left,
  .broadcast-page-head-left {
    width: calc(50% - 5px);
  }
  .show-page-head-right,
  .broadcast-page-head-right {
    width: 100%;
  }
  .show-page-head__has-left .show-page-head-right,
  .broadcast-page-head__has-left .broadcast-page-head-right {
    width: calc(50% - 5px);
    padding-left: 10px;
  }
  .show-infos,
  .broadcast-infos {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .show-infos__show-playlist,
  .show-infos__show-comments,
  .broadcast-infos__show-list,
  .broadcast-infos__show-description {
    width: 100%;
  }
  .show-infos__show-playlist,
  .broadcast-infos__show-list {
    height: auto;
    order: 1;
  }
}

@media (max-width: 567px) {
  .show-page-head,
  .show-page-row,
  .broadcast-page-head,
  .broadcast-page-row {
    display: block;
  }
  .show-page__primary,
  .broadcast-page__primary {
    padding-left: 0;
  }
  .show-page__primary,
  .show-page__secondary,
  .broadcast-page__primary,
  .broadcast-page__secondary {
    width: 100%;
  }
  .show-page__secondary,
  .broadcast-page__secondary {
    order: 1;
    margin-top: 0px;
  }
  .show-page-head-left,
  .show-page-head-right,
  .show-page-head__has-left .show-page-head-right,
  .broadcast-page-head-left,
  .broadcast-page-head-right,
  .broadcast-page-head__has-left .broadcast-page-head-right {
    padding-left: 0;
    width: 100%;
  }
  .show-infos__show-list .broadcast-show-list,
  .broadcast-infos__show-list .broadcast-show-list {
    height: 196px;
  }
}
