body {
  background-color: #7d84ff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#7d84ff), color-stop(#9095f9), color-stop(#a3a6f8), color-stop(#9095f9), to(#7d84ff));
  background-image: linear-gradient(#7d84ff, #9095f9, #a3a6f8, #9095f9, #7d84ff);
  margin-top: 6.5%;
  font-family: -apple-system, BlinkMacSystemFont, "charter_bold", "Segoe UI", "Comic Sans MS";
  line-height: 1.6;
  font-size: 90%;
  margin-left: 0;
  padding: 18vh 1rem;
  text-align: center; }

h1 {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Comic Sans MS";
  text-decoration: underline; }

.game_container {
  background-color: #7da8ff;
  -webkit-box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  border: 5px solid #000070;
  margin: auto;
  margin-top: 20px;
  width: 30%;
  border-radius: 12px 12px 12px 12px;
  font-size: 130%; }

img {
  max-width: 100%;
  height: auto; }

.game_container img {
  margin: 5px 0px 0px 0px;
  border: 4px solid black;
  border-radius: 12px 12px 12px 12px; }

a:link {
  color: white; }

a:visited {
  color: white; }

/* 600px, 601px, 768px, 992px */
@media (max-width: 600px) {
  .game_container {
    width: 90%;
    font-size: 110%;
    margin-top: 20px; }
  .image {
    width: 70%; } }

@media (max-width: 601px) {
  .game_container {
    width: 90%;
    font-size: 110%;
    margin-top: 20px; }
  .image {
    width: 70%; } }

@media (max-width: 768px) {
  .game_container {
    width: 90%;
    font-size: 110%;
    margin-top: 20px; }
  .image {
    width: 70%; } }

@media (max-width: 992px) {
  .game_container {
    width: 90%;
    font-size: 110%;
    margin-top: 20px; }
  .image {
    width: 70%; } }