/**
 * Style sheet Stylesheet_WolfvonWaldow, Copyright CompuSense info@CompuSense.de
 */

/* Basic settings */
body { margin:0;line-height: 1.45; padding:0; font-size: var(--rootfz);  text-align:left; position:relative; color: var(--dark); font-family: var(--font)}
body p, body ol{font-family: var(--font2)}

select, input, textarea { font-size:99%; }
form  { margin:0; padding:0; }
img { border:0; }
figure {position: relative; width: fit-content}
li {padding: 5px 0 !important ;}
.desktopNot {display: none}
h1 {color: var(--rot)}
h1, h2, h3, h4, h5, h6, h1 + div , .content-gallery  {margin-top: var(--abs) !important;}
p {color: var(--dark)}
a{color: var(--dark)}
a:hover {color: var(--rot)}

a[href^="http"]:not([href*="vonwaldow.de"])::after {content: "";display: inline-block;width: 0.9em;height: 0.9em;margin-left: 0.25em;vertical-align: baseline;background: url("externerLink.svg")   no-repeat; background-size: cover}

strong {}
td {vertical-align:top; padding: 3px 13px 0 0 }
input, textarea {border: #666 0px solid ; background:#666; color:#fff; height:14px; width:765px;font-size: 9pt; font-family: trebuchet MS, Tahoma; font-style: normal;}
form {margin-bottom: 27px; margin-top: 5px}
.submit {background: #AEAEAE}
.ce_text {width:700px}
p {text-align: justify; hyphens: auto}

.onepage-navigation-placeholder{line-height: 2;}
sub {vertical-align: sub;font-size: 63%;}

    /*.content-element-group {display: flex; justify-content: space-between}*/
.content-element-group img:hover {filter: grayscale(1)}

/*Header*/
#container {}


#container #main {}
#container #main .inside {margin: 0 auto; max-width: var(--total)}
#container #main  h1{ padding: 0; padding-top: var(--abs) }

.breit {width: var(--breit);margin: 0 auto;max-width: var(--total)}
.schmal, .content-text{width: var(--schmal);margin: 0 auto;max-width: 1200px; }

header .content-image, header nav ul {width: var(--breit);max-width: var(--total); margin: 0 auto; }
header nav ul {display: flex;
    justify-content: flex-end;
    padding: var(--absklein) 0;}
header nav ul li {margin-left: var(--abs)}
header .content-image figure {position: absolute}
header .content-image figure img {width: 80%; padding-top: var(--absklein)}
header #architekturbezogenekunst.content-image figure img {padding-top: 1.5rem;}
@media (max-width: 1500px) {
    header nav ul {max-width: 80%}
    header .content-image figure img {padding-left: var(--abs);padding-top: calc(0.9*var(--absklein));}
    header #architekturbezogenekunst.content-image figure img {padding-top: 1.2rem;}
}
@media (max-width: 1200px) {
    header .content-image figure img {width: 70%}
    header #architekturbezogenekunst.content-image figure img {padding-top: 1.4rem;}
}
@media (max-width: 1000px) {
    header .content-image figure img {width: 50%}
    header #wolfvonwaldow.content-image figure img {padding-top: 1.6rem;}
    header #architekturbezogenekunst.content-image figure img {padding-top: 2.6rem;}
}
    /* Navigation */
.mod_navigation {background-color: var(--hellgrau)}
.module-onepage-navigation {background-color: var(--grau)}
.module-onepage-navigation ul {}
#left  { text-align: left;  padding: 0; margin-top: 40px; }
#container #left .inside    { text-align: left ;margin: 0; padding: 0 }
#left ul {margin: 0 ; padding: 0}
li    {  list-style-type: none; padding: 0;  }
header li a  {color: #fff; text-decoration: none; }
header li a:link  {color: #fff; text-decoration: none; }
header li a:visited  { color: #fff; text-decoration: none; }
header li a:hover  { color: var(--dark); text-decoration: none;  }
li .active  { color: var(--rot);  text-decoration: none;}
ul.level_1 li.trail  a.trail { color: var(--rot);  text-decoration: none; }




/*slider*/

.rsts-slide, .rsts-thumbs-slide, .rsts-crop, .rsts-thumbs-crop { overflow:visible}
.rsts-skin-default .rsts-caption { top: 410px; background:none; padding:0; left:0 }
.rsts-caption {transform: none !important; transition: none !important}



.rsts-thumbs-crop {margin-top:50px; width: auto}
.rsts-thumbs-slides {transform: none !important}
.rsts-thumbs-active-thumb img  {-webkit-filter: grayscale(1);filter: grayscale(1); -moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);}

.rsts-skin-default.rsts-main {max-width: 100%}

.rsts-skin-default .rsts-active .rsts-caption {display: none}

.rsts-skin-default .rsts-nav-bullets a {font-size: 0}

/*galerien*/
.content-gallery ul{display: flex; flex-wrap: wrap; justify-content: space-between; }

.content-gallery ul li {flex-basis: 30%;}
.content-gallery.vierbilder ul li {flex-basis: 23% }
.content-gallery.zweibilder ul li {flex-basis: 48.5%;}

.content-gallery figcaption {font-size: 70%}

body:not(.allebilder) .content-gallery:not(.show-all) ul li:nth-child(n+7) {    display: none !important;}
body:not(.allebilder) .vierbilder.content-gallery:not(.show-all) ul li:nth-child(7), body:not(.allebilder) .vierbilder.content-gallery:not(.show-all) ul li:nth-child(8) {    display: block !important;}
body:not(.allebilder) .vierbilder.content-gallery.show-all ul li:nth-child(21) {    display: none !important;}

.gallery-toggle-btn {    display: block;    margin: 20px auto;    background: none;    border: none;    cursor: pointer;    padding: 0;}
.gallery-toggle-btn img {    display: block;    max-width: 100%;    height: auto;}
.gallery-toggle-btn:hover {filter: grayscale(1)}


/*zitate*/
#zitat figure {position: relative;max-width: 52rem;margin: 3rem auto;padding: 2.5rem 3rem 2rem;background: #fafafa;border-radius: 0 0.8rem 0.8rem 0;box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 8%);}
#zitat figure::before {    content: "“";    position: absolute;top: -0.5rem;left: 1rem;font-family: Georgia, serif;font-size: 7rem;line-height: 1;color: rgb(138 111 82 / 20%);}
#zitat figure blockquote {margin: 0;padding: 0;border: 0;}
#zitat figure blockquote p {position: relative;margin: 0;font-family: Georgia, "Times New Roman", serif;font-size: clamp(1rem, 0.95rem + 0.25vw, 1.2rem);line-height: 1.35;}
#zitat figure figcaption {margin-top: 1.5rem;padding-top: 1rem;border-top: 1px solid rgb(48 47 47 / 15%);font-size: 0.95rem;line-height: 1.5;text-align: right;}
#zitat figure figcaption::before {}
#zitat figure cite {font-style: normal;}
cite a {color: var(--dark)}
cite a:hover {color: var(--rot)}

cite.article-title {font-style: normal;}


    /*footer*/
footer {max-width: var(--total);margin:  calc(2*var(--abs)) auto 0 auto;background: var(--hellgrau);line-height: 1;padding-top: calc(0.5*var(--absklein));}
footer ul {display: flex}
footer ul li{margin-left: var(--abs);}
footer li a, footer li a:link, footer li a:visited {color: #fff; text-decoration: none; margin: 0}
footer li a:hover {color: var(--dark)}

/*elemente*/
#totoplink button {background: transparent; border: none; cursor: pointer;}
#totoplink {position: fixed; bottom: 0;right: 20px;max-width: 40px;}
.infoblock p {color: var(--grau);font-family: Georgia, "Times New Roman", serif;font-size: clamp(1rem, 0.95rem + 0.25vw, 1.2rem);line-height: 1.35 }
hr {    width: 50%; margin: 0 auto;border: 0;border-top: 1px solid rgb(48 47 47 / 15%);}
#totoplink:hover {filter: grayscale(1)}


/*copyright*/
.image-license {font-size:  var(--font-copy); color:var(--copy);display: block; transform: rotate(180deg);top: 10px;position: absolute;right: 0;writing-mode: vertical-lr;}
.image-license a {color:var(--copy);}
.image-license a[href^="http"]:not([href*="vonwaldow.de"])::after {filter: grayscale(100%);rotate: 75deg;}

.content-gallery figure .image-license {opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;}
.content-gallery figure:hover .image-license {opacity: 1;visibility: visible;}

/* Beschreibung der Arbeit*/
.arbeit {margin-bottom: var(--abs)}
.arbeit p, .arbeit h2 {color:var(--grau) !important; margin-bottom: 0.4em; font-size: calc(var(--rootfz) * 0.85);
    line-height: 1.2;}
.arbeit h2 {font-size: 1em;font-family: var(--font2); font-weight: 600; margin-bottom: 1.4em; }

.literatur {position: relative;font-size: var(--litfz);margin-bottom: var(--abs);margin-top: var(--abs);line-height: 1.2;}
.literatur p{text-align: left; }