.background-size {
  height: 375px;
  width: 350px;
  background-size: cover;
}

.cover-game {
  height: 200px;
  width: 175px;
  border: black solid 0.5rem;
}

.video-img {
  height: 10rem;
  width: 9.75rem;
  object-fit: fill;
}

.font-small {
  font-size: 1rem;
}

.modal-window {
  background-color: white;
  border-radius: 4px;
  height: 200px;
  width: 350px;
}

.error-modal {
  background-color: #04252e;
  height: 200px;
  width: 350px;
  border: solid black 0.5rem;
  border-radius: 0.2rem;
}

@media screen and (min-width: 400px) {
  .background-size {
    height: 375px;
    width: auto;
  }

  .cover-game {
    height: auto;
    width: auto;
  }

  .font-small {
    font-size: 1.25rem;
  }
}

@media screen and (min-width: 766px) {
  .modal-window {
    background-color: white;
    border-radius: 4px;
    height: 300px;
    width: 500px;
  }

  .error-modal {
    background-color: #04252e;
    border-radius: 4px;
    height: 200px;
    width: 500px;
  }
}

@media screen and (min-width: 992px) {
  .video-img {
    height: 10rem;
    width: 12.5rem;
  }

  .modal-window {
    background-color: white;
    border-radius: 4px;
    height: 500px;
    width: 800px;
  }
}

@media screen and (min-width: 1200px) {
  .modal-window {
    background-color: white;
    border-radius: 4px;
    height: 500px;
    width: 1000px;
  }
}