﻿@charset "utf-8";
/* CSS Document */
.unsichtbar {
	display: none;
}
.stopFloat {
	display: block;
	float: none;
	clear: both;
	height: 0px;
	font-size: 0px;
	line-height: 0px;
	border: 0;
	margin: 0;
	padding: 0;
}
p {
	font-size: 1rem;
}
ul li {
	color: #444;
}
a:link, a:visited, a:active {
    color: #0c6ea6;
    text-decoration: underline;
}
a:hover, a:focus {
	color: #36c;
	text-decoration: underline;
}
abbr, acronym {
	cursor: help;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
}
#content img.grafik-skaliert {
	width: 100%;
	height: auto;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
}

#content {
	background: #e2e3e5 url("../images/background.jpg") no-repeat scroll center top;
}
#content p, #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
	margin-right: 15px;
	max-width: 688px;
	line-height: normal;
	color: #444;
}
#content ul li, #content ol li {
	margin-right: 15px;
	max-width: 648px;
}
#content ul.ohnelistenpunkt {
	list-style-type: none;	
}
a.pdf-download {
    background: rgba(0, 0, 0, 0) url("../images/icon-pdf-download.gif") no-repeat scroll 2px center;
    padding: 0 0 0 20px;
} 
.header-image {
	position: relative;
	margin-bottom: 3.5em;
	/* wenn Grafik nur so breit wie Text sein soll */
	max-width: 688px;
	margin-right: 15px;
}
header-image img {
	display: block;
}
.header-image h1.in_grafik {
	position: absolute;
	bottom: 0;
	left: 1px;
}
.header-image h1.in_grafik span {
	font-size: 1.8rem;
	font-weight: bold;
}
.header-image h1.in_grafik a {
	background: #efefef none repeat scroll 0 0;
	font-weight: lighter;
	text-decoration: none;
	opacity: 0.75;
	padding-right: 0.5em;
	padding-left: 0.8em;
	padding-top: 3px;
	padding-bottom: 3px;
}
#content h1 a, #contentt h2 a {
    color: #333;
    text-decoration: none;
}
.header-image hr {
	position: relative;
	background-color: #0c6ea6;
	border: none;
	height: 4px;
	margin: -20px 1px 0;
	padding: 0;
	display: block;
	/* wenn Grafik so breit wie Text sein soll */
	max-width: 688px;/**/
}
.grossbuchstaben {
	text-transform: uppercase;
}

/* ueber gesamte breite */
aside {
	margin: 1.5em 15px;
	padding-right: 15px;
	padding-left: 15px;
}

@media screen and (max-width: 959px) { /* kleiner 799 Pixel */
	#content {
		/*background: #FcC;*/
		padding-left: 15px;	
	}
	.header-image {
		max-width: none;
		margin-right: 0;
	}
	.header-image hr {
		max-width: none;
	}
}

@media screen and (max-width: 481px) {
	.header-image h1.in_grafik {
		font-size: 1.3rem;
	}
	.header-image h1.in_grafik span {
		font-size: 1.4rem;
	}
}

#footer {
	color: #444;
	border-top: 1px solid #ccc;
}
#footer p {
	text-align: center;
	font-size: 0.9rem;
}
#footer p a.footerlink2 {
    color: #444;
    cursor: text;
    text-decoration: none;
}

/* Anfang Startseite */
body.startseite #content {
	background: #e2e3e5 url(../none) no-repeat scroll center top;
}
body.startseite #content p, body.startseite #content h1, body.startseite #content h2, body.startseite #content h3, body.startseite #content h4, body.startseite #content h5, body.startseite #content h6 {
	margin-right: 0;
	margin-left: 0;
	padding-right: 0;
	padding-left: 0;
	/*background: #6CC;*/
}

.startseite-oben {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	margin-top: 0;
	margin-bottom: 0.5em;/**/
	width: 100%;
}
.startseite-image {
	-ms-flex: 1;
	-webkit-flex: 1;
	flex: 1;
	padding: 0;
}
.startseite-image img {
	border: 2px solid #fff;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2), -3px 3px 5px rgba(0, 0, 0, 0.2);
}
.startseite-siemens {
	-ms-flex: 1;
	-webkit-flex: 1;
	flex: 1;
	padding: 0.5em 0.5em 0.5em 4.5em;
	margin: 0 1em 0 0;
	font-size: 0.9em;
}
.startseite-siemens img {
	margin: 0;
	padding: 0;
}
.startseite-siemens div.produkteinsatz {
	font-size: 1em;
	text-transform: uppercase;
	background: url(../images/siemens-logo.png) no-repeat scroll left bottom;
	min-height: 1em;
	padding: 2px 0 30px;
	margin-bottom: 0.4em;
}
.startseite-siemens h3, .startseite-siemens h1 {
	font-size: 1.1rem;
	font-weight: bolder;	
}
@media screen and (max-width: 651px) {
	.startseite-oben {
		display: block;
		margin: 0;
	}
	.startseite-image {
		margin: 1em 0 0;
		padding: 0;
	}
	.startseite-siemens {
		margin: 0;
		padding: 0;
		width: 100%;
	}
	.startseite-siemens p, .startseite-siemens h4, .startseite-siemens h3, .startseite-siemens h1 {
		margin-right: 0 !important;
		margin-left: 0 !important;
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
}
@media screen and (max-width: 481px) {
	.startseite-image img {
		border: 0;
		box-shadow: none;
	}
}

/* ueber gesamte breite */
#aside {
	margin-top: 0;
	margin-bottom: 1.5em;
	max-width: 75em;
}
.start_spalte1, .start_spalte2 {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
		-ms-flex-pack: distribute;
		-webkit-justify-content: space-around;
	justify-content: space-around; /* richtet Flexboxen in der Breite verteilt aus */
		-ms-flex-align: end;
		-webkit-flex-align: flex-end;
	align-items: flex-end; /* richtet Flexboxen in der Hoehe unten aus */
	color: #444;
}
.start_spalte1 strong, .start_spalte2 strong {
	font-size: 1.1rem;	
}
.dose, .stempel {
	width: 48%;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: center;
	justify-content: center;
}
/*.dose {background: #6C6;}
.stempel {background: #6CC;}*/
.dose p, .stempel p {
	max-width: 17em;
	margin-left: 0.5em;
}
.temperatur, .zertifikat {
	width: 52%;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	justify-content: center;
	padding-right: 1em;
}
/*.temperatur {background: #0C6;}
.zertifikat {background: #0CF;}*/
.temperatur p, .zertifikat p {
	max-width: 9em;
	margin-top: auto;
	margin-bottom: 1.5em;
	padding-right: 0.5em;
	font-family: Georgia,"Times New Roman",Times,serif;
}
.temperatur p.startseitenlink a, .zertifikat p.startseitenlink a {
	max-width: 7.5em;
	border-left: 5px solid #0c6ea6;
	padding-left: 1em;
	display: block;
	text-transform: uppercase;
	text-decoration: none;
	font-family: sans-serif, georgia, helvetica;
}
.temperatur p span, .zertifikat p span {
	display: none;
}
@media only screen and (max-width: 859px) { /* Link entfernen */
	.dose, .stempel {
		width: 60%;
	}
	.temperatur, .zertifikat {
		width: 40%;
	}
	.temperatur p.startseitenlink a, .zertifikat p.startseitenlink a {
		display: none;
	}
	.temperatur p span, .zertifikat p span {
		display: block;
		margin-top: 1em;
	}
	.temperatur p span a, .zertifikat p span a {
		text-transform: uppercase;
		/*text-decoration: none;*/
		font-family: sans-serif, georgia, helvetica;
		font-weight: 600;
	}
}

@media only screen and (max-width: 690px) {
	.start_spalte1, .start_spalte2 {
		-ms-flex-direction: column;
		flex-direction: column; /* Zeilenumbruch */
		-ms-flex-pack: justify;
		justify-content: space-around;
		margin-right: 1em;
	}
	.dose, .stempel {
		width: 100%;
	}
	.dose p, .stempel p {
		margin-left: 0;
	}
	.temperatur, .zertifikat {
		width: 100%;
		margin-right: auto;
		margin-left: auto;
		padding-right: 0;
	}
	.temperatur p.startseitenlink a, .zertifikat p.startseitenlink a {
		display: block;
	}
	.temperatur p span, .zertifikat p span {
		margin-top: 0;
		display: none;
	}
}
@media only screen and (max-width: 480px) { /* Link entfernen */
	.temperatur, .zertifikat {
		padding-right: 0;
		width: 100%;
	}
	.temperatur p, .zertifikat p {
		width: -moz-calc(100% - 15px);
		width: -webkit-calc(100% - 15px);
		width: -khtml-calc(100% - 15px);
		width: -o-calc(100% - 15px);
		width: calc(100% - 15px);
		padding-left: 15px;
	}
	.temperatur p.startseitenlink a, .zertifikat p.startseitenlink a {
		display: none;
	}
	.temperatur p span, .zertifikat p span {
		display: block;
		margin-top: 1em;
	}
	.silbentrennung	{
		/* Silbentrennung */
		-moz-hyphens: auto;
		-o-hyphens: auto;
		-webkit-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}
}

/* Ende Startseite */

/* Anfang Spezial in den Seiten */
.rahmen2 {
	max-width: 41em;
    border: 1px solid #aaa;
    margin: 2px 0;
    padding: 0 1em;
}
@media screen and (max-width: 481px) {
	.rahmen2 {
		margin: 1em;
		padding: 0 0.5em;
	}
}
.rahmen2 {
	max-width: 41em;
    border: 1px solid #aaa;
    margin: 2px 0;
    padding: 0 1em;
}
@media screen and (max-width: 481px) {
	.rahmen2 {
		margin: 1em;
		padding: 0 0.5em;
	}
}
.grau {
	color: #999 !important;
}
.rot {
	color: #f00 !important;
}
/* Responsive Tabelle */
caption {
	font-size: 1.1em;
	font-weight: bold;	
}
table.tabelle-weiss {
	width: 100%;
	max-width: 688px;
	border-collapse: collapse;
	font-size: 0.9em;
}
/* Zebra-Streifen */
/*tr:nth-of-type(odd) { 
    background: #f2f2f2;
}*/
.tabelle-weiss th {
	background: #efefef;
	color: #000;
	font-weight: 600;
}
.tabelle-weiss td, .tabelle-weiss th {
	padding: 8px 4px;
	border: 1px solid #aaa;
	text-align: center;
	word-wrap: break-word;
}
/* Mobile Tabelle */
@media only screen and (max-width: 959px) {
	table.tabelle-weiss {
		max-width: none;
		width: -moz-calc(100% - 2em);
		width: -webkit-calc(100% - 2em);
		width: -khtml-calc(100% - 2em);
		width: -o-calc(100% - 2em);
		width: calc(100% - 2em);
		margin-right: auto;
		margin-left: auto;
	}
    .tabelle-weiss td, .tabelle-weiss tr {
        display: block;
	}
	
	/* Tabellenueberschriften ausblenden */
	.tabelle-weiss thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	.tabelle-weiss tr {
        border: 1px solid #aaa;
    }
    .tabelle-weiss tr + tr {
        margin-top: 1.5em;
    }
	.tabelle-weiss td {
		border: none;
		border-bottom: 1px solid #ccc;
		position: relative;
		padding-left: 50%;
        background-color: #e2e2e5;
        text-align: left;
	}
	.tabelle-weiss td:before {
        content: attr(data-label) ":";
        display: inline-block;
        line-height: 1.5;
	    margin-left: -100%;
        width: 100%;
		white-space: nowrap;
		font-weight: bold;
	}
}
/* Tabelle 2 */
table.tabelle-weiss2 {
    width: 100%;
	max-width: 688px;
    border-collapse: collapse;
    margin: 0;
	font-size: 0.9em;
}
.tabelle-weiss2 td, .tabelle-weiss2 th {
	padding: 8px 4px;
	border: 1px solid #ccc;
	text-align: center;
	word-wrap: break-word;
}
@media only screen and (max-width: 959px) {
	table.tabelle-weiss2 {
		max-width: none;
		width: -moz-calc(100% - 2em);
		width: -webkit-calc(100% - 2em);
		width: -khtml-calc(100% - 2em);
		width: -o-calc(100% - 2em);
		width: calc(100% - 2em);
		margin-right: auto;
		margin-left: auto;
	}
}
/* Ende Responsive Tabelle */
/* Tabellenaehnliche Art */
.table3 {
	display: table;
	border: 1px solid silver;
	border-collapse: collapse;
	max-width: 690px;
	width: -moz-calc(100% - 0.5em);
	width: -webkit-calc(100% - 0.5em);
	width: -khtml-calc(100% - 0.5em);
	width: -o-calc(100% - 0.5em);
	width: calc(100% - 0.5em);
	margin-right: 0.5em;
}
.table3 .table-row {
	display: table-row;
	border: 1px solid silver;
}
.table3 .table-cell {
	display: table-cell;
	border: 1px solid silver;
	padding: 15px;
}

.table3 .thead {
	font-weight: bold;
	background: #eee;
}
 @media only screen and (max-width: 959px) {
	.table3 {
		border: none;
		max-width: none;
	}
	.table3 .table-row, .table3 .table-cell {
		display: block;
		border: 1px solid silver;
	}
	.table3 .table-row {
		margin-bottom: 20px;
	}
}
@media screen and (max-width: 481px) {
	.table3 {
		width: -moz-calc(100% - 2em);
		width: -webkit-calc(100% - 2em);
		width: -khtml-calc(100% - 2em);
		width: -o-calc(100% - 2em);
		width: calc(100% - 2em);
		margin-right: 1em;
		margin-left: 1em;
	}
}
/* Ende Tabellenaehnliche Art */

/* Video Produktinformationen */
#content .embed-container {
	position: relative; 
	padding-bottom: 56.25%; /* ratio 16x9 */
	height: 0; 
	overflow: hidden; 
	width: 100%;
	height: auto;
}
#content .embed-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 481px) {
	#content .embed-container video {
		width: -moz-calc(100% - 2em);
		width: -webkit-calc(100% - 2em);
		width: -khtml-calc(100% - 2em);
		width: -o-calc(100% - 2em);
		width: calc(100% - 2em);
		margin: 0 1em;
	}
}
/* Ende Video Produktinformationen */

/* iframe fuer Youtube Videos */
iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 730px) {
iframe {
	position: absolute;
	top: 0;
	left: 1em;
	width: -moz-calc(100% - 2em);
	width: -webkit-calc(100% - 2em);
	width: -khtml-calc(100% - 2em);
	width: -o-calc(100% - 2em);
	width: calc(100% - 2em);
	/*height: -moz-calc(100% - 1em);
	height: -webkit-calc(100% - 1em);
	height: -khtml-calc(100% - 1em);
	height: -o-calc(100% - 1em);
	height: calc(100% - 1em);*/
	height: 100%;
}
}
/* Ende iframe fuer Youtube Videos */

/* fuer Formulare */
#content form {
	margin: 0;
	padding: 0;
}
#content fieldset {
	max-width: 43em;
	margin: 20px 0 20px;
	padding: 0;
	border: 0;
}
#content legend {
	font-size: 1rem;
	font-weight: bold;
	color: #333;
	padding: 0;
}
#content label {
	display: block;
}
#content label[for="herr"], #content label[for="frau"], #content label[for="mr"], #content label[for="ms"], #content label[for="annahmedatenschutz"], #content label[for="widerrufsrecht"], #content label[for="agb"] {
	display: inline;	
}
#content input.form, #content textarea.form, #content select.form {
	width: 98%;
	font: 1rem sans-serif, georgia, helvetica;
	background: #efefef;
	color: #000;
	border: 1px solid #0c6ea6;
	padding: 4px 6px;
}
#content select.form {
	width: 100%;
}
#content input:focus, #content textarea:focus, #content select:focus, #content submit:focus {
	background: #e2e3e5;
	color: #000;
	border-color: #999;
}
#content span.pflichtfeld {
	display: block;
	font-size: 0.9rem;
	text-align: right;
	margin-right: 5px;
}
#content input.spamcheck {
	width: 5px;
	visibility: hidden;
}
#content .buttons {
	color: #444;
	font-size: 1.1rem;
	font-weight: 500;
	text-align: center;
	text-decoration: none;
	padding: 4px 15px;
	margin: 2px 1px 5px;
	border: 1px solid #dcdcdc;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background-color: #efefef; /* fuer alte Browser */
	background: -moz-linear-gradient(top,  #f5f5f5 0%, #f1f1f1 100%); /* fuer FF 3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#f1f1f1)); /* fuer Chrome, Safari 4+ */
	background: -webkit-linear-gradient(top,  #f5f5f5 0%,#f1f1f1 100%); /* fuer Chrome 10+, Safari 5.1+ */
	background: -o-linear-gradient(top,  #f5f5f5 0%,#f1f1f1 100%); /* fuer Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f5f5f5 0%,#f1f1f1 100%); /* fuer IE 10+ */
	background: linear-gradient(top,  #f5f5f5 0%,#f1f1f1 100%); /* fuer W3C */
	cursor: pointer;
	word-spacing: 1px;
}
#content .buttons:hover,
input[type="submit"]:focus, input[type="reset"]:focus {
	color: #000;
	background-color: #f5f5f5; /* fuer alte Browser */
	background: -moz-linear-gradient(top,  #f8f8f8 0%, #f1f1f1 100%); /* fuer FF 3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#f1f1f1)); /* fuer Chrome, Safari 4+ */
	background: -webkit-linear-gradient(top,  #f8f8f8 0%,#f1f1f1 100%); /* fuer Chrome 10+, Safari 5.1+ */
	background: -o-linear-gradient(top,  #f8f8f8 0%,#f1f1f1 100%); /* fuer Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f8f8f8 0%,#f1f1f1 100%); /* fuer IE 10+ */
	background: linear-gradient(top,  #f8f8f8 0%,#f1f1f1 100%); /* fuer W3C */
	border: 1px solid #c6c6c6;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);
}
#content .rahmen-fehler {
	background: #efefef;
	max-width: 40em;
	padding: 2px 1em;
	border: 1px solid #c40000;
}
.rot {
	color: #c40000 !important;
}
#content .formularlinks {}
#content .formularlinks_rot {
	/*box-shadow: 0 1px 2px #e8e8e8 inset, 0 0 3px #c40000;*/
	color: #c40000;
}

div.widerrufinfo {
	max-width: 43em;
	border: 1px solid #999;
	padding: 1em;
	font-size: 0.9rem;
	color: #666;
}
@media screen and (max-width: 481px) {
	#content .rahmen-fehler {
		background-color: #e2e3e5;
		border: none;
		padding: 0;
	}
	div.widerrufinfo {
		margin: 1em;
	}
}
/* Ende Formulare */