/*      Florian Weber
        Version 1.0
        Änderungsdatum: 13.02.2025
*/


html {scroll-behavior: smooth;}
body {padding: 0em; margin: 0em; width: 100%; background-image: url("bilder/bg.jpg"); background-size: cover; background-attachment: fixed; background-repeat: no-repeat center; }
body {max-width: 60em; margin: auto;}

/* NAVIGATION */
#navigation {margin: 1em; margin-bottom: 0em; background: #BC2324; top: 0; z-index: 3;}
.navi {color: #FFFFFF; list-style: none; margin: 0; padding: 0;}
nav {font-family: 'Ubunutu', sans-serif; margin: 0; padding: 0;}
nav a {text-decoration: none; color: #FFFFFF;}
.nav {font-size: 1em; padding: 0.5em}
.nav_ {font-size: 1em; padding: 0.5em; background-color: #d6e14d; color: #BC2324;}
.navi li {margin: 0.5em;}

#hamburg {display: none; z-index: 3;}

#vordergrund img {width: 100%;}

@media (min-width: 50em) {
         .navi {display: flex; flex-direction: row; flex-wrap: wrap;}
         #navigatio {max-width: 60em; margin: auto;}
         }



@media (max-width: 50em) {
         .navigation {position: absolute;}

         label.hamburg {display: block; background: #BC2324; width: 75px; height: 50px; position: relative; margin-left: auto; margin-right: 0; border-radius: 4px;}
         input#hamburg {display: none}
         .line {position: absolute; left:10px; height: 4px; width: 55px; background: #FFFFFF; border-radius: 2px; display: block; transition: 0.5s; transform-origin: center;}
         .line:nth-child(1) { top: 12px; }
         .line:nth-child(2) { top: 24px; }
         .line:nth-child(3) { top: 36px; }
         #hamburg:checked + .hamburg .line:nth-child(1){transform: translateY(12px) rotate(-45deg);}
         #hamburg:checked + .hamburg .line:nth-child(2){opacity:0;}
         #hamburg:checked + .hamburg .line:nth-child(3){transform: translateY(-12px) rotate(45deg);}

         nav {display: none; flex-direction: row; font-size: 1.7em;}
         #hamburg:checked ~ nav {display: block; position: relative; text-align: center;}

         nav li {padding: .3em; margin: 0;}
         }


.nav:hover {color: grey; transition: .4s; text-decoration: underline;}
.nav_:hover {color: grey; transition: .4s; text-decoration: underline;}


#arrow_up {position: fixed; bottom: 4.1em; right: .5em; font-size: 150%; color: #BC2324; background: none; padding: 0.2em; border-color: #BC2324; border-style: solid; border-width: .1em; border-radius: 10%; opacity: 0%; transition: opacity 1s; z-index: 3;}

@media (min-width: 75em) {
         #arrow_up {color: #BC2324; border-color: #BC2324;}
}




/* SIDEBAR NAVIGATION */
.sidebar a {color: #BC2324; text-decoration: none; padding: 0.5em;}
.sidebar a:hover {text-decoration: underline;}
#sidebar_ {background-color: #d6e14d;}


/* HINTERGRUND */




/* INHALT */
@media (min-width: 50em) {
    .bild {float: right; padding: 0em 2em;}
    }

@media (max-width: 50em) {
    .bild {display: block; margin-left: auto; margin-right: auto;}
}

.bild {max-width: 90%; position: relative;}
.inhalt {margin: 0em 1em; padding: 2em; min-height: 30em;}
.inhalt {font-family: "Ubuntu", sans-serif; line-height: 1.5; text-align: justify; background-color: #FFFFFF; opacity: 0.9;}
.inhalt p {line-height: 1.5;}
h2 {color: #BC2324;}
h3 {color: #BC2324; font-size: 1em;}

#home_orpheo {position: relative; }
.bild {max-width: 20em;}
.plakat {width: 50%; text-align: center;}

.link {color: #A84204; text-decoration: none;}
.link:hover {text-decoration: underline;}

.bold {font-weight: bold;}
.italic {font-style: italic;}
.center {text-align: center;}

.aktuell_bild_container {display: flex; flex-direction: row; max-width: 100%; flex-wrap: wrap;}
.aktuell_bild {width: 25em; border-style: solid; border-width: 0.1em; border-color: rgb(220, 220, 220, 0.5); margin: 0.2em;}


/* FUSSZEILE */
.fusszeile {margin: 0em 1em; font-family: "Ubuntu", sans-serif; color: #FFFFFF; background: #BC2324; text-align: left; padding: 0.5em;}
.fusszeile p {font-size: 0.8em;}
.link_fuss {text-decoration: none; color: #FFFFFF;}
.link_fuss:hover {text-decoration: underline;}