@font-face {
  font-family: 'sexsmith';
  src: url('../fonts/sexsmith-webfont.eot');
  src: url('../fonts/sexsmith-webfont.eot?#iefix') format('embedded-opentype');
  src: url('../fonts/sexsmith.ttf') format('truetype');
  src: url('../fonts/sexsmith.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

#index-bg {
  width: 100%;
  background: url("../img/splash-illo.jpg") top no-repeat, 
              url("../img/coral-footer.png") bottom no-repeat;
  background-size: 100% auto;
  padding: 0;
  margin: 0;
}

#index-nudge {
  height: 450px;
}

#index-blue {
  background: rgba(0,0,255,0.7);
  margin-top: 250px;
  margin-bottom: -40px;
  font-family: sexsmith, serif;
  font-size: 7em;
  color: #FFF;
}

#index-panorama {
  margin-bottom: -1px;
}

#index-white {
  background: #FFF;
  padding: 30px 50px;
}


#promo-text {
  font-size: 4.5em;
  font-family: sexsmith, serif;
  color: #333;
  margin-bottom: 10px;
}

@media (max-width: 500px) {
  #promo-text {
  font-size: 2.5em;
  }
}

.guest-name {
  font-size: 2em;
  font-family: sexsmith, serif;
}

@media (max-width: 500px) {
  .guest-name {
  font-size: 1.5em;
  }
}

.guest-info {
  font-size: 2.5em;
  font-family: sexsmith, serif;
  padding-bottom: 10px;
}

@media (max-width: 500px) {
  .guest-info {
  font-size: 1.8em;
  }
}

.guest-blurb {
  font-style: italic;
  margin-bottom: 15px;
}

#hr-divider {
  border: 0;
  height: 1px;
  background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
  background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
  background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
  background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
  margin: -5px 0 5px 0;
}

#our-sponsors {
  font-size: 2.5em;
  font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
  color: #333;
  font-weight: bold;
}

@media (max-width: 500px) {
  #our-sponsors {
  font-size: 1.8em;
  }
}

#white-text {
  font-size: 1.3em;
  font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
  color: #333;
  padding-bottom: 30px;
}



#index-lightblue {
  background: #A6E0F4;
  padding: 30px 50px;
  font-size: 1.3em;
  font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
  color: #333;
  min-height: 575px;
}

#index-merfolk {
  max-height: 450px;
  margin-left: 40px;
  margin-bottom: 10px;
}

#index-charities {
  background: #FFF;
  padding: 30px 50px;
  font-size: 2.5em;
  font-family: sexsmith, serif;
  color: #235B73;
}

#index-coral {
  height: 500px;
}

#coral-big {
  font-size: 4.5em;
  font-family: sexsmith, serif;
  color: #FFF;
  padding-top: 50px;
  margin-bottom: -10px;
}

@media (max-width: 500px) {
  #coral-big {
  font-size: 2.5em;
  }
}

#coral-middle {
  font-size: 4.5em;
  font-family: sexsmith, serif;
  color: #333;
  padding-top: 30px;
  margin-bottom: 10px;
}

@media (max-width: 500px) {
  #coral-middle {
  font-size: 2.5em;
  }
}


#coral-small {
  font-size: 1.5em;
  font-family: sexsmith, serif;
  color: #FFF;
}

@media (max-width: 500px) {
  #coral-small {
  font-size: 1.3em;
  }
}

#coral-tix {
  max-width: 40%;
}

.screen-reader {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
}

/* from http://ehealth.kcl.ac.uk/sites/team-blog/2013/01/31/responsive-youtube-embed-in-bootstrap/ */
.flex-video {
position: relative;
padding-top: 25px;
padding-bottom: 67.5%;
height: 0;
margin-bottom: 16px;
overflow: hidden;
}
.flex-video.widescreen { padding-bottom: 57.25%; }
.flex-video.vimeo { padding-top: 0; }
.flex-video iframe,
.flex-video object,
.flex-video embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
.flex-video { padding-top: 0; }
}

.col-xs-2-4,
.col-sm-2-4,
.col-md-2-4,
.col-lg-2-4 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-2-4 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-2-4 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-2-4 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-2-4 {
        width: 20%;
        float: left;
    }
}

.sponsor-nudge {
  width: 100%;
  height: 40px;
}

@media (min-width: 992px) {
    .sponsor-nudge {
      height: 50px;
    }
}