html {

}

body{
  width:980px;
  margin:0 auto;

}

#impressum {
  margin-top: 100px;
  width:900px;
  margin:0 auto;
  margin-top:60px;
}

header{
  position: relative;
  background-image: url("imgfooter/headerbild.jpg");
  height: 663px;
  background-size: cover;
  background-repeat: no-repeat;
}




#logo{
  width:80px;
  padding-top: 16px;
  margin-left:40px;
}
#headerbild {
  width:980px;
}

p{
  font-family: arial;
  word-spacing: 4px;
  letter-spacing: 0.6px;
  font-size: 16px;
line-height: 20px;
}
#textaboutme {
  position: absolute;
left: 387px;
top: 280px;
width: 553px;
text-align: justify;

}

h6 {
  font-family: arial;
  font-size: 10px;
font-weight: normal;
}
#text_impressum{
  columns: 3;
  text-align: justify;
}
h4{
  position: absolute;
  top: 482px;
  font-size: 29px;
  font-family: arial;
  color: rgb(215, 204, 164);
  margin: 0;
  margin-left: 40px;
}
h5{
  width:270px;
  position: absolute;
  top: 190px;
  font-size: 44px;
  font-family: arial;
color: rgb(52, 52, 52);
  margin: 0;
  margin-left: 40px;

}
h1{
  position: absolute;
  top: 188px;
  font-size: 100px;
  font-family: arial;
  color:white;
  margin:0;
margin-left: 40px;
}
#linie {
  position: absolute;
  bottom:4px;
  left:0;
width: 346px;
  border-right:2px solid rgb(233, 225, 147);
  z-index: 2;
  height: 340px;
}

#linie2 {
  position: absolute;
  top:0;
  left:0;
width: 346px;
border-right:2px solid rgb(233, 225, 147);

  z-index: 2;
  height: 663px;
}
a {
  text-decoration: none;
color: rgb(143, 143, 143);
  font-weight: bold;
  font-family: arial;

}
#backbutton {
border:2px solid rgb(233, 225, 147);
  padding: 4px 28px 5px 28px;
  border-radius: 5px;
  font-size: 28px;

  float: right;
  margin: 14px 40px 14px 0px;
}



h2 {
  font-size: 14px;

}

nav {
  height:72px;
  margin:0px 0px 0px 0px;
}

.impressumtext {
  columns: 2;
}


#aboutme{
  margin-top: -4px;
  position: relative;
  height: 663px;

  width:980px;
  position: relative;
}








#overflow{
position: relative;
}

#special {
border-top-left-radius: 80px 80px;

height: 663px;
width: 980px;
background-image: url("imgfooter/tafel2.jpg");
background-size: cover;
background-repeat: no-repeat;
position: relative;
}

#placeholder_img {
display: none;
position: absolute;
left: 386px;
top: 367px;
width: 543px;
border-radius: 36px;
box-shadow: rgba(0, 0, 0, 0.24) 4px -5px 9px;
-moz-box-shadow: 4px -5px 9px rgba(0, 0, 0, 0.24);
-webkit-box-shadow: 4px -5px 9px rgba(0, 0, 0, 0.24);
z-index: 2;
border: 6px solid white;
}

#special_left {
  position: absolute;
  left:0;
  height: 663px;
width: 35.3%;

  display: flex;
  align-items: baseline;
  flex-direction: column;
  justify-content: center;


}
#special_right {
position: absolute;
  width: 64.7;
  left:35.3%;
}
#special_border{
  position: absolute;
height: 663px;
width: 346px;
border-right:2px solid rgb(233, 225, 147);
left: 0;
top:0;
}

#p_special{
color:white;
text-align: justify;
hyphens: auto;
-webkit-hyphens: auto;
padding: 26px 40px 0px 40px;
}

.textspecial{
  font-size: 26px;
  font-weight: bold;
color: rgb(242, 242, 242);
letter-spacing: normal;
}
.textspecial:hover {

  letter-spacing: 1.2px;
}

.specials {
  border-bottom: 2px solid rgb(233, 225, 147);
  padding-right: 40px;
  margin-left: 40px;
  width: 266px;
}

.specials:first-child{
margin-top: -72px;
}
.specials:last-child{
border:none;
}

#untertitel{
  position: absolute;
  /* color: rgb(57, 57, 57); */
  color:white;
  font-size: 12px;

  left: 40px;
  top: 601px;
  width: 269px;

}

#nextbutton {
  display: block;
  border:2px solid rgb(233, 225, 147);
  padding: 10px 28px 11px 28px;
  border-radius: 5px;
  font-size: 28px;
  position: absolute;
  top: 472px;
left: 272px;
  color:white;
  font-weight: bold;
  background-color: rgba(0, 0, 0, 0.16);
  z-index: 10;
}
#nextbutton:hover {
    background-color: rgba(0, 0, 0, 0.02);
}

/* #overflow_border1{
height: 54px;
width: 20px;
margin-left: 346px;
border-left: 2px solid rgb(233, 225, 147);
} */










/* **school** */
#school{
 /* border-right: 2px solid rgb(233, 225, 147); */
 width: 980px;
 height:300px;
}


/* **FAQ** */
#faq{
position: relative;
}

#question_container{
  width: 940px;
  margin: 0 auto;
  padding-right: 40px;
}
/* .question {
padding: 20px 0px 0px 40px;
margin-left: 346px;
  border-left: 2px solid rgb(233, 225, 147);
} */

.question {
margin-left: 40px;
padding: 10px 0px 10px 0px;/* border-bottom: 1px solid rgba(0, 0, 0, 0.11); */

background-color: white;
border-bottom: 1px solid rgba(210, 210, 210, 0.34);
}

.question:first-child{
padding-top: 40px;
}

/* .question:last-child{
padding-bottom: 40px;
} */

.faqplus{
  display: inline-block;
  padding-right: 20px;
  color: rgb(103, 182, 186);
  font-size: 36px;
  vertical-align: middle;
  margin: 0;
  width: 20px;
}
.faqfrage{
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  font-weight: bold;
}

.antwort{
max-width: 630px;
display: none;
margin-right: 40px;
margin-bottom:0;
padding: 10px 0px 10px 44px;
font-size: 14px;
letter-spacing: 0px;
-webkit-hyphens: auto;
}

/* #faq_border3{
position: absolute;
top: 280px;
border-left: 2px solid rgb(233, 225, 147);
height: 142px;
width:100px;
margin-left: 346px;
z-index: -1;
} */

#gotop{
  position: absolute;
  display: inline-block;
  border: 2px solid rgb(233, 225, 147);
  padding: 27px 13px 28px 13px;
  border-radius: 5px;
  font-size: 28px;
  color: rgb(143, 143, 143);
  font-weight: bold;
  z-index: 10;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
  top: -44px;
  right: 60px;
  margin-left: 0px;
  margin-top: 0px;
}


.active {
background-color: red;
}

#titel_faq{
margin-left: 40px;
top: 30px;
display: none;
}

#titel2_faq{
position: inherit;
display: inline-block;
top: -30px;
font-size: 45px;
margin-top: 0;
margin-left: 40px;
text-align: left;
left:0;
}

.bigger{

}

/* footer */

footer{
width: 986px;
  position: absolute;
  /* top: 2800px; */
  top: 2965px;
}

#bottom {
width: 80%;
position: fixed;
bottom: 0;
left:10%;
}


ul {
  display: table;
  margin-right: auto;
  margin-left: auto;
padding: 18px;
  margin-top:0;
  margin-bottom: 0;


}

.footerliste {
  display: inline;
  text-align: center;
  color:grey;
  float: left;
  opacity: 0.7;
  padding:5px;
}

.footertext {
  font-family: verdana;
  font-weight: 20;
  font-size: 12px;
  text-decoration: none;
  color:grey;
}

.footertextbegrenzung {
  border-left: 2px solid rgb(204 204 204);
  border-right: 2px solid rgb(204 204 204);
  padding-left: 5px;
  padding-right: 5px;
}


/* footer */









/* mediescreen */
@media only screen and (max-width: 980px) {
body, footer{
width: 100%;
  }
#impressum {
padding: 40px;
width:unset;
}

#textaboutme{
top: 179px;
width: 336px;
}

#school {
display: block;
height: 246px;
}
#question_container{
  width: 100%;
}

#special_right{
left: 347px;
width: 406px;
}


.question{
margin-right: 40px;
}

.antwort{
font-size:1.4vw;
}

.faqfrage{
font-size: 1.8vw;
word-spacing: 1px;
letter-spacing: 0.2px;
}

#aboutme, #special {
width:100%;
}

#overflow{
overflow: hidden;
width: 100%;
height: 717px;
}

}

@media only screen and (max-width: 762px) {
body {
width: 100%;
}
footer {
top: 2965px;
}
#school {
display: block;
height: 93px;
}
.faqplus{
font-size: 5vw;
width: 10px;
}
.faqfrage{
  font-size: 2vw;
  word-spacing: 0;
  letter-spacing: 0;
}
#titel_faq{
top: -170px;
text-align: left;
font-size: 12px;
margin-left: 84px;
}
#overflow_border1{
display: none;
}
#special_border{
width: 294px;
}
#placeholder_img{
left: 337px;
top: 506px;
}
#special_right{
width: unset;
left: 294px;
}
.specials:first-child{
  margin-top: -177px;
}
.specials {
width: 215px;
}
.textspecial{
font-size: 20px;
}
#untertitel{
width: 225px;
}
#nextbutton {
  left: 220px;
  top: 334px;
}

h5 {
    margin-left:15%;
    display: block;
    text-align: center;
    width:70%;
      position: unset;
      padding-top: 100px;
}
h4 {
    padding-top:20px;
    margin-left:15%;
    display: block;
    text-align: center;
    width:70%;
    position: unset;
}
#textaboutme{
    margin-top:70px;
      margin-left:15%;
      display: block;
      text-align: center;
      width:70%;
position: unset;
}
#linie2, #linie, #faq_border3, #titel_faq {
display: none;
}

#overflow{
height:950px;
}

#overflow_border1{
margin-left: 294px;
height: 187px;
}

#faq_border1{
margin-top: -100px;
width: 94px;
}

.antwort{
font-size:2vw;
padding: 10px 0px 10px 34px;
}

#gotop{
top:-25px;
}
}


@media only screen and (max-width: 576px) {

#special_right{
left: 0px;
top: 505px;
background-color: rgba(255, 255, 255, 1);
margin-left: 40px;
border-top-left-radius: 38px;
}
#p_special{
color:black;
padding: 20px 30px 0px 30px;
}
#untertitel{
top: 436px;
}
#placeholder_img{
  left: 40px;
}
.antwort{
word-spacing: 0;
font-size: 2.4vw;
}
.faqfrage{
font-size: 2.8vw;
}
.bigger {
font-size: 6.8vw;
}
}



@media only screen and (max-width: 480px) {
h5 {
font-size: 10vw;
}
h4 {
font-size: 7vw;
}
#textaboutme{
font-size: 3vw;
}
  #p_special{
font-size: 3vw;
}
.bigger2 {
font-size: 9vw;
}
}

@media only screen and (max-width: 340px) {
.faqplus{
padding-right:2px;
}
.faqfrage {
padding: 10px 0px 10px 6px;
}
}

@media only screen and (max-width: 280px) {

.faqfrage{
font-weight: normal;
}
}