﻿@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/Barlow-Regular.ttf") format("truetype");
}
@font-face {
  font-family: 'Barlow';
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/Barlow-Italic.ttf") format("truetype");
}

@font-face {
  font-family: 'Barlow';
  font-style: bold;
  font-weight: 600;
  src: url("../fonts/Barlow-SemiBold.ttf") format("truetype");
}
@font-face {
  font-family: 'Barlow';
  font-style: italic bold;
  font-weight: 600;
  src: url("../fonts/Barlow-SemiBoldIzalic.ttf") format("truetype");
}


html, body		{background:#FFFFFF;margin:0px;padding:0px;color:#000000;}


h1				{margin:-60px 0 0 0;height:60px;color:#333333;font-family:'Barlow',sans-serif;font-size:0.5em;}
h2				{margin:36px 12px 12px 12px;color:#333333;font-family:'Barlow',sans-serif;font-size:2.0em;font-weight:600;}
h3				{margin:12px 12px 12px 12px;color:#666666;font-size:1.5em;font-family:'Barlow',sans-serif;font-weight:600;}
h4				{margin:12px 12px 12px 12px;color:#ED6D00;font-size:1.35em;font-family:'Barlow',sans-serif;font-weight:600;}
h5				{margin:24px 12px;color:#000000;font-size:1.15em;font-family:'Barlow',sans-serif;font-weight:600;}
h6				{margin:24px 12px 36px 12px;color:#333333;font-size:1.0em;font-family:'Barlow',sans-serif;font-weight:600;}
aside h6		{margin:36px 12px 0px 12px;color:#ED6D00;}

p				{font-size:1em;margin:24px 12px;line-height:1.5em;color:#333333;font-family:'Barlow',sans-serif;letter-spacing:0.005em;word-spacing:0.05em;-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
aside p			{margin:12px 12px 36px 12px;}

table			{font-size:1em;margin:24px 12px;line-height:1.5em;color:#333333;font-family:'Barlow',sans-serif;letter-spacing:0.005em;word-spacing:0.05em;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%;}


.prices table	{font-size:0.75em;margin:24px 12px;line-height:1.5em;color:#333333;font-family:'Barlow',sans-serif;letter-spacing:0.005em;word-spacing:0.05em;border-collapse:collapse;width:98%;}
.prices th		{text-align:left;padding:4px 12px 4px 0px;width:auto;vertical-align:top;}
.prices td		{text-align:left;padding:4px 12px 4px 0px;width:auto;}



.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:'Oswald',sans-serif;font-size:1.25em;line-height:1.25em;font-weight:700;letter-spacing:0.15em;}
.leftside		{text-align:left;color:#999999;}

figcaption		{font-size:0.75em;margin:12px 12px;line-height:1.5em;color:#333333;font-family:'Barlow',sans-serif;font-weight:400;letter-spacing:0.005em;word-spacing:0.05em;-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}

ul,ol			{font-size:1em;margin:18px 12px;line-height:1.5em;color:#333333;font-family:'Barlow',sans-serif;font-weight:400;letter-spacing:0.005em;word-spacing:0.05em;-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
.decide			{list-style:none;}
.decide li		{margin:0px -12px;}

.advantage		{color:#ED6D00;}
.advantage li	{font-weight:600;}

header			{margin:0 auto;padding:24px 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:#181818;}
.keywrapper		{margin:0;padding:0;width:100%;background:#CCCCCC;height:120px;overflow:hidden;display:none;}
.keywrapper26	{margin:0;padding:0;width:100%;height:150px;overflow:hidden;display:block;background-image: url('../images/3d-buchstaben_xxl_frei_stehend_outdoor_1080p_wide.jpg');background-position: center center;background-size:100%;}
.keywrapper27	{margin:0;padding:0;width:100%;height:150px;overflow:hidden;display:block;background-image: url('../images/kv_xxl_styroporkugeln_von_duktus_1080p_wide.jpg');background-position: center center;background-size:100%;}
.keywrapper28	{margin:0;padding:0;width:100%;height:120px;overflow:hidden;display:block;background-image: url('../images/kv_duktus_folienrollen.jpg');background-position: center center;background-size:100%;}

.darkwrapper	{margin:0;padding:0;width:100%;background:#333333;}
.alertwrapper	{margin:0;padding:0;width:100%;background:#ED6D00;}
.alertwrapper p	{color:#000000;}

.duktuslogo		{width:auto;height:36px;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:'Barlow',sans-serif;font-weight:600;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;}

	.contentbox2a a		{color:#999999;text-decoration:none;}

@media (min-width: 768px) {
	.menu_expand	{display:none;}
	.menu_collapse	{display:none;}
	
	nav					{margin:0px 0 0px 0;padding:0;width:100%;background:#181818;height:40px;display:block;}
	nav ul				{margin:0 auto;padding:0;list-style:none;width:96%;max-width:1260px;background:#181818;}
	nav li				{padding:0;margin:0;font-size:1em;font-family:'Barlow',sans-serif;font-weight:600;float:left;position:relative;text-decoration:none;background:#181818;}
	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:#181818;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}

	table			{font-size:1em;}
	
	.keywrapper		{height:200px;display:block;}
	.keywrapper26	{height:400px;display:block;}
	.keywrapper27	{height:480px;display:block;}
	.keywrapper28	{height:200px;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;}


.overview				{margin:0;padding:0;width:100%;float:left;}
.overview img			{margin:12px 0 -24px 12px;width:92%;max-width:606px;}
.overview a				{background:#ffffff;color:#333333;text-decoration:none;display:block;}
.overview a:focus,
.overview a:hover,
.overview a:active		{background:#efefef;color:#ED6D00;text-decoration:none;display:block;}
.overview h6			{color:#333333;min-height:5em;margin:24px 12px 12px 12px;}
.overview span			{color:#ED6D00;}

.overviewlarge				{margin:0;padding:0;width:100%;float:left;}
.overviewlarge img			{margin:12px 0 -24px 12px;width:92%;max-width:606px;}
.overviewlarge a				{background:#ffffff;color:#333333;text-decoration:none;display:block;}
.overviewlarge a:focus,
.overviewlarge a:hover,
.overviewlarge a:active		{background:#efefef;color:#ED6D00;text-decoration:none;display:block;}
.overviewlarge h5			{color:#ED6D00;min-height:3em;margin:24px 12px 0px 12px;}
.overviewlarge p			{min-height:8em;}


@media (min-width: 575px) {
	.keywrapper		{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;}
	.contentbox2a		{margin:0;padding:16px 0 0 16px;width:auto;min-width:210px;float:left;}
	.contentbox2a a		{color:#999999;text-decoration:none;}	
	.contentbox2b		{margin:0;padding:0;width:auto;min-width:210px;float:right;}
	.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%;
    }


.overview				{margin:0;padding:0;width:25%;min-width:157px;float:left;}
.overview img			{margin:12px 0 -24px 12px;width:96%;max-width:290px;}

.overviewlarge				{margin:0;padding:0;width:33%;min-width:210px;float:left;}
.overviewlarge img			{margin:12px 0 -24px 12px;width:96%;max-width:396px;}


}



.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;}




.wrapper		{margin:0 auto;padding:0;width:96%;max-width:1260px;}

.newsreel		{height:3.5em;margin:2em 0 1em 0;padding:0.5em 0 0 0;box-shadow:0 0 10px #999999;}
.newsreel ul	{height:3em;margin:0 0 0 12px;padding:0;list-style:none;overflow:hidden;}
.newsreel li	{margin:0;padding:0;width:20%;float:left;}
.newsreel img	{height:3em;margin:0 0.5em 0 0;float:left;}
.newsreel a		{height:3em;margin:0 0 0 0;padding:0;display:block;text-decoration:none;color:#000000;font-size:1em;line-height:1em;font-weight:bold;}
.newsreel a:focus, a:hover, a:active		{text-decoration:none;color:#ED6D00;}
.newsreel span	{font-size:1em;line-height:1em;font-weight:normal;}








.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:#CDCE00;margin:0 12px;padding:12px;color:#000000;}
.bubblebox1 ul			{background:#CDCE00;margin:0 12px;color:#000000;padding-right:12px;}
.bubblebox1 p			{background:#CDCE00;margin:0 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;}


.tagcloud				{font-size:1.0em;word-spacing:0.25em;}
.tagcloud a				{text-decoration:none;}


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:'Barlow',sans-serif;font-weight:400;width:96%;}
textarea 				{font-size:1em;margin:0px;border:1px #ED6D00 solid;border-radius:0.25em;line-height:1.5em;color:#333333;font-family:'Barlow',sans-serif;font-weight:400;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:'Barlow',sans-serif;font-weight:700;}
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:'Barlow',sans-serif;font-weight:700;}
.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;
}


img {
  pointer-events: none;
  user-select: none;
}
