/* -------------------------------------------------------------- 

   © Copyright 2012 by Zebra design.
   
-------------------------------------------------------------- */
body {
	background: #040c14 url("../images/body_bg.gif") repeat-x top;
	text-align: left;
	padding-bottom: 10px;
	color: #888888;
}
#container {
	width: 1005px;
	margin: 0 auto;
	background-color: #040c14;
}
#rechts
{
	float:right;
	z-index:1;

	
}
#top-section {
	width: 1002px;
	height: 156px;
}

#top-section .left{
	width: 81px;
	height: 156px;
	float: left;
	background: url("../images/top_left.gif") no-repeat;
}

#top-section .center {
	width: 840px;
	height: 156px;
	float: left;
	background: #040c14 url("../images/top_center.gif") no-repeat bottom;
}

#top-section .right{
	width: 81px;
	height: 156px;
	float: left;
	background: url("../images/top_right.gif") no-repeat;
}

#top-content {

	width:840px;
	height: 129px;
	
}

#logo {
	width: 446px;
	height: 104px;
	background: url("../images/hbsg_logo.png") no-repeat;
	position: relative;
	top: 15px;
	left: 10px;
	float: left;
}

#logo a {
	width: 100%;
	height: 100%;
	display: block;
}
#fahnen
{
	position: relative;
	top: 115px;
	left: 325px;
	float: left;
	}

/* header style */

#header {
	width: 1002px;
	height: 292px;
}

#header .left{
	width: 81px;
	height: 292px;
	float: left;
	background: url("../images/header_left.gif") no-repeat;
}

#header .center {
	width: 840px;
	height: 292px;
	float: left;
	background: #040c14 url("../images/header_center.gif") no-repeat bottom;
}

#header .right {
	width: 81px;
	height: 292px;
	float: left;
	background: url("../images/header_right.gif") no-repeat;
}


#header-bg {
	width: 824px;
	height: 278px;
	background: #040c14 url("../images/header_bg.gif") repeat-x;
	margin-left: 16px;
}
#header-bg-left {
	width: 824px;
	height: 278px;
	background: url("../images/header_bg_left.jpg") no-repeat top left;
}
#header-bg-right {
	width: 824px;
	height: 278px;
	background: url("../images/header_bg_right.jpg") no-repeat top right;
}

#header-content {

	width: 811px;
	height: 256px;
	
	margin-top: 12px;
	margin-left: 0px;
	float: left;
}

.header-image {
	margin: 20px;
	width: 411px;
	height: 216px;
	float: left;
}
.header-image img {
	
}

.header-image .header-image-border {
	border: 1px #194284 solid;
	height: 218px;
}


.header-text {
	margin: 20px;
	margin-left: 0px;
	width: 336px;
	height: 216px;
	float: left;

}
.header-text p {
	color: #6293d9;
	font-size: 12px;
	
}

/* end of header style */


/* top border style */

.top-border {
	width: 100%;
	height: 7px;
	background: url("../images/top_border_bg.gif") repeat-x top right;
}



/* end of top border style */

/* menu style */

	#menu {
		width: 840px;
		height: 32px;
		margin: 0 auto;
		margin-top: 10px;
	}

	#menu ul {
		list-style:none;
		margin:0;
		padding:0;
		width: 100%;
	}
	#nav li {
		float:left;
		text-align:center;
		margin-right: 5px;
	}
	#nav li a {
		display:block;
		padding:7px 25px;
		color: #508fce;
		font-weight: bold;
		text-decoration:none;
		
	}
	#nav li a:hover, #nav li a:focus, #navli a:active {
		background-position:-150px 0;
		color: #ccc;
		cursor:pointer;
	}
	#nav a {
		background:url(../images/nav_bg.gif) repeat 0 0;
		cursor:pointer;
	}
	
	#sidebar-menu {
		width: 270px;
		margin: 0 auto;
		margin-top: 10px;
	}

	#sidebar-menu ul {
		list-style:none;
		margin:0;
		padding:0;
		width: 100%;
	}
	#sidebar-menu li {
		float:left;
		text-align:left;
		margin-right: 0px;
		margin-bottom: 1px;
	}
	#sidebar-menu li a {
		display:block;
		padding:7px 15px;
		color: #508fce;
		font-weight: bold;
		text-decoration:none;
		width: 240px;
		border-bottom: 1px #193855 solid;
		
	}
	#sidebar-menu li a:hover, #nav li a:focus, #navli a:active {
		background-position:-150px 0;
		color: #ccc;
		cursor:pointer;
	}
	#sidebar-menu a {
		background:url(../images/nav_bg.gif) repeat 0 0;
		cursor:pointer;
	}
		
		
		
		
		
		




/* end of menu style */

/* content styles */

#content-container {
	width: 840px;
	margin: 0 auto;
	margin-top: 10px;
}

#content {
	width: 100%;
	text-align: left;

}

.two-column-left, .two-column-right {
	float: left;
}

.two-column-left {
	width: 270px;
	margin-right: 15px;
}


.two-column-right {
	width: 555px;
	padding-bottom: 10px;
	height: auto;
	
}
.two-column-port {
	width: 270px;
	margin-right: 15px;

}
.two-column-portf {
	width: 555px;
	padding-bottom: 10px;
	height: 600px;
}


.alpha {
	margin-left: 0px;
}
.omega {
	margin-right: 0px;
}

	/* header of contents */
	
	h2.top-header-bg {
		background: url("../images/column_1.gif") no-repeat bottom;
		padding-bottom: 10px;
		font-size: 21px;
	}
	
	#header-content h2.header-top-header {
		border-bottom: 1px #142843 solid;
		padding-bottom: 8px;
		font-size: 21px;
	}
	
	h2.top-header-bg-wide {
		background: url("../images/column_2.gif") no-repeat bottom;
		padding-bottom: 10px;
		font-size: 21px;
	}
	
	/* end of header of contents*/
	
	/* news list for side-bar styles */
	
		.news-list {
			width: 100%;
		}
		.news-list ul{
			margin: 0;
			padding: 0;
			list-style: none;
		}
		
		.news-list ul li {
			clear: both;
		}
		.news-list ul li h3 {
			font-family: arial, sans-serif;
		}
		
	

		.news-list .news-content h3 {
			color: #5381d7; 
			margin-bottom: 0px;
			padding-bottom: 0px;
		}
		.news-list .news-content .date {
			font-size: 10px;
			color: #555;
		}
		
		.news-list .news-content p {
			margin-top: 5px;
			padding-top: 5px;
		}
		
		/* list styles - like in the features section */
		
		.list {
			margin: 0;
			padding: 0;
			list-style: none;
		}
		
		.list li {
			clear: both;
		}
		
		
		/*end of list styles*/
		
		
		
	
	/* end of news lsit */
	
	
	/*testimonial style */
	


	#content .testimonial blockquote{
		margin: 0;
		padding:0px 10px 20px 30px;
		background:url(../images/quote.gif) no-repeat top left;
		width:223px;
	}
	#content .testimonial blockquote p.quote{
		text-align:left;
		font-size:15px;
		font-weight: bold;
		color:#777;
		font-family:Georgia, "Times New Roman", Times, serif;
		font-style:italic;	
	}

	#content .testimonial blockquote p.author{
		margin:10px 10px 0 0;
		display:block;
		text-align:right;
		
		font-size:12px;
		color:#999;
		font-weight:bold;
	}

	
	
	/* end of testimonial style*/
	
	/* services styles */
	
	#service-1 {
		
		float: left;
		width: 181px;
		height: 280px;
		margin-right: 3px;
		padding: 0;
	}
	
	#service-2 {
		
		float: left;
		width: 181px;
		height: 280px;
		margin: 0 3px;
		padding: 0;
	}
	
	#service-3 {
		
		float: left;
		width: 120px;
		height: 280px;
		margin-left: 3px;
		padding: 0;
		
	}
	
	.services {
		list-style: none;
		margin-left: 0;
		padding-left: 0;
	}
	
	.services li
	{
		padding: 3px 0px 3px 20px;
		background-image: url(../images/list_bg.gif);
		background-repeat: no-repeat;
		background-position: 0 .5em;
	}
	/* end of services styles */
	
	
		/* portfolio styles */
	
	.portfolio-1 {
	float: left;
	width: 180px;
	margin-right: 1px;
	padding: 0;
	}
	
	.portfolio-2 {
	float: left;
	width: 180px;
	margin: 0 3px;
	padding: 0;
	}
	
	.portfolio-3 {
	float: left;
	width: 180px;
	margin-left: 3px;
	padding: 0;
	}
	
	a:focus {
		outline: none;
	}
	
	
	/* end of services styles */
	
	/*  portfolio style */
	
	

/* contact form style */
#map {
	width: 268px;
	height: 200px;
	border: 1px #264361 dotted;
	
}

form {
  padding: 20px 0;
  margin: 0;
}

form p {
	margin: 10px;
}

label {
	float: left;
	width: 100px;
	padding-right: 1px;
	font-weight: bold;
	color: #999;
}
input,
textarea{
	padding: 2px;
	font: 400 12px arial, sans-serif;
	color: #999;
	background: #0d2439;
	border-width: 1px;
	border-style: solid;
	border-color: #0b2035 #264361 #264361 #0b2035;  
}
input:focus,
textarea:focus{  
  color: #999;
  background-color: #1b3a59;
}
#name, #email, #subject{
	width:250px;
}
#message{
	width:360px;
	height:60px;
}
input.button {
  padding: 1px 10px;

  font: bold 1em arial, sans-serif;
  cursor: pointer;

  color: #FFF;
  background-color: #59a935;
  border-width: 1px;
  border-style: solid;
  border-color: #186825 #0e4d19 #0e4d19 #186825;
}

#submit {
	width: 107px;
	height: 36px;
	background: url("../images/senden.png") no-repeat top right;
	border: 0;
	cursor: pointer;
}

#note {
	padding: 10px;
	font-size: 12px;
	font-weight: bold;
	color: #888;
	border: 1px #333 solid;
	display: none;
	text-align: center;
}

.notification_ok {
	color: #229922;	
}

/* end of contact form style */
	
	
	/* end of contact us style */
	
	
	
	/* content padding styles */
	
	.padding-top-bottom {
	padding-bottom: 10px;
	padding-top: 0px;
	}
	
	/* end of content padding styles */

/* end of content styles */

/* footer styles */

#footer-container {
	width: 100%;
	height: 75px;
	background: url("../images/footer_container_bg.gif") repeat-x center;
	margin-top: 10px;
}

#footer {
	width: 840px;
	margin: 0 auto;
	height: 75px;
	background: url("../images/footer_bg.gif") repeat-x center;
}

#footer-left {
	width: 400px;
	float: left;
	margin-top: 19px;
	padding-left: 35px;
}

#footer-right {
	width: 300px;
	float: right;
	margin-top: 28px;
	padding-right: 35px;
	text-align: right;
}



/* misc styles */

.first {
	margin-left: 0px;
}
.last {
	margin-right: 0px;
}

.clear {
	clear: both;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.image-left{
	padding:3px;
	margin:0 15px 0 0;
	border:1px #444 solid;
}

.image-border {
	padding:3px;
	margin:0;
	border:1px #444 solid;
}

.image-right{
	padding:3px;
	margin:0 0 0 15px;
	border:1px #444 solid;
}



.image-left-small{

	padding:3px 3px;
	margin:0 3px 0 0;
	border:1px #444 solid;
}

.image-right-small {

	padding:3px 3px;
	margin:0 0 0 3px;
	border:1px #444 solid;
}

.image-border-small {
	background:#fff;
	padding:3px 3px;
	border:1px #444 solid;
}


.image-border {
	padding:3px;
	border:1px #444 solid;
}

.textblock {
	border: 1px #285491 solid;
	background-color: #fafafa;
	padding: 10px;
	color: #777;
	margin-bottom: 20px;
}

.alpha {
	margin-left: 0px;
}
.omega {
	margin-right: 0px;
}
/* end of misc styles*/
