
#demoFont {
font-family: Georgia, serif;
font-size: 25px;
letter-spacing: 2px;
word-spacing: 2px;
color: #000000;
font-weight: normal;
text-decoration: none;
font-style: normal;
font-variant: normal;
text-transform: none;
}

#card {
    position: relative;
    margin: auto;
    width: 1000px;
    height: 490px;
    background-image: url('card.png');
}

#demos {
  margin: auto;
  width: 1000px;
  padding-left: 40px;
}

#email {
  position: absolute;
  display: inline-block;
  width: 340px;
  height: 38px;
  top: 338px;
  left: 208px;
  float: left;
}

#rep {
  position: absolute;
  display: inline-block;
  outline-style: none;
  width: 375px;
  height: 38px;
  top: 384px;
  left: 208px;
  float: left;
}

#email:link,#email:visited,#rep:link,#rep:visited {
  text-decoration: none;
}

#email:hover,#rep:hover {
  box-shadow: 0px 0px 2pt 2pt rgba(0, 46, 98, 0.3);
}

.demo {
  margin: 3px;
  width: 300px;
  height: 50px;
  float: left;
}

.player-title {
  margin-bottom: 2px;
  vertical-align: center;
}

.player {
  border: 2px solid rgb(226, 226, 226);
  border-radius: 7px 7px 7px 7px;
  padding: 5px;
  font-family: 'Quicksand',Helvetica,sans-serif;
  color: rgb(140, 156, 146);
  font-size: 15px;
  font-weight: 700;
}

.mejs__container .mejs__controls {
  background: rgba(255, 255, 255, 1);
}

.mejs__controls .mejs__time-rail .mejs__time-loaded {
  background: linear-gradient(rgba(255, 255, 255, 0.8), rgba(0, 46, 98, 0.7));
}

.mejs__button>button {
  background-image: url("controls.svg");
}

.mejs__time-handle-content {
    background: rgb(0, 0, 0);
}

.mejs__time-total {
    background: rgba(50, 50, 50, .8);
}

.mejs__time-buffering {
    background: rgba(50, 50, 50, .8);
}

.mejs__time-current {
    background: rgb(0, 46, 98);
}

.mejs__currenttime {
    color: rgb(0, 46, 98);
}

.mejs__duration {
    color: rgb(0, 46, 98);
}

.mejs__container .mejs__controls .mejs__time-loaded span {
  background-image: linear-gradient(rgba(0, 46, 98, 0.7), rgba(255, 255, 255, 0.4));
}

.mejs__horizontal-time-current {
    color: rgb(0, 46, 98);
}

.mejs__horizontal-volume-current {
  background-image: linear-gradient(rgba(0, 46, 98, 0.7), rgba(255, 255, 255, 0.4));
}

.demo a {
  float: right;
  text-decoration: none;
  color: rgb(0, 46, 98);
  font-size: 75%;
}

