.omg-img-container {
  background-color: black;
  position: relative;
  top: 0px;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  display: flex;
  justify-content: center;
  width: 100%;
}

.omg-img {
  object-fit: cover;
  height: 100%;
  width: 100%;
  max-width: 60rem;
}

.omg1-subheader-content {
  position: relative;
  display: flex;
  min-height: 100vh;
  width: 100%;
  justify-content: center;
}

.subheader-inner {
  margin-left: 1rem;
  margin-right: 1rem;
  width: 100%;
}

.selected-button {
  width: 8rem /* 128px */;
  border-radius: 0.375rem /* 6px */;
  border-width: 1px;
  border-color: rgb(156 163 175);
  background-color: #eb6735;
  padding-top: 0.5rem /* 8px */;
  padding-bottom: 0.5rem;
  color: rgb(255 255 255);
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  font-size: 0.875rem;
}

.nonselected-button {
  width: 8rem /* 128px */;
  border-radius: 0.375rem /* 6px */;
  border-width: 1px;
  border-color: rgb(156 163 175);
  padding-top: 0.5rem /* 8px */;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
}

.nonselected-button:hover {
  background-color: #d7d7d7;
}
#button-grid-container {
  margin-top: 1.5rem;
  display: flex;
  width: 100%;
  justify-content: center;
  column-gap: 0.75rem /* 12px */;
}

.omg-logo {
  margin-top: 2.5rem /* 40px */;
  margin-bottom: 2.5rem /* 40px */;
  display: flex;
  width: 100%;
  justify-content: center;
}

.technical-info-container {
  border-radius: 0.5rem;
  border: 1px solid rgb(209 213 219);
  background-color: rgb(243 244 246);
  padding: 2rem;
}

.technical-info-h2 {
  font-weight: 500;
  font-size: 0.875rem;
  text-align: center;
  margin-bottom: 1.5rem;
}

.technical-info-container-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

.technical-info-list {
  display: flex;
  font-weight: 500;
  list-style-type: disc;
  flex-direction: column;
  row-gap: 0.5rem /* 8px */;
  font-size: 0.75rem /* 12px */;
  line-height: 1rem;
}

.computer-stats {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem /* 8px */;
}

.computer-stats p {
  font-size: 0.75rem /* 12px */;
  line-height: 1rem;
  font-style: italic;
}

.tech-info-image-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  place-items: center;
  gap: 1.5rem;
  margin-top: 2.5rem /* 40px */;
}

.state-of-the-art-omg {
  margin-top: 2.5rem /* 40px */;
  margin-bottom: 2.5rem /* 40px */;
  text-align: center;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.25rem /* 20px */;
}

.state-of-the-art-omg-copy {
  text-align: left;
  font-size: 0.875rem;
  line-height: 1.75rem;
  font-weight: 400;
}

.cea-state-of-the-art-copy {
  text-align: left;
  font-size: 0.875rem;
  line-height: 1.75rem;
  font-weight: 400;
  margin-top: 1rem;
  /* margin-left: 1rem; */
}

#omg-1-construction {
  margin-top: 2rem;
  margin-bottom: 2rem;
  display: grid;
  width: 100%;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  place-items: center;
  row-gap: 1rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

#omg-1-construction img {
  max-width: 20rem /* 320px */;
  object-fit: scale-down;
}

#omg1-image1-wrapper {
  margin-bottom: 2rem;
  margin-top: 3.5rem /* 56px */;
  display: flex;
  /* width: 100%; */
  flex-direction: column;
  align-items: center;
  /* border: 1px solid tomato; */
}

/* #omg1-image1-wrapper img {
  max-width: 24rem;
} */

/* video */

#omg1-video-wrapper {
  /* border: 1px solid dodgerblue; */
}

#omg1-video-wrapper iframe {
  border: 1px solid green;
}

#video-description-omg1 {
  text-align: center;
  font-size: 0.75rem;
  font-weight: 500;
  margin-bottom: 2rem;
  margin-top: 0.5rem;
}

#omg1-image1-wrapper p {
  font-weight: 500;
  margin-top: 0.75rem /* 12px */;
  font-size: 0.75rem /* 12px */;
  line-height: 1rem;
}

.description-header-h1 {
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 500;
  margin-bottom: 3.5rem;
  width: 100%;
}

.omg1-iframe-styling {
  padding: 56.25% 0 0 0;
  position: relative;
  /* border: 1px solid blue; */
  margin-top: 2rem;
}

.contest-link {
  font-weight: 500;
}

.contest-link:hover {
  text-decoration: underline;
}

.artist-description-contest {
  display: flex;
  flex-direction: column;
  font-weight: 500;
  margin-top: 1rem;
  margin-bottom: 1rem;
  /* border: 1px solid tomato; */
  align-items: center;
}

.artist-description-contest h2 {
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
}

.artist-description-contest p {
  /* border: 1px solid dodgerblue; */
  font-size: 0.875rem;
  font-style: italic;
  text-align: center;
  font-size: 0.75rem;
}

.artist-sound-demos-contest {
  /* border: 1px solid tomato; */
  place-items: start;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  row-gap: 1rem;
  font-size: 0.875rem; /* 12px */
  margin-top: 2rem;
  gap: 1rem;
}

.artist-sound-demos-contest div {
  /* border: 1px solid dodgerblue; */
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0.5rem;
  white-space: nowrap;
}

.play-icon-flex-container {
  display: flex;
  align-items: center;
}

.play-icon-flex-container:hover {
  cursor: pointer;
}
.play-icon-flex-container p:hover {
  text-decoration: underline;
}

.play-icon-flex-container i {
  margin-left: 0.5rem;
}

.artist-info {
  /* border: 1px solid tomato; */
  display: flex;
  flex-direction: column;
}

.cea-blue-header-text {
  font-weight: 500;
  color: #4075bf;
  margin-top: 1rem;
  font-size: 1.125rem;
  text-align: left;
}

.cea-wrapper {
  /* border: 1px solid dodgerblue; */
  display: flex;
  flex-direction: row;
  column-gap: 1rem;
  justify-content: start;
  align-items: center;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  /* margin-left: 1rem; */
}

.cea-location {
  text-align: left;
  font-weight: 500;
  font-size: 0.75rem;
  font-style: italic;
}

.cea-description {
  font-weight: 500;
  font-size: 0.875rem;
}

.cea-text-wrapper {
  margin-left: 0.7rem;
}

.contest-blue-header-text {
  font-weight: 500;
  color: #4075bf;
  margin-top: 1rem;
  font-size: 1.125rem;
  text-align: center;
}

.artist-description-wrapper {
  margin-left: 0rem;
  margin-right: 0rem;
}

.artist-info-image-wrapper {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
}

.artist-info-image-wrapper img {
  border: 1px solid gray;
}

.contest-instrument-link {
  font-size: 0.875rem;
}

.contest-instrument-link:hover {
  text-decoration: underline;
}

.cea-horizontal-rule-container {
  margin-top: 1rem;
  margin-bottom: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.cea-horizontal-rule-container hr {
  --tw-border-opacity: 1;
  border-color: rgb(201, 203, 208);
  width: 100%;
}

.reveal-text-cea {
  display: none;
}

.reveal-text-cea p {
  font-style: italic;
  font-size: 0.75rem;
  margin-left: 3rem;
  margin-right: 3rem;
}

@media (min-width: 520px) {
  .tech-info-image-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .subheader-inner {
    max-width: 67rem /* 1072px */;
  }
  .technical-info-container-inner {
    flex-direction: row;
  }
  .tech-info-image-grid {
    margin-left: 4rem /* 64px */;
    margin-top: 0px;
  }
  #omg-1-construction {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #omg1-image1-wrapper img {
    max-width: 33rem;
  }
  #omg1-video-wrapper {
    height: 16rem /* 256px */;
  }
  #image-video-flex {
    flex-direction: row;
  }
  .omg1-iframe-styling {
    padding: 46.25% 0 0 0;
    margin-top: 3rem;
  }
  #video-description-omg1 {
    margin-bottom: 3rem;
  }
  .artist-sound-demos-contest {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .artist-info {
    flex-direction: row;
  }
  .contest-blue-header-text {
    text-align: left;
  }
  .artist-description-contest {
    align-items: start;
  }

  .artist-description-contest h2 {
    text-align: left;
  }

  .artist-description-contest p {
    text-align: left;
  }
  .artist-description-wrapper {
    margin-left: 2rem;
    margin-right: 2rem;
  }
  .artist-info-image-wrapper {
    display: flex;
    width: 100%;
    align-items: start;
    justify-content: center;
    margin-top: 2rem;
  }
  .cea-wrapper {
    justify-content: start;
  }
}

@media (min-width: 940px) {
  #omg-1-construction {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  #omg-1-construction img {
    max-width: 14rem /* 208px */;
  }
  .artist-sound-demos-contest {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
