/**
 * Copyright 2014 Google Inc. All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.summit-get-involved {

  max-width: 960px;
  width: 100%;

  margin: 144px auto 0 auto;
  padding-top: 48px;
  border-top: 1px solid #E1E1E1;

  padding-bottom: 48px;
}

.summit-get-involved-title {
  @include typo-title();
  @include keyline-16l();
  color: $color-primary;
  letter-spacing: 0;
  padding-bottom: 32px;
}

.summit-get-involved-item {
  padding-bottom: 48px;
  max-width: 360px;
  margin: 0 auto;
}

.summit-get-involved-item:before {
  content: '';
  width: 100%;
  height: 240px;
  display: block;
}

.summit-get-involved-item.quad:before {
  background: #EA006F url(../images/illustration-quad.svg) center center no-repeat;
  background-size: contain;
}

.summit-get-involved-item.livestream:before {
  background: #4CBB47 url(../images/illustration-livestream.svg) center center no-repeat;
  background-size: contain;
}

.summit-get-involved-item.questions:before {
  background: #4A90E2 url(../images/illustration-questions.svg) center center no-repeat;
  background-size: contain;
}

.summit-get-involved-item-title {
  @include typo-body-2();
  padding: 8px 16px 24px 16px;
  font-weight: 700;
  letter-spacing: 0;
}

.summit-get-involved-item p {
  @include keyline-16();
  color: #757575;
  line-height: 1.7;
}

@media (min-width: 660px) {
  .summit-get-involved-item {
    display: block;
    float: left;
    width: 33.33%;
    padding-right: 4px;
  }

  .summit-get-involved-item:last-of-type {
    padding-right: 0;
  }

}

@media (min-width: 960px) {

  .summit-get-involved-title,
  .summit-get-involved-item-title {
    padding-left: 0;
  }

  .summit-get-involved-item {
    display: block;
    float: left;
    vertical-align: top;
    width: 304px;
    margin-right: 24px;
    padding-right: 0;
  }

  .summit-get-involved-item:last-of-type {
    margin-right: 0;
  }

  .summit-get-involved-item:before {
    width: 304px;
    height: 304px;
    @include shadow-z1();
    border-radius: 2px;
  }

  .summit-get-involved-item p {
    padding: 0 32px 0 0;
  }

  .summit-get-involved {
    padding-bottom: 224px;
  }

}
