/**
 * @Date:   2018-02-09T08:12:53-05:00
 * @Email:  danny@atomicmotion.com
 * @Filename: home.css
 * @Last modified time: 2018-02-14T11:20:55-05:00
 * @Copyright: Atomic Motion
 */

/* icons */

  .icon--location {
    margin: 50px auto 30px;
    width: 80px;
    height: 80px;
    background-position: center -230px;
  }

  .icon-heat-health-event         { background-position: center top; }
  .icon-improving-health-outcomes { background-position: center -115px; }
  .icon-who-is-the-tool-for       { background-position: center -583px; }
  .get-started .icon--location    { background-position: center -330px; }

/* icons */

/* impact */

.map-california {
  position: absolute;
  display: block;
  top: -20px;
  right: 0;
  width: 350px;
  height: auto;
}

.low-res { display: none; }

/* impact */

/* what is a heat health event */

.heat-health-event {
  padding-top: 50px;
  height: 650px;
  color: #333;
  background-image: url('../images/bg-heat-health-event.jpg');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

  .heat-health-event p {
    display: block;
    margin: 0 auto;
    width: 90%;
    max-width: 920px;
    line-height: 1.8;
  }

  .see-how p {
    margin-top: 60px;
    color: #F07F0A;
    font-size: 18px;
    font: 400px;
  }

  .see-how .btn {
    position: relative;
    margin-top: 20px;
    z-index: 4;
  }

  .area-impacted {
    position: relative;
    display: block;
    margin: -180px auto 0;
    width: 90%;
    max-width: 900px;
    height: auto;
    z-index: 2;
  }

/* what is a heat health event */

/* improving health outcomes */

.improving-health-outcomes {
  padding: 130px 0 60px;
  height: 600px;
  color: #fff;
  background-image: url('../images/bg-improving-health-outcomes.jpg');
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

   .improving-health-outcomes .icon { margin-top: 60px; }

  .improving-health-outcomes .h2 {
    margin-top: 20px;
    color: #fff;
    font-size: 40px;
    font-family: "Roboto", Helvetica, Arial, sans-serif;
    font-weight: 300;
  }

  .improving-health-outcomes p {
    display: block;
    margin: 0 auto;
    width: 90%;
    color: #fff;
    max-width: 920px;
    font-weight: 300;
    line-height: 1.8;
  }

  .improving-health-outcomes .icon--arrow--down { margin-top: 170px; }

/* improving health outcomes */

/* who-is-tool-for */

.who-is-tool-for {
  position: relative;
  padding: 50px 0;
  height: 500px;
}

  .who-is-tool-for .h2 { margin-top: 15px; }

  .who-is-tool-for p {
    display: block;
    margin: 0 auto;
    width: 90%;
    max-width: 880px;
    line-height: 1.8;
  }

  .list-tool-for {
    position: relative;
    margin-top: 50px;
    z-index: 3;
  }

  .list-tool-for li {
    margin-left: -40px;
    padding-top: 95px;
    width: 230px;
    height: 135px;
    color: #fff;
    font-size: 20px;
    font-family: "Roboto", Helvetica, Arial, sans-serif;
    font-weight: 400;
    line-height: 1;
    text-align: center;
    background-color: #D96F00;
    border-radius: 500px;
    text-transform: lowercase;
  }

    .list-tool-for li span { display: block; }

    .list-tool-for li:nth-of-type(1) { margin-left: 0;}
    .list-tool-for li:nth-of-type(2) { background-color: rgba(240, 127, 10, 0.9); }
    .list-tool-for li:nth-of-type(3) { background-color: rgba(255, 145, 31, 0.9); }
    .list-tool-for li:nth-of-type(4) { background-color: rgba(255, 172, 87, 0.9); }

  .who-is-tool-for:before {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 130px;
    background-color: #E7E8ED;
    z-index: 1;
  }

/* who-is-tool-for */

/* get started */

.get-started {
  height: 530px;
  background-color: #E7E8ED;
}

  .get-started .icon--arrow--down { margin-bottom: 50px; }

  .get-started .icon--arrow--down svg { fill: rgba(0, 0, 0, 0.2); }

  .get-started .h2 { margin: 0 auto; }

  .get-started p { margin: 0 auto 30px; }

/* get started */