@charset "utf-8";

/**
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Main areas of page
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
**/


/* overwrite all criticial values */
* 	{
	margin: 0;
	padding: 0;
	vertical-align: top;
	border-spacing: 0;
	} 

#it_koglin_net	{
				width: 920px;
				margin:auto;
				
				border: none;
				margin-top: 20px;
				
				font: normal 14px/1.0em Arial, sans-serif;
				background-color: #FFFFFF;
				
}

/* head area with logo and adress data */
#head	{

		height: 100px;
		clear: both;
		border: 1px solid #999;
		background: white url(images/designelements/bg_head.jpg) no-repeat;
		
}

/* left head area with the IT Service Patrick Koglin logo */
#head_logo	{
			float: left;
			margin: 0;
			margin-top: 3px;
			margin-left: 30px;
}

/* correct margin Hack  for logo, IE/Win < Version 7 */ 
* html #head_logo {
    margin-left: 20px;
}

/* right head area with the IT Service data */
#head_data	{
			margin: 0;
			margin-top: 5px;
			margin-right: 10px;
			padding: 0;
			text-align: right;
			color: #FFF;
}

/* main content (wrapper div)
*/
#content	{
			width: 100%;
			clear: both;
			margin-top: 15px;
}
			
/* Uebergeordnetes Navigationselement */
#navigation	{
			width: 175px;
			float: left;
			border: 1px solid #CCC;
			margin: 0;
			padding: 0;
			}

#nav_points	{
			margin-top: 10px;
			/* navigation height - nav_bg height - nav_ueberschrift height - nav_ueberschrift padding - nav_punkte margin*/
			color: #000000;
			}
			
/* grafic on bottom of navigation */
#nav_bg	{
		height: 104px;
		background: white url(images/designelements/nav_bottom.png) no-repeat;
		}
			
		
/* wrap, contains side_content and breadcrumb */
#side_content	{
				width: 721px;
				float: left;
				margin-left: 20px;
				margin-bottom: 20px;
				border: 1px solid #999;
				border-top: 3px solid #264878;
				border-bottom: 3px solid #264878;
}


/* breadcrumb adriane path over media content */
#ariadne	{
			margin-bottom: 20px;
			height: 20px;
			}

/* side title */
#ariadne_ueberschrift 	{
				margin-left: 0px;
				padding: 3px;
				float: left;
				border-bottom: 1px solid #999;
}
				
#ariadne_path	{
				float: right;
				padding: 3px;
				padding-top: 10px;
}



#media	{
		padding-top: 20px;
		padding-left: 10px;
		padding-right: 10px;
		line-height: 1.2em;
		margin-bottom: 20px;
		}

		
/* Min height Hack IE/Win < Version 7 */ 
div#side_content {min-height: 500px;}
* html #side_content { height: 500px; }

#footer	{
		height: 20px;
		clear: both;
		margin-bottom: 20px;
		margin-left: 195px;
		text-align: right;
		border-top: 1px solid #999;
	
		font-size: 0.8em;
		}

/**
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
special formats for main areas
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
**/

#footer a:link , #footer a:visited, #footer a:active , #footer a:focus {
text-decoration: none;
color: #000;
}

#footer a:hover	{
					text-decoration: none;
					color: #013F7C;
}
					
#head_data h1{
			margin: 0;
			margin-bottom: 2px;
			font: bold 1.1em/1.0em Arial, sans-serif;
			color: #FFF;
}

#head img	{
			border: 0;
			}
			

#ariadne a:link , #ariadne a:visited, #ariadne a:active , #ariadne a:hover, #ariadne a:focus {
text-decoration: underline;
color: #000;
}
#head h1	{
			font-weight: bold;
			font-style: normal;
			font-size: 1.0em;
			color: #FFFFFF;
			margin-bottom: 0.5em;
			}
			
#head h2	{
		font-size: 0.9em;
		font-weight: normal;
		font-style: normal;
		color: #FFFFFF;
		margin-top: 1em;
		margin-bottom: 0em;
		}
					
#media em	{
			font-style: normal;
			text-decoration: none;
			color: #3B62A7;
			}

			
#media h1	{
			font-size: 1.8em;
			margin-top: 0px;
			}
			
#media h2	{
			font-size: 1.1em;
			margin-top: 0px;
			}

#media hr	{
			margin-top: 2em;
			margin-bottom: 2em;

			}			

#media ul	{
			list-style-position: inside;
			list-style-type: square;
}
			
#media ol	{
			list-style-position: inside;
			}	

		
	
#media a:link , #media a:visited, #media a:active , #media a:focus {
color: #3B62A7;
font-weight: bold;
text-decoration: none;
}


#media a img	{
			border: 0;
			}
			

#media a:hover 	{
				text-decoration: underline;
}
			
#navigation li	{
				margin: 0;
				margin-left: 5px;
				text-align: left;
				text-decoration: none;
				}
				
#navigation ul	{

				list-style: none none;
				
				}
				
				

				
#navigation em	{
				font: bold 1.0em/1.4em Arial, sans-serif;
				font-style: normal;
				text-decoration: none;
				}

#navigation .hint	{
					font-size: 0.9em;
					color: #666666;
}

#navigation .untermenue	{
						margin: 0;
						padding: 0;
						line-height: 1.2em;
						font-size: 0.9em;
						margin-left: 10px;
						margin-bottom: 5px;
						list-style: square inside;
						}					
			
#navigation a:link , #navigation a:visited, #navigation a:active , #navigation a:focus {
text-decoration: none;
color: #000000;
}

#navigation a:hover	{
					text-decoration: none;
					color: #013F7C;
					}

#newsbox_body hr	{
				width: 70%;
				margin: auto;
				margin-top: 10px;
				margin-bottom: 10px;
				text-align: center;
				height: 1px;
}
				
#side_content hr	{
				width: 70%;
				text-align: center;
				margin-left: auto;
				margin-right: auto;
				margin-top: 10px;
				margin-bottom: 10px;
				border: 1px solid #264878;

}
	
/**
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
elements for subpages
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
**/

/* the newsbox on index page */
/* wrap div box */
#newsbox	{
			margin: 10px;
			margin-top: 20px;
			border: 0;
			border-left: 1px solid #ccc;
			border-right: 1px solid #ccc;
}

/* head with title */
#newsbox_head	{
				padding: 5px;
				background-color: #264878;
				color: #fff;
}

/* wrap for single news elementes */
#newsbox_body	{
				padding: 5px;			
}

.newsbox_element	{
					border-bottom: 1px solid #666;
					margin-bottom: 10px;
					padding-bottom: 5px;
}

#newsbox .newsbox_date	{
						font-size: 0.8em;
						color: #013F7C;
}

.newsbox_element em	{
			margin: 0;
			line-height: 1.3em;
}

#ref_tabelle	{
				width: 100%;
}

#ref_tabelle_element	{
						clear: both;
}

/* table of referenzen.html */
#ref_tabelle_bild	{
					width: 200px;
					margin-right: 10px;
					float: left;
					margin-bottom: 40px;
					padding-bottom: 10px;
					border-bottom: 1px solid #264878;
					
					}
					
#ref_tabelle_daten	{
					height: 100%;
					
}
					
/**
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Standard elements of page
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
**/
fieldset	{
		width: 80%;

		}

legend	{
		text-align: left;
		}
		
h1, h2, h3,
h4, h5, h6	{
			color: black;
			font:  bold 1.0em/1.0em Arial, sans-serif;

			margin-bottom: 5px;
			margin-top: 10px;
			background-color: transparent;
			}
			
h1	{
	font-size: 1.6em;
	}
	
h2	{
	font-size: 1.0em;
	}
	
hr	{
	border: 1px solid black;
	}

ul
{
list-style-type: square;
padding: 0px;
margin: 0px;
}

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

/* Die verschachtelte Liste bei der Leistungsuebersicht */
.serviceView
{
	list-style-type: square;

}

.serviceView ul
{
	margin: 0;
	list-style-type: square;
	list-style-position:outside;
	margin-left: 10px;
	margin-bottom: 10px;

}

.serviceView .indended li
{
	margin-left: 15px;
	list-style-type: square;
	list-style-position: outside;
	font-weight: normal;
	
}
.serviceView .importantPoint
{
	font-weight: bold;
}

#indexBox
{

}

#indexBoxWrap
{
width: 400px;;

margin: auto;
padding: auto;
}

/**
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
classes
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
**/

.al_left {
			text-align: left;
}

.al_center {
			margin: auto;
			text-align: center;
			
}

.center {
		
		margin: auto;
		text-align:center;			
}

.al_right {
			text-align: right;
}

.border		{
			border: 1px solid #999;
			}


.blocksatz 
{
			text-align: justify ;
}
		
.fb-like	{
			margin: auto;
			text-align: center;
			}
	
/* Kontaktformular */
.formular	{
			text-align: left;
			vertical-align: bottom;
			width: 70%;
			}

.formular fieldset	{
			width: 550px;

			}
			
.formular legend	{
				margin-left: 5px;
				}

.formular table	{
				text-align: left;
				margin-left: 5px;
				margin-top: 10px;
				}

.formular textarea	{
margin-bottom: 5px;
margin-top: 2px;
margin-right: 30px;

			}
			
.formular th	{
			width: 90px;
			font-weight: normal;
			text-decoration: none;
			}

.formular input,
.formular select	{
				margin-top: 2px;
				margin-bottom: 2px;
				}

				
.noborder 	{
			border: 0;
}

.small
{
	font-size: 0.8em;
}