/* Import Duplicate Styles */
@import "../styles/globals.css";
@import "../styles/loading.css";
@import "../styles/social-icons.css";
@import "../styles/go-back.css";

/* About Page Styling */
body
{
  background:
    url("../graphics/background.png") no-repeat fixed center / contain;
  background-color: var(--regular-brown-color);
}

article
{
  font: 17px "Open Sans", sans-serif;
  align-content: center;
  display: grid;
  justify-items: center;
  height: 100%;
}

article h3
{
  text-align: justify;
  width: 840px; max-width: 60vw;
  line-height: 1.5;
}

#logo
{
  width: 800px; max-width: 60vw;
  margin-bottom: 35px;
}


/* Unplayable screen */
@media(max-width: 749px), (max-height: 549px)
{
  body { background-image: none; }
}

@media(max-width: 549px), (max-height: 519px)
{
  body { align-content: start; }
  article { align-content: start; }
  #logo { margin-top: 108px; }

  article h3
  { padding-bottom: 40px; max-width: 75vw; }
}