@charset "UTF-8";
/* CSS Document */

* {
	margin: 0;
	padding:0;
	}

body {	
	padding:0;
	margin:0;
	height:100%;
	width:100%;
	background-color: #333;
	font-family: 'Open Sans', sans-serif;
	 -webkit-hyphens: auto;
	 -moz-hyphens: auto;
	 -ms-hyphens: auto;
	 hyphens: auto;
}

html, body {
	height: 100%;
	}

body > #wrap {
	height: auto;
	min-height: 100%;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {display: inline-block;}

/* Bereich nicht für IE-mac Anfang \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* Bereich nicht für IE-mac Ende */	

#header {
	width: 100%;
	position: fixed;
	z-index: 9999;
	top: 0;
	min-height:80px;
	background: url(../grafik/background-navi.jpg) center bottom;
	border-bottom: 1px solid #1d1d1d;
	background-color: #333;
}

/*background:-moz-linear-gradient(left,#333, #666,#333); /* Firefox */
/*background: -webkit-gradient(linear, 100% 100%, 0 100%, from(#333), color-stop(50%, #666), color-stop(100%, #333)); /* Chrome, Safari */
/*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3',endColorstr='#f1f1f1'); /* Internet Explorer */

.container {
	width: 100%;
	clear:both;
}

.main {
	margin:auto;
	max-width: 1000px;
	width: 95%;
	padding: 2,5%;
	min-height:50px;
}

.bild {
	width: 97%;
	background-color:#FFF;
	border: 1px solid #999;
	padding: 1.45%;
	margin-bottom: 30px;
}	

.image {
	width:100%;	
}

.titel {
	max-width: 1200px;
	width:100%;
	height:auto;
	padding-top: 60px;
	margin:auto;
}

.karte {
	width:100%;
	margin:auto;
	text-align:center;
	height: 450px;
	overflow:hidden;
	border-top: 1px solid #999;
}

.emo {
	padding-bottom: 40px;
	background-image:url(../grafik/background-grey.png);	
}

.spacer {
	height: 120px;
	background-image:url(../grafik/background-grey.png);
}

.mobil-spacer {
	display: none;
	height: 40px;
}

.hellgrau {
	padding-bottom: 40px;
	background-color: #EBEBEB;
}

.grau {
	background-image:url(../grafik/background-grey.png);
}

.weiss {
	background-color: #FFF;
	text-align:center;
}

.dunkelgrau {
	background-color: #333;
}

.logo {
	margin-top: 17px;
	float:left;
}

.index-box-right {
	width: 30%;
	float:right;
}

.index-box {
	width: 30%;
	margin-right: 5%;
	margin-left: 5%;
	float:left;
}

.index-box-left {
	width: 30%;
	float:left;
}

.aktiv-blind {
	opacity:0.4;
	filter:alpha(opacity=40);
}
	

.icon-index {
	float: right;
	margin-right: 15px;
		-webkit-transition: margin 0.15s linear;
	-moz-transition: margin 0.15s linear;
	-o-transition: margin 0.15s linear;
	transition: margin 0.15s linear;
		opacity:0.4;
	filter:alpha(opacity=40);
}

.icon-index:hover {
	margin-right: 18px;
	opacity:1;
	filter:alpha(opacity=100);
}

.button {
	color:#FFF;
	padding-top: 3px;
	padding-bottom: 4px;
	padding-left:25px;
	padding-right: 9px;
	background: url(../grafik/pfeil-rechts.png) 8px 4px no-repeat #666666;
	margin-left: 1.45%;
	font-size:14px;
	letter-spacing:0.5px;
}

.button:hover {
	color:#FFF;
	background: url(../grafik/pfeil-rechts.png) 8px 4px no-repeat #CCCCCC;
}
	

/*TEXTE*/

h1 {
	font-size:48px;
	color: #CCC;
	font-weight:400;
	letter-spacing: 1px;
	margin-bottom: 20px;
}

h2 {
	font-size:24px;
	color: #333;
	font-weight:400;
	letter-spacing: 0.3px;
	line-height: 33px;
	margin-left: 1.45%;
}

h4 {
	font-size:18px;
	color: #333;
	font-weight:400;
	letter-spacing: 0.3px;
	line-height:25px;
	margin-left: 1.45%;
}

.small {
	font-size:14px;
	margin-top: 3px;
}

.subtitel {
	font-size:18px;
}

.name {
	font-size: 34px;
	letter-spacing: 0.7px;
	margin-top: -13px;
}

a.rot {
	color: #C00;
}

a.rot:hover {
	color: #fff;
}


a {
	text-decoration:none;
	color: #333;
}

a:hover {
	color: #C00;
}

h3 {
	font-size: 20px;
	font-weight:400;
	letter-spacing:0.5px;
	border-bottom: 1px solid #CCC;
	background: url(../grafik/icon/icon-pfeil.png) 68px 13px no-repeat;
}

h3 a {
  display: block;
  padding: 10px;
  margin: 15px;
  margin-left: 1.45%;
  padding: 5px 0px 5px 90px;
  text-decoration: none;
  color: #333;
}

h3 a:hover,
h3.open a:hover {
	color: #666;
}

h3.open a {
	color: #333;
}

h3.open  {
	border-bottom: 0px solid #CCC;
	background: none;
}

.list-content {
	margin-bottom: 15px;
	padding-left: 90px;
	padding-bottom: 20px;
	border-bottom: 1px solid #CCC;
}

h3.icon-beratung a{
	background: url(../grafik/icon/picto.svg) 0 3px /  50px no-repeat;
}

h3.icon-cd a {
	background: url(../grafik/icon/picto.svg) 0 -70px /  50px no-repeat;
}

h3.icon-digital a {
	background: url(../grafik/icon/picto.svg) 0 -143px /  50px no-repeat;
}

h3.icon-print a {
	background: url(../grafik/icon/picto.svg) 0 -216px /  50px no-repeat;
}

h3.icon-technik a {
	background: url(../grafik/icon/picto.svg) 0 -289px /  50px no-repeat;
}

h3.icon-text a {
	background: url(../grafik/icon/picto.svg) 0 -362px /  50px no-repeat;
}

h3.icon-foto a {
	background: url(../grafik/icon/picto.svg) 0 -435px /  50px no-repeat;
}

h3.icon-liefer a {
	background: url(../grafik/icon/picto.svg) 0 -508px /  50px no-repeat;
}


h3.icon-beratung a:hover,
h3.open.icon-beratung a {
	background: url(../grafik/icon/picto.svg) 0 -622px /  50px no-repeat;
}

h3.icon-cd a:hover,
h3.open.icon-cd a {
	background: url(../grafik/icon/picto.svg) 0 -695px /  50px no-repeat;
}

h3.icon-digital a:hover,
h3.open.icon-digital a {
	background: url(../grafik/icon/picto.svg) 0 -768px /  50px no-repeat;
}

h3.icon-print a:hover,
h3.open.icon-print a {
	background: url(../grafik/icon/picto.svg) 0 -841px /  50px no-repeat;
}

h3.icon-technik a:hover,
h3.open.icon-technik a {
	background: url(../grafik/icon/picto.svg) 0 -914px /  50px no-repeat;
}

h3.icon-text a:hover,
h3.open.icon-text a {
	background: url(../grafik/icon/picto.svg) 0 -987px /  50px no-repeat;
}

h3.icon-foto a:hover,
h3.open.icon-foto a {
	background: url(../grafik/icon/picto.svg) 0 -1060px /  50px no-repeat;
}

h3.icon-liefer a:hover,
h3.open.icon-liefer a {
	background: url(../grafik/icon/picto.svg) 0 -1133px /  50px no-repeat;
}

p {
	font-size:15px;
	color:#333;
	margin-left: 1.45%;
}

.block {
	float:left;
	margin-right: 40px;
	margin-left: 1.45%;
}

.block-left {
	float:left;
	width: 65%;
}

.block-right {
	float:right;
	width: 45%;
	margin-right: 1.45%;
	margin-left: 1.45%;
	text-align:justify;
}

p.block-right {
	font-size:18px;
	color: #CCC;
	font-weight:300;
	letter-spacing: 0.3px;
	line-height: 30px;
}

.right-small {
	float:right;
	width: 30%;
}

.team a {
	background-color:#FFF;
	border: 1px solid #CCC;
	padding: 4px;
	margin: 8px;
	display: block;
	float:left;
}

.team a:hover {
	opacity:0.4;
	filter:alpha(opacity=40);
}

.potrait-block {
	width: 14%;
	float:left;
	margin-right: 1.3%;
	margin-left: 1.3%;
	margin-bottom: 3%;
	display:inline-block;
}

.potrait-block a {
	display:block;
	padding: 4px;
	border: 1px solid #ccc;
	background-color:#FFF;
}

.potrait-block a:hover {
	opacity:0.4;
	filter:alpha(opacity=40);
	border: 1px solid #999;
}

.zitat {
	float:right;
	width: 28%;
	padding: 1%;
	background-color:#FFF;
	border: 1px solid #CCC;
	min-height: 100px;
	margin-top: 20px;
}

.zitat p {
	font-size:13px;
	line-height: 24px;
}

.zitat p.name {
	font-size:14px;
	float:right;
	text-align:right;
}

.right-spacer-zwei {
	width: 100%;
	height: 66px;
}

.right-spacer-eins {
	width: 100%;
	height: 33px;
}

.kopf-icon {
	float:none;
	text-align:center;
	margin-bottom: 30px;
	margin-top: 10px;
}

.trenner {
	width: 100%;
	height: 2px;
	margin-top: 20px;
	margin-bottom: 20px;
	background-image:url(../grafik/trenner.png);
	background-repeat:repeat-x;
	clear:both;
}

/*FOOTER*/

.footer {
	color: #fff;
	padding-top: 25px;
		font-size:12px;
	padding-bottom: 20px;
}

.footer p {
	color: #999;
	font-size:12px;
	line-height: 20px;
}

.footer a {
	color:#FFF;
	margin-left: 1.45%;
	line-height: 20px;
}

.footer li {
	list-style:none;
	display:inline-block;
	margin: 5px;
	margin-top:0;
}


.footer li a {
	color:#FFF;
	text-decoration:none;
	margin-left: 0;
}

.footer li a:hover {
	color: #C00;
}

.footer-left {
	float:left;
	margin-right: 2.5%;
	margin-left: 1.45%;
	margin-bottom: 10px;
}

.footer-right {
	float: right;
	margin-right: 1.45%;
	margin-left: 1.45%;
	margin-bottom: 10px;
}

.claim {
	margin-top: 50px;
}

/*SCROLLER*/

.scrollup{
    width:40px;
    height:40px;
    position:fixed;
	z-index:30;
    bottom:90px;
    right:0;
    display:none;
    text-indent:-9999px;
    background: url(../grafik/icon_top.png) no-repeat;
}

.pfeil-down {
	width: 100%;
	text-align:center;
	margin-bottom: 5px;
}

.pfeil-down-karte {
	width: 100%;
	text-align:center;
	margin-bottom: 5px;
	position:absolute;
}

.pfeil-down-hellgrau {
	background: url(../grafik/background-grey-pfeil.png) 0px -99px repeat-x;
	width: 100%;
	text-align:center;
	margin-bottom: 20px;
}

.scrolldown-karte {
    width:40px;
    height:33px;
    background: url(../grafik/pfeil-karte.png) no-repeat  ;
	display:inline-block;
}

.scrolldown-karte:hover{
        background: url(../grafik/pfeil-karte.png) 0px -35px no-repeat  ;
}

.scrolldown-grau {
    width:40px;
    height:33px;
    background: url(../grafik/icon/pfeil-down.png) 0px 0px no-repeat  ;
	display:inline-block;
}

.scrolldown-grau:hover{
        background: url(../grafik/icon/pfeil-down.png) 0px -35px no-repeat  ;
}

.scrolldown-weiss {
    width:40px;
    height:33px;
    background: url(../grafik/icon/pfeil-down.png) -40px 0px no-repeat  ;
	display:inline-block;
}

.scrolldown-weiss:hover{
        background: url(../grafik/icon/pfeil-down.png) -40px -35px no-repeat  ;
}



