/* FONT */

@font-face {
font-family: 'SourceCodePro-Medium-Italic';
src: url('font/KMR-Waldenburg-Mager.ttf');

}

@font-face {
font-family: 'SourceCodePro-Regular';
src: url('font/KMR-Waldenburg-Mager.ttf'); 
}

@font-face {
font-family: 'SourceCodePro-SemiBold';
src: url('font/KMR-Waldenburg-Mager.ttf'); 
}


@media (max-width: 768px) {
/* Stilregeln für Bildschirme mit einer Breite von bis zu 768px */
}

@media (min-width: 769px) and (max-width: 1024px) {
/* Stilregeln für Bildschirme mit einer Breite zwischen 769px und 1024px */
}









main {
min-height: fit-content;
width: 100%;
display: flex;
justify-content: center;
align-items: center;


}

html {
padding-left: 4px;
padding-top: 4px;
padding-right: 4px;
padding-bottom: 4px;


}

/* HEADER */


.headerNameContainer {
position: fixed;
font-family: 'SourceCodePro-Medium-Italic';
font-size: 26pt;
font-style: normal;
color:#002fff;
display: flex;
flex-direction: row;

}

.headerInfoContainer {
    position: fixed;
    font-family: 'SourceCodePro-Medium-Italic';
    font-size: 26pt;
    font-style: normal;
    color:#002fff;
    display: flex;
    flex-direction: row;
    
    }

.headerName {
position: fixed;
text-align: left;
left: 10px;
}

.headerInfo {
position: fixed;
flex: 1;
text-align: right;
right: 10px;
}


/* FOOTER */

.footerImpressumContainer {
    position: fixed;
    text-align: right;
    font-family: 'SourceCodePro-SemiBold';
    font-size: 10pt;
    font-style: normal;
    color:#002fff;
    display: flex;
    flex-direction: row;
}


.footerCopyContainer {
    position: fixed;
    text-align: right;
    font-family: 'SourceCodePro-SemiBold';
    font-size: 10pt;
    font-style: normal;
    color:#002fff;
    display: flex;
    flex-direction: row;
    }

.footerCopy {
    position: fixed;
    text-align: right;
    right: 90px;
    bottom: 10px;
}

.footerImpressum {
    position: fixed;
    flex: 1;
    text-align: right;
    right: 10px;
    bottom: 10px;
}




a {
text-decoration: none;
color:#002fff;
}



/* D-MAG */



.text-dmag-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 140px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-dmag-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 140px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-dmag-jahr {
    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 140px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}




.text3-dmag {
    position: absolute;
text-align: left;
cursor: pointer;
top: 10%;
left: 40%;
margin: 2px;
padding: 2px;
font-family: 'SourceCodePro-Regular';
font-size: 12px;
display: block;
z-index: 2;


}


.image-dmag {
position: absolute;
top: 0%;
left: 3%;
z-index: -300;
opacity: 0; 

}




/* KARTENSPIEL */

.text-kartenspiel-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 288px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}


.text-kartenspiel-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 288px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-kartenspiel-jahr {

    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 288px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}


.image-kartenspiel {
position: absolute;
top: 500px;
left: 650px;
z-index: -100;
opacity: 0; 
}



/* DESSAU FACES */


.text-mitte-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 214px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-mitte-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 214px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-mitte-jahr {
    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 214px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text2-dessaufaces {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 18%;
    left: 30%;
    padding: 10px;
    font-family: 'SourceCodePro-Regular';

    display: block;
    z-index: 2;
}

.text3-dessaufaces {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 33%;
    left: 38%;
    padding: 5px;
    font-family: 'SourceCodePro-Regular';

    display: block;
    z-index: 2;
}

.image-mitte {
position: absolute;
top: 30px;
left: 700px;
z-index: -50;
opacity: 0; 
}


/* PHILIPPINEN */

.text-philippinen-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 362px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;


}

.text-philippinen-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 362px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;


}

.text-philippinen-jahr {
    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 362px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;

}

.text2-philippinen {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 25%;
    left: 25%;
    padding: 5px;
    font-family: 'SourceCodePro-Regular';
    display: block;
    z-index: 2;
}

.text3-philippinen {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 22%;
    left: 40%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 14px;
    display: block;
    z-index: 2;
}



.image-philippinen {
position: absolute;
top: 13%;
left: 280px;
z-index: -200;
opacity: 0;
}


/* SCRAWL */

.text-hocker-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 177px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;

}

.text-hocker-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 177px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;

}

.text-hocker-jahr {
    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 177px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}



.text2-hocker {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 25%;
    left: 36%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12px;
    display: block;
    z-index: 2;
}

.text3-hocker {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 26%;
    left: 40%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12px;
    display: block;
    z-index: 2;
}

.image-hocker {
    position: absolute;
    top: 430px;
    left: 460px;
    z-index: -200;
    opacity: 0; /* Setzen Sie die Anfangsdeckkraft auf 0 */
}


/* HSA HOCKER */

.text-scrawl-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 325px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-scrawl-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 325px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text-scrawl-jahr {
    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 325px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}

.text2-scrawl {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 31%;
    left: 20%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12px;
    display: block;
    z-index: 2;
}

.text3-scrawl {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 58%;
    left: 40%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12px;
    display: block;
    z-index: 2;
}

.image-scrawl {
position: absolute;
top: 40%;
right: 5%;
z-index: -100;
opacity: 0; /* Setzen Sie die Anfangsdeckkraft auf 0 */
}

/* PINK */

.text-pink-titel {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 251px;
    left: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;
}


.text-pink-art {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 251px;
    left: 450px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;

}

.text-pink-jahr {
    position: absolute;
    text-align: right;
    cursor: pointer;
    top: 251px;
    right: 10px;
    font-family: 'SourceCodePro-Regular';
    font-size: 26pt;
    line-height: 26pt;
    display: block;
    z-index: 2;

}

.text2-pink {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 34%;
    left: 22%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12px;
    display: block;
    z-index: 2;
}

.text3-pink {
    position: absolute;
    text-align: left;
    cursor: pointer;
    top: 34%;
    left: 40%;
    margin: 2px;
    padding: 2px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12px;
    display: block;
    z-index: 2;
}

.image-pink {
    position: absolute;
    top:60%;
    left: 150px;
    z-index: -200;
    opacity: 0;

}





/* PROJEKTSEITEN */


.titel {
    position: fixed;
    text-transform: uppercase;
    text-align: left;  
    top: 142px;
    left: 10px;
    line-height: 28pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 28pt;
    color:#002fff;
    display: block;
    z-index: -1000;
}

.subtitel {
    position: fixed;
    text-align: left; 
    hyphens: none; 
    top: 160px;
    left: 10px;
    right: 200px;
    line-height: 12pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff;
    display: block;
    z-index: -1000;

}


/* PROJEKTSEITE DMAG */

.beschreibung-dmag {
    position: fixed;
    text-align: left;
    left: 10px;
    right: 10px;
    hyphens: auto;
    top: 210px;
    line-height: 12pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff;
    display: block;
    z-index: -300;
    
}

.beschreibung-kartenspiel {
    position: fixed;
    text-align: left;
    left: 10px;
    right: 10px;
    hyphens: auto;
    top: 210px;
    line-height: 12pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff;
    display: block;
    z-index: -300;
    
}

.beschreibung-scrawl {
    position: fixed;
    text-align: left;
    left: 10px;
    right: 10px;
    hyphens: auto;
    top: 210px;
    line-height: 12pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff;
    display: block;
    z-index: -300;
    
}


.beschreibung-mitte {
    position: fixed;
    text-align: left;
    left: 10px;
    right: 10px;
    hyphens: auto;
    top: 210px;
    line-height: 12pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff;
    display: block;
    z-index: -300;
    
}

.beschreibung-hocker {
    position: fixed;
    text-align: left;
    left: 10px;
    right: 10px;
    hyphens: auto;
    top: 210px;
    line-height: 12pt;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff;
    display: block;
    z-index: -300;
  
    
}


/* PROJEKTSEITE KARTENSPIEL */

.image-kartenspiel1 {
    position: absolute;
top: 40%;
left: 5%;
z-index: -100;
}

.image-kartenspiel2 {
    position: absolute;
top: 1250px;
left: 50px;
z-index: -100;
}

.image-kartenspiel3 {
    position: absolute;
    top: 1750px;
    padding-bottom: 40px;
    left: 250px;
    z-index: -100;
}

.container6 {
    position: absolute;
    top: 550px;
    left: 40%;
    z-index: -100;
}


/* PROJEKTSEITE PHILIPPINEN  */

.image-philippinen1 {
    position: absolute;
    top: 30%;
    padding-top: 100px;
    left: 20%;
    z-index: -100;
}

.image-philippinen2 {
    position: absolute;
    top: 140%;
    padding-top: 100px;
    left: 5%;
    z-index: -100;
}

.image-philippinen3 {
    position: absolute;
    top: 200%;
    padding-top: 100px;
    right: 5%;
    z-index: -100;
}

.image-philippinen4 {
    position: absolute;
    top: 280%;
    padding-top: 100px;
    left: 15%;
    z-index: -100;
}

.image-philippinen5 {
    position: absolute;
    top: 380%;
    padding-top: 100px;
    padding-bottom: 50px;
    right: 5%;
    z-index: -100;
}



/* PROJEKTSEITE HSA HOCKER */

.image-hocker1 {
    position: absolute;
    top: 400px;
    padding-top: 50px;
    left: 250px;
    z-index: -100;
}

.image-hocker2 {
    position: absolute;
    top: 1150px;
    padding-top: 50px;
    right: 100px;
    z-index: -100;
    padding-bottom: 20px;
}

.image-hocker3 {
    position: absolute;
    top: 1900px;
    padding-top: 50px;
    right: 250px;
    z-index: -100;
    
}

.image-hocker4 {
    position: absolute;
    top: 2450px;
    padding-top: 50px;
    left: 80px;
    z-index: -100;
    padding-bottom: 40px;
}



/* PROJEKTSEITE MITTE */

.container1 {
    position: absolute;
    top: 2100px;
    left: 550px;
}

.container2 {
    position: absolute;
    top: 470px;
    left: 520px;
}

.mitte-foto1 {
    position: absolute;
    top: 1100px;
    right: 50px;
    z-index: -1;
}

.mitte-foto2 {
    position: absolute;
    top: 1550px;
    left: 150px;
}

.container3 {
    position: absolute;
    top: 2655px;
    left: 120px;
    padding-bottom: 60px;
}







/* PROJEKTSEITE D-MAG */

.container4 {
    position: absolute;
    top: 2500px;
    right: 50px;
    padding-bottom: 60px;
}

.image-dmag1 {
    position: absolute;
    top: 550px;
    left: 150px;
    z-index: -1;
    

}

.image-dmag2 {
    position: absolute;
    top: 1150px;
    right: 150px;
    z-index: -1;
    

}

.image-dmag3 {
    position: absolute;
    top: 1750px;
    right: 300px;
    

}


/* PROJEKTSEITE SCRAWL */

.image-scrawl1 {
    position: absolute;
    top: 1050px;
    left: 15%;
    padding-bottom: 50px;
    z-index: 0;

}

.container5 {
    position: absolute;
    top: 350px;
    left: 350px;
    padding-bottom: 60px;
}

/* PROJEKTSEITE PINK */

.image-pink1 {
    position: absolute;
    top: 300px;
    left: 350px;
    padding-bottom: 30px;
}


/* IMPRESSUM */

.impressum {
    position: absolute;
    top: 20%;
    font-family: 'SourceCodePro-Regular';
    font-size: 1.1em;
    color:#002fff; 
    left: 10px;
    right: 10px;
    text-align: left;
    
}


/* INFO */

.profilbild {
    position: absolute;
    bottom: 120px;
    right: 150px;
}


.Info-Text {
    position: absolute;
    top: 185px;
    left: 10px;
    right: 500px;
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    line-height: 12pt;
    color:#002fff; 
    
}

.contact {
    position: absolute;
    bottom: 110px;
    left: 10px;
    
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff; 
    z-index: -1;
}

.lebenslauf {
    position: absolute;
    bottom: 10%;
    left: 10px;
    
    font-family: 'SourceCodePro-Regular';
    font-size: 12pt;
    color:#002fff; 
    
}

/*
.lebenslauf_pdf {
    position: absolute;
    top: 0%;
    width: 100%;
}
*/





.weiter {
    position: fixed;
    font-family: 'SourceCodePro-SemiBold';
    line-height: 26pt;
    font-size: 26pt;
    font-style: normal;
    color:#002fff;
    flex: 1;
    text-align: right;
    right: 10px;
    top: 48px;
}

.indexÜbersicht {
    position: fixed;
    font-family: 'SourceCodePro-SemiBold';
    line-height: 26pt;
    font-size: 26pt;
    font-style: normal;
    color:#002fff;
    text-align: left;
    left: 10px;
    top: 48px;
    
}


/* PROJEKTSEITE PINK */






/* HOVER ITALIC */

a .text-kartenspiel:hover,
a .text-dessaufaces:hover,
a .text-dmag:hover,
a .titel:hover,
a .beschreibung:hover,
a .text-marseille:hover,
a .text-scrawl:hover,
a .text-philippinen:hover,
a .headerName:hover,
a .headerInfo:hover,
a .headerAllgemein:hover,
a .text-pink:hover {
    transform: translateX(10px);
}



.headerInfoContainer:hover .headerInfo {
    transform: translateX(10px);
    
}

.footerImpressumContainer:hover .footerImpressum {
    transform: translateX(10px);
}


.indexÜbersicht:hover,
.headerNameContainer:hover .headerName {
    transform: translateX(-10px);
}

.weiter:hover {
    transform: translateX(10px);
}



@media only screen and (max-width: 600px) {
    
    .philippinen-bilder {
        max-width: 100%;
        
        
    }

    .kartenspiel-bilder {
        max-width: 90%;   
    }

    .dmag-bilder {
        max-width: 90%;   
    }

    .hocker-bilder {
        max-width: 90%;   
    }

    .mitte-bilder {
        max-width: 90%;   
    }

    .pink-bilder {
        max-width: 90%;   
    }

    .scrawl-bilder {
        max-width: 90%;   
    }

    .headerName{
        top: 5px;
        left: 5px;
        font-size: 22pt;
    }

    .headerInfo {
        top: 5px;
        right: 5px;
        font-size: 22pt;
    }

    .footerImpressumContainer {
        bottom: 5px;
        right: 5px;
        font-size: 8pt;
    }

    .footerCopyContainer {
        bottom: 5px;
        
        font-size: 8pt;
    }

    .footerCopy {
        right:78px;
        
    }

    .weiter {
        top: 32px;
        right: 5px;
        font-size: 22pt;
    }

    .indexÜbersicht {
        top: 32px;
        left: 5px;
        font-size: 22pt;
    }



    .text-dmag-titel {
        top: 100px;
        left: 5px;
        font-size: 22pt;
    }

    .text-dmag-art {
        top: 128px;
        left: 5px;
        font-size: 22pt;
    }

    .text-dmag-jahr {
        top: 100px;
        right: 5px;
        font-size: 22pt;
    }

    .text-hocker-titel {
        top: 175px;
        left: 5px;
        font-size: 22pt;
    }

    .text-hocker-art {
        top: 203px;
        left: 5px;
        font-size: 22pt;
    }

    .text-hocker-jahr {
        top: 175px;
        right: 5px;
        font-size: 22pt;
    }

    .text-mitte-titel {
        top: 250px;
        left: 5px;
        font-size: 22pt;
    }

    .text-mitte-art {
        top: 278px;
        left: 5px;
        font-size: 22pt;
    }

    .text-mitte-jahr {
        top: 250px;
        right: 5px;
        font-size: 22pt;
    }

    .text-pink-titel {
        top: 325px;
        left: 5px;
        font-size: 22pt;
    }

    .text-pink-art {
        top: 353px;
        left: 5px;
        font-size: 22pt;
    }

    .text-pink-jahr {
        top: 325px;
        right: 5px;
        font-size: 22pt;
    }

    .text-kartenspiel-titel {
        top: 400px;
        left: 5px;
        font-size: 22pt;
    }

    .text-kartenspiel-art {
        top: 428px;
        left: 5px;
        font-size: 22pt;
    }

    .text-kartenspiel-jahr {
        top: 400px;
        right: 5px;
        font-size: 22pt;
    }

    .text-scrawl-titel {
        top: 475px;
        left: 5px;
        font-size: 22pt;
    }

    .text-scrawl-art {
        top: 503px;
        left: 5px;
        font-size: 22pt;
    }

    .text-scrawl-jahr {
        top: 475px;
        right: 5px;
        font-size: 22pt;
    }

    .text-philippinen-titel {
        top: 550px;
        left: 5px;
        font-size: 22pt;
    }

    .text-philippinen-art {
        top: 578px;
        left: 5px;
        font-size: 22pt;
    }

    .text-philippinen-jahr {
        top: 550px;
        right: 5px;
        font-size: 22pt;
    }


    .titel {
        position: absolute;
        text-transform: uppercase;
        text-align: left;  
        top: 100px;
        left: 5px;
        right: 5px;
        line-height: 22pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 22pt;
        color:#002fff;
        display: block;
        z-index: -1000;
    }
    
    .subtitel {
        position: absolute;
        
        text-align: left; 
        hyphens: none; 
        top: 112px;
        left: 5px;
        right: 5px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        z-index: -1000;
    
    }


    .image-dmag {
        position: absolute;
        top: 70px;
        left: 90px;
        width: 25%;
        opacity: 1;
    }

    .image-hocker {
        position: absolute;
        top: 160px;
        left: 228px;
        width: 17%;
        opacity: 1;
    }

    .image-mitte {
        position: absolute;
        top: 230px;
        left: 100px;
        width: 17%;
        opacity: 1;
    }

    .image-pink {
        position: absolute;
        top: 310px;
        left: 260px;
        width: 15%;
        opacity: 1;
    }

    .image-kartenspiel {
        position: absolute;
        top: 410px;
        left: 280px;
        width: 24%;
        opacity: 1;
    }

    .image-scrawl {
        position: absolute;
        top: 460px;
        left: 230px;
        width: 16%;
        opacity: 1;
    }

    .image-philippinen {
        position: absolute;
        top: 550px;
        left: 190px;
        width: 16%;
        opacity: 1;
        padding-bottom: 50px;
    }

    /* IMPRESSUM */

    .impressum {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 110px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        padding-bottom: 50px;
    }
    

    /* INFO */

    .Info-Text {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 118px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        
    }

    .contact {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        top: 310px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        
    }

    .lebenslauf {
        position: absolute;
        text-align: left;
        left: 5px;
        right: 5px;
        hyphens: auto;
        top: 350px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        
    }

    #lebenslauf {
        position: absolute;
        text-align: justify;
      
        width: 100%;
        height: auto;
    }

    .profilbild {
        position: absolute;
        top: 400px;
        display: flex;
        justify-content: right;
        width: 50%;
        left: 140px;
        
        height: auto;
        padding-bottom: 50px;
        
    }

   


  

 

    /* PHILIPPINEN */

    .image-philippinen1 {
        position: relative;
        top: 120px;
        /*display: flex;*/
        /*justify-content: right;*/
        width: 90%;
        left: 35px;
        height: auto;
        z-index: -1; 
    }


    .image-philippinen2 {
        position: absolute;
        top: 650px;
        /*display: flex;*/
        /*justify-content: left;*/
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
    }

    .image-philippinen3 {
        position: absolute;
        top: 950px;
        /*display: flex;*/
        /*justify-content: right;*/
        width: 93%;
        left: 15px;
        height: auto;
        z-index: -1;
    }

    .image-philippinen4 {
        position: absolute;
        top: 1250px;
        /*display: flex;*/
        /*justify-content: left;*/
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
    }


    .image-philippinen5 {
        position: absolute;
        top: 1600px;
        /*display: flex;*/
        /*justify-content: right;*/
        width: 90%;
        right: 0px;
        height: auto;
        z-index: -1;
        padding-bottom: 50px;
    }

    /* SCRAWL */

    .beschreibung-scrawl {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 165px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        z-index: -300;
    }

    #slideshow5 {
        position: absolute;
        top: 180px;
        width: 95%;
        left: 10px;
        height: auto;
        z-index: -1;
        
    }

    .container5 {
        position: absolute;
        top: 180px;
        width: 95%;
        left: 10px;
        height: auto;
        z-index: -1;
    }

    .image-scrawl1 {
        position: absolute;
        top: 660px;
        display: flex;
        justify-content: right;
        width: 80%;
        left: 0px;
        height: auto;
        z-index: -1;
        padding-bottom: 50px;
    }


    /* KARTENSPIEL */

    .beschreibung-kartenspiel {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 165px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        z-index: -300;
    }

    .image-kartenspiel1 {
        position: absolute;
        top: 280px;
       
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
    }

    #slideshow6 {
        position: absolute;
        top: 240px;
        width: 95%;
        left: 30px;
        height: auto;
        z-index: -1;
        
    }

    .container6 {
        position: absolute;
        top: 240px;
        width: 95%;
        left: 30px;
        height: auto;
        z-index: -1;
    }

    .image-kartenspiel2 {
        position: absolute;
        top: 950px;
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
    }

    .image-kartenspiel3 {
        position: absolute;
        top: 1300px;
        width: 90%;
        left: 30px;
        height: auto;
        z-index: -1;
        padding-bottom: 50px;
    }

    /* PINK */

    
    .image-pink1 {
        position: absolute;
        top: 190px;
        width: 90%;
        left: 5px;
        height: auto;
        padding-bottom: 50px;
        z-index: -1;
    }

    /* MITTE */

    .beschreibung-mitte {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 200px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        z-index: -300;

    }

    #slideshow2 {
        position: absolute;
        top: 290px;
        width: 90%;
        left: 30px;
        height: auto;
        z-index: -1;
        
    }

    .container2 {
        position: absolute;
        top: 290px;
        width: 90%;
        left: 30px;
        height: auto;
        z-index: -1;
    }

  

    .mitte-foto1 {
        position: absolute;
        top: 1100px;
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
    }

    .mitte-foto2 {
        position: absolute;
        top: 1400px;
        width: 90%;
        left: 30px;
        height: auto;
        z-index: -1;
    }
    

    #slideshow1 {
        position: absolute;
        top: 850px;
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
        
    }

    .container1 {
        position: absolute;
        top: 850px;
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;
        
    }
    
    #slideshow3 {
        position: absolute;
        top: 1050px;
        width: 95%;
        left: 0px;
        height: auto;
        z-index: -1;
        padding-bottom: 50px;
        
    }

    .container3 {
        position: absolute;
        top: 1050px;
        width: 95%;
        left: 0px;
        height: auto;
        z-index: -1;
        padding-bottom: 50px;
        
    }

  
   

    /* HOCKER */
    .beschreibung-hocker {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 180px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        z-index: -300;
    }

    .image-hocker1 {
        position: absolute;
        width: 80%;
        height: auto;
        left: 30px;
        top: 390px;
        z-index: -1;

    }

    .image-hocker2 {
        position: absolute;
        top: 900px;
        width: 80%;
        left: 0px;
        height: auto;
        z-index: -1;

    }

    .image-hocker3 {
        position: absolute;
        top: 1450px;
        display: flex;
        justify-content: left;
        width: 90%;
        left: 0px;
        height: auto;
        z-index: -1;

    }


    .image-hocker4 {
        position: absolute;
        top: 1800px;
        display: flex;
        justify-content: right;
        width: 90%;
        left: 30px;
        height: auto;
        z-index: -1;
        padding-bottom: 50px;

    }
    
    
    
    
    /* DMAG */

    .beschreibung-dmag {
        position: absolute;
        text-align: justify;
        left: 5px;
        right: 5px;
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        top: 180px;
        line-height: 14pt;
        font-family: 'SourceCodePro-Regular';
        font-size: 14pt;
        color:#002fff;
        display: block;
        z-index: -300;
        
    }

    #slideshow4 {
        position: absolute;
        width: 95%;
        height: auto;
        padding-bottom: 50px;
        right: 0px;
        top: 900px;
        
        
    }

    .container4 {
        position: absolute;
        width: 95%;
        height: auto;
        padding-bottom: 50px;
        right: 0px;
        top: 900px;
    }
    
   
    .image-dmag1 {
        position: absolute;
        width: 90%;
        height: auto;
        left: 0px;
        top: 800px;
        z-index: -1;
        
    
    }
    
    .image-dmag2 {
        position: absolute;
        width: 90%;
        height: auto;
        left: 30px;
        top: 1150px;
        z-index: -1;
        
    
    }
    
    .image-dmag3 {
        position: absolute;
        width: 90%;
        height: auto;
        top: 1450px;
        left: 5px;
        z-index: -1;
        
    
    }
   

    

   


    

    
    
}