body {
  font-family: "Open Sans", sans-serif;
  font-size: 1.1em;
  color: #333;
  background-color: #f1f1f1;
  padding-bottom: 5em;
}

a {
  color: #1396ac;
  text-decoration: underline;
}
a:hover {
  color: #0ea9c3;
}

hr {
  background-color: #333;
}

iframe {
  margin-top: 2em;
  background: transparent;
  margin: 0 auto;
}
iframe #result-box iframe {
  background: transparent;
}
iframe body {
  border: none;
  background: transparent;
}

.container {
  width: 90vw;
}

header {
  margin: 0 auto 1em;
  padding: 1em;
}
header .title:last-of-type {
  margin-bottom: 0;
}
@media (min-width: 768px) {
  header {
    padding: 2em 1em 1em;
  }
}

section,
.section {
  margin: 3em auto 5em;
  padding: 1em;
}
@media (min-width: 768px) {
  section,
  .section {
    padding: 3em;
  }
}
section:first-of-type,
.section:first-of-type {
  margin: 0 auto 1em;
}
section:last-of-type,
.section:last-of-type {
  margin-bottom: 0;
}
section.mobile iframe,
.section.mobile iframe {
  max-width: 360px;
}
section.film,
.section.film {
  background-color: #3d7f7a;
  color: #fff;
}
section.film h2,
section.film a,
.section.film h2,
.section.film a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.film,
  .section.film {
    background-color: transparent;
    background-image: linear-gradient(transparent 20%, #3d7f7a 20%, #3d7f7a 80%, transparent 80%);
  }
}
section.film--alternate,
.section.film--alternate {
  background-color: #444182;
  color: #fff;
}
section.film--alternate h2,
section.film--alternate a,
.section.film--alternate h2,
.section.film--alternate a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.film--alternate,
  .section.film--alternate {
    background-color: transparent;
    background-image: linear-gradient(transparent 20%, #444182 20%, #444182 80%, transparent 80%);
  }
}
section.game,
.section.game {
  background-color: #fe4365;
  color: #000;
}
section.game h2,
section.game a,
.section.game h2,
.section.game a {
  color: #000;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.game,
  .section.game {
    background-color: transparent;
    background-image: linear-gradient(#fe4365 0, #fe4365 0, #fe4365 40%, transparent 40%);
  }
}
section.game iframe,
.section.game iframe {
  max-width: 810px;
}
section.wiki,
.section.wiki {
  background-color: #dcd5ca;
  color: #333;
}
section.wiki h2,
section.wiki a,
.section.wiki h2,
.section.wiki a {
  color: #333;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.wiki,
  .section.wiki {
    background-color: transparent;
    background-image: linear-gradient(transparent 20%, #dcd5ca 20%, #dcd5ca 80%, transparent 80%);
  }
}
section.news,
.section.news {
  background-color: #5d5d5d;
  color: #fff;
}
section.news h2,
section.news a,
.section.news h2,
.section.news a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.news,
  .section.news {
    background-color: transparent;
    background-image: linear-gradient(#5d5d5d 0, #5d5d5d 0, #5d5d5d 40%, transparent 40%);
  }
}
section.dashboard,
.section.dashboard {
  background-color: #017b9d;
  color: #fff;
}
section.dashboard h2,
section.dashboard a,
.section.dashboard h2,
.section.dashboard a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.dashboard,
  .section.dashboard {
    background-color: transparent;
    background-image: linear-gradient(#017b9d 0, #017b9d 0, #017b9d 40%, transparent 40%);
  }
}
section.pokedex,
.section.pokedex {
  background-color: #a13030;
  color: #fff;
}
section.pokedex h2,
section.pokedex a,
.section.pokedex h2,
.section.pokedex a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.pokedex,
  .section.pokedex {
    background-color: transparent;
    background-image: linear-gradient(#a13030 0, #a13030 0, #a13030 40%, transparent 40%);
  }
}
section.circle-rick,
.section.circle-rick {
  background-color: #e4a788;
  color: #fff;
}
section.circle-rick h2,
section.circle-rick a,
.section.circle-rick h2,
.section.circle-rick a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.circle-rick,
  .section.circle-rick {
    background-color: transparent;
    background-image: linear-gradient(#e4a788 0, #e4a788 0, #e4a788 40%, transparent 40%);
  }
}
section.dcMap,
.section.dcMap {
  background-color: #dcd5ca;
  color: #333;
}
section.dcMap h2,
section.dcMap a,
.section.dcMap h2,
.section.dcMap a {
  color: #333;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.dcMap,
  .section.dcMap {
    background-color: transparent;
    background-image: linear-gradient(#dcd5ca 0, #dcd5ca 0, #dcd5ca 40%, transparent 40%);
  }
}
section.editor,
.section.editor {
  background-color: #217dbb;
  color: #fff;
}
section.editor h2,
section.editor a,
.section.editor h2,
.section.editor a {
  color: #fff;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.editor,
  .section.editor {
    background-color: transparent;
    background-image: linear-gradient(#217dbb 0, #217dbb 0, #217dbb 40%, transparent 40%);
  }
}
section.deusex,
.section.deusex {
  background-color: #eca527;
  color: #333;
}
section.deusex h2,
section.deusex a,
.section.deusex h2,
.section.deusex a {
  color: #333;
  font-weight: bold;
}
@media (min-width: 768px) {
  section.deusex,
  .section.deusex {
    background-color: transparent;
    background-image: linear-gradient(#eca527 0, #eca527 0, #eca527 40%, transparent 40%);
  }
}
section p,
.section p {
  margin: 1em 0;
}

.col-pokedex {
  max-width: 960px;
  margin: 0 auto;
}