body{background-color:white;}
h1,h4,p,u1,p.big{color:black}
h1{
    padding-top:60px;
    letter-spacing: 5px;
    margin-bottom:10px;
    font-size: clamp(80px, 6vw, 400px);
    padding-left: 2%;
    font-family: "helvetica", sans-serif;
    line-height: 0.8;
    max-width: 35em;
    display: block;
}

h2{
    font-size: clamp(40px, 3vw, 200px);
    font-family: "Helvetica",sans-serif;
    color: rgb(205,23,25);
    line-height: 1.8;
    letter-spacing: 5px;
    padding-top: 120px;
    padding-left: 3.33%;
    padding-right: 2%;
    max-width: 35em;
    display: block;
}

h3{
  font-size: clamp(35px, 1.5vw, 110px);
  font-family: "Helvetica",sans-serif;
  color: rgba(205,23,25,0.8);
  line-height: 1.8;
  letter-spacing: 1px;
  padding-top:0px;
  padding-left: 0%;
  padding-right: 2%;
  max-width: 35em;
  display: block;
}

h4{
    font-size: clamp(10px, 2vw, 25px);
    font-family: "helvetica",sans-serif;
    letter-spacing: 2px;
    font-weight: normal;
   margin-top: 13px;
   margin-bottom: 22px;
    display: block;
}

h5{
  font-size: clamp(30px, 1vw, 80px);
  font-family: "helvetica",sans-serif;
  letter-spacing: 2px;
  font-weight: normal;
 margin-top: 5px;
 margin-bottom: 5px;
  display: block;
}

p.big{
    font-size: clamp(40px, 2.4vw, 180px);
    font-family:"garamond";
    line-height: 1.6;
    padding-left: 2%;
    text-align: left;

}

p{
    font-size: clamp(30px, 1.2vw, 100px);
    font-family:"garamond";
    line-height: 1.6;
    text-align: left;

}

p.italic{
  font-size: clamp(30px, 1.2vw, 100px);
  font-family: "garamond",serif;
  font-style: italic;
  line-height: 1.2;
  text-align: left;

}

p.unter{
  font-size: clamp(20px, 1vw, 100px);
  font-family: "garamond",serif;
  font-style: italic;
  line-height: 1.2;
  text-align: right;
  padding-top: 20px;

}

u1{
    margin-top: 20px;
    font-size: clamp(20px, 1.2vw, 100px);
    font-family:'Courier New', Courier, monospace;
    padding-left: 2%;
    line-height: 0.8;
    display: block;
}


  /* Style the top navigation bar */
  .topnav {
    overflow: hidden;
  }
  
  /* Style the topnav links */
  .topnav a {
    float: left;
    display: block;
    color: black;
    text-align: center;
    font-family: "garamond", serif;
    width: 11.75%;
    text-decoration: none;
  }
  
  /* Change color on hover */
  .topnav a:hover {
    background-color: rgba(250,250,250,0.5);
    color: black;
  }
  .dropbtn {
    background-color: rgb(222,102,103);
    color: black;
    padding: 16px;
    font-size: 50px;
    border: none;
  }
  
  .dropdown {
    position: relative;
    display: inline-block;
  }
  
  .dropdown-content {
    display: none;
    position: relative;
    background-image:  linear-gradient( to right, rgb(222,102,103) 0%, rgb(222,102,103) 50%, rgba(222,102,103,0)100%);
    min-width: 160px;
    z-index: 1;
  }
  
  .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
  }

  .dropdown-content a:hover {
    background-color:  rgba(250,250,250,0.5)
  }

  .show {display: block;}

.dropdown:hover .dropbtn {
  background-color: rgba(250,250,250,0.5)
}

  div.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: -0.1;
    z-index:10;

  }

@media screen and (max-width: 1024px) {
    .topnav a{
        display: none !important;
    }
    
}
@media screen and (min-width: 1024px) {
  .dropbtn{
      display: none !important;
  }
  

}

.column{
    float:left;
}

.column.left{
    width: 50%;
    float:left;
    margin-right: 3.33%;
    margin-left:3.33%;    
}

.column.right{
    float:right;
    width:38.01%;
    margin-right: 3.33%;
    margin-left:2%;    
}

@media screen and (max-width:1000px) {
    .column.left, .column.right {
      width: 90%;
    }
    .column.right{
        padding-top: 10%;
    
    }
}
.img {
    float:right;
    padding: 10%;
    padding-top: 28px;
    margin-top: 10px;
    
}

.atlasimg {
    padding-top: 100px;
    display:inline-block;
    filter:drop-shadow(10px 10px 20px gray);
    
}

.atlasmobile {
  padding-top: 100px;
  display:inline-block;
  filter:drop-shadow(10px 10px 20px gray);
  
}

.atlasgif {
    float:right;
    padding: 20%;
    padding-top: 10px;
    filter:drop-shadow(10px 10px 20px gray);
    
}
.img-top{
  display: none;
  position:absolute;
  width:100%;
  left:0%;
  height:auto;

  z-index: 99;

}

.atlasmobile:hover .img-top {
    display:inline-block;
    width:100%;
    height:auto;
    }

@media only screen and (max-device-width: 820px) {
     .atlasmobile {
        display:none;
        
        }
  }

  @media only screen and (max-device-width: 820px) {
    .img-top{
       display:none;
       
       }
 }

  .img-mobile{
    display: none;
    padding-top: 100px;
    filter:drop-shadow(10px 10px 20px gray);
    width:100%;
    height:auto;
    z-index: 99;
  }  

@media only screen and (max-device-width: 820px) {
    .img-mobile {
        display:inline-block;
        padding-top: 100px;
    filter:drop-shadow(10px 10px 20px gray);
        width:100%;
        height:auto;
        }
      }
      
.newimg {
  float: right;
  padding-top: 28px;
  margin-top: 10px;
  margin-bottom: 20px;
  
}

.bigimg {
  float: right;
  padding-top: 28px;
  margin-top: 10px;
  
}

.responsive{
    width:100%;
    height:auto;
}

.absatz{
    padding-bottom: 200px;
}

.hide {
  display: none;
}
    
.myDIV:hover + .hide {
  display: contents;
  font-size: clamp(20px, 1vw, 100px);
  font-style: italic;
}
.myDIV:hover {
  color:rgb(205,23,25)
}

/*sorgt dafür, dass der nächste block darunter anfängt*/
.row::after {
    content: "";
    display: table;
    clear: both;
  }

/* unvisited link */
a.one:link {
    color: black;
    font-weight: normal;
    text-decoration: none;
  }

/* visited link */
a.one:visited {
  color: black;
  text-decoration: none;
}
  
  
  /* mouse over link */
a.one:hover {
    color: rgb(205,23,25);
    text-decoration: none;

  }
a.two:link {
    color: rgb(205,23,25);
    font-size:70%;
    text-decoration: none;
    width:10px;
  }

/* visited link */
a.two:visited {
  color: rgb(205,23,25);
  text-decoration: none;
}
  
  
  /* mouse over link */
a.two:hover {
  color: rgb(205,23,25);
  transition: 0.3s ease-in-out;
    font-size: 80%;
    width:15px;
    size: 120%;
  }

  a.three:link {
    float:right;
    padding: 10%;
    padding-top: 28px;
    margin-top: 10px;
    text-decoration: none;
  }

/* visited link */
a.three:visited {
  text-decoration: none;
}
  
  
  /* mouse over link */
a.three:hover {
  float:right;
    padding: 7%;
    padding-top: 28px;
    margin-top: 10px;
  transition: 0.3s ease-in-out;
  }

a.four:link {
    float:left;
    width: 100%;
    text-decoration: none;
  }

/* visited link */
a.four:visited {
  text-decoration: none; 
}

  /* mouse over link */
a.four:hover {
  float:left;
  width: 130%;
transition: 0.3s ease-in-out;
  }
.link-mobile{
  display: none;
}
  a.five:link {
    color: rgba(205,23,25,0.66);
    text-decoration: none;
  }

/* visited link */
a.five:visited {
  color: rgba(205,23,25,0.66);
  text-decoration: none;
}
  
  
  /* mouse over link */
a.five:hover {
  color: rgba(205,23,25,0.66);
  }

@media only screen and (max-device-width: 820px) {
  .link-mobile {
        display:block;
       
        }
      }