@charset "UTF-8";
* { margin: 0; padding: 0; list-style: none; }

html { margin: 0 auto; min-width: 600px; scroll-behavior: smooth; }

body { font-family: 'RC', sans-serif; font-weight: 600; min-height: 1300px; width: 100%; font-size: 45px; margin: auto; color: whitesmoke; letter-spacing: 0.11em; background-size: 1200px; background-repeat: no-repeat; background-position: top; -webkit-font-smoothing: subpixel-antialiased; text-decoration: none; word-break: break-word; background-color: black; }

a { text-decoration: none; color: darkorange; }

br {}

#loader { border: 16px solid transparent; border-top: 16px solid red; border-right: 16px solid orange; border-bottom: 16px solid blue; border-left: 16px solid white; border-radius: 50%; width: 120px; height: 120px; animation: spin 2s ease infinite; margin: 200px auto 200px 50%; transform: translate(-50%, -50%); box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.6); }

.topper { margin-top: -120px; position: absolute; }

.bolder { margin: auto; font-size: 200%; border-bottom: 5px solid orange; display: flex; padding: 20px 0; margin-bottom: 80px; justify-content: center; color: red; align-items: center; line-height: 1; }

.around { -webkit-font-smoothing: subpixel-antialiased; margin: 80px auto 0 auto; text-decoration: none; word-break: break-word; text-align: left; max-width: 1200px; padding-top: 20px; }

#geheimeNachricht { display: none; border: 1px solid #000; padding: 10px; margin-top: 10px; }

#fehlermeldung { color: red; display: none; margin-top: 10px; }

@keyframes spin { 0%, 100% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } }

@keyframes fadeIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }

.calendarinner { margin: 0 0 120px 0; }

.calendar { font-size: 250%; line-height: 100%; display: flex; flex-direction: column; justify-content: flex-end; border: 4px solid black; text-align: center; overflow: hidden; background-color: rgba(93, 128, 117, 0.95); box-sizing: border-box; width: 1000px; height: 1408px; background-size: cover; background-repeat: no-repeat; background-position: top; animation: fadeIn 1s ease-out forwards; border-radius: 10px; margin: 0 auto 10px auto; }

.calendarpicSt, .calendarpicSo, .calendarpicfu, .calendarpicSM { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding: 2%; width: 100%; height: 100%; box-sizing: border-box; background-repeat: no-repeat; background-size: cover; background-position: top; text-transform: uppercase; border-top: none; border-left: none; border-right: none; }

.calendarpicSt {font-size:80%;  background-image: url('/img/SMBPlakat.jpeg'); font-family: ry; border: 4px solid black; text-shadow: -4px -4px 0 black, 4px -4px 0 black, -4px 4px 0 black, 4px 4px 0 black, -4px 0px 0 black, 4px 0px 0 black, 0px -4px 0 black, 0px 4px 0 black; }

.calendarpicSo {color: rgb(254, 244, 224); background-image: url('/img/SomTeuerPlakat.jpeg'); font-family: pr; text-shadow: -4px -4px 0 black, 4px -4px 0 black, -4px 4px 0 black, 4px 4px 0 black, -4px 0px 0 black, 4px 0px 0 black, 0px -4px 0 black, 0px 4px 0 black; border: 4px solid black; }

.calendarpicfu { background-image: url('/img/FuckleberryPlakat.jpeg'); font-family: ricm, sans-serif; color: rgb(255, 26, 21); text-shadow: -4px -4px 0 black, 4px -4px 0 black, -4px 4px 0 black, 4px 4px 0 black, -4px 0px 0 black, 4px 0px 0 black, 0px -4px 0 black, 0px 4px 0 black; }

.calendarpicSM { background-image: url('/img/S&MPlakat.jpeg'); background-position: center 30%; }

.calensasddarpic::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: url('fuckleberrytickets.jpg'); background-size: cover; background-position: center; opacity: 0.5; z-index: -1; }

.calendarattachment { order: 5; width: 96%; }

.calendartickets { order: 6; text-align: center; width: 96%; }

.calendar a:hover { filter: brightness(120%); }

.calendarlinks { order: 1; box-sizing: border-box; color: white; }

.calendarnavi { font-size: 100%; line-height: 120%; margin:0 auto auto 60px;; text-align: center}

.calendarrechts { order: 2; color: white; box-sizing: border-box; }

.calendarbeide { font-size: 70%; line-height: 100%; box-sizing: border-box; width: 90%; clear: both; color: white; margin: auto; order: 3; }

.So { color: rgb(255, 245, 223); font-family: pr; }

.fu { font-family: 'ricm', sans-serif; }

.St { font-family: ry; }

.SM { background: linear-gradient(218deg, rgba(0,0,0,1) 0%, rgba(103,81,16,1) 19%, rgba(0,0,0,1) 50%, rgba(0,0,0,1) 68%, rgba(88,67,42,1) 78%, rgba(0,0,0,1) 100%); }

.calendar li { overflow: auto; margin: 0; padding: 20px 0; border-radius: 4px; }

.calendar lo { overflow: auto; margin: 0; padding: 20px 0; }

#counter { margin-top: 20px; }

@font-face { font-family: 'RC'; font-weight: 100 200 300 400 500 600 700 800 900 1000; src: local('RC'), url('https://stevemorgen.com/RC.ttf') format('truetype'); }

@font-face { font-family: 'pr'; font-weight: 100 200 300 400 500 600 700 800 900 1000; src: local('pr'), url('https://stevemorgen.com/pr.ttf') format('truetype'); }

@font-face { font-family: 'ry'; font-weight: 100 200 300 400 500 600 700 800 900 1000; src: local('ry'), url('https://stevemorgen.com/ry.ttf') format('truetype'); }

@font-face { font-family: 'ricm'; font-weight: 100 200 300 400 500 600 700 800 900 1000; src: local('ricm'), url('https://stevemorgen.com/ricm.ttf') format('truetype'); }

.text { width: 96%; padding: 2%; margin: 0 auto; text-align: center; line-height: 120%; border-radius: 20px; background-color: rgba(0,0,0,0.4); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.6); }

#passwortEingabe { margin: auto; font-size: 70%; width: 96%; padding: 2%; text-align: center; }

.blink { -webkit-animation: blink 10000ms ease-in-out infinite alternate; }

.impressum { margin: auto; font-size: 50%; width: 96%; padding: 2%; text-align: center; color: rgba(116,116,116,0.51); }

.number { margin: 0 auto auto auto; text-align: center; width: 95%; -webkit-animation: blink 20000ms ease-in-out infinite alternate; }

@-webkit-keyframes blink { 0% { color: green; } 20% { color: red; } 40% { color: yellow; } 60% { color: blue; } 70% { color: white; } 80% { color: black; } 90% { color: brown; } 100% { color: purple; } }

@media (max-width: 1000px) { body { font-size: 50px !important; } #text { color: white !important; } }

.allebands { background: url('') no-repeat top; width: 100%; height: 160px; display: block; margin: 40px auto; padding-top: 40px; background-size: contain; }

.allebands ul { list-style: none; display: flex; justify-content: space-around; margin: 0; padding: 0; }

.allebands img { height: 200px; width: auto; }

.allebands img:hover { filter: brightness(1.1); }

.mehr { margin: 0 auto; text-align: center; width: 95%; }

.menu { width: 100%; background-color: #254; top: 0; z-index: 1000; position: fixed; box-shadow: 0 5px 5px rgba(0,0,0,0.1), 0 5px 5px rgba(0,0,0,0.1); }

.menu a { padding: 10px 30px; display: block; text-align: center; text-decoration: none; color: white; transition: background-color 0.3s, color 0.3s; }

.menu a:hover { color: darkorange; }

.menu ul { list-style: none; display: flex; justify-content: space-around; margin: 0; padding: 0; }

@media (max-width: 600px) { .menu ul { flex-direction: column; } .menu a { padding: 10px 0; font-size: 1em; } }

button { height: 50px; width: 150px; border-radius: 10px; font-size: 60%; }

input { height: 50px; width: 80%; padding: 20px; border-radius: 10px; font-size: 120%; margin-bottom: 20px; }

form { padding: 0 20px; max-width: 100%; }

label { display: block; margin: 25px 0 0 0; font-weight: 900; }

select { font-weight: 900; width: 60%; font-size: 35px; text-align: center; margin-bottom: 15px; }
