/*********  *************/

@media screen
{
	body
	{
		margin-left: 2%;
		margin-right: 2%;
		line-height: 3ex;
		background-color: #fff;
	}
	
	div.body
	{
		background-color: #fff;
		padding: 1em;
		max-width: 52em;
	}
}

body
{
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
}

span.di
{
	text-decoration: underline;
}

span.def
{
	font-weight: bold;
}

span.cell
{
	display: inline-block;
	width: 1.2rem;
	text-align: center;
}
span.headcell
{
	display: inline-block;
	width: 3rem;
	text-align: right;
}

div.pattern
{
	line-height: 2ex;
}

div.headrow
{
	font-size: 83%;
}

div.box
{
	margin-top: 3ex;
	margin-bottom: 2ex;
	margin-left: 2em;
}


div.margin
{
	display: none;
}

div.kasten
{
    background-color: #ddd;
    padding-left: 18px;
    padding-top: 3px;
    padding-bottom: 3px;
}

address
{
	font-size: 83%;
}

div.ind img
{
	max-width: 100%;
}

table.border
{
	border-collapse: collapse;
}

table.border td, table.border th
{
	border: 1px solid lightgray;
}

/************ Formeln **********/
table.formel
{
	display: inline;
	vertical-align:middle;
}

span.bracket
{
	vertical-align:middle;
}

/************ Links **********/

address a, .trailer a, h1 a
{
	text-decoration: none;
}

/************ Überschriften **********/
h1
{
	color: #338;
	font-weight: bold;
	font-size: 83%;
	margin-top: 0ex;
	margin-bottom: 0ex;
}
h1 a
{
	color: #338;
}

.header
{
	text-indent: 0.3em;
	background-color: #E8E8F8;
	color: #448;
}

h4
{
	font-size: 110%;
	font-weight: bold;
	margin-top: 0ex;
	margin-bottom: 0ex;
	color: #555;
}

h5
{
	font-size: 100%;
	font-weight: bold;
	margin-top: 4ex;
	margin-bottom: 0ex;
}

/************ Absätze **********/
p
{
	margin-top: 1ex;
	margin-bottom: 1ex;
}

pre
{
	font-size: 120%;
}

p.abst
{
	line-height: 1ex;
	margin-top: 0ex;
	margin-bottom: 0ex;
}

p.abstvor
{
	margin-top: 2.5ex;
}

.ind
{
	margin-left: 2em;
}

p.bez, p.footnote
{
	font-size: 83%;
	line-height: 2ex;
}

p.line1
{
	text-indent: -2em;
}

/************ Listen **********/
ul, ol
{
	margin-left: 0em;
	padding-left: 1.2em;
	padding-top: 0ex;
	margin-top: 0ex;
}
ol.non
{
	padding-left: 2em;
}
ol.low
{
	padding-left: 3em;
}

li
{
	line-height: 3ex;
	padding-bottom: 0ex;
	padding-left: 0em;
}

ol.dec li, ol.low li
{
	padding-left: 0.2em;
}

img
{
	border: none;
}

.trailer
{
	background-color: #eee;
	margin-bottom: 0ex;
	text-indent: 0.3em;
	padding: 5px;
}

/************ Code **********/

.codeheading
{
	font-weight: bold;
	color: #555;
	background-color: #eee;
	padding: 5px;
}

div.java, div.c, div.javascript, div.pascal, div.vb, div.python, div.haskell
{
	font-family: Courier New, monospace;
	font-weight: normal;
	line-height: 2.8ex;
	background-color: #eee;
	padding: 2px;
}

span.java, span.c, span.javascript, span.pascal, span.vb, span.python, span.haskell
{
	font-family: Courier New, monospace;
	font-weight: normal;
}

div.html, div.php, div.sql
{
	font-family: Verdana, Arial, sans-serif;
	font-size: 95%;
	line-height: 2.8ex;
	background-color: #eee;
	padding: 2px;
}

span.html, span.php, span.sql
{
	font-family: Verdana, Arial, sans-serif;
	font-size: 95%;
}

.codekeyword
{
	/*font-weight: bold;*/
	color: blue;
}

.codetype
{
	font-weight: normal;
	color: #a44;
}

.codefunction
{
	color: darkred;
	font-style: italic;
}

.sql .codekeyword
{
	color: darkred;
	font-weight: normal;
}

.haskell .codekeyword
{
	color: darkviolet;
}

.htmltag
{
	color: blue;
}

.phptag
{
	color: red;
}

.phpkeyword
{
	color: darkred;
}

.phpfunction
{
	color: darkblue;
}

.htmlentity, .codecomment
{
	color: green;
}

p.codetag
{
	line-height: 1ex;
	padding: 0px;
}
span.codetag
{
	background-color: #ccddee;
	border: 0px;
	font-size: 83%;
	padding: 4px;
}

.red
{
	color: red;
}

.green
{
	color: green;
}

.blue
{
	color: #0000c0;
}

.grammar .red
{
	color: #e00000;
}

.grammar .blue
{
	color: #0000b0;
}

/**************** Korrektheitsbeweise ********************/

td.assertnumber
{
	color: #00A;
	padding-left: 18px;
	text-align: right;
}

td.impl
{
	position: relative;
	width: 1.5em;
}

img.relimpl
{
	position: relative;
	top: 1em;
	left: 0.3em;
}

/**************** Tooltips ********************/
.tooltip
{
    position: relative;
    display: inline-block;
    color: #0c0;
    /*border-bottom: 1px dotted black;*/ /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext
{
    visibility: hidden;
    width: 180px;
    background-color: #888;
    color: #fff;
    text-align: center;
    padding: 7px 0;
    border-radius: 6px;

    /* Position the tooltip text */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 50%;
    margin-left: -90px;

    /* Fade in tooltip */
    opacity: 0;
    transition: opacity 1.0s;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after
{
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #888 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext
{
    visibility: visible;
    opacity: 1;
}


@media screen and (max-width: 800px)
{
	body
	{
		position: static !important;
		width: auto !important;
		margin: 0 !important;
	}
	span.cell
	{
		width: 1.0rem;
	}
	div.ind
	{
		margin-left: 1em;
	}
	
}