/**
 * $JA#COPYRIGHT$
 */

// VARIABLES & MIXINS
// ------------------
@import "vars.less"; // Modify this for custom colors, font-sizes, etc


// ---------------------------------------------------------
// HOME
// ---------------------------------------------------------
.home {
  color: @gray;

  .jumbotron {
    background-color: transparent;
    position: relative;
    
    // Heading
    h1, h2, h3 {
      color: @gray-dark;
    }
  }

  // 
  // HOME SPOTLIGHTS
  // ---------------------------------------------------------

  // Spotlight 1
  // -----------
  .t3-sl-1 {
    padding: 0;
    background: @gray-lighter;
    border-bottom: 1px solid @t3-border-color;

    // jumbotron
    .jumbotron {
      border-radius: 0;

      h1 {
        font-weight: bold;
      }

      //jumbotron btn
      .btn {
        margin-top: @line-height-computed;
      }
    }

    // social buttons
    .t3-social {
      background: @gray-lighter;
      padding: @t3-global-padding 0;

      .t3-social-btns {
        margin: 0;
        height: 20px;
        text-align: center;
      }

      .t3-social-btns li {
        display: inline-block;
        margin: 0 10px;
        height: 20px;
      }
    }
  }

  // Spotlight 2
  // -----------
  .t3-sl-2 {
    text-align: center;

    .img-responsive {
      display: inline-block;
    }

    p {
      font-size: @t3-font-size-bigger;
      line-height: @line-height-computed + 2px;
    }
  }

  // Spotlight 3 & 4
  // ---------------
  .t3-sl-3 p img {
    margin-bottom: @t3-global-margin;
  }

  .t3-sl-3,
  .t3-sl-4 {
    border-top: 1px solid @t3-border-color;
    text-align: center;

    p {
      font-size: @t3-font-size-bigger;
      line-height: @line-height-computed + 2px;
    }

    // jumbotron
    .jumbotron {
      padding-top: 0;
      h1 {
        margin-bottom: @t3-global-margin / 2;
        margin-top: 0;
      }
      p {
        font-size: @font-size-base * 1.5;
        line-height: 1.275;
        color: @gray-light;
      }
    }
  }

  // Spotlight 5
  // -----------
  .t3-sl-5 {
    background: @gray-lighter;
    border-top: 1px solid @t3-border-color;
    padding: 0;

    // jumbotron
    .jumbotron {
      border-radius: 0;
      margin-bottom: 0;
    }
  }

}



//
// RESPONSIVE HOME
// -------------------------------------------------------------
@media (max-width: @screen-xs-max) {

  // -----------------------------------------------------------
  // HOME SPOTLIGHTS
  // -----------------------------------------------------------

  .home {

    // Spotlight 1 + 5
    // ---------------
    .t3-sl-1,
    .t3-sl-5 {

      //jumbotron
      .jumbotron {
        padding-top: 30px;
        padding-bottom: 10px;
        //jumbotron btn
        .btn-large {
          font-size: @font-size-base + 2;
          padding: (@font-size-base - 2px) (@font-size-base + 2px);
        }
      }
    }


    // Spotlight 2
    // -----------
    .t3-sl-2 {
      text-align: center;
      p {
        font-size: @font-size-base;
        line-height: @line-height-computed;
      }
    }


    // Spotlight 3 & 4
    // ---------------
    .t3-sl-3 p img {
      margin-bottom: 0;
      margin-top: @t3-global-margin;
    }

    .t3-sl-3,
    .t3-sl-4 {
      p {
        font-size: @font-size-base;
        line-height: @line-height-computed;
      }

      //jumbotron
      .jumbotron {
        padding-bottom: 0;
        h1 {
          margin-bottom: @t3-global-margin / 2;
          margin-top: @t3-global-margin / 2;
        }
        p {
          font-size: @font-size-base;
        }
      }
    }
  }
}

