@font-face {
font-family: "Vollkorn", "Verdana";
src: url("css/fonts/Vollkorn.eot");
src: 
url("css/fonts/Vollkorn.woff") format("woff"),
url("css/fonts/Vollkorn.otf") format("opentype"),
}

body{
font-family:'Vollkorn'
}

#myBtn {
  width: 300px;
  font-size: 130%;
  padding: 10px;
  margin: 5px;
  border: none;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  cursor: pointer;
}

#myBtn:hover {
  background: #ddd;
  color: black;
}

#Zusatz {
  display: inline;
  text-align: justify;
  color: #fff;
  background: rgba(0,0,0,0.6);
  margin: 10px;
  padding: 10px;
  font-size: 100%;}

#Zusatz:hover {
  background: #ddd;
  color: black;
}

#PlayPause {
  display: inline;
  text-align: justify;
  color: #fff;
  background: rgba(0,0,0,0.6);
  margin: 10px;
  padding: 10px;
  font-size: 100%;}

#PlayPause:hover {
  background: #ddd;
  color: black;
}

#Haupttext {
  display: block;
  text-align: justify;
  margin: 10px;
  padding: 10px;
  line-height: 1.5;
  font-size: 130%;}

.main{background-position:center center;background-size:cover;height:auto;left:0;min-height:100%;min-width:100%;position:absolute;top:0;width:auto;overflow:visible}@media (max-width:991px){.main{padding:0px}}.main .container{position:relative;z-index:2}.main #video-background{position:fixed;top:0;left:0;min-width:100%;min-height:100%;width:auto;height:auto;z-index:1;overflow:visible}.main p.social{text-align:right;margin-top:20px}

.main .top{color:#fff;margin-top:200px;font-family:'Vollkorn',top;font-size:60px;text-shadow:0 1px 2px rgba(0,0,0,0.6);text-align:center;margin-bottom:40px}@media (max-width:1199px){.main .top{margin-top:100px}}.main .sub{color:#fff;font-weight:300;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.6)}

.main .nav{position:relative;bottom:0;right:0;width:100%;z-index:4;margin-top:50px;background: rgba(0, 0, 0, 0.6);color: #f1f1f1;width: 100%;min-height: 20%;text-shadow:0 1px 2px rgba(0,0,0,0.6)}

.main .nav a{color:#fff}.main .nav a:hover,.main .nav a:focus{text-decoration:underline}

.main .nav p{text-align:justify}@media (max-width:991px){.main .nav{text-align:center}.main .nav p.credit{text-align:justify}}@media (min-width:992px){.main .nav{position:fixed;bottom:0px}}

button.tooltip {
  position: relative;
  text-decoration: none;
}
button.tooltip:hover:after {
  content: attr(data-tooltip);
  position: absolute;
  background: #ddd;
  opacity: 0.95;
  padding: 5px 15px;
  color: black;
  font-size:80%;
  border-radius : 10px;
  bottom: 120%;
  left: 0%;
}




