/** Custom CSS **/

.header-container { background: #222222; margin-top: 0 !important; }
#section-footer { background: #222222; }
#section-footer p { color: #ffffff; }

h1, h2, h3, h4, h5, h6 {
  font-family: ff-meta-web-pro;
}

.button { background: #222222; color: #ffffff }
.button:visited { background: #222222; color: #ffffff }

span.icon {
  display: inline-block;
}

span.icon img {
  width: 40px;
  height: auto;
  padding: 0 6px;
  position: relative;
  top: 12px;
}

.button.button-giant { padding-top: 12px; }

#section-banner .banner-title-group,
#section-banner .banner-title-group h1,
#section-banner .banner-title-group h2 {
  padding: 0 !important;
  margin: 0 !important;
  text-align: left;
}


@media only screen and ( min-width: 1200px ) {

  #section-banner .banner-title-group {
    width: 90%;
    max-width: 90%;
    margin-top: -60px !important;
    display: inline-block;
  }

  #section-banner .banner-title-group h1 {
    font-size: 62px;
  }

  #section-banner .banner-title-group h2 {
    font-size: 42px;
  }

}

@media only screen and ( max-width: 1199px ) {

  #section-banner .banner-title-group {
    width: 90%;
    max-width: 90%;
  }

  #section-banner .banner-title-group h1 {
    font-size: 40px;
  }

  #section-banner .banner-title-group h2 {
    font-size: 28px;
  }

}

@media only screen and ( max-width: 767px ) {

  #section-banner .banner-title-group {
    width: 98%;
    max-width: 98%;
    background: rgba(255,255,255, 0.8);
    padding: 12px;
  }

  #section-banner .banner-title-group h1 {
    font-size: 32px;
  }

  #section-banner .banner-title-group h2 {
    font-size: 20px;
  }

}

@media only screen and ( max-width: 400px ) {

  #section-banner .banner-title-group h1 {
    font-size: 17px;
  }

  #section-banner .banner-title-group h2 {
    font-size: 13px;
  }

}
