@charset "utf-8";
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
------------------------ SMARTPHONE POSITIONIERUNGEN ----------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/


/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------- HOCHFORMAT -----------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
/* Smartphone Hochformat (Portrait)  transparent  */
@media only screen
  and (max-width: 479px)
  and (max-height: 767px) 
{
    .menu_online_anmeldung{
        display: none;
        left: -9999px;
    }
    .combo-sprache, .combo-sprache.allein{
        position: fixed;
        display: block;
        z-index: 10;
        top: 22px;
        left: 80px;
    }
    /*
    ---------------------------------------------------------------------------------------
    -------------------------------------- KONTAKTFORMULAR  -------------------------------
    ---------------------------------------------------------------------------------------
    */
    .kontaktformular_rahmen.open{
        left: 4px;
    }
    /*
    ---------------------------------------------------------------------------------------
    ----------------- POSITIONIERUNG SidePosi UND INNERE ELEMENTZE ------------------------
    ---------------------------------------------------------------------------------------
    */
    .BackTop_Button{
        top: calc(100% - 72px);
    }
    .BackTop_Button.on{
        left: 25px;
    }
    
    .SidePosi{
        padding-left: 10px;
        padding-right: 0px;
        width: calc(100% - 10px);
        height: calc(100% - 5px);
    }

    .FormLinks{
        height: calc(100% - 90px);
    }

    .News_Rahmen_fade {
        width: calc(100% - 60px);
        padding: 20px;
    }
    .Links-Rahmen {
        width: calc(100% - 60px);
        padding: 20px;
    }
    
    .bio-Tabelle {
        width: calc(100% - 10px);
        padding: 20px;
    }
    
    .Aufgaben{
        height: calc(100% - 100px);
    }
    
    .Tabellerahmen{
        width: calc(100% - 40px);
    }

    .Tabellerahmen_Aufgabe{
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 20px;
        padding-bottom: 20px;
        height: 230px !important;
    }
    
    .DL_AUFG_DIV{
        height: auto !important;
    }
    
    .Tabellenfeld-Zeile-2{
        position: absolute;
        top: 125px;
    }
    
    .Tabellenfeld-Zeile-3{
        position: absolute;
        top: 165px;
    }

    .Tabelle-Umrahmung{
        margin-top: 0px;
        width: calc(100% - 10px);
        padding: 0px;
    }
    
    .TabelleGesamt{
        width: calc(100% - 10px);
        margin-left: 0px;
        margin-right: 0px;
        height: 480px;
    }
    
    #ID-Tabellerahmen1, #ID-Tabellerahmen3, #ID-Tabellerahmen2, #ID-Tabellerahmen4{
        width: calc(100% - 10px);
        margin-left: 0px;
        display: block;
        height: 170px;
    }
    
    .Tabellenfeld-Sparte-2-2, .Tabellenfeld-Sparte-3-2{
        display: flex;
        justify-content: flex-start;
    }
    
    .BildDiv_AufgabeTitel{
        font-size: 35px;
        text-align: center;
    }
    
    .Div_clip_circle{
        display: none;
    }
    /*
    ---------------------------------------------------------------------------------------
    ----------------- RAHMEN, NAV LEISTE, HAMBURGER BUTTON UND FORM CONTAINER -------------
    ---------------------------------------------------------------------------------------
    */
    .Frosed_Glass_Rahmen{
        transform: scale(0.6);
        width: 390px;
        left: -70px;
        top: -10px;
    }

    .subcontainer_Frosed_Glass_Rahmen{
        top: 95px;
        height: calc( 100% - 135px);
        width: calc(100% - 40px);
        max-height: 800px;
        left: 10px;
    }
    
    .subcontainer{
        width: calc(100% - 50px);
        max-height: 800px;
        left: 25px;
        top: 115px;
        height: calc( 100% - 155px);
    }
    

    /*
    ---------------------------------------------------------------------------------------
    ----------------- RAHMEN HAUPTFORMULAR, PRELOADER, FUSSLEISTE UND SLIDER --------------
    ---------------------------------------------------------------------------------------
    */
    .startseite_Frosed_Glass_Div_Begraenzung{
        position: fixed;
        top: calc(50% - 130px);
        left: 1%;
        width: 98%;
    }
    .e-loadholder{
        top: 320px;
        left: calc(50% - 120px);
        transform: scale(1);
    }
    .FooterScrollRahmen, .sliderControls, #left, #right{
        display: none;
        left: -9999px;
        pointer-events: none;
    }
    /*
    ---------------------------------------------------------------------------------------
    ----------------- WEBMASTER FELDER POSITIONIERUNGEN -----------------------------------
    ---------------------------------------------------------------------------------------
    */
	.combo-sprache.webopen{
		display: none;
		visibility: hidden;
	} 
    /*
    ---------------------------------------------------------------------------------------
    ------- MENÜ KURS UND AUFGABEN (HAUPTFENSTER) POSITIONIERUNGEN ------------------------
    ---------------------------------------------------------------------------------------
    */
    #nav_btn_CloseButton_AufgabenKurs, #nav_btn_kurse.transform, #nav_btn_aufgabe.transform{
        height: 35px;
        width: 35px;
        background-size: 25px 25px;
    }
    #Nav_CloseButton_Menu_AufgabenKurs{
        width: 35px;
        height: 35px;
    }
	.round span:hover, .round_mobil span:hover {
		font-size: 11px;
	}
    /*
    ---------------------------------------------------------------------------------------
    -------------------------- BIOGRAPHIE POSITIONIERUNGEN --------------------------------
    ---------------------------------------------------------------------------------------
    */
	.bio-zeile{
		display: block;
	}
	.bio-spalte-bild{
		width: 200px;
		height: auto;
	}
	.bio-spalte-links{
		width: auto;
	}
	.bio-spalte-rechts{
		width: auto;
	}
	.bio-Image{
		width: 200px;
		height: auto;
	}
	#bio-zeile_1{
		margin-top: 30px;
	}
    /*
    ---------------------------------------------------------------------------------------
    -------------- WEBMASTER FELDER IM WEBMASTERFORMULAR POSITIONIERUNGEN -----------------
    ---------------------------------------------------------------------------------------
    */
    
    /*
    ---------------------------------------- HAUSAUFGABEN ---------------------------------
    */
    .table_compiti{
        width: 100%;
    }
    
    .Class_Zelle_Links{
        background-color: transparent;
        text-align: left;
        width: 100%;
    }
    .Class_Zelle_Rechts{
        background-color: transparent;
        text-align: left;
        width: 100%;
    }
    .Class-Input-Rechts{
        background-color: transparent;
        text-align: left;
        width: 100%;
    }
    
    .Aufgabe_TextAera{
        height: 90px;
    }
    
    #ID-Input-Feld-Hausaufgaben-Aufgaben-Vorab, #ID-Input-Feld-Hausaufgaben-Aufgaben{
        height: 100%;
    }
    
    #ID-Input-Feld-Hausaufgaben-Aufgaben_Bis-Vorab, #ID-Input-Feld-Hausaufgaben-Aufgaben_Bis{
        padding-bottom: 10px;
    }
    #Datum_Vorab, #Datum_Aktuell{
        height: 90px;
        border: transparent solid 1px;
    }
    .Open_Kalender{
        position: relative;
        margin-top: 20px;
        margin-left: 0px;
        left: 0px;
    }
    
    .Aufgaben_Buttons_Gesamt{
        height: 120px;
        display: table-cell;
        float: left;
    }
    
    .Aufgaben_Buttons_Zellen{
        display: flex;
        justify-content: center;
        align-items: center;
        height: auto;
        width: 100%;
        padding: 0px;
        padding-bottom: 10px;
    }
    /*
    ---------------------------------------- NEUIGKEITEN ----------------------------------
    */
    
    .Neu_News_Container{
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding-left: 20px;
    }
    #id_Input_news_neu_news, #Text_News_Block{
	    height: 200px;
    }

    .Class_button_News_Block{
        width: 100%;
    }
    
	.FormularRahmen_News{
        position: relative;
		width: 100%;
		height: calc(100% - 20px);
		margin-left: 10px;
		margin-right: 10px;
        margin-bottom: 10px;
        margin-top: 10px;
        top: 0px;
	}
    
    #neu_news_titel_1{
        font-size: 30px;
    }
    #neu_news_titel_2{
        font-size: 10px;
    }
    
    .Neu_News_Left, .Neu_News_Right{
        display: block;
        position: relative;
        height: 20px;
        margin-bottom: 10px;
        width: calc(100% - 10px);
        margin-left: 5px;
        left: 0px;
        justify-content: flex-start;
    }
    
    #Text_News_Block{
        display: block;
        position: relative;
        height: 210px;
    }
    #button_News_Block{
        display: block;
        position: relative;
        left: 5px;
        padding-top: 0px;
    }
    /*
    ---------------------------------------- LINKS ----------------------------------
    */
    .LinkNeuDiv{
        display: block;
        height: 80px;
    }
    .Reihe_Links_5_1, .Reihe_Links_5_2{
        display: flex;
        align-items: center;
        justify-content: center;
        height: 40px;
        width: 100%;
        padding-left: 0px;
        padding-right: 0px;
    }
    .NeuRahmen{
        height: 330px;
    }
    /*
    ---------------------------------------- PERSÖNLICHE DATEN ----------------------------------
    */
    .Rahmen_PersoDaten{
        height: auto;
    }
    /*
    ---------------------------------------------------------------------------------------
    -------------- ENDE WEBMASTER FELDER IM WEBMASTERFORMULAR POSITIONIERUNGEN ------------
    ---------------------------------------------------------------------------------------
    */
    @media only screen
      and (max-width: 600px) 
    {
        .BannerCodeRahmen_Block.on{
            left: 5px;
        }
    }
    
    @media only screen
      and (max-height: 660px) 
    {
        .kontaktformular_rahmen.open{
        top: 4px;
        }
    }
    
    @media only screen
      and (max-height: 760px) 
    {
        #Text_News_Block{
            height: 100px;
        }
        #id_Input_news_neu_news{
            height: 100px;
        }
    }
    
    @media only screen
      and (max-width: 433px) 
    {
        .Pic_Preview{
            position: relative;
            left: 5px;
            margin: 0 0;
            width: calc(100% - 10px);
            padding: 0px 0px 0px 0px;
        }
        
        #dropdown { 
          margin: 0 0;
          width: calc(100% - 10px);
        }
    }

    @media only screen
      and (max-width: 439px) 
    {
        .msgcontainer.open{
        left: 10px;
        }
    }
    
    
    @media only screen
      and (max-width: 405px) 
    {
        .Kurs_Sommer_Innen_Reihe_1{
            height: 200px;
        }

        .Kurs_Sommer_Innen_Cont{
            height: 100%;
            position: relative;
            float: left;
            flex-direction: column;
        }
        .Feld_Sommer{
            display: block;
            position: relative;
            width: calc(100% - 30px);
            min-width: 200px;
            margin: 4px 0px;
            top: 5px;
            left: -25px;
        }

        .Kurs_Sommer_Innen_Reihe_3, .Class-Input-Rechts-News-Info{
            height: 110px;
        }
        
        
        
        .Kurs_Spezial_Innen{
            height: auto;
        }

        .Kurs_Sommer_Innen_Reihe_1{
            height: 200px;
        }
        .Spezial_PersoAnzahl{
            height: 130px;
            position: relative;
            float: left;
            flex-direction: column;
        }
        .Kurs_Sommer_Innen_Cont{
            height: 100%;
            position: relative;
            float: left;
            flex-direction: column;
        }
        .Feld_Spezial{
            display: block;
            position: relative;
            width: calc(100% - 30px);
            min-width: 200px;
            margin: 4px 0px;
            top: 5px;
            left: -25px;
        }

        .Label_Spezial_PersoAnzahl{
            margin: 4px 0px;
        }

        .Kurs_Sommer_Innen_Reihe_3, .Class-Input-Rechts-News-Info{
            height: 110px;
        }
    }
    @media only screen
      and (max-width: 440px) 
    {
        .News-Text{
            float: left;
        }
    }
    @media only screen
      and (max-width: 426px) 
    {
        .News-Datum{
            height: 50px;
            font-size: 16px;
        }
    }
    @media only screen
      and (max-width: 366px) 
    {
        .News-Datum{
            height: 50px;
            font-size: 16px;
        }
        .kurs-Label{
            font-family: 'Open Sans Condensed', sans-serif;
            font-size: 20px;
        }
        #Label-Aufgabe-Titel{
            font-size: 15px;
        }
        .BildDiv_AufgabeTitel{
            font-size: 30px;
        }
    }
}



@media only screen
  and (max-width: 360px)
  and (min-height: 361px)
  and (max-height: 767px) 
{
    .startseite_Frosed_Glass_Div_Begraenzung{
        position: fixed;
        left: 1%;
        width: 98%;
    }
    .e-loadholder{
        top: 240px;
        left: calc(50% - 120px);
        transform: scale(0.8);
    }
}

/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------- QUERFORMAT -----------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
/* Smartphone Querformat (Landscape) */
@media only screen
  and (max-width: 767px)
  and (min-width: 480px) 
{
    .menu_online_anmeldung{
        display: none;
        left: -9999px;
    }
    /*
    ---------------------------------------------------------------------------------------
    -------------------------------------- KONTAKTFORMULAR  -------------------------------
    ---------------------------------------------------------------------------------------
    */
    .kontaktformular_rahmen.open{
        top: 4px;
        left: 4px;
    }

    .startseite_Frosed_Glass_Div_Begraenzung{
        top: calc(50% - 130px);
        left: calc(50% - 250px);
        width: 500px;
    }
    .webmaster-login-rahmen, .FooterScrollRahmen, .sliderControls, #left, #right, .footer{
        display: none;
        left: -9999px;
        pointer-events: none;
    }
    /*
    ---------------------------------------------------------------------------------------
    ---------------------- DEUTSCH ITALIENISCH AUSWAHL POSIZIONIEREN ----------------------
    ---------------------------------------------------------------------------------------
    */
    .combo-sprache, .combo-sprache.allein{
        position: fixed;
        display: block;
        z-index: 10;
        top: 10px;
        left: calc(100% - 140px);
    }
    .combo-sprache select {
        border: 1px solid #000000;
        color: black;
    }
    .combo-sprache select:hover,
    .combo-sprache select:focus {
        color: #0489B1;
        background: #CCCCCC;
    }
    .select_arrow {
        border-color: #000000 transparent transparent transparent;
    }
    .combo-sprache select:hover ~ .select_arrow,
    .combo-sprache select:focus ~ .select_arrow {
        border-top-color: #0489B1;
    }
    /*
    ---------------------------------------------------------------------------------------
    ------- MENÜ KURS UND AUFGABEN (HAUPTFENSTER) POSITIONIERUNGEN ------------------------
    ---------------------------------------------------------------------------------------
    */
    #nav_btn_CloseButton_AufgabenKurs, #nav_btn_kurse.transform, #nav_btn_aufgabe.transform{
        height: 35px;
        width: 35px;
        background-size: 25px 25px;
    }
    #Nav_CloseButton_Menu_AufgabenKurs{
        width: 35px;
        height: 35px;
    }
	.round span:hover, .round_mobil span:hover {
		font-size: 11px;
	}
    /*
    ---------------------------------------------------------------------------------------
    ----------------- PRELOADER UND TEXTE POSITIONIERUNGEN --------------------------------
    ---------------------------------------------------------------------------------------
    */
    .e-loadholder{
        top: 160px;
        left: calc(50% - 120px);
        transform: scale(0.8);
    }
    #pretest{
        top: 16px;
    }
    /*
    ---------------------------------------------------------------------------------------
    ---- MENÜ KURS UND AUFGABEN (WENN FORMULAR GEÖFFNET IST) POSITIONIERUNGEN -------------
    ---------------------------------------------------------------------------------------
    */
    .nav-link{
        font-size: 14px;
    }
    
    .navbar-leiste ul li img {
        width: 25px;
        height: 25px;
        border: 2px solid #FFFFFF;
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        border-radius: 25px;
    }
    #nav-link-bild-home{
        background-size: 25px 25px;
    }

    #nav-link-bild-news{
        background-size: 25px 25px;
    }

    #nav-link-bild-links{
        background-size: 25px 25px;
    }

    #nav-link-bild-bilder{
        background-size: 25px 25px;
    }

    #nav-link-bild-bio{
        background-size: 25px 25px;
    }

    #nav-link-bild-kurse{
        background-size: 25px 25px;
    }

    #nav-link-bild-aufgaben{
        background-size: 25px 25px;
    }

    #nav-link-bild-sprachen{
        background-size: 25px 25px;
    }
    /*
    ---------------------------------------------------------------------------------------
    ----------------- POSITIONIERUNG SidePosi UND INNERE ELEMENTZE ------------------------
    ---------------------------------------------------------------------------------------
    */
    .BackTop_Button{
        top: calc(100% - 72px);
    }
    .BackTop_Button.on{
        left: 25px;
    }
    .subcontainer{
        width: calc(100% - 50px);
        left: 25px;
        top: 115px;
        height: calc( 100% - 155px);
    }
    
    .SidePosi{
        padding-left: 10px;
        padding-right: 0px;
        width: calc(100% - 10px);
        height: calc(100% - 5px);
    }
    
    .FormLinks{
        height: calc(100% - 90px);
    }
    
    .News_Rahmen_fade {
        width: calc(100% - 60px);
        padding: 20px;
        margin-top: 20px; 
        margin-bottom: 30px;
    }
    .Links-Rahmen {
        width: calc(100% - 60px);
        padding: 20px;
    }
    .bio-Tabelle {
        width: calc(100% - 60px);
        padding: 20px;
        margin-top: 15px; 
    }
    
    .Tabellerahmen{
        width: calc(100% - 40px);
    }
    
    .BildDiv{
        width: calc(100% - 100px);
    }
    /*
    ---------------------------------------------------------------------------------------
    -------------------------- BIOGRAPHIE POSITIONIERUNGEN --------------------------------
    ---------------------------------------------------------------------------------------
    */
	.bio-zeile{
		display: table-row;
	}
	.bio-spalte-bild, .bio-Image{
		width: 150px;
		height: auto;
	}
	.bio-spalte-links{
		width: auto;
	}
	.bio-spalte-rechts{
		width: auto;
	}
	#bio-zeile_1{
		margin-top: 30px;
	}
    .bio-spalte-links{
		width: 150px;
    }
    /*
    ---------------------------------------------------------------------------------------
    -------------- WEBMASTER FELDER IM WEBMASTERFORMULAR POSITIONIERUNGEN -----------------
    ---------------------------------------------------------------------------------------
    */
    /*
    ------------------------------------------ AUGABNE ------------------------------------
    */
    .Aufgaben_TextAreal{
        margin-top: 40px;
    }
    .Tab1_Btn{
        height: 60px;
    }

    .Class_Button_Table{
        height: 60px;
    }

    .Class_Button_Zellen{
        position: relative;
        display: block;
        float: left;
        width: 250px !important;
    }

    .Class_Button_Links, .Class_Button_Rechts{
        width: 100px !important;
    }
    /*
    ---------------------------------------- NEUIGKEITEN ----------------------------------
    */
    
	.FormularRahmen_News{
        position: relative;
		width: 100%;
		height: calc(100% - 20px);
		margin-left: 10px;
		margin-right: 10px;
        margin-bottom: 10px;
        margin-top: 10px;
        top: 0px;
	}
    .Neu_News_Left, .Neu_News_Right{
        display: block;
        position: relative;
        height: 20px;
        margin-bottom: 10px;
        width: calc(50% - 10px);
        margin-left: 5px;
        left: 0px;
        padding: 0px;
        justify-content: flex-start;
    }
    #id_label_news_neu_datum, #Text_News_Block{
        width: calc(100% - 10px);
    }
    #id_label_news_neu_datum, #id_label_news_neu_wichtig, #id_label_news_neu_bild{
        justify-content: flex-end;
        text-align: right;
        width: 100%;
        padding: 0px;
        margin: 0px;
    }
    /*
    ---------------------------------------- PERSÖNLICHE DATEN ----------------------------------
    */
    .Rahmen_PersoDaten{
        height: auto;
    }
    
    
    
    
    
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
    @media only screen
      and (max-height: 420px) 
    {
        #Text_News_Block, #id_Input_news_neu_news{
            height: 50px;
            margin-left: 7px;
        }
        .Class-Button{
            margin-left: 0px;
            margin-right: 0px;
            margin-bottom: 0px;
            margin-top: 0px;
            padding: 0;
            text-align: center;
            width: 135px;
            height: 30px;
        }
        .Class_button_News_Block{
            margin-left: 2px;
            margin-right: 2px;
            margin-bottom: 0px;
            margin-top: 0px;
            padding: 0;
            width: auto;
        }
        #neu_news_titel_1{
            font-size: 30px;
        }
        #neu_news_titel_2{
            font-size: 10px;
        }
    }
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
    @media only screen
      and (max-height: 379px) 
    {
        .Nav_Root {
            margin-top: 10px;
            margin-left: 30px;
            margin-right: 30px;
            margin-bottom: 30px;
        }
        .nav-rahmen{
            top: -10px;
            height: 195px;
        }
        .e-loadholder{
            top: calc(100% - 220px);
            left: calc(50% - 120px);
            transform: scale(0.6);
        }
        #pretext_open{
            top: -20px;
        }
        #pretest{
            top: 0px;
        }
    }
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
    @media only screen
      and (max-height: 361px) 
    {
        .bio-spalte-bild, .bio-Image{
            width: 120px;
            height: auto;
        }
        .Tabellerahmen{
            margin-top: 10px;
        }
        
    }
}
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
-------------------------- WIDTH FÜR DAS HANDY ----------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
@media only screen
    and (max-width: 370px) 
{
    .cookie_Titel{
        font-size: 20px;
    }
    .cookie_Info{
        font-size: 14px;
    }
}

@media only screen
  and (max-width: 455px)
{
    .cookie_legende_Titel{
        font-size: 24px;
    }
    .class_Btn_Cookie_Box_Close{
        width: 25px;
        height: 25px;
    }
    .cookie_legende_X{
        font-size: 20px;
        font-weight: bold;
    }
    .cookie_legende_X{
        line-height: 20px;
    }
}

@media only screen
  and (max-width: 510px)
{
    .cookie_legende_box.on{
        left: 5px;
    }
}

@media only screen
  and (max-width: 767px) 
{
    .Div_Container_Anmeldung_Titel.on{
        left: 40px;
        top: 0px;
    }
    .Div_Container_Anmeldung_Titel_Label{
        font-size: 25px;
    }
    
    #Label-Kurs-Daten{
        font-size: 22px;
    }
    .intro-rahmen{
        display: none;
        left: -9999px;
    } 
	.Nav_Root {
        --Poswidth: 60px;
        --Posheight: 60px;
        --Poswidth_close: 35px;
        --Posheight_close: 35px;
        width: var(--Poswidth);
        height: var(--Posheight);
        margin-top: 10px;
        margin-left: 30px;
        margin-right: 30px;
        margin-bottom: 30px;
	}
    #nav_btn_home, #nav_btn_news, #nav_btn_links, #nav_btn_bilder, #nav_btn_bio, #nav_btn_kurse, #nav_btn_aufgabe{
        height: var(--Poswidth);
        width: var(--Poswidth);
        background-size: calc(var(--Poswidth) - 25px) calc(var(--Poswidth) - 25px);
    }
	.round span:hover, .round_mobil span:hover {
		font-size: 13px;
	}
    .nav_label{
        font-size: 12px;
        width: 120px;
        height: 16px;
        left: calc(50% - 60px);
    }
    #nav_label_news:after{
        content: ' ('attr(data-news)')';
    }
    /*
    ---------------------------------------------------------------------------------------
    ---------------------------------------------------------------------------------------
    */
	.Besucherstatistik-Tabellenrahmen{
		left: calc(50% - 156px);
		top: 110px;
	}
    /*
    ---------------------------------------------------------------------------------------
    ---- MENÜ KURS UND AUFGABEN (WENN FORMULAR GEÖFFNET IST) POSITIONIERUNGEN -------------
    ---------------------------------------------------------------------------------------
    */
    .nav-panel.on {
        left: -40px;
    }
    .nav-panel {
        top: 90px;
        left: calc(100% + 10px);
        width: calc(100% + 9px);
        height:  calc(100% - 93px);
    }
    
    .nav-link, .nav-link-sub, .nav-link-sub-active{
        font-size: 14px;
    }
    
    .navbar-leiste ul li img {
        width: 25px;
        height: 25px;
        border: 2px solid #FFFFFF;
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        border-radius: 25px;
    }
    #nav-link-bild-home{
        background-size: 25px 25px;
    }

    #nav-link-bild-news{
        background-size: 25px 25px;
    }

    #nav-link-bild-links{
        background-size: 25px 25px;
    }

    #nav-link-bild-bilder{
        background-size: 25px 25px;
    }

    #nav-link-bild-bio{
        background-size: 25px 25px;
    }

    #nav-link-bild-kurse{
        background-size: 25px 25px;
    }

    #nav-link-bild-aufgaben{
        background-size: 25px 25px;
    }

    #nav-link-bild-sprachen{
        background-size: 25px 25px;
    }

    .nav_KA-link-sub-active, .nav_KA-link-sub{
        margin-bottom: 10px;
        height: 50px;
        padding-bottom: 15px;
        font-size:15px;
    }
    /*
    ---------------------------------------------------------------------------------------
    ----------------- RAHMEN, NAV LEISTE, HAMBURGER BUTTON UND FORM CONTAINER -------------
    ---------------------------------------------------------------------------------------
    */
    .Frosed_Glass_Rahmen{
        transform: scale(0.6);
        width: 390px;
        left: -70px;
        top: -10px;
    }
    
    .startseite_Frosed_Glass_Rahmen.klein{
        display: none;
        visibility: hidden;
        left: -9999px;
    }
    
    .subcontainer_Frosed_Glass_Rahmen{
        top: 95px;
        height: calc( 100% - 135px);
        width: calc(100% - 40px);
        left: 10px;
    }
    
    .ToggleButton-Hintergrund.on{
        display: block;
        top: 14px;
        left: calc(100% - 100px);
    }


    #Nav_Root_menu_hamburg{
        width: 40px;
        height: 40px;
    }
}

@media only screen
  and (max-width: 455px)
{
    .Div_Container_Anmeldung_Titel.on{
        left: 30px;
        top: 0px;
    }
    .Div_Container_Anmeldung_Titel_Label{
        font-size: 16px;
    }
}

@media only screen
  and (max-width: 470px) 
{
    .begruessung-text{
        font-size: 22px;
    }
}

@media only screen
  and (max-width: 767px) 
{
    .Div_Container_Anmeldung{
        left: -30px;
        width: calc(100% + 30px);
        height: calc(100% - 120px);
    }
    .Tabelle_Anmeldung{
        font-size: 15px;
        left: 0px;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .li_anmeldung:hover .Tabelle_Anmeldung
    {
        left: 30px;
    }
    .li_anmeldung{
        padding-bottom: 5px;
        width: calc(100% - 40px);
    }
    .li_anmeldung:hover
    {
        width: calc(100% - 40px);
    }
}
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
-------------------------- HEIGHT FÜR DAS HANDY ---------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/
@media only screen
  and (max-height: 238px)
{
    .cookie_Info{
        font-size: 16px;
    }
}
@media only screen
  and (max-height: 315px)
{
    .cookie_legende_box.on{
        top: 5px;
    }
    .cookie_info_box{
        top: 5px;
    }
}
@media only screen
  and (max-height: 410px)
{
    .cookie_legende_box.on{
        top: 5px;
    }
}

@media (hover: none)
{
    
}
/*
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
-------------------------- ENDE FÜR DAS HANDY -----------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
*/

