/*
*	These are not in the media query area b/c they're also used in the appearance panel
*	They are safe b/c they select elements that only exist in a responsive view, anyway
*/
#responsiveHeader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 60px;
  overflow: visible;
  z-index: 998;
  text-align: left;
  display: none;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.25); }

#responsiveMenuLogo {
  display: inline-block;
  margin: 5px 0 0 9px; }

#responsiveMenuLogo img {
  max-height: 50px; }

#responsiveMenuLogo h1 {
  color: #eee;
  margin-top: 12px;
  padding-right: 80px; }

#responsiveMenuButton, #responsiveLoginButton {
  display: block;
  position: absolute;
  top: 18px;
  height: 24px;
  width: 27px;
  text-decoration: none; }

#responsiveMenuButton {
  right: 18px;
  background: transparent url(../graphics/icon-nav-open.png) no-repeat top left; }

#responsiveLoginButton {
  right: 65px;
  background: transparent url(../graphics/icon-nav-log-in.png) no-repeat top left; }

#responsiveLoginButton.loggedIn {
  background-image: url(../graphics/icon-nav-player-page.png); }

#responsiveMenuButton.active, #responsiveLoginButton.active {
  background-image: url(../graphics/icon-nav-close.png); }

#responsiveHeader .leagueInfoLink span {
  padding-right: 0.5rem; }

#responsiveHeader .topLevelLink {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.15); }

@media only screen and (max-width: 850px) {
  #responsiveHeader {
    display: block; }

  body {
    padding-top: 60px;
    /*	should match height of #responsiveHeader */ }

  body.withSportMenu {
    padding-top: 97px;
    /*	should match height of #responsiveHeader + the sport menu */ }

  #responsiveMenu, #responsivePlayerMenu {
    z-index: 999;
    max-height: 87vh;
    overflow-y: scroll;
    overflow-x: hidden; }

  #responsiveSportMenu {
    z-index: 998;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.25); }

  #responsiveMenu, #responsivePlayerMenu, #responsiveSportMenu {
    position: absolute;
    top: 60px;
    /*	should match height of #responsiveHeader */
    left: 0;
    width: 100%;
    color: #eee; }

  .responsiveMenuToggle {
    background: transparent url(../graphics/icon-arrow-click-to-open.png) no-repeat 92% 50%; }

  .responsiveMenuToggle.active {
    background-image: url(../graphics/icon-arrow-click-to-close.png); }

  .responsiveMenuToggle, #responsiveSportMenu li,
  #responsiveMenu li, #responsivePlayerMenu li {
    border-top: 1px solid rgba(255, 255, 255, 0.5); }

  #responsiveMenu a, #responsivePlayerMenu a, #responsiveSportMenu a {
    display: block;
    padding: 0.4rem 1rem;
    font-size: 1.2em;
    line-height: 1.8;
    color: #eee;
    text-transform: uppercase;
    font-weight: 600;
    text-decoration: none; }

  #responsiveMenu ul, #responsiveSportMenu ul {
    background: #ddd; }

  #responsiveMenu ul a, #responsiveSportMenu ul a {
    color: #555; }

  body.nonResponsive {
    padding-top: 0;
    width: 930px;
    background: #fff; }
    body.nonResponsive #responsiveHeader {
      display: none; }
    body.nonResponsive #pageContainer {
      width: 100%; }
    body.nonResponsive #backToPlayerPage {
      display: block;
      position: relative;
      top: auto;
      right: auto;
      margin: 8px; }
    body.nonResponsive #fancybox-overlay {
      width: 930px; }
    body.nonResponsive #fancybox-outer, body.nonResponsive #fancybox-content {
      width: 930px !important; } }
p, #banner h1, #highlights li h2, #theFamily h2, #features h2, #whoIsItFor h2, #homeQuoteForm h2, #features > ul > li h3, #newFooter h3 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  padding-bottom: 0.2em; }

.cta {
  background: #f2f2f2;
  display: inline-block;
  padding: 01em 2.4em;
  margin: 2em 0em;
  color: #577d92 !important;
  border-radius: 1.7em;
  font-size: 1rem; }
  .cta:hover {
    background: #fff;
    color: #d86b3b; }

#userMessageOuter {
  background: #f2f2f2; }
  #userMessageOuter #userMessage div {
    margin: 0;
    border: 0;
    width: auto;
    padding: 1.4em 0; }
  #userMessageOuter #userMessage.message div {
    color: #dc7b50;
    background: #f6dbd0; }

#banner {
  padding-bottom: 1rem;
  background-image: url(../../graphics/promo/background-banner3.png);
  background-size: 100% auto;
  background-position: center 0;
  background-repeat: no-repeat;
  background-size: cover; }
  #banner ul {
    padding-top: 1em; }
  #banner .home {
    pointer-events: none; }
  #banner .links li {
    display: inline-block;
    padding: 1em; }
    #banner .links li a {
      color: #fff;
      letter-spacing: 1px;
      padding: 0.5em 1em;
      text-transform: uppercase;
      font-size: 12px; }
      #banner .links li a img {
        vertical-align: middle;
        height: 5em;
        margin: 0 3em; }
    #banner .links li a:hover {
      border-bottom: 4px solid #fff;
      text-decoration: none; }
  #banner h1 {
    color: #fff;
    padding-top: 2.8em;
    margin-top: 0;
    font-size: 3.3em;
    padding-bottom: 0; }
    #banner h1 em {
      text-decoration: underline;
      font-style: normal; }
  #banner .tagline {
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 1em;
    font-size: 1.3em;
    letter-spacing: .02em; }

#highlights {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background: #f2f2f2; }
  #highlights li {
    float: left;
    width: 28%;
    margin-right: 8%;
    text-align: center; }
    #highlights li h2 {
      color: #dc7b50;
      font-size: 1.6em;
      padding: 1em 0; }
    #highlights li:last-child {
      margin-right: 0; }
    #highlights li img {
      max-width: 90%; }
    #highlights li p {
      font-size: 0.9em; }

#whoIsItFor {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background-image: url(../../graphics/promo/background-geometric-blue.png);
  background-size: 100% auto;
  background-position: center 0;
  background-repeat: no-repeat;
  background-color: #4b768f;
  overflow: hidden; }
  #whoIsItFor .pageWidth {
    position: relative; }
  #whoIsItFor h2 {
    color: #fff;
    padding: 1em 0em; }
  #whoIsItFor p {
    color: rgba(255, 255, 255, 0.8); }
  #whoIsItFor ul {
    margin-bottom: 1em;
    padding-left: 30px; }
  #whoIsItFor li {
    list-style: disc;
    color: #fff;
    font-weight: 500; }
  #whoIsItFor .text {
    width: 500px; }
  #whoIsItFor .image {
    position: absolute;
    left: 600px;
    top: 20px; }

#theFamily {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background: #f2f2f2; }
  #theFamily h2 {
    color: #dc7b50;
    margin-bottom: 1rem; }
  #theFamily .divider {
    text-align: center;
    border-bottom: 1px solid #ddd;
    height: 11px; }
    #theFamily .divider span {
      background: #f2f2f2;
      padding: 0 2rem; }
  #theFamily li {
    display: inline-block;
    margin: 2rem 1.5rem 1rem 1.5rem; }
    #theFamily li img {
      max-height: 50px;
      max-width: 160px; }
  #theFamily .experience {
    color: #777;
    font-size: 0.9em; }

#features {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background-image: url(../../graphics/promo/background-geometric-black.png);
  background-size: 100% auto;
  background-position: center 0;
  background-repeat: no-repeat;
  background-color: #060606;
  padding-bottom: 3px; }
  #features h2 {
    color: #fff;
    margin: 2rem 0;
    font-size: 2.2em; }
  #features > ul > li {
    float: left;
    background: #f2f2f2;
    border-radius: 6px;
    width: 31%;
    margin-right: 3%;
    min-height: 500px; }
    #features > ul > li:last-child {
      margin-right: 0; }
    #features > ul > li .image {
      border-top-left-radius: 6px;
      border-top-right-radius: 6px;
      border-bottom: 1px solid #ccc;
      margin-bottom: 1rem;
      padding-top: 0.7rem;
      background: #fff;
      height: 180px;
      overflow: hidden;
      text-align: center; }
      #features > ul > li .image img {
        max-width: 85%; }
    #features > ul > li h3 {
      margin-left: 1rem;
      color: #6893AB; }
    #features > ul > li ul {
      margin: 0 1rem;
      padding-bottom: 1.5rem; }
      #features > ul > li ul li {
        font-size: 0.9em; }
  #features .cta {
    margin-top: 3.5rem; }

#homeQuoteForm {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background-image: url(../../graphics/promo/background-photo-orange.png);
  background-size: 100% auto;
  background-position: center 0;
  background-repeat: no-repeat;
  background-color: #d88156; }
  #homeQuoteForm h2 {
    padding: 1em 0;
    color: #fff; }
  #homeQuoteForm p {
    color: rgba(255, 255, 255, 0.8); }
  #homeQuoteForm label {
    color: #fff; }
  #homeQuoteForm div.text {
    float: left;
    width: 45%;
    margin-right: 8%; }
  #homeQuoteForm div.form {
    float: left;
    width: 45%; }
    #homeQuoteForm div.form label {
      text-align: right; }
    #homeQuoteForm div.form .explanation {
      color: #ddd; }
    #homeQuoteForm div.form .invalid .feedback {
      color: #7D0505; }

#newFooter {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background: #404040; }
  #newFooter h3 {
    color: #fff;
    font-size: 1.2em;
    padding: .5em 0; }
  #newFooter a, #newFooter p {
    color: rgba(255, 255, 255, 0.8); }
  #newFooter .column {
    float: left;
    width: 22%; }
  #newFooter .contact {
    padding-top: 3.2em;
    width: 24%; }
    #newFooter .contact p {
      padding-bottom: 0.1em;
      font-size: 0.8em; }
  #newFooter .newsletter {
    width: 31%; }
    #newFooter .newsletter p {
      font-size: 14px;
      padding: .8rem 0; }
    #newFooter .newsletter input.email {
      padding: 0.6em 1em;
      background: #272727;
      color: #fff;
      border: 1px solid #272727;
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    #newFooter .newsletter input.submit {
      background: #f2f2f2;
      padding: 0.6em 2em;
      color: #555;
      border: 0;
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      cursor: pointer; }
      #newFooter .newsletter input.submit:hover {
        background: #fff;
        color: #222; }

div#usingLeagueLab.twoThirds, div#whatPeopleAreSaying.oneThird {
  text-align: center; }

div#usingLeagueLab img.imageLabel, div#usingLeagueLab.twoThirds img.lastImage {
  margin-right: 0px; }

div#usingLeagueLab.twoThirds img {
  margin-right: 40px; }

img.imageLabel {
  margin-top: 20px;
  margin-bottom: 12px; }

#homePrimaryCTA {
  position: relative; }

#homePrimaryCTA h1 {
  font-size: 2.25em;
  color: #6893AB;
  line-height: 1.25em; }

#homePrimaryCTA h2 {
  font-size: 1.1em;
  color: #000; }

#homePrimaryCTA a.blue.button {
  width: 210px;
  height: 60px;
  display: block;
  text-align: center; }

span.homePrimaryCTATopLine {
  font-size: 1.4em;
  display: block;
  margin-bottom: 3px; }

span.homePrimaryCTABottomLine {
  font-weight: normal; }

img#videoCTA {
  position: absolute;
  top: 32px;
  left: 274px; }