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

/*#########################################################*/
/*##########LAYOUT#########################################*/
/*#########################################################*/
:root{--website-background:#fff;}
@media (min-width:1000px){html{scroll-behavior:smooth;scroll-padding-top:1rem;}}
@media (max-width:999px){html{scroll-behavior:smooth;scroll-padding-top:0.25rem;}}
@media (min-width:1000px){
  html:not(.glightbox-open){scrollbar-gutter:stable;}
  body.glightbox-open:not(.gscrollbar-fixer){scrollbar-gutter:stable;margin-right:0;}
}
body{font-size:16px;font-family:sans-serif;color:#464646;background:var(--website-background);}
main h1,main h2,main h3,main h4,main h5,main h6{color:#222222;}

/*----------DESKTOP----------------------------------------*/
@media (min-width:1000px){
  div#container{width:100%;max-width:1800px;margin:2.5rem auto;padding:0 3rem;box-sizing:border-box;}
  header, main, footer{width:100%;}
  header{display:flex;gap:0.2em 2em;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;}
  main{margin:1rem 0;}
  footer{clear:both;}
}
/*header*/
@media (min-width:1000px){
  header span.website-title{color:#222222;font-size:2.3em;display:inline-block;}
  header span.website-title:hover{cursor:pointer;}
  header span.website-tagline{margin-top:0.1rem;font-size:0.92em;display:block;}
}
/*nav (classic)*/
@media (min-width:1000px){
  header nav {font-size:1.1em;width:100%;}
  header nav ul{display:flex;flex-wrap:wrap;gap:0.5em 1.5em;list-style:none;}
  header nav ul li{position:relative;}
  header nav ul li .nav-item-title{color:#343434;text-decoration:none;letter-spacing:0.025em;font-weight:300;}
  header nav li a:hover, header nav li.active > a{color:#aaaaaa;}
  header nav > ul > li > ul {font-size:0.96em;z-index:100;display:none;position:absolute;margin-left:-0.4em;padding:0.4em;background:var(--website-background);box-shadow:0 0 0.25em 0 rgba(0,0,0,0.1);box-sizing:border-box;}
  header nav > ul > li:hover ul, header nav > ul > li:focus ul, header nav > ul > li:focus-within ul{display:block;}
  header nav > ul > li > ul li{line-height:2em;padding:0 0.2em 0.2em 0.2em;white-space:nowrap;}
  header nav > ul > li > ul li:last-child{padding-bottom:0;}
}
/*footer*/
@media (min-width:1000px){
  footer nav ul.secondary li{font-size:0.96em;}
}

/*----------MOBILE----------------------------------------*/
@media (max-width:999px){
  div#container{padding:0 1rem;width:100%;box-sizing:border-box;}
  header, main, footer{width:100%;box-sizing:border-box;}
  header{margin-top:0.2em;padding:1.2rem 36px 1.2rem 0;background-image:url(../img/menu_light.png);background-position:center right;background-repeat:no-repeat;background-size:16px 12px;}
  header.shownav{background-image:url(../img/menu-close_light.png);background-size:16px 16px;}
  body::after{position:absolute;width:0;height:0;overflow:hidden;z-index:-1;content:url(../img/menu-close_light.png);} /*preload image*/
  main{margin-top:1rem;margin-bottom:1rem;}
  footer{margin-bottom:2rem;}
}
/*header*/
@media (max-width:999px){
  header div.title-container{display:flex;align-items:center;justify-content:space-between;}
  header span.website-title{font-size:6vw;color:#222222;line-height:1em;display:inline-block;word-break:break-word;}
  header span.website-title:hover{cursor:pointer;}
  header span.website-title a{vertical-align:bottom;}
  header span.website-tagline{display:none;}
}
/*nav (modern)*/
@media (max-width:999px){
  header nav {position:static;}
  header nav ul {line-height:1.6em;list-style:none;}
  header nav > ul{margin-top:1.2rem;text-align:center;z-index:1000;display:none;position:absolute;left:0;width:100%;border:0;background:var(--website-background);box-shadow:0 6px 8px rgba(0, 0, 0, 0.2);border-top:1px solid #f4f4f4;}
  header.js-nav.shownav nav > ul, header:not(.js-nav):hover nav > ul, header:not(.js-nav):active nav > ul{display:block;}
  header nav > ul > li{padding:0.3rem;}
  header nav > ul li{width:100%;box-sizing:border-box;}
  header nav > ul li > .nav-item-title{color:#222222;font-size:1.1em;font-weight:700;padding:0.4rem 0.6rem;width:100%;display:inline-block;box-sizing:border-box;text-align:left;text-decoration:none;letter-spacing:0.04em;}
  header nav ul li a:hover, header nav ul li a:active{text-decoration:underline;text-underline-offset:0.2em;}
  header nav > ul ul{margin-top:-0.4rem;}
  header nav > ul ul li .nav-item-title{font-size:0.96em;font-weight:600;padding:0.3rem 0.6rem 0.3rem 1.6rem;}
}
@media (max-width:999px){ /*hide nav icon when no links*/
  header:not(:has(nav ul li)) nav {display:none;}
  header:not(:has(nav ul li)){background-image:none!important;}
}
@media (max-width:999px){ /*full height*/
  body.shownav header nav > ul {height:calc(100dvh - 1.2rem - 2.6rem - 1rem + 1rem);overflow:auto;}
  body.shownav header nav > ul > *:last-child{padding-bottom:2rem;}
  body.shownav{overflow:hidden;}
}
@media (max-width:999px){ /*effect*/
  header.js-nav nav > ul{display:block;} /*reset*/
  body header nav > ul {height:calc(100dvh - 1.2rem - 2.6rem - 1rem + 1rem);} /*reset*/
  header.js-nav nav ul {opacity:0;max-height:0;overflow:hidden;transition:max-height 0.25s ease-out;}
  header.js-nav.shownav nav ul{opacity:1;max-height:100vh;transition:max-height 0.25s ease-out;}
  header.js-nav nav > ul > li{opacity:0;transition:opacity 0.25s ease-out;}
  header.js-nav.shownav nav > ul > li{opacity:1;transition:opacity 0.8s 0.1s ease-out;}
}
/*footer*/
@media (max-width:999px){
  footer, footer *{justify-content:center;text-align:center;}
  footer ul.secondary{font-size:0.96em;}
}


/*#########################################################*/
/*##########CUSTOM#########################################*/
/*#########################################################*/
/*---Flavor:LAYOUT_SPECIAL---*/
@media (min-width:1000px){
  div#container{max-width:1400px;margin-top:3rem;}
  header nav ul {font-size:0.95em;}
  footer nav{flex-basis:initial;} /*footer right*/
}

/*---Flavor:MOBILE_TOP_WHEN_PHOTO_OR_ARTICLE---*/
@media (max-width:999px){
  main.template-photo div.photo-image img.photo{margin-top:-1rem;}
  main.template-blog article.style-article .header .article-image.image-available{margin-top:-1rem;}
}
/*---Flavor:MOBILE_TOP_WHEN_NOHEADING---*/
@media (max-width:999px){
  main{margin-top:0;}
  main:has(h1.mobile:first-child), main.template-photo{margin-top:1rem;}
}

/*---Flavor:TEXT_JUSTIFY---*/
@media (min-width:1000px){main p, main blockquote{text-align:justify;}}

/*---Flavor:GALLERY_SET_LAYOUT_GRID-LEFT---*/
@media (min-width:1000px){
  ul.gallery.gallery-set.layout-grid li span {text-align:left;}
  ul.gallery.gallery-set.layout-grid li div.photo-wrapper.photo-portrait{margin-left:0;}
}
/*---Flavor:GALLERY_SET_LAYOUT_WALL-LEFT---*/
@media (min-width:1000px){
  ul.gallery.gallery-set.layout-wall li span {text-align:left;}
}

/*---Flavor:LAYOUT_RIGHT2---*/
@media (min-width:1000px){
  header span.website-tagline{margin-bottom:0.5rem;}
}

/*---Flavor:SET/ALBUMS/ALBUM---*/
/*links-prevnext (left/right)*/
@media (min-width:1000px){
  main.template-set p.links-prevnext, main.template-set p.links-prevnext.only-next{justify-content:space-between;}
  main.template-set p.links-prevnext.only-next{justify-content:flex-end;}
}

/*---Flavor:SET/ALBUMS/ALBUM---*/
/*slideshow max height*/
@media (min-width:1000px){ 
  main.template-album, main.template-albums, main.template-set{ul.gallery.layout-slideshow ul.slideshow{max-height:calc(100vh - 5.5em);}}
}
/*---Flavor:PHOTOSITE---*/
/*photo max height*/
@media (min-width:1000px){main.template-photo div.photo-image img.photo{max-height:calc(100vh - 5.5em);}}
@media (min-width:1000px){
  /*two column layout*/
  main.template-photo div.sectioncontainer{display:flex;column-gap:3em;flex-wrap:nowrap;justify-content:space-between;}
  main.template-photo div.sectioncontainer section.sectionaside{}
  main.template-photo div.sectioncontainer aside.sectionaside{width:260px;margin-top:0;}
  /*sidebar flat*/
  main.template-photo aside.sectionaside-photo{display:flex;flex-flow:column wrap;gap:0;}
  main.template-photo aside.sectionaside-photo > *{line-height:1.8em;}
  main.template-photo aside.sectionaside-photo *{order:1;}  
  main.template-photo aside.sectionaside-photo .photo-contextphotos{order:0;}
  main.template-photo aside.sectionaside-photo h2{margin-top:1.5em;}
  main.template-photo aside.sectionaside-photo h2.photo-contextphotos{margin:0;display:none;}
  main.template-photo aside.sectionaside-photo *:not(h2){font-size:0.96em;}
  main.template-photo ul.tags li {padding:0.1em 0.5em;} /*font-size:0.85em;*/
  main.template-photo ul.photo-albums{display:block;}  
}
/*contextphotos as mosaic*/
@media (min-width:1000px){
  main.template-photo{--gallery-card-spacing:2px;}
  main.template-photo ul.gallery.layout-card li img.photo{aspect-ratio:1/1;}
  #container main.template-photo ul.gallery.layout-card li{width:calc(33.33% - var(--gallery-card-spacing));}
}
/*prev-next links last*/
/*
@media (min-width:1000px){
  main.template-photo section{display:flex;flex-direction:column;}
  main.template-photo section .photo-prevnext{order:99;}
  main.template-photo .photo-contextlink{margin-bottom:0;}
}
*/
/*photo left*/
main.template-photo section.sectionaside-photo img.photo{object-position:0 0!important;}





body.mode-light{
  --website-border:#f4f4f4;
  --nav-bordered-active-fontcolor:#f4f4f4;
  --nav-bordered-active-background:#222222;
}
body.mode-dark{
  --website-border:#222222;
  --nav-bordered-active-fontcolor:#f4f4f4;
  --nav-bordered-active-background:#222222;
}
/*---Flavor:LAYOUT_LINE---*/
@media (min-width:1000px){
  body footer{padding-top:0.5rem;border-top:1px solid var(--website-border);}
}
@media (max-width:999px){
  body header{border-bottom:1px solid var(--website-border);}
  body footer{padding-top:0.5rem;border-top:1px solid var(--website-border);}
}

/*---Flavor:NAV_BORDERED---*/
@media (min-width:1000px){ 
  header nav {font-size:1em;width:100%;border-top:1px solid var(--website-border);border-bottom:1px solid var(--website-border);}
  header nav ul{gap:0;}
  header nav ul li{display:inline-block;padding:0.5em;border-right:1px solid var(--website-border);}
  header nav ul li:first-child{border-left:1px solid var(--website-border);margin-left:1rem;}
  header nav ul li > .nav-item-title{display:block;padding:0.4em 1em;line-height:2em;color:#343434;text-decoration:none;text-transform:uppercase;letter-spacing:0.05em;}
  header nav li a:hover, header nav li.active > a{color:var(--nav-bordered-active-fontcolor)!important;background:var(--nav-bordered-active-background);}
  header nav > ul > li{position:relative;}
  header nav > ul > li > ul {z-index:100;display:none;min-width:calc(100% + 2px);position:absolute;left:0.4em;margin-top:0;padding:0.4em;background:var(--website-background);border:1px solid var(--website-border);border-top:0;box-shadow:0.05em 0.5em 0.5em 0 rgba(0,0,0,0.1);box-sizing:border-box;}
  header nav > ul > li:hover ul, header nav > ul > li:focus ul, header nav > ul > li:focus-within ul{display:block;}
  header nav > ul > li > ul li{padding:0.2em;white-space:nowrap;border-left:0!important;border-right:0!important;border-top:1px solid var(--website-border);width:100%;margin-left:0!important;box-sizing:border-box;}
  header nav li.linktemplate-basket > a:hover > span,
  header nav li.linktemplate-basket.active > a > span{color:var(--nav-bordered-active-fontcolor);}
}

/*---Flavor:PAGINATION_BORDERED---*/
body.mode-light ul.pagination{column-gap:0.25em;}
body.mode-light ul.pagination li{margin:0;}
body.mode-light ul.pagination li.link-page:hover, ul.pagination li.link-page.active {border:0;}
body.mode-light ul.pagination li:not(.link-page):not(.link-prev):not(.link-next){display:inline-block;}
body.mode-light ul.pagination li a{padding:0.25em 0.5em;margin:0.15em;}
body.mode-light ul.pagination li span{display:block;padding:0.35em 0.25em;margin:0.15em;}
body.mode-light ul.pagination li a{border:1px solid rgb(0 0 0 / 0.04);}
body.mode-light ul.pagination li a:hover, ul.pagination li.active a{color:#383838;background:rgb(0 0 0 / 0.03);border:1px solid rgb(0 0 0 / 0.04);}






/*---Flavor:FONTFACE(SourceSans light)-NAV-CLASSIC---*/
@media (min-width:1000px){
  body.font-sourcesanslight header nav > ul > li > .nav-item-title{font-size:1em;font-weight:400;}
  body.font-sourcesanslight header nav > ul{margin-bottom:0;}
}
@media (max-width:999px){
  body.font-sourcesanslight header nav > ul li > .nav-item-title{letter-spacing:0.25em;}
}