#responsiveLoginButton {
  background: 0;
  font-size: 28px;
  color: #222;
  margin-top: -2px; }
  #responsiveLoginButton span {
    text-transform: uppercase;
    font-size: 9px;
    position: absolute;
    bottom: -17px;
    left: -6px;
    font-weight: bold; }

#responsiveMenuButton {
  background: none !important;
  font-size: 28px;
  color: #222;
  margin-top: -2px; }

#responsiveHeader {
  border-bottom: 3px solid #427db9;
  background-color: #427db9; }
  #responsiveHeader i {
    color: #fff; }
  #responsiveHeader #responsiveMenuLogo {
    z-index: 99999;
    position: fixed;
    margin: 2px 0 0 9px;
    max-width: 250px; }
    #responsiveHeader #responsiveMenuLogo img {
      max-height: 60px;
      max-width: 100%;
      margin-top: 1%; }

#responsiveMenu, #responsivePlayerMenu, #responsiveSportMenu {
  top: 63px !important; }

body #responsiveHeader {
  background-color: #427db9; }
  body #responsiveHeader i {
    color: #fff; }

body #responsiveMenuButton,
body #responsiveLoginButton {
  color: #fff;
  background-image: none !important; }
  body #responsiveMenuButton.active,
  body #responsiveLoginButton.active {
    background-image: none; }
  body #responsiveMenuButton.loggedIn,
  body #responsiveLoginButton.loggedIn {
    background-image: none; }

@media only screen and (max-width: 850px) {
  #responsiveMenuButton {
    background: transparent url(../../graphics/beachcityv2/icon-mobile-open.png) no-repeat top left; }

  #responsiveLoginButton {
    background: transparent url(../../graphics/beachcityv2/icon-mobile-log-in.png) no-repeat top left; }

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

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

  #responsiveHeader .responsiveMenuToggle,
  #responsiveHeader .leagueInfoLink,
  #responsiveSportMenu .responsiveMenuToggle {
    background-color: #f6f6f6; }
    #responsiveHeader .responsiveMenuToggle.active,
    #responsiveHeader .leagueInfoLink.active,
    #responsiveSportMenu .responsiveMenuToggle.active {
      background-color: #3b70a6;
      color: #fff; }

  #responsivePlayerMenu a {
    color: #427db9; }

  #responsiveMenu, #responsivePlayerMenu, #responsiveSportMenu {
    border-top: 1px solid #ddd; }
    #responsiveMenu a, #responsivePlayerMenu a, #responsiveSportMenu a {
      color: #427db9;
      border-bottom: 1px solid #ddd; }
      #responsiveMenu a:hover, #responsivePlayerMenu a:hover, #responsiveSportMenu a:hover {
        color: #ee6241; }
    #responsiveMenu ul, #responsivePlayerMenu ul, #responsiveSportMenu ul {
      background: #e6e6e6; }

  body {
    background-image: none !important; }

  #topBarOuter, #header, #sidebar {
    display: none; }

  .pageWidth {
    width: 97%;
    position: relative;
    margin: 0 1.5%; }

  #mainPage {
    width: 97%;
    margin: 0 1.5%;
    padding: 0;
    border: 0;
    margin-top: 1rem; }

  #pageContainer {
    width: 100%; }

  #footer #footerContactColumn {
    position: relative;
    float: none;
    top: auto;
    left: auto;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0 0 2rem 0;
    text-align: left;
    padding: 0;
    clear: left;
    padding-top: 4rem; }
  #footer .poweredBy {
    position: relative;
    top: auto;
    right: auto;
    margin-top: 2rem; }

  #homePageContainer #sliderContainer, #homePageContainer #sliderOuterContainer, #homePageContainer #slider, #homePageContainer ul.slides li {
    position: relative;
    top: auto;
    left: auto;
    float: none;
    width: auto;
    height: auto;
    max-width: 860px; }
  #homePageContainer #sliderContainer {
    margin: 0;
    padding: 0;
    border: 0; }
  #homePageContainer #slider li img {
    max-width: 100%; }
  #homePageContainer #sliderRow {
    width: 100%;
    margin: 0; }
  #homePageContainer .one-third {
    width: 31.5%;
    margin-left: 1.5%; }
  #homePageContainer #bigLinks a {
    background-position: 94% 16px; }
  #homePageContainer #homeVideoRow iframe {
    width: 97% !important;
    height: 350px; }
  #homePageContainer #facebookOuter, #homePageContainer #instagramOuter {
    position: relative;
    float: none;
    top: auto;
    left: auto;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0 0 2rem 0;
    text-align: left;
    padding: 0;
    width: 97%; }

  div#siteAlert.Rainout, div#siteAlert.Announcement, div#siteAlert.Alert {
    width: 97%;
    margin-left: 1.5%;
    margin-right: 1.5%;
    background: transparent;
    padding: 8px 0; }

  #newsletterSignup {
    z-index: 99; } }
@media only screen and (max-width: 660px) {
  #bigLinks .one-third {
    position: relative;
    float: none;
    top: auto;
    left: auto;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0 0 2rem 0;
    text-align: left;
    padding: 0;
    margin: 0 auto 0.4rem auto;
    width: 97%; }
    #bigLinks .one-third:first-child {
      margin-left: auto; }

  #introVideoWrap {
    margin-top: -13px; }

  #newsletterSignup {
    width: 100%;
    padding: 10px 0 15px;
    position: relative;
    height: auto;
    bottom: 60px; }
    #newsletterSignup .social {
      display: block;
      margin-top: 20px;
      margin-bottom: 15px; }
      #newsletterSignup .social li {
        margin-left: 12px;
        color: #fff;
        font-size: 20px; }
        #newsletterSignup .social li:nth-of-type(1) {
          margin-left: 0; }
        #newsletterSignup .social li a {
          color: #fff;
          font-size: 24px; }
    #newsletterSignup form {
      width: 100%; }
      #newsletterSignup form > span {
        display: block;
        text-align: center;
        margin-bottom: 25px; }
      #newsletterSignup form > input[type=text] {
        width: 83%;
        margin: 0 auto;
        clear: both;
        display: block;
        border-radius: 2px;
        padding: 10px;
        height: 48px;
        box-sizing: border-box; }
      #newsletterSignup form > input[type=submit] {
        width: 83%;
        margin: 0 auto;
        clear: both;
        display: block;
        border-radius: 2px;
        margin-top: 5px;
        padding: 0; }

  #theNumbers {
    display: none;
    height: auto;
    padding: 10px 0; }
    #theNumbers h4 {
      max-width: 85%;
      margin: auto;
      line-height: 45px; }
    #theNumbers #cells {
      width: 100%; }
      #theNumbers #cells > div {
        width: 100%;
        margin-bottom: 15px; }

  #picker {
    max-width: 100%;
    margin-top: 35px; }
    #picker * {
      float: none; }
    #picker .city, #picker .sport {
      width: 100%; }
    #picker .city-label, #picker .sport-label {
      width: 100%; }

  #sponsors {
    width: 92%;
    margin: 25px auto 25px; }
    #sponsors > #icons {
      width: 100%;
      margin: 0 auto; }
      #sponsors > #icons img {
        max-width: 22%;
        margin-right: 6px; }
    #sponsors > #testimonial {
      width: 90%;
      margin: 45px auto 0; }

  #footerOuter {
    padding: 40px 15px; } }
@media only screen and (max-width: 767px) {
  #homePageContainer #instagramOuter iframe {
    width: 97% !important; }
  #homePageContainer #homeVideoRow iframe {
    height: 275px; } }
@media only screen and (max-width: 568px) {
  #homePageContainer #leaguePromoRow1 .one-third,
  #homePageContainer #leaguePromoRow2 .one-third,
  #homePageContainer #leaguePromoRow3 .one-third,
  #homePageContainer #leaguePromoRow4 .one-third {
    position: relative;
    float: none;
    top: auto;
    left: auto;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0 0 2rem 0;
    text-align: left;
    padding: 0;
    margin: 0 auto 0.4rem auto;
    width: 97%; }
    #homePageContainer #leaguePromoRow1 .one-third:first-child,
    #homePageContainer #leaguePromoRow2 .one-third:first-child,
    #homePageContainer #leaguePromoRow3 .one-third:first-child,
    #homePageContainer #leaguePromoRow4 .one-third:first-child {
      margin-left: auto; }
    #homePageContainer #leaguePromoRow1 .one-third .themeAd,
    #homePageContainer #leaguePromoRow2 .one-third .themeAd,
    #homePageContainer #leaguePromoRow3 .one-third .themeAd,
    #homePageContainer #leaguePromoRow4 .one-third .themeAd {
      background: transparent; }
  #homePageContainer #homeVideoRow iframe {
    height: 200px; } }
@media only screen and (max-width: 850px) {
  /* 850px */
  body.forceResponsive #mainPage.pageWidth {
    margin: 0 0 0 15px; } }
@media only screen and (max-width: 630px) {
  body.forceResponsive #mainPage.pageWidth {
    width: 96%;
    margin: 0 0 0 10px; } }
/* mobile logo */
@media only screen and (max-width: 375px) {
  #responsiveHeader {
    /* logo has z-index of 999999.
       larger z-index needed to make them clickable */ }
    #responsiveHeader #responsiveMenuLogo {
      max-width: 250px; }
      #responsiveHeader #responsiveMenuLogo img {
        margin-top: 3%;
        max-width: 100%; }
    #responsiveHeader #responsiveLoginButton,
    #responsiveHeader #responsiveMenuButton {
      z-index: 1000000; } }
@media only screen and (max-width: 340px) {
  #responsiveHeader #responsiveMenuLogo {
    max-width: 250px; }
    #responsiveHeader #responsiveMenuLogo img {
      margin-top: 3%;
      max-width: 100%; } }
