html, body {
  color: Black;  
  overflow-x: hidden;
  overflow-y: hidden;
}
/* video background */
#background-video {
  height: 100%;
  width: 100%;
  object-fit: cover;
  position: fixed;
  background-image: url('img/quer.jpg');
  background-size: cover;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
}

#signup-response{
    
     animation:signup-response 2.5s 1;
    -webkit-animation:signup-response 2.5s 1;
    animation-fill-mode: forwards;
    
    animation-delay:5s;
    -webkit-animation-delay:5s; /* Safari and Chrome */
    -webkit-animation-fill-mode: forwards;
    
} 

@keyframes signup-response{
    from {opacity :1;}
    to {opacity :0;}
}

@-webkit-keyframes signup-response{
    from {opacity :1;}
    to {opacity :0;}
}

/* page content */
h1, h2 {
  font-family: Trebuchet MS;
  font-weight: bold;
  text-align: center;
  margin: 10px auto;
}

a {
	color: #031335;
}

a:hover {
	text-decoration: underline;
}

a:visited {
	color: #031335;
}

h1 {
  font-size: 3rem;
}

h2 { font-size: 2rem; }


.header-outer {
  text-align: center;
  align-items: center;
  height: 300px; 
  margin: 10px auto;
  font-size: 4em;
}
.header-scrolled {
  text-align: center;
  height: 150px;
  margin: 10px auto;
}
.header-inner {
  height: 100px;
  margin: 20px auto;
}

input[type=text], input[type=email] {
	width: 100%;
	margin: 5px;
	border-radius: 5px;
	height: 2em;
}
textarea {
	width: 100%;
	margin: 5px;
	border-radius: 5px;
	min-height: 3em;
}
input[type=checkbox] {
	margin-left: 5px;
	margin-right: 5px;
	border-radius: 5px;
}

.drop-box {
	margin: 5px;
	width: 100%;
	border: 1px white dashed;
	border-radius: 5px;
	padding: 3px;
	background-color: #ffffff88;
}
.check-box {
	margin: 5px;
	width: 100%;
	border: 1px white dashed;
	border-radius: 5px;
	padding: 3px;
	background-color: #ffffff88;
}

@media (max-width: 750px) {
    #background-video { display: none; }	
  
    body {	 
      background: url("img/hochkant.jpg") no-repeat;
      background-size: cover;
    }
}