.section-bg {width: 100%; max-width: 100%; margin: 0; padding: 0; border: none;}
.mcontainer {width: 100%; max-width: 1024px; margin: 0 auto; padding: 0 0 2em;}
.row{width: 100%; max-width: 100%; margin: 0; padding: 0 0 1em;}
.row:last-child {padding-bottom: 0;}
.column-1, .column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12 {padding: 0 1em;}

.main {font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 1.25em;}

.main img {max-width: 100%; display: inline-block;}

h1, h2, h3, h4, p, li, em, span, td {margin: 0; padding: 0; line-height: 1.25em;}

.main h1 {font-size: 4em;}
.main h2 {font-size: 3em;}
.main p {font-size: 2em; font-weight: 100;}
.main sup {font-size: 0.5em; line-height: 1em;}

.main p {padding-bottom: 1em;}
.main p:last-child {padding-bottom: 0;}

.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right {text-aligh: right;}

.both {clear: both;}

.green {color: #77b900;}

.uc {text-transform: uppercase;}

.flex-center {display: flex; align-items: center;}

.header-bg  .mcontainer {max-width: 100%;}
.header-bg img {display: block; max-width: 100%; margin-left: auto; margin-right: auto;}

.game-bg .row {background: url('images/game/game_bg.jpg') center no-repeat; background-size: auto 100%; padding: 25% 0 1em;}

.products-bg h3 {margin-bottom: 0.5em;}
.products-bg .learnmore {display: inline-block; padding: 0.5em 1em; color: #ffffff; background-color: #77b900; text-decoration: none; font-weight: 500;}

.footer-bg .column-4 {padding: 0 8em;}
.footer-bg .column-4 img {display: block; margin-left: auto; margin-right: auto;}
.main .terms {font-size: 0.75em; font-weight: 300;}
.footer-banner a {display: inline-block; margin-left: auto; margin-right: auto;}

@media (max-width: 850px)
{
  .main {font-size: 14px;}
  
  .main h1 {font-size: 3em;}
  .main h2 {font-size: 2.5em;}
  .main p {font-size: 1.25em;}
  
  .mcontainer {padding: 0 0 1em;}
  .column-1, .column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12 {padding: 0 0.5em;}
  
  .game-bg .row {padding: 25% 0 0.5em;}
  
  .products-bg .column-3 {width: 50%; float: left;}
  
  .footer-bg .column-4 {padding: 0 6em; width: 33.33333333333333%;}
}

@media (max-width: 767px)
{
  .main h1 {font-size: 2em;}
  .main h2 {font-size: 1.5em;}
  .main p {font-size: 1em;}
  
  .products-bg h3 {font-size: 1em;}
  .products-bg .learnmore {font-size: 1em;}
  
  .footer-bg .column-4 {padding: 0 2em;}
}