/* ///////////////////////////////////////////
Exhibition website STYLES */

body {width: 100vw; margin-top: 0; padding-top: 0; font-family: 'Lato', Arial, sans-serif; background-color: #fefefe; color: #222; }
     
.hyphens { hyphens: auto; 
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-o-hyphens: auto;
	}
.justify {text-align: justify; }


/* Padding Rules */
.top-150 {padding-top: 150px; }
.top-120 {padding-top: 120px; }
.top-100 {padding-top: 100px; }
.top-70 {padding-top: 70px; }
.top-50 {padding-top: 50px; }
.top-40 {padding-top: 40px; }
.top-30 {padding-top: 30px; }
.top-20 {padding-top: 20px; }
.top-0 {padding-top: 0; }

.bottom-150 {padding-bottom: 150px; }
.bottom-120 {padding-bottom: 120px; }
.bottom-100 {padding-bottom: 100px; }
.bottom-70 {padding-bottom: 70px; }
.bottom-50 {padding-bottom: 50px; }
.bottom-40 {padding-bottom: 40px; }
.bottom-30 {padding-bottom: 30px; }
.bottom-20 {padding-bottom: 20px; }
.bottom-0 {padding-bottom: 0; }


/* Top Section mit Struktur-Hintergrund */
#top-section {position: relative; top: 0; left: 0; width: 100vw; height: 25vh; text-align: center;
      background: url('../pix/bg-texture.jpg') center/cover no-repeat;
      display: flex;
      align-items: center;
      justify-content: center;
    }
#top-section h3 {font-family: 'Playfair Display', serif; font-size: 2.3rem; font-weight: bold; color: #fff;
      letter-spacing: 3px;
      text-shadow: 0 2px 4px rgba(0,0,0,0.4);
    }

p.leonidio {position: relative; margin-top: 20px; font-size: 1.3em; letter-spacing: 2.5vw; text-align: center; color: grey; }


header {position: relative; padding: 2rem 1rem; text-align: center; }
header h1 {font-family: 'Playfair Display', serif; font-size: 5rem; font-weight: bold; letter-spacing: 4px;
      margin-bottom: 0.5em;
    }
header h2 {font-style: italic; font-size: 1.5rem; color: #555; }


/* Slider titles ohne Animationseffekt */
.bg-title { font-size: 1.5rem; background: #fff; padding: 0.3em 0.6em;
      border-radius: 3px;
      color: grey;
    }

section { padding: 2rem 1rem; }
section h3 {font-family: 'Playfair Display', serif; font-size: 2rem; margin-bottom: 1rem; letter-spacing: 1px; }
section p {max-width: 700px; margin: 0 auto 1rem; line-height: 1.6; }
section p.lrz {font-size:1.6em; line-height:1.3em; letter-spacing:1px }
section a {color: red; }

/* Aygo Image */
.avgo {display: block; width: 60%; max-width: 800px; margin: 40px auto 40px auto; }

/* Maps Button */
.btn-map {border: none; font-weight: 400; padding: 0.9em 2.5em; border-radius: 14px; 
 -webkit-transition: background .7s ease-in-out
  transition: background .7s ease-in-out;
  }
.btn-map:hover { background: darkred; }

/* Footer */
footer {border-top: 1px solid #ddd; margin-top: 70px; padding: 2rem 0 3rem; text-align: center; font-size: 1rem; font-weight: 300; color: #fff; background: #222 }
footer a {color: #fff; text-decoration: none;
 -webkit-transition: background .7s ease-in-out
  transition: background .7s ease-in-out; 
  }
footer a:hover {text-decoration: none; color: red; }



/* MEDIA QUERIES ------------------------------*/

@media (max-width: 1199px) { 
.avgo {width: 70%; }
}

@media (max-width: 992px) { 
header h1 { font-size: 4rem; }
}

@media (max-width: 768px) {
header h1 { font-size: 3rem; letter-spacing: 2px; }
.avgo {width: 80%; }
}

@media (max-width: 576px) {
#top-section {height: 30vh; text-align: center; }
header h1 { font-size: 2.3rem; letter-spacing: 1px; }
.avgo {width: 90%; }
}

@media (max-width: 479px) {
.avgo {width: 100%; margin: 40px auto 10px auto; }
}


/* Text Color Change */
.color-change { background: #333;
animation: background-change 4s infinite;
-webkit-animation: background-change 4s infinite;

}
@-webkit-keyframes background-change { 0%{background: #333} 50%{background: #e2002f} 100%{background: #333} }
@-moz-keyframes background-change { 0%{background: #333} 50%{background: #e2002f} 100%{background: #333} }
@-o-keyframes background-change { 0%{background: #333} 50%{background: #e2002f} 100%{background: #333} }
@keyframes background-change { 0%{background: #333} 50%{background: #e2002f} 100%{background: #333} }