/* CMS and Theme by IO200 CMS (https://www.IO200.com) */

/*#########################################################*/
/*##########LAYOUT#########################################*/
/*#########################################################*/
/*Variables*/
:root{--website-background:#fff;}
:root{--website-maxwidth:1460px;}
:root{--website-mainspacing:1rem;}
/*Basic*/
@media (min-width:1000px){
  html:not(.glightbox-open):not(:has(.template-basket)){scrollbar-gutter:stable;}
  body.glightbox-open:not(.gscrollbar-fixer){scrollbar-gutter:stable;margin-right:0;}
}
html {scroll-behavior:smooth;} /*scroll-padding-top:var(--header-height, 0);*/
body{font-size:15.2px;font-family:sans-serif;color:#464646;background:var(--website-background);}
/*Layout*/
div#container{width:100%;min-height:100dvh;box-sizing:border-box;}
header, main, footer{margin-inline:auto;padding:var(--website-mainspacing);width:100%;max-width:var(--website-maxwidth);box-sizing:border-box;}
main{padding-block:0;}
footer{padding-bottom:calc(var(--website-mainspacing) * 2);}
/*Layout Special*/
body.template-set, body.template-albums, body.template-album, body.template-photo, body.template-basket{--website-maxwidth:100%;}
body.template-set header, body.template-albums header, body.template-album header, body.template-photo header, body.template-basket header{top:0;position:sticky;z-index:2;background:var(--website-background);}
body.template-basket main{scroll-margin-top:12rem;}

/*cover*/
cover{z-index:100;position:relative;width:100%;height:100dvh;display:block;}
cover div.cover-container, cover div.cover-container *{width:100%;height:100%;}
cover div.cover-container img.photo{width:100%;height:100%;object-fit:cover;}
cover div.cover-container::before{content:"";z-index:1;position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;background:linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 25%);}
cover div.title-container{padding:0 min(4vw, 5rem);width:100%;position:absolute;bottom:0;z-index:2;box-sizing:border-box;}
cover div.title-container{color:#fff;flex-direction:column;justify-content:flex-end;align-items:center;display:flex;}
cover div.title-container span.website-title,
cover div.title-container span.website-tagline{word-break:break-word;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;text-shadow:2px 2px 6px rgba(0,0,0,0.12);text-align:center;}
cover div.title-container span.website-title{font-size:3.2em;margin-bottom:0.2em;-webkit-line-clamp:4;}
cover div.title-container span.website-title a{line-height:1em;text-align:center;}
cover div.title-container span.website-tagline{font-size:1.2em;-webkit-line-clamp:3;}
cover div.title-container span.cover-link{font-size:4em;margin-block:min(5vw, 2.5rem);}
cover div.title-container span.cover-link a{display:flex;}
cover div.title-container span.cover-link svg{width:1em;height:auto;fill:#fff;filter:drop-shadow(2px 2px 4px rgba(0,0,0,0.4));}
@media (max-width:600px){
  cover div.title-container{font-size:3.6vw;}
  cover div.title-container span.website-title{font-size:2.4em;}
}
cover div.title-container span.cover-link svg {animation:bounce 1.5s infinite;}
@keyframes bounce {0%, 100% {transform:translateY(-5px);} 50% {transform:translateY(5px);}}

/*header*/
header {z-index:100;gap:calc(var(--website-mainspacing) * 2);justify-content:space-between;flex-direction:row;flex-wrap:nowrap;display:flex;}
header div.title-container{font-size:1.2rem;overflow:hidden;flex-direction:column;justify-content:center;align-items:center;display:flex;}
header div.title-container > *{text-align:left;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:block;}
header div.title-container span.website-title a{font-size:1.1em;display:inline;}
header div.title-container span.website-title a:hover{text-decoration:underline;text-underline-offset:0.15em;text-decoration-thickness:1.5px;}
header div.title-container span.website-tagline{font-size:0.8em;margin-top:0.1em;}
header div.action-container{font-size:1.2rem;gap:1.5rem;align-items:center;display:flex;}
header div.action-container span{cursor:pointer;}
header div.action-container span:not(.basket){margin-block:-0.4em;font-size:1.4em;line-height:1em;display:flex;}
header div.action-container span:not(.basket) svg{width:1em;height:auto;}
@media (max-width:999px){header div.title-container{font-size:1.1rem;}}
@media (max-width:400px){header div.title-container{font-size:4.8vw;}}
header span{color:#222222;}
body.mode-dark header span{color:#fff;}
@media (min-width:1000px){header div.title-container > *{max-width:min(60rem, 80vw);}}

/*main*/
main h1.desktop, main h1.mobile{display:none!important;}

/*footer*/
footer p.footer-info{text-align:center;font-size:0.85em;}
footer p.footer-info a:hover{color:#000;}
footer p.footer-info a.footer-link{font-size:10.5px;text-transform:uppercase;}
footer p.footer-info a.footer-link.has-successor:before{content:"";display:block;margin-top:0.75em;}

/*#########################################################*/
/*##########ELEMENTS#######################################*/
/*#########################################################*/
/*backlink*/
div.backlink{margin-bottom:1em;}
@media (min-width:1000px){div.backlink{font-size:1em;display:inline-block;}}

/*basket icon*/
header div.action-container span.basket{margin:0;margin-block:-0.4em;font-size:0.8em;display:flex;}

/*div.action-bar*/
@media (min-width:1000px){div.action-bar{position:fixed;right:1rem;bottom:0.75rem;margin-bottom:0;}}
@media (max-width:999px){div.action-bar-container:not(.active){display:none;}}

/*template-_password*/
body.template-_password header{padding-block:2rem 4rem;}
body.template-_password header {justify-content:center;gap:0;}
body.template-_password header span {text-align:center;}
body.template-_password header action-container{display:none;}
body.template-_password main div.breadcrumb{margin-inline:auto;width:max-content;}
body.template-_password main p{text-align:center;}
body.template-_password main form.form-inline{justify-content:center;}
body.template-_password main form.form-inline p{text-align:center;}

/*span.admin-action*/
span.admin-action {vertical-align:middle;margin-top:0;}
header span.admin-action{font-size:0.5em;margin:0 0.25em 0.25em 0.25em;}
cover span.admin-action {font-size:0.6em;box-shadow:rgb(0 0 0 / 6%) 1px 1px 1px 0px,rgb(0 0 0 / 12%) 0px 0px 0px 1px,rgb(0 0 0 / 24%) 2px 2px 2px 0px;}