/* 
grau: # 3c3c3c
weiß: # dcdcdc 
blau: # 0d87d7
*/


html,body {
	font-family: 'open_sansregular', sans-serif;
	/* font-weight:300; */
	color:#3c3c3c;
	font-size:100%;
	/* background-color:#dcdcdc; */
}
.clear{
	clear: both;
}
::selection {
	background-color:#3c3c3c;
    color: #dcdcdc;
	opacity:1;
}
/* .content {
	padding: 10px;
	margin: 10px;
} */
.bg{
	background-color:blue;
}
.content{
	/* background-color:red; */
	margin-top:100px;
	/* margin-top:4%; */
	margin-bottom:3%;
}
.content2{
	/* background-color:red; */
	margin-top:10px;
	/* margin-top:4%; */
	margin-bottom:3%;
}
img{
	width: 100%;
	height:auto;
}
header{
	z-index:200;
	/* position:fixed; */
	width:100%;
/* 	background-color:rgba(255,255,255,0.8);
	border-bottom:dotted 0.5px #4d6684 */;
}
a:hover{
	/* opacity:0.8; */
	transition:ease-out 0.6s;
}
a img:hover{
	opacity:0.98;
	transition:ease-out 0.6s;
}
.buehne{
	/* background-color:green; */
}
.buehne img{
	width:100%;
	border-top:solid 2px #4d6684;
}
.button{
	margin:0 auto;
	width:30%;
	margin-bottom:2%;
	padding:1% 2%;
	text-align:center;
	border:solid #dcdcdc 1px;
	cursor:pointer;
	color:#dcdcdc;
	background-color:#0d87d7;
}
.button:hover, .button:focus{
	transition:ease-out 0.6s;
	background-color:white;
	color:#0d87d7;
	border:solid 1px #0d87d7;
}
.cards:hover .button, .cards:focus .button{
	transition:ease-out 0.6s;
	background-color:white;
	color:#0d87d7;
	border:solid 1px #0d87d7;
}
.linie{
	width:40%;
	margin:0 auto;
	margin-top:1%;
	border-bottom:solid 0.5px;
	/* border-color:rgba(236,118,29,0.8); */
	border-color:#0d87d7;
}
/* ---- */
/* -------------------------------------- */
			/* Textauszeichnungen */

h1{
	font-family: 'open_sanssemibold', sans-serif;
	text-align:center;
	font-size:2em;
	line-height:1em;
	letter-spacing:0.0002;
	margin-top:1%;
}
h2{
	font-family: 'open_sansregular', sans-serif;
	font-size:1.5em;
	text-align:center;
}
h3{
	font-size:1.5em;
	line-height:1.2em;
	/*line-height:2.6em;*/
	margin-top: 12px;
	margin-bottom: 12px;
}
h4{
	font-family: 'open_sanssemibold', sans-serif;
	font-size:1em;
	line-height:1.2em;
        margin-bottom: 5px;
}
p{
	font-size:1em;
	/* margin-top:1%; */
	letter-spacing:0.02em;
	line-height:1.5em;
}
.fett{
	font-family: 'open_sanssemibold';
}
.ansprechpartner{
	/* color:#0d87d7; */
	font-family: 'open_sanssemibold';
	font-size:1.2em;
	line-height:2em;
}
.footertext{
	font-size:0.8em;
}	
.left{
	text-align:left;
}
.right{
	text-align:right;
}
.center{
	text-align:center;
}
.white{
	color:#dcdcdc;
}
.black{
	color:#3c3c3c:
}
.zweispaltig {
	/* margin-bottom: 4%; */
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
	-moz-column-width: 400px;
	-webkit-column-width: 400px;
	column-width: 400px;
	-webkit-column-gap: 42px; /* Chrome, Safari, Opera */
    -moz-column-gap: 42px; /* Firefox */
    column-gap: 42px;
	text-align:left;
	-webkit-column-fill: balance; /* Chrome, Safari, Opera */
    -moz-column-fill: balance; /* Firefox */
    column-fill: balance; /* linksbündig und flattersatz */
	margin-top: 30px;
}
.liste, .aufzaehlung{
	/* padding-top:2%; */
	padding-bottom:2%;
}
.aufzaehlung li{
	list-style-position: oustide;
	list-style-type:decimal;
	margin-left:40px;
	margin-top:5px;
	font-size:1.2em;
	line-height:1.6em;
}
.liste li{
	list-style-position: oustide;
	list-style-type:disc;
	margin-left:40px;
	/* margin-top:10px; */
	font-size:1em;
	letter-spacing:0.02em;
	line-height:1.5em;
	/* font-size:1.2em; */
	/* line-height:1.6em; */
}
/* -------------- */
/* Header */
.info{
	width:100%;
	height:50px;
	background-color:#3c3c3c;
	color:#dcdcdc;
	padding-top:8px;
}
.info a{
	font-size:0.8em;
}
.info a:hover{
	opacity:0.8;
}
.info .lang{
	/* background-color:green; */
	float:right;
	border-right:solid 1px;
	padding-left:5px;
	padding-right:15px;
	margin-right:2%;
	margin-top:15px;
	font-size:0.8em;
}
.info .lang:first-child{
	border:none;
}
.info img{
	margin-top:7px;
	width:48%;
	/* background-color:red; */
	float:left;
}
.head{
	width:100%;
	height:180px;
	border-bottom:solid 1px #3c3c3c;
}
.head img{
	margin-top:20px;
	width:60%;
}

.icons{
	font-family: 'typicons';
	font-size:2em;
	padding-right:5px;
	font-weight:50;
	padding-left:20px;
}
.icons:first-child{
	padding-left:0px;
}
.mail:before{
	content: '\e0a5';
}
.phone:before { 
  content: '\e05b';
} 
.fb:before { 
  content: '\e0e5';
  font-size:1.5em;
} 
.yt:before { 
  content: '\e0fd';
    font-size:1.5em;
	margin-left:2%;
}
 
/* ------- */

.contactfull{
	background-color:#0d87d7;
	width:100%;
	padding-top:2%;
	padding-bottom:1%;
}

/* ----- */
.card{
	/* border:solid 1px rgba(0,0,0,0.1); */
	border-top:solid 4px #0d87d7;
	margin-left:6%;
	width:20%;
	padding-bottom:2%;
	float:left;
	overflow: hidden;
}
.card:first-child{
	margin-left:0%;
}
.cards{
	border:solid 1px rgba(0,0,0,0.1);
	margin:1%;
	width:30%;
	padding-bottom:2%;
	float:left;
}
.small{
	width:23%;
}
.cards img{
	padding: 0% 0% 0% 0%;
	width:100%;
}
.cardcontent{
	text-align:center;
	background-color:rgba(0,0,0,0.02);
	padding-top:20px;
	/* padding-bottom:20px; */
	color:	#6f7072;
	min-height:150px;
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.cardcontent h3{
	font-size:1.3em;
	line-height:1.2em;
	padding-bottom:10px;
}
.cardcontentlinie{
	width:60%;
	margin:0 auto;
	margin-top:1%;
	margin-bottom:1%;
	border-bottom:solid 0.5px;
	border-color:rgba(0,0,0,0.08);
}
.buttoncard{
	margin-top:20px;
	padding:10px;
	width:60%;
}
.buttoncardimbild{
	position:absolute;
	margin-top:8%;
	cursor:pointer;
	z-index:200;
}
.linkimbild{
	background-color:rgba(13,135,215,0.9);
	color:#dcdcdc;
	float:left;
	padding-left:6%;
	padding-top:3%;
	padding-bottom:3%;
	width:130px;
	min-height:45px;
}
.go{
	color:#dcdcdc;
	background-color:rgba(60,60,60,0.9);
	float:left;
	padding-top:10px;
	padding-bottom:3%;
	width:40px;
	text-align:center;
	cursor:pointer;
	min-height:45px;
}
.card img{
 max-width: 100%;
  	overflow: hidden;
  -moz-transition: all 0.6s;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
.card:hover img{
	cursor:pointer;
	-moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.card:hover .go{
	background-color:rgba(13,135,215,0.9);
	transition: ease-out 0.8s;
}
.card:hover .linkimbild{
	background-color:rgba(60,60,60,0.9);
	transition: ease-out 0.8s;
}
/* --- */
/* 
grau: # 3c3c3c
weiß: # dcdcdc 
blau: # 0d87d7
*/
/* Produktübersicht */

.downloadcard{
	/* border:solid 1px rgba(0,0,0,0.1); */
	margin-left:6%;
	width:80%;
	padding-bottom:2%;
	float:left;
	overflow: hidden;
	background-color:rgba(0,0,0,0.04);
	cursor:pointer;
	border:solid 1px rgba(13,135,215,0.1);
	-webkit-filter: grayscale(80%); /* Safari 6.0 - 9.0 */
    filter: grayscale(80%);
	color:#0d87d7;
}
.downloadcard:hover, .downloadcard:focus{
	-webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
	border:solid 1px rgba(13,135,215,0.9);
	transition:ease-out 0.6s;
}
.downloadcardcontent{
	/* background-color:red; */
	width:80%;
	margin:0 auto;
}
.downloadcardcontent p{
	text-align:center;
	margin-top:5px;
	margin-bottom:15px;
/* 	margin-left:20px;
	margin-right:5px; */
}
.downloadcard img{
	width:50%;
	margin-top:5%;
	margin-left:25%;
}
.map{
	/* width:60%; */
}

.siteinfo{
	border:solid 1px rgba(13,135,215,0.3);
	width:100%;
	padding:6% 4%;
}
.siteinfo img{
	width:80%;
	margin-left:10%;
}
footer{
	margin-top:5%;
	padding-top:4%;
	padding-bottom:4%;
	background-color:#3c3c3c;
	color:#dcdcdc;
}
footer img{
	/* background-color:red; */
	width:80%;
	margin:0 auto;
}
footer .social img{
	/* float:left; */
	/* background-color:green; */
	width:40;
	margin-top:12%;
	/* margin:2%; */
}

@media screen and (max-width: 1350px) {
.head{
	height:120px;
}
}

@media screen and (max-width: 1100px) {
.card, .small, .cards{
	width:40%;
}
.card:first-child{
	margin-left:6%;
}
.buttoncardimbild{
	margin-top:16%;
}
}
@media screen and (max-width: 1024px) {
.head a img{
	width:80%;
}
.head{
	height:140px;
}
}

@media screen and (max-width: 920px) {
.head a img{
	width:100%;
}
}
@media screen and (max-width: 770px) {
.info{
	height:100px;
	padding-top:8px;
}
.info img{
	margin-top:7px;
	width:10%;
	/* background-color:red; */
	float:left;
}
.head{
	height:140px;
}
.head a img{
	margin-top:20px;
	width:20%;
}
}
@media screen and (max-width: 580px) {
.head{
	height:120px;
}
.card, .small, .cards{
	width:80%;
}
.card:first-child{
	margin-left:6%;
}
.buttoncardimbild{
	margin-top:40%;
}
}
@media screen and (max-width: 500px) {
.head a img{
	margin-top:10px;
	width:40%;
	margin-left:20%;
}
.head{
	height:140px;
}
}