/* Colors: grey: #7b8385 orange: #e58900 */

#head-cell-left, #head-cell-middle, #head-cell-right {
	margin: 0px 0.5em;
}

#Navigation {
	margin: 1.4em 0em;
	border-bottom: 1px solid #E58900;
	padding-bottom: 0.7em;
}

ul.Navigation {
	font-size: 110%;
}

ul.Navigation li {
	border-left: 1px #e58900 solid;
	border-right: 1px #e58900 solid;
	color: #e58900;
	margin: 0.6em 0px;
	margin-left: -1px;
}

/* verschiedene Formatierungen */
body { font-family: sans-serif; background-color: white; }

h1 { text-align:center; font-weight:normal; font-size:2.5em; }
h2 { text-align:center; font-weight:normal; font-size:1.5em; }
h3 { font-size: 1.5em; text-align: center; color: #e58900; }
h4 { margin-top: 0.5em; margin-bottom: 0px; }
.subtitle { text-align: center; margin-bottom: 1em; margin-top: -0.5em; }

#head a, #Navigation a { text-decoration: none; }
a:link		{ color:#000000; }
a:visited	{ color:#000000; }
a:hover		{ color:#e58900; }
a:active	{ color:#e58900; }
a:hover img	{ border: none; }
a img		{ border: none; }
p, ul { line-height: 140%; }
blockquote { margin: 0 0 0 4ex; }
#content { color:#000000; font-size: 90%; }

#content ol { list-style-position: outside; margin: 1ex 0; padding: 0 0 0 4ex; }
#content ul { list-style-position: outside; margin: 1ex 0; padding: 0 0 0 4ex; }
#content ul.blank { list-style: none outside none; padding: 0px; }
#content li { margin-bottom: 0ex; }
#content td,#content th { padding: 4px 8px; }
#content tr.sep { border-top: 1px #e58900 solid; }

.authors { text-align:center; line-height: 140%; display: block; }
.authors span { text-align:center; }
.authors a { text-decoration:none; margin:0 0 0 0em; line-height: 100%; }
.authors p { text-decoration:none; margin:0 1em 0 1em; line-height: 100%; display: inline; }
.heading { margin-bottom:4em; }
.abstract { font-style:italic; }
.slides { overflow: auto; }
.slide { width:45%; float:left; margin:0.5em 0.5em 0.5em 0.5em; }
.slide img { border: 1px dotted gray; }
table.describe, .describe tr, .describe th, .describe td { border: none; } 
pre, .tech { font-family:monospace; font-size:9pt;  }
.howto { background-color:#F1F1F1; padding:1em; margin-bottom:1em; }
div, body, ul.Navigation, ul.Navigation li, #head * { /*just to be sure*/
	margin: 0;
	padding: 0;
}

body { font-size:100.01%;
	max-width: 60em;
	margin: 0px auto;
	margin-bottom: 2em;
	text-align: center;
}

/* Kopfzeile */
#head {
	padding-top: 3.5ex;
	display: table;
}
.head-row  {
	display: table-row;
}
.head-row > * {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}
#head-cell-left {
	float: left;
}
#head-cell-middle {
	width:100%;
}
#head-cell-right {
	float: right;
}

/* Navigation */
#Navigation {
	/*Abstand links definiert durch body.padding-left,
	  Abstand rechts definiert durch div#main.padding-left*/
	overflow: hidden;
	line-height: 150%;
	width: 100%;
	clear: both;
	float: left;
}
ul.Navigation {
	list-style: none;
	left: 50%;
	margin: 0 auto;
	float: left;
	position: relative;
}
* html ul.Navigation li { padding-bottom: 1px; } /* IE 6 Hack */

ul.Navigation li {
	float: left;
	position: relative;
	right: 50%;
}

ul.Navigation a, span.NavCurrent { /* Listelemente zu Boxen machen */
	display:block;
	padding: 0em 1em;
}

/* Inhaltsspalte */
div#main{
	text-align: center;
	clear: both;
	padding: 0 60px; /*der Abstand links und rechts vom Text*/
}

div#content{
	text-align: left;
	margin: 6ex auto 0 auto; /*Abstand zwischen Text und Kopf, Zentrierung*/
}

/* Sonstiges */
.text	{ text-align: justify; }
.center	{ text-align: center; }
.left	{ text-align: left; }
.right	{ text-align: right; }
.use-cases {
    margin-top: 2em;
    margin-bottom: 2em;
}
.use-case {
    margin-bottom: 4em;
}
a.backlink {
    font-family: monospace;
    font-style: italic;
    text-decoration: none;
    color: #023675;
}
a.backlink:hover {
    color: #0060d4;
    font-weight: bold;
}
img.float	{ float:left; margin-right: 1em; margin-bottom: 0.5ex }
img.floatright	{ float:right; margin-left: 1em; margin-bottom: 0.5ex }
img		{ vertical-align:middle; border: none; }

a.gitlab-link::before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-right: 0.3em;
	background: url("gitlab.gif") no-repeat center;
	background-size: contain;
	vertical-align: middle;
}

pre.conversation-good,pre.conversation-bad {
    border-radius: 4px;
    background-color: #fef9f1;
    padding: 1em;
    overflow-x: auto;
    overflow-y: auto;
    max-height: 80vh;
}

pre.conversation-good {
    border: 2px solid #008000;
}

pre.conversation-bad {
    border: 1px solid #890000;
}