$shine: #C70808; // Palette http://www.colourlovers.com/palette/79468/LipstickOnHisCollar
$subtle: #EEE9DE;

h1 {
  font-family: 'Lato', sans-serif;
  margin-bottom: 0;
}

h2 {
  font-family: 'Lato', sans-serif;
  
  .shine {
    display: inline-block;
    padding: 0 0.2em;
  }
}

h3 {
  font-size: 2rem;
  font-weight: normal;
}

.shine {
  background-color: $shine;
  color: #F6F4E9;
  
  &.large {
    display: block;
    padding: 1.5em 0;
  }
}

.subtle {
  background-color: $subtle;
  color: #222;
}

a {
  color: $shine;
  
  &:hover, &:focus {
    color: $shine !important;
    background-color: $subtle !important;
  }
}

header {
  margin-top: 2rem !important;
  margin-bottom: 2rem !important;
  border-bottom: 15px solid $subtle;
    
  a.button {
    display: block;
  }
}

.buttons iframe {
  float: right;
  margin: 0 0 0.5rem 2rem;
}

#example1, #example2 {
  height: 15rem;
  background-repeat: no-repeat;
  background-size: contain;
}
#example1 {
  background-image: url('../images/example1.png');
}
#example2 {
  background-image: url('../images/example2.png');
}

footer {
  margin-top: 2rem !important;
  border-top: 15px solid $subtle;
}