/* ----------------------------------------------------
					Default-Definitionen
------------------------------------------------------- 
Diese Definitionen finden dann Anwendung, wenn keine 
weiteren Definitionen verfügbar sind.
Sie können von den spezifischen css-Dateien überschrieben werden
*/
 
#naviBox{
	margin: 10px 5px 0px 25px;
	overflow:hidden;
}



/* ----------------------------------------------------------
				Edit-Wrapper und -Button
Diese Klassen beschreiben Elemente, die den Administratoren
Editierfunktionen für Webseiten-Objekte bieten.
------------------------------------------------------------ */

/* JQuery-Sortierung */
ul#sortable , #sortable li.sortableDiv{
	list-style-type: none;
	margin:0px !important;
	padding:0px;
}


.wrapBox{
 border: 1px solid #d3dee7;
 margin: 0 0 5px 0;
}


/* Diese Klasse wird angewendet, wenn sich der Mauszeiger über die Hauptbox bewegt */
.wrapBoxMOUSEOVER{
 border: 1px solid #d3dee7;
 background-color: transparent;
 margin: 0 0 5px 0;
}


/* Kopfzeile der wrapBox */
.wrapBoxHeader{
 height:20px;
 
 background-color: #EEEEEE;
 background-image: url(systemBGlight.jpg);
 background-position: 50% 50%;
 
 overflow:hidden;
 font-size:0.9em;
}


.wrapBoxHeader div, 
.wrapBoxHeader a, 
.wrapBoxHeader select{
 margin:1px;
 color:#555555;
 font-weight:normal;
 text-decoration: none;
}

div.wrapBoxHeader select{
	font-size:0.9em;
}

#content div.wrapBoxHeader img{
	border:0px;
}

/* Links: bearbeiten, löschen, kopieren und ausschneiden */
div.wrapBoxLinkEdit,
div.wrapBoxLinkCopyCutPaste,
div.wrapBoxLinkDelete{
 float:left;
 margin:auto;
 white-space:nowrap;
 overflow:hidden;
}

div.wrapBoxLinkEdit{			width:13%;}
div.wrapBoxLinkCopyCutPaste{	width:22%;}
div.wrapBoxLinkDelete{			width:10%;}


/* wrapBox Titel*/
div.wrapBoxTitle{
 float:left;
 width:27%;
 overflow:hidden;
 margin:0px 2px 0px 2px;
}



/* In diesem Element befinden sich die Buttons zur Sortierung der Webseiten-Objekte */
.wrapBoxOrderButtons{
 float:right;
 width:25%;
 overflow:hidden;
 margin:0px 2px 0px 2px;
 text-align:right;
 white-space:nowrap;
}

/* Fusszeile der wrapBox */
.wrapBoxFooter{
 background-color: #F5F5F5;
 height:14px;
 overflow:hidden;
 clear:both;
}

.wrapBoxFooter, .wrapBoxFooter a{
 color:#AAAAAA;
 font-weight:normal;
 font-size:0.9em;
}





/* ------------------------------------------------------------------
 *						Page Administration
 * ------------------------------------------------------------------
 *
 * In diesem <div> befinden sich die Administrations-Elemente für die
 * aktuelle Seite */


div.pageAdminBox{
 margin:0px 0px 15px 0px;
 border:1px solid #d3dee7;
 background-color: #f2f6f9;
}

div.pageAdminBoxHeader{
 margin:0px;
 background-color: #E1E1E1;
 background-image: url(systemBGlight.jpg);
 background-position: 50% 50%;
 
 color:#555555;
 font-weight: bold;
}

div.pageAdminBoxContent{
 margin:3px;
 color:#555555;
 font-size:0.9em;
}

/* neues Objekt erstellen */
div.createObject{
 margin: 0px 100px 10px 100px;
 padding: 3px 0px 3px 0px;
 
 border:1px solid #E0E0E0;
 background-color: #E0E0E0;
 background-image: url(systemBGlight.jpg);
 background-position: 50% 50%;
 
 text-align:center;
 
 overflow:hidden;
}

div.createObject a{
 text-decoration:none;
 font-weight: bold;
}




/* ----------------------------------------------------------
				Info-Boxen
------------------------------------------------------------ */
/* editInfo wird verwendet, wenn Eingabehilfen angezeigt werden */
.editInfo{
 background: url(info.gif) no-repeat;
 padding:3px 1px 8px 20px;
 text-align:left;

}

.editInfo, .editInfo a{
 font-size:8pt;
 font-weight:normal;
 color:#555555;
}


/* ------------ Layout der info-Boxen function displayInfo() -------- */
/* Die Box, welche Überschrift und Text umgibt */
.infoBox{
 margin:10px 1px 10px 1px;
 width: 100%;
 border: 1px solid #009391;
}


/* Überschrift der InfoBox */
.infoBoxHeader{
 margin:0;
 padding:2px;
 background-color:#EAEFF5;
 font-weight:bold;
}


/* Text der Infobox */
.infoBoxContent{
 margin:0;
 padding:2px;
 background-color:#FFFFFF;
}


/* --------- Layout der infoUpdate-Boxen function displayUpdateInfo() ------ */
/* Die Box, welche Überschrift und Text umgibt */
.updateInfoBox{
 margin:10px 0 10px 0;
 border: 1px solid #73A145;
}

/* Überschrift der Box */
.updateInfoBoxHeader{
 margin:0;
 padding:2px;
 background-color:#73A145;
 color:#E7F2DD;
 font-weight:bold;
}

/* Text der Box */
.updateInfoBoxContent{
 margin:0;
 padding:2px;
 background-color:#E7F2DD;
 color:#006600;
}

/* Link auf Detail-Seite */
.moreLink{
	text-align:right;
}

/* Buttons zur Schriftgröße in der Sidebar */
input.fontSizeButton{
	width: 35px;
}


div#userLogin{
	display:none;
	text-align:right;
}
	div#userLogin input.userNameInput,
    div#userLogin input.userPasswordInput,
    div#adminNavLoginFormContainer input.userNameInput,
    div#adminNavLoginFormContainer input.userPasswordInput{
        width:100px;
    }

/* header nachträglich hinzugefügt */
div#scrollerBoxHeader{
	display:none;
}



/* ------------------- Tooltip --------------- */
.tooltip{
	background-color:#FFFFFF;
	border: 1px solid #AAAAAA;
	z-index:999;
	min-width:150px;
	padding: 5px;
	text-align: left;
	font-size: 9pt;

	/* ------------ runde Ecken ------------ */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;

	/* ---------- Schatten ------------- */
	box-shadow:0.2em 0.2em 1em -0.2em #99888E;
	-moz-box-shadow:0.2em 0.2em 1em -0.2em #99888E;
	-webkit-box-shadow:0.2em 0.2em 1em -0.2em #99888E;
}



/* ------------Bildgalerie Standard ------------------ */
.galleria{
	height:400px;
	position:relative;
	z-index:20000;
}

/* ----------- Edit-Fenster ------------------ */
div#editContent{
	height:auto !important;
}

	div#editContent table.editTable{
		width:95% !important;
	}

div#editFooter{
	display:none;
}

div.queryNavigationPages a{
	display:inline-block;
	margin-right:1px;
	margin-left:1px;
	
	padding-right:5px;
	padding-left:5px;
	
}

	div.queryNavigation{
		text-align:right;
	}
	
	a.queryNavigationPageSelected{
		border:1px solid #DDDDDD;
	}

/* ------------- Benutzerleiste bei eingeloggtem Benutzer ------------------ */
div#userInfoBar{
	margin-bottom:20px;
	border-bottom: 1px solid #F1f1f1;
	text-align:right;
}



/*
 * -----------------------------------------------------------------------
 * mobile-nav
 * -----------------------------------------------------------------------
 * ggf. in responsive.css bei gewünschter Display-Breite einblenden
 */

.slicknav_menu {
	display:none;
}

/*
 * -----------------------------------------------------------------------
 * Text mit Aufklapp-Funktion
 * -----------------------------------------------------------------------
 */

.clickable{
	cursor:pointer;
}


/*
 * -----------------------------------------------------------------------
 * Schulaufgabenplan
 * -----------------------------------------------------------------------
 */

.schoolplan .printBox{
	float:right;
	
}

.classSelectionBox{
	margin-bottom:20px;
}
.classSelection,
.printBox a{
	display:inline-block;
	text-align:center;
	width:30px;
	padding:3px;
	margin-right:2px;
	margin-bottom:4px;
	background-color:#EEEEEE;
	border:1px solid #EEEEEE;
}

.classSelection.allClasses{
	width:71px;
	text-decoration:none;
}
.printBox a{
	width:auto;
	text-decoration:none;
}

.classSelection:hover,
.classSelection.selected{
	background-color:#CCCCCC;
	border-color:#999999;
}

.classSelection a{
	text-decoration:none;
}
.schoolPlanTooltipEvent{
	width:200px;
	padding:5px;
	background:#EEEEEE;
	position:absolute;
	z-index:10001;
	
}

#content a.fc-event,
#content a.fc-event:hover{
	cursor:pointer;
	color:#FFFFFF;
	text-decoration: none;
	border-width:0px;
}

/* Holiday */
#content a.eventCategory_H{
	background-color: #519B30;
	
}

/* Public */
#content a.eventCategory_P{
	background-color: #999999;
}

/* Internal */
#content a.eventCategory_I{
	background-color: #CCCCCC;
}





/* fix fuer Darstellungs-problem im firefox */
hr {
	border: 0;
	height: 1px;
	color: #AAAAAA;
	background-color: #AAAAAA;
}

/* --- Suche im Veranstaltungskalender --- */
form.searchEventForm{
	position:relative;
}

	form.searchEventForm #datePicker{
		position:absolute;
		right:0px;
		top:0px;
	}


/* --- elemente nicht drucken --- */
@media print
{
    .no-print,
    .no-print *,
    .noprint,
    .noprint *{
        display: none !important;
    }
}



/* Blog */

.blog-box{
    background: white;
    height: 250px;
    display:flex ;
    flex-direction: column ;
    align-items: stretch;
    padding:20px ;
    -webkit-box-shadow: 0px 5px 10px -10px rgba(0,0,0,0.67);
    box-shadow: 0px 5px 10px -10px rgba(0,0,0,0.67);
}

.blog-box-header {
    display: flex;
}

.blog-box-title{
    margin: 0;
    text-align:left;
}

.header-filler{
    width:25% ;
}

.blog-box-content{
    flex-grow:4 ;
    display:flex ;
    flex-direction: row ;
}

.blog-box-image-section{
    width: 25%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top ;
}

.blog-box-description-section{
    width: 75%;
    display:flex ;
    flex-direction: column;
    justify-content:space-between;
    padding-left:20px
}

.blog-box-description{
    margin-bottom: 10px;
}

.blog-box-details{
    display: flex;
    justify-content:space-between ;
}

.blog-detail{
    text-align: left;
}


@media only screen and (max-width: 600px) {

    .blog-box{
        height: 540px;
    }

    .blog-box-title{
        width:100% ;
        text-align:center;
    }

    .header-filler{
        display: none;
    }

    .blog-box-content{
        flex-direction: column ;
        align-items: stretch;
    }

    .blog-box-image-section {
        width: 100%;
        height: 50%;
    }

    .blog-box-description-section{
        width: 100%;
        height: 50%;
        padding-top:10px;
    }
}


.blog-header{
    height: 20px;
}