body {
    max-width: 1024px;
    margin: 0 auto;
}
a {
    text-decoration: none;
    color: black;
}
h1 { 
    font-family: sans-serif;
    background-color: blue;
    color: white;
    padding: 0;
    margin: 0;
}
h2 {
    font-family: sans-serif;
    font-size: 1.2em;
    background-color: red;
    color: white;
    padding: 0;
    margin: 0;
}
button {
    background-color: white;
    border: 2px solid blue;
    color: black;
    padding: 8px 2px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-family: sans-serif;
    /* better use em: */
    font-size: 16;
    border-radius: 4px;
    margin: 4px 0;
    transition-duration: 0.4s;
    width: 100%;
    cursor: pointer;
}
button:hover {
    background-color: blue;
    color: white;
}
input[type=button] {
    background-color: white;
    border: 2px solid blue;
    color: black;
    padding: 8px 2px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-family: sans-serif;
    font-size: 16;
    border-radius: 4px;
    margin: 4px 0;
    transition-duration: 0.4s;
    width: 100%;
    cursor: pointer;
}
input[type=button]:hover {
    background-color: blue;
    color: white;
}
input[type=text], select {
    width: 100%;
    padding: 8px 2px;
    margin: 4px 0;
    display: inline-block;
    border: 1px solid blue;
    border-radius: 4px;
    box-sizing: border-box;
}
input[type=date], select {
    width: 100%;
    padding: 8px 2px;
    margin: 4px 0;
    display: inline-block;
    border: 1px solid blue;
    border-radius: 4px;
    box-sizing: border-box;
}
input[type=time], select {
    width: 100%;
    padding: 8px 2px;
    margin: 4px 0;
    display: inline-block;
    border: 1px solid blue;
    border-radius: 4px;
    box-sizing: border-box;
}
input[type=number], select {
    width: 100%;
    padding: 8px 2px;
    margin: 4px 0;
    display: inline-block;
    border: 1px solid blue;
    border-radius: 4px;
    box-sizing: border-box;
}
input[type=password], select {
    width: 100%;
    padding: 8px 2px;
    margin: 4px 0;
    display: inline-block;
    border: 1px solid blue;
    border-radius: 4px;
    box-sizing: border-box;
}
input[type=email], select {
    width: 100%;
    padding: 8px 2px;
    margin: 4px 0;
    display: inline-block;
    border: 1px solid blue;
    border-radius: 4px;
    box-sizing: border-box;
}
input[type=submit] {
    background-color: lightblue;
    border: 2px solid blue;
    color: white;
    padding: 8px 2px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-family: sans-serif;
    font-size: 16;
    border-radius: 4px;
    margin: 4px 0;
    transition-duration: 0.4s;
    width: 100%;
    cursor: pointer;
}
input[type=submit]:hover {
    background-color: blue;
}
div {
    font-family: sans-serif;
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 5px 2px;
}
#div-header1 {
    font-family: sans-serif;
    background-color: blue;
    color: white;
    padding: 0;
    margin: 0;
    width: 100%;
    float: left;
    border-radius: 0px;
}
#div-header2 {
    font-family: sans-serif;
    font-size: 1.2em; 
    background-color: red;
    color: white;
    padding: 0px;
    margin: 0;
    width: 100%;
    float: left;
    border-radius: 0px;
    height: 1.5em;
}
#header-line1 {
    display: block;
    float: left;
    width: 100%;
    font-family: sans-serif;
    background-color: blue;
    color: white;
    padding: 0;
    margin: 0;
    width: 100%;
}
#header-line2 {
    display: block;
    float: left;
    font-family: sans-serif;
    color: white;
    padding: 0;
    margin: 0;
    width: auto;
}
.btn_header2 {
    background-color: white;
    border: 1px solid blue;
    color: black;
    padding: 0px 4px 0px 4px;
    text-align: center;
    text-decoration: none;
    display: block;
    height: 100%;
    font-family: sans-serif;
    font-size: 1 em;
    border-radius: 4px;
    margin: 0px 0;
    transition-duration: 0.4s;
    cursor: pointer;
    float: right;
    width: auto;
}
#inline {
    font-family: sans-serif;
    width: 100%;
    height: auto;
    background-color: inherit;
    display: inline-block;
    padding: 0px;
    border-radius: 0px;
    border: none;
    margin: 0;
}
#links{
    display: block;
    float: left;
    background-color: inherit;
    color: inherit;
    padding: 0px 2px;
    border: none;
    border-radius: 0px;
    margin: 0;
}
#mitte{
    display: block;
    float: none;
    background-color: inherit;
    color: inherit;
    padding: 0px 2px;
    border: none;
    border-radius: 0px;
    margin: 0;
    vertical-align: middle;
}
#rechts{
    display: block;
    float: right;
    width: auto;
    background-color: inherit;
    color: inherit;
    padding: 0px 2px;
    border: none;
    border-radius: 0px;
    margin: 0;
}
#single{
    display: block;
    float: left;
    width: 100%;
    background-color: ihnerit;
    color: inherit;
    padding: 0px;
    border: none;
    border-radius: 0px;
    margin: 0;
}
a:link{
    color: inherit;
    text-decoration: none;
}
#framelessselect{
    font-size: inherit;
    border: none;
    border-radius: 0;
    background-color: inherit;
    color: inherit;
    padding: 8px;
    height: inherit;
    width: inherit;
    margin: 0;
}
#red_button {
    font-size: inherit;
    border: none;
    border-radius: 0;
    background-color: red;
    color: white;
    padding: 8px;
    text-align: left;
    height: inherit;
    margin: 0;
}
#red_button:hover {
    background-color: blue; 
}
#btn_frameless {
    font-size: inherit;
    border: none;
    border-radius: 0;
    background-color: inherit;
    color: inherit;
    padding: 8px;
    text-align: left;
    height: inherit;
    margin: 0;
}
#btn_frameless:hover {
    background-color: blue;
    color: white;
}
/* 
table {
    border-style: none;
    width: 100%;
    border-collapse: collapse;
}
th {
    background: blue;
    color: white;
    font-weight: bold;
    height: 2em;
}
*/
.event-table-row {
    height: 2em;
    color: black;
}
.event-table-row:nth-of-type(odd) {
    background: white;
}
.event-table-row:hover {
    background: lightblue;
}
.div-scrollable {
    overflow-x: auto;
}
.div-table {
    display: table;
    padding: 0;
    border: 1px solid blue;
    border-radius: 4px;
    width: 100%;
}
/* a href as line */
.href-line {
    display: table-row;
    background-color: white;
    border-radius: 0;
    margin: 0;
    padding: 4px 0;
    color: black;
}
.href-line:nth-of-type(odd) {
    background-color: #ddd;
}
.href-line:link {
    text-decoration: none;
    color: inherit;
}
.href-line:hover {
    background-color: lightblue;
    color: white;
}
/* table header line */
.href-line:first-child {
    background-color: blue;
    color: white;
}
.div-cell {
    display: table-cell;
    padding: 8px 2px;
    margin: 0 2px;
    border-left: 1px solid blue;
    background-color: inherit;
    border-radius: 0;
}
.div-cell:first-child {
    border-left: none;
}
#classic-link {
    text-decoration: underline blue;
    color: blue;
}
