/***************************************************************************************
* Home
***************************************************************************************/

.homepage {
  background: #000 url('https://crds-cms-uploads.imgix.net/content/images/cupbg.jpg') no-repeat;
  background-position: -920px top;

  @media only screen and (min-width:  $screen-sm-min){
    background-position: center top;
  }

  .main {
    margin-bottom: 0;
  }

  footer {
    margin-top: 0;
  }

  .brandbar-container {
    visibility: hidden;
    opacity: 0;
  }

  .icon-logo {
    color: #fff;
    transition: all .6s;

    &:hover {
      color: rgba(255, 255, 255, 0.6);
    }
  }

  ul.cr-nav > li > a {
    color: #fff;
  }

  ul.navbar--login .btn-standard {
    @extend .btn-standard-darker;
  }

  .nav__side--toggle .icon-bar {
    background-color: #fff;
  }

  .mobile-search {
    .icon {
      color: #fff;
    }
  }

  h1,
  h4,
  .subheading,
   {
    background: transparent;
    color: #fff;
    border: none;
  }

  .home-intro {
    color: #fff;
    margin-top: $line-height-computed*2;
    margin-bottom: $line-height-computed*2;

    @media only screen and (min-width: $screen-xs){
      margin-top: $line-height-computed*5;
      margin-bottom: $line-height-computed*6;
    }

    .home-intro-text {
      @media only screen and (max-width:  $screen-sm-min){
        max-width: 350px;
      }
    }
  }

  .home-countdown {
    background: #F1F2F2;
    padding: $line-height-computed*2.5 0 $line-height-computed*3.5;
  }

  .home-series {
    background: #A7A9AC;
    overflow: visible;
    position: relative;
    //@include box-shadow(inset 0 -15px 0 0 #F1F2F2);
    //@include box-shadow(inset 0 15px 0 0 #F1F2F2);

    &:before,
    &:after {
      display: block;
      content: ' ';
      left: 0;
      right: 0;
      background: #F1F2F2;
      position: absolute;
      z-index: 1;
    }

    &:before {
      top: 0;
      height: 15px;
    }

    &:after {
      bottom: 0;
      height: 30px;
    }

    h4,
    h5 {
      color: #fff;
      font-weight: bold;
    }

    @media only screen and (min-width:  $screen-md-min){
      h4 {
        margin-top: $line-height-computed;
      }
    }

    img {
      margin-top: -$grid-gutter-width/2;
      margin-bottom: $grid-gutter-width;

      @media only screen and (min-width:  $screen-sm-min){
        margin-bottom: 0;
      }

      @media only screen and (min-width:  $screen-md-min){
        margin-top: -$grid-gutter-width;
      }
    }

    .home-series-img {
      @media only screen and (min-width:  $screen-sm-min){
        padding-right: 0px;
      }
    }

    .home-series-desc {
      background: #464749;
      color: #fff;
      padding-bottom: $grid-gutter-width/2;
      position: relative;
      z-index: 2;
    }
  }

  .home-locations {
    background: #F1F2F2;
    padding: $line-height-computed*2.5 0;
  }

  .home-map {
    position: relative;

    img {
      display: block;
    }

    a {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;

      span {
        display: none;
      }
    }

    .arrow-down {
    	width: 0;
    	height: 0;
      border-left: 40px solid transparent;
      border-right: 40px solid transparent;
      border-top: 30px solid #F1F2F2;
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -40px;
      z-index: 3;
    }
  }

  .home-were-open {
    background: black url('https://crds-cms-uploads.imgix.net/content/images/wereopen.jpg') no-repeat;
    background-position: right top;
    background-size: cover;
    color: #fff;
    padding: $line-height-computed*4 0;
    position: relative;

    @media only screen and (max-width:  $screen-md-min){
      &:before {
        background: rgba(0,0,0,.5);
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        position: absolute;
        content: " ";
        display: block;
      }
    }

    h1 {
      color: #fff;
    }
  }
}