html, body, h1, h2, h3, h4 {
    font-family: Roboto, Helvetica, Arial, sans-serif;
}

html, body, td, th {
    font-size: 12pt;
}

body {
    line-height: 1.5;
}

html {
    height: 100%;
}

body {
    margin: 0;
}

body.mainbody {
    min-height: 100%;
    position: relative;
    background: white url("pic/Background.gif") repeat-y;
}

h1 {
    font-size: 170%;
}

h2 {
	font-size: 130%;
}

h3 {
	font-size: 110%;
}

a {
    color: #0000C0;
    text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

div.header {
    color: white;
    background-color: #0000C0;
    border-bottom: 1px solid #0000C0;
    white-space: nowrap;
}

span.header {
    display: inline-block;
    vertical-align: middle;
    height: 100%;
    margin: auto;
    padding: 6pt 6pt 3pt 16pt;
    font-size: 90%;
    white-space: nowrap;
}

#menubutton {
    display: none;
}

img.header-logo {
	border: 1pt solid white;
}

#menu {
    float: left;
    display: block;
}

a.menu {
	display:block;
	color: black;
	background-color: #FFFF80;
	text-decoration: none;
	width: 21ex;
	/*margin: 0.2em;*/
	border: 1px solid white;
	/*padding: 0.2em;*/
	white-space: nowrap;
    margin-bottom: 2px;
}

a.menu:hover {
	background-color: #FFFF40;
	border: 1px solid #808080;
}

a.menuakt {
	background-color: #FFFF40;
}

a.menu > span {
    padding: 1px;
}

span.menuind {
    display: inline-block;
}
a.menuakt > span.menuind {
    box-sizing: border-box;
    border-left: 5px solid #0000C0;
}
span.menutext {
}

.menu-sep {
    height: 2ex;
}

div.content {
    margin-left: 24ex;
    padding: 1ex 2ex;
    padding-bottom: 12pt; /* footer */
    /* background-color: lightgreen; /* testing */
    position: relative;
    min-height: 500px;
}

.col-row::after, div.content::after {
    content: "";
    display: table;
    clear: both;
}

.col-half {
    float: left;
    width: 49.99999%;
    margin: 0;
    padding: 0;
    /* background-color: lightgreen; /* testing */
}

.col-half > h2:first-child {
    margin-top: 0;
}

.bildtext {
	font-size: 80%;
}

li.li-no {
    list-style: none;
}

a.link-pdf {
    display: inline-block;
    padding: 0pt 2pt 0pt 24px;
    vertical-align: middle;
    background: url("pic/pdf.gif") no-repeat left;
}

a.link-maps {
    display: inline-block;
    padding: 2pt 40px 2pt 2pt;
    vertical-align: middle;
    background: url("pic/maps_64dp.png") no-repeat right;
    background-size: 32px 32px;
}

a.link-pdf:hover, a.link-maps:hover {
    text-decoration: none;
    background-color: #F0F0F0;
}

footer {
}

.lastchanged {
    position: absolute;
    bottom: 0;
    clear: both;
    background-color: #F2F2F2;
    padding: 1pt 12pt;
    font-size: 7pt;
}

.lastchanged a {
	color: black;
	text-decoration: none;
}

.lastchanged a:hover {
	text-decoration: underline;
}

img.logo {
	border: 1.8pt solid black;
}

hr {
	margin: 0.5em 0px;
	height: 1px;
	color: black;
}

img.fluid {
    width: auto;
    max-width: 100%;
    height: auto;
}

.kontakt {
    background-color: #F2F2F2;
    padding: 0 2ex;
    margin: auto;
    display: table;
}

.kontakt .label {
    display: none;
}

input, textarea {
    font: inherit;
}

input[type=text], textarea {
    width: 50ex;
}

.kontakt input {
    margin-bottom: 0.5ex;
}

iframe {
    min-height: 500px;
}

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

    body.mainbody {
        background: white;
    }

    #menubutton {
        display: inline-block;
        font-size: 280%;
        cursor: pointer;
    }

    span.header {
        padding: 4pt 4pt 0pt 14pt;
    }

    img.header-logo {
        width: 203px;
        height: 56px;
    }

    span.header-big {
        display: none;
    }

    #menu {
        display: none;
        position: absolute;
        z-index: 1;
        background-color: #A0A0FF;
        box-shadow: 10px 10px 15px grey;
    }

    .menu-sep {
        height: 3px;
    }

    div.content {
        margin-left: 0;
    }

    .col-half {
        width: 100%;
    }

    input[type=text], textarea {
        width: 99%;
    }
}