#opening > img {
  position: relative;
  margin: 0.5vw;
  transform-origin: top;
  width: auto;
  height: 40vh;
  max-width: 90vw;
  object-fit: contain;
}

#opening > img:not(:first-child) {
  @media screen and (max-width: 1166px) {
    display: none;
  }
}

#compText {
  @media screen and (max-width: 960px) {
    text-align: center;
  }
}

.competitionsContainer {
  display: flex;
  justify-content: start;

  @media screen and (max-width: 960px) {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}

.competitions {
  display: flex;
  flex-direction: column;

  @media screen and (max-width: 960px) {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}

.competitions > :first-child {
  margin: 3vh 0 0 0;
}

.competition {
  display: flex;
  align-items: center;
  flex-direction: row;
  margin: 0.3vw;

  @media screen and (max-width: 960px) {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}

.competition img {
  width: 12rem;
  height: 12rem;
  object-fit: contain;

  @media screen and (max-width: 960px) {
    height: 30vh;
    width: auto;
    max-width: 70vw;
  }

  @media screen and (max-width: 760px) {
    height: auto;
    width: 50vw;
    max-height: 30vh;
  }
}

.competition p {
  font-size: 2rem;
  margin: 0 1vw;

  @media screen and (max-width: 760px) {
    font-size: 1.5rem;
    text-align: center;
  }
}

#xd {
  display: flex;

  align-items: center;

  justify-content: end;

  @media screen and (max-width: 960px) {
    /* Align img center */
    margin-top: 20vh;
    justify-content: center;
  }
}

#xd img {
  scale: 1;
  height: 20vh;
  width: auto;
}

#xd img:first-child {
  height: 12vh;
  margin: 1vh 1vw;

  translate: 0 25px;
}
