html, body { 
  height: 100%; 
  margin: 0;
}


h1 {
text-align: center;
font-size : 25px;
line-height : 20px;
font-family : Arial, sans-serif;
color : #aaa;
font-weight : normal;
margin: 20px 0 20px 0;
color : #3399CC;
}


a.Button_Index:link, a.button_forum:visited, a.button_forum:active {
font-size : 15px;
line-height : 20px;
font-family : Verdana, Helvetica, Arial, sans-serif;
text-decoration : none;
font-weight : bold;
color: #000;
padding : 3px;
border : #aaa solid 1px;
border-radius : 12px;
box-shadow : 2px 2px 2px rgba(0, 0, 0, 0.4);
background: -moz-linear-gradient(top, #aaa, #eee);
background: -webkit-linear-gradient(top, #aaa, #eee);
background: -ms-linear-gradient(top, #aaa, #eee);
background: -o-linear-gradient(top, #aaa, #eee);
}

a.Button_Index:hover {
font-size : 15px;
line-height : 20px;
font-family : Verdana, Helvetica, Arial, sans-serif;
text-decoration : none;
font-weight : bold;
color: #000;
padding : 3px;
border : #aaa solid 1px;
border-radius : 12px;
box-shadow : 2px 2px 2px rgba(0, 0, 0, 0.4);
background: -moz-linear-gradient(top, #eee, #aaa);
background: -webkit-linear-gradient(top, #eee, #aaa);
background: -ms-linear-gradient(top, #eee, #aaa);
background: -o-linear-gradient(top, #eee, #aaa);
}

.Button {
border-radius : 50px;
border : #777 solid 1px;
box-shadow : 5px 5px 5px rgba(0, 0, 0, 0.3);
background: -moz-linear-gradient(top, #fff, #ccc);
background: -webkit-linear-gradient(top, #fff, #ccc);
background: -ms-linear-gradient(top, #fff, #ccc);
background: -o-linear-gradient(top, #fff, #ccc);
padding: 50px; 
margin: 20px;
width: 200px;
}

.Button:hover {
border-radius : 50px;
border : #777 solid 1px;
box-shadow : 5px 5px 5px rgba(0, 0, 0, 0.3);
background: -moz-linear-gradient(top, #ccc, #fff);
background: -webkit-linear-gradient(top, #ccc, #fff);
background: -ms-linear-gradient(top, #ccc, #fff);
background: -o-linear-gradient(top, #ccc, #fff);
padding: 50px; 
margin: 20px;
width: 200px;
}


@media screen and (max-width: 999px) {
  body {
  background-image: url("/_grafiken/startseite_bg_mobil.jpg");
  background-size:cover; 
  background-attachment:fixed;
  }

  div#Position {
  position : absolute;
  top: 5%;
  width : 100%;
  height: 100%; 
  margin: auto; 
  }

  div#Button_Index_Body {
  display: flex;
  flex-direction: column;
  min-height:530px;
  width: 100%;
  text-align: center;
  }

  .Button_links {
  width: 100%;
  }  
  
  div#Button_rechts {
  width: 97%;
  padding: 1%;
  z-index:2;
  }


  div#Impressum {
  display: flex;
  flex-direction: column;
  width : 100%;
  color: #fff;
  background-color: #838383;
  padding-top:5px;
  }


  a.footer:link, a.footer:visited, a.footer:active, a.footer:hover {
  font-size : 17px;
  line-height : 20px;
  font-family : Verdana, Helvetica, Arial, sans-serif;
  text-decoration : none;
  font-weight : normal;
  color : #fff;
  }
  
  a.footer:hover {
  color : #aaa;
  }  
}



@media screen and (min-width: 1000px) {
  body {
  background-image: url("/_grafiken/startseite_bg.jpg");
  background-size:cover; 
  background-attachment:fixed;
  }

  div#Position {
  position : absolute;
  top: 10%;
  width : 100%;
  height: 90%; 
  margin: auto; 
  }

  
  div#Button_Index_Body {
  display: flex;
  flex-direction: row;
  text-align: center;
  z-index:2;
  }

  div#Button_links {
  width: 50%;
  text-align: right;
  padding: 20px;
  }

  div#Button_rechts {
  width: 50%;
  padding: 20px;
  text-align: left;
  z-index:2;
  }
   
  div#Impressum {
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: 1280px;
  color: #fff;
  background-color: #838383;
  padding-top:5px;
  }

  
  a.footer:link, a.footer:visited, a.footer:active, a.footer:hover {
  font-size : 12px;
  line-height : 14px;
  font-family : Verdana, Helvetica, Arial, sans-serif;
  text-decoration : none;
  font-weight : normal;
  color : #fff;
  }
  
  a.footer:hover {
  color : #aaa;
  }   
}