html {
    font-family: 'Times New Roman', Times, serif;
    overflow-x: hidden;
    text-decoration: none;  
    scroll-behavior: smooth;
}

h2{
    font-size: 3cap;
    letter-spacing:  0.01cap;
}
h3{
    font-size: 1.5cap;
    letter-spacing:  0.1cap;
}
h4{
    font-style: italic;
    font-size: 1.8cap;
}

body{
    padding: 0;
    margin: 0;
}

/* Banner fix oben */
.section-1{   
    position: absolute;
    z-index: 2;
    font-style: normal;
    font-size: 0.8vw;
    letter-spacing: 2px;
    width: 100%;
    margin-top: 75px;
    height: 6%;
    background-color: white;
    color: #0D0908;
    text-align: center;
    align-items: center;
    border-bottom: 1px solid #0D0908;
}
/* Navbar fix oben */
.section-navbar{
    z-index: 10;
    position: fixed;
    width: 100%;
    height: 60px;
    padding-top: 15px;
    padding-bottom: 0px;
    align-items: center;
    background-color: #44475F;
    border-bottom: 1px solid #0D0908;

}

.section-footer {
    padding: 2%;
    height: 60px;
    align-items: center;
    background-color: #1E1E34;
    color: white;
    border-top: 1px solid white;
}
.section-footer ul {
    display: flex;
    justify-content: center; 
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.section-footer ul li a{
    padding: 5%;
    display: flex;
    position: relative;
    align-items: center;
    text-decoration: none;
    color: white;
    font-size: 18px;
    letter-spacing:  0.01cap;
    border-right: 1px solid white;
    border-left: 1px solid white;
    border-top: 1px solid #1E1E34;
    border-bottom: 1px solid #1E1E34;
    border-radius: 0px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.section-footer ul li{
    display: flex;
    margin: 0 10vw; 
    list-style: none;
}

ul
{
margin: 0%;
margin: 0%;
padding: 0;
display: flex;
}

.section-navbar ul li
{
margin-left: 15%;
list-style: none;
}

.section-navbar ul li a
{
display: block;
position: relative;
text-decoration: none;
color: white;
font-size: 18px;
letter-spacing:  0.01cap;
border: 1px solid white;
border-radius: 30px;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 10px;
padding-left: 10px;

}

/* index */
.small-screen {
    display: none;
}
.section-2 {
    padding-top: 10%;
    width: 100%;
    color: #0D0908;
    text-align: center;
    background-color: #D7BCAD;

}

.section-3 {
    font-size: 2vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 18vw;
    padding-top: 5%;
    background-color: #44475F;
    text-align: justify;
    color: white;
}

.section-4{
    font-style: italic;
    font-size: 2.2vw;
    height: 6vw;
    padding: 10%;
    padding-top: 3%;
    background-color: #1E1E34;
    color: white;
    text-align: center;
    align-items: center;
}

.break {
    display: block;
}

.section-5 {
    font-size: 2.3vw;
    height: 140vw;
    background-color: #D7BCAD;
}

.section-5 video, .section-5 p, .section-5 h2 {  
    margin-top: 0;
    margin-left: 20%;
}

.section-6{
    font-size: 1.5vw;
    width: 80%;
    height: 90vw;
    padding: 10%;
    padding-top: 5%;
    background-color: #44475F;
    color: white;
    text-align: justify;
    align-items: center;
    line-height: 2.5cap;
}

.section-2-service {
    font-size: 2vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 100%;
    padding-top: 10%;
    background-color: #44475F;
    text-align: justify;
    color: white;
}

.section-2-service img {
    padding-left: 20%;
}


.section-2-ueber-uns {
    font-size: 2vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 45vw;
    padding-top: 10%;
    background-color: #D7BCAD;
    text-align: justify;
    color: #0D0908;
}

.section-2-kontakt {
    font-size: 2vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 20%;
    height: 35vw;
    padding-top: 15%;
    background-color: #D7BCAD;
    color: #0D0908;
}


input[type=text]{
    width: 100%;
    padding: 12px;
    border: 1px solid black;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
    font-family: Verdana, Arial, Calibri;
}
  
input[type=email], select, email, text, textarea{
    width: 100%;
    padding: 12px;
    border: 1px solid black;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
    font-family: Verdana, Arial, Calibri;
}
  
.label {
    padding: 12px 12px 12px 0;
    display: inline-block;
}
  
input[type=submit] {
    background-color: #04AA6D;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    float: right;
}
  
.col-1 {
    float: left;
    width: 30%;
    margin-top: 6px;
    margin-bottom: 6px;
}
  
.col-2 {
    float: left;
    width: 70%;
    margin-top: 6px;
}

.col-check-1 {
    float: left;
    width: 10%;
    margin-top: 6px;
}
  
.col-check-2 {
    float: right;
    width: 90%;
    margin-top: 6px;
    font-size: 25px;
}
.row:after {
    content: "";
    display: table;
    clear: both;
}  
  
#status{
  width: 90%;
  max-width: 400px;
  text-align: center;
  padding: 10px;
  margin: 0 auto;
  border-radius: 8px;
}
  
#status.success{
  background-color: lightgreen;
  animation: stauts 4s ease forwards;
}
  
#status.error{
  background-color: lightred;
  color: white;
  animation: stauts 4s ease forwards;
}
  
.section-2-impressum {
    font-size: 1vw;
    font-family: sans-serif;
    height: 35vw;
    padding: 10%;
    background-color: #44475F;
    text-align: justify;
    color: white;
    text-decoration: none;
    line-height: 2vw;
}

.section-2-impressum h1 {
    font-size: 3vw;
}
.section-2-impressum h2 {
    font-size: 2vw;
}
.section-2-impressum, .section-2-impressum a:visited, .section-2-impressum a:hover, .section-2-impressum a:active {
    color: white; 
    text-decoration: none; 
}



.section-2-datenschutz {
    font-size: 1vw;
    font-family: sans-serif;
    height: 420vw;
    padding: 10%;
    background-color: #44475F;
    text-align: justify;
    color: white;
    text-decoration: none;
    line-height: 2vw;
}

.section-2-datenschutz h1 {
    font-size: 3vw;
}
.section-2-datenschutz h2 {
    font-size: 2vw;
}
.section-2-datenschutz, .section-2-datenschutz a:visited, .section-2-datenschutz a:hover, .section-2-datenschutz a:active {
    color: white; 
    text-decoration: none; 
}
  @keyframes status{
      0%{
      opacity: 1; 
      pointer-events: all;
      }
      
      90%{
      opacity: 1; 
      pointer-events: all;
      }
      
      100%{
      opacity: 0; 
      pointer-events: none;
      }
  }



@media (max-width: 700px) {
    .small-screen {
        display: block;
    }
/* Banner fix oben */
.section-1{   
    position: absolute;
    z-index: 2;
    font-style: italic;
    font-size: 2vw;
    letter-spacing: 2px;
    width: 100%;
    margin-top: 12vw;
    height: 15vw;
    background-color: white;
    color: #0D0908;
    text-align: center;
    align-items: center;
    border-bottom: 1px solid #0D0908;
}
/* Navbar fix oben */
.section-navbar{
    z-index: 10;
    position: fixed;
    width: 100%;
    height: 10vw;
    padding-top: 10px;
    padding-bottom: 0px;
    align-items: center;
    background-color: #44475F;
    border-bottom: 1px solid #0D0908;

}

.section-footer {
    padding: 2%;
    height: 12vw;
    align-items: center;
    background-color: #1E1E34;
    color: white;
    border-top: 1px solid white;
}
.section-footer ul {
    display: flex;
    justify-content: center; 
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.section-footer ul li a{
    padding: 5%;
    display: flex;
    position: relative;
    align-items: center;
    text-decoration: none;
    color: white;
    font-size: 15px;
    letter-spacing:  0.01cap;
    border-right: 1px solid #1E1E34;
    border-left: 1px solid #1E1E34;
    border-top: 1px solid #1E1E34;
    border-bottom: 1px solid #1E1E34;
    border-radius: 0px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.section-footer ul li{
    display: flex;
    margin: 0 4vw; 
    list-style: none;
}

ul
{
margin: 0%;
margin: 0%;
padding: 0;
display: flex;
}

.section-navbar ul li
{
margin-left: 7vw;
list-style: none;
}

.section-navbar ul li a
{
display: flex;
position: relative;
text-decoration: none;
color: white;
font-size: 3.5vw;
letter-spacing:  0.01cap;
border: 1px solid white;
border-radius: 30px;
padding-top: 5px;
padding-bottom: 5px;
}

/* index */

.section-2 {
    padding-top: 30vw;
    width: 100%;
    color: #0D0908;
    text-align: center;
    background-color: #D7BCAD;

}

.section-3 {
    font-size: 4vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 80vw;
    padding-top: 5%;
    background-color: #44475F;
    text-align: justify;
    color: white;
}

.section-4{
    font-style: italic;
    font-size: 4.5vw;
    height: 40vw;
    padding: 10%;
    padding-top: 5%;
    background-color: #1E1E34;
    color: white;
    text-align: center;
    align-items: center;
}

.break {
    display: block;
}

.section-5 {
    font-size: 4vw;
    height: 180vw;
    background-color: #D7BCAD;
}

.section-5 video, .section-5 p, .section-5 h2 {  
    margin-top: 0;
    margin-left: 20%;
}

.section-6{
    font-size: 4.5vw;
    width: 80%;
    height: 270vw;
    padding: 10%;
    padding-top: 5%;
    background-color: #44475F;
    color: white;
    text-align: justify;
    align-items: center;
    line-height: 2.5cap;
}

.section-2-service {
    font-size: 4vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 100%;
    padding-top: 30vw;
    background-color: #44475F;
    text-align: justify;
    color: white;
}

.section-2-ueber-uns {
    font-size: 4vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 185vw;
    padding-top: 30vw;
    background-color: #D7BCAD;
    text-align: justify;
    color: #0D0908;
}

.section-2-kontakt {
    font-size: 4.5vw;
    font-family: sans-serif;
    line-height: 3cap;
    padding: 10%;
    height: 100%;
    padding-top: 30vw;
    background-color: #D7BCAD;
    color: #0D0908;
}

.section-2-datenschutz {
    font-size: 4vw;
    font-family: sans-serif;
    height: 100%;
    padding: 10%;
    padding-top: 30vw;
    background-color: #44475F;
    text-align: justify;
    color: white;
    text-decoration: none;
    line-height: normal;
}

.section-2-datenschutz h1 {
    font-size: 5vw;
}
.section-2-datenschutz h2 {
    font-size: 4vw;
}
.section-2-datenschutz, .section-2-datenschutz a:visited, .section-2-datenschutz a:hover, .section-2-datenschutz a:active {
    color: white; 
    text-decoration: none; 
}




input[type=text]{
    width: 100%;
    padding: 12px;
    border: 1px solid black;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
    font-family: Verdana, Arial, Calibri;
}
  
input[type=email], select, email, text, textarea{
    width: 100%;
    padding: 12px;
    border: 1px solid black;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
    font-family: Verdana, Arial, Calibri;
}
  
.label {
    padding: 12px 12px 12px 0;
    display: inline-block;
}
  
input[type=submit] {
    background-color: #04AA6D;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    float: right;
    width: 100%;
}
  
.col-1 {
    float: left;
    width: 100%;
    margin-top: 0px;
    margin-bottom: 6px;
}
  
.col-2 {
    float: left;
    width: 100%;
    margin-top: 0px;
}

.col-check-1 {
    float: left;
    width: 20%;
    margin-top: 6px;
}
  
.col-check-2 {
    float: right;
    width: 80%;
    margin-top: 2px;
    margin-bottom: 4px;
    font-size: 15px;
    line-height: 25px;
}
  
.row:after {
    content: "";
    display: table;
    clear: both;
}  
  
#status{
  width: 90%;
  max-width: 500px;
  text-align: center;
  padding: 10px;
  margin: 0 auto;
  border-radius: 8px;
}
  
#status.success{
  background-color: lightgreen;
  animation: stauts 4s ease forwards;
}
  
#status.error{
  background-color: lightred;
  color: white;
  animation: stauts 4s ease forwards;
}
  
.section-2-impressum {
    font-size: 5vw;
    font-family: normal;
    height: 185vw;
    padding: 10%;
    background-color: #44475F;
    text-align: justify;
    color: white;
    padding-top: 25vw;
    line-height: normal;
}
.section-2-impressum h1 {
    font-size: 10vw;
}
.section-2-impressum h2 {
    font-size: 2vw;
}
.section-2-impressum, .section-2-impressum a:visited, .section-2-impressum a:hover, .section-2-impressum a:active {
    color: white; 
    text-decoration: none; 
}



  @keyframes status{
      0%{
      opacity: 1; 
      pointer-events: all;
      }
      
      90%{
      opacity: 1; 
      pointer-events: all;
      }
      
      100%{
      opacity: 0; 
      pointer-events: none;
      }
  }
}




.section-2 img {
    animation: schweben 5s ease-in-out infinite; /* 3s ist die Dauer der Animation */
    margin: 0;
    padding: 0;
    border: 0;
}

@keyframes schweben {
    0% { transform: translateY(-5px); } /* Startposition oben */
    50% { transform: translateY(5px); } /* Höchste Position unten */
    100% { transform: translateY(-5px); } /* Zurück zur Startposition */
}
