@charset "utf-8";
/* CSS Document */
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
----------------- ALLES IM HINTERGRUND AUF BLUR SCHALTEN  -----------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
.footer.on, .FooterScrollRahmen.on, .scroll_up.on{
    display: none;
}
.cssSlider.on{
    filter: blur(15px);
}
.startseite_Frosed_Glass_Rahmen.blur, #scroll_up_a.on, .combo-sprache.on, .intro-rahmen.on, .webmaster-login-rahmen.on, .nav-rahmen.on, .menu_online_anmeldung.blur, .menu_online_anmeldung_handy.blur, .ToggleButton-Hintergrund.blur{
    filter: blur(5px);
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-o-filter: blur(5px);
	-ms-filter: blur(5px);
}
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
----------------- TOGGEL SEITEN NAVIGATIONSLEISTE BLUR SETZTEN ------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
.subcontainer_back_pic.blur, .subcontainer_Frosed_Glass_Rahmen.blur, .subcontainer.blur, .Frosed_Glass_Rahmen.blur, .ToggleButton-Hintergrund.blur{
    filter: blur(20px);
	-webkit-filter: blur(20px);
	-moz-filter: blur(20px);
	-o-filter: blur(20px);
	-ms-filter: blur(20px);
}
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
----------------- HAUPTSEITE NAVIGATIONSLEISTE  ---------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
.nav-titel-menu
{
	display: block;
	position: fixed;
	top: 30px;
	left: -9999px;
	opacity: 0;
	width: auto;
	color: white;
	font-size: 40px;
	text-align: left;
	padding: 0px 0px 0px 25px;
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
    z-index: 23;
}

.nav-titel-menu-text{
	display: block;
	position: relative;
	left: 0px;
	top: 0px;
	width: 100%;
}


#haupt_nav{
    position: absolute;
    top: -15px;
    display: block;
    width: 100%;
}

.nav-titel-menu.on{
    left: 0px;
	opacity: 1;
}

.navbar-leiste.on {
	left: 0px;
    opacity: 1;
}

.navbar-leiste {
	position: fixed;
	display: flex;
    justify-content: flex-start;
    align-items: center;
	top: 90px;
	left: calc(100% + 10px);
	width: calc(100% - 3px);
    height:  calc(100% - 100px);
	background-color: transparent;
	overflow-y: auto;
	overflow-x: hidden;
	z-index: 23;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
    opacity: 0;
}

.navbar-leiste ul li,
.navbar-leiste ul li a,
.navbar-leiste ul li ul,
.navbar-leiste ul li ul li,
.navbar-leiste ul li ul li a
{
	cursor: pointer;
}

.navbar-leiste ul,
.navbar-leiste ul li,
.navbar-leiste ul li a,
.navbar-leiste ul li ul,
.navbar-leiste ul li ul li,
.navbar-leiste ul li ul li a
{
    font-family: 'Open Sans', sans-serif;
	list-style: none;
	font-weight: normal;
	text-decoration: none;
    background: transparent;
}

.navbar-leiste ul,
.navbar-leiste li,
.navbar-leiste a {
	position: relative;
	width: 100%;
	overflow-x: hidden;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.navbar-leiste ul li {
	width: calc(100% - 85px);
	background-color: transparent;
    min-width: 200px;
    max-width: 500px;
}

.navbar-leiste > ul > li > a {
    min-width: 200px;
    max-width: 500px;
    display: flex;
    align-items: center;
	color: #ffffff;
	vertical-align: middle;
    margin-bottom: 10px;
    height: 100%;
    padding-bottom: 10px;
    border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
}

.navbar-leiste > ul > li > a > span {
	width: calc(100% - 88px);
    height: auto;
    position: absolute;
	display: flex;
    vertical-align: middle;
    left: 85px;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
    opacity: 1;
}

.navbar-leiste ul li img {
	float: left;
	width: 40px;
	height: 40px;
	margin: 0px 10px;
	padding: 6px;
	background: transparent;
    background-size: cover;
	border: 2px solid #FFFFFF;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
    opacity: 1;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.navbar-leiste>ul>li:hover img {
	opacity: 0.3;
}

.navbar-leiste > ul > li.active {
	border-bottom: none;
}
.navbar-leiste > ul > li.has-sub > a span {
	background: url(../img/icon_plus.png) 100% center no-repeat;
	background-position: calc(100% - 20px);
}
.navbar-leiste > ul > li.has-sub.active > a span {
	background: url(../img/icon_minus.png) 100% center no-repeat;
	background-position: calc(100% - 20px);
}

.navbar-leiste ul ul {
	display: none;
	background: transparent;
}

.navbar-leiste ul ul li {
	padding: 0;
	background: transparent;
    padding-bottom: 15px;
    padding-top: 15px;
    width: calc(100% - 40px);
}

.navbar-leiste ul ul li:last-child {
	border-bottom: none;
    padding-bottom: 35px;
}

.navbar-leiste ul li a:hover span{
    opacity: 0.3;
}
.nav-link:hover, .nav-link-sub:hover, .nav-link-sub_EnabledTrue:hover{
    left: 30px;
    width: calc(100% - 30px);
    opacity: 0.3;
}


.nav-link, .nav-link-sub {
    position: relative;
	color: #ffffff;
    height: 100%;
    left: 0px;
    width: 100%;
    font-size: 20px;
    min-width: 200px;
    max-width: 350px;
    display: flex;
    align-items: center;
	vertical-align: middle;
    margin-bottom: 10px;
    padding-bottom: 10px;
    opacity: 1;
    border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.nav-link-sub_EnabledTrue {
    position: relative;
	color: #6E6E6E;
    height: 100%;
    left: 0px;
    width: 100%;
    font-size: 20px;
    min-width: 200px;
    max-width: 350px;
    display: flex;
    align-items: center;
	vertical-align: middle;
    margin-bottom: 10px;
    padding-bottom: 10px;
    opacity: 1;
    border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
    
    text-decoration: line-through;
    text-decoration-style: solid; 
    text-decoration-color: #6E6E6E;
    
    -webkit-text-decoration: line-through;
    -webkit-text-decoration-style: solid; 
    -webkit-text-decoration-color: #6E6E6E;
}

.nav-link-sub-active {
    left: 30px;
    width: calc(100% - 30px);
    min-width: 200px;
    max-width: 350px;
    display: flex;
    align-items: center;
	color: #FFA600;
	vertical-align: middle;
    margin-bottom: 10px;
    height: 100%;
    padding-bottom: 10px;
    font-size: 20px;
    border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.nav-link-sub-active:hover {
    opacity: 0.3;
    background-color: transparent;
}

#nav-link-bild-home{
    background-color: transparent;
	background: url(../img/Icon_home_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-link-bild-news{
    background-color: transparent;
	background: url(../img/Icon_News_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-link-bild-links{
    background-color: transparent;
	background: url(../img/Icon_Links_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-link-bild-bilder{
    background-color: transparent;
	background: url(../img/Icon_Bilder_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-link-bild-bio{
    background-color: transparent;
	background: url(../img/Icon_Bio_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-link-bild-kurse{
    background-color: transparent;
	background: url(../img/Icon_Kurse_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center; 
}

#nav-link-bild-aufgaben{
    background-color: transparent;
	background: url(../img/Icon_Aufgaben_weis.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-link-bild-sprachen{
    background-color: transparent;
	background: url(../img/sprachen.png);
	background-repeat: no-repeat;
	background-size: 35px 35px;
	background-position: center center;
}

#nav-klein-home, #nav-klein-news, #nav-klein-links, #nav-klein-bilder, #nav-klein-bio, #nav-klein-kurse, #nav-klein-aufgaben, #nav-klein-sprache{
    position: relative;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
    transform:scale(0.4);
    opacity: 0;
}

#nav-klein-home.on, #nav-klein-news.on, #nav-klein-links.on, #nav-klein-bilder.on, #nav-klein-bio.on, #nav-klein-kurse.on, #nav-klein-aufgaben.on, #nav-klein-sprache.on{
    transform:scale(1);
    opacity: 1;
}