*, *::before, *::after, :link, :visited, :focus {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    padding: 0;
    margin: 0;
    outline: 0 none;
    border: 0 none;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-family: inherit;
    vertical-align: baseline;
    text-decoration: inherit;
    color: inherit;
    line-height: 125%;
}

html {
    height: 100%;
    font-size: 16px;
    font-family: Verdana, Geneva, sans-serif;
}

ul, ol {
    list-style: none;
}

img {
    display: block;
    margin: 0 auto;
}

input::-moz-focus-inner, a::-moz-focus-inner {
    border:none;
}

figcaption, span {
    overflow-x: hidden;
    text-overflow: ellipsis;
}



body.std {
    background-color:#d0c9ce;
}

body.std div#layout {
    background-color: #f7f4f6;
    color: #4a4a4a;
    margin: 10px 0;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;    -webkit-box-shadow: 0px 0px 22px 0px #000;-moz-box-shadow: 0px 0px 22px 0px #000;box-shadow: 0px 0px 22px 0px #000;}

@media screen and (min-width: 400px) {
    body.std div#layout {
	margin: 10px 2%;
    }
}

@media screen and (min-width: 1000px) {
    body.std.narrow div#layout {
	width: 961px;
	margin: 10px auto;
    }
}

body.std header#mainheader {
    background-color: #6d325e;
    background-image: linear-gradient(#6d325e, #f7f4f6);
    background-position: left bottom;
    background-repeat: repeat-x;
    -webkit-background-size: 1px 4px;-moz-background-size: 1px 4px;-o-background-size: 1px 4px;background-size: 1px 4px;    color: #fffff0;
    padding: 16px 2% 20px;
    font-size: 200%;
    font-weight: bold;
    text-align: center;
    -webkit-border-top-left-radius: 4px;-moz-border-top-left-radius: 4px;border-top-left-radius: 4px;    -webkit-border-top-right-radius: 4px;-moz-border-top-right-radius: 4px;border-top-right-radius: 4px;}

body.std header#mainheader img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}

@media screen and (min-width: 647px) {
    body.std header#mainheader img {
	width: 600px;
    }
}

body.std footer#mainfooter {
    background-color: #6d325e;
    background-image: linear-gradient(#f7f4f6, #6d325e);
    background-position: left top;
    background-repeat: repeat-x;
    -webkit-background-size: 1px 4px;-moz-background-size: 1px 4px;-o-background-size: 1px 4px;background-size: 1px 4px;    color: #fffff0;
    border-color: #fffff0;
    padding: 14px 4px 10px;
    -webkit-border-bottom-left-radius: 4px;-moz-border-bottom-left-radius: 4px;border-bottom-left-radius: 4px;    -webkit-border-bottom-right-radius: 4px;-moz-border-bottom-right-radius: 4px;border-bottom-right-radius: 4px;}

body.std footer#mainfooter nav a:link {
    display: inline-block;
    text-align: center;
    font-size: 75%;
    width: 98%;
    margin: 1%;
    padding: 8px 4px;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;    -webkit-box-shadow: 1px 1px 2px 0 #111;-moz-box-shadow: 1px 1px 2px 0 #111;box-shadow: 1px 1px 2px 0 #111;    -o-transition: box-shadow 0.2s;-webkit-transition: box-shadow 0.2s;-moz-transition: box-shadow 0.2s;transition: box-shadow 0.2s;}

@media screen and (min-width: 400px) {
    body.std footer#mainfooter nav a:link { width: 48%; }
}

@media screen and (min-width: 700px) {
    body.std footer#mainfooter nav a:link { width: 23%; }
}

body.std footer#mainfooter nav a:link:focus {
    -webkit-box-shadow: 2px 2px 2px 0 #111;-moz-box-shadow: 2px 2px 2px 0 #111;box-shadow: 2px 2px 2px 0 #111;}

body.std footer#mainfooter nav a:link:hover {
    -webkit-box-shadow: 3px 3px 2px 0 #111;-moz-box-shadow: 3px 3px 2px 0 #111;box-shadow: 3px 3px 2px 0 #111;}

body.std footer#mainfooter nav a:link:active {
    -webkit-box-shadow: 0px 0px 2px 0 #111;-moz-box-shadow: 0px 0px 2px 0 #111;box-shadow: 0px 0px 2px 0 #111;}


body.std section {
    padding: 12px 3% 8px;
    margin: 10px 0px 10px;
}

body.std section + section {
    margin-top: 30px;
}

body.std section > header {
    margin: -12px -3% 12px;
    padding: 1.5%;
}

body.std section > footer {
    margin: 8px -3% -8px;
    padding: 1.5%;
}

@media screen {
    body.std section > header.invisible {
	display: none;
    }
}

body.std section > header:after {
    clear: both;
    content: ".";
    display: block;
    visibility: hidden;
    height: 0px;
}

@media screen and (min-width: 900px) {
    body.std section > header, body.std section > footer {
	padding: 10px;
    }
}

body.std section a>*, body.std section input[type="submit"] {
    display: block;
    -o-transition: box-shadow 0.2s;-webkit-transition: box-shadow 0.2s;-moz-transition: box-shadow 0.2s;transition: box-shadow 0.2s;    -webkit-box-shadow: 2px 2px 2px 0 #444;-moz-box-shadow: 2px 2px 2px 0 #444;box-shadow: 2px 2px 2px 0 #444;}

body.std section a:focus>*, body.std section input[type="submit"]:focus {
    -webkit-box-shadow: 3px 3px 2px 0 #444;-moz-box-shadow: 3px 3px 2px 0 #444;box-shadow: 3px 3px 2px 0 #444;}

body.std section a:hover>*, body.std section input[type="submit"]:hover {
    -webkit-box-shadow: 4px 4px 2px 0 #444;-moz-box-shadow: 4px 4px 2px 0 #444;box-shadow: 4px 4px 2px 0 #444;}

body.std section a:active>*, body.std section input[type="submit"]:active {
    -webkit-box-shadow: 1px 1px 2px 0 #444;-moz-box-shadow: 1px 1px 2px 0 #444;box-shadow: 1px 1px 2px 0 #444;}

body.std section a.inline {
    display: inline;
    -webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;    color: #4a4a4a;
    text-decoration: underline;
    -o-transition: color 0.2s;-webkit-transition: color 0.2s;-moz-transition: color 0.2s;transition: color 0.2s;}

body.std section a.inline:focus, body.std section a.inline:hover {
    color: #6a6a6a;
}

body.std section .button, body.std section input[type="submit"] {
    background-color: #4a4a4a;
    color: #efeeef;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;    display: block;
    text-align: center;
    margin: auto;
}

body.std section svg .svgmainbg {
    fill: #4a4a4a;
    stroke: none;
}

body.std section svg .svginnerbg {
    fill: #ceccce;
    stroke: none;
}

body.std section input[type="password"] {
    display: block;
    margin: auto;
    background-color: #fffff8;
    color: #000;
    border-style: solid;
    border-width: 1px;
    border-color: #fffff8;
    text-align: center;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;    -webkit-box-shadow: inset 1px 1px 2px 0 #888;-moz-box-shadow: inset 1px 1px 2px 0 #888;box-shadow: inset 1px 1px 2px 0 #888;    -o-transition: box-shadow 0.2s;-webkit-transition: box-shadow 0.2s;-moz-transition: box-shadow 0.2s;transition: box-shadow 0.2s;}

body.std section input[type="password"]:focus {
    -webkit-box-shadow: inset 1px 1px 2px 0 #444;-moz-box-shadow: inset 1px 1px 2px 0 #444;box-shadow: inset 1px 1px 2px 0 #444;}

body.std section input, body.std section .button.wide {
    width: 100%;
    padding: 5px;
}

@media screen and (min-width: 400px) {
    body.std section input, body.std section .button.wide {
	width: 80%;
    }
}

body.std section p {
    margin: 0;
}

body.std section p + p {
    margin-top: 1em;
}

body.std section p.warning {
    font-weight: bold;
    text-align: center;
}

body.std section p.address {
    margin: 1em;
}

body.std section h1 {
    font-size: 125%;
    font-weight: bold;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;    background-color: #ae87a4;
    color: #372b34;
    padding: 5px;
    width: 100%;
}

body.std section ul.inline {
    list-style: disc;
    margin: 1em 0;
}

body.std section ul.inline li {
    margin: 0.5em 4%;
}

body.std section nav#breadcrumbs {
    font-size: 75%;
    width: 100%;
    margin-bottom: 10px;
}

body.std section nav#breadcrumbs ol {
    width: 100%;
}

body.std section nav#breadcrumbs li {
    display: inline-block;
}

body.std section nav#breadcrumbs li a {
    display: block;
    margin: 5px 0px;
}

body.std section nav#breadcrumbs li + li a {
    margin-left: 5px; 
}

body.std section nav#breadcrumbs li span {
    display: block;
    white-space: nowrap;
    background-color: #4a4a4a;
    color: #efeeef;
    padding: 4px 10px 4px 4px;
    -webkit-border-top-left-radius: 5px;-moz-border-top-left-radius: 5px;border-top-left-radius: 5px;    -webkit-border-bottom-left-radius: 5px;-moz-border-bottom-left-radius: 5px;border-bottom-left-radius: 5px;    -webkit-border-top-right-radius: 20px;-moz-border-top-right-radius: 20px;border-top-right-radius: 20px;    -webkit-border-bottom-right-radius: 20px;-moz-border-bottom-right-radius: 20px;border-bottom-right-radius: 20px;}

body.std section nav.imgstyles {
    display: block;
    float: right;
    margin-top: 5px;
}

body.std section nav.imgstyles li {
    width: 50px;
    display: inline-block;
    margin: 5px;
    background-color: #4a4a4a;
}

body.std section nav.imgstyles li.current {
    background-color: #ceccce;
    border: solid 1px #4a4a4a;
}

body.std section nav.pages, body.std section div.gallerypages {
    text-align: center;
    font-size: 75%;
}

body.std section nav.pages a, body.std section nav.pages > span {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
}

body.std section nav.pages > span.current {
    background-color: #ceccce;
    color: #3a3a3a;
    border: solid 1px #4a4a4a;
    -webkit-border-radius: 16px;-moz-border-radius: 16px;border-radius: 16px;    padding: 8px;
}

body.std section nav.pages a span {
    display: block;
    background-color: #4a4a4a;
    color: #efeeef;
    -webkit-border-radius: 16px;-moz-border-radius: 16px;border-radius: 16px;    padding: 8px;
}


body.std section ul.symbollist {
    text-align: center;
}

body.std section ul.symbollist li {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    height: auto;
    padding: 1%;
}

@media screen and (min-width: 500px) {
    body.std section ul.symbollist li {
	width: 33.333%;
    }
}

@media screen and (min-width: 700px) {
    body.std section ul.symbollist li {
	width: 25%;
    }
}

@media screen and (min-width: 1040px) {
    body.std section ul.symbollist li {
	width: 20%;
    }
}

@media screen and (min-width: 1390px) {
    body.std section ul.symbollist li {
	width: 250px;
    }
}

body.std section li.dirinfo figure, body.std section li.dldirinfo figure, body.std section li.download figure {
    padding: 5%;
    background-color: #4a4a4a;
    color: #efeeef;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}

body.std section div.dirthumbnails {
    display: none;
}

@media screen and (min-width: 400px) {
    body.std section div.dirthumbnails {
	display: block;
	width: 100%;
	height: auto;
	padding-bottom: 80%;
	position: relative;
	background-color: #ceccce;
	margin-bottom: 0.5em;
	-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;    }

    body.std section div[class*="dirthumbnail-"] {
	position: absolute;
	width: 60%;
	height: 75%;
    }

    body.std section div[class*="dirthumbnail-"] img {
	display: block;
	position: absolute;
	-webkit-box-shadow: 1px 1px 2px 0 #444;-moz-box-shadow: 1px 1px 2px 0 #444;box-shadow: 1px 1px 2px 0 #444;    }

    body.std section div.dirthumbnail-1 { bottom: 5%; left: 4%; }
    body.std section div.dirthumbnail-1 img { left: 0; bottom: 0;}
    body.std section div.dirthumbnail-2 { bottom: 12.5%; left: 20%; }
    body.std section div.dirthumbnail-2 img { left: 50%; top: 50%; -webkit-transform: translateY(-50%) translateX(-50%);-ms-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}
    body.std section div.dirthumbnail-3 { bottom: 20%; left: 36%; }
    body.std section div.dirthumbnail-3 img { right: 0; top: 0; }
}

body.std section figure.medium figcaption {
    font-size: 75%;
    text-align: right;
}

body.std section figure.medium figcaption span {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
}

body.std section figure.medium figcaption a {
    display: inline-block;
    color: #4a4a4a;
    text-decoration: underline;
    -o-transition: color 0.2s;-webkit-transition: color 0.2s;-moz-transition: color 0.2s;transition: color 0.2s;    vertical-align: middle;
}

body.std section figure.medium figcaption a:focus, body.std section figure.medium figcaption a:hover {
    color: #6a6a6a;
}

body.std section figure.medium figcaption a img {
    display: inline-block;
    width: 20px;
    height: auto;
    background-color: #4a4a4a;
    margin: 5px 7px;
    vertical-align: middle;
    border: solid 4px #4a4a4a;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}

body.std section .gallery {
    width: 100%;
}

body.std section .gallery .gallerymain {
    width: 100%;
    margin-bottom: 45px; /* 45px is needed for the figcaption below */
}

body.std section .gallery .gallerymain > figure.medium {
    padding: 2%;
    width: 100%;
    position: relative;
}

body.std section .gallery .gallerymain figcaption {
    position: absolute;
    top: 100%;
    right: 0;
    font-size: 75%;
    text-align: right; 
}

body.std section .gallery .thumbnailsrelative {
    width: 100%;
    position: relative;
}

body.std section .gallery .thumbnailsrelative li {
    width: 90%;
    padding-bottom: 90%;
    margin: 5%;
    position: relative;
}

body.std section .gallery .thumbnailsrelative li figure {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);-ms-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);    width: 100%;
}

body.std section .gallery .thumbnailsrelative ol { display: inline-block; width: 33%; }
body.std section .gallery .thumbnailsrelative li[class*="relative-"] { display: none; }
body.std section .gallery .thumbnailsrelative li.relative-1 { display: inline-block; }

@media screen and (min-width: 400px), screen and (orientation: landscape) {
        body.std section .gallery {	position: relative; margin: 0 auto 45px; } /* 45px is needed for the figcaption below */
    body.std section .gallery .gallerymain { position: absolute; margin-bottom: initial; }
    body.std section .gallery .thumbnailsrelative { position: absolute; }
    body.std section .gallery .thumbnailsrelative ol { display: block; position: absolute; top: initial; width: 100%; height: auto; }
    body.std section .gallery .thumbnailsrelative li + li { margin-top: 10%; } /* workaround for collapsing margins */
    body.std section .gallery .gallerymain > figure.medium {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);-ms-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);    }

        body.std section .gallery { width: 100%; padding-bottom: 75%; }
    body.std section .gallery { width: 90vw; padding-bottom: 67.5vw; }
    body.std section .gallery .gallerymain { left: 25%; height: 100%; width: 75%; }
    body.std section .gallery .thumbnailsrelative { width: 25%; top: 0; height: 100%; }
    body.std section .gallery .thumbnailsrelative li.relative-1 { display: block; }
    body.std section .gallery .thumbnailsrelative ol.before { bottom: 66.66%; }
    body.std section .gallery .thumbnailsrelative ol.current { top: 33.33%; }
    body.std section .gallery .thumbnailsrelative ol.after { top: 66.66%; }
}

@media screen and (min-height: 250px) and (min-aspect-ratio: 4/3) {
    body.std section .gallery { width: 120vh; padding-bottom: 90vh; }
}

@media screen and (min-width: 700px) and (min-height: 700px) {
    body.std section .gallery { width: 100%; padding-bottom: 83.33%; }
    body.std section .gallery { width: 90vw; padding-bottom: 75vw; }
    body.std section .gallery .gallerymain { left: 16.66%; width: 83.33%; }
    body.std section .gallery .thumbnailsrelative { width: 16.66%; }
    body.std section .gallery .thumbnailsrelative li.relative-2 { display: block; }
    body.std section .gallery .thumbnailsrelative ol.before { bottom: 60%; }
    body.std section .gallery .thumbnailsrelative ol.current { top: 40%; }
    body.std section .gallery .thumbnailsrelative ol.after { top: 60%; }
}

@media screen and (min-width: 700px) and (min-height: 700px) and (min-aspect-ratio: 6/5) {
    body.std section .gallery { width: 108vh; padding-bottom: 90vh; }
}

@media screen and (min-width: 1000px) and (min-height: 1000px) {
    body.std section .gallery { width: 100%; padding-bottom: 87.5%; }
    body.std section .gallery { width: 90vmin; padding-bottom: 78.75vmin; }
    body.std section .gallery .gallerymain { left: 12.5%; width: 87.5%; }
    body.std section .gallery .thumbnailsrelative { width: 12.5%; }
    body.std section .gallery .thumbnailsrelative li.relative-3 { display: block; }
    body.std section .gallery .thumbnailsrelative ol.before { bottom: 57.13%; }
    body.std section .gallery .thumbnailsrelative ol.current { top: 42.85%; }
    body.std section .gallery .thumbnailsrelative ol.after { top: 57.13%; }
}

@media screen and (min-width: 1000px) and (min-height: 1000px) and (min-aspect-ratio: 8/7) {
    body.std section .gallery { width: 102.86vh; padding-bottom: 90vh; }
}

body.std section ul.imglist li { width: 100%; margin: 0 auto; }
body.std section ul.imglist li { width: 90vw; }

@media screen and (min-aspect-ratio: 1/1) {
    body.std section ul.imglist li { width: 90vh; }
}

body.std section ul.imglist li + li { margin-top: 40px; }


body.fullscreen {
    width: 100%;
    height: 100%;
    background-color: #000;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}

body.fullscreen a {
    position: absolute;
    width: 30%;
    height: 30%;
}

body.fullscreen a img {
    position: absolute;
    width: 50%;
    color: #aaa;
    opacity: 0.5;
    -o-transition: opacity 0.2s;-webkit-transition: opacity 0.2s;-moz-transition: opacity 0.2s;transition: opacity 0.2s;}

body.fullscreen a:hover img, body.fullscreen a:focus img { opacity: 0.9; }

@media screen and (min-width: 400px) {
    body.fullscreen a img { width: 60px; }
}

body.fullscreen a.prev { left: 0; bottom: 0; }
body.fullscreen a.next { right: 0; bottom: 0; }
body.fullscreen a.close { right: 0; top: 0; }

body.fullscreen a.prev img { left: 5%; bottom: 5%; text-align: left; }
body.fullscreen a.next img { right: 5%; bottom: 5%; text-align: right; }
body.fullscreen a.close img { right: 5%; top: 5%; text-align: right; }