html {
  font-size: 62.5%; }

body {
  color: #4c4944;
  font-family: Lucida Grande, Lucida Sans Unicode, Lucida Sans, Geneva, Verdana, sans-serif;
  margin: 0; }

header {
  background-color: #ba323c;
  margin: 0;
  padding: 10px; }
  header h1 {
    text-align: center; }
    header h1 a {
      color: white;
      font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
      font-size: 5rem;
      font-weight: bold;
      letter-spacing: 1px;
      text-decoration: none;
      text-shadow: 2px 2px black; }
      @media only screen and (max-width: 768px) {
        header h1 a {
          font-size: 3rem; } }
    header h1 a:hover {
      color: #ecd268;
      text-decoration: underline; }
  header h2 {
    color: #ecd268;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
    font-size: 2rem;
    padding: 0;
    margin: 0;
    text-align: center;
    text-shadow: 2px 2px black; }

section {
  grid-area: section;
  background-color: white; }

aside {
  grid-area: aside;
  background: #ba323c; }

main {
  display: grid;
  grid-template-columns: 75% 25%;
  grid-template-areas: "section aside"; }
  @media only screen and (max-width: 768px) {
    main {
      grid-template-columns: 100%;
      grid-template-areas: "section" "aside"; } }

footer {
  background-color: #ba323c;
  margin: 0;
  padding: 10px; }
  footer h4 {
    padding: 0;
    margin: 0;
    text-align: center; }
    footer h4 a, footer h4 span {
      color: #ba323c;
      font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
      font-size: 1rem;
      font-weight: bold;
      letter-spacing: 1px;
      text-shadow: 0 0 black;
      text-decoration: none; }

h1 {
  margin: 0; }

h2 {
  display: block; }
  @media only screen and (max-width: 768px) {
    h2 {
      display: none; } }

.container {
  font-size: 1.2rem; }

.news-feed h3,
.next-matches h3 {
  margin: 0;
  padding: 0; }

.news-feed ul,
.news-feed li,
.next-matches ul,
.next-matches li {
  list-style-type: none;
  padding: 0;
  margin: 0; }

.news-feed {
  background-color: white;
  margin: 0 auto;
  padding: 10px; }
  .news-feed h3 {
    font-size: 2rem; }
  .news-feed p {
    margin: 0;
    padding: 5px 0; }
  .news-feed li {
    border-bottom: 1px dashed black;
    padding: 10px 0; }
  .news-feed a {
    color: black;
    font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
    font-size: 1.8rem;
    font-weight: bold;
    text-decoration: none; }
  .news-feed a:hover {
    text-decoration: underline; }

.next-matches {
  background-color: white;
  margin: 0 auto;
  padding: 10px;
  max-height: 284px;
  overflow: auto; }
  .next-matches li {
    border-bottom: 1px dotted black;
    padding: 10px 0; }
  .next-matches li:last-child {
    border-bottom: none; }
  .next-matches .match {
    color: black;
    font-size: 1.6rem;
    font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif; }

.gallery {
  background-color: white;
  margin: 0 auto;
  padding: 0;
  max-height: 600px;
  overflow: hidden; }
  .gallery img {
    margin: 0 auto;
    display: block;
    width: 100%;
    height: 100%; }

@media only screen and (max-width: 728px) {
  aside .details {
    display: none; } }

.quick-facts {
  color: black;
  background-color: #ecd268;
  margin: 0;
  padding: 10px; }
  .quick-facts h3 {
    margin: 0;
    padding: 0; }
  .quick-facts dl {
    font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
    margin: 0; }
    .quick-facts dl dt, .quick-facts dl dd {
      font-size: 1.4rem; }
    .quick-facts dl dt {
      margin: 5px 0 0 0;
      font-weight: bold; }
    .quick-facts dl dd {
      margin: 0; }

.standings {
  color: white;
  background-color: #2c4261;
  margin: 0;
  padding: 10px; }
  .standings h3 {
    margin: 0;
    padding: 0; }
  .standings h4 {
    margin: 5px 0;
    padding: 0; }
  .standings table {
    width: 100%; }
    .standings table th, .standings table td {
      text-align: left; }
    .standings table tr.selected {
      font-weight: bold;
      font-style: italic; }

.tns-controls,
.tns-nav,
button[data-action="stop"] {
  display: none; }
