/*gilt für alle Boxen der Seite... jede box wird dann seperat definiert*/
* {
  padding: 0;
  margin: 0;
}
/*E-MAIL SPAMSCHUTZ*/
p.spamPro {
	unicode-bidi:bidi-override;
	direction:rtl;
}
span.spamPro:after {
	content:"\40";
}
#printLogo {
	display: none;
}

body {
  color: black;
  font-family: 'Open Sans', sans-serif;
  font-size: 1em;
  color: black;
  background: rgba(64,96,157,1);
}

header {
	/*Layout*/
	width: 100%;
	text-align:center;
	background: rgba(64,96,157,1);
	/*padding: 0 0 2em 0;						cube*/
	color: white;
}

#wrapper {
	/*Layout*/
	width: 100%;
	/*Style*/
	background: white;
	margin-top: -1.5em; 		/*cube*/
}

footer#mainFooter{
	/*Layout*/
	/*Style*/
	color:#000;
	font-size: 80%;
	text-align: center;
}

h2, h3, h4, h5 {
	margin-top: 2em;
	margin-bottom: 0.5em;
	color: rgba(64,96,157,1);
}
h2 {font-size: 150%;}
h3 {font-size: 130%;}
h4 {font-size: 120%;}
h5 {font-size: 110%;}

img {
	max-width:100%;
	height:auto;
	width: auto;
}
table
{
  border: 1px solid rgba(64,96,157,1);
  border-collapse: collapse;
  empty-cells: show;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
}
th
{
  color:rgba(64,96,157,1);
  background-color:rgba(186,198,220,1);
  font-weight:bold;
  text-align: center;
  padding: 2px 2px 2px 2px;
}
td
{
  border:1px solid rgba(64,96,157,1);
  padding: 2px 2px 2px 2px;
}
/*Beim Überfahren mit der Maus wird die Zeile markiert*/
tr:hover {
	background: rgba(245,247,250,1);
} 

ul li, ol li {
	margin-left: 2em;
}

a {
  text-decoration: none; 
  outline: none;  /*Unterstreichung entfernen...*/
  color: rgba(64,96,157,1);
}

a:link {
	color:rgba(64,96,157,1);
}

a:visited {
	content: " \2714"; /* Code als HEX einfuegen --> http://apps.timwhitlock.info/emoji/tables/unicode */
}

a:hover, a:focus {
  text-decoration: underline; 
  color: rgba(64,96,157,1);
}

a:active  {
  color: rgba(64,96,157,1); 
  background-color: rgba(186,198,220,1);
}
/*fügt Symbol für extere Links hinzu*/
a[href^="http"] {
  background: url(../images/stylesheet/externerLink7.gif) no-repeat right;
  padding-right: 16px;
}
a[href^="mailto:"]:after {
	content: " \1F4E7"; /* Code als HEX einfuegen --> http://apps.timwhitlock.info/emoji/tables/unicode */
}
a[href^="http://www.elektro-wissen.de"]:after, a[href^="http://elektro-wissen.de"]:after, a[href^="https://www.elektro-wissen.de"]:after, a[href^="https://elektro-wissen.de"]:after {
	content: " \1F4A1"; /* Code als HEX einfuegen --> http://apps.timwhitlock.info/emoji/tables/unicode */
}
a.enlarge:after {
	content: " \1F50E"; /* Code als HEX einfuegen --> http://apps.timwhitlock.info/emoji/tables/unicode */
}
/*Kein Symbol externer Link, wenn Link auf eigene Seite führt (bei Absoluter verlinkung nötig)*/
nav a[href^="https:"],
footer a[href^="https:"],
a[href^="https://www.elektro-wissen.de"],
a[href^="https://elektro-wissen.de"],
a[href^="https://www.elektrowissen.de"],
a[href^="https://elektrowissen.de"],
a[href^="https://www.elektro-lexikon.de"],
a[href^="https://elektro-lexikon.de"] {
  background-image: none;
  padding-right: 0;
}

.box {
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	-webkit-box-shadow: 3px 3px 10px 0 rgba(0,0,0,1);
	box-shadow: 3px 3px 10px 0 rgba(0,0,0,1);
	width: 80%;
	background: pink;
	margin: 1em auto;
	padding: 1em;
	display: block;
}
.bildmitte  img,  .bildlinks  img, .bildrechts  img{
	display: block;
	margin: 1em auto;
}
.bildmitte , .bildrechts, .bildlinks {
	font-size: 0.7em;
	text-align: center;
}
h2:nth-child(1) {
	margin-top: 1em;
}
ul.themen {
	color: rgba(64,96,157,1);
}
ul.themen li {
	margin-left: 3.5em;
}

@media only screen and (min-width:320px) {
	/* smartphones, iPhone, portrait 480x320 phones */

	#cubeBox {
	display: inline-block;
	-webkit-perspective:100px;
	-moz-perspective:100px;
	perspective:100px;
	width: 100px;
	height: 100px;
	margin: auto;
	display: inline-block;
	vertical-align: middle;
	}
	#cube div img {
		display: inline-block;
		width: 40px;
		height: 40px;
		border: 2px solid #fff;
		-webkit-border-radius: 35px 35px 35px 35px;
		border-radius: 35px 35px 35px 35px;
		margin: 2px auto;
	}
	#cube {
		position: absolute;
		top:50%;
		left:50%;
		width: 50px;
		height: 50px;
		margin: -25px 0 0 -25px;
		-webkit-transform-style: preserve-3d;
		-webkit-animation: rotieren 25s linear infinite;
		-ms-transform-style: preserve-3d;
		-ms-animation: rotieren 25s linear infinite;
		-moz-transform-style: preserve-3d;
		-moz-animation: rotieren 25s linear infinite;
		-o-transform-style: preserve-3d;
		-o-animation: rotieren 25s linear infinite;
		transform-style: preserve-3d;
		animation: rotieren 25s linear infinite;
	}
	#cube div {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		-webkit-transition: opacity .75s ease-in-out;
		-moz-transition: opacity .75s ease-in-out;
		-o-transition: opacity .75s ease-in-out;
		-ms-transition: opacity .75s ease-in-out;
		transition: opacity .75s ease-in-out;
		opacity: .95;
		background: rgb(186,198,220);
		background: -moz-radial-gradient(center, ellipse cover,  rgba(186,198,220,1) 0%, rgba(64,96,157,1) 100%);
		background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(186,198,220,1)), color-stop(100%,rgba(64,96,157,1)));
		background: -webkit-radial-gradient(center, ellipse cover,  rgba(186,198,220,1) 0%,rgba(64,96,157,1) 100%);
		background: -o-radial-gradient(center, ellipse cover,  rgba(186,198,220,1) 0%,rgba(64,96,157,1) 100%);
		background: -ms-radial-gradient(center, ellipse cover,  rgba(186,198,220,1) 0%,rgba(64,96,157,1) 100%);
		background: radial-gradient(ellipse at center,  rgba(186,198,220,1) 0%,rgba(64,96,157,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bac6dc', endColorstr='#40609d',GradientType=1 );
	}
	#cube div:hover {
		opacity: .2;
	}
	#cube div:nth-of-type(1) {
		-webkit-transform: translate3d(0,0,25px);
		-moz-transform: translate3d(0,0,25px);
		-o-transform: translate3d(0,0,25px);
		-ms-transform: translate3d(0,0,25px);
		transform: translate3d(0,0,25px);
	}
	#cube div:nth-of-type(2) {
		-webkit-transform: translate3d(0,0,-25px) rotateY(180deg);
		-moz-transform: translate3d(0,0,-25px) rotateY(180deg);
		-o-transform: translate3d(0,0,-25px) rotateY(180deg);
		-ms-transform: translate3d(0,0,-25px) rotateY(180deg);
		transform: translate3d(0,0,-25px) rotateY(180deg);
	}
	#cube div:nth-of-type(3) {
		-webkit-transform: translate3d(25px,0,0) rotateY(90deg);
		-moz-transform: translate3d(25px,0,0) rotateY(90deg);
		-o-transform: translate3d(25px,0,0) rotateY(90deg);
		-ms-transform: translate3d(25px,0,0) rotateY(90deg);
		transform: translate3d(25px,0,0) rotateY(90deg);
	}
	#cube div:nth-of-type(4) {
		-webkit-transform: translate3d(-25px,0,0) rotateY(-90deg);
		-moz-transform: translate3d(-25px,0,0) rotateY(-90deg);
		-o-transform: translate3d(-25px,0,0) rotateY(-90deg);
		-ms-transform: translate3d(-25px,0,0) rotateY(-90deg);
		transform: translate3d(-25px,0,0) rotateY(-90deg);
	}
	#cube div:nth-of-type(5) {
		-webkit-transform: translate3d(0,25px,0) rotateX(-90deg);
		-moz-transform: translate3d(0,25px,0) rotateX(-90deg);
		-o-transform: translate3d(0,25px,0) rotateX(-90deg);
		-ms-transform: translate3d(0,25px,0) rotateX(-90deg);
		transform: translate3d(0,25px,0) rotateX(-90deg);
	}
	#cube div:nth-of-type(6) {
		-webkit-transform: translate3d(0,-25px,0) rotateX(90deg);
		-moz-transform: translate3d(0,-25px,0) rotateX(90deg);
		-o-transform: translate3d(0,-25px,0) rotateX(90deg);
		-ms-transform: translate3d(0,-25px,0) rotateX(90deg);
		transform: translate3d(0,-25px,0) rotateX(90deg);
	}
	@-webkit-keyframes rotieren {
		from{ -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
		to{ -webkit-transform: rotateX(0deg) rotateY(360deg) rotateZ(0deg);}
	}
	@-moz-keyframes rotieren {
		from{ -moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
		to{ -moz-transform: rotateX(0deg) rotateY(360deg) rotateZ(0deg);}
	}
	@-o-keyframes rotieren {
		from{ -o-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
		to{ -o-transform: rotateX(0deg) rotateY(360deg) rotateZ(0deg);}
	}
	@-ms-keyframes rotieren {
		from{ -ms-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
		to{ -ms-transform: rotateX(0deg) rotateY(360deg) rotateZ(0deg);}
	}
	@keyframes rotieren {
		from{ transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
		to{ transform: rotateX(0deg) rotateY(360deg) rotateZ(0deg);}
	}
	
	#logo, #domain {
		display: inline-block;
		vertical-align: middle;
	}
	#logo {
		margin: 1.5em 0;
	}
	header h1 {
		font-size: 160%;
	}
	header img {
		display: inline-block;
		background: rgba(64,96,157,1);
		width: 50px;
		height: 50px;
		border: 2px solid rgba(255,255,255,1);
		-webkit-border-radius: 26px 26px 26px 26px;
		border-radius: 26px 26px 26px 26px;
		margin-right: 0.3em;
	}
	nav#navMain {
		height: auto;
		padding: 0.5em 5%;
		text-align: center;
	}
	
	nav#navMain ul li{
		display: inline;
		text-align: center;
		margin: 0;
		font-size: 80%;
		color: rgba(64,96,157,1);
	}
	nav#navMain ul li a {
		display: inline-block;
		text-decoration: none;
		width: 1.5em;
		height: 1.5em;
		vertical-align: middle;
	}
	nav#navMain ul li#activeLink a, nav#navMain ul li a:hover {
		color: #FFF;
		background: rgba(64,96,157,1);
		-webkit-border-radius: 0.8em 0.8em 0.8em 0.8em;
		border-radius: 0.8em 0.8em 0.8em 0.8em;
	}
	
	section#colTop {
		/*Layout*/
		width: auto;
		padding: 1em 5% 0 5%;
		/*Style*/
		text-align:center;
		overflow: hidden;
	}
	
	section#colLeft {
		/*Layout*/
		display: none;
	}
	
	section#colRight {
		/*Layout*/
		display: none;
	}
	
	section#content {
		/*Layout*/
		margin: 0;
		padding: 0 5%;
		overflow: hidden;
	}

	nav#breadcrumbNav {
		display:none;
	}

	section#content article {
		margin: 0 0 1em 0;
		padding: 0;
		line-height: 160%;
	}
	.TextAds {
		margin: 2em 0;
		display: block;
	}
	
	footer#mainFooter {	
		padding: 2em 5%;
		background: rgba(64,96,157,1);
		color: white;
		line-height: 160%;
	}
	
	footer#mainFooter  a {	
		color: white;
	}
	
	table {
		font-size: 0.8em;
	}

	.table-scrollable {
		width: 100%;
		overflow-y: auto;
		margin: 0 0 1em;
	}

	.table-scrollable::-webkit-scrollbar {
		-webkit-appearance: none;
		width: 14px;
		height: 14px;
	}

	.table-scrollable::-webkit-scrollbar-thumb {
		border-radius: 8px;
		border: 3px solid #fff;
		background-color: rgba(0, 0, 0, .3);
	}
	.bildmitte, .bildlinks, .bildrechts {
		display: block;
		margin: 1em auto;
	}
	
	.Suchergebnisse {
		width: 100%;
		overflow-y: auto;
		margin: 0 0 1em;
	}

	.Suchergebnisse::-webkit-scrollbar {
		-webkit-appearance: none;
		width: 14px;
		height: 14px;
	}

	.Suchergebnisse::-webkit-scrollbar-thumb {
		border-radius: 8px;
		border: 3px solid #fff;
		background-color: rgba(0, 0, 0, .3);
	}
}
@media only screen and (min-width:481px) {
	/* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
}

@media only screen and (min-width:641px) {
	/* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
	
	#cubeBox {
	-webkit-perspective:160px;
	-moz-perspective:160px;
	perspective:160px;
	width: 160px;
	height: 160px;
	}
	#cube div img {

		width: 70px;
		height: 70px;
	}
	#cube {
		width: 80px;
		height: 80px;
		margin: -40px 0 0 -40px;
	}
	#cube div:nth-of-type(1) {
		-webkit-transform: translate3d(0,0,40px);
		-moz-transform: translate3d(0,0,40px);
		-o-transform: translate3d(0,0,40px);
		-ms-transform: translate3d(0,0,40px);
		transform: translate3d(0,0,40px);
	}
	#cube div:nth-of-type(2) {
		-webkit-transform: translate3d(0,0,-40px) rotateY(180deg);
		-moz-transform: translate3d(0,0,-40px) rotateY(180deg);
		-o-transform: translate3d(0,0,-40px) rotateY(180deg);
		-ms-transform: translate3d(0,0,-40px) rotateY(180deg);
		transform: translate3d(0,0,-40px) rotateY(180deg);
	}
	#cube div:nth-of-type(3) {
		-webkit-transform: translate3d(40px,0,0) rotateY(90deg);
		-moz-transform: translate3d(40px,0,0) rotateY(90deg);
		-o-transform: translate3d(40px,0,0) rotateY(90deg);
		-ms-transform: translate3d(40px,0,0) rotateY(90deg);
		transform: translate3d(40px,0,0) rotateY(90deg);
	}
	#cube div:nth-of-type(4) {
		-webkit-transform: translate3d(-40px,0,0) rotateY(-90deg);
		-moz-transform: translate3d(-40px,0,0) rotateY(-90deg);
		-o-transform: translate3d(-40px,0,0) rotateY(-90deg);
		-ms-transform: translate3d(-40px,0,0) rotateY(-90deg);
		transform: translate3d(-40px,0,0) rotateY(-90deg);
	}
	#cube div:nth-of-type(5) {
		-webkit-transform: translate3d(0,40px,0) rotateX(-90deg);
		-moz-transform: translate3d(0,40px,0) rotateX(-90deg);
		-o-transform: translate3d(0,40px,0) rotateX(-90deg);
		-ms-transform: translate3d(0,40px,0) rotateX(-90deg);
		transform: translate3d(0,40px,0) rotateX(-90deg);
	}
	#cube div:nth-of-type(6) {
		-webkit-transform: translate3d(0,-40px,0) rotateX(90deg);
		-moz-transform: translate3d(0,-40px,0) rotateX(90deg);
		-o-transform: translate3d(0,-40px,0) rotateX(90deg);
		-ms-transform: translate3d(0,-40px,0) rotateX(90deg);
		transform: translate3d(0,-40px,0) rotateX(90deg);
	}

	header h1 {
		font-size: 200%;
	}
	header img{
		width: 75px;
		height: 75px;
		-webkit-border-radius: 38px 38px 38px 38px;
		border-radius: 38px 38px 38px 38px;
	}
	
	nav#navMain ul li{
		font-size: 1em;
	}

	nav#navMain ul li a {
		width: 2em;
		height:1.5em;
		text-align:center;
		padding: 0.25em 0;
	}
	nav#navMain ul li#activeLink a, nav#navMain ul li a:hover {
		-webkit-border-radius: 1em 1em 1em 1em;
		border-radius: 1em 1em 1em 1em;
	}	
}

@media only screen and (min-width:961px) {
	/* tablet, landscape iPad, lo-res laptops ands desktops */
	
	section#colTop {
		/*Layout*/
		display: none;
	}
	
	section#colLeft {
		/*Layout*/
		float:left;
		min-width:160px;
		max-width:180px;
		min-height: auto;
		height: auto;
		display: inline-block;
		padding: 0;
		text-align: center;
		margin: 1.5em 10px;
	}
	
	nav#navMain {
		padding: 0.5em 2em;
	}
	
	section#content {
		padding: 0 2em;
		min-height: 650px;
	}
	.bildlinks {
		float: left;
		margin: 1em;
	}
	.bildrechts {
		float: right;
		margin: 1em;
	}
}
@media only screen and (min-width:1025px) {
	/* big landscape tablets, laptops, and desktops */
	
	section#colLeft {
		margin: 0 10px;
	}
	section#colRight {
		/*Layout*/
		float: right;
		min-width:160px;
		max-width:180px;
		max-height: auto;
		height: auto;
		display: inline-block;
		padding: 0;
		text-align: center;
		margin: 0 10px;
	}
	nav#breadcrumbNav {
		display: none;
	}
	header h1 {
		font-size: 300%;
	}
	section#content{
		margin-bottom: 1em;
		border: 1px solid rgba(64,96,157,1);
		-webkit-border-radius: 10px 10px 10px 10px;
		border-radius: 10px 10px 10px 10px;
	}
}

@media only screen and (min-width:1281px) {
	/* hi-res laptops and desktops */
	/*Layout*/
	#wrapper {
		/*Layout*/
		width: 75%;
		margin: 0 auto;
		/*Style*/
		border: 1px solid rgba(64,96,157,1);
		-webkit-border-radius: 10px 10px 10px 10px;
		border-radius: 10px 10px 10px 10px;
		background: #fff;
	}
	header {
		/*padding: 2em 0; cube*/
		-webkit-border-radius: 10px 10px 0px 0px;
		border-radius: 10px 10px 0px 0px;
	}
	footer#mainFooter{
		/*Layout*/
		clear:both;
		-webkit-border-radius: 0px 0px 10px 10px;
		border-radius: 0px 0px 10px 10px;
	}
	body {
		background: #fff;
	}
}