@charset "utf-8";

/* Kommentare so, nicht mit ' */
/* top-right-bottom-left Reihenfolge einhalten ?? */

html {

        /*background-color: green ; */
        background-color: #2F3E58; /*andi steel blue*/
        font-family: sans-serif ;
        }

body {
        background-color: #2F3E58 ; /*andi steel blue */
      /* margin: 0px; */
      /* default margin für body ca. 5px; abhängig vom browser ? */

}

nav {
        display: flex;
        background-color: #111B2D; /*dark ocean blue */
        color: light-grey;
        border-color: red ;
        margin-top: 0.5em ;
        margin-bottom: 0.5em ;
        /* padding: 1em ;*/
        justify-content: space-around;
        flex-wrap: wrap;
        align-items: center;
    	min-height: 2em;
        }

#dianav {
        display: flex;
        background-color: lightgray; /*xx*/
        border-color: red ;
        margin-top: 0.5em ;
        margin-bottom: 0.5em ;
        /* padding: 1em ;*/
        justify-content: space-around;
        flex-wrap: wrap;
        align-items: center;
    	min-height: 2em;
        }

/*selbstbenannte elemente müssen mit # beginnen */
#twocol {
        display: flex;
        flex-direction: row ;
        background-color: #2F3E58 ;
        margin: 1em;
        margin-right: auto;
        margin-left: auto;
}

#wrapper {
        display: flex;
        flex-direction: column ;
        background-color: #2F3E58 ;
        max-width: 750px;
        margin: 1em;
        margin-right: auto;
        margin-left: auto;
}


#ka_grid {
        display: grid;
        grid-template-columns: 4em 2em auto 1em ;
        border: thin solid;
        /*justify-items: center;*/
}


#ka_leer,
#ka_WE,
#ka_FT,
#ka_GZ,
#ka_UR,
#ka_KI,
#ka_Nr_ferien,
#ka_beide_ferien,
#ka_andereweg {border: thin solid; display: flex; justify-content: center;}


#ka_terminnichtweg {background-color: lightgray; border: thin solid; display: flex; text-indent: 0.5em ;}
#ka_ichweg {background-color: gold; border: thin solid; display: flex; text-indent: 0.5em ;}

#ka_leer {background-color: lightgray;}
#ka_WE {background-color: green;}
#ka_FT {background-color: green;}
#ka_GZ {background-color: limegreen;}
#ka_UR {background-color: limegreen;}
#ka_KI {background-color: orange;}


/*#ka_andereweg = Niedersachesn Ferien*/
#ka_andereweg {background-color: red;}
#ka_beide_ferien {background-color: darkviolet;}
#ka_Nr_ferien {background-color: blue;}


article {
        background-color: lightgray ;
        text-align: justify ;

        margin-top: 0em;
        margin-right: 0px;
        margin-bottom: 1em;
        margin-left: 0px;

        /* padding top, bottom 1px viel größer als 1 px!
         "collapsing margins"
        padding >0 verhindert zusammenfallen der margins von <p> und ...
        d. h.  default margin von <p> kommt mindestens zum tragen
        kann verhindert werden indem margin von <p> auf Null gesetzt wird,
        aber dann kein Abstand nach Absatz */
        padding-top: 1px ;
        padding-right: 2em ;
        padding-bottom: 1px ;
        padding-left: 2em ;

        }

 /* p {
  margin: 0px;
} */

dl.grid {
	display: grid;
	grid-template-columns: auto auto;
	/*background-color: red ;*/
}

dl.grid dd {
	margin-bottom: 1em;
	/*background-color: yellow ;*/
}


a.dianav:link {color: black; text-decoration:none;}
a.dianav:visited {color: black; text-decoration:none;}
a.dianav:hover {color: darkgrey; text-decoration:none;}
a.dianav:active {color: gold; text-decoration:none;}


a.menue:link {color: lightgrey; text-decoration:none;}
a.menue:visited {color: lightgrey; text-decoration:none;}
a.menue:hover {color: white; text-decoration:none;}
a.menue:active {color: gold; text-decoration:none;}


a.kal:link {color: black; text-decoration:none;}
a.kal:visited {color: black; text-decoration:none;}
a.kal:hover {color: darkgrey; text-decoration:none;}
a.kal:active {color: darkgrey; text-decoration:none;}

a.kal.heute:link {color: dodgerblue; text-decoration:none;}
a.kal.heute:visited {color: dodgerblue; text-decoration:none;}
a.kal.heute:hover {color: deepskyblue; text-decoration:none;}
a.kal.heute:active {color: deepskyblue; text-decoration:none;}