/* INDEX.HTML STYLE */

.desktop_nav {
  display: none;
  z-index: 7;
}

.hero_section {
  display: grid;
  grid-template-columns: 1fr;
  z-index: 2;
}

.hero_section img:first-of-type {
  object-fit: cover;
  grid-column: 1/2;
  grid-row: 1/2;
}

.hero_section img:nth-of-type(2) {
  grid-column: 1/2;
  grid-row: 1/2;
  translate: 13% 50%;
  width: 80%;
}

.hero_section div {
  grid-column: 1/2;
  grid-row: 1/2;
  translate: 0 -13.5%;
  pointer-events: none;
}

.hero_flex {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  translate: 0 -100%;
}

/* FOOTER STYLE */

.footer_social_media {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

.footer_flex {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

/* INDEX COUNTDOWN STYLE */

.countdown ul {
  display: flex;
  justify-content: center;
}

/* MOBILE HEADER */

.grid_1_2_1 {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
}

.mobile_flex {
  padding-top: 5px;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  grid-column: 2/3;
}

.mute_button {
  margin-left: auto;
  padding: 5px 10px 5px 0;
}

.burger_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

/* GALLERY STYLE */

.gallery_main {
  video {
    max-width: 100%;
  }

  h2 {
    place-self: center;
    margin-top: 50px;
  }

  body {
    margin: auto;
  }
}

.grid1_1-1-1 .gallery {
  display: grid;
  grid-template-columns: (12, 1fr);
  gap: 15px;
  padding: 20px;
}

.gallery1 {
  grid-column: 1;
  grid-row: 1;
  place-self: center;
}

.gallery2 {
  grid-column: 1;
  grid-row: 2;
  place-self: center;
}

.gallery3 {
  grid-column: 1;
  grid-row: 3;
  place-self: center;
}

.gallery4 {
  grid-column: 1;
  grid-row: 4;
  place-self: center;
}

.gallery5 {
  grid-column: 1;
  grid-row: 5;
  place-self: center;
}

.gallery6 {
  grid-column: 1;
  grid-row: 6;
  place-self: center;
  overflow: hidden;
  display: block;
  object-fit: cover;
  width: 631px;
  height: 535px;
}

.grid2_1-1-1 .gallery {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  padding: 20px;
}

.gallery7 {
  grid-column: 1;
  grid-row: 1;
  place-self: center;
  overflow: hidden;
  display: block;
  object-fit: cover;
  width: 631px;
  height: 535px;
}

.gallery8 {
  grid-column: 1;
  grid-row: 2;
  place-self: center;
}
.gallery9 {
  grid-column: 1;
  grid-row: 3;
  place-self: center;
}
.gallery10 {
  grid-column: 1;
  grid-row: 4;
  place-self: center;
}
.gallery11 {
  grid-column: 1;
  grid-row: 5;
  place-self: center;
}

@media (min-width: 800px) {
  /* GALLERY STYLE */

  .video_gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 20px;
  }

  .gallery_main h1 {
    place-self: center;
    margin-top: 50px;
  }

  .grid1_1-1-1 .gallery {
    display: grid;
    grid-template-columns: (12, 1fr);
    gap: 20px;
    padding: 20px;
  }

  .gallery1 {
    grid-column: 1 / 8;
    grid-row: 1;
    place-self: stretch;
  }

  .gallery2 {
    grid-column: 1 / 8;
    grid-row: 2;
    place-self: stretch;
  }

  .gallery3 {
    grid-column: 8 / 12;
    grid-row: 1 / span 2;
    place-self: stretch;
  }

  .gallery4 {
    grid-column: 1 / 12;
    grid-row: 3;
    place-self: stretch;
  }

  .gallery5 {
    grid-column: 1 / 7;
    grid-row: 4;
    place-self: stretch;
  }

  .gallery6 {
    grid-column: 7 / 12;
    grid-row: 4;
    place-self: stretch;
    overflow: hidden;
    display: block;
    object-fit: cover;
    width: 700px;
    height: 730px;
  }

  .grid2_1-1-1 .gallery {
    display: grid;
    grid-template-columns: (12, 1fr);
    gap: 20px;
    padding: 20px;
  }

  .gallery7 {
    grid-column: 1 / 6;
    grid-row: 1;
    place-self: stretch;
    overflow: hidden;
    display: block;
    object-fit: cover;
    width: 800px;
    height: 600px;
  }

  .gallery8 {
    grid-column: 6 / 12;
    grid-row: 1;
    place-self: stretch;
  }
  .gallery9 {
    grid-column: 1 / 12;
    grid-row: 2;
    place-self: stretch;
  }
  .gallery10 {
    grid-column: 1 / 7;
    grid-row: 3;
    place-self: stretch;
  }
  .gallery11 {
    grid-column: 7 / 12;
    grid-row: 3;
    place-self: stretch;
  }

  /* INDEX STYLE */

  .grid_1-1 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 20px;
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
  }

  .index_nextshow_buttons {
    display: flex;
    flex-direction: row;
    max-width: 750px;
    margin-right: auto;
    margin-left: auto;
  }

  .grid_2-1-2 {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
  }

  .grid_2-1-2 div {
    grid-column: span 2;
  }

  .grid_2-1-2 img:last-of-type {
    grid-column: 1/2;
    grid-row: 2/3;
  }

  .desktop_nav {
    display: block;
  }

  .desktop_nav ul {
    display: grid;
    grid-template-columns: 2fr 2fr 2fr 2fr 2fr 3fr 1fr;
    max-width: 1440px;
    margin-right: auto;
    margin-left: auto;
  }
  .header_social_media ul {
    display: flex;
    flex-direction: row;
  }

  .mute_button {
    padding-top: 25px;
  }
}

@media (min-width: 1200px) {
  /* INDEX.HTML STYLE */

  .hero_section {
    margin-top: 7px;
  }

  /* Desktop Header */
}