/* @group global */
img, div, .pngfix, a, #logo{ behavior: url("http://www.design-buero.de/templates/designbuero2009/scripts/iepngfix.htc") }
*{margin: 0;padding: 0;}
a img{border: 0;}

html{font: 13px 'Asap', Lucida Grande, Lucida, Verdana, sans-serif;}
	#wrapper{width: 1210px; margin-left:auto; margin-right:auto;background: url(../images/wrapper-back.jpg) no-repeat center top;}
		#container{	padding-bottom: 20px; background: url(../images/subnav-verlauf-back.png) no-repeat 40px top; overflow: hidden;}
			#main{width: 869px; min-height: 550px}
		
/* @end */

/* @group #head logo */

#header{ height: 200px;}
	#header h2#logo{float:left;	display: block;	height:121px; width: 250px; text-indent: -99999px; background: url(../images/designbuero-logo.png) no-repeat 39px 48px;}

/* @end */

/* @group #head hauptnav */

#header ul.level_1{	display: block;	float:left;	width: 869px; margin-top: 95px; padding: 2px 0; border-top: 1px solid silver; border-bottom: 1px solid silver; background: url(../images/navi-back.png) repeat; list-style-type: none;}
	#header ul.level_1 li{display: inline;}
		#header ul.level_1 li a, #header ul.level_1 li span{ padding:0 25px 0 0; font-weight: 400; font-size: 16px; text-transform: uppercase; letter-spacing: 1px;}
			#header ul.level_1 li a:link, #header ul.level_1 li a:visited{ color: #a7a7a7; text-decoration: none;}
			#header ul.level_1 li a:hover{ color: red; text-decoration: none;}
			#header ul.level_1 li.trail a{ color: #111; text-decoration: none;}
			#header ul.level_1 li a.first{ margin-left: 10px;}
			/* Impressum */ 
			/* #header ul.level_1 li a.last{ position: absolute; right: 80px;} */
/* @end */

/* @group #left */

#left{ float: left; position: absolute; display: inline; width: 250px; top: 220px; margin-top:10px;	z-index:101;}
	#left ul.level_1{margin-left: 64px;}
		#left ul.level_1 li{margin-bottom: 5px; list-style-type: none;}
			#left ul.level_1 li ul{	margin-top: 5px;}
			#left ul.level_1 li a, #left ul.level_1 li span{ height: 25px; 	padding:2px 0 2px 0; border-buttom: 2px solid #fff; line-height: 25px; text-decoration: none; text-transform: uppercase; letter-spacing: 1px;}
			#left ul.level_1 li a:visited, #left ul.level_1 li a:link{color: black; /* background-color: #fff; */}
			#left ul.level_1 li a:hover{ color: red; border-bottom: 2px solid red; /* background-color: #e7e7e7; */}
			#left ul.level_1 li span{ color: #000; border-bottom: 2px solid black;}
			#left ul.level_1 li.trail a{ color: #000; border-bottom: 2px solid #cccccc;}

	#left ul.level_2 li a, #left ul.level_2 li span{height: 25px; padding:2px 0 2px 0; border-buttom: 2px solid #fff; line-height: 25px; text-decoration: none;	text-transform: uppercase; letter-spacing: 1px;}
	#left ul.level_2 li a:visited, #left ul.level_2 li a:link{ padding:2px 0 2px 15px; text-indent: 30px; border-bottom: 2px solid transparent;	background-color: transparent;}
	#left ul.level_2 li a:hover{ color: red; border-bottom: 2px solid red;}
	#left ul.level_2 li span{padding:2px 0 2px 15px; border-bottom: 2px solid #000; color: #000; background-color: transparent; }
	#left ul.level_2 li.trail a{ border-bottom: 2px solid #000; color: #000;}

/* @end */

/* @group #main */

#main{float: right;	display: inline; width:869px; margin-right: 91px;}
	#main .inside{ min-height: 550px;}
		#main h2{ margin-bottom: 15px; margin-top: 20px; font-weight: 400; font-size: 24px; text-decoration: none; letter-spacing: 2px; line-height: 35px; text-transform: uppercase; color: #333333;}
		#main h3{ 	margin-bottom: 0px; font-weight: 700; text-decoration: none; line-height: 25px; color: silver; text-transform: uppercase;}
		#main p, #main ul{	margin-bottom: 15px; font-size: 13px; font-weight: 400; line-height: 25px;}
		#main p.subnav{display: none;}
		#main ul{ margin-top: 0px; padding-left: 15px;}
		#main a:link, #main a:visited{ color: black; text-decoration: none;}
		#main a:hover{ text-decoration: underline;}
		#main img.pict-right{ float: right; padding-left: 22px;}
		#main div.textaufbild{ position: absolute; top:211px; width: 275px;}
			#main div.textaufbild h2{ margin-bottom: 15px; 	font-size: 28px; line-height: 30px;font-weight: bold; text-decoration: none; text-transform: uppercase;	overflow: hidden;}
		#main a.back{ display: block; width: 141px; height: 23px; margin-top: 10px; margin-left:auto; margin-right:auto; font-size: 10px; color: silver; text-transform: uppercase; overflow: hidden; background: transparent url(../images/back.png) no-repeat 0 0;}
			#main a.back:visited, #main a.back:visited{ color: silver; background: transparent url(../images/back.png) no-repeat 0 0;}
			#main a.back:hover{ color: black; background: transparent url(../images/back-ro.png) no-repeat 0 0; text-decoration: none;}

/* impressum */
.impressum #main h1{letter-spacing: 2px; font-weight: bold; text-decoration: none; font-size: 28px; line-height: 35px; margin-bottom: 15px; text-transform: uppercase; color: #333333;}
.impressum #main h3{letter-spacing: 2px; font-weight: bold;	text-decoration: none; font-size: 10px;	line-height: 11px; margin-bottom: 5px; text-transform: uppercase; color: #333333;}
.impressum #main h4{ font-weight: bold;	text-decoration: none; font-size: 10px; line-height: 11px; margin-bottom: 5px; color: #333333;}
.impressum #main p{ font-size: 10px; line-height: 11px; margin-bottom: 5px; color: #333333;}

/* @end */

/* @group galerie */

.galerie #main .inside{	margin-bottom: 27px;}
.galerie #main .mod_article h4{	margin-top: 10px;}
.galerie #main .mod_article ul{	margin-top: 5px; padding-left: 1px;	list-style-type: none;}
	.galerie #main .mod_article ul ul{ margin-top: 5px;	margin-bottom: 5px;	padding-left: 13px;	list-style-type: disc;}
	.galerie #main .mod_article ul li{ line-height: 15px;}
	.galerie #main .mod_article a:link, .galerie #main .mod_article a:visited{ color: grey;}
	.galerie #main .mod_article a:hover{ color: red; text-decoration: none;}
	.galerie #main .mod_article p{ margin-bottom: 0;}
	
/* @end */

/* @group mod_article */

#main .mod_article{padding-top: 0px;}
	#main .mod_article footer{ display: none;}

/* @end */

/* @group mod_articlenav */


#main .mod_articlenav{ position: absolute; top: 670px;}
	#main .mod_articlenav ul{margin-left: 0px; padding-left: 0px;}
		#main .mod_articlenav ul li{float: left; list-style-type: none;	margin-right: 5px;}
			#main .mod_articlenav ul li a, #main .mod_articlenav ul li span{padding: 0px 6px; text-decoration: none; text-transform: uppercase;}
			#main .mod_articlenav ul li a:link, #main .mod_articlenav ul li a:visited{ display: block; border-bottom: 2px solid white; color: black;}
			#main .mod_articlenav ul li a:hover{ display: block; border-bottom: 2px solid red; color: red;}
			#main .mod_articlenav ul li span{ display: block; border-bottom: 2px solid black;}

/* @end */

/* @group buttons */

#main p.buttons a:link, #main p.buttons a:visited{float: left; display: block; background-color: black; color: #fff; padding:3px 5px; text-transform: uppercase;}
#main p.buttons a:hover{text-decoration: none; background-color: red;}

/* @end */

/* @group mod_booknav */

#main .mod_booknav{	margin-top: 20px;}
	#main .mod_booknav ul{ list-style-type: none;}
	#main .mod_booknav li{ float: left;	margin-right: 20px;}
		#main .mod_booknav li a{ text-decoration: none;	text-transform: uppercase; font-size: 13px;}
			#main .mod_booknav li a:link, .mod_booknav li a:visited{ color: #000;}
			#main .mod_booknav li a:hover{ color: red;}

/* @end */

/* @group ce_text, ce_headline */

.ce_text, #main {margin-top: 0px;}

/* @end */

/* @group ce_hyperlink */

.ce_hyperlink{margin-top: 20px; text-transform: uppercase;}

/* @end */

/* @group ce_contact form */

.contact {padding:0; margin:0; color:#000; background: transparent url(../../../images/stories/design/Kontakt.jpg) no-repeat left top;}
	.contact address {margin:10px 0;font-style:normal; }
		.contact address p {line-height:1em;}
	.contact label {float:left; margin:10px 0 0; width:12em; }
	.contact span.marker {width: 14em; margin:0 10px 0 0; font-weight: bold;}
	.contact_email_checkbox label {float:none !important;}
	.contact input, .contact .textarea {width: 250px;  margin:10px 0 0; padding:2px 2px 0; border:solid 1px silver; color:#000;}
		.contact input.submit {background-color: #000; border:0; color:#fff; font-weight:bold; margin:20px 10px 0 12em; padding:0 0 0 30px; cursor:pointer; width: 100px;}
	#contact_text {width:390px; height:150px; border:1px solid silver; }
	.contact input.invalid,.contact textarea.invalid {border:solid 2px red;}
	.contact label.invalid {color:red;}
/* @end */

/* @group footer */
#footer{clear: both; position:relative; height: 150px; padding-top: 15px;background: url(../images/fooer-back.png) no-repeat left bottom;}
	#footer .footerimageleft {display:block; position:absolute; bottom: 0; height:350px; width:250px; z-index:100; }
	#footer .footerimageright { display:block; height:150px; position:absolute; bottom: 0;margin-left: 880px;	width:330px; z-index:99; }
	#footer p{visibility: hidden; display:block; width: 900px; height: 100px; text-indent: -99999px; background: url(../images/footer-txt.png) no-repeat 250px 0px;}
/* @end */

/* @group raster */

.g1, .g2, .g3{ float: left;}
.g1{ width: 275px;}
.g2{ width: 572px;}
.g3{ width: 869px;}
.gr{ margin-right: 22px;}

/* @end */


/* @group @media(max-width:1200px) */

@media(max-width:1200px){
	
#wrapper{width: 960px;}
#wrapper{background: url(../images/wrapper-back-960px.jpg) no-repeat center top;}
	#container{background:none; position: relative;}

#header{ height: 160px;}
	#header h2#logo{width: 260px; text-indent: -99999px; background: url(../images/designbuero-logo.png) no-repeat 45px 48px;}
	
	#header ul.level_1{width: 655px;}
		#header ul.level_1 li a.first, #header ul.level_1 li span.first{ margin-left: 10px;}
		#header ul.level_1 li a.last, #header ul.level_1 li span.last{position: absolute; right: 25px;}

		
#left{position: relative; display: block; top: 5px; left:45px ; width: 870px; height:auto;}
	#left ul.level_1{display: block; height: 25px; margin-left: 0px; border-top: 1px solid silver; border-bottom: 1px solid silver; background-color: white;}
		#left ul.level_1 li{float: left; margin-right: 15px; margin-bottom: 0;}
		#left ul.level_1 li a:hover{ color: red; border-bottom: 0;}
		#left ul.level_1 li span{ color: red; border-bottom: 0;}
		#left ul.level_1 li.trail a{ color: red; border-bottom: 0;}
	#left ul.level_2{display: none;}
				
		#main{width:870px; margin-left: 45px; margin-right: 45px; clear: left; margin-top:20px }
		#main .inside{padding-top: 10px;}
		#main p, #main ul{margin-bottom: 10px; line-height: 20px;}
				#main p.subnav{display: inherit;}
				
		#869{display: none;}
		#760{display: inherit;}
			
#footer{display: none;}

}

/* @end */

/* @group @media(max-width:760px) */

@media(max-width:950px){
	
#wrapper{width: 760px;}
#wrapper{background: url(../images/wrapper-back-760px.jpg) no-repeat center top;}
	#container{background:none; position: relative;}

#header{ height: 137px;}
	#header h2#logo{width: 260px; text-indent: -99999px; background: url(../images/designbuero-logo.png) no-repeat 30px 30px; float: none; height: 110px;}
	
	#header ul.level_1{width: 720px; float: none; margin-top: 0px; margin-left: 20px;}
		#header ul.level_1 li a.first, #header ul.level_1 li span.first{ margin-left: 10px;}
		#header ul.level_1 li a.last, #header ul.level_1 li span.last{position: absolute; right: 10px;}

#left{position: relative; display: block; top: 0px; left:20px ; width: 720px; height:auto; float: none; margin-top: 0; opacity: 0.80;}
		#left ul.level_1 li a.first, #left ul.level_1 li span.first{ margin-left: 10px;}


#main{width:720px; margin-left: 20px; margin-right: 20px; margin-top:20px ;clear: left;}
		#main .g1{margin-right: 22px; margin-left: 10px;}
		#main p.subnav{display: inherit;}

}

/* @end */

/* @group @media(max-width:320px) */

@media(max-width:760px){
	
#wrapper{width: 320px;}
#wrapper{background-image: none;}
	#container{background:none; position: relative;}

#header{ height: 220px;}
	#header h2#logo{width: 260px; text-indent: -99999px; background: url(../images/designbuero-logo.png) no-repeat 55px 10px; float: none; height: 90px;}
	
	#header ul.level_1{width: 320px; float: none; margin-top: 0px; margin-left: 0px;}
	#header ul.level_1 li{display: block; margin-left: 5px; margin-top: 4px;}
		#header ul.level_1 li a.first, #header ul.level_1 li span.first{ margin-left: 0px;}
		#header ul.level_1 li a.last, #header ul.level_1 li span.last{position: inherit;}

#left{position: relative; display: block; top: 0px; left:0px ; width: 320px; height:auto; float: none; margin-top: 0; opacity: 0.80;}
	#left ul.level_1 li{margin-left: 10px;}
		#left ul.level_1 li a.first, #left ul.level_1 li span.first{ margin-left: 0px;}


#main{width:320px; margin-left: 0px; margin-right: 0px; margin-top:0px ;clear: left;}
		#main .g1{margin-right: 22px; margin-left: 5px;}
		#main h2{margin-top: 0;}
		#main p.subnav{display: inherit;}
.agentur #main, .agentur #main, .kunden #main, .kontakt #main, .design #main, .print #main, .web #main, .messe #main, .foto #main{background-image: none;}
}

/* @end */