body,html{background:#000;padding:0;margin:0}*{color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:16px;box-sizing:border-box!important}.vierkant_holder{width:100%;height:100vh;display:flex;justify-content:center;align-items:center}.vierkant_holder .vierkant{display:grid;gap:11px;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}@media (orientation: landscape){.vierkant_holder .vierkant{width:80vh;height:80vh}}@media (orientation: portrait){.vierkant_holder .vierkant{width:80vw;height:80vw}}@media (min-width: 800px){.vierkant_holder .vierkant{gap:25px}}.vierkant_holder .vierkant .item{border-radius:3%;overflow:hidden;cursor:pointer;transition:all .125s}@media (min-width: 1024px){.vierkant_holder .vierkant .item{border-radius:1.9%}}.vierkant_holder .vierkant .item img{width:100%;height:100%}.vierkant_holder .vierkant .item:hover{transform:scale(1.2);box-shadow:0 0 25px #000000e6}.vierkant_holder .vierkant .item.fullscreen{width:100vw}.vierkant_holder .vierkant .item:not(.loaded){filter:grayscale(.5)}body{position:relative}.overlay{position:absolute;background:rgba(0,0,0,.5);opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);top:0;left:0;width:100vw;height:100vh;transition:opacity .5s,-webkit-backdrop-filter .5s;transition:opacity .5s,backdrop-filter .5s;transition:opacity .5s,backdrop-filter .5s,-webkit-backdrop-filter .5s;display:flex;align-items:center;justify-content:center}.overlay:not(.active){pointer-events:none}.overlay.active{opacity:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@media (orientation: landscape){.overlay.active{flex-direction:row}}@media (orientation: portrait){.overlay.active{flex-direction:column}}@media (min-width: 600px){.overlay.active{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}}@media (min-width: 1600px){.overlay.active,.overlay.active *{font-size:20px}}.overlay img{border-radius:1.5%;box-shadow:0 0 25px #000000e6}.overlay .description{max-height:100vh;overflow:hidden;display:flex;justify-content:center;align-items:center;flex-direction:column}@media (orientation: landscape) and (max-width: 680px),(orientation: portrait) and (max-height: 680px){.overlay .description,.overlay .description *{font-size:14px}.overlay .description h1{margin:0 0 8px}.overlay .description h3{margin:0}}@media (orientation: landscape){.overlay img{height:70vh;width:auto}.overlay .description{height:90vh}.overlay .description h1{font-size:22px}}@media (orientation: landscape) and (min-width: 680px){.overlay .description h1{font-size:32px;font-weight:400}}@media (orientation: landscape) and (min-width: 1600px){.overlay img{height:60vh;width:auto}.overlay .description{height:100vh;width:40vh;font-size:24px;line-height:35px}.overlay .description h1{font-size:40px;font-weight:400}.overlay .description h3{font-size:24px;font-style:italic;font-weight:400}}@media (orientation: landscape) and (min-width: 1600px){.overlay .description{width:60vh}}@media (orientation: portrait){.overlay img{width:60vw;height:auto}.overlay .description{width:100vw}.overlay .description h1{font-size:22px;margin-top:0}}@media (orientation: portrait) and (min-width: 680px){.overlay .description h1{font-size:32px;font-weight:400}}.overlay .description{text-align:center}.overlay .overlay_nav{display:flex;align-items:center;gap:16px}.overlay .nav_arrow{background:transparent;border:none;font-size:64px;line-height:1;padding:0 4px;cursor:pointer;opacity:.45;transition:opacity .2s}.overlay .nav_arrow:hover:not(:disabled){opacity:1}.overlay .nav_arrow:disabled{opacity:.15;cursor:default}.overlay .description{padding:10px 25px}.overlay img{margin:25px}@media (min-width: 600px){.overlay .description{padding:25px}.overlay img{margin:50px}}@media (min-width: 1024px){.overlay .description{padding:50px}.overlay img{margin:50px}}.topbuttons{z-index:5;position:fixed;top:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;background:#000;border-radius:10px;padding:8px}@media (orientation: landscape) and (min-width: 680px),(orientation: portrait) and (min-height: 680px){.topbuttons{border-radius:20px;padding:16px}}.topbuttons .explanation_btn{text-transform:uppercase;transition:border-color .2s}.topbuttons .explanation_btn:hover{border-color:#ffffffbf}.general_explanation{display:flex;flex-direction:column;justify-content:center;flex-shrink:0;opacity:0;pointer-events:none;color:#ffffffbf}@media (orientation: landscape) and (min-width: 680px),(orientation: portrait) and (min-height: 680px){.general_explanation{line-height:1.7}}@media (orientation: landscape){.general_explanation{width:22vw;max-width:350px;margin-right:max(-350px,-22vw);transform:translate(22vw);transition:margin-right .5s ease,transform .5s ease,opacity .5s ease}}@media (orientation: portrait){.general_explanation{width:90vw;height:25vh;overflow:hidden;margin-bottom:-25vh;transform:translateY(25vh);transition:margin-bottom .5s ease,transform .5s ease,opacity .5s ease}}.general_explanation h1{font-size:22px}.general_explanation p{font-size:14px;margin:0 0 1em;text-align:justify}@media (min-width: 900px){.general_explanation h1{font-size:28px}.general_explanation p{font-size:18px;margin:0 0 1em;text-align:justify}}.vierkant_holder{gap:0;transition:gap .5s ease}@media (orientation: portrait){.vierkant_holder{flex-direction:column}}.vierkant_holder.explanation_mode{gap:4vw}.vierkant_holder.explanation_mode .general_explanation{opacity:1;pointer-events:auto}@media (orientation: landscape){.vierkant_holder.explanation_mode .general_explanation{margin-right:0;transform:translate(0)}}@media (orientation: portrait){.vierkant_holder.explanation_mode .general_explanation{margin-bottom:0;transform:translateY(0)}}.vierkant_holder.explanation_mode .painting_title{opacity:1}.vierkant{background:#000;position:relative;z-index:1}.overlay{z-index:10}.vierkant .item{position:relative;z-index:1}.vierkant .item:hover{z-index:2}.painting_title{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:12px;font-weight:400;background:rgba(0,0,0,.55);padding:6px 4px;line-height:1.35;opacity:0;transition:opacity .5s ease;pointer-events:none}@media (min-width: 1200px){.painting_title{font-size:16px}}@media (orientation: landscape) and (max-width: 819px),(orientation: portrait) and (max-height: 819px){.painting_title{display:none!important}.vierkant_holder{position:relative}.vierkant_holder.explanation_mode{gap:0!important}.general_explanation{position:absolute!important;inset:0;width:auto!important;height:auto!important;max-width:none!important;margin:0!important;transform:none!important;padding:28px 24px;align-items:center;text-align:center;background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:2;transition:opacity .4s ease!important}.general_explanation p{text-align:left;max-width:480px}}.btn{border-radius:5px;background:transparent;border:1px solid rgba(255,255,255,.35);color:#fff;letter-spacing:.15em;font-size:15px;padding:8px;cursor:pointer;text-decoration:none}@media (orientation: landscape) and (min-width: 680px),(orientation: portrait) and (min-height: 680px){.btn{padding:16px}}
