/* ========== Definition der Basis-Schriftart und Hintergrundfarbe */

body,p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}


/* ========== Für die Tabellen muss die Schriftart nochmals wiederholt werden */

td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
}

/* ========== Tabellen-Überschriften */
th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	padding-top:2px;
	padding-bottom:5px;
}

input.klein {
    font-size:10px;
}

select.klein {
    font-size:11px;
}

input[type="text"]:focus,input[type="password"]:focus, textarea:focus, select:focus { outline: thin solid #EE0000; background-color: #FAFAFA; }


/* ========== Einsatztabelle in Hauptspalte */
table.midtable {
  border: 1px solid #666666;
  padding: 3px;
  width:100%;
}


/* ========== Untermenü in Hauptspalte */
div.submenu {
  border: 1px solid #666666;
  padding-left:10px;
  padding-right:10px;
}

/* ========== Verschiedene Farben für Tabellenzeilen erhöhen die Übersicht */

tr.gerade {
  background-color:#FAFAFA;
}
tr.ungerade {
  background-color:#E5E5E5;
}

/* Tabellen-Zeilen even/odd, Kategorien */
.colA { background-color:#FFE7C6; }
.colB { background-color:#FFF6EA; }

.col1 { background-color:#FFEFD3;; } /* Termine */
.col2 { background-color:#FFDFA8; } /* Einsaetze */
.col3 { background-color:#FFD589; } /* Kurse */
.col4 { background-color:#75d183; } /* Ausflug */
.col5, input.col5:focus { background-color:#75d183; }
.col6, input.col6:focus { background-color:#75d183; }
.col7, input.col7:focus { background-color:#75d183; }
.col8, input.col8:focus { background-color:#75d183; }
.col9, input.col9:focus { background-color:#75d183; }
.col10, input.col10:focus { background-color:#75d183; }
.col11, input.col11:focus { background-color:#75d183; }
.col12, input.col12:focus { background-color:#75d183; }
.col13, input.col13:focus { background-color:#75d183; }
.col14, input.col14:focus { background-color:#75d183; }
.col15, input.col15:focus { background-color:#75d183; }
.col16, input.col16:focus { background-color:#75d183; }
.col17, input.col17:focus { background-color:#75d183; }
.col18, input.col18:focus { background-color:#75d183; }
.col19, input.col19:focus { background-color:#75d183; }

/* ========== MouseOver-Effekt in Tabellen: die Zeile unter der Maus wird hervorgehoben */
tr.mouse { background-color:#FFC04C; }

/* ========== Wird eine Zeile angeklickt, so bleibt diese in einer weiteren Farbe markiert */
tr.klick { background-color:#FFB42B; }

/* ========== Trennzeile zwischen verschiedenen Wochen */
tr.trenn {
  background-color:#CCCCCC;
}

/* ========== Spalte für den eigentlichen Seiteninhalt */
td.maincol {
  padding-left:20px;
}

/* ========== Logo Ÿber dem MenŸ links */
td.menuecol {
  background-color: #CCCCCC;
  background-image:url('https://drk-schwaikheim.de/fileadmin/Bilder_und_Videos/hiorglogo.jpg');
	background-position: 10px 20px;
	background-repeat:no-repeat;
	padding-top: 220px
}

/* ========== Logo ausblenden */
div.logo {
	display:none;
}

/* ========== Spalte fŸr das MenŸ links */
td.menuecol {
  background-color: #ffffff;
  margin:0px;
  padding-left:0px;
  padding-top:140px;
  width:200px; /*alt 220 */
}
td.menu_head {
  background-image:url('pics/box_top.jpg');
  background-color: #e6e6e6;
  padding-left:8px;
  padding-top:8px;
  padding-bottom:6px;
  color: #333333;
  font-weight: bold;
  text-align:left;
  border-top:#999999 1px solid;
  border-bottom:#ffffff 0px solid;
}
td.menu_box {
  background-color: #ffffff;
  padding:5px;
  padding-left:20px;
  border-bottom:#cc3300 0px solid;
}
td.rot {
  background-color:#cc3300;
  color: #ffffff;
  font-weight: bold;
}

/* ========== Einzelne Menüpunkte */
td.menu_box p {
  margin-top:4px;
  margin-bottom:6px;
}
p.menuitem_active {
  margin-top:4px;
  margin-bottom:6px;
  font-weight:bold;
  color:#EE0000;
}
td.menu_box a, td.menu_box a:visited,
#men ul a,
#men ul a:visited,
#menu_row_00 ul a,
#menu_row_00 ul a:visited {
  color: #000000;
}
td.menu_box a:hover,
#men ul a:hover,
#menu_row_00 ul a:hover {
  color: #EE0000;
  text-decoration:underline;
}

#men {
    padding: 2px;
    background-color: #ccc;
    width: 172px;
}
#menu_row_00_wrap {
    padding: 15px 2px 2px 2px;
    background-color: #ccc;
    width: 172px;
}

#men h3,
#menu_row_00_header {
    padding: 3px 5px;
    margin: 0;
}

#men h3 a,
#menu_row_00_header a {
    font-size: 12px;
}

#menu_row_00_header a,
#menu_row_00_header a:visited {
    color: #004276;
}

#men h3.ui-state-active {
    background: #EEEEEE;
}

#men div {
    overflow: visible;
    padding: 0.3em 2.2em;
}

#men ul,
#menu_row_00 ul {
    margin: 0;
    list-style-type: none;
    padding-left: 0;
    font-size: 12px;
}


#men ul li,
#menu_row_00 ul li {
    margin: 7px 0;
}


#menu_row_00_header {
    background: #EEEEEE;
    border: #888 1px solid;
}

#menu_row_00 {
    border: #888 1px solid;
    border-top: none;
    padding: 0.3em 2.4em;
    font-size: 12px;
    margin-bottom: 1px;
}

#men div.google_input ul form div {
    padding: 0.3em 0;
}

.ui-corner-top {
    border: 1px solid #EE0000;
}

.menulink_active {
    font-weight: bold;
}

#up_please  {
    bottom: 52px;
    position: fixed;
    width: 154px;
    height: 20px;
    padding: 10px 8px 8px 8px;
    margin-left: 2px;
}

#up_please_triangle {
    float: left;
}

#up_please_text {
    margin-left: 8px;
    color: #004276;
    text-decoration: none;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    cursor: pointer;
}
/* ========== Auf der Seite  -Helfer einteilen-  werden aus der alphabetischen Helferliste */
/*            diejenigen farblich hervorgehoben, die fest eingeteilt  -fest-  bzw. unverbindlich gemeldet  -meld-  sind. */
.fest {
  background-color:#00EE00;
}
.meld {
  background-color:#FFFF66;
}
.nein {
  background-color:#EE0000;
}

/* === Tabelle bei Einteilung, Feld "summe" */
td.green {
  background-color:#00EE00;
}
td.red {
  background-color:#EE0000;
}



/* ========== (unspezifische) Fehlermeldung, die direkt unterhalb der Seitenüberschrift eingeblendet wird */
div.fehler {
  background-color: #EE0000;
  color: #FFFF66;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
  border: 1px solid #666666;
  padding: 6px;
  margin-bottom:20px;
}
/* ========== (exakte) Fehlermeldung neben dem entspr. falsch ausgefüllten Eingabefeld */
span.fehlertext {
  background-color: #EE0000;
  color: #FFFF66;
  font-size: 13px;
  font-weight: bold;
  padding:2px;
  margin-left:5px;
}

/* ========== Erfolgsmeldung, wird direkt unterhalb der Seitenüberschrift eingeblendet */
div.meldung {
  background-color:#00EE00;
  color: #000000;
  font-weight: bold;
  font-size: 13px;
  text-align: center;
  border: 1px solid #666666;
  padding: 6px;
  margin-bottom:20px;
}

/* ========== Infomeldung, wird direkt unterhalb der Seitenüberschrift eingeblendet */
div.info {
  background-color:#F0F0F0;
  color: #000000;
  font-size: 11px;
  text-align: center;
  border: 1px solid #666666;
  padding: 6px;
  margin-bottom:20px;
}


/* ========== Seiten-Überschrift */
h1 {
	font-size: 20px;
	font-weight: bold;
	color:#EE0000;
	margin-bottom:55px;
}

/* ========== Teil-Überschriften, zB auf der Übersichts-Seite  */
h3 {
	font-size: 14px;
	font-weight: bold;
}

/* ========== Am Seitenende: Link  -Zurück-  */
h4 {

}


/* ========== Kleinere Hinweis-Texte  */
small {
	font-size: 10px;
}


/* ========== Links normal Hyperlinks */
a,a:visited {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  color: #0000ed;
  text-decoration: none;
}
/* ========== Links bei Mouseover  */
a:hover {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  color: #EE0000;
  text-decoration:underline;
}

/* ========== Div-Toggle Input  */
.inputdiv {
    position: absolute;
    display: none;
    width: 205px;
    border: 1px solid black;
    background-color: white;
}
.inputdiv ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    width: 205px;
}
.inputdiv ul a {
    display: block;
    width: 205px;
}
.inputdiv ul a:focus, .inputdiv ul a:hover, .inputdiv ul a.sel {
    background-color: #FFFF66;
}

.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 20px;
}
* html .ui-autocomplete {
    height: 300px;
}