@import "fonts.css";
*,html { margin: 0px; padding: 0px; text-decoration: none; border: 0px; outline: none; }
html { height: 100%; }
body { color: #444; font-family: 'Playfair Display', Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; height: 100%; }
/* Allgemeine Einstellungen */
/* Flaggen und Icon Warenkorb */
.de { float: left; width: 41px; height: 39px; margin-right: 7px; background: url(/designpics/flaggen.png) no-repeat 0px 0px; }
.en { float: left; width: 41px; height: 39px; margin-right: 7px; background: url(/designpics/flaggen.png) no-repeat 0px -40px; }
.fi { float: left; width: 41px; height: 39px; margin-right: 5px; background: url(/designpics/flaggen.png) no-repeat 0px -80px; }
.wk { float: left; width: 41px; height: 39px; margin-right: 7px; background: url(/designpics/flaggen.png) no-repeat 0px -120px; }
.de a, .en a, .fi a, .wk a { display: block; width: 41px; height: 39px; }
.de span, .en span, .fi span, .wk span { display: none; }
.de:hover { color: #c5a059; background: url(/designpics/flaggen.png) no-repeat -41px 0px; }
.en:hover { color: #a02b2b; background: url(/designpics/flaggen.png) no-repeat -41px -40px; }
.fi:hover { color: #55a34a; background: url(/designpics/flaggen.png) no-repeat -41px -80px; }
.wk:hover { color: #55a34a; background: url(/designpics/flaggen.png) no-repeat -41px -120px; }
.clearfix { overflow: auto; }
.clearfix::after { content: ""; clear: both; display: table; }
.autoresize { width: 100%; height: auto; }
#iframediv { position: relative; width: 560px; margin: 10px auto; }
hr { width: 100%; color: #CCC; border-bottom: 1px solid #CCC; margin-bottom: 15px; }
.ausverkauft { position: absolute; font-size: larger; font-weight: 600; color: #000; background-color: rgba(253, 207, 77, 0.8); text-align: center; padding-top: 10px; width: 100%; top: 0px; }
/* Zusätzliche Felder am Seitenende */
#zusatz { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 30px;}
#zusatz div { position: relative; flex-grow: 0; flex-shrink: 3; flex-basis: auto; width: 30%; min-width: 250px; height: auto; padding-bottom: 10px; float: left; overflow: hidden; border: 1px solid #A02B2B; border-radius: 5px; box-shadow: 1px 1px 3px #808080; }
#zusatz img { width: 100%; height: auto; margin-bottom: 10px; }
#zusatz h3 { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 24px; font-style: italic; font-weight: 600; margin-bottom: 10px; color: #A02B2B; }
#zusatz p { text-align: center; padding: 0 10px 40px; }
.zusatzbutton { position: absolute; width: 100%; bottom: 0px; }
#zusatz a:link, #zusatz a:visited { display: block; border: 1px solid #A02B2B; padding: 5px; text-align: center; width: 80%; margin: 10px auto; color: #A02B2B; }
#zusatz a:hover, #zusatz a:focus { display: block; border: 1px solid #A02B2B; padding: 5px; text-align: center; width: 80%; margin: 10px auto; background: #A02B2B; color: white; }
/* Tabelle im Dashboard */
#dashtable { width: 100%; margin 15px 0; border: 1px solid #CCC; border-collapse: collapse; }
#dashtable th { border: 1px solid #CCC; padding: 3px; }
#dashtable td { border: 1px solid #CCC; padding: 5px 3px; }
/* Zeilen mit ungerader Nummer, siehe http://jendryschik.de/wsdev/einfuehrung/css/selektoren */
#dashtable tr:nth-child(odd) {
background-color: none;
}
/* Zeilen mit gerader Nummer */
#dashtable tr:nth-child(even) {
background-color: #EEE;
}
@media (min-width: 2001px) {
#all { position: relative; width: 100%; height: auto; max-width: 2000px; border-left: 1px solid #972e2e; border-right: 1px solid #972e2e; min-height: 100%; margin: 0 auto; }
#titeltext h1 { font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 80px !important; font-weight: 400; text-align: center; color: #FDCF4D; }
}
@media (min-width: 1600px) {
#all { position: relative; width: 100%; height: auto; min-height: 100%; margin: 0 auto; }
/* Header */
#header { width: 100%; height: auto; }
#logo { position: relative; margin-top: 10px; margin-left: 100px; width: 800px; height: 190px; background: url(/designpics/logo_800.png) top left; z-index: 10; }
#logo span { display: none; }
#flaggen ul { position: absolute; right: 41px; top: 110px; }
#flaggen ul li { list-style-type: none; list-style-image: none; float: left; }
#headerbild { position: relative; width: 100%; height: auto; max-height: 400px; }
#titelbildlinks { position: relative; width: 52%; height: auto; float: left; }
#titelbildlinks > div { position: absolute; top: 1px; left: 1px; }
#titelbildlinks img { width: 100%; height: auto; }
#titelbildrechts { position: relative; width: 100%; height: auto; max-height: 508px; z-index: 5; float: left; margin-bottom: 30px; }
#titelbildrechts img { width: 100%; height: auto; }
#titeltext { position: absolute; top: 20%; left: 55%; width: 40%; height: 100px; z-index: 6; }
#titeltext h1 { font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 3vw; font-weight: 400; text-align: center; color: #FDCF4D; word-wrap: break-word; font-style: italic; }
#titeltext2 { position: absolute; display: table; top: 0px; left: 55%; width: 40%; height: 100%; z-index: 6; }
#titeltext2 div { display: table-cell; vertical-align: middle; }
#titeltext2 h1 { font-size: 3vw; font-weight: 400; text-align: center; color: #FDCF4D; margin-bottom: 15px; padding-right: 20px; }
#titeltext2 p { font-size: 24px; line-height: 40px; text-align: center; color: #FDCF4D; width: 100%; }
#titeltext2 a { color: #FDCF4D; font-style: italic; }
/* Sidebar */
#sidebar { position: relative; width: 300px; height: auto; margin-bottom: 0px; float: left; padding-bottom: 80px !important; }
#aside { position: relative; width: 100%; height: auto; padding-left: 20px; }
#aside div { display: block; height:auto; bottom:0; top:0; left:0; right:0; padding: 20px; background-color: #A02B2B; color: white; border-radius: 10px; margin-bottom: 30px; }
#aside h1 { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 24px; font-style: italic; font-weight: 600; margin-bottom: 10px; }
#aside p { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 16px; line-height: 24px; font-style: normal; font-weight: 400; margin-bottom: 10px; hyphens: auto; }
#aside img { width: 100%; height: auto; border: 2px solid white; border-radius: 5px; margin-bottom: 10px; }
#aside a { color: #FDCF4D; font-size: larger; text-align: center; }
/* Contentbereich */
#content { position: relative; margin-left: 500px; width: 1000px; padding-bottom: 80px !important; }
#content h2 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 36px; font-weight: 300; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 15px; }
#content p { text-align: justify; hyphens: auto; line-height: 24px; }
/* Contentbereich bei Textseiten */
#main { position: relative; margin-left: 500px; width: 1000px; padding-bottom: 80px !important; }
#main h2 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 36px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 24px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h4 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 20px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 10px; }
#main p { margin-bottom: 15px; text-align: justify; hyphens: auto; line-height: 24px; }
#main ul { list-style-type: circle; margin-left: 30px; margin-bottom: 30px; }
#main li { line-height: 24px; margin-bottom: 10px; }
#main a:link, #main a:visited { color: #A02B2B; font-style: italic; }
#main a:hover, #main a:focus { color: #A02B2B; font-style: italic; padding-left: 1px; border-bottom: 1px dotted #A02B2B; }
/* Footer */
#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #A02B2B; color: white; }
#footer p { text-align: center; padding-top: 10px; }
#footer a:link, #footer a:visited { color: white; }
#footer a:hover, #footer a:focus { color: #FDCF4D; }
/* ########################## Restliche Formatierungen ########################## */
/* Kategorien auf Startseite */
#kategorien { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 60px; margin-top: 30px;}
#kategorien a { color: #A02B2B; }
#kategorien h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 30px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 0px; }
.katuebersicht { position: relative; flex-grow: 0; flex-shrink: 2; flex-basis: auto; width: 300px; height: auto; padding-bottom: 10px; float: left; text-align: center; font-size: 28px; font-style: italic; overflow: hidden; border: 1px solid #A02B2B; border-radius: 5px; box-shadow: 1px 1px 3px #808080; }
.katuebersicht img { width: 300px; height: 200px; transition: all 1s; margin-bottom: 5px;}
.katuebersicht:hover img { transform: scale(1.1);}
}
@media (min-width: 1300px) and (max-width: 1599px){
#all { position: relative; width: 100%; height: auto; min-height: 100%; margin: 0 auto; }
/* Header */
#header { width: 100%; height: auto; }
#logo { position: relative; margin-top: 10px; margin-left: 100px; width: 800px; height: 190px; background: url(/designpics/logo_800.png) top left; z-index: 10; }
#logo span { display: none; }
#flaggen ul { position: absolute; right: 41px; top: 110px; }
#flaggen ul li { list-style-type: none; list-style-image: none; float: left; }
#headerbild { position: relative; width: 100%; height: auto; max-height: 400px; }
#titelbildlinks { position: relative; width: 52%; height: auto; float: left; }
#titelbildlinks > div { position: absolute; top: 1px; left: 1px; }
#titelbildlinks img { width: 100%; height: auto; }
#titelbildrechts { position: relative; width: 100%; height: auto; max-height: 508px; z-index: 5; float: left; margin-bottom: 30px; }
#titelbildrechts img { width: 100%; height: auto; }
#titeltext { position: absolute; top: 20%; left: 57%; width: auto; height: 100px; z-index: 6; }
#titeltext { position: absolute; top: 20%; left: 55%; width: 40%; height: 100px; z-index: 6; }
#titeltext h1 { font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 3vw; font-weight: 400; text-align: center; color: #FDCF4D; word-wrap: break-word; font-style: italic; }
#titeltext2 { position: absolute; display: table; top: 0px; left: 55%; width: 40%; height: 100%; z-index: 6; }
#titeltext2 div { display: table-cell; vertical-align: middle; }
#titeltext2 h1 { font-size: 36px; font-weight: 400; text-align: center; color: #FDCF4D; margin-bottom: 15px; }
#titeltext2 p { font-size: 22px; line-height: 36px; text-align: center; color: #FDCF4D; width: 100%; }
#titeltext2 a { color: #FDCF4D; font-style: italic; }
/* Sidebar */
#sidebar { position: relative; width: 300px; height: auto; margin-bottom: 0px; float: left; padding-bottom: 80px !important; }
#aside { position: relative; width: 100%; height: auto; padding-left: 20px; }
#aside div { display: block; height:auto; bottom:0; top:0; left:0; right:0; padding: 20px; background-color: #A02B2B; color: white; border-radius: 10px; margin-bottom: 30px; }
#aside h1 { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 24px; font-style: italic; font-weight: 600; margin-bottom: 10px; }
#aside p { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 16px; line-height: 24px; font-style: normal; font-weight: 400; margin-bottom: 10px; hyphens: auto; }
#aside img { width: 100%; height: auto; border: 2px solid white; border-radius: 5px; margin-bottom: 10px; }
#aside a { color: #FDCF4D; font-size: larger; text-align: center; }
/* Contentbereich */
#content { position: relative; margin-left: 400px; width: 65%; padding-bottom: 80px !important; }
#content h2 { width: 100%; font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 36px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 15px; }
#content p { margin-bottom: 30px; text-align: justify; hyphens: auto; line-height: 24px; }
/* Contentbereich bei Textseiten */
#main { position: relative; margin-left: 400px; width: 65%; padding-bottom: 80px !important; }
#main h2 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 36px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 22px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 10px; }
#main p { margin-bottom: 15px; text-align: justify; hyphens: auto; line-height: 24px; }
#main ul { list-style-type: circle; margin-left: 30px; margin-bottom: 30px; }
#main li { line-height: 24px; margin-bottom: 10px; }
#main a:link, #main a:visited { color: #A02B2B; font-style: italic; }
#main a:hover, #main a:focus { color: #A02B2B; font-style: italic; padding-left: 1px; border-bottom: 1px dotted #A02B2B; }
/* Footer */
#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #A02B2B; color: white; }
#footer p { text-align: center; padding-top: 10px; }
#footer a:link, #footer a:visited { color: white; }
#footer a:hover, #footer a:focus { color: #FDCF4D; }
/* ########################## Restliche Formatierungen ########################## */
/* Kategorien auf Startseite */
#kategorien { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 30px;}
#kategorien a { color: #A02B2B; }
#kategorien h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 30px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 0px; }
.katuebersicht { position: relative; flex-grow: 0; flex-shrink: 2; flex-basis: auto; width: 300px; height: auto; padding-bottom: 10px; float: left; text-align: center; font-size: 28px; font-style: italic; overflow: hidden; border: 1px solid #A02B2B; border-radius: 5px; box-shadow: 1px 1px 3px #808080; }
.katuebersicht img { width: 300px; height: 200px; transition: all 1s; margin-bottom: 5px;}
.katuebersicht:hover img { transform: scale(1.1);}
}
@media (min-width: 960px) and (max-width: 1299px) {
#all { position: relative; width: 100%; height: auto; min-height: 100%; margin: 0 auto; }
/* Header */
#header { width: 100%; height: auto; }
#logo { position: relative; margin-top: 10px; margin-left: 100px; width: 600px; height: 142px; background: url(/designpics/logo_600.png) top left; z-index: 10; }
#logo span { display: none; }
#flaggen ul { position: absolute; right: 41px; top: 70px; }
#flaggen ul li { list-style-type: none; list-style-image: none; float: left; }
.slide-out-div { top: 80px !important; }
#headerbild { position: relative; width: 100%; height: auto; max-height: 400px; }
#titelbildlinks { position: relative; width: 52%; height: auto; float: left; }
#titelbildlinks > div { position: absolute; top: 1px; left: 1px; }
#titelbildlinks img { width: 100%; height: auto; }
#titelbildrechts { position: relative; width: 100%; height: auto; max-height: 508px; z-index: 5; float: left; margin-bottom: 30px; }
#titelbildrechts img { width: 100%; height: auto; }
#titeltext { position: absolute; top: 20%; left: 55%; width: 40%; height: 100px; z-index: 6; }
#titeltext h1 { font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 3vw; font-weight: 400; text-align: center; color: #FDCF4D; font-style: italic; }
#titeltext2 { position: absolute; display: table; top: 0px; left: 55%; width: 40%; height: 100%; z-index: 6; }
#titeltext2 div { display: table-cell; vertical-align: middle; }
#titeltext2 h1 { font-size: 30px; font-weight: 400; text-align: center; color: #FDCF4D; margin-bottom: 15px; }
#titeltext2 p { font-size: 18px; line-height: 28px; text-align: center; color: #FDCF4D; width: 100%; }
#titeltext2 a { color: #FDCF4D; font-style: italic; }
/* Sidebar */
#sidebar { position: relative; width: 300px; height: auto; margin-bottom: 0px; float: left; padding-bottom: 80px !important; }
#aside { position: relative; width: 100%; height: auto; padding-left: 20px; }
#aside div { display: block; height:auto; bottom:0; top:0; left:0; right:0; padding: 20px; background-color: #A02B2B; color: white; border-radius: 10px; margin-bottom: 30px; }
#aside h1 { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 24px; font-style: italic; font-weight: 600; margin-bottom: 10px; }
#aside p { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 16px; line-height: 24px; font-style: normal; font-weight: 400; margin-bottom: 10px; hyphens: auto; }
#aside img { width: 100%; height: auto; border: 2px solid white; border-radius: 5px; margin-bottom: 10px; }
#aside a { color: #FDCF4D; font-size: larger; text-align: center; }
/* Contentbereich */
#content { position: relative; margin-left: 400px; width: auto; padding-bottom: 80px !important; margin-right: 30px; }
#content h2 { width: 100%; font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 36px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 15px; }
#content p { margin-bottom: 30px; text-align: justify; hyphens: auto; line-height: 24px; }
/* Contentbereich bei Textseiten */
#main { position: relative; margin-left: 400px; width: auto; padding-bottom: 80px !important; margin-right:30px; }
#main h2 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 30px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 24px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h4 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 20px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 10px; }
#main p { margin-bottom: 15px; text-align: justify; hyphens: auto; line-height: 24px; }
#main ul { list-style-type: circle; margin-left: 30px; margin-bottom: 30px; }
#main li { line-height: 24px; margin-bottom: 10px; }
#main a:link, #main a:visited { color: #A02B2B; font-style: italic; }
#main a:hover, #main a:focus { color: #A02B2B; font-style: italic; padding-left: 1px; border-bottom: 1px dotted #A02B2B; }
/* Footer */
#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #A02B2B; color: white; }
#footer p { text-align: center; padding-top: 10px; }
#footer a:link, #footer a:visited { color: white; }
#footer a:hover, #footer a:focus { color: #FDCF4D; }
/* ########################## Restliche Formatierungen ########################## */
/* Kategorien auf Startseite */
#kategorien { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 30px;}
#kategorien a { color: #A02B2B; }
#kategorien h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 30px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 0px; }
.katuebersicht { position: relative; flex-grow: 0; flex-shrink: 2; flex-basis: auto; width: 250px; height: auto; padding-bottom: 10px; float: left; text-align: center; font-size: 24px; font-style: italic; overflow: hidden; border: 1px solid #A02B2B; border-radius: 5px; box-shadow: 1px 1px 3px #808080; }
.katuebersicht img { width: 250px; height: 167px; transition: all 1s; margin-bottom: 5px;}
.katuebersicht:hover img { transform: scale(1.1);}
}
@media (min-width: 768px) and (max-width: 959px) {
#all { position: relative; width: 100%; height: auto; min-height: 100%; margin: 0 auto; }
/* Header */
#header { width: 100%; height: auto; padding-top: 105px; }
#logo { position: absolute; top: 10px; left: 90px; width: 400px; height: 95px; background: url(/designpics/logo_400.png) top left; z-index: 10; }
#logo span { display: none; }
#flaggen ul { position: absolute; right: 41px; top: 40px; }
#flaggen ul li { list-style-type: none; list-style-image: none; float: left; }
.slide-out-div { top: 40px !important; }
#headerbild { position: relative; width: 100%; height: auto; max-height: 200px; }
#titelbildlinks { position: relative; width: 52%; height: auto; float: left; }
#titelbildlinks > div { position: absolute; top: 1px; left: 1px; }
#titelbildlinks img { width: 100%; height: auto; }
#titelbildrechts { position: relative; width: 100%; height: auto; max-height: 508px; z-index: 5; float: left; margin-bottom: 30px; }
#titelbildrechts img { width: 100%; height: auto; }
#titeltext { position: absolute; top: 30%; left: 55%; width: 40%; height: 100px; z-index: 6; }
#titeltext h1 { font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 3vw; font-weight: 400; text-align: center; color: #FDCF4D; font-style: italic; }
#titeltext2 { position: absolute; display: table; top: 0px; left: 50%; width: 45%; height: 100%; z-index: 6; }
#titeltext2 div { display: table-cell; vertical-align: middle; }
#titeltext2 h1 { font-size: 22px; font-weight: 400; text-align: center; color: #FDCF4D; margin-bottom: 10px; }
#titeltext2 p { font-size: 16px; line-height: 22px; text-align: center; color: #FDCF4D; width: 100%; }
#titeltext2 a { color: #FDCF4D; font-style: italic; }
/* Sidebar */
#sidebar { position: relative; width: 250px; height: auto; margin-bottom: 0px; float: left; padding-bottom: 80px !important; }
#aside { position: relative; width: 100%; height: auto; padding-left: 20px; }
#aside div { display: block; height:auto; bottom:0; top:0; left:0; right:0; padding: 20px; background-color: #A02B2B; color: white; border-radius: 10px; margin-bottom: 30px; }
#aside h1 { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 24px; font-style: italic; font-weight: 600; margin-bottom: 10px; }
#aside p { font-family: 'Playfair Display', Helvetica, sans-serif; text-align: center; font-size: 16px; line-height: 24px; font-style: normal; font-weight: 400; margin-bottom: 10px; hyphens: auto; }
#aside img { width: 100%; height: auto; border: 2px solid white; border-radius: 5px; margin-bottom: 10px; }
#aside a { color: #FDCF4D; font-size: larger; text-align: center; }
#sidemenue { width: 250px; }
.sidebar select { width: 160px; }
/* Contentbereich */
#content { position: relative; margin-left: 300px; width: 60%; padding-bottom: 80px !important; }
#content h2 { width: 100%; font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 28px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 30px; }
#content p { margin-bottom: 15px; line-height: 24px; }
/* Contentbereich bei Textseiten */
#main { position: relative; margin-left: 300px; width: 60%; padding-bottom: 80px !important; }
#main h2 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 28px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 22px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h4 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 18px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 10px; }
#main p { margin-bottom: 15px; line-height: 24px; }
#main ul { list-style-type: circle; margin-left: 30px; margin-bottom: 30px; }
#main li { line-height: 24px; margin-bottom: 10px; }
#main a:link, #main a:visited { color: #A02B2B; font-style: italic; }
#main a:hover, #main a:focus { color: #A02B2B; font-style: italic; padding-left: 1px; border-bottom: 1px dotted #A02B2B; }
/* Footer */
#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #A02B2B; color: white; }
#footer p { text-align: center; padding-top: 10px; }
#footer a:link, #footer a:visited { color: white; }
#footer a:hover, #footer a:focus { color: #FDCF4D; }
/* ########################## Restliche Formatierungen ########################## */
/* Kategorien auf Startseite */
#kategorien { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 30px;}
#kategorien a { color: #A02B2B; }
#kategorien h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 24px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 0px; }
.katuebersicht { position: relative; flex-grow: 0; flex-shrink: 2; flex-basis: auto; width: 200px; height: auto; padding-bottom: 10px; float: left; text-align: center; font-size: 24px; font-style: italic; overflow: hidden; border: 1px solid #A02B2B; border-radius: 5px; box-shadow: 1px 1px 3px #808080; hyphens: auto; }
.katuebersicht img { width: 200px; height: 133px; transition: all 1s; margin-bottom: 5px;}
.katuebersicht:hover img { transform: scale(1.1);}
}
@media (max-width: 767px) {
#all { position: relative; width: 100%; height: auto; min-height: 100%; margin: 0 auto; }
/* Header */
#header { width: 100%; height: auto; padding-top: 145px; }
#logo { position: absolute; top: 50px; left: 60px; width: 400px; height: 95px; background: url(/designpics/logo_400.png) top left; z-index: 10; }
#logo span { display: none; }
#flaggen ul { position: absolute; right: 41px; top: 10px; z-index: 200; }
#flaggen ul li { list-style-type: none; list-style-image: none; float: left; }
.slide-out-div { top: 10px !important; }
#headerbild { position: relative; width: 100%; height: auto; max-height: 200px; }
#titelbildlinks { position: relative; width: 52%; height: auto; float: left; }
#titelbildlinks > div { position: absolute; top: 1px; left: 1px; }
#titelbildlinks img { width: 100%; height: auto; }
#titelbildrechts { position: relative; width: 100%; height: auto; max-height: 508px; z-index: 5; float: left; margin-bottom: 30px; }
#titelbildrechts img { width: 100%; height: auto; }
#titeltext { position: absolute; top: 20px; right: 20px; width: 48%; z-index: 6; hyphens: auto; }
#titeltext h1 { font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 4vw; font-weight: 400; text-align: center; color: #FDCF4D; font-style: italic; }
#titeltext2 { position: relative; display: table; width: 100%; height: auto; z-index: 6; }
#titeltext2 div { display: table-cell; vertical-align: middle; }
#titeltext2 h1 { font-size: 28px; font-weight: 400; text-align: center; color: #A02B2B; margin-bottom: 10px; }
#titeltext2 p { line-height: 24px; text-align: left; padding: 0 20px; }
#titeltext2 a { color: #A02B2B; }
/* Sidebar in menue.css */
aside, #aside { display: none; }
/* Contentbereich */
#content { position: relative; margin-left: 20px; margin-right: 20px; width: auto; padding-bottom: 120px !important; }
#content h2 { width: 100%; font-family: 'Playfair Display', 'Times New Roman', Helvetica, sans-serif; font-size: 24px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 20px; }
#content p { margin-bottom: 15px; line-height: 24px; }
/* Contentbereich bei Textseiten */
#main { position: relative; margin-left: 20px; margin-right: 20px; width: auto; padding-bottom: 120px !important; }
#main h2 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 24px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 20px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 15px; }
#main h4 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 18px; font-weight: 300; font-style: normal; text-align: left; color: #A02B2B; margin-bottom: 10px; }
#main p { margin-bottom: 15px; line-height: 24px; }
#main ul { list-style-type: circle; margin-left: 30px; margin-bottom: 30px; }
#main li { line-height: 24px; margin-bottom: 10px; }
#main a:link, #main a:visited { color: #A02B2B; font-style: italic; }
#main a:hover, #main a:focus { color: #A02B2B; font-style: italic; padding-left: 1px; border-bottom: 1px dotted #A02B2B; }
/* Footer */
#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 120px; background: #A02B2B; color: white; }
#footer p { text-align: center; padding: 10px; font-size: larger; }
#footer a:link, #footer a:visited { color: white; }
#footer a:hover, #footer a:focus { color: #FDCF4D; }
/* ########################## Restliche Formatierungen ########################## */
/* Kategorien auf Startseite */
#kategorien { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 30px;}
#kategorien a { color: #A02B2B; }
#kategorien h3 { width: 100%; font-family: 'Playfair Display', Helvetica, sans-serif; font-size: 24px; font-weight: 400; font-style: italic; text-align: center; color: #A02B2B; margin-bottom: 0px; }
.katuebersicht { position: relative; flex-grow: 0; flex-shrink: 2; flex-basis: auto; width: 300px; height: auto; padding-bottom: 10px; float: left; text-align: center; font-size: 28px; font-style: italic; overflow: hidden; border: 1px solid #A02B2B; border-radius: 5px; box-shadow: 1px 1px 3px #808080; }
.katuebersicht img { width: 300px; height: 200px; transition: all 1s; margin-bottom: 5px;}
.katuebersicht:hover img { transform: scale(1.1);}
#iframediv { position: relative; width: 450px; margin: 10px auto; }
#iframediv iframe { width: 450px; }
}
@media (max-width: 480px) {
#header { padding-top: 133px; }
#logo { position: absolute; top: 65px; left: 20px; width: 280px; height: 67px; background: url(/designpics/logo_280.png) top left; z-index: 10; }
#titeltext { position: absolute; top: 15px; right: 10px; width: auto; z-index: 6; }
#iframediv { position: relative; width: 280px; margin: 10px auto; }
#iframediv iframe { width: 280px; }
}