@font-face {
  font-family: CartonSlab;
  src: url("https://s3.amazonaws.com/cyob.hellabitters.com/fonts/Carton-Slab.otf") format("opentype");
}

@font-face {
  font-family: Bembo;
  src: url("https://s3.amazonaws.com/cyob.hellabitters.com/fonts/BemboStd.otf") format("opentype");
}

@font-face {
  font-family: Bembo;
  src: url("https://s3.amazonaws.com/cyob.hellabitters.com/fonts/BemboStd-Bold.otf") format("opentype");
  font-weight: bold;
  font-style: normal;
}

body {
  background-image: url('../img/wallpaper.png');
  background-repeat: repeat;
}

header {
  margin: 0px;
  padding: 20px;
  background-color: black;
  color: white;
  text-align: center;
  font-family: CartonSlab;
  font-size: 24px;
  letter-spacing: 2px;
}

#message {
  margin-top: 30px;
  padding: 1px 20px 1px 20px;
  height: 380px;
  background-color: white;
  border: 1px solid #ccc; 
  font-family: Bembo;
  line-height: 30px;
}

#message h4 {
  font-family: Bembo;
  font-weight: bold;
}

#ks_widget {
  margin-top: 10px;
  padding-left: 55px;
}

#share-bar {
  margin-top: 15px;
  padding-bottom: 30px;
  font-family: Bembo;
  text-align: center;
}

#share-bar h3 {
  font-family: CartonSlab;
  margin-bottom: 30px;
}

#share-bar p {
  margin: 1px;
  font-size: 20px;
}

#fb_share, #tweet, #play {
  display: block;
  margin-top: 25px;
  padding: 20px;
  color: white;
  font-family: CartonSlab;
  font-size: 24px;
  text-decoration: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

#fb_share {
  background-color: #3b5998;
}

#fb_share:hover {
  background-color: #3B7FAF;
}

#tweet {
  background-color: #2578b4;
}

#tweet:hover {
  background-color: #20B0CB;
}

#play {
  background-color: #2bde73;
}

#play:hover {
  background-color: #23F53C;
}

#share_press #video {
  margin-top: 30px;
  padding-bottom: 100px;
}

#share_press #ks_widget #play {
  margin-bottom: 7px;
  width: 220px;
  height: 57px;
  text-align: center;
}

#share_press #articles {
  margin-top: 17px;
}

#share_press #articles p {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}

#share_press .fb-share-button {
  padding-left: 13px;
}

#share_press #footer {
  margin-top: 30px;
  text-align: center;
  font-size: 14px;
}

@media only screen and (max-width: 40em) {
  #message {
    line-height: 25px;
  }

  #share_press .article {
    height: 130px;
    text-align: center;
  }

  #share_press .fb-share-button {
    padding: 0px;
    margin-right: 55px;
  }

  #share_press #video {
    padding-bottom: 0px;
  }
}