* {
	margin:0;
	padding:0;
}

html,body {
	text-align:center;
	background-color:#f9f9f9;
	background-image: url(../images/grain-bg.png);
	background-repeat: repeat;
	font-family:'Arimo', Arial, Verdana;
	font-size:12px;
	line-height: 18px;
	color:#4b4b4b;
	height:100%; /* needed for container min-height */
}

#gradient-bg {
	width: 100%;
	height: 210px;
	background-image: url(../images/gradient-bg.png);
	background-repeat: repeat-x;
}

#blue-gradient {
	background-image: url(../images/nav-blue-fader.png);
	background-repeat: repeat-x;
	position: fixed;
	top: 0;
	width: 100%;
	height: 11px;
	z-index: 999;
}

#container {
	background-color:#e6e6e6;
	position:relative; /* needed for footer positioning*/
	margin:0 auto; /* center, not in IE5 */
	width:960px;
	background:#f0f0f0;
	height:auto!important; /* real browsers */
	height:auto; /* IE6: treaded as min-height*/
	min-height:auto; /* real browsers */
}

#top {
	cursor: pointer;
	position: fixed;
	bottom: -50px;
	left: 50%;
	width: 70px;
	height: 40px;
	margin-left: 400px;
	background-image: url(../images/topper-harley.png);
	background-repeat:no-repeat;
	background-position: right top;
	z-index: 9999999;
}

.hidden {
	display: none;
}
	
/*layout styles*/
#error404 {
	background-color:#cdcdcd;
	position:relative;
	float:left;
	clear:left;
	width:930px;
	height:auto;
	text-align:left;
	padding:15px;
	margin:20px 0 0;
}

#header {
	position:relative;
	float:left;
	clear:left;
	width:900px;
	height:68px;
	text-align:left;
	margin: 25px 0px 0px 30px;
}

#navigation {
	background-image: url(../images/nav-bg.png);
	background-repeat: repeat-x;
	background-position: top left;
	position: relative;
	float: right;
	width: 750px;
	height: 68px;
	margin: 3px 0px 0px 0px;
}

.mod_navigation {
	position:relative;
	float:right;
	clear:left;
	width:auto;
	height:auto;
	min-height: 60px;
	z-index:999;
	text-align: left;
	padding: 0px 0px 0px 20px;
}

#hidden-navigation .mod_navigation {
	margin: 0px 12px 0px 0px;
}

#logo {
	position: relative;
	float: left;
	clear: left;
	width: 127px;
	height: 68px;
}

#the-fold {
	background-image: url(../images/the-fold-seperator.png);
	background-repeat: no-repeat;
	background-position: bottom center;
	position: relative;
	float: left;
	clear: left;
	width: 960px;
	height: 505px;
	overflow: hidden;
}

#the-fold.clean {
	background-image: none;
}

#core-skills {
	position: relative;
	float: left;
	clear: left;
	width: 960px;
	height: auto;
	padding: 60px 0px 30px 0px;
}

#newsletters {
	background-image: url(../images/the-fold-seperator.png);
	background-repeat: no-repeat;
	background-position: bottom center;
}

#newsletters, #contact_content {
	position: relative;
	float: left;
	clear: left;
	width: 960px;
	height: auto;
	padding: 60px 0px 60px 0px;
}

#main {
	position: relative;
	float: left;
	clear: left;
	width: 960px;
	height: auto;
	padding: 0px 0px 60px 0px;
}

#footer-container {
	background-image: url(../images/footer-bg.png);
	background-repeat: repeat-x;
	position:relative;
	float: left;
	clear: left;
	width:100%;
	height:400px;
	text-align:left;
}

#footer {
	position: relative;
	margin:0 auto; /* center, not in IE5 but who cares about ie5 anyway? */
	width: 960px;
	height:347px;
	color: #e6e6e6;
}
#footer-blue {
	background-image: url(../images/footer-bracket.png);
	background-repeat: no-repeat;
	background-position: center 7px;
	position: relative;
	margin:0 auto; /* center, not in IE5 but who cares about ie5 anyway? */
	width: 960px;
	height:25px;
	color: #000;
	text-shadow: 0px 1px 1px #3079b4;
	padding: 26px 0px 0px 0px;
	text-align: center;
	font-size: 10px;
}

#hidden-container {
	position: fixed;
	top: -250px;
	left: 50%;
  margin-left: -450px;
	width: 904px;
	height: 68px;
	z-index: 999999;
}

/* footer styles */
#footer #left {
	position: relative;
	float: left;
	width: 305px;
	height: auto;
	margin: 75px 0px 0px 25px;
}
#footer #center {
	position: relative;
	float: left;
	width: 400px;
	height: auto;
	margin: 85px 0px 0px 0px;
}
#footer #right {
	position: relative;
	float: left;
	width: 205px;
	height: auto;
	margin: 75px 0px 0px 0px;
}
#footer .ce_text {
	position: relative;
	float: left;
	width: auto;
	height: auto;
	color: #e6e6e6;
}
#footer h1 {
	font-size: 30px;
	color: #e6e6e6;
	width: auto;
	margin: 0px 0px 3px 0px;
	line-height: normal;
}
#footer a {
	text-decoration: none;
	color: #a7a7a7;
}
#footer a:hover {
	text-decoration: none;
	color: #e6e6e6;
	text-shadow: 0px 0px 5px #0c5fa6;
}
#footer-blue a {
	text-decoration: underline;
	color: #000;
}

/* header navigation */
#logo a {
	width: 127px;
	height: 68px;
	display: block;
}
#logo a:click {
	margin-top: 1px;
}
#logo a img {
	position:absolute;
	left:0;
}
#logo a img.hover {
	opacity: 0.0
}


	
/*content styles*/
a {
	-webkit-transition: color 0.2s ease-in; /*safari and chrome */
 	-o-transition: color 0.2s ease-in; /* opera */
}

#error404 .ce_text {
	color:red;
	font-size:18px;
}

h1 {
	font-size:48px;
	margin:0;
	font-weight:bold;
	color: #000;
	line-height: normal;
}

h2 {
	font-size:34px;
	margin:0;
	font-weight:bold;
	color: #000;
	line-height: normal;
	text-align: left;
}

h3 {
	font-size:27px;
	margin:0;
	font-weight:bold;
	color: #000;
	line-height: normal;
}

h4 {
	font-size:18px;
	margin:0;
	font-weight:normal;
	color: #000;
	line-height: normal;
}

h5 {
	font-size:12px;
	margin:0;
	font-weight:bold;
	color: #000;
	line-height: normal;
}

#main h1 {	
	background-image: url(../images/content-headline-bg.png);
	background-repeat: no-repeat;
	width: 884px;
	height: 16px;
	font-size: 18px;
	color: #ededed;
	text-shadow: 0px 1px 2px #000;
	padding: 13px;
	margin: 0px 0px 0px 6px;
	text-align: left;
}
#the-fold .home h1 {
	line-height: 38px;
}

#core-skills h2 {
	padding: 0px 29px;
	text-align:center;
}

#newsletters h2 {
	padding: 0px 29px;
	text-align: center;
}

#newsletters .flowergfx.ce_text p {
	text-align: center;
}

#main .mod_article {
	margin: 0px 25px 0px 25px;
}

#main .mod_article .ce_text {
	padding:0px 0px 0px 0px;
	margin: 40px 5px 0px 10px;
	text-align: left;
	position: relative;
	float: left;
	width: 210px;
	height: auto;
	text-shadow: 0px 1px 0px #fff;
	overflow: show !important;
}
div.image_container img{
	z-index: 99999;
}
#main #about_left {
	position: relative;
	float: left;
	clear: left;
	width: auto;
	height: auto;
	margin: 0px 0px 0px 0px;
}

#main #about_right {
	position: relative;
	float: left;
	width: 485px;
	height: auto;
}

#main #about_left .mod_article .ce_text {
	width: 380px;
	height: auto;
}

#main #about_right .mod_article {
	width: 475px;
	height: auto;
	margin: 0px 0px 0px 5px;
	padding: 40px 0px 0px 0px;
}

#main #about_right .mod_article .ce_text {
	position: relative;
	float: left;
	text-align: center;
	width: 150px;
	height: auto;
	margin: 0px 8px 20px 0px;
	padding: 0;
	line-height: 14px;
}

#main #about_right .mod_article .ce_text p {
	text-align: center;
	width: 150px;
	height: auto;
}

#main .mod_article .ce_text.team_member {
	border: 1px solid red;
	text-align: center;
}

#main .mod_article .ce_text.first {
	margin: 40px 10px 0px 5px;
}

#main .mod_article .ce_text p.content-title {
	position: relative;
	float: right;
	clear: none;
	width: 150px;
	height: 49px;
	margin: 0px 0px 0px 0px;
	line-height: 14px;
}

#main .mod_article .ce_text p.content-title span {
	display:table-cell;
	vertical-align:bottom;
	width: 150px;
	height: 49px;
}

#main .mod_article .ce_text p {
	position: relative;
	float: left;
	clear: left;
}

#blue .ce_text {
	position: relative;
	float: left;
	clear: left;
	width: 960px;
	height: auto;
	text-align: center;
}

.ce_text a,.ce_form a,p.back a {
	color:#1d9cc0;
	text-decoration:underline;
}

.ce_text a:hover,.ce_form a:hover,p.back a:hover {
	color:#0c5fa6;
	text-decoration:underline;
}

#blue .ce_text a {
	color: #fff;
}

#blue .ce_text a:hover {
	color: #fff;
}

.pdf_link {
	padding-left:20px;
	background-image:url(../../system/themes/default/images/iconPDF.gif);
	background-repeat:no-repeat;
	padding-top:3px;
	padding-bottom:3px;
}

.doc_link {
	padding-left:20px;
	background-image:url(../../system/themes/default/images/iconOFFICE.gif);
	background-repeat:no-repeat;
	padding-top:3px;
	padding-bottom:3px;
}

.word-highlight {
	color: #1d9cc0;
}

#stage {
	background-image: url(../images/loading.gif);
	background-repeat: no-repeat;
	background-position: center center;
	background-color: #f7f7f7;
	position: relative;
	float: left;
	clear: left;
	width: 557px;
	height: 314px;
	margin: 94px 0px 0px 25px;
	box-shadow: 0px 1px 2px #949494;
	-webkit-box-shadow: 0px 1px 2px #949494;
	-moz-box-shadow: 0px 1px 2px #949494;
	text-align: left;
}

#stage-content {
	width: 900px;
	height: 345px;
}

#stage-text .mod_article, #stage-content .mod_article {
	position: relative;
	float: left;
	width: 312px;
	height: auto;
	margin: 100px 0px 0px 40px;
	padding-bottom: 40px;
	text-align: left;
}

#stage-content .mod_article {
	width: 900px;
	height: auto;
	margin: 100px 30px 0px 30px;
}

#stage-text .mod_article h1, #stage-content .mod_article h1 {
	font-size: 24px;
	margin: 0px 0px 4px 0px;
}

#stage-text a {
	text-decoration: none;
}

#stage-shadow {
	background-image: url(../images/stage-shadow.png);
	position: relative;
	float: left;
	clear: left;
	width: 557px;
	height: 34px;
	margin: 10px 0px 0px 25px;
}

.reference_bar {
  position: relative;
  float: left;
  clear: left;
  width: 602px;
  height: 35px;
  margin: 60px 0px 0px 170px;
}

/* home specific styles */
#core-skills .ce_text.left_title h1, #newsletters .ce_text.left_title h1  {
	line-height: 36px;
}
#core-skills .ce_text, #newsletters .ce_text {
	position: relative;
	float: left;
	width: 900px;
	height: auto;
	text-align: left;
	margin: 20px 24px 20px 24px;
}
#core-skills .ce_text p, #newsletters .ce_text p {
	padding: 5px;
}
#core-skills .ce_text.clear_left, #newsletters .ce_text.clear_left, #main .mod_article .ce_text.clear_left, #main #about_right .mod_article .ce_text.clear_left {
	clear: left;
}
#core-skills h3, #newsletters h3 {
	background-image: url(../images/home-core-headline-bg.png);
	background-repeat: no-repeat;
	width: 404px;
	height: 16px;
	font-size: 18px;
	color: #ededed;
	text-shadow: 0px 1px 2px #000;
	padding: 13px;
	cursor: pointer;
}
#newsletters h3 {
	background-image: url(../images/home-newsletters-headline-bg.png);
}
/* slider */
#slider {
    position:relative;
    width:960px; /* Change this to your images width */
    height:455px; /* Change this to your images height */
    background:url(../images/loading.gif) no-repeat 50% 50%;
}
#slider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider a {
    border:0;
    display:block;
}
#slider .nivo-controlNav, .nivo-controlNav {
	position: absolute;
	top: 475px;
	left: 0;
	width: auto;
	height: auto;
	margin-left: 48%;
	text-align: center;
	padding: 0px 0px 0px 0px;
}
#slider a.nivo-control, a.nivo-control {
	float: left;
	text-indent: -9999999px;
	width: 10px;
	height: 11px;
	background-image: url(../images/the-fold-bullets.png);
	background-position: 0px 0px;
	text-decoration: none;
	margin: 0px 2px 0px 0px;
}
#slider a.nivo-control.active, a.nivo-control.active {
	background-position: 0px 11px;
}



/*contact specific style*/
#pager {
	position: relative;
	float: left;
	clear: left;
	width: 700px;
	height: 30px;
	text-align: center;
	margin: 15px 130px;
}
#pager a {
	position: relative;
	display: inline-block;
	width: 10px;
	height: 11px;
	background-image: url(../images/the-fold-bullets.png);
	background-position: 0px 0px;
	text-decoration: none;
	margin: 0px 2px 0px 0px;
	text-indent: -9999999px;
}
#pager a.activeSlide {
	background-position: 0px 11px;
}
#the-fold .mod_article.home {
	height: 455px;
}
#the-fold .home .ce_text {
	margin: 55px 80px 0px 80px;
	width:800px;
  height:394px;
  text-align: left;
}
#the-fold .home .ce_text.video {
	width: 700px;
	margin: 55px 130px 0px 130px;
	 box-shadow: 0px 1px 2px #949494;
	-webkit-box-shadow: 0px 1px 2px #949494;
	-moz-box-shadow: 0px 1px 2px #949494;
}
#the-fold #googlemaps {
	position: relative;
	float: left;
	clear: left;
	width: 910px;
	height: 450px;
	border: 1px solid #bbbbbb;
	margin: 50px 25px 0px 25px;
}

#the-fold #googlemaps-shadow {
	background-image: url(../images/map-shadow.png);
	background-repeat: no-repeat;
	position: relative;
	float: left;
	clear: left;
	width: 910px;
	height: 35px;
	margin: 20px 0px 0px 0px;
}


	
/*form fields*/
span.mandatory {
	color:#1d9cc0;
}

#main .mod_article .ce_form {
	position: relative;
	float: left;
	clear: left;
	text-align: left;
	width: 435px;
	height: auto;
	margin: 0px 0px 0px 25px;
}

.ce_form input.input_field:focus, .ce_form textarea.textarea_field:focus  {
	outline: none;
	border-color: #00a9c7;
	box-shadow:#1d9cc0 0 0 5px,inset 0 1px 0 rgba(0,0,0,.1);
	-webkit-box-shadow:#1d9cc0 0 0 5px,inset 0 1px 0 rgba(0,0,0,.1);
	-moz-box-shadow:#1d9cc0 0 0 5px,inset 0 1px 0 rgba(0,0,0,.1);
}

.ce_form label {
	position:relative;
	float:left;
	clear:left;
	width:175px;
	height: auto;
	margin:15px 0 0;
	font-size: 18px;
	font-style: italic;
	line-height: normal;
	color: #212121;
}

.ce_form input.input_field, .ce_form textarea.textarea_field {
	background: #e6e6e6;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border: #AAA 1px solid;
	color: #666;
	font-size: 15px;
	line-height: 15px;
	padding: 5px;
	-webkit-appearance: none;
	-webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, .1);
	border-top-left-radius: 3px 3px;
	border-top-right-radius: 3px 3px;
	border-bottom-right-radius: 3px 3px;
	border-bottom-left-radius: 3px 3px;
	width: 245px;
	height: 25px;
	margin: 5px 0px 7px 0px;
}

.ce_form textarea.textarea_field {
	height:150px;
}

.ce_form input.submit_field {
	line-height: 12px;
	text-decoration: none;
	background-color: #1d9cc0;
	background-image: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.05, #157FB4),
	    color-stop(0.77, #1D9DC0)
	);
	background-image: -moz-linear-gradient(
	    center bottom,
	    #157FB4 5%,
	    #1D9DC0 77%
	);
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	box-shadow: 0px 1px 2px #444444;
	-webkit-box-shadow: 0px 1px 2px #444444;
	padding: 5px 9px 5px 9px;
	color: #fff;
	text-shadow: 0px 1px 2px #212121;
	border: 0px solid;
	font-size: 18px;
	font-style: italic;
	line-height: normal;
	float: right;
	margin: 0px 3px 5px 0px;
}

.ce_form p.error {
	position:absolute;
	padding:5px;
	background-color:#c93d3d;
	color:#fff;
	margin-left:360px;
	display:none;
}

label.error {
	color:#c93d3d;
}

/* reference area */
#references {
	position: relative;
	float: left;
	clear: left;
	width: 910px;
	height: auto;
	padding: 0px 0px 0px 0px;
	margin: 25px 0px 0px 25px;
}
.ce_image.weitere-referenzen {
	position: relative;
	float: left;
	width: 300px;
	height: 187px;
	padding: 0;
	margin: 0px;
}
.ce_image.weitere-referenzen .image_container {
	position: relative;
	float: left;
	width: 225px;
	height: 135px;
	padding: 0;
	margin: 26px 38px 26px 38px;
	border: 1px solid #fff;
	box-shadow: 0px 0px 4px #8e8e8e;
	-webkit-box-shadow: 0px 0px 4px #8e8e8e;
	-moz-box-shadow: 0px 0px 4px #8e8e8e;
	overflow: hidden;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.ce_image.weitere-referenzen .image_container a {
	background-image: url(../images/loading.gif);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	display: block;
	width: 263px;
	height: 157px;
}
.ce_image.weitere-referenzen .image_container a:hover, .ce_image.weitere-referenzen .image_container a.hover {
	background-position: 0px -179px;
}
.ce_image.weitere-referenzen .image_container a, .ce_image.weitere-referenzen .image_container a img {
	padding: 0;
	margin: 0;
	display: block;
}

/* teaser */
#stage .mod_article .ce_image .image_container {
	background-position: 0px -314px;
	background-repeat: no-repeat;
	display: block;
	width: 557px;
	height: 314px;
	padding: 0px 0px;
	text-decoration: none;
	color: #fff;
	text-shadow: 0px 1px 3px #131313;
	font-size: 18px;
	font-weight: bold;
	overflow: hidden;
}
#stage .mod_article .ce_image .image_container div.caption {
	text-decoration: none;
	color: #fff;
	text-shadow: 0px 1px 3px #131313;
	font-size: 12px;
	font-weight: normal;
	display: none;
	position: relative;
	float: left;
	clear: left;
	width: 387px;
	margin: 100px 85px 0px 85px;
}
#stage .mod_article .ce_image .image_container div.caption span {
	position: relative;
	float: left;
	clear: left;
}
#stage .mod_article .ce_image .image_container div.caption span.title {
	font-size: 18px;
	font-weight: bold;
}
#stage .mod_article .ce_image .image_container div.caption span.text {
	font-size: 12px;
	font-weight: normal;
	height: 100px;
}
/* were adding some nice box shadow to the shadowbox */
#sb-body {
	box-shadow: 0px 0px 20px #000;
}
#stage-text .mod_article ul {
	list-style: none;
}
#stage-text .mod_article ul li span.label, #stage-text .mod_article ul li.ref_link, #stage-text .mod_article ul li.ref_film {
	display: none;
}
#stage-text .mod_article ul li.ref_title span.value {
	font-size:24px;
	line-height: 28px;
	margin:0;
	font-weight:bold;
	color: #000;
	line-height: normal;
}
#stage-text .mod_article a.teaser_button {
	position: relative;
	float: left;
	text-decoration: none;
	background-image: url(../images/bg-teaser_button.png);
	background-repeat: repeat-x;
	width: auto;
	height: auto;
	font-size: 12px;
	font-weight: normal;
	display: block;
	margin: 10px 5px 0px 0px;
	padding: 2px 5px 0px 5px;
	text-shadow: 0px 1px 2px #000;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	cursor: pointer;
	color: #fff;
	text-align: center;
	box-shadow: 0px 1px 2px #131313;
}
#stage-text ul {
	margin: 0;
}
#stage-text .mod_article .ce_gallery {
	display: none;
}
.ref_home_carou_wrapper {
	position: relative;
	float: left;
	clear: left;
	width: 960px;
	height: 505px;
}
/*last changes*/
.sl_prev {
	background-image: url(../images/webcomtv_slider_left.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	position: absolute;
	margin: 0;
	padding: 0;
	display: block;
	width: 25px;
	height: 50px;
	top: 220px;
	left: 30px;
	cursor: pointer;
	z-index: 999;
	text-indent: -999999px;
}
.sl_prev:hover {
	background-position: 0px -49px;
}
.sl_next {
	background-image: url(../images/webcomtv_slider_right.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	position: absolute;
	margin: 0;
	padding: 0;
	display: block;
	width: 25px;
	height: 50px;
	top: 220px;
	left: 908px;
	cursor: pointer;
	z-index: 999;
	text-indent: -999999px;
}
.sl_next:hover {
	background-position: 0px -49px;
}

/*
Anpassungen Jonas
*/
.box-webcomtv-elements {height:162px;overflow:auto;text-align:center;width:900px;}
.box-elements-center {display:block;height:162px;margin:0 auto;overflow:auto;width:728px;}
a.webcomtv-element {color:#FFF;display:block;float:left;font-size:12px;height:92px;margin:0 10px;padding:70px 0 0 0;text-align:center;text-decoration:none;width:162px;}
a.webcomtv-element:hover {color:#FFF;text-decoration:none;}
a#film {background:url(../images/webcomtv_film.jpg) no-repeat;}
a#elearning {background:url(../images/webcomtv_elearning.jpg) no-repeat;}
a#socialmedia {background:url(../images/webcomtv_socialmedia.jpg) no-repeat;}
a#webmobile {background:url(../images/webcomtv_webmobile.jpg) no-repeat;}

#the-fold.film {background:url(../images/background_film.png) no-repeat;}
#the-fold.e-learning {background:url(../images/background_learning.png) no-repeat;}
#the-fold.web-mobile {background:url(../images/background_web.png) no-repeat;}
#the-fold.social-media-interaktion {background:url(../images/background_social.png) no-repeat;}
#the-fold.digitales-marketing {background:url(../images/background_konzept.png) no-repeat;}
/*
#the-fold.film {background:url(../images/background_film.jpg) no-repeat;}
#the-fold.e-learning {background:url(../images/background_learning.jpg) no-repeat;}
#the-fold.web-mobile {background:url(../images/background_web.jpg) no-repeat;}
#the-fold.social-media-interaktion {background:url(../images/background_social.jpg) no-repeat;}
#the-fold.digitales-marketing {background:url(../images/background_konzept.jpg) no-repeat;}
*/
p.text-intro {padding:0 0 0 200px;font-size:21px;line-height:21px;}

h1.heading {
	background: url("../images/content-headline-bg.png") no-repeat top center;
    color: #EDEDED;
    font-size: 18px;
    height: 16px;
    margin: 20px 0 0 0 !important;
    padding: 13px 0 !Important;
    text-align: left;
    text-shadow: 0 1px 2px #000000;
    width: 900px;
	}
	
.no-column {width:auto !important;}
	
.julien_box {
	overflow: visible !important;
}
.julien_box img{
	position: relative;
	
}
.julien_box .image_container{
	overflow: visible !important;
	padding: 0px !important;
}

