@import 'forms.css';
@import 'play.css';
@import 'play-splash.css';
/* BASE TEXT STYLES */
body {
  font: 400 16px/1.6 "Poppins", "Helvetica", "Arial", sans-serif;
  color: #190B28;
  background-color: #f6f7f9;
}
body a {
  text-decoration: none;
  color: #067BC2;
}
body a:hover{
  text-decoration: underline;
}

body h1 {
  font-size: 2.2em;
}
body h2 {
  font-size: 1.5em;
  font-weight: 600;
  margin-bottom: 15px;
}
body h3 {
  font-size: 1.2em;
  font-weight: 600;
}
body p {
  margin: 10px 0;
}
body em {
  font-style: italic;
}
body strong {
  font-weight: 600;
}
body ul {
  margin-bottom: 20px;
}
body ul li {
  list-style: disc inside none;
}
body ul li li {
  padding-left: 15px;
}
body hr {
  border: none;
  border-bottom: 1px solid #2FA9F2;
  padding-top: 50px;
  margin-bottom: 50px;
}
body blockquote {
  font-size: 1.2em;
  opacity: 0.6;
  margin: 20px;
  font-style: italic;
}
body img{
  max-width: 100%;
}
body input {
  display: block;
  margin-bottom: 10px;
}
body input[type=checkbox] {
  display: inline;
}

header {
  background-color: #067BC2;
  padding: 10px;
  margin-bottom: 50px;
}
header .container .right {
  text-align: right;
  display: inline-block;
  float: right;
}
header .container .left {
  display: inline-block;
  float: left;
}


header a {
  color: white;
  margin: 20px;
}

footer {
  font-size: 70%;
  opacity: 0.7;
  border-top: 1px solid #2FA9F2;
  padding-top: 10px;
  margin-top: 10px;
}

/* CONTAINER */
.container {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}

.container-grid {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  column-gap: 20px;
  row-gap: 20px;
  overflow: visible;
}

.container-grid h1 {
  grid-column: 1/-1;
}
.container-grid .card {
  display: block;
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  background-color: white;
  box-shadow: 0px 5px 10px #ccc;
}
.container-grid .card:hover {
  box-shadow: 0px 2px 5px #aaa;
  transition: 0.25s ease-in;
}

.container-grid .play-cover {
  grid-column: span 2;
  background-color: #64B6AC;
  overflow: hidden;
  box-shadow: 0px 5px 10px #ccc;
  display: grid;
  grid-template-rows: [cover-image] 2fr [cover-link] 1fr;
  border-radius: 10px;
}
.container-grid .play-cover:hover {
  box-shadow: 0px 2px 5px #aaa;
  transition: 0.25s ease-in;
}
.container-grid .play-cover img {
  object-fit: contain;
  grid-column: cover-image;
}
.container-grid .play-cover a {
  background-color: #64B6AC;
  grid-column: cover-link;
  font-size: 24px;
  text-align: center;
  color: white;
  align-self: center;
  box-shadow: none;
}
.container-grid .play-cover a:hover {
  transition: 0.25s ease-in;
  box-shadow: none;
  text-decoration: underline;
}

/*# sourceMappingURL=play-cover.css.map */


/*# sourceMappingURL=style.css.map */