﻿/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('../fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/roboto-v20-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('../fonts/roboto-v20-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v20-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v20-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v20-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v20-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-900 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/roboto-v20-latin-900.eot'); /* IE9 Compat Modes */
  src: local('Roboto Black'), local('Roboto-Black'),
       url('../fonts/roboto-v20-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v20-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v20-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v20-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v20-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}



html, body		{background:#FFFFFF;margin:0px;padding:0px;color:#000000;}


h1				{margin:-60px 0 0 0;height:60px;color:#333333;font-family:'Roboto',sans-serif;font-size:0.5em;}
h2				{margin:36px 12px 12px 12px;color:#ED6D00;font-family:'Roboto',sans-serif;font-size:2em;font-weight:700;}
h3				{margin:12px 12px 12px 12px;color:#000000;font-size:1.5em;font-family:'Roboto',sans-serif;font-weight:700;}
h4				{margin:12px 12px 12px 12px;color:#ED6D00;font-size:1.25em;font-family:'Roboto',sans-serif;font-weight:700;}
h5				{margin:24px 12px;color:#000000;font-size:1em;font-family:'Open Sans',sans-serif;font-weight:bold;}
h6				{margin:-12px 12px 24px 12px;color:#000000;font-size:1em;font-family:'Open Sans',sans-serif;font-weight:bold;}

p				{font-size:1em;margin:24px 12px;line-height:1.5em;color:#333333;font-family:'Open Sans',sans-serif;font-weight:normal;-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
table			{font-size:1em;margin:24px 12px;line-height:1.5em;color:#333333;font-family:'Open Sans',sans-serif;font-weight:normal;border-collapse:collapse;width:100%;}

th				{text-align:left;padding:4px 12px 4px 0px;width:40%;vertical-align:top;}
td				{text-align:left;padding:4px 12px 4px 0px;width:60%;}


.explain		{font-size:0.9em;line-height:1.5em;} 
.marginal		{font-size:0.75em;line-height:1.5em;}
.footbox		{font-size:0.85em;margin:12px 12px;line-height:1.5em;color:#FFFFFF;}
.headbox		{font-size:0.85em;margin:0 12px 0 0;}
.subtext		{margin:6px 12px 24px 12px;font-size:0.9em;line-height:1em;}

img				{margin:0;border:none;}
video			{margin:auto;border:none;}

a				{color:#000000;text-decoration:underline;}
a:focus,
a:hover,
a:active		{color:#ED6D00;text-decoration:underline;}

.footbox a		{color:#FFFFFF;text-decoration:underline;}
.footbox a:focus,
a:hover,
a:active		{color:#ED6D00;text-decoration:underline;}

.rightside		{text-align:center;}
.centertop		{text-align:center;color:#484848;font-family:'Bree Serif',serif;font-size:1.25em;line-height:1.25em;font-weight:bold;letter-spacing:0.15em;-moz-hyphens:none;-o-hyphens:none;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;}
.leftside		{display:none;}

figcaption		{font-size:0.75em;margin:12px 12px;line-height:1.5em;color:#333333;font-family:'Open Sans',sans-serif;font-weight:normal;-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}

ul,ol			{font-size:1em;margin:24px 12px;line-height:1.5em;color:#333333;font-family:'Open Sans',sans-serif;font-weight:normal;-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
.decide			{list-style:none;}
.decide li		{margin:0px -12px;}


header			{margin:0 auto;padding:12px 0;width:96%;max-width:1260px;}
footer			{margin:0 auto;padding:24px 0;width:96%;max-width:1260px;}
.boxblaster		{margin:0 auto;padding:12px 0;width:96%;max-width:1260px;}
.footwrapper	{margin:0;padding:0;width:100%;background:#333333;}
.newswrapper	{margin:0;padding:0;width:100%;background:#FFA613;}
.topwrapper		{margin:0;padding:0;width:100%;background:#FFFFFF;}
.keywrapper		{margin:0;padding:0;width:100%;background:#CCCCCC;height:25vw;overflow:hidden;display:block;position:relative;}
.darkwrapper	{margin:0;padding:0;width:100%;background:#181818;}
.alertwrapper	{margin:0;padding:0;width:100%;height:30vw;overflow:hidden;background:#ED6D00;display:block;}
.alertwrapper p	{color:#000000;}
.newswrapper h2	{margin:12px 12px 12px 12px;color:#FFFFFF;}
.newswrapper h4	{color:#000000;}
.newswrapper a	{color:#000000;text-decoration:none;}
.keywrapper h2	{color:#FFFFFF;font-size:4em;line-height:1.25em;text-shadow:2px 2px 6px #000000;}

.duktuslogo		{width:192px;height:48px;margin:6px 0;}
.esglogo		{width:56px;height:36px;margin:6px 0;}
.werbelandlogo	{width:82px;height:48px;margin:0 12px 0 0;}
.icon			{margin:0;width:32px !important;height:32px !important;}
.keyvisual		{width:100%;margin:0;}

.menu_expand	{display:block;width:60px;height:60px;margin:0 auto;}
.menu_collapse	{display:block;width:60px;height:60px;margin:0 auto;}


nav				{margin:24px 0 12px 0;padding:0;width:100%;display:none;}
nav ul				{margin:8px 6px 8px 6px;padding:0;list-style:none;}
nav li				{padding:0;margin:0;font-size:1em;font-family:'Roboto',sans-serif;font-weight:700;float:none;position:static;text-decoration:none;}
nav span			{color:#333333;text-decoration:none;padding:0.5em 8px;display:block;}
nav a				{color:#333333;text-decoration:none;padding:0.5em 8px;display:block;}
nav a:focus,
nav a:hover,
nav a:active		{color:#ED6D00;text-decoration:none;}

nav ul ul			{margin:0;padding:0 0 0.25em 0;position:static;}
nav ul ul li		{float:none;text-decoration:none;}
nav ul ul a			{padding:0.5em 8px;text-decoration:none;}

nav ul ul a::before	{content: '→';padding-right:0.5em;}

nav:target	{display:block;}

.tophopper 			{position:fixed;bottom:0;width:100%}
.tophopper a		{display:block;width:60px;height:60px;margin:6px auto;}


@media (min-width: 768px) {
	.menu_expand	{display:none;}
	.menu_collapse	{display:none;}
	
	nav				{margin:0px 0 0px 0;padding:0;width:100%;background:#333333;height:40px;display:block;}
	nav ul				{margin:0 auto;padding:0;list-style:none;width:96%;max-width:1260px;background:#333333;}
	nav li				{padding:0;margin:0;font-size:1em;font-family:'Roboto',sans-serif;font-weight:700;float:left;position:relative;text-decoration:none;background:#333333;}
	nav li:first-child	{padding-left:6px;}
	nav span			{color:#FFFFFF;text-decoration:none;padding:0.5em 8px;display:block;}
	nav a				{color:#FFFFFF;text-decoration:none;padding:0.5em 8px;display:block;}
	nav a:focus,
	nav a:hover,
	nav a:active		{color:#ED6D00;text-decoration:none;}
	
	nav ul ul			{margin:0;padding:0 0 0.5em 0;position:absolute;left:0px;top:-50em;background:#333333;box-shadow:2px 4px 6px 0px #000000;z-index:99;width:auto;}
	nav ul ul li		{float:left;text-decoration:none;white-space:nowrap;width:auto;}
	nav ul ul li:first-child	{padding-left:0px;}
	nav ul ul a			{padding:0.25em 8px;text-decoration:none;}
	
	nav ul ul a::before	{content: '→';padding-right:0.5em;}
	
	nav ul li:hover > ul	{left:0px;top:2.25em}
	
	.keywrapper		{height:10vw;display:block;}
	
	.rightside		{text-align:right;}
	.centertop		{font-size:2.25em;}
	.leftside		{display:inline;}
	
	.festkleben {
        position: fixed;
        top: 0;
        width: 100%;
    }

}


.positive			{color:#009900;font-weight:bold;}
.negative			{color:#990000;font-weight:bold;}


.contentwrapper		{margin:0 auto;padding:0;width:96%;max-width:1260px;}

.contentbox1		{margin:0;padding:0;width:100%;float:left;}
.contentbox1 img	{margin:0 0 -24px 12px;width:92%;max-width:1236px;}
.contentbox2		{margin:0;padding:0;width:100%;float:left;}
.contentbox2 img	{margin:0 0 0 12px;width:92%;max-width:606px;}
.contentbox3		{margin:0;padding:0;width:100%;float:left;}
.contentbox3 img	{margin:0 0 0 12px;width:92%;max-width:606px;}
.contentbox3a		{margin:0;padding:0;width:100%;float:right;}

.contentbox4		{margin:0;padding:0;width:100%;float:left;}
.contentbox4 img	{margin:0 0 0 12px;width:92%;max-width:606px;}

.detail			{display:none;}
.detailimg		{display:none;}
.popwin			{display:none;}
.popwin img		{display:none;}


@media (min-width: 575px) {
	.keywrapper		{height:15vw;display:block;}

	.contentbox1		{margin:0;padding:0;width:100%;float:left;}
	.contentbox1 img	{margin:0 0 -24px 12px;width:98%;max-width:1236px;}
	.contentbox2		{margin:0;padding:0;width:50%;min-width:315px;float:left;}
	.contentbox2 img	{margin:0 0 0 12px;width:96%;max-width:606px;}
	.contentbox3		{margin:0;padding:0;width:33%;min-width:210px;float:left;}
	.contentbox3 img	{margin:0 0 0 12px;width:96%;max-width:396px;}
	.contentbox3a		{margin:0;padding:0;width:33%;min-width:210px;float:right;}
	
	.contentbox4		{margin:0;padding:0;width:25%;min-width:157px;float:left;}
	.contentbox4 img	{margin:0 0 -24px 12px;width:96%;max-width:290px;}
	
	.detail			{text-align:right;margin:-28px 12px 0px 0px !important;display:block;}
	.detailimg		{width:24px;height:24px;max-width:24px !important;visibility:visible;display:inline;}
	.popwin			{position:absolute;visibility:hidden;display:inline;}
	.popwin img		{border:12px solid #FFFFFF;box-shadow:4px 4px 8px 2px #000000;display:inline;}
	
	.festkleben {
        position: fixed;
        top: 0;
        width: 100%;
    }


}



.clearfix			{clear:both;}

a.blocko		{display:block;text-decoration:none;margin:-12px 0 0 0;}
a.blocko img	{margin:0px;width:100%;}

a.headline		{color:#ED6D00;text-decoration:none;}



.farbtabelle	{width:98%;max-width:1236px;font-size:0.75em;}
.farben			{text-align:center;padding:6px 1px 6px 1px;width:12.5%;border:4px solid #cccccc;background:#cccccc;font-weight:bold;}
@media (min-width: 768px) {
.farbtabelle	{width:98%;max-width:1236px;font-size:1em;}
.farben			{text-align:center;padding:6px 1px 6px 1px;width:12.5%;border:6px solid #cccccc;background:#cccccc;font-weight:bold;}

}
@media (min-width: 575px) {
.farbtabelle	{width:98%;max-width:1236px;font-size:0.9em;}
.farben			{text-align:center;padding:6px 1px 6px 1px;width:12.5%;border:5px solid #cccccc;background:#cccccc;font-weight:bold;}

}


.bubblebox1				{background:#FFFFFF;margin:12px 12px;padding:12px 0;box-shadow:4px 4px 8px 4px #999999;}
.bubblebox1 h4			{background:#FFA613;margin:0 12px;padding:12px;color:#000000;}
.bubblebox1 ul			{background:#FFA613;margin:0 12px;color:#000000;padding-right:12px;}
.bubblebox1 p			{background:#FFA613;margin:0 12px;padding:12px;color:#000000;}
.bubblebox2				{background:#FFFFFF;margin:12px 12px;padding:12px 0;box-shadow:4px 4px 8px 4px #999999;}
.bubblebox2 h4			{background:#CDCE00;margin:0 12px;padding:12px;color:#000000;}
.bubblebox2 ul			{background:#CDCE00;margin:0 12px;color:#000000;padding-right:12px;}
.bubblebox2 p			{background:#CDCE00;margin:0 12px;color:#000000;}
.bubblebox3				{background:#FFFFFF;margin:12px 12px;padding:12px 0;box-shadow:4px 4px 8px 4px #999999;}
.bubblebox3 h4			{background:#CDCE00;margin:0 12px;padding:12px;color:#000000;}
.bubblebox3 ul			{background:#CDCE00;margin:0 12px;color:#000000;padding-right:12px;}
.bubblebox3 p			{background:#CDCE00;margin:0 12px;color:#000000;}





label			{font-weight:bold;}


input[type=text]		{font-size:1em;margin:0px;border:1px #ED6D00 solid;border-radius:0.25em;line-height:1.5em;color:#333333;font-family:'Open Sans',sans-serif;font-weight:normal;width:96%;}
textarea 				{font-size:1em;margin:0px;border:1px #ED6D00 solid;border-radius:0.25em;line-height:1.5em;color:#333333;font-family:'Open Sans',sans-serif;font-weight:normal;width:96%;height:6em;resize:none;}

button						{background:#ED6D00;color:#000000;border:1px #ED6D00 solid;border-radius:0.25em;padding: .2em 1.5em;font-size:1em;margin:0px;line-height:1.5em;font-family:'Open Sans',sans-serif;font-weight:bold;}
button:hover,button:focus	{background:#ED6D00;color:#000000;border:1px #000000 solid;cursor:pointer;}
button:active				{background:#ED6D00;color:#FFFFFF;border:1px #FFFFFF solid;cursor:pointer;}

.nlbut						{background:#ED6D00;color:#000000;border:1px #ED6D00 solid;border-radius:0.25em;padding: .2em 1.5em;font-size:1em;margin:0px;line-height:1.5em;font-family:'Open Sans',sans-serif;font-weight:bold;}
.nlbut:hover,.nlbut:focus	{background:#ED6D00;color:#000000;border:1px #000000 solid;cursor:pointer;}
.nlbut:active				{background:#ED6D00;color:#FFFFFF;border:1px #FFFFFF solid;cursor:pointer;}

input[type=checkbox]:not(old),
input[type=radio   ]:not(old){
  width     : 2em;
  margin    : 0;
  padding   : 0;
  font-size : 1em;
  opacity   : 0;
}

input[type=checkbox]:not(old) + label,
input[type=radio   ]:not(old) + label{
  display      : inline-block;
  margin-left  : -2em;
  line-height  : 1.5em;
}

input[type=checkbox]:not(old) + label > span,
input[type=radio   ]:not(old) + label > span{
  display          : inline-block;
  width            : 1.5em;
  height           : 1.5em;
  margin           : 0px 0px 0px 0px;
  border           : 1px #ED6D00 solid;
  border-radius    : 0.25em;
  background       : #FFFFFF;
  vertical-align   : middle;
}

input[type=checkbox]:not(old):checked + label > span,
input[type=radio   ]:not(old):checked + label > span{
  background       : #FFFFFF;
}

input[type=checkbox]:not(old):checked + label > span:before{
  content     : '✓';
  display     : block;
  width       : 1em;
  color       : #333333;
  font-size   : 1.5em;
  line-height : 1em;
  text-align  : center;
  text-shadow : 0 0 0.0714em rgb(115,153,77);
  font-weight : normal;
}

input[type=radio]:not(old):checked + label > span > span{
  display          : block;
  width            : 0.5em;
  height           : 0.5em;
  margin           : 0.125em;
  border           : 0.0625em solid rgb(115,153,77);
  border-radius    : 0.125em;
  background       : rgb(153,204,102);
  background-image :    -moz-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image :     -ms-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image :      -o-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image : -webkit-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image :         linear-gradient(rgb(179,217,140),rgb(153,204,102));
}


.nlcheck	{
  display          : inline-block;
  width            : 1.25em;
  height           : 1.25em;
  margin           : 0 0.5em 0 0 !important;
  border           : 1px #ED6D00 solid;
  border-radius    : 0.25em;
  background       : #FFFFFF;
  vertical-align   : middle !important;
  opacity          : 100 !important;
}

.fullview img {
	margin:24px 0 0 12px;
}
.lightbox {
	/** Default lightbox to hidden */
	display: none;

	/** Position and style */
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100%;
	text-align: center;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
}
.lightbox img {
	/** Pad the lightbox image */
	width:auto;
	height:auto;
	max-width: 90%;
	max-height: 80%;
	margin-top: 5%;
}
.lightbox:target {
	/** Remove default browser outline */
	outline: none;

	/** Unhide lightbox **/
	display: block;
}

