@font-face {
 font-family:'Open Sans Variable';
 src:url('fonts/OpenSans-VariableFont_wdth,wght.ttf') format('truetype-variations');
 font-weight:100 900;
 font-stretch:75% 400%;
 font-display:swap;
}
/* barriecito-regular - latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barriecito';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/barriecito-v17-latin-ext-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/barriecito-v17-latin-ext-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

:root {
 --maxBreite:      1800px;
 --headHoehe:      50px;
 --logoHoehe:      var(--headHoehe);
 --footHoehe:      35px;

 --pageBG:         #1a1a1a;
 --grau:           #cecece;
 --dgrau:          #333;

 --qmBorderCol:    #8b1818;
 --qmTextCol:      #9c9c9c;

 --ciFarbe1:       #8f0c2d;
 --ciFarbe2:       #f9bb41;
 --dblau:          #293f4d;
 --hgrau:          #f0f0f0;
 --drot:           #9e0303;
 --menuHover:      #ff9100;
}

html                                                        {font-size:75%; line-height:75%; scroll-behavior:smooth;}
*                                                           {margin:0; padding:0; font-family:'Open Sans Variable', sans-serif; font-size: clamp(1rem,1.0vw,1.5rem); line-height: clamp(1.75rem,1.8vw,2.5rem); color:var(--grau); font-weight:350; font-variation-settings:'wght' 350; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;	box-sizing:border-box;}
*:after, *:before                                           {-webkit-box-sizing:border-box; -moz-box-sizing:border-box;	box-sizing:border-box;}
body                                                        {background-color:var(--pageBG); padding:0}
body.content                                                {width:100%; min-height:100vh; padding:0; position:relative; background-color:var(--pageBG);}

body.popup                                                  {padding:10px;}
a, img                                                      {border-style:none; text-decoration:underline; border:0;}
a                                                           {font-variation-settings: 'wght' 450;}
a:hover                                                     {color:var(--drot);}
h1, .title                                                  {margin:0 0 2rem; font-size:2.5em; line-height:1.25em; font-weight:300; font-variation-settings:'wght' 300; color:var(--grau); text-transform:uppercase;}
h2, .untertitle                                             {margin:0 0 2rem; font-size:1.5em; line-height:1.5em; font-weight:100; font-variation-settings: 'wght' 100; color:var(--grau);}
h3, .untertitel                                             {margin:0 0 .5rem; font-size:1.3em; line-height:1.6em; font-weight:350; font-variation-settings: 'wght' 350; color:#cecececf;}
h4                                                          {margin:0; font-size:18px; font-weight:600; color:#414042;}
p                                                           {padding:.875rem 0;}
td                                                          {vertical-align:top;}
.clr                                                        {clear:both; width:0; height:0; position:relative; display:block; line-height:0;}
hr                                                          {height:1px; margin:1rem 0; background-color:#666; border:none;}
form, ol, ul, li                                            {margin:0; padding:0;}
ul, ol                                                      {margin:.5rem 0; text-align:left; list-style-position:inside;}
li                                                          {padding-bottom:.5em;}
li:last-child                                               {border-bottom:none;}

b,strong                                                    {font-variation-settings:'wght' 500; font-size:inherit; color:inherit; line-height:inherit;}
i,em                                                        {font-style:italic;}
.klein                                                      {font-size:.9em; line-height:1.2em;}
iframe                                                      {width:100%; height:auto; aspect-ratio:16/9;}

table                                                       {width:100% !important; border-collapse:collapse;}

td                                                          {padding:1rem 5px ;} 
tr                                                          {margin-bottom:10px;}
thead td                                                    {padding-bottom:5px;}
#startinfo span.norap                                       {display:inline-block; color:var(--ciFarbe1); white-space:nowrap;}
.button                                                     {padding:10px 15px; display:inline-grid; justify-content:center; align-items:center; text-decoration:none; color:var(--buttColTxt); font-size:.9em; line-height:1.1rem; text-transform:uppercase; background-color:var(--buttCol); border-radius:7px;}

.actimg                                                     {padding:5px; border:2px dashed #fff;}
.actimg img                                                 {opacity:.35;}

#schattendorf                                               {position:fixed; top:var(--headHoehe); left:0; width:100vw; height: calc(100vh - var(--headHoehe) - var(--footHoehe)); z-index:1; max-width:var(--maxBreite); box-shadow:0 0 20px 0 #000 inset; pointer-events:none;}


/* PARALLAX */
#plx-wrap                                                   {width:100%; height:100%; max-width:var(--maxBreite); left:0; position:fixed; overflow-x:hidden; overflow-y:scroll; perspective:1px; perspective-origin:0 0;}
.plx-bg                                                     {height:100vh; transform-origin:0 0; transform: translate3d(0,0,-1px) scale3d(2,2,1); position:relative; z-index:1;}
.plx-cont                                                   {position:relative; padding:0; position:relative; z-index:2; color:#fff; background:rgba(0,0,0,1);}
.plx-cont #logi-wrapper                                     {max-width:var(--maxBreite); width:auto !important;}
.plx-cont #contentwrap                                      {padding-top:50px !important;}

#header                                                     {width:100vw; max-width:var(--maxBreite); left:0; height:var(--headHoehe); top:0; padding:0; position:fixed; z-index:9; background-color:var(--pageBG);}
#headerwrap                                                 {max-width:var(--maxBreite); height:var(--headHoehe); padding:0 4vw; display:grid; grid-template-columns:auto 1fr; align-content:center;}
#navlogo                                                    {align-self:center;}
#navlogo a                                                  {margin-right:4vw; font-family:'Barriecito'; font-size:2rem; color:#cecece; text-decoration:none;}   
#navi                                                       {display:none;}
#navi a                                                     {margin-right:2vw; color:#cecece; text-decoration:none; font-weight:200; font-variation-settings:'wght' 200; }

#seitentitel                                                {display:none;}

#quickmenu                                                  {padding:1rem 1rem 0; display:grid;  justify-content:center; position:relative; z-index:1;}
#quickmenu ul                                               {padding:20px 0 0; margin:0; list-style-type:none;}
#quickmenu ul li                                            {margin:0 0 1rem; padding:0 10px; display:inline-grid; align-content:center; font-size:clamp(1rem,4vw,1.5rem); line-height:clamp(1rem,4vw,1.5rem); color:var(--qmTextCol); border-left:var(--qmBorderCol) 2px solid;}
#quickmenu ul li a                                          {text-decoration:none; font-weight:300; font-variation-settings:'wght' 300; font-size: clamp(1.25rem,1.0vw,1.5rem);}

#quickmenu li.mainitem:first-child                          {border:none; padding-left:0;}
#pagelinks                                                  {width:100vw; display:none; position:relative; z-index:4;}
#pagelinks img                                              {width:100%; height:100vh; top:0; left:0; object-fit:cover;}
#pagerechts                                                 {width:100vw; background-color:var(--pageBG);}

#logo-qm-wrap                                               {height:100vh; top:0; padding:0 1rem; position:relative; z-index:2; display:grid; align-content:center; text-align:center; background-color:var(--pageBG);}
#logo                                                       {top:0; width:100%; display:grid; align-content:center; justify-content:center; justify-self:center; position:relative; z-index:4; font-family:'Barriecito'; font-size:clamp(2.5rem,11vw,13vw); line-height:clamp(2.5rem,11vw,13vw); color:var(--grau); background-color:var(--pageBG);}
#contentwrap                                                {padding:4rem 4vw;}
#content                                                    {min-height:100vh; position:relative; z-index:3; color:#ddd; background-color:#222; box-shadow:0 -10px 30px 20px #1a1a1a;}

#footer                                                     {width:100%; height:var(--footHoehe); left:0; bottom:0; padding:0; display:grid; justify-content:center; align-content:center; position:fixed; z-index:5; background-color:var(--pageBG);}
#footerwrap                                                 {width:100vw; max-width:var(--maxBreite); left:0; padding:0 4vw; position:relative; text-align:right;}
#footerwrap a                                               {padding:0 10px; color:#9c9c9c; font-size:.8rem; text-decoration:none; border-right:1px solid #999;}
#footerwrap a:first-child                                   {padding-left:0;}
#footerwrap a:last-child                                    {padding-right:0; border:none;} 



li.activemenu, li.normalmenu                                {white-space:nowrap; overflow:hidden;}
li.activemenu                                               {background-color:var(--ciFarbe2);}
div.menupadding                                             {margin:0; padding:0; padding-left:5px;}
ul.menusubpagelist                                          {list-style-type:none; list-style-image:none; margin:0; padding-left:20px; white-space:nowrap; overflow:hidden; background-color:#ffffff;}
ul.submenu, ul.mainmenu                                     {list-style-type:none; list-style-image:none; margin:0; padding:0;}
li.activesubmenulayer3                                      {}
li.normalsubmenulayer3                                      {}
li.mainitem, h2.mainmenu, li.trenner                        {display:inline;}
li.mainitem                                                 {padding-bottom:0;}
h2.mainmenu                                                 {margin:0;}
a.activemenu                                                {color:var(--dgrau);}
a.normalmenu                                                {color:var(--dgrau);}
a.activemenu:hover, a.normalmenu:hover                      {color:var(--ciFarbe2);}
a.activemainmenu,
#navi a.activemainmenu                                      {color:var(--ciFarbe2);}
a.normalmainmenu                                            {}
a.activemainmenu:hover, a.normalmainmenu:hover              {color:var(--ciFarbe2);}

/* xxxxxxxxxxxxxxxxxxx MOBILEMENUE START xxxxxxxxxxxxxxxxxxxxxxxxxxx */
#mobilemenu                                               {overflow:hidden; margin-bottom:20px; text-align:left;}
#mobilemenu *                                             {margin:0px; padding:0px; list-style-type:none; list-style-image:none; text-decoration:none;}
#mobilemenu a                                             {padding:10px 0px 10px 0px; display:block; border-bottom:solid #ffffff47 1px;}
#mobilemenu ul li ul                                      {display:none !important;}
#mobilemenu ul li ul li ul                                {display:none;}
#mobilemenu li                                            {display:block; overflow:hidden;}
#mobilemenu li:first-of-type                              {}
#mobilemenu li span                                       {position:relative;}
#mobilemenu .navspace                                     {width:30px; height:30px; float:right; padding:0px;}
#mobilemenu .navclick                                     {cursor:pointer; padding:0px;}
#mobilemenu #navmore                                      {display:none; background-image:url(../images/page/mobilemenu/plus.png); background-repeat:no-repeat; margin-top:6px;}
#mobilemenu #navless                                      {display:none; background-image:url(../images/page/mobilemenu/minus.png); background-repeat:no-repeat; margin-top:6px;}
#mobilemenu ul li ul li #navmore                          {background-image:url(../images/page/mobilemenu/plus.png); background-repeat:no-repeat; margin-top:6px;}
#mobilemenu ul li ul li #navless                          {background-image:url(../images/page/mobilemenu/minus.png); background-repeat:no-repeat; margin-top:6px;}
#mobilemenu ul li span                                    {display:block; padding-left:0; padding-top:5px; padding-bottom:5px; font-size:16px; text-transform:none; overflow:hidden;}
#mobilemenu ul li span a                                  {color:#fff; width:85%; display:block; float:right; font-weight:300; font-variation-settings:'wght' 300;}
#mobilemenu ul li ul li span                              {display:block; padding-left:10px; padding-top:5px; padding-bottom:5px; font-size:12px; text-transform:none; background-image:none;}
#mobilemenu ul li ul li span a                            {color:#fff; padding-left:20px; box-sizing:border-box;}
#mobilemenu ul li ul li ul li a                           {display:block; padding-left:10px; padding-top:5px; padding-bottom:5px; font-size:14px; color:#fff; text-transform:none; margin-left:30px; background-image:none;}
#mobilemenu a.activemainmenu                              {font-weight:500; font-variation-settings:'wght' 500; color:var(--ciFarbe2); border-bottom:solid 1px var(--ciFarbe2);}
#mobilemenu a.activemainmenu::after                       {display:none;}
#mobilemenu a.activemenu                                  {font-weight:500;font-variation-settings:'wght' 500;}

/* New Navbutton */
#hiddennav                                                {position:fixed; width:270px; top:0px; right:-270px; padding:50px 0 40px 10px; display:block; z-index:50; background:var(--dgrau); overflow-y:scroll; height:100vh; max-height:100vh;}
#hiddennav *                                              {list-style-type:none; list-style-image:none; color:#fff; font-size:18px;}
#navbutton                                                {width:50px; height:50px; right:5px; top:0; position:fixed; display:block; z-index:60; cursor:pointer; background:rgba(255,255,255,0); transform:scale(.75); transform-origin: center;}
.navbutton-line                                           {position:absolute; background-color:#ffffff; height:3px; width:30px; border-radius:1.5px; transition:all 0.5s; transform-origin:50% 50%;}
.navbutton-line:nth-child(1)                              {left:10px; top:12.5px;}
.navbutton-line:nth-child(2)                              {left:10px; top:22.5px;}
.navbutton-line:nth-child(3)                              {left:10px; top:32.5px;}
/* xxxxxxxxxxxxxxxxxxx MOBILEMENUE END xxxxxxxxxxxxxxxxxxxxxxxxxxx */


.myinput, input.text, textarea.text, select                 {border-style:solid; border-width:1px; border-color:silver; margin-top:1px; margin-bottom:1px;}
.login_input                                                {border-style:solid; border-width:1px; border-color:silver; margin-top:1px; margin-bottom:1px;}
input.loginsubmit                                           {margin-top:10px; margin-bottom:10px;}
.login_checkbox                                             {vertical-align:middle;}
.login_submit_area                                          {padding-top:5px;}
select                                                      {background-color:#ffffff;}

.galeriethumb                                               {margin-right:5px; margin-bottom:5px;}

.captcha                                                    {border:solid silver 1px; width:120px;}
img.captcha                                                 {margin-top:8px; margin-bottom:1px;}
input.captcha                                               {margin-bottom:2px;}
#editblock                                                  {max-width:fit-content; width:100%; bottom:0; margin:0 auto; position:fixed; z-index:20;}
#editblock img                                              {vertical-align:middle !important;}

/*MEDIA QUERIES*/
@media(hover:hover) and (pointer:fine) {
 a.button:hover                                             {color:#fff; background-color:green;}
 a:hover                                                    {color:var(--ciFarbe2);}
 #navi li.mainitem:hover h2.mainmenu a:not(.activemainmenu) {color:#fff;} 
 #mobilemenu ul li:hover a:not(.activemainmenu)             {border-bottom:1px dashed var(--ciFarbe2);}
 #navlogo a:hover                                           {color:#fff; opacity:.65;} 
}

@media screen and (min-width: 500px){
 html                                                       {font-size:90%; line-height:90%;}

 #navi                                                      {display:block;}
 #quickmenu ul li                                           {padding:0 10px; font-size:20px; line-height:20px;}
 #quickmenu ul li:last-child                                {padding-right:0;}
 /* xxxxxxxxxxxxxxxxxxx MOBILEMENUE START xxxxxxxxxxxxxxxxxxxxxxxxxxx */
 #navbutton                                                 {display:none;}
 #hiddennav                                                 {display:none;}
 /* xxxxxxxxxxxxxxxxxxx MOBILEMENUE END xxxxxxxxxxxxxxxxxxxxxxxxxxx */
}

@media screen and (min-width: 850px){
 #plx-wrap                                                  {width:50%; height:100%; max-width:var(--maxBreite); left:50vw;}
 #pagelinks                                                 {width:50vw; display:block;}
 #pagelinks img                                             {width:50vw; position:fixed;}
 #nanine_hl                                                 {margin:0; position:relative;}
 #logo                                                      {position:relative; font-size:55px; line-height:55px; justify-content:center; width:100%;}
 #logo-qm-wrap                                              {top:0;}
 #contentwrap                                               {max-width:45vw; margin:0 auto;}
}

@media screen and (min-width:1200px){
 html                                                       {font-size:100%; line-height:100%;}
 #quickmenu ul li                                           {display:inline-block;}
 #quickmenu ul li:first-child                               {padding-left:0; border:none;}
 #logo                                                      {font-size:61px; line-height:61px;}
}

@media screen and (min-width:1280px){
 footer *                                                   {font-size:.8rem;}
}

@media screen and (min-width:1800px){ 
 #schattendorf                                              {left:calc(50vw - (var(--maxBreite)/2));}
 #header                                                    {width:100vw; left:calc(50vw - (var(--maxBreite) / 2)); justify-content:end;}
 #footer                                                    {width:100vw; left:0;}
}


.cl_cookie_privacy_layer {background-color:#353c45 !important;font-family:tahoma, arial; font-size:12px !important;}
.cl_cookie_privacy_layer * {color:#353c45 !important; font-family:tahoma, arial; font-size:12px !important;}
.cl_cookie_privacy_layer span {color:#ffffff !important; font-family:tahoma, arial; font-size:12px !important;}
.cl_cookie_privacy_layer a {background-color:#ffffff !important;}
.cl_cookie_privacy_layer a:first-of-type {color:#353c45 !important; background-color:#5ab031 !important;}
/* Privacy Layer - customized */
.cl_cookie_privacy_layer                                    {width:100vw !important; height:100vh !important; display:grid; align-content:center; background-color:#666666cc !important; }
.cl_cookie_privacy_layer > div                              {padding:20px !important; box-shadow: 0 0 0 5px #fff,20px 20px 50px 0 rgba(0, 0, 0, 0.5);}
.cl_cookie_privacy_layer *                                  {max-width:750px !important; background-color:#353c45 !important; border-radius:20px; color:#fff !important; }

.cl_cookie_privacy_layer a                                  {margin:20px 0 0; padding:10px 15px !important; color:#fff; background-color:#999 !important; border-radius:10px;}
.cl_cookie_privacy_layer a:last-child                       {margin-left:0px;}
#cl_privacy_link_y                                          {color:#fff; background-color:#468b0c !important;}
#cl_privacy_link_n                                          {color:#fff; background-color:#8b0c36 !important; margin-right:40px !important;}