@CHARSET "UTF-8";

body form h1 table img {
    margin: 0;
    padding: 0;
    border: 0;
}

body {
    background: #FFFFFF;
    color: #000000;
    font-size: 100.01%;
    font-family: Helvetica, Arial, sans-serif;
    margin: 1em 0 1em 0;
    padding: 0;
    border: 0px ridge silver;
    min-width: 41em;
    /* Mindestbreite verhindert Umbruch und Anzeigefehler in modernen Browsern */
}

div#header {
    font-size: 1.4em;
    margin: 0;
    padding: 0.2em 0 0 1.2em;
    text-align: left;
    color: #26569E; /* blaeulich */
    background-color: #E6EAB2;
    border: 2px ridge #26569E;
}

div#header h1 {
    font-size: 1.4em;
    margin: 0;
    padding: 0;
    text-align: left;
    color: #26569E; /* blaeulich */
    background-color: #E6EAB2; /* gruen */
}

#zeitseitenaufbau {
    position: absolute;
    top: 0em;
    left: 0em;
    width: 200px;
    border: 0;
    margin: 2em 0 0 2.2em;
    padding: 3px 10px 0px 10px;
    min-height: 17px;
    color: #5C5C5C;
    text-align: left;
    font-size: 0.6em;
}

div#aktuelleZeit {
    position: absolute;
    top: 50px;
    left: 344px;
    border: 0;
    margin: 0;
    padding: 0;
    color: #26569E;
    text-align: right;
    font-size: 0.9em;
    font-weight: bold;
}

div#servicemenue {
    position: absolute;
    top: 0;
    right: 0;
    border: 0;
    margin: 0.2em 0 0 0;
    padding: 0;
    min-height: 17px;
    color: #5C5C5C;
    text-align: right;
    font-size: 0.75em;
}

div#servicemenue a {
    width: 66em;
    border: 1px ridge #26569E;
    margin: 0;
    padding: 0 1em 0 1em;
    color: #26569E; /* gruen */
    background-color: #E6EAB2;
    text-align: center;
    font-size: 0.9em;
    font-weight: bold;
    text-decoration: none;
}

div#servicemenue a:hover {
    color: #E6EAB2;
    background-color: #26569E;
    text-decoration: none;
    border: 1px dashed #E6EAB2;
}

ul#Navigation {
    font-size: 0.83em;
    float: left;
    width: 18em;
    margin: 0.6em 1.3em 1.3em 1em;
    padding: 0 0 0 0;
    border: 0px dashed #26569E;
    min-width: 18em;
    /* Mindestbreite verhindert Umbruch und Anzeigefehler in modernen Browsern */
}

ul#Navigation li {
    list-style: none;
    margin: 0 0 0 0.3em;
    padding: 0.2em 0 0.2em 0;
}

ul#Navigation a {
    display: block;
    padding: 0.2em;
    font-weight: bold;
    text-decoration: none;
}

ul#Navigation a:link {
    color: #26569E; /* blaeulich */
    background-color: #E6EAB2; /* gruen */
}

ul#Navigation a:visited {
    color: #26569E; /* blaeulich */
    background-color: #E6EAB2; /* gruen */
}

ul#Navigation a:hover {
    color: #E6EAB2; /* gruen */
    background-color: #26569E; /* blaeulich */
}

ul#Navigation a:active {
    color: white;
    background-color: gray;
}

div#Content {
    font-size: 0.9em;
    margin: 0 0 1.1em 0;
    padding: 0 0 1.1em 0;
    border: 0px dashed #26569E;
}

* html div#Content {
    height: 1em;
    /* Workaround gegen den 3-Pixel-Bug des Internet Explorer bis Version 6 */
}

div#Content table#Rahmen {
    font-size: 1.1em;
    margin: 0.6em 1.3em 0 0em;
    padding: 0.2em 0.3em 0.2em 0.3em;
    border: 1px dashed #26569E;
}

div#Content h2 {
    font-size: 1.4em;
    margin: 0.2em 0;
}

div#Content h3 {
    font-size: 1.1em;
    margin: 0.2em 0;
    color: #26569E;
    background-color: #E6EAB2;
}

div#Content p {
    font-size: 1em;
    margin: 1em 0;
}

p#Fusszeile {
    clear: both;
    font-size: 0.8em;
    margin: 0;
    padding: 0.1em 0.4em 0.1em 0.4em;
    text-align: right;
    color: #26569E;
    background-color: #E6EAB2;
    border: 1px solid silver;
}

p#Fusszeile a {
    font-size: 0.8em;
    color: #26569E;
    background-color: #E6EAB2;
    font-weight: normal;
    text-decoration: none;
}

a {
    color: #26569E;
    font-weight: bold;
    text-decoration: none;
    font-weight: bold;
}

a:link {
    color: #26569E;
}

a:visited {
    color: #26569E;
}

a:hover {
    color: #26569E;
}

.buttonLink {
    padding: 0 1em 0 1em;
    margin-left: 1em;
    margin-right: 1em;
    color: #26569E;
    background-color: #F5F7E0;
    border: 2px outset #26569E;
    cursor: pointer;
    font-weight: bold;
}

.buttonLink:hover {
    border: 2px inset #26569E;
    color: #F5F7E0;
    background-color: #26569E;
}

.likeButton {
    padding: 0 3px 2px 0px;
    margin: 1px 0;
    color: #26569E;
    background-color: #F5F7E0;
    border: 1px dotted #26569E;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
}
.likeButton:hover {
    color: #F5F7E0;
    background-color: #26569E;
}
.likeButton input {
    margin: 2px 2px 0 2px;
}
input[type="date"] {
    cursor: pointer;
}

.datePickerBuchen {
    width: 19px;
    background-color: dimgray;
    color: yellow;
    border: 2px outset yellow;
    cursor: pointer;
}
.datePickerBuchen:hover {
    background-color: yellow;
    color: dimgray;
}

table {
    border: 1px outset blueviolet;
}

th, td {
    padding: 2px 3px 0 2px;
    border-bottom: 1px outset blueviolet;
    border-right: 1px outset blueviolet;
}

th {
    font-size: 1em;
    vertical-align: middle;
    background-color: #E6EAB2; /* gruen */
}

td {
    font-size: 0.9em;
    padding: 0.2em 0.3em 0.2em 0.3em;
    vertical-align: top;
    color: #26569E;
}

th.kleiner {
    font-size: 1em;
    padding: 0.2em 0.2em 0.4em 0.2em;
    background-color: #E6EAB2; /* gruen */
}

table.ohneBorder th,
table.ohneBorder td {
    border: 0;
}

.ElementMitRahmen {
    color: #000000;
    background-color: #FFFFCC;
    font-size: 1em;
    font-weight: bold;
    padding: 1em;
    border: 3px inset #254880;
}

.HinweisTextMitRahmen {
    background-color: #FCF800;
    margin: 1em;
    padding: 1em;
    border: 3px inset #254880;
}

.HinweisZusatz5 {
    /* Ueberschreibt die oberen Werte teilweise */
    color: #990000;
    background-color: #FCF800;
    border: 3px inset #990000;
}

.HinweisZusatz9 {
    /* Ueberschreibt die oberen Werte teilweise */
    color: #FCF800;
    background-color: #008000;
    border: 3px inset #990000;
}

.GezeigterText {
    color: #990000;
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1.2em;
}

a.GezeigterText:hover {
    color: #ffffcc;
    background-color: #990000;
}

.VersteckterText {
    background-color: #ededed;
}

input, select, textarea, radio .button_spezial {
    color: #003789;
    background-color: #F5F7E0;
}

input[type=submit] {
    background-color: #26569E;
    color: #C5E282;
    font-weight: bold;
}

input.button_submit {
    background-color: #26569E;
    color: #F5F7E0;
    font-weight: bold;
}

input.button_achtg {
    background-color: #990000;
    color: #F5F7E0;
    font-weight: bold;
}

#meinForm textarea {
    font-size: 1.0em;
    font-weight: bold;
}

.allgForm {
    width: 30em;
}

#meinForm .button_spezial {
    font-size: 1.0em;
    font-weight: bold;
}

/** START: Selectbox auf der Buchungsübersicht */
.formMitSelectbox {
    display: inline;
}

.formMitSelectbox select {
    border: 1px outset #26569E;
    -moz-padding-start: calc(10px - 3px);
    height: 23px;
    padding-left: 10px;
    color: #26569E;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    font-weight: bold;
    border-radius: 11px;
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.3);
    outline: none;
    cursor: pointer;
}

.formMitSelectbox select option {
    color: #666;
}

.formMitSelectbox select:focus::-ms-value {
    background-color: transparent;
}

.formMitSelectbox button {
    border: 1px outset #26569E;
    border-radius: 11px;
    height: 23px;
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.3);
    cursor: pointer;
}

/** ENDE: Selectbox auf der Buchungsübersicht */

.vieles_spezial {
    color: #26569E;
    background-color: #F5F7E0;
}

input.vieles_spezial {
    color: #26569E;
    background-color: #F5F7E0;
    font-weight: bold;
}

.vertical-text-bottom {
    border: 0;
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg); /* Chrome und Safari */
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);,
    /* START: fuer den IE: */
-ie-transform: rotate(270 deg);
    -ms-transform: rotate(270deg); /* IE 9 */
    /* PAUSE
    filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    writing-mode: inherit;
     */
    white-space: nowrap;
    display: block;
    bottom: 0;
    width: 20px;
    height: 20px;
    text-shadow: 0px 0px 1px #efefef;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px -3px 0px;
}

/*funktioniert noch nicht*/
.vertical-text-top {
    border: 0px solid red;
    writing-mode: tb-rl;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    white-space: nowrap;
    display: block;
    bottom: 0;
    width: 20px;
    height: 20px;
    text-shadow: 0px 0px 1px #efefef;
    padding: 0px 0px -10px 0px;
    margin: 0px 0px -10px 0px;
}


[data-description] {
    /* display: block; *//* ausgeblendet von Ralf */
    position: relative;
}

[data-description]:focus:before,
[data-description]:hover:before {
    content: attr(data-description);
    display: block;
    position: absolute;
    top: 1.2em;
    left: 1.2em;
    min-width: 10em; /* Neu von Ralf */
    max-width: 33em; /* geaendert von Ralf */
    border: .0625em solid #333;
    padding: .25em;
    color: #26569E;
    text-align: left; /* Neu von Ralf */
    z-index: 10; /* Neu von Ralf */
    font-size: 15px; /* Neu von Ralf */
    font-weight: bold; /* Neu von Ralf */

    -webkit-border-radius: .125em; /* Saf3-4, iOS 1-3.2, Android <e;1.6 */
    -moz-border-radius: .125em; /* FF1-3.6 */
    border-radius: .125em; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */

    /* useful if you don't want a bg color from leaking outside the border: */
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;


    -webkit-box-shadow: 4px 4px 6px #aaa; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
    -moz-box-shadow: 4px 4px 6px #aaa; /* FF3.5 - 3.6 */
    box-shadow: 4px 4px 6px #aaa; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */


    background-color: #eeeeee;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#aaaaaa)); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #eeeeee, #aaaaaa); /* Chrome 10+, Saf5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(top, #eeeeee, #aaaaaa); /* FF3.6 */
    background-image: -ms-linear-gradient(top, #eeeeee, #aaaaaa); /* IE10 */
    background-image: -o-linear-gradient(top, #eeeeee, #aaaaaa); /* Opera 11.10+ */
    background-image: linear-gradient(top, #eeeeee, #aaaaaa);
}

/* Ralf vdM, 10.02.2014: Neu mit Rechtsanschlag! */
[data-descript-right] {
    position: relative;
}

[data-descript-right]:focus:before,
[data-descript-right]:hover:before {
    content: attr(data-descript-right);
    display: block;
    position: absolute;
    top: 1.2em;
    right: 1.2em;
    min-width: 10em; /* Neu von Ralf */
    max-width: 33em; /* geaendert von Ralf */
    border: .0625em solid #333;
    padding: .25em;
    color: #26569E;
    text-align: left; /* Neu von Ralf */
    z-index: 10; /* Neu von Ralf */
    font-size: 15px; /* Neu von Ralf */
    font-weight: bold; /* Neu von Ralf */

    -webkit-border-radius: .125em; /* Saf3-4, iOS 1-3.2, Android <e;1.6 */
    -moz-border-radius: .125em; /* FF1-3.6 */
    border-radius: .125em; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */

    /* useful if you don't want a bg color from leaking outside the border: */
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;


    -webkit-box-shadow: 4px 4px 6px #aaa; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
    -moz-box-shadow: 4px 4px 6px #aaa; /* FF3.5 - 3.6 */
    box-shadow: 4px 4px 6px #aaa; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */


    background-color: #eeeeee;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#aaaaaa)); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #eeeeee, #aaaaaa); /* Chrome 10+, Saf5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(top, #eeeeee, #aaaaaa); /* FF3.6 */
    background-image: -ms-linear-gradient(top, #eeeeee, #aaaaaa); /* IE10 */
    background-image: -o-linear-gradient(top, #eeeeee, #aaaaaa); /* Opera 11.10+ */
    background-image: linear-gradient(top, #eeeeee, #aaaaaa);
}


/* Feld für die KLR-ID-Sortierung auf buch_projekthilfe.php */
.sortiereKlrByKlrId {
    width: 5em;
    background-color: #FFFF99;
    font-weight: bold;
}

.sortiereKlrByKlrId:focus {
    color: #ffffff;
    background-color: #800000;
}

/* Der "OnTop"-Button erscheint, wenn eine bestimmte Seiten-Tiefe erreicht ist! */
#buttonNachOben {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 33px; /* Place the button at the bottom of the page */
    left: 33px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    color: white; /* Text color */
    background-color: #990000; /* Set a background color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 11px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 22px; /* Increase font size */
}

#buttonNachOben:hover {
    color: #FFC83D; /* Text color */
    background-color: #555; /* Add a dark-grey background on hover */
}

label.radioButtonLabel {
    white-space: nowrap;
}

details summary:hover {
    font-weight: bold;
    background-color: darkmagenta;
    color: yellow;
    /*padding: 3px 0px;*/
}

@import url(elements.css);