/* spectral-200 - latin */
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 200;
    src: url('../fonts/spectral-v6-latin-200.eot'); /* IE9 Compat Modes */
    src: local('Spectral ExtraLight'), local('Spectral-ExtraLight'),
    url('../fonts/spectral-v6-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-200.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-200.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-200italic - latin */
@font-face {
    font-family: 'Spectral';
    font-style: italic;
    font-weight: 200;
    src: url('../fonts/spectral-v6-latin-200italic.eot'); /* IE9 Compat Modes */
    src: local('Spectral ExtraLight Italic'), local('Spectral-ExtraLightItalic'),
    url('../fonts/spectral-v6-latin-200italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-200italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-200italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-200italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-200italic.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-300italic - latin */
@font-face {
    font-family: 'Spectral';
    font-style: italic;
    font-weight: 300;
    src: url('../fonts/spectral-v6-latin-300italic.eot'); /* IE9 Compat Modes */
    src: local('Spectral Light Italic'), local('Spectral-LightItalic'),
    url('../fonts/spectral-v6-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-300italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-300italic.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-300 - latin */
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/spectral-v6-latin-300.eot'); /* IE9 Compat Modes */
    src: local('Spectral Light'), local('Spectral-Light'),
    url('../fonts/spectral-v6-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-300.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-300.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-regular - latin */
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/spectral-v6-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Spectral Regular'), local('Spectral-Regular'),
    url('../fonts/spectral-v6-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-regular.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-italic - latin */
@font-face {
    font-family: 'Spectral';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/spectral-v6-latin-italic.eot'); /* IE9 Compat Modes */
    src: local('Spectral Italic'), local('Spectral-Italic'),
    url('../fonts/spectral-v6-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-italic.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-500 - latin */
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/spectral-v6-latin-500.eot'); /* IE9 Compat Modes */
    src: local('Spectral Medium'), local('Spectral-Medium'),
    url('../fonts/spectral-v6-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-500.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-500.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-500italic - latin */
@font-face {
    font-family: 'Spectral';
    font-style: italic;
    font-weight: 500;
    src: url('../fonts/spectral-v6-latin-500italic.eot'); /* IE9 Compat Modes */
    src: local('Spectral Medium Italic'), local('Spectral-MediumItalic'),
    url('../fonts/spectral-v6-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-500italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-500italic.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-600 - latin */
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/spectral-v6-latin-600.eot'); /* IE9 Compat Modes */
    src: local('Spectral SemiBold'), local('Spectral-SemiBold'),
    url('../fonts/spectral-v6-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-600.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-600.svg#Spectral') format('svg'); /* Legacy iOS */
}
/* spectral-600italic - latin */
@font-face {
    font-family: 'Spectral';
    font-style: italic;
    font-weight: 600;
    src: url('../fonts/spectral-v6-latin-600italic.eot'); /* IE9 Compat Modes */
    src: local('Spectral SemiBold Italic'), local('Spectral-SemiBoldItalic'),
    url('../fonts/spectral-v6-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/spectral-v6-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/spectral-v6-latin-600italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/spectral-v6-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/spectral-v6-latin-600italic.svg#Spectral') format('svg'); /* Legacy iOS */
}

html,
body {
    height: 100%;
    overflow-x: hidden;
}

body {
    font-family: 'Spectral', serif;
    background-color: #25496D;
    color: white;
    overflow-x: hidden;
}

h1 {
    font-size: 50px;
    font-weight: 300;
    color: rgba(228, 28, 17, .6);
    margin: 0 -50% 0 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

a {
    color: white;
    cursor: pointer;
}

a:hover {
    color: white;
}

h2#objekte {
    font-weight: 400;
    position: absolute;
    top: 3rem;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
    text-align: center;
    color: #575656;
    font-size: 22px;
}

.paragraph {
    font-weight: 200;
    font-size: 16px;
}

.paragraph .readMore {
    font-size: 14px;
}

.paragraph ul.disclaimer,
p.disclaimer {
    list-style-type: none;
    font-style: italic;
    font-size: 16px;
    margin: 0;
    padding: 0;
}

p.disclaimer {
    line-height: 1.5rem;
}

.paragraph ul.disclaimer li {
    margin-bottom: 10px;
    line-height: 1.5rem;
}

.w-75 {
    width: 100% !important
}

.push-galerie-item {
	margin-left: 0;
}

/* Navigation */

.nav-center {
    margin: 0 -50% 0 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.pos-link-list {
    position: static;
	bottom: auto;
}

.nav-item {
    position: relative;
    height: 150px;
    width: 150px;
    text-decoration: none;
}
.nav-item:hover {
    text-decoration: none;
}

.nav-item .nav-item-text {
    color: #fff;
    font-size: 16px;
    font-weight: 200;
    line-height: 1rem;
}

.nav-item.nav-wandobjekte {
    background-image: url('../img/nav_wandobjekte.png');
}
.nav-item.nav-wandobjekte span.nav-item-text {
    position: absolute;
    top: 25px;
    right: 0;
}

.nav-item.nav-arbeit-papier {
    background-image: url('../img/nav_arbeit_papier.png');
}
.nav-item.nav-arbeit-papier span.nav-item-text {
    position: absolute;
    top: 40px;
    left: 24px;
}

.nav-item.nav-texte {
    background-image: url('../img/nav_texte.png');
}
.nav-item.nav-texte span.nav-item-text {
    position: absolute;
    bottom: 40px;
    left: 0;
}

.nav-item.nav-bio {
    background-image: url('../img/nav_bio.png');
}
.nav-item.nav-bio span.nav-item-text {
    position: absolute;
    bottom: 27px;
    right: 0;
    text-align: right;
}

#menu,
#menu_absolut,
#nav {
    position: absolute;
    z-index: 2;
}

#back_to_top {
    position: fixed;
    z-index: 2;
}

#menu {
    cursor: pointer;
    width: 25px;
    height: 12.5px;
}

#menu_absolut {
    top: 25px;
    right: 25px;
    cursor: pointer;
    width: 25px;
    height: 12.5px;
}

#menu_absolut:hover {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    transform: scale(1.1);
}

.objekt-top {
    top: 4rem !important;
}

#back_to_top {
    right: 25px;
    cursor: pointer;
    bottom: 25px;
}

#back_to_top:hover {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    transform: translateY(-10px);
}

#menu:hover {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    transform: scale(1.1);
}

.content {
    position: absolute;
    top: 25px;
    z-index: 1;
}

.slideshow {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    list-style-type: none;
}

.slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
    animation: imageAnimation 42s linear infinite 0s;
}

.slideshow li:nth-child(1) span {
    background-image: url(../img/bg_1.jpg)
}

.slideshow li:nth-child(2) span {
    background-image: url(../img/bg_2.jpg);
    animation-delay: 6s;
}

.slideshow li:nth-child(3) span {
    background-image: url(../img/bg_3.jpg);
    animation-delay: 12s;
}

.slideshow li:nth-child(4) span {
    background-image: url(../img/bg_4.jpg);
    animation-delay: 18s;
}

.slideshow li:nth-child(5) span {
    background-image: url(../img/bg_5.jpg);
    animation-delay: 24s;
}

.slideshow li:nth-child(6) span {
    background-image: url(../img/bg_6.jpg);
    animation-delay: 30s;
}

.slideshow li:nth-child(7) span {
    background-image: url(../img/bg_7.jpg);
    animation-delay: 36s;
}

.slideshow li:nth-child(2) div {
    animation-delay: 6s;
}

.slideshow li:nth-child(3) div {
    animation-delay: 12s;
}

.slideshow li:nth-child(4) div {
    animation-delay: 18s;
}

.slideshow li:nth-child(5) div {
    animation-delay: 24s;
}

.slideshow li:nth-child(6) div {
    animation-delay: 30s;
}

.slideshow li:nth-child(7) div {
    animation-delay: 36s;
}

.no-cssanimations .slideshow li span {
    opacity: 1;
}

@keyframes imageAnimation {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }
    8% {
        opacity: .3;
        animation-timing-function: ease-out;
    }
    17% {
        opacity: .3
    }
    25% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

.scrollbox {
    border: none;
    padding: 5px;
    height: 60vh;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    flex: auto;
}

::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

/* Bootstrap extends */

.ml-n15 {
    margin-left: -9rem !important;
}

.p-10 {
    padding: 5rem 3rem !important
}

/* Arbeit */

.arbeit {
    display: flex;
    margin-bottom: 60px;
}

.arbeitTitle {
    width: 100%;
    font-size: 40px;
    font-weight: 300;
}

.arbeit #title {
    font-size: 40px;
    font-weight: 200;
    margin-right: 10px;
    height: 50px;
}

.arbeit #subtitle {
    font-size: 40px;
    font-weight: 600;
    margin-right: 75px;
    height: 50px;
}

.arbeit #author {
    font-size: 16px;
    font-weight: 500;
    font-style: italic;
    height: 50px;
}

#arbeitContainer {
	padding-left: 35px;
}

#arbeitContainer .paragraph {
    font-size: 16px;
    font-weight: 200;
    line-height: 1.5rem;
}

.hans-peter-riese-bg,
.impressum-bg {
    background-image: url('../img/hans-peter-riese-bg.jpg');
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .3;
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
}

.impressum-bg {
    background-image: url('../img/bg_impressum.jpg');
}

/* Biografie */
.biografie-container {
	padding-left: 35px;
}

.biografie-container h2 {
    width: 100%;
    font-size: 40px;
    font-weight: 300;
}

.download-icon {
    width: 20px;
    margin-top: -3px;
}

#scrollbox_container strong {
    font-weight: 600;
}

@media (min-width: 992px) {
    .biografie-container h2,
    .arbeitTitle {
        width: 250px;
    }

    .p-10 {
        padding: 3rem 6rem !important;
    }
}

/* Objekte */

.objekte-gallerie {
    margin: 0 -50% 0 0;
    position: absolute;
    top:550px;
    height: 100%;
    left: 50%;
    transform: translate(-50%, -500px)
}

figure {
    height: 160px;
    width: 160px;
    display: inline-block;
    margin-right: -4px;
    margin-bottom: 0;
}

figure img {
    height: 160px;
    width: 160px;
}

figure a {
    height: 160px;
    width: 160px;
    display: inline-block;
}

/* Startseite Popup */

.modal {
    padding: 0 !important;
}

.modal .modal-dialog {
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
}

.modal .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
    background-color: rgba(134,164,182,.85);
}

.modal .modal-header {
    border: none;
}

.modal .modal-header h5 {
    font-size: 40px;
    font-weight: 400;
    padding-left: 0;
}

.modal .modal-header .close {
    font-size: 4rem;
    font-weight: 200;
    color: #fff;
    position: absolute;
    top: 10px;
    right: 25px;
}

.modal .modal-body {
    overflow-y: auto;
}

.modal .modal-body .f-18 {
    font-size: 14px;
}

.modal .modal-body .f-24 {
    font-size: 18px;
}

.modal .modal-body .f-40 {
    font-size: 24px;
    font-weight: 400;
}

.modal .modal-body .fw-200 {
    font-weight: 200;
}

.modal .modal-body .fw-500 {
    font-weight: 500;
}

.modal .modal-body .lh-2rem {
    line-height: 2rem;
}

.modal .modal-body .lh-3rem {
    line-height: inherit;
    padding-top: 15px;
    display: block;
}

@media (min-width: 992px) {
    .pswp__img {
        /*left: -20%;*/
    }

    .modal .modal-header .close {
        top: 15px;
    }

    .modal .modal-header h5 {
        font-size: 60px;
        padding-left: 15px;
    }

    .modal .modal-body .f-18 {
        font-size: 18px;
    }

    .modal .modal-body .f-24 {
        font-size: 24px;
    }

    .modal .modal-body .f-40 {
        font-size: 40px;
        font-weight: 400;
    }

    .modal .modal-body .lh-3rem {
        line-height: 3rem;
        padding-top: inherit;
        display: inherit;
    }
}

/* Helper classes */

.h-25-px {
    height: 25px;
}

.curser-pointer-events {
    pointer-events: none;
}

.curser-default {
    cursor: default;
}

@media (min-width: 576px) {

    h1 {
        font-size: 80px;
        top: 170px;
    }

    .nav-item .nav-item-text {
        font-size: 18px;
        line-height: 1.5rem;
    }

    .nav-item.nav-wandobjekte span.nav-item-text {
        top: 36px;
        right: 0;
    }

    .nav-item.nav-arbeit-papier span.nav-item-text {
        top: 61px;
        left: 30px;
    }

    .nav-item.nav-texte span.nav-item-text {
        bottom: 44px;
        left: 0;
    }

    .pos-link-list {
	    position: absolute;
		bottom: -75px;
	}

}

@media (min-width: 768px) {

    #menu {
        width: 50px;
        height: 25px;
    }

    #menu_absolut {
        width: 50px;
        height: 25px;
    }

}

@media (min-width: 992px) {

    h1 {
        font-size: 180px;
        top: 50%;
    }

    .nav-item {
        height: 320px;
        width: 320px;
    }

    .nav-item .nav-item-text {
        font-size: 40px;
        line-height: 2.7rem;
    }

    .content {
        top: 40%;
    }

	#arbeitContainer {
		padding-left: 0;
	}

    #arbeitContainer .paragraph {
	    font-size: 30px;
	    line-height: 3rem;
	}

    .w-75 {
        width: 75% !important
    }


	.paragraph {
	    font-size: 20px;
	}

	.pos-link-list {
	    position: static;
		bottom: auto;
	}

	.biografie-container {
		padding-left: auto;
	}

}

@media (min-width: 1200px) {

    h1 {
        font-size: 200px;
    }

     h2#objekte {
        right: auto;
        top: 50%;
	    left: 0;
	    transform: translate(-0%, -50%);
        font-size: 40px;
        margin-bottom: 0;
        width: auto;
        text-align: left;
    }

    .objekte-gallerie {
        top: 50%;
        height: auto;
        transform: translate(-50%, -50%);
    }

    .push-galerie-item {
    	margin-left: 160px;
    }

}