/*
@import url("https://bildungsportal.sachsen.de/opal/raw/20170829/bootstrap/bootstrap.min.css");
@import url("https://bildungsportal.sachsen.de/opal/raw/20170829/themes/opal_new/layout.css");
@import url("https://bildungsportal.sachsen.de/opal/raw/20170829/themes/opal_new/responsive.css");
@import url("https://bildungsportal.sachsen.de/opal/raw/20170913/js/app/sidr/stylesheets/sidr.css");
@import url("https://bildungsportal.sachsen.de/opal/raw/20170913/js/bar/bar.css");
@import url("https://bildungsportal.sachsen.de/opal/raw/20170913/js/tree/themes/default/style.min.css");
*/

/* Screen Reader hidden content*/

.sr-only{
    position:absolute;
    left:-10000px;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
}

/* The WS-Button */

.wsButton {
	-moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	box-shadow:inset 0px 1px 0px 0px #54a3f7;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
	background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
	background-color:#007dc1;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #124d77;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:13px;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #154682;
}
.wsButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
	background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
	background-color:#0061a7;
}
.wsButton:active {
	position:relative;
	top:1px;
}

/* WS-Bonusseite */
.bonusE6_3 {width:100%;}


/* Layout Stimuli-Seite div=bodyst */
#bodyst{
    margin-right: auto;
    font-weight: 400;
    line-height: 150%;
}

/* Layout WS-Seite div=bodyws */
#bodyws{
    margin-right: auto;
/*    margin-bottom: 10px;*/
    font-weight: 400;
    line-height: 150%;
    }

/* Layout WS-Text div=inhaltsbereich */
#inhaltsbereich{
    margin-left: 30px;
    margin-right: 15x;
    font-weight: 400;
}

/* WS-Icons */
#wsicons {
    width:25%;
}


/* Position des Teststarten-Buttons */
.run-container-tooltip{
    margin-top: 50px;
    margin-left: 15px; 
}

@media only screen and (min-width: 800px){
    .bonusE6_3 {
        width:60%;}
    /* Position des Teststarten-Buttons */
    .run-container-tooltip {
        margin-top: 50px;
        margin-left: 60px; }
    #bodyst {
        margin-left: 50px;
        max-width:800px; 
        margin-right: auto;
        font-weight: 400;
        line-height: 150%;}
    #bodyws {
        margin-left: 50px;
/*        margin-bottom: 10px;*/
        max-width:800px; 
        margin-right: auto;
        font-weight: 400;
        line-height: 150%;}
    #wsicons {
        width:13%;
        float: left}
    #inhaltsbereich {
        margin-left: 110px;
        margin-right: auto;
        font-weight: 400;}

    
/* Wenn Etappe noch nicht freigeschaltet: Anzeige von "Bei Fragen kontaktieren Sie...." wird ausgeblendet */
.access-owners {
    display: none;
}


/* WS grauer Balken */
    #greyrow {
    padding: 0;
    height: 1px;
    background-color: #d0cdcd
}
    

/* Bewertungsfeld vor Testabsolvierung ausblenden */
.run-container .box{
display: none;
}

.iqtest .run-container .btn-big .fonticon+span {display: none;}

.iqtest .run-container .btn-big:after {content: "Mission starten";}

.iqtest .run-container .box-light {display: none;}

body{
font-family: Helvetica;
}


/* Bewertungsfeld nach Testabsolvierung ausblenden */
.assess-container a{
    display: none;
}

.box-assess-extended{
    display: none;
}

.box-assess-extended .dl-inline{
    display: none;
}

.box-assess-extended .box-light:after{
content: "Du hast deine Mission bereits absolviert! Weitere Informationen und wertvolle Tipps zum Thema findest du nun in deinem persönlichen Wissensspeicher (links in der Navigationsleiste)!";
    color: #008080;
}

.box-assess-extended .box-light{
    background-color: #D1E7F2;
    margin-bottom: 30px;
}

/*  Rückmeldung fragebogen */
.iqsurv .box-info span{
    display: none;
}

.iqsurv  .box-info:after{
content: "Du hast diesen Fragebogen bereits ausgefüllt, vielen Dank - die nächste Mission kommt bald!";
    color: #008080;
}

.box-assess-extended .box-light{
    background-color: #D1E7F2;
    margin-bottom: 30px;
}


.box-warning{
    background-color: #fa9370;
    color: white;
}

#infografik{
    width: 60%;
    margin: 20px;
}


/* "Sie dürfen Inhalte bearbeiten"-Info ausblenden */
.main-header .box-access {
   visibility: hidden;
}


/* alle icons färben */
i.jstree-themeicon.fonticon {
    color: #0099bc;
}

/* Icon Wissensspeicher 
Alternative: 
https://cloudstore.zih.tu-dresden.de/index.php/apps/files_sharing/ajax/publicpreview.php?x=1358&y=790&a=true&file=opal_icon.png&t=10cceb7469d134b8bd96239dad12cffa&scalingup=0
*/
#id94318903828811_anchor{
    background-image: url("../../_sharedfolder/Bilderpool/Icons/folders.jpg");
    background-repeat: no-repeat;
    background-size: 20px;
}


/* Etappen icon 
Alternativen: 
Koffer: https://cloudstore.zih.tu-dresden.de/index.php/s/8yMXTT3gH2z1v7H/download
Hiker: https://cloudstore.zih.tu-dresden.de/index.php/s/90gSGufvsguH8WB/download
Signpost_vector: https://cloudstore.zih.tu-dresden.de/index.php/s/h11erfN1RncY47r/download
Signpost_jpeg: https://cloudstore.zih.tu-dresden.de/index.php/s/aBJYoZZBfMz09WD/download
*/

.icon-st:before{
    background-image: url("../../_sharedfolder/Bilderpool/Icons/placeholder.jpg");
    background-repeat: no-repeat;
    background-size: 15px;
    font-family: cursive
}



#id94318903828811_anchor i{
    visibility: hidden;
}

/*opal icon 2 */
#id94318903828811 .fonticon {
    visibility: hidden;
}

#id94318903828811 li {
    background-image: url("https://cloudstore.zih.tu-dresden.de/index.php/apps/files_sharing/ajax/publicpreview.php?x=1349&y=791&a=true&file=opal_icon_2.png&t=3cbfd2c1e2e3ca579de2341df4b96ac3&scalingup=0");
    background-size: 15px;
    background-repeat: no-repeat;
    background-position-x: 30px;
}


/*allgemeine Styles
body{
font-family: monospace;
font-size: 14px;
}

fffcea=helles gelb

*/



/*Etappe 8 Background */
#id97183450317900 a{
    background-color:#d1ceca;
}


/*Etappe 7 Background */
#id97183450317404 a{
    background-color:#d1ceca;
}


/*Etappe 6 Background */
#id97183450316920 a{
    background-color:#d1ceca;
}


/*Etappe 5 Background */
#id97183450315911 a{
    background-color:#d1ceca;
}


/*Etappe 4 Background */
#id95408244149780 a{
    background-color:#d1ceca;
}


/*Etappe 3 Background */
#id95408244149280 a{
    background-color:#d1ceca;
}


/*Etappe 2 Background */
#id95408244148731 a{
    background-color:#d1ceca;
}


/*Etappe 1 Background */
#id95408244116594 a{
    background-color:#ffe744;
}





/*Wissensspeicher Background */
#id94318903828811 a{
    background-color:#e4faff;
}


/*Wissensspeicher MZ 1 Background */
#id94324506096970 a{
    background-color:#ffe744;
}


/*Wissensspeicher MZ 2 Background */
#id94324506164350 a{
    background-color:#ffe744;
}


/*Wissensspeicher MZ 3 Background */
#id94324506096940 a{
    background-color:#ffe744;
}

/*Wissensspeicher FB 1 Background */
#id94413095818224 a{
    background-color:#ffe744;
}


/*Wissensspeicher FB 2 Background */
#id94506957161603 a{
    background-color:#ffe744;
}

/*Parallax-CSS beginnt hier*/
/* ------------------------------------------------------------------------------------------------ */

#mid3{
    background:url('../../Parallax_Dresden_mid.png') 10%;
/*    margin-top: 1000px;*/
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 1080px;
    width: 100%;
    text-align: center;
}

.blur{
    position: relative;
    width: 120%;
/*    margin-left: -10%;*/
    height: 100px;
    bottom: -600px;
    background-color: white;
    filter: blur(20px);
    z-index: 999;
}

.blur2{
    position: relative;
    width: 120%;
    margin-left: -10%;
    height: 350px;
    bottom: -1020px;
    background-color: white;
    filter: blur(40px);
/*    z-index: 999;*/
}

.blur3{
    position: relative;
    width: 120%;
    margin-left: -10%;
    height: 100px;
    top: 640px;
    background-color: white;
    filter: blur(20px);
    z-index: 999;
}

.blur-top{
    position: relative;
/*    margin-left: -100px;*/
    top: 50px;
    width: 120%;
    height: 90px;
    background-color: white;
    filter: blur(40px);
    z-index: 999;
}

.blur-top2{
    position: relative;
/*    margin-left: -100px;*/
    margin-top: -50px;
    top: 0px;
    width: 120%;
    height: 100px;
    background-color: white;
    filter: blur(40px);
    z-index: 999;
}

#mountains {
    position: relative;
    background-image:url('https://i.ibb.co/ctFML7x/Parallax-gebirge.png'); 
    background-size: cover;
    justify-content: center;
    align-items: center;
    height: 630px;
    width: 100%;
    max-width: 1440px;
    text-align: center;
}

#city {
    background: url('https://i.ibb.co/V3kB5RH/parallax-wohnung.png'); 
    background-repeat: no-repeat;
    background-size: cover;
    justify-content: center;
    align-items: center;
    height: 800px;
    width: 100%;
    max-width: 1440px;
    text-align: center;
}

@media only screen and (min-width: 1119px) {
    #city {
        min-height: 1200px;
    }
    
    .blur3 {
        top: 1040px;
    }
}    

#test{
    position: relative;
    height: 800px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

#test3{
    position: relative;
    height: 800px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    overflow: hidden;
/*    margin-bottom: 200px;*/
}

#front {
    position: absolute;
    background:url('../../parallax1_front.png') 50% 20%;
/*    display: flex;*/
    justify-content: center;
    align-items: center;
    height: 800px;
    width: 100%;
    text-align: center;
}

#front2 {
    position: absolute;
    margin-top: -100px;
    background:url('../../parallax1_front.png');
/*    display: flex;*/
    justify-content: center;
    align-items: center;
    height: 1000px;
    width: 100%;
    text-align: center;
}

#front3 {
    position: absolute;
    background:url('../../Parallax_Dresden_front.png');
    justify-content: center;
    align-items: center;
    height: 1080px;
    width: 100%;
    text-align: center;
}

.ptext {
    margin-left: 100px;
    margin-bottom: 100px;
    width: 80%;
    
}

#back {
    position: absolute;
    background:url('../../parallax1_back.png') 50% 20%;
/*    display: flex;*/
    justify-content: center;
    align-items: center;
    height: 600px;
    width: 100%;
    text-align: center;
}

#back2 {
    position: absolute;
    background:url('../../parallax1_back.png') 50% 0%;
/*    display: flex;*/
    justify-content: center;
    align-items: center;
    height: 600px;
    width: 100%;
    text-align: center;
}

#back3 {
    position: absolute;
    background:url('../../Parallax_Dresden_back.png');
/*    display: flex;*/
    justify-content: center;
    align-items: center;
    height: 1080px;
    width: 100%;
    text-align: center;
}


/*
#etappe {
    opacity: 0;
    -webkit-transition: all 1s ease-in-out;
			 -moz-transition: all 1s ease-in-out;
				-ms-transition: all 1s ease-in-out;
				 -o-transition: all 1s ease-in-out;
						transition: all 1s ease-in-out;
}
*/

#logo {
/*    padding-top: 20px;*/
    text-align: center;
    margin: 0 auto;
    margin-top: 100px;
    opacity: 0;
    -webkit-transition: all 1s ease-in-out;
			 -moz-transition: all 1s ease-in-out;
				-ms-transition: all 1s ease-in-out;
				 -o-transition: all 1s ease-in-out;
						transition: all 1s ease-in-out;
}

#intro_txt {
/*    padding-top: 50px;*/
/*    margin-bottom: 0px;*/
    margin-top: 130px;
    z-index: 1;
}

#intro {
    position: relative;
    padding-left: 100px;
    padding-right: 100px;
/*    margin-top: -200px;*/
    z-index: 1;
    opacity: 0;
    -webkit-transform: scale(0.9);
			 -moz-transform: scale(0.9);
				-ms-transform: scale(0.9);
				 -o-transform: scale(0.9);
						transform: scale(0.9);
    -webkit-transition: all 1s ease-in-out;
			 -moz-transition: all 1s ease-in-out;
				-ms-transition: all 1s ease-in-out;
				 -o-transition: all 1s ease-in-out;
						transition: all 1s ease-in-out;
}
#intro.visible {
    opacity: 1;
    -webkit-transform: none;
			 -moz-transform: none;
				-ms-transform: none;
				 -o-transform: none;
						transform: none;
}
/*
#etappe.visible {
    opacity: 1;
}
*/

#logo.visible {
    opacity: 1;
    -webkit-transform: none;
			 -moz-transform: none;
				-ms-transform: none;
				 -o-transform: none;
						transform: none;
}

.ablauf {
/*    position: relative;*/
    width: 100%;
/*    height: 400px;*/
}

.start_img {
/*    width: 150px;*/
    height: 150px;
    margin-left: 100px;
    margin-top: 50px    ;
    object-fit: contain;
}
#etappe_txt {
/*    position: relative;*/
    margin-top: 50px;
    margin-left: 100px;
    width: 600px;   
}

.ablauf_txt {
    margin-top: 50px;
    margin-left: 100px;
    width: 600px;
}

#skyline-wrapper{
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
    height: 400px;
}

#skyline{
    position: relative;
/*    display: flex;*/
    background: url('../../skyline.png');
    width: 100%; 
    height: 400px;
    text-align: center;
}

#ablauf_wrapper {
    margin-top: -50px;
}

.reveal{
    opacity: 0;
    -webkit-transition: all 1s ease-out;
         -moz-transition: all 1s ease-out;
            -ms-transition: all 1s ease-out;
             -o-transition: all 1s ease-out;
                    transition: all 1s ease-out; 
}

.reveal.visible{
    opacity: 1;
    -webkit-transform: none;
					 -moz-transform: none;
						-ms-transform: none;
						 -o-transform: none;
								transform: none;
}

.hidden {
    display: none;
}