html, body, .container-table {
    height: 100%;
}
.header{
	background-color:rgba(255,255,255,1.00) ;
	color:black;
	width: 100%;
}
.container-table {
    display: table;
}
.vertical-center-row {
    display: table-cell;
    vertical-align: middle;
}
#grade_black {
  background-image: linear-gradient(hsla(0,0%,0%,1.00), hsla(0,0%,0%,0.00));
  height:20px;
}
#moodle{
  width: 67px;
  height: 18px;
  background: url('../images/moodle_sprite.png') 0 0;
  background-size: 134px 18px;
  background-repeat: no-repeat;
  margin-top:14px;
  margin-left:14px;
}
#moodle a:hover{
  width: 67px;
  height: 18px;
  background: url('../images/moodle_sprite.png') -67px 0;
  background-repeat: no-repeat;
  background-size: 134px 18px;
}
@media (min-width: 1200px) {
#first_screen{
  background-image: url('../images/Background_weights_1080p.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  height: 100%;
}
}
@media (max-width: 1200px) {
#first_screen{
  background-image: url('../images/Background_weights_iP.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  height: 100%;
}
}

#impressum{
color: black;
}
.navbar >li > a{
	text-decoration:none;
	transition: text-decoration 2s;
	-webkit-transition: text-decoration 2s;
}
.navbar-nav > li > a:hover{
  text-decoration: underline;
}

.arrow{
    position: absolute;
    top: 95%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 30px;
    height: 30px;
    border-bottom: 5px solid #06A8FF;
    border-right: 5px solid #06A8FF;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 2s infinite;
}
.arrow span:nth-child(2){
    animation-delay: -0.2s;
}
.arrow span:nth-child(3){
    animation-delay: -0.4s;
}
@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}
arrow2 {
  text-align: center;
  margin: 8% 0;
}
.bounce {
  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}