@import 'reset.css';


body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	letter-spacing: 0.1em;
	color: #999;
	margin: 0;
	}
	
a:active, a:focus { 
	outline:0;
	color:#cc6600;
	} 
	
p {
	padding: 0 12px 0 12px;
	line-height: 1.6em;
	}

a {
	display:block;
	color: #999;
	text-decoration: none;
	}
	
h1, h2, h3, h4, h5 {
	font-size: 20px;
	font-weight: 200;
	padding: 10px 0 5px 12px;
	}
	
h1 {
	color: #0080FF
	}

h2 {
	color: #9BD564;
	}
	
h3 {
	color: #F3750C;
	}
	
h4 {
	color: #D10BD2;
	}
	
	
.grey {
	color: #999;
	}
	
.grey_dark {
	color: #564D54;
	}

#language, #designnews, #design_logo {
	vertical-align: middle;
	}

#designnews {
	margin-left: 95px;
	}
	
#design_logo {
	margin-left: 250px;
	}


.dc_logo_inline {
	bottom: 0.6em;
	position: relative;
	}

#topic {
	height: 182px;
	width: 515px;
	margin-top: -211px;
	xxxmargin-bottom: 29px;
	position: relative;
	overflow: hidden;
	}

.shadow-top {
			position: absolute;
			height: 5px;
			width: 1031px;
			top: -5px;
			background: url(../images/shadow-navi-home-top.png) repeat-x;
	}
	

	.shadow-bottom {
			top: 30px;
			height: 9px;
			width: 100%;
			position: absolute;
			z-index: 20;
			background: url(../images/shadow-start-navi.png) repeat-x;
	}

#topic .slides .lightbox, #mitte .slides .lightbox {
	display: none;
	}	
	

#sub_outer {
	width: 257px;
	height: 211px;
	margin-top: -182px;
	overflow: hidden;
	position: relative;
	}
	
#debug {
	position: absolute;
}	

#fade_top {
	position: absolute;
	width: 100%;
	height: 20px;
	z-index: 1000;
	background: transparent url(../images/fade_to_grey_10.png) repeat-x;
}

#fade_bottom {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 35px;
	z-index: 1001;
	background: transparent url(../images/fade_to_grey_bottom_10.png) repeat-x;
}
	
#sub_inner {
	padding: 0;
	margin-top: 20px;
	list-style: none;
	position: absolute;
	top: 0;
	z-index: 1;
	}

#sub_outer.kompetenz, #topic.one {
	left: 258px;
	}

#sub_outer.portfolio, #topic.two {
	left: 516px;
}

#sub_outer.fallstudien {
	left: 774px;
}
	
#sub_inner li a  {
	background: #eee url(../images/subnav_bg.gif) no-repeat;
	width: 	257px;
	height: 19px;
	margin-bottom: 1px;
	text-indent: 12px;
	line-height: 1.8em;
	display: block;
	color: #999;
	text-decoration: none;
	}
	
#sub_outer.profil li a:hover, 
#sub_outer.profil li a.current,
#sub_outer.profil li a.section {
	color: #fff;
	background-color: #0080ff;
	}
	
#sub_outer.kompetenz li a:hover, 
#sub_outer.kompetenz li a.current,
#sub_outer.kompetenz li a.section {
	color: #fff;
	background-color: #9ad662;
	}
	
#sub_outer.portfolio li a:hover, 
#sub_outer.portfolio li a.current,
#sub_outer.portfolio li a.section  {
	color: #fff;
	background-color: #F3750C;
	}
	
#sub_outer.fallstudien li a:hover, 
#sub_outer.fallstudien li a.current,
#sub_outer.fallstudien li a.section {
	color: #fff;
	background-color: #d20bd2;
	}
	
#sub_navi_down {
	
	}
#outer {
	background: url(../images/back.gif) repeat-x top;
	margin-top: 20%;
	border: #fff 1px solid;
	height: 40px;
	}
	
#container, #top {
	width: 1032px;
	margin: 0 auto;
	position: relative;
	overflow: visible;
	border-left: #fff 1px solid;
	}
	
.homelinks {
	position: absolute;
	bottom: -284px;
	cursor: pointer;
	}
	
#claim {
	position: absolute;
	bottom: -280px;
	right: 0;
	color: #fff;
	}
	
.homelinks div {
	display: none;
	height: 20px;
	}

.homelinks div a {
	background: url(../images/icon-arrow-home.gif) no-repeat;
	color: #fff;
	padding: 1px 0 0 25px;
	height: 18px;
	}
	
.kenburns {
	position: absolute;
	top: -242px;
	left: -1px;
	width: 1031px;
	border: #444d54 1px solid;
	height: 524px;
	z-index: 0;
	}
	
.contenthome {
	width: 258px;
	max-height: 240px;
	overflow: hidden;
	left: 515px;
	top: 37px;
	background: url(../images/txt-box-back.png) repeat-x #444d54;
	position: absolute;
	overflow: hidden;
	color: #fff;
}

.contenthome div {
	margin: 5px 5px 10px 0;
	}
	
.contenthome h1 {
	color: #fff;
	font-size: 14px;
	}
	
#top {
	width: 1028px;
	margin: 0 auto;
	height: 40px;
	position: relative;
	z-index: 0;
	}
	
#top div {
	padding-top: 22px;
	}

#top div a {
	margin-left: 11px;
	display: inline;
	}
	
#top div a:hover {
	color: #0080FF;
	background: none;
	}
	
#top div a.active {
	color: #0080FF;
	}
	
#top img {
	top: 0;
	right: 0; 
	position: absolute
	}

#language {
	padding-top: 20px;
	}

#language a, #language p {
	background: none;
	float: left;
	margin: 0;
	padding: 0;
	}

#language a.selected {
	font-size: 12px;
	font-weight: bold;
	}
	
#nav {
	width: 1032px;
	height: 30px;
	list-style: none;
	position: relative;
	background-color: #fff;
	overflow: hidden;
	}
	
#nav li  {
	width: 257px;
	margin-right: 1px;
	float: left;
	}
	

#nav a.profil {
	background: url(../images/navi/profil_back.gif) repeat 0 -8px;
	}
	
#nav a.profil:hover {
	background-position: 0 0;
	}
	
#nav a.profil.selected {
	background: url(../images/navi/profil_back_select.gif) 0 -8px
	}
	
#nav a.kompetenzen {
	background: url(../images/navi/kompetenzen_back.gif) repeat 0 -8px
	}
#nav a.kompetenzen:hover {
	background-position: 0 0px;
	}
#nav a.kompetenzen.selected {
	background: url(../images/navi/kompetenzen_back_select.gif) 0 -8px
	}
	
#nav a.portfolio {
	background: url(../images/navi/portfolio_back.gif) repeat 0 -8px
	}
#nav a.portfolio:hover {
	background-position: 0 0;
	}
#nav a.portfolio.selected {
	background: url(../images/navi/portfolio_back_select.gif) 0 -8px
	}
	
#nav a.fallstudien {
	background: url(../images/navi/fallstudien_back.gif) repeat 0 -8px
	}
#nav a.fallstudien:hover {
	background-position: 0 0;
	}
#nav a.fallstudien.selected {
	background: url(../images/navi/fallstudien_back_select.gif) 0 -8px;
	margin-right: 0;
	}
	
.navi_buttons {
	margin: 10px 0 10px 15px;
	}
	
#links {
	width: 258px;
	float: left;
	margin-top: 20px;
	}

#mitte {
	width: 515px;
	float: left;
	margin-top: 25px;
	}
	
#mitte ul {
	margin-left: 28px;
	line-height: 1.7em;
	}
	
#mitte a {
	display: inline;
}

#mitte a:hover {
	text-decoration: underline;
}

#mitte.blue a {
	color: #0080FF;
}

#mitte.green a {
	color: #69CF51;
}

#mitte.orange a {
	color: #F3750C;
}

#mitte.pink a {
	color: #D10BD2;
}

#mitte em {
	display: block;
	padding-left: 25px;
	height: 35px;
	font-weight: bold;
	line-height: 1.8em;
}

#mitte em a {
	font-weight: normal;
}

#mitte.blue em {
	background: url(../images/icon_right_blue.png) no-repeat;
	color: #0080FF;
}

#mitte.green em {
	background: url(../images/icon_right_green.png) no-repeat;
	color: #69CF51
}

#mitte.orange em {
	background: url(../images/icon_right_orange.png) no-repeat;
	color: #F3750C;
}

#mitte.pink em {
	background: url(../images/icon_right_pink.png) no-repeat;
	color: #D10BD2;
}
	
#rechts {
	width: 257px;
	float: left;
	margin-top: 20px;
	}
	
.bubbleInfo {
	position: absolute;
	left: 0;
	margin-top: 10px;
	}
	
.popup {
    position: relative;
	bottom: 5px;
	width: 1032px;
	height: 254px;
    display: none; /* keeps the popup hidden if no JS available */
	z-index: 10000;
	}

	
.popup p {
	font-size: 24px;
	line-height: 1.2em;
	padding: 50px 30px 0 270px;
	}

.bubbleInfo.bubble-kompetenz .popup p {
	padding: 80px 0 0 270px;
}
	
#closer {
	margin: 40px 0 0 980px;
	}

.second {
	margin-left: 1px;
	}

.open {
	position: absolute;
	bottom: 5px;
	right: 5px;
	}

.box_txt {
	background: #eee;
	padding-bottom: 10px;
	}

.box_txt p {
	padding-top: 10px;
	background: #eee;
	}

.slides {
	position: relative;
	height: 182px;
	width: 515px;
	overflow: hidden;
	}
	
.slides a {
	float: left;
	margin-right: 1px;
	height: 182px;
	}
	
.slides.top a.prev, .slides.top a.prev_2, .slides a.prevTop, .slides a.prevTop_2  {
	position: absolute;
	top:0;
	z-index: 100;
	}
	
.slides.top a.prev_2, .slides a.prevTop_2 {
	margin-left: 258px;
	}


	
.slides.top a {
	border: #949ca7 1px solid;
	overflow: hidden;
	height: 180px;
	display: block
	}	

	
.slides.top {
	height: 182px;
	position: relative;
	
	} 

.box_txt div img {
	display: block;
	}
		
#navi_links a {
	text-decoration: none;
	background: url(../images/icon_right_grey_small.png) no-repeat 0 0.4em;
	padding: 5px 0 5px 25px;
	color: #999;
	}
	
#rechts.blue a, #rechts.green a, #rechts.orange a, #rechts.pink a {
	xxxcolor: #999;
	xxxbackground: url(../images/icon_right_grey_small.png) no-repeat 0 0.4em;
	padding: 5px 0 5px 25px;
	xxxmargin-left: -25px;
	}


	
#rechts.blue, #rechts.green, #rechts.orange, #rechts.pink {
	margin-left: 14px;
	width: 243px;
	}
	
#rechts.blue p, #rechts.green p, #rechts.orange p, #rechts.pink p {
	margin: 0;
	padding: 0;
	}
	

#navi_links.blue a:hover, #navi_links.blue p a.current, #top a:hover, #rechts.blue a {
	background: url(../images/icon_right_blue.png) no-repeat 0 0.4em;
	color: #0080FF
	}
	
#navi_links.green a:hover, #navi_links.green p a.current, #rechts.green a {
	background: url(../images/icon_right_green.png) no-repeat 0 0.4em;
	color: #69CF51;
	}
	
#navi_links.orange a:hover, #navi_links.orange p a.current, #rechts.orange a {
	background: url(../images/icon_right_orange.png) no-repeat 0 0.4em;
	color: #F3750C;
	}

#navi_links.pink a:hover, #navi_links.pink p a.current, #rechts.pink a {
	background: url(../images/icon_right_pink.png) no-repeat 0 0.4em;
	color: #D10BD2;
	}
	

#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2000;
	}
	
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 2000;
	text-align: center;
	line-height: 0;
	overflow: hidden;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #ECECEE;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	overflow: hidden;
}

#lightbox-loading-link {
	}


#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	z-index: 0;
}

#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 25px;
	height: 25px;
	float: left;
}
#lightbox-nav-btnPrev {
	margin-left: 10px;
	cursor: pointer
	}
#lightbox-nav-btnNext { 
	margin-left: 10%;
	cursor: pointer
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #ECECEE;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 250px;
	xxxpadding: 0 10px 0;
}

#lightbox-content {
	position: absolute;
	overflow:auto;
}

#lightbox-container-image-data {
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { line-height: 2.2em; padding: 0 5% 0 5%; float: left}
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	float: right;
	padding-bottom: 0.7em;	
	margin-right: 10px;
}

/* BUBBLE PIMPUP*/

.popup strong {
	font-weight: normal;
}


.bubble-profil .popup {
	background: url(../images/popup_blue.gif) no-repeat;
	width: 774px;
}

.bubble-profil .popup strong {
	color: #0080FF;
}

.bubble-kompetenz .popup {
	background: url(../images/popup_green.gif) no-repeat;
}

.bubble-kompetenz .popup strong {
	color: #69CF51;
}

.bubble-portfolio .popup {
	background: url(../images/popup_orange.gif) no-repeat;
	width: 774px;
}

.bubble-portfolio .popup strong {
	color: #F3750C;
}

.bubble-fallstudien .popup {
	background: url(../images/popup_pink.gif) no-repeat;
	width: 774px;
}

.bubble-fallstudien .popup strong {
	color: #D10BD2;
}

.bubbleInfo.bubble-profil, .bubbleInfo.bubble-portfolio, .bubbleInfo.bubble-fallstudien {
	left: 258px;
}

#newsletterform {
	background: #eee;
}

#newsletterform form {
	margin-left: 12px;
}

#newsletterform label {
	width: 142px;
	line-height: 2.5em;
	display: block;
	float: left;
}

#newsletterform label.error {
	float: none;
clear: left;
	line-height: 1em;
	margin-left: 142px;
	color: red;
}

#newsletterform input {
	width: 275px;
	margin-bottom: 5px;
}