/* General font families for common tags, i.e. the whole body */
body, font, th, td, p {
	font-family: Verdana, Arial, "Helvetica Neue", Helvetica, sans-serif;
}

body {
	touch-action:manipulation;
	margin:0px;
	padding:0px;
	font-size:18px;
	color:#0a0a0a;
	background-color:#ffffff;
}

h1 {
	margin:0px 0px 14px 0px;
	color:#bbc3d3;
}

p {
	margin:0px 0px 12px 0px;
}

ul {
	margin:16px 12px 24px 16px;
}

li {
	margin:4px 0px 4px 0px;
}

a {
	color:#1818e5;
	text-decoration:none;
}

a:hover { font-style:italic; }

span.highlight { font-weight: bold; }

/* NOT for images in attachments but only for images, which are directly placed as html inside a posting. style=... inside html is forbidden.
   Attention: The image dimensions in width=... and height=... should be placed in the same img tag additionally! */
img.responsive { max-width: 100%; height: auto; border: 0; }

/* Make broad tables in postings scrollable */
div.responsive, table.responsive { overflow-x: auto; }

td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; }
tr:nth-child(even) { background-color: #dddddd; }

#Header {
	margin:20px 0px 17px 0px;
	padding:17px 3px 14px 20px;
	/* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */
	height:39px; /* 17px + 17px + 2px = 33px */
	border-style:solid;
	border-color:black;
	border-width:1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
	background-color:#eee;
}

#Content {
	margin:0px 50px 50px 200px;
	padding:10px;
}

#Menu {
	position:absolute;
	top:108px;
	left:15px;
	width:150px;
	padding:10px;
	background-color:#eee;
	border:1px dashed #999;
}

#MenuMobile {
	display:none;
}

#Share {
        position:absolute;
        top:386px;
        left:30px;
        width:172px;
}

/* Style classes  */
.Quoted {
        text-align:left;
        margin-left:10px;
        margin-bottom:10px;
	padding:5px;
	background:#D1D7DC;
}

/* The following section overwrites the css above for mobile layout. */
@media only screen
	and (max-width : 667px) 
{
	/* Mobile devices get a bigger base font size. */
	body {
		font-size:125%;
		width:100%;
		margin:5px 5px 5px 5px;
		padding:0px;
	}

	h1 {
		font-size:100%;
		padding:15px;
	}

	#Header {
		margin:20px 0px 17px 0px;
		padding:17px 3px 14px 20px;
		/* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */
		height:59px; /* 17px + 17px + 2px = 33px */
		border-style:solid;
		border-color:black;
		border-width:1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
		background-color:#eee;
	}

	#Content {
		position:absolute;
		top:256px;
		display:block;
		margin:0px 0px 0px 0px;
		padding:0px;
		width:100%;
	}

	/* Menu for mobile is on top instead of the lfet side. */
	#Menu {
		display:none;
	}

	#MenuMobile {
		display:block;
		position:absolute;
		top:122px;
		background-color:#eee;
		border-style:dashed;
		border-width:1px 0px;
		border-color:#999;
		width:100%;
		font-weight:bold;
		font-size:80%;
		padding:5px;
	}

	#Share {
		position:absolute;
		top:193px;
		left:10px;
	}
}