/****************************************************************
* General HTML
****************************************************************/

html {
	overflow-y: scroll; 
}

body {
	font-family: Helvetica, sans-serif;
	font-size: 15px;
	margin: 0px;
}

a {
	text-decoration: none;
}

h1 {
	font-size: 24px;
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 18px;
	color: rgb(10,100,200);
}

h2 {
	font-size: 20px;
	font-weight: normal;
	margin-top: 16px;
	margin-bottom: 16px;
	color: rgb(10,100,200);
}

h3 {
	font-size: 18px;
	font-weight: normal;
	margin-top: 14px;
	margin-bottom: 14px;
	color: rgb(10,100,200);
}

h4 {
	font-size: 20px;
	font-weight: normal;
	margin-top: 14px;
	margin-bottom: 14px;
	color: rgb(10,100,200);
}

img {
	border: none;
}

p {
	text-align: justify;
}

code {
	font-weight: bold;
}

pre {
	border: thin;
	border-style: solid;
	border-color: rgb(88,174,6);
	padding: 8px;
}

/****************************************************************
* Global
****************************************************************/

.red {
	color: #FF0000;
}

.center {
	text-align:	center;
}

.screenshot_display {
  opacity: 0;
  position: fixed;
  left: 0;
  top: -200%;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: opacity 0.25s ease-in-out;
}

.screenshot_display:target {
  opacity: 1;
  top: 0;
}

.screenshot_box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 10px;
  background-color: white;
  box-shadow: 0px 0px 50px 2px #000000;
}

.screenshot_display img {
  max-width: 90vw;
  max-height: 90vh;
} 

.screenshot_content {
}

/****************************************************************
* Logo
  max-width: 90vw;
  max-height: 90vh;
  display: block;
  position: relative;
  overflow:  hidden;
****************************************************************/

.logo {
	font-size: 16px;
	color: black;
	width:984px;
	margin: 0px auto;
	padding: 8px;
	text-align:center;
}

/****************************************************************
* Main-Menu
****************************************************************/

.main_nav_block {
	background-image: url("/back.jpg"); 
	text-align: center;
}

.main_nav_content {
	line-height: 43px;
	width: 984px;
	margin: 0px auto;
	padding: 0px 8px;
}

.main_nav_content a {
	font-size: 16px;
	background-color: none;
	color: black;
	padding: 10px;
	margin: 0px 1px;
	text-decoration: none;
	transition: all 0.25s ease-in-out;
}

.main_nav_content a:hover {
	color: white;
	background-color: rgb(10,100,200);
}

.main_nav_content .main_nav_selected {
	color: white;
	background-color: rgb(10,100,200);
}

/****************************************************************
* Content
****************************************************************/

.content {
	overflow: hidden;
}

.content a {
	color: rgb(10,100,200);
	font-weight: bold;
	background-color: none;
	transition: all 0.25s;
}

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

.content_block {
	width: 984px;
	margin: 0px auto;
	padding: 8px 8px;
}

/****************************************************************
* Content-Menu
****************************************************************/

.content_nav {
	float: right;
	margin-left: 20px;
	font-size: 15px;
	width: 214px;
}

.content_nav_title {
	color: white;
	padding: 5px;
	background-color: rgb(10,100,200);
	display: block;
	border-bottom: 1px white solid;
	text-align: center;
}

.content_nav_lvl0 {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

.content_nav_lvl1 {
	list-style-type: none;
	padding-left: 20px;
	margin: 0px;
}

.content_nav_lvl0 a {
	color: black;
	padding: 5px;
	text-decoration: none;
	border-bottom: 1px white solid;
	display: block;
	transition: all 0.25s ease-in-out;
}

.content_nav_lvl0 a:hover {
	color: white;
	background-color: rgb(20,133,255);
}

.content_nav .content_nav_lvl0_selected {
	color: white;
	background-color: rgb(20,133,255);
}

.content_nav_lvl1 a {
	color: black;
	padding: 5px;
	text-decoration: none;
	border-bottom: 1px white solid;
	display: block;
	transition: all 0.25s ease-in-out;
}

.content_nav_lvl1 a:hover {
	color: white;
	background-color: rgb(88,174,6);
}

.content_nav .content_nav_lvl1_selected {
	color: white;
	background-color: rgb(88,174,6);
}

/****************************************************************
* Source
****************************************************************/

.code_blue {
	color: rgb(0,0,255);
}

.code_lightblue {
	color: rgb(43,145,175);
}

.code_green {
	color: rgb(0,128,0);
}

.code_red {
	color: rgb(161,21,21);
}

/****************************************************************
* Tables
****************************************************************/

.table_elefant td {
	padding: 0;
	vertical-align: top;
}

.table_times {
	border-collapse: collapse;
}

.table_times th {
	background-color: rgb(10,100,200);
	color: rgb(255,255,255);
	text-align: center;
	padding: 1px 8px;
}

.table_times td {
	text-align: right;
	padding: 1px 12px;
	border-bottom: thin rgb(88,174,6) solid;
}

.table_step {
	border-collapse: collapse;
}

.table_step th {
	background-color: rgb(10,100,200);
	color: rgb(255,255,255);
	text-align: center;
	padding: 1px 8px;
}

.table_step td {
	text-align: center;
	padding: 1px 12px;
	border-bottom: thin rgb(88,174,6) solid;
}

.table_step td:last-child {
	text-align: left;
	padding: 1px 12px;
	border-bottom: thin rgb(88,174,6) solid;
}

/****************************************************************
* Page: index
****************************************************************/

.page_idx_v_box {
	font-size: 24px;
	text-align: center;
}

.page_idx_v_half_box {
	float: left;
	width: 50%;
}

.page_idx_v_full_box {
	clear: both;
	margin: 24px 0px;
}

.page_idx_v_center_text {
	clear: both;
}

.page_idx_v_left_text {
	clear: both;
	float: left;
	margin: 24px 30px;
}

.page_idx_v_right_text {
	clear: both;
	float: right;
	margin: 24px 30px;
}

.page_idx_contact_box {
	clear: both;
	text-align:	center;
	font-size: 16px;
}

.page_idx_contact_box_detail {
	width: 35%;
	margin: auto;
	text-align:	left;
}

.page_idx_contact_box_detail_gfx {
	float: left;
	margin-right: 20px;
}

/****************************************************************
* Page: dienstleistungen
****************************************************************/

.page_dl_half_box {
	float: left;
	width: 50%;
}

.page_dl_center_box {
	clear: both;
	font-size: 18px;
	text-align: center;
}

/****************************************************************
* Page: referenzen
****************************************************************/

.page_ref_box {
	float: left;
	margin-right: 40px;
}

.page_ref_box h2 {
	margin-top: 0px;
}

.page_ref_box ul {
	margin-top: 0px;
}

.page_ref_center_box {
	clear: both;
	font-size: 18px;
	text-align: center;
}

/****************************************************************
* Page: elefant
****************************************************************/

.page_elefant_pics {
	float: right;
	width: 300px;
	margin-left: 20px;	
}