/*Farbpalette:*/
:root {

--schriftfarbe:#474747;

--headerlink:#474747;

--rosa:#f2cdff;

--dunkelrosa:#a7459d;

--link:#3d50a7;
}


body {
margin:0px;
padding-top:0px;
padding-bottom:0px;
padding-left:0px;
padding-right:0px;
text-align: center;
color:var(--schriftfarbe);
font-family: 'Balsamiq Sans', cursive;
height:100%;
/*font-size:1.08em;*/
font-size:1em;
width:100%;
background-color:var(--rosa);
hyphens: auto;
}
@media (min-width:750px) {body{
background-image: url("Konfetti-pastell.png");
background-attachment: fixed;
transition: all 0.3s ease;
}}


html {
padding:0px;
width:100%;
height:100%;
margin:0px;  
}


.hoehe{
    position:relative;
    width:100%;
    min-height:100%;
    background-color:transparent;
        margin: 0 auto;
}
    
.header { 
text-align:center;
margin-left:auto;
margin-right:auto;
margin-bottom:0.1em;
width:100%;
color:var(--schriftfarbe);
background-color:#ffffff;
padding:5px;
box-shadow:none;
height:auto;
box-sizing:border-box;
}
@media (min-width:750px) {.header{
height:11.5em;
margin-bottom:1em;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
}}    


.footeraussen{
    position:absolute;
    bottom:0;
    width:100%;
    padding-top:0;
    margin-top:4em;
    margin-bottom:0;
}

/*.footer{
    box-sizing:border-box;
    text-align:center;
    max-width:900px;
    height:auto;
    position:relative;
    bottom:0;
    margin-top:1.5em;
    margin-left:auto;
    margin-right:auto;
    background-color:var(--rosa);
    color:var(--schriftfarbe);
    font-size:0.8em;
    box-shadow:none;
    border-radius:none;
    padding:1em;
}
@media (min-width:750px) {.footer{
    margin-top:5em;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
    border-top-left-radius:23px;
    border-top-right-radius:23px;
}}    
*/






.footerlink{box-sizing:border-box;
    margin-left:5px;
    margin-right:5px;
    margin-top:5px;
    margin-bottom:5px;
    display:block;
}
@media (min-width:750px) {.footerlink{
    margin-left:2em;
    margin-right:2em;
    margin-top:5px;
    margin-bottom:5px;
    display:inline-block;

}}    





.footerneu{
    box-sizing:border-box;
    text-align:center;
    width:100%;
    height:auto;
    position:relative;
    bottom:0;
    margin-top:3em;
    margin-left:auto;
    margin-right:auto;
    background-color:var(--rosa);
    color:var(--schriftfarbe);
    font-size:0.8em;
    box-shadow:none;
    border-radius:none;
    padding:0.2em;
}
@media (min-width:750px) {.footerneu{
    margin-top:5em;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);

}}    







.headerlinklinks{
text-align:right;
display:inline-block;
color:var(--schriftfarbe);
padding-left:0.3em;
padding-right:0.3em;
float:right;
font-size:0.8em;
}
@media (min-width:1300px) {.headerlinklinks{
    
background-color:transparent;
text-align:right;
font-size:1em;
padding-left:0.4em;
padding-right:0.4em;
transition: all 0.3s ease;
}}
@media (min-width:1600px) {.headerlinklinks{
background-color:transparent;
text-align:right;
font-size:1em;
padding-left:1.1em;
padding-right:1.1em;
transition: all 0.3s ease;
}}
@media (min-width:1850px) {.headerlinklinks{
background-color:transparent;
text-align:right;
font-size:1em;
padding-left:1.6em;
padding-right:1.6em;
transition: all 0.3s ease;
}}





.headerlinkrechts{
text-align:left;
display:inline-block;
color:var(--schriftfarbe);
padding-left:0.3em;
padding-right:0.3em;
min-width:5em;
float:left;
font-size:0.8em;
}
@media (min-width:1300px) {.headerlinkrechts{
background-color:transparent;
text-align:left;
font-size:1em;
padding-left:0.4em;
padding-right:0.4em;
transition: all 0.3s ease;
}}
@media (min-width:1600px) {.headerlinkrechts{
background-color:transparent;
font-size:1em;
padding-left:1.1em;
text-align:left;
padding-right:1.1em;
transition: all 0.3s ease;
}}
@media (min-width:1860px) {.headerlinkrechts{
background-color:transparent;
font-size:1em;
padding-left:1.6em;
padding-right:1.6em;
transition: all 0.3s ease;
}}


.headerlinkoffen{
font-weight:bold;
color:var(--dunkelrosa);
background-color:transparent;
}




.containerlinks {
font-size:1.5em;
transform: translate(0px, -166px);
box-sizing:border-box;
background-color:transparent;
float:left;
top:0px;
width:49.9%;
padding-right:77px;
}
@media (min-width:750px) {.containerlinks{
transform: translate(0px, -44px);
}}    


.containerrechts {
font-size:1.5em;
transform: translate(0px, -166px);
box-sizing:border-box;
background-color:transparent;
float:right;
top:0px;
width:49.9%;
padding-left:77px;
}
@media (min-width:750px) {.containerrechts{
transform: translate(0px, -44px);
}}    





a:link {
transition: all 0.3s ease;
text-decoration:none;
color:var(--link);
background-color:transparent;

}

a:hover { 
color:#cc46af;
background-color:transparent;

}

a:visited:hover { 
color:#cc46af;
background-color:transparent;
}

a:visited {
text-decoration:none;
color:var(--link);
background-color:transparent;
}

a:active {
color:#fff66f;
background-color:transparent;
}






a.headerlink:link {
transition: all 0.3s ease;
font-weight:bold;
text-decoration:none;
color:var(--headerlink);
background-color:transparent;

}

a.headerlink:hover { 
color:#cc46af;
background-color:transparent;

}

a.headerlink:visited:hover { 
color:#cc46af;
background-color:transparent;
}

a.headerlink:visited {
text-decoration:none;
color:var(--headerlink);
background-color:transparent;
}

a.headerlink:active {
color:#fff66f;
background-color:transparent;
}


img.studios{
    width:120px;
}
@media (min-width:900px) {img.studios{
width:460px;
}}

hr {
height: 1px;
color:transparent;
background-color:var(--dunkelrosa);
border: none;
}



.textfeld {
border-color:var(--rosa);
border-style:solid;
border-width:8px;

text-align: justify;
box-sizing:border-box;
margin-left:auto;
margin-right:auto;
margin-top:3em;
margin-bottom:1em;
width:100%;

color:#555555;
background-color: #cffefd;
border-radius:0px;
padding:1em;
box-shadow:none;
}

@media (min-width:750px) {.textfeld{
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
border-radius:23px;
width:80%;
max-width:900px;
padding:3em;
}}


.linkbutton{
box-sizing:border-box;
display:inline-block;
width:auto;
border-radius:0.6em;
background-color:#ffd3f2;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5), inset 0px 0px 10px rgba(0, 0, 0, 0.4);
font-weight:bold;
text-align:center;
margin:1.8em;
padding:0.8em;
}






.linkbuttoninnen {
position:relative;
top:0;
border-color:var(--rosa);
border-style:solid;
border-width:8px;
border-radius:8px;
text-align: center;
box-sizing:border-box;
display:inline-block;
margin-left:auto;
margin-right:auto;
margin-top:0px;
margin-bottom:0;
width:100%;
color:#555555;
background-color:#cffefd;
padding:1em;
box-shadow:none;
transition: all 0.3s ease;
}

@media (min-width:1100px) {.linkbuttoninnen{
width:23em;
border-radius:23px;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
transition: all 0.3s ease;
margin-top:5px;
margin-bottom:5px;
}}
.linkbuttoninnen:hover{
    transform: translate(3px, -3px);
    box-shadow: 3px 3px 16px rgba(0, 0, 0, 0.7);
    transition: all 0.3s ease;
}




.linkbuttoncontainer{
    box-sizing:border-box;
    margin-left:auto;
    margin-right:auto;
    padding:0;
    width:100%;
    height:auto;
    text-align:center;
    background-color:transparent;
}





h1 {
text-align:center;
font-size:1.9em;
color:var(--dunkelrosa);
}

h2 {
text-align:center;
font-size:1.3em;
color:var(--dunkelrosa);
}


h3 {
text-align:center;
font-size:1.1em;
color:var(--dunkelrosa);
}



ul.tabus {
  list-style: none; /* Remove default bullets */
}

ul.tabus li::before {
  content: "X ";
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 2em; /* Also needed for space (tweak if needed) */
  margin-left: -2em; /* Also needed for space (tweak if needed) */
  margin-top:0.5em;
  margin-bottom:0.5em;
}














@keyframes lightboxauf {
    
  0%   {          z-index:5;
      opacity:0;
    position:fixed;
    border:none;
    width:100%;
    height:100%;
left:auto;
right:auto;
    margin-top:0px;
    margin-bottom:0px;
}


  100% { opacity:1;
          z-index:5;
    position:fixed;
    border:none;
    width:100%;
    height:100%;
left:0;
right:auto;
    margin-top:0px;
    margin-bottom:0px;
}
}






@keyframes lightboxzu {
  0%   {
    border:none;
    width:100%;
    height:100%;
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
    margin-bottom:0px;
}





  100% { 
    width:295px;
    height:auto;
    margin-left:auto;
    margin-right:auto;
    margin-top:10px;
    margin-bottom:10px;
    border-style:solid;
    border-width:5px;
    border-color:#f2cdff;
    border-radius:7px;
}
}




.galeriebild{
    
    animation-name: lightboxzu;
    animation-duration: 0.4s;
    
    display:inline-block;
    position:static;
    border-style:solid;
    border-width:5px;
    border-color:#f2cdff;
    border-radius:7px;
    cursor:pointer;
    background-size: contain;
    background-position:center top;
    background-repeat:no-repeat;
    background-color:#f2cdff;
    width:295px;
    height:auto;
    margin-left:10px;
    margin-right:10px;
    margin-top:10px;
    margin-bottom:0px;
    padding:0px;
    transition: border 0.4s, box-shadow 0.4s ease;
    box-shadow:none;
}
.galeriebild:hover{
        border-color:#a7459d;
        transition: border 0.4s, box-shadow 0.4s ease;
        box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
}





.galeriebildanfang{
    display:inline-block;
    position:static;
    border-style:solid;
    border-width:5px;
    border-color:#f2cdff;
    border-radius:7px;
    cursor:pointer;
    background-size: contain;
    background-position:center top;
    background-repeat:no-repeat;
    background-color:#f2cdff;
    width:295px;
    height:auto;
    margin-left:10px;
    margin-right:10px;
    margin-top:10px;
    margin-bottom:0px;
    padding:0px;
    transition: border 0.6s, box-shadow 0.6s ease;
    box-shadow:none;

}
.galeriebildanfang:hover{
        border-color:#a7459d;
        transition: border 0.4s, box-shadow 0.4s ease;
        box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);
}




.galeriebildgross{
    z-index:5;
    position:fixed;
    overflow:visible;
    top:0px;
    background-image:none;
    text-align:center;
    cursor:pointer;
    background-color:rgba(0, 0, 0, 0.8);
    animation-name: lightboxauf;
    animation-duration: 0.4s;
    width:100%;
    height:100%;
    padding:0px;
left:0;
right:auto;
}

.lightboxinnen{
    position:relative; top:0px;
    background-color:transparent;
    width:100%;
    overflow:scroll;
    height:100%;
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    }}
    .lightboxinnen::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}




.galerietext{
    box-sizing:border-box;
    cursor:pointer;
    background-color:#f2cdff;
    color:#000000;
    width:100%;
    height:auto;
    padding:5px;
    position:relative;
    margin-left:0px;
    margin-right:0px;
    bottom:0px;
    display:inline-block;
    text-align:left;
}