body
{
    abackground-image: url("../img/bg.jpg");
    abackground-repeat: no-repeat, repeat;
    abackground-size: cover;
    background-color: #6c6c85;
    margin: 0px;
    font-family: "Playfair Display";
 
  background: url("../img/bg.jpg") no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

a
{
    text-decoration: none;
    color: #ffffff;
}
#divYellowstrip
{
    position: relative;
    abackground-color: #6c6c85;
    margin-top: 5em;
    height: 7em;
    width: auto;
}
#ulYellowstrip
{
    margin-left: 20em;
    width: auto;
    height: 100%;
    list-style-type: none;
    margin-right: 0;
    margin-bottom: 0;
    margin-top: 0;
    padding: 5;
    overflow: auto;
}
.liNavbarpoint
{
    font-family: "Playfair Display";
    font-size: 1.3em;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    border-radius: 10%;
    float: left;
}
.aNavbarpoint
{
    display: block;
    text-align: center;
    text-decoration: none;
    padding-top: 0.15em;
    padding-bottom: 0.15em;
    padding-left: 1em;
    padding-right: 1em;
    margin-top: 1.15em;
    margin-bottom: 0.4em;
    color: #ffffff;
}
.aNavbarpoint:hover
{
    background-color: silver;
    color: #6c6c85;
    padding-top: 0.15em;
    padding-bottom: 0.15em;
    padding-left: 1em;
    padding-right: 1em;
    margin-top: 1.15em;
    margin-bottom: 0.4em;
    border-radius: 5%;
}
.aNavbarpoint:active
{
    background-color: #294ba0;
    color: #ffffff;
    padding-top: 0.15em;
    padding-bottom: 0.15em;
    padding-left: 1em;
    padding-right: 1em;
    margin-top: 1.15em;
    margin-bottom: 0.4em;
    border-radius: 5%;
}

.divNavbarbutton
{
    display: inline-block;
    cursor: pointer;
}
.bar1, .bar2, .bar3
{
    width: 35px;
    height: 5px;
    background-color: #000000;
    margin: 6px 0;
    transition: 0.4s;
}
/* Rotate first bar */
.change .bar1
{
    -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
    transform: rotate(-45deg) translate(-9px, 6px) ;
}
/* Fade out the second bar */
.change .bar2
{
    opacity: 0;
}
/* Rotate last bar */
.change .bar3
{
    -webkit-transform: rotate(45deg) translate(-8px, -8px) ;
    transform: rotate(45deg) translate(-8px, -8px) ;
}
#liNavbarbutton
{
    float: left;
    margin-top: 0.25em;
    margin-left: 1em;
}
#liNavbarbutton p
{
    float: left;
    font-size: 1.75em;
    font-family: "Playfair Display";
    color: #FFFFFF;
    padding-right: 0.5em;
    margin: 0px;
    margin-top: 0.15em;
}
#begruessung
{
    font-size: 3em;
    text-align: center;
    color: #FFFFFF;
    font-family: "Playfair Display";
    margin-top: 2em;

}
#singonline
{
    font-size: 3.5em;
    text-align: center;
    color: #294ba0;
    font-family: "Caveat";
    margin-top: 2em;

}
#textstartseite
{
    text-align: center;
    font-size: 2em;
    color: #FFFFFF;
    font-family: "Caveat";

}
#textimpressum
{

    text-align: center;
    font-size: 1em;
    color: #FFFFFF;
    font-family: "Playfair Display";
}
#textvita
{

    text-align: center;
    font-size: 1.25em;
    color: #FFFFFF;
    font-family: "Playfair Display";
}
#textpreise
{

    text-align: left;
    font-size: 1em;
    color: #FFFFFF;
    font-family: "Playfair Display";
}
#erfahren
{
    font-family: "Caveat";
    font-size: 4em;
    text-align: center;
    color: #294ba0;
}
#headlineContactForm
{
  font-family: "Playfair Display";
  font-size: 6em;
  text-align: center;
  color: #d9a828;
}
#message
{
    width: 200%;
    resize: none;
    padding: 0px;
    border: 1px;
    height: 15em;
    background-color: #d9a828;
    color: #6c6c85;
    font-size: 2em;
}
#tdLabelMessage
{
    vertical-align: top;
}
input
{
  border: 1px;
  background-color: silver;
  color: #000000;
  font-size: 1.15em;
  font-family: "Playfair Display";
}
textarea
{
  border: 1px;
  background-color: silver;
  color: #000000;
  font-size: 1.15em;
  font-family: "Playfair Display";
}
li
{
  color: #ffffff;
  font-size: 1.2em;
  font-family: "Playfair Display";
}
.tableForm label
{
    color: #6c6c85;
    font-family: "Playfair Display";
    font-size: 4em;
}
form td
{
    color: #ffffff;
    font-family: "Playfair Display";
    font-size: 1.15em;
    padding: 5px;
}
#issue
{
  background-color: #d9a828;
  color: #334454;
  font-size: 2em;
  font-family: "Playfair Display";
  border-color: #d9a828;

}
button
{
    color: #d9a828;
    background-color: #000000;
    border-color: #d9a828;
    font-size: 2em;
    margin-top: 1em;
    margin-bottom: 3em;
    font-family: "Playfair Display";
}
#divForm
{
  margin-left: 5%;
}

.headline
{
    font-family: "Playfair Display";
    font-size: 2.3em;
    padding-left: 40px;
    padding-top: 30px;
    margin: 0px;
}


.h4News
{
    margin: 0px;
    color: #d9a828;
    padding-left: 0.5em;
}

footer
{
    color: #ffffff;
    margin-top: 2em;
}
#divHistory
{
    padding-top: 1em;
    padding-left: 40px;
}

#pImpressum
{
    font-family: "Playfair Display";
    text-align: center;
    color: #d9a828;
    margin-bottom: 0px;
}
#pcopyrights
{
    font-family: "Playfair Display";
    text-align: center;
    margin-top: 0.5em;
    margin-bottom: 0px;
    padding-bottom: 1em;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #6c6c85;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
    border-right: 1em;
}
.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    font-family: "Playfair Display";
    color: #ffffff;
    display: block;
    transition: 0.4s;
}

.sidenav a:hover {
    color: #111518;
}
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
    font-family: "Lato", sans-serif;
}
#ulSidebarSocialMediaSymbols
{
  padding-left: 0px;
  list-style-type: none;
}

@media (max-width: 1800px)
{
  #divYellowstrip
  {
      margin-top: 2.5em;
      height: 4em;
  }
 
  #ulYellowstrip
  {
      margin-left: 0em;
  }
  .liNavbarpoint
  {
      font-size: 1.5em;
  }
  .aNavbarpoint
  {
      margin-top: 0.6em;
      margin-bottom: 0.6em;
      margin-left: 0.6em;
      margin-right: 0.6em;
      padding: 0.4em;
  }
  .aNavbarpoint:hover
  {
    margin-top: 0.6em;
    margin-bottom: 0.6em;
    margin-left: 0.6em;
    margin-right: 0.6em;
    padding: 0.4em;
  }
  .aNavbarpoint:active
  {
    margin-top: 0.6em;
    margin-bottom: 0.6em;
    margin-left: 0.6em;
    margin-right: 0.6em;
    padding: 0.4em;
  }

}
  
@media (max-width: 1400px)
{
  #divYellowstrip
  {
      margin-top: 2.5em;
      height: 4em;
  }
 
  #ulYellowstrip
  {
      margin-left: 0em;
  }
  .liNavbarpoint
  {
      font-size: 0.75em;
  }
  .aNavbarpoint
  {
      margin-top: 0.6em;
      margin-bottom: 0.6em;
      margin-left: 0.6em;
      margin-right: 0.6em;
      padding: 0.4em;
  }
  .aNavbarpoint:hover
  {
    margin-top: 0.6em;
    margin-bottom: 0.6em;
    margin-left: 0.6em;
    margin-right: 0.6em;
    padding: 0.4em;
  }
  .aNavbarpoint:active
  {
    margin-top: 0.6em;
    margin-bottom: 0.6em;
    margin-left: 0.6em;
    margin-right: 0.6em;
    padding: 0.4em;
  }

}
@media (max-width: 700px)
{
  #liErfahrungsberichte
  {
      display: none;
  }
  #liKontaktformular
  {
      display: none;
  }
    #liPreise
  {
      display: none;
  }
    #liUnterricht
  {
      display: none;
  }
  #liVita
  {
      display: none;
  }
  #liImpressionen
  {
      display: none;
  }
  #lisingonline
  {
      display: none;
  }
  #liHome
  {
      display: none;
  }
  .sidenav .closebtn
  {
      display: none;
  }
}
@media (min-width: 700px)
{
    #liNavbarbutton
    {
        display: none;
    }
}

@media (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
