body {
    overflow-x: hidden;
}


#content-wrapper, #example-wrapper {
	height: 100%;
}


.spacer.s0 {
	min-height: 1px;
}
.spacer.s1 {
	min-height: 10vh;
}
.spacer.s2 {
	min-height: 20vh;
}
.spacer.s3 {
	min-height: 30vh;
}
.spacer.s4 {
	min-height: 40vh;
}
.spacer.s5 {
	min-height: 50vh;
}
.spacer.s6 {
	min-height: 60vh;
}
.spacer.s7 {
	min-height: 70vh;
}
.spacer.s8 {
	min-height: 80vh;
}
.spacer.s9 {
	min-height: 90vh;
}
.spacer.s10 {
	min-height: 1000px;
}
.spacer.sv2 {
	min-height: 200vh;
}

.spacer.s_viewport {
	min-height: 100vh;
}



/*////////////////////////////////////////////*/
/* eigene styles */
/*////////////////////////////////////////////*/

.image-wrapper{
width:100vw;
height: 100vh;
margin:0;
padding:0;
position:relative;
display: flex; 
justify-content: center;
}
.logo-wrapper{
width:100vw;
margin:0;
padding:0;
position:relative;
display: flex; 
justify-content: center;
}

.image {
position:absolute;
width:100vw;
height: 100vh;
margin:0;
padding:0;
opacity: 0;
background-repeat: no-repeat;
}


@media only screen and (min-aspect-ratio: 1) {
.image {
background-position: center center;
background-size: cover;
}
}
@media only screen and (min-aspect-ratio: 0.6) and (max-aspect-ratio: 1) {
.image {
    background-position: center center;
    background-size: 220%;
}
}
@media only screen and (min-aspect-ratio: 0.5) and (max-aspect-ratio: 0.6) {
.image {
    background-position: center 8vh;
    background-size: 217%;
}
}

@media only screen and (max-aspect-ratio: 0.5) {
.image {
    background-position: center 10vh;
    background-size: 244%;
}
}










#animElem1-1{
opacity: 1;
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-1200x660.jpg');
}
#animElem1-2{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-UG-1200x660.jpg');
}
#animElem1-3{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-EG-1200x660.jpg');
}
#animElem1-4{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-OG-1200x660.jpg');
}
#animElem2-1{
opacity: 1;
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_08_Ansicht-Rueckseite-1200x660.jpg');
}
#animElem2-2{
}
#animElem2-3{
}
#animElem2-4{
}



@media only screen and (min-width: 768px) {
#animElem1-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-1536x845.jpg');
}
#animElem1-2{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-UG-1536x845.jpg');
}
#animElem1-3{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-EG-1536x845.jpg');
}
#animElem1-4{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-OG-1536x845.jpg');
}
#animElem2-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_08_Ansicht-Rueckseite-1536x845.jpg');
}
}



@media only screen and (min-width: 1200px) {
#animElem1-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-1536x845.jpg');
}
#animElem1-2{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-UG-1536x845.jpg');
}
#animElem1-3{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-EG-1536x845.jpg');
}
#animElem1-4{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-OG-1536x845.jpg');
}
#animElem2-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_08_Ansicht-Rueckseite-1536x845.jpg');
}
}



@media only screen and (min-width: 1600px) {
#animElem1-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-1920x1056.jpg');
}
#animElem1-2{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-UG-1920x1056.jpg');
}
#animElem1-3{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-EG-1920x1056.jpg');
}
#animElem1-4{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-OG-1920x1056.jpg');
}
#animElem2-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_08_Ansicht-Rueckseite-1920x1056.jpg');
}
}


@media only screen and (min-width: 1920px) {
#animElem1-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-2048x1126.jpg');
}
#animElem1-2{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-UG-2048x1126.jpg');
}
#animElem1-3{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-EG-2048x1126.jpg');
}
#animElem1-4{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-OG-2048x1126.jpg');
}
#animElem2-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_08_Ansicht-Rueckseite-2048x1126.jpg');
}
}

@media only screen and (min-width: 2050px) {
#animElem1-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse.jpg');
}
#animElem1-2{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-UG.jpg');
}
#animElem1-3{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-EG.jpg');
}
#animElem1-4{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_06_Ansicht-Wittrockstrasse-OG.jpg');
}
#animElem2-1{
background-image: url('https://www.hentze36.de/wp-content/uploads/Hentze36_08_Ansicht-Rueckseite.jpg');
}
}



#pin1,#pin2,#pin3 {
	transition: all 0.5s ease-out;
}


.infotext-wrapper {
    opacity: 0;
    position: absolute;
    z-index: 999;
    width: 33vw;
    height: 24vh;
    display: flex;    
    align-items: flex-end;
    text-align: left;
    font-size: 2vh !important;
    background-image: url('https://www.hentze36.de/wp-content/uploads/04_Pfeil_Infographiken_gruen_nachoben.svg');
    background-size: 0.64vh 24vh;
    background-repeat: no-repeat;
    padding-left: 25px;
    transition: all 0.5s ease-out;
}

.infotext-wrapper p {
    margin: 0 0 -4px 0;
}


#infotext01 {
    left: 58vw;
    top: 73vh;
    background-position: left bottom;
    width: 26vw;
}

#infotext02 {
	left: 7vw;
    top: 66vh;
    text-align: right;
    background-position: right bottom;
    padding-right: 25px;
    padding-left: 0;
}

#infotext03 {
    left: 50vw;
    bottom: 72vh;
    background-image: url('https://www.hentze36.de/wp-content/uploads/04_Pfeil_Infographiken_gruen.svg');
    background-position: left 6px;
    align-items: flex-start;
    width: 30vw;
}

#infotext04 {
    left: 6vw;
    top: 65vh;
    text-align: right;
    background-position: right bottom;
    padding-right: 25px;
    padding-left: 0;
}
#infotext05 {
    left: 59vw;
    top: 65vh;
    background-position: left bottom;
}

#infotext05 p{
    margin: 0 0 calc(-6vh - 4px) 0;
}
 
#infotext06 {
    left: 9vw;
    bottom: 70vh;
    background-image: url('https://www.hentze36.de/wp-content/uploads/04_Pfeil_Infographiken_gruen.svg');
    background-position: right top;
	align-items: flex-start;
	text-align: right;
    padding-right: 25px;
    padding-left: 0;
}
#infotext06 p{    
	margin: calc(-3vh - 4px) 0 0 0;
}

@media only screen and (min-aspect-ratio: 0.6) and (max-aspect-ratio: 1) {
.infotext-wrapper {
    font-size: 1.35vh !important;
}
}



@media only screen and (max-aspect-ratio: 0.6) {
.infotext-wrapper {
    font-size: calc(2.4vw + 0.6vh)!important;
    width: calc(100vw - 48px);
    padding-left: 20px;
}


#infotext01 {
    left: 24px;
    top: 52vh;
    background-position: left bottom;
    text-align: left;
	width: calc(100vw - 48px);
}
#infotext02 {
    left: 24px;
    top: 69vh;
    background-image: none;
    text-align: left;
    padding-right: 0;
    padding-left: 20px;
}
#infotext03 {
    left: 24px;
    top: 5vh;
	width: calc(100vw - 48px);
}



#infotext04 {
    left: 24px;
    top: 53vh;
    background-position: left top;
    text-align: left;
    padding-bottom: 4vh;
    padding-right: 0;
    padding-left: 20px;
    }
#infotext05 {
    left: 24px;
    top: 67vh;
    background-image: none;
} 
#infotext06 {
    left: 24px;
    top: 6vh;
	padding-right: 20px;}
}

#infotext06 p{    
	margin: -4px 0 0 0;
}

@media screen and (min-width: 2000px) {


}