
/*

orange (snapeda): #FF761A

lightred: #fae3e3
red: #c90c0f

lightgreen: #91ebb3
green: #21b20a

lightgray: #eee
gray: #bbb
darkgray: #262626
 */

.sticky {
	overflow: visible;
}
.sticky > * {
	margin-bottom: 0 !important;
}
.sticky.fixed > * {
	background: #fff;
	position: fixed;
	top: 0;
	z-index: 1000;
}





.mod_diotec_productdetails .linklist,
.linklist {
	overflow: visible;
	position: relative;
}
.linklist button {
	margin: 0;
	padding: 0.5em 1em 0.5em 0;
	border: 1.5px solid #c90c0f;
    background-color: #c90c0f;
    color: #fff;
    font-size: 100%;
	line-height: 1;
	text-decoration: none;
	display: inline-block;
	text-transform: uppercase;

	-webkit-transition: border-color .35s, color .35s, background-color .35s;
	-o-transition: border-color .35s, color .35s, background-color .35s;
	transition: border-color .35s, color .35s, background-color .35s;
}
.mod_diotec_productlist .linklist button {
	border: none;
	background-color: #fff;
	color: #c90c0f;
}
.hyperlink_wrapper .linklist button {
	margin: 0 0.4em 0.4em 0;
}
.hyperlink_wrapper .linklist button span {
	line-height: 1;
}
.linklist button:hover {
	border-color: #262626;
    background-color: #fff;
    color: #262626;
}
.linklist .list {
	max-width: 14em;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 16px;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	z-index: 20;
	pointer-events: none;
	opacity: 0;
}
.linklist .list.active {
	pointer-events: all;
	opacity: 1;
}
.linklist .list > .inner {
	overflow: auto;
	padding: 1em;
	width: 14em;
	height: 100%;
	max-height: 13em;
	background: #fff;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: #262626;
}
.linklist .list.loaded_more > .inner {
	max-height: 25em;
}
.linklist .close {
	margin-bottom: 1.5px;
	padding: .3em;
	background: #eee;
	color: #c90c0f;
	line-height: 1;
	position: absolute;
	top: 3px;
	right: 3px;
	cursor: pointer;
}
.linklist .close:hover {
	background: #fff;
	color: #c90c0f;
	border-color: #c90c0f;
}
.linklist .close:after {
	content: "\e870";
}
.linklist p.title {
    margin: .5em 0 0 0;
	padding-right: 1.7em;
    padding-bottom: .2em;
    font-weight: 500;
    border-bottom: .5px solid #bbb;
}
.linklist .product_links {
	margin-bottom: 0;
	font-size: 100%;
}
.linklist .product_links li {
	margin-top: .5em;
	font-size: 100%;
	display: block;
}
.linklist .product_links a {
	margin: 0;
	border-color: #bbb;
	background: transparent;
	color: #c90c0f;
}
.linklist .product_links a:hover {
	color: #000;
}

@media (max-width: 767px) {
	.mod_diotec_referencediagram_details .linklist .list {
		max-width: none;
		border: 1.5px solid #fff;
		position: fixed;
		top: 6em !important;
		left: 2.5% !important;
		right: 2.5% !important;
		bottom: 2.5vw !important;
		z-index: 200;
	}
	.mod_diotec_referencediagram_details .linklist .list > .inner {
		width: auto;
		max-height: none;
	}
}

/* Stocklist */
.linklist.stocklist .list {
	display: none;
	margin-top: -.3em;
	-webkit-box-shadow: 1px 4px 10px -2px rgba(0,0,0,.35);
	box-shadow: 1px 4px 10px -2px rgba(0,0,0,.35);
	top: 100%;
	right: auto;
	bottom: auto;
	z-index: 10000;
	font-size: 14px;

	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.linklist.stocklist .list.active {
	display: block;
}
.linklist.stocklist .list > .inner {
	padding: 0 .5em;
}
.linklist.stocklist .product_links a {
	padding: .1em 0 .1em .1em;
	border: none;
}
.linklist.stocklist .product_links a:before {
	content: "\e900\00a0";
	font-size: 70%;
}
.linklist.stocklist .product_links a[target="_blank"]:before {
	content: "\ea7e\00a0";
	font-size: 100%;
	position: relative;
	top: 1px;
}

.mod_diotec_productlist .linklist.stocklist .list {
	margin-top: 0;
	margin-left: 2px;
	font-size: 100%;
	top: 0;
	left: 100%;
}
.mod_diotec_productlist .linklist.stocklist .list > .inner {
	padding: 0;
}
.mod_diotec_productlist .linklist.stocklist button.active:before {
	content: "\e870";
}
.mod_diotec_productlist .linklist.stocklist .close {
	display: none;
}
.mod_diotec_productlist .linklist p.title {
	display: none;
}
.mod_diotec_productlist .linklist.stocklist .product_links a {
	padding: .5em;
}
.mod_diotec_productlist .linklist.stocklist li + li {
	border-color: #e05557;
}


.stocklist button {
	padding-left: .8em;
}
.stocklist button:before {
	content: "\e917";

	padding-right: .6em;
	line-height: 110%;
	vertical-align: top;
	top: 2px;
}
.mod_diotec_productlist .stocklist button {
	padding: .5em;
	width: 100%;
	font-weight: 500;
	text-align: left;
	text-transform: none;
	display: block;
}
.mod_diotec_productlist .stocklist button.active {
	background: #c90c0f;
	color: #fff;
}
.mod_diotec_productlist .stocklist button span {
	padding: 0 0 0 5px;
	display: inline-block;
	line-height: 1;
	white-space: initial;
}
.mod_diotec_productlist .stocklist button:before {
	padding-right: 0;
}
.mod_diotec_productlist .stocklist button span:after {
	content: "\00a0»";
	font: inherit !important;
}






.svg_link {
	overflow: hidden;
    width: 96px;
    height: 88px;
    line-height: 80px;
    border: 1.5px solid #bbb;
	display: inline-block;
	vertical-align: top;
}
.svg_link img {
    vertical-align: top;
    position: relative;
    z-index: 100;
}
.svg_link:not(.active) img {
	width: 100%;
	vertical-align: middle;
}
.svg_link.active {
	overflow: visible;
}
.svg_link.active img {
    margin: 0 -1000px -1000px 0;
	width: 300px !important;
	max-width: 70vw;
    background: #fff;
	-webkit-box-shadow: 1px 4px 10px -2px rgba(0,0,0,.35);
	box-shadow: 1px 4px 10px -2px rgba(0,0,0,.35);
    z-index: 200;
}
.svg_link.active.bottom img {
	vertical-align: bottom;
	margin-bottom: 0;
	margin-top: -1000px;
}



.load_more {
	cursor: pointer;
	text-align: center;
}
.load_more:hover {
	text-decoration: underline;
}
.load_more ~ * {
	display: none !important;
}
ul.connection .load_more {
	color: #c90c0f;
}
ul.connection .load_more:hover {
	color: #262626;
}
ul.connection_filters {
	margin: 0 0 1rem;
	padding: .5rem .5rem .3rem;
	background: #eee;
	font-size: 0;
}
ul.connection_filters li {
	margin: 0 .2rem .2rem 0;
	list-style: none;
	font-size: .72222222222rem;
	display: inline-block;
	vertical-align: top;
}
ul.connection_filters .label,
ul.connection_filters button {
	padding: .4em .5em;
    border: 1.5px solid transparent;
	font-size: 100%;
	font-weight: 500;
	display: block;
}
ul.connection_filters button {
	background: #fff;
    border-color: #c90c0f;
    color: #c90c0f;
}
ul.connection_filters button.active,
ul.connection_filters button:hover {
	background: #c90c0f;
	color: #fff;
}

/**
 * connection_elements
 */
ul.connection {
	margin: 0 0 2.6em;
}
ul.connection li {
	list-style: none;
}
ul.connection .headline {
	margin-bottom: 1em;
	padding-bottom: 1em;
	border-bottom: 1px solid #eee;
	font-weight: 500;
	text-transform: uppercase;
}
ul.connection a {
	overflow: hidden;
	margin-bottom: 1em;
	padding-bottom: 1em;
	padding-left: 2em;
	border-bottom: 1px solid #eee;
	text-decoration: none;
	display: block;
	position: relative;
	color: #262626;
}
ul.connection a:hover {
	color: #c90c0f;
}
ul.connection a:before {
	content:  "\e900";

	font-weight: 500;
	font-size: 80%;
	position: absolute;
	top: .4em;
	left: .3em;
}
ul.connection .image_container {
	width: 100px;
	float: right;
}
ul.connection .image_container img {
	border: .5px solid #c90c0f;
	display: block;
	-webkit-box-sizing: border-box;
    box-sizing: border-box;
}
ul.connection .image_container ~ * {
	margin-right: 120px;
}
ul.connection .title,
ul.connection .url {
	display: block;
}
ul.connection .title {
/*	font-weight: 500;*/
}
ul.connection .url {
	color: #262626;
	font-size: 72.222222222%;
	display: none;
}
ul.connection .parent {
	margin-right: 0.4em;
	padding: .4em .5em;
	background: #eee;
	color: #262626;
	font-size: 72.222222222%;
	font-weight: 500;
	line-height: 1;
	vertical-align: middle;
	display: inline-block;
	position: relative;
	top: -1px;
}


/**
 * ModuleReferenceDiagramDetails
 */
.mod_diotec_referencediagram_details {
	overflow: visible;
	padding-top: 3em;
	margin: 0 auto 2.6em;
	width: 95%;
	max-width: 1400px;
	position: relative;
}
.mod_diotec_referencediagram_details h1 .small {
	display: block;
	color: #262626;
	font-size: 1rem;
	font-weight: 500;
}
.mod_diotec_referencediagram_details .svg_wrapper {
	padding-bottom: 4em;
	position: relative;
	z-index: 10;
}
.mod_diotec_referencediagram_details .svg_wrapper a,
.mod_diotec_referencediagram_details .svg_wrapper a > rect {
	-webkit-transition: all .15s;
	-o-transition: all .15s;
	transition: all .15s;
}
.mod_diotec_referencediagram_details .svg_wrapper a {
	fill: none !important;
}
.mod_diotec_referencediagram_details .svg_wrapper a > rect {
	opacity: .25 !important;
	fill: #262626 !important;
}

.mod_diotec_referencediagram_details .svg_wrapper:hover a {
	opacity: .4 !important;
}
.mod_diotec_referencediagram_details .svg_wrapper a:hover,
.mod_diotec_referencediagram_details .svg_wrapper a.active {
	opacity: 1 !important;
}
.mod_diotec_referencediagram_details svg {
	width: 100%;
	height: auto;
	max-height: 90vh;
}
.mod_diotec_referencediagram_details .linklist {
	position: static;
}



/**
 * ModuleProductsearch
 */
.mod_diotec_productsearch {
	margin: 0 auto 2.6em;
	width: 95%;
	max-width: 1100px;
}
.mod_diotec_productsearch > .search_results > ul {
	margin: 0 0 2rem;
	font-size: 0;
}
.mod_diotec_productsearch > .search_results > ul > li {
	margin: 0;
	padding-right: 10px;
	max-width: 100%;
	width: 25%;
	min-width: 200px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	list-style: none;
	font-size: .9375rem;
	display: inline-block;
	vertical-align: top;
}
@media (max-width: 1023px) {
	.mod_diotec_productsearch > .search_results > ul > li {
		width: 33.3333%;
	}
}
@media (max-width: 767px) {
	.mod_diotec_productsearch > .search_results > ul > li {
		width: 50%;
	}
}
@media (max-width: 500px) {
	.mod_diotec_productsearch > .search_results > ul > li {
		width: 100%;
		min-height: 0 !important;
	}
	.mod_diotec_productsearch .title {
		min-height: 0 !important;
	}
}
.mod_diotec_productsearch .search_result {
	color: #262626;
	background: #eee;
	margin-bottom: 1em;
	padding: .7em .7em .7em 1.8em;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-align-last: left;
	text-decoration: none;
	display: block;
	position: relative;
}
.mod_diotec_productsearch .search_result:hover {
	color: #c90c0f;
}
.mod_diotec_productsearch .search_result:before {
	content:  "\e900";

	font-weight: 500;
	font-size: 80%;
	position: absolute;
	top: 1.4em;
	left: 0;
}
.mod_diotec_productsearch .title,
.mod_diotec_productsearch .url {
	display: block;
}
.mod_diotec_productsearch .CrossRef {
	font-weight: 400;
}
.mod_diotec_productsearch .title {
	font-weight: 500;
}
.mod_diotec_productsearch .url {
	color: #262626;
	font-size: 13px;
}
.mod_diotec_productsearch .load_more {
	padding: .4em 1.2em .5em;
	background: #c90c0f;
    border: 1.5px solid #c90c0f;
    color: #fff;
	line-height: 1;
	text-decoration: none;
	display: inline-block;
}
/*.mod_diotec_productsearch .load_more:hover {
	background: #fff;
	color: #c90c0f;
}*/
.mod_diotec_productsearch .family,
.mod_diotec_productsearch .info {
	display: block;
}
.mod_diotec_productsearch .family,
.mod_diotec_productsearch .info,
.mod_diotec_productsearch .info li {
	font-size: .8666666667rem;
}
.mod_diotec_productsearch .family {
/*	font-weight: 500;*/
}
.mod_diotec_productsearch .info ul {
	margin: 0;
	font-size: 0;
}
.mod_diotec_productsearch .info li {
	display: inline-block;
	font-size: .875rem;
}
.mod_diotec_productsearch .info li + li:before {
	content: "\00a0|\00a0";
	font: inherit !important;
}



/**
 * ModuleProductdetails
 */
.mod_diotec_productdetails .toplink {
	padding: .3em 1em;
	opacity: 0;
	pointer-events: none;

	-webkit-transition: border-color .35s, color .35s, background-color .35s, opacity .15s;
	-o-transition: border-color .35s, color .35s, background-color .35s, opacity .15s;
	transition: border-color .35s, color .35s, background-color .35s, opacity .15s;
}
.mod_diotec_productdetails .sticky.fixed .toplink {
	opacity: 1;
	pointer-events: all;
}
.mod_diotec_productdetails .toplink:before {
	content: "\e912";

	padding: 0;
	font-size: 150%;
	vertical-align: middle;
}
.mod_diotec_productdetails {
	margin: 0 auto 2.6em;
	padding-top: 3em;
	width: 95%;
	max-width: 1200px;
}
.mod_diotec_productdetails tr > * {
	background: transparent;

	-webkit-transition: background .5s;
	-o-transition: background .5s;
	transition: background .5s;
}
.mod_diotec_productdetails tr.highlight > * {
	background: #91ebb3;
}
/* Anker-Navi Toggler: Standard versteckt -> Desktop unveraendert. */
.hyperlink_toggle {
	display: none;
}

@media (max-width: 767px) {
	.mod_diotec_productdetails .hyperlink_wrapper {
		font-size: 14px;
		background: #fff;
		position: relative;
		z-index: 100;
	}

	/* Mobile-Toggler fuer die Anker-Navi. .has-toggle setzt das JS -> ohne JS
	   bleiben die Links sichtbar (Fallback) und der Button erscheint nicht. */
	.hyperlink_wrapper.has-toggle .hyperlink_toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: .5em;
		width: 100%;
		margin: 0;
		padding: .7em 1em;
		border: 1.5px solid #c90c0f;
		background-color: #c90c0f;
		color: #fff;
		font: inherit;
		line-height: 1;
		text-align: left;
		text-transform: uppercase;
		cursor: pointer;
	}
	/* Chevron rein per CSS (unabhaengig vom Icon-Font), dreht beim Oeffnen. */
	.hyperlink_wrapper.has-toggle .hyperlink_toggle::after {
		content: "";
		flex: 0 0 auto;
		width: .5em;
		height: .5em;
		margin-right: .15em;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
		transition: transform .2s ease;
	}
	.hyperlink_wrapper.has-toggle.is-open .hyperlink_toggle::after {
		transform: rotate(-135deg);
	}
	/* Eingeklappt: Links verstecken; offen: zeigen. */
	.hyperlink_wrapper.has-toggle .ce_hyperlink {
		margin: 7px 12px;
		display: none;
	}
	.hyperlink_wrapper.has-toggle.is-open .ce_hyperlink {
		display: block;
	}
	.hyperlink_wrapper.has-toggle .ce_hyperlink a {
		margin: 0;
		display: block;
	}
	/* Letzter Eintrag ist der leere #top-Toplink -> im Toggler nie zeigen. */
	.hyperlink_wrapper.has-toggle .ce_hyperlink:last-child {
		display: none;
	}
	/* "Teilen" ist eine Aktion, kein Sprungziel -> nicht einklappen, bleibt
	   mobil immer sichtbar (mit etwas Abstand zum Toggler, wenn zugeklappt). */
	.hyperlink_wrapper.has-toggle .ce_hyperlink.share_item {
		display: block;
	}
	.hyperlink_wrapper.has-toggle:not(.is-open) .ce_hyperlink.share_item {
		margin: .4em 0 0 0;
	}
	/* Offen ueber gefixtem Sticky-Header lesbar halten. */
	.sticky.fixed .hyperlink_wrapper.has-toggle.is-open {
		background: #fff;
	}
}
.mod_diotec_productdetails .technicalData th,
.mod_diotec_productdetails .technicalData td {
	vertical-align: bottom;
}
.mod_diotec_productdetails .technicalData th + th {
	text-align: right;
	width: 2em;
	font-weight: 400;
}
.mod_diotec_productdetails .technicalData td {
	width: 10em;
}
.mod_diotec_productdetails .technicalData .load_more td {
	text-align: center;
}
.technicalData button,
#distributors button {
	font-size: 14px;
	padding: 7px 15px 6px;
	font-weight: 400;
	border: none;
}
.mod_diotec_productdetails tr[data-name="ESD protected"] .label {
	display: none;
}
.mod_diotec_productdetails .ce_hyperlink {
	vertical-align: top;
}
.mod_diotec_productdetails .ce_text.title {
	margin-bottom: 1.3em;
	padding: 1em;
	background: #c90c0f;
	color: #fff;
}
.mod_diotec_productdetails h1 {
	color: inherit;
}
.mod_diotec_productdetails h1:last-child {
	margin-bottom: 0;
}
.mod_diotec_productdetails h1 .small {
	display: block;
	font-size: 1rem;
	font-weight: 500;
}
.mod_diotec_productdetails .subcolumns + .subcolumns {
	margin-top: 2.6em;
}
.mod_diotec_productdetails .subcolumns h2 {
	font-size: 150%;
}
.mod_diotec_productdetails th {
	width: 15em;
}
.mod_diotec_productdetails tr[data-name="ConfigPictureFile"] img {
	width: 100px;
}
.mod_diotec_productdetails .ce_downloads li {
	width: 100%;
	margin: 0 0 .5em;
	padding-bottom: .5em;
	border-bottom: 1px solid #eee;
}
.mod_diotec_productdetails .ce_downloads .size {
	display: block;
}
.mod_diotec_productdetails .ce_downloads ul {
    column-count: 2;
    column-gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.mod_diotec_productdetails .ce_downloads ul li {
    break-inside: avoid;
}

@media (max-width: 600px) {
    .mod_diotec_productdetails .ce_downloads ul {
        column-count: 1;
    }
}
.mod_diotec_productdetails .kd_separator {
	border-color: #262626;
}
.mod_diotec_productdetails table a {
	color: inherit;
}
.mod_diotec_productdetails table a:hover {
	text-decoration: none;
}
.mod_diotec_productdetails tbody {
	font-size: 100%;
}
.mod_diotec_productdetails .label .big {
	font-size: 16px;
}
.mod_diotec_productdetails .label .small {
	font-size: 11px;
}
.mod_diotec_productdetails tr.group th {
	padding-top: 2em;
	color: #c90c0f;
}
.mod_diotec_productdetails #sampleRequest {
	margin-top: 2em;
	padding-top: 2em;
	border-top: 1.5px solid #262626;
}

#snapeda {
	padding-top: 16px;
	padding-left: 20px;
	height: 88px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
}

#snapeda button {
	display: inline-block;
	align-items: center;
	font-size: 14px;
	padding: 7px 15px 6px;
	color: #fff;
	font-weight: 500;
	border: none;
	margin: 10px 0;
	outline: none;
	font-weight: 400;
}
#snapeda button span {
	color: #fff;
	vertical-align: baseline;
	line-height: 14px;
	display: inline;
	font-weight: 400;
	padding: 0px !important;
	background-color: transparent;
}

/* SnapEDA-Plugin rendert nach dem Laden seinen EIGENEN Button (#btn-popup-modal)
   im Default-Orange (#ff761a) - auf Diotec-Rot ziehen. !important noetig: das
   Plugin injiziert seine CSS gleicher Specificity (2 IDs) dynamisch NACH dieser
   Datei, gewinnt sonst per Quelltext-Reihenfolge. */
#snapeda-plugin #btn-popup-modal {
	background: #c90c0f !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	padding: 7px 15px 6px !important;
	border-radius: 0 !important;
	border: none !important;
}

html.in_iframe #header,
html.in_iframe #footer,
html.in_iframe .mod_breadcrumb {
	display: none !important
}
html.in_iframe #container {
	padding-top: 50px !important;
}
html.in_iframe .mod_diotec_productdetails {
	padding-top: 0;
}



/**
 * ModuleQuickfinder
 */
.mod_article > .mod_diotec_quickfinder {
	margin-right: auto;
	margin-left: auto;
	width: 95%;
	max-width: 1100px;
}
.mod_diotec_quickfinder ul.families {
	font-size: 0;
}
.mod_diotec_quickfinder ul.families li {
	padding-right: 1em;
	width: 50%;
	box-sizing: border-box;
	font-size: 1rem;
	vertical-align: top;
	display: inline-block;
}
@media (max-width: 767px) {
	.mod_diotec_quickfinder ul.families li {
		padding-right: 0;
		width: 100%;
	}
}
.mod_diotec_quickfinder a {
	text-decoration: none;
}
.mod_diotec_quickfinder .description,
.mod_diotec_quickfinder .application {
	display: block;
}
.mod_diotec_quickfinder .description {
	font-weight: 500;
}
.mod_diotec_quickfinder .application {
	color: #262626;
}
@media (max-width: 1023px) {
	.mod_diotec_quickfinder li {
		padding-right: 0;
		width: 100%;
	}
}

.mod_diotec_quickfinder ul.familygroups li {
	margin: 0;
	padding: 0;
	width: auto;
	line-height: 1;
	display: inline-block;
}
.mod_diotec_quickfinder ul.familygroups li:before {
	display: none;
}
.mod_diotec_quickfinder ul.familygroups button {
	font-size: 100%;
	background: #fff;
	color: #c90c0f;
	border: 1.5px solid #c90c0f;
}
.mod_diotec_quickfinder ul.familygroups button.active,
.mod_diotec_quickfinder ul.familygroups button:hover {
	background: #c90c0f;
	color: #fff;
}
.mod_diotec_quickfinder ul.familygroups button span {
	line-height: 1;
	font-size: 77;
}
@media (max-width: 1023px) {
	.mod_diotec_quickfinder ul.familygroups li {
		margin-bottom: .25em
	}
}



/**
 * ModuleProductlist
 */
.mod_diotec_productlist {
	margin-bottom: 2.6em;
}
.mod_article.last > .mod_diotec_productlist:last-child {
	margin-bottom: 1px;
}
.mod_diotec_productlist > .ce_text {
	margin: 0 auto;
	padding-top: 3em;
	width: 95%;
	max-width: 1200px;
}
.mod_diotec_productlist h1 .small {
	display: block;
	color: #262626;
	font-size: 1rem;
	font-weight: 500;
}


#cta_navigation {
	-webkit-transition: right .25s;
	-o-transition: right .25s;
	transition: right .25s;
}
#cta_navigation.affix {
	right: -20em;
}
body .datatable_wrapper {
	margin: 0 auto;
	padding: 2em 5px;
	min-height: 50vw;
	position: relative;
}
@media (max-width: 767px) {
	body .datatable_wrapper {
		padding: 1em;
	}
}
body .datatable_wrapper table {
	width: 100% !important;
}
body table.dataTable td.dt-empty {
	padding: 2em;
	color: #c90c0f;
	text-align: left;
	font-style: italic;
}
body .dt-scroll-body {
	overflow-y: visible !important;
	padding-bottom: 10px;
	background: #fff;
}
body .dt-scroll-body,
body .dt-scroll-body > table {
	-webkit-transform: scale(1, -1);
	-ms-transform: scale(1, -1);
	transform: scale(1, -1);
}

/* Head */
/*body .dt-scroll-headInner {
	overflow: hidden;
}*/
body table.dataTable th .label,
body table.dataTable th .unit {
	font-size: 13px;
	display: block;
}
body table.dataTable th .label {
	min-width: 60px;
	z-index: 200;
    position: relative;
}
body table.dataTable th .unit {
	display: inline-block;
}
body table.dataTable th .big {
	font-size: 15px;
}
body table.dataTable th .small {
	font-size: 11px;
}

body table.dataTable .tooltip {
	position: absolute;
	top: 33px;
	right: 9px;
}
body table.dataTable .tooltipTrigger:before {
	content: "\ea0c";
	color: #848484;
	background: transparent;
}

body table.dataTable th[data-name="Housing"] + th {
	width: 100px;
}

body table.dataTable thead .head-title {
	padding: 10px 33px 10px 10px;
	min-height: 46px;
	background: #bbb;
	display: block;
    position: relative;
}
body table.dataTable thead .dt-orderable-asc .head-title {
    cursor: n-resize;
}
body table.dataTable thead .dt-ordering-asc .head-title {
    cursor: s-resize;
}
body table.dataTable thead .dt-ordering-desc .head-title {
    cursor: ns-resize;
}

body table.dataTable thead .dt-filter {
	overflow: hidden;
}
body table.dataTable thead .sorting_disabled {
	background-image: none !important;
}
body table.dataTable th.sorting_disabled .label,
body table.dataTable th.sorting_disabled .unit {
	padding-right: 0;
}

body table.dataTable thead>tr>th.dt-orderable-asc span.dt-column-order:before,
body table.dataTable thead>tr>th.dt-orderable-asc span.dt-column-order:after,
body table.dataTable thead>tr>th.dt-orderable-desc span.dt-column-order:before,
body table.dataTable thead>tr>th.dt-orderable-desc span.dt-column-order:after,
body table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:before,
body table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:after,
body table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:before,
body table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-orderable-asc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-orderable-asc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-orderable-desc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-orderable-desc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order:after {
	opacity: 1;
	color: #989898;
}
body table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:before,
body table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order:after {
	opacity: 1;
	color: #c90c0f;
}

body table.dataTable thead>tr>th.dt-orderable-asc:hover,
body table.dataTable thead>tr>th.dt-orderable-desc:hover,
body table.dataTable thead>tr>td.dt-orderable-asc:hover,
body table.dataTable thead>tr>td.dt-orderable-desc:hover
body table.dataTable thead>tr>th.dt-orderable-none {
	outline: none;
}
body table.dataTable thead>tr>th[data-name="ArticleNo"]{
	padding-right: 0px;
	border-left: none;
	border-right: none;
	z-index: 1000;
}
body table.dataTable thead>tr>th[data-name="ArticleNo"] .label {
	min-width: 150px;
}
body table.dataTable>thead>tr>th,
bofy table.dataTable>thead>tr>td {
	padding: 0;
	background: #eee !important;
	border: 1px solid #ddd;
	border-width: 0 0 1px 1px;
}
body table.dataTable .newSequence {
	border-left: 6px double #b2b2b2 !important;
}
body .datatable_wrapper.reorderActive thead>tr>th {
	position: relative;
}
body .datatable_wrapper.reorderActive thead>tr>th:after {
	content: "\e871";

	padding: 90px 10px 20px;
	font-size: 200%;
	text-align: center;
	background: rgba(255,255,255,.6);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 100;

	-webkit-transition: background .15s, color .15s;
	transition: background .15s, color .15s;
}
body .datatable_wrapper.reorderActive thead>tr>th:hover:after {
	background: rgba(201,12,15,.35);
	color: #fff;
}
body .datatable_wrapper.reorderActive thead>tr>th:nth-child(1):after {
	content: none;
	display: none;
}
body table.dataTable thead>tr>th.dt-orderable-asc,
body table.dataTable thead>tr>th.dt-orderable-desc,
body table.dataTable thead>tr>th.dt-ordering-asc,
body table.dataTable thead>tr>th.dt-ordering-desc,
body table.dataTable thead>tr>td.dt-orderable-asc,
body table.dataTable thead>tr>td.dt-orderable-desc,
body table.dataTable thead>tr>td.dt-ordering-asc,
body table.dataTable thead>tr>td.dt-ordering-desc {
	padding-right: 0;
}
body table.dataTable thead>tr>th.dt-orderable-asc,
body table.dataTable thead>tr>th.dt-orderable-desc,
body table.dataTable thead>tr>td.dt-orderable-asc,
body table.dataTable thead>tr>td.dt-orderable-desc {
	cursor: initial;
}
body table.dataTable thead>tr>th.dt-orderable-asc span.dt-column-order,
body table.dataTable thead>tr>th.dt-orderable-desc span.dt-column-order,
body table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order,
body table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order,
body table.dataTable thead>tr>td.dt-orderable-asc span.dt-column-order,
body table.dataTable thead>tr>td.dt-orderable-desc span.dt-column-order,
body table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order,
body table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order {
	top: 19px;
	bottom: auto;
	right: 11px;
	pointer-events: none;
}
body table.dataTable thead>tr>th.dt-orderable-asc span.dt-column-order:before,
body table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-orderable-asc span.dt-column-order:before,
body table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order:before {
	bottom: 0;
}
body table.dataTable thead>tr>th.dt-orderable-desc span.dt-column-order:after,
body table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-orderable-desc span.dt-column-order:after,
body table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order:after {
	top: 1px;
}

/* Body */
body table.dataTable {
	background: #eee;
	font-size: 15px;
}
@media (max-width: 767px) {
	body table.dataTable {
		font-size: 14px;
	}
}
body table.dataTable .listWrapper {
	overflow: hidden;
	margin: -5px -10px;
	display: block;
	position: relative;
}
body table.dataTable .listTrigger {
	padding: 9px 10px;
	width: calc(100% - 25px);
	background: transparent;
	color: #c90c0f;
	font-weight: 500;
	font-size: 100%;
	display: block;
	text-align: left;
	position: relative;
	float: left;
}
body table.dataTable .listTrigger + a[href*=".pdf"] {
	padding: 9px 0;
	width: 25px;
	font-size: 0;
	background: transparent;
	color: #262626;
	text-align: center;
	text-decoration: none;
	display: block;
	float: right;
}
body table.dataTable .listTrigger + a[href*=".pdf"]:before {
	content: "\e919";
	font-size: 1rem;
}
body table.dataTable .listTrigger + a[href*=".pdf"]:hover {
	color: #c90c0f;
}
/*body table.dataTable .listTrigger .copytrigger {
	margin-left: 5px;
	position: absolute;
	top: 5px;
	left: 100%;
}*/
body table.dataTable .listTrigger:before {
	content: "»\00a0";
	font: inherit !important;
}
body table.dataTable .listTrigger:hover,
body table.dataTable .listTrigger.active {
	background: #c90c0f;
	color: #fff;
}
body table.dataTable .listContent {
	margin: -10px 0 0 0;
	padding: 0;
	width: 10em;
	background: #fff;
	-webkit-box-shadow: 1px 4px 10px -2px rgba(0,0,0,.35);
    box-shadow: 1px 4px 10px -2px rgba(0,0,0,.35);
	font-size: 14px;
	position: fixed;

	opacity: 0;
	pointer-events: none;

	-webkit-transition: margin-top .15s, opacity .15s;
	transition: margin-top .15s, opacity .15s;
}
body table.dataTable .listContent li.gallery > div {
    width: 5em;
    height: 5em;
    border: none;
	border-left: 1px solid #bbb;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
    vertical-align: top;
	display: inline-block;
}
body table.dataTable .listContent li.gallery > div:nth-child(2n+1) {
	border-left-color: transparent;
}
body table.dataTable .listContent li.gallery > div img {
	max-width: none;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center center;

}
body table.dataTable .listContent li.gallery > div.active img {
	width: 200px !important;
	height: 200px !important;
}
body table.dataTable .listContent.topped li.gallery > div.active img {
	margin-top: -125px;
}
body table.dataTable .listContent .details a {
	padding: .5em;
    width: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
    font-weight: 500;
    text-align: left;
    text-decoration: none;
    text-transform: none;
	display: block;
	white-space: break-spaces;
}
body table.dataTable .listContent .details a:after {
	content: "\00a0»";
	font: inherit !important;
}
body table.dataTable .listWrapper:hover .listContent,
body table.dataTable .listContent:hover {
	margin-top: 0;
	opacity: 1;
	pointer-events: all;
}
body table.dataTable .listContent li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
}
body table.dataTable .listContent li + li {
	border-top: 1px solid #bbb;
}
body table.dataTable .listContent li > img {
	padding: 10px 20px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
body table.dataTable .listContent li.ConfigPictureFile > img {
	padding: 15px 30px;
}
body table.dataTable tbody {
	font-size: 100%;
}
body table.dataTable tbody tr {
	background: #fff;
	position: relative;
	z-index: 10;
}
body table.dataTable tbody tr:hover {
	z-index: 20;
}
body table.dataTable tbody td > span[data-name],
.mod_diotec_productdetails .technicalData td > span[data-name] {
	overflow: hidden;
	margin: 1px;
	padding: 3px;
	height: 29px;
	border: 1px solid #bbb;
	color: #bbb;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 11px;
	line-height: 1;
	text-align: center;
	white-space: break-spaces;
	display: inline-block;
	vertical-align: top;
	display: none;
}
body table.dataTable tbody td > span[data-name][data-value="Y"],
.mod_diotec_productdetails .technicalData td > span[data-name][data-value="Y"] {
	color: #21b20a;
	border-color: #21b20a;
	display: inline-block;
}
body table.dataTable tbody td > span[data-name="HalogenFree"],
.mod_diotec_productdetails .technicalData td > span[data-name="HalogenFree"] {
	width: 50px;
}
body table.dataTable tbody td > span[data-name="PbFree"],
.mod_diotec_productdetails .technicalData td > span[data-name="PbFree"] {
	width: 36px;
}
body table.dataTable tbody td > span[data-name="PPAP"],
.mod_diotec_productdetails .technicalData td > span[data-name="PPAP"] {
	padding-top: 9px;
	width: 36px;
}
body table.dataTable tbody td > span[data-name="ESDsensitive"],
.mod_diotec_productdetails .technicalData td > span[data-name="ESDsensitive"] {
	width: 52px;
}
body table.dataTable tbody tr:nth-child(2n) > th,
body table.dataTable tbody tr:nth-child(2n) > td {
	background: #eee;
}
body table.dataTable tbody tr:nth-child(2n+1) > th,
body table.dataTable tbody tr:nth-child(2n+1) > td {
	background: #fff;
}
body table.dataTable tbody tr .dtcr-moving,
body table.dataTable tbody tr:hover th,
body table.dataTable tbody tr:hover td {
	background: #fae3e3;
}
body table.dataTable tbody td {
	border-left: 1px solid #eee;
	border-bottom: 1px solid #eee;
	text-align: right;
}
body table.dataTable>tbody>tr>th,
body table.dataTable>tbody>tr>td {
	padding: 5px 10px;
}
body table.dataTable tbody td.text-left {
	text-align: left;
    white-space: nowrap;
    font-size: 13px;
}
body table.dataTable tbody .button {
	padding: .3em .6em;
	background: #c90c0f;
	border: 1.5px solid #c90c0f;
	color: #fff;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	display: block;
}
body table.dataTable tbody .button + .button {
	margin-top: .2em;
}
body table.dataTable tbody .button:hover {
	color: #c90c0f;
	background: #fff;
}
body table.dataTable .svg_link {
	width: 24px;
	height: 22px;
	background: #fff;
	line-height: 20px;
}

div.dtsb-searchBuilder {
	padding: 10px;
	background: #fff;
}

/* Range slider  */
body .noUi-target {
	margin: 20px 0 18px 15px;
	width: 4px;
	height: 130px;
	position: relative;
}
body.win .dtfh-floatingparent table.dataTable thead th {
	padding-bottom: 2px;
}
@media (max-width: 767px) {
	body .noUi-target {
		height: 65px;
	}
}
body .noUi-target .input_min,
body .noUi-target .input_max {
	margin: 0;
	padding: 1px 4px;
	width: 62px;
	background: transparent;
	border-color: #bbb;
	color: #262626;
	border-radius: 0;
	font-size: 13px;
	font-weight: 400;
	line-height: 1;
	position: absolute;
	left: 17px;

	-webkit-touch-callout: initial;
	-webkit-tap-highlight-color: initial;
	-webkit-user-select: initial; 
	-ms-touch-action: initial; 
	touch-action: initial; 
	-ms-user-select: initial; 
	-moz-user-select: initial; 
	user-select: initial;
}

body .noUi-target .input_min:hover,
body .noUi-target .input_min:active,
body .noUi-target .input_min:focus,
body .noUi-target .input_max:hover,
body .noUi-target .input_max:active,
body .noUi-target .input_max:focus {
	background: #fff;
}
body .noUi-target .input_max { top: -10px; }
body .noUi-target .input_min { bottom: -10px; }
body .noUi-connect {
	background: #262626;
}
body .noUi-handle {
	box-shadow: none;
	background: #262626;
	border: .5px solid #fff;
}
body .noUi-vertical .noUi-handle {
	width: 20px;
	height: 20px;
	right: -9px;
	bottom: -10px;
}
body .noUi-vertical .noUi-handle:before,
body .noUi-vertical .noUi-handle:after {
	width: 11px;
	left: 4px;
	top: 7px;
}
body .noUi-vertical .noUi-handle:after {
	top: 11px;
}
body .noUi-tooltip {
	font-size: 13px;
	line-height: 1;
	padding: 3px 5px;
	border: 1.5px solid #fff;
	background: #c90c0f;
	color: #fff;
}
body .noUi-vertical .noUi-tooltip {
	right: auto;
	left: 120%;
}


.mod_diotec_productlist .lastUpdate {
	margin-top: 1em;
	text-align: center;
}
.mod_diotec_productlist .lastUpdate a {
	color: inherit;
}

body .dtfh-floatingparent {
	z-index: 50 !important;
}


body .filter.checkbox_container {
	overflow: auto;
	padding: 5px 25px 5px 5px;
	height: 158px;
	font-size: 13px;
}
body.mac .filter.checkbox_container {
	padding-right: 15px;
}
@media (max-width: 767px) {
	body .filter.checkbox_container {
		height: 128px;
	}
}
body .filter.checkbox_container span {
	display: block;
}
body .filter.checkbox_container label {
	margin-left: 1.3em;
	font-weight: 400;
	clear: none;
}
body .filter.checkbox_container input:hover + label,
body .filter.checkbox_container label:hover {
	background: #fff;
}
body .filter.checkbox_container .all label {
	font-style: italic;
	color: #666;
}


body div.dt-container {
	font-size: 14px;
}

body div.dt-container {
	z-index: 10;
}
body div.dt-buttons button {
	font-size: 100%;
}
body div.dt-buttons>.dt-button.dt-button-active:not(.disabled),
body div.dt-buttons>div.dt-button-split .dt-button.dt-button-active:not(.disabled),
body div.dt-buttons>.dt-button,
body div.dt-buttons>div.dt-button-split .dt-button {
	padding: .3em 1em .2em;
	background: #c90c0f;
	border: 1.5px solid #c90c0f;
	box-shadow: none;
	border-radius: 0;
	color: #fff;
	font-size: 100%;
	font-weight: 500;
}
body div.dt-buttons>.dt-button.dt-button-active:not(.disabled):hover:not(.disabled),
body div.dt-buttons>div.dt-button-split .dt-button.dt-button-active:not(.disabled):hover:not(.disabled),
body div.dt-buttons>.dt-button:hover:not(.disabled),
body div.dt-buttons>div.dt-button-split .dt-button:hover:not(.disabled) {
	outline: none !important;
	background: #262626;
	border: 1.5px solid #262626;
	box-shadow: none;
	color: #fff;
}
body div.dt-buttons>.dt-button.reorderButton {
	background: #fff;
	border-color: #fff;
	color: #262626;
}
body div.dt-buttons>.dt-button.reorderButton:hover,
body .reorderActive div.dt-buttons>.dt-button.reorderButton {
	background: #eee;
	border-color: #eee;
	color: #262626;
}
body div.dt-buttons>.dt-button.reorderButton:before {
	content: "\ea53\00a0";
	position: relative;
	top: 1px;
}
body div.dt-buttons>.dt-button.reorderButton:hover:before,
body .reorderActive div.dt-buttons>.dt-button.reorderButton:before {
	color: #262626;
}
body .reorderActive div.dt-buttons>.dt-button.reorderButton:before {
	content: "\ea52\00a0";
}
body div.dt-buttons>.buttons-columnVisibility.dt-button.dt-button-active:not(.disabled),
body div.dt-buttons>div.dt-button-split .buttons-columnVisibility.dt-button.dt-button-active:not(.disabled),
body div.dt-buttons>.buttons-columnVisibility.dt-button,
body div.dt-buttons>div.dt-button-split .buttons-columnVisibility.dt-button {
	background: transparent;
	border-color: #eee;
	color: #bbb;
}
body div.dt-buttons>.buttons-columnVisibility.dt-button.dt-button-active:not(.disabled),
body div.dt-buttons>div.dt-button-split .buttons-columnVisibility.dt-button.dt-button-active:not(.disabled) {
	border-color: #bbb;
	color: #262626;
}
body div.dt-button-collection .buttons-columnVisibility:after {
	content: none;
	display: none;
}
body button.buttons-columnVisibility > span {
	padding-right: 1.5em;
	display: block;
}
body button.buttons-columnVisibility .group {
    font-size: 12px;
    font-weight: 400;
    display: block;
}
body button.buttons-columnVisibility:before {
	content: "\e9d1";
	color: #bbb;
	position: absolute;
	top: .9em;
	right: 1em;
}
body button.buttons-columnVisibility.dt-button-active:before {
	content: "\e9ce";
	color: #21b20a;
}
body button.buttons-columnVisibility:hover:before {
	color: inherit !important;
}
body div.dt-button-collection.columns>:last-child {
	align-items: flex-start;
}
body .buttons-colvisRestore {
	font-weight: 500;
}
body div.dt-buttons>.dt-button.buttons-colvisRestore:hover {}
body div.dt-button-collection {
	font-size: inherit;
	color: #262626;
}
body div.dt-button-collection.fixed {
	background: #eee;
}
body div.dt-button-collection.fixed .dt-button {
	background: transparent;
}
body div.dt-button-collection.fixed .dt-button.dt-button-active {
	background: #fff;
}
body .buttons-columnVisibility {
	font-weight: 500;
	font-size: 15px;
}
body .buttons-columnVisibility .big {
	font-size: 15px;
}
body .buttons-columnVisibility .small {
	font-size: 11px;
}
body div.dt-container div.dt-layout-row {
	display: block;
}
body div.dt-container div.dt-layout-row:first-child {
	margin-top: 2em;
	position: relative;
}
body div.dt-container div.dt-layout-row:first-child > div {
	margin: 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-align: left;
	vertical-align: top;
	line-height: 115%;
	display: block;
}
body div.dt-container div.dt-layout-row:first-child > div.dt-layout-start > *,
body div.dt-container div.dt-layout-row:first-child > div.dt-layout-end > * {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-align: left;
	vertical-align: top;
	line-height: 115%;
	display: inline-block;

}
body div.dt-container div.dt-layout-row:first-child > div.dt-layout-end {
	margin-top: 1px;
	padding-top: 10px;
	border-top: 1.5px solid #eee;
	width: 100%;
	clear: both;
}
body div.dt-container div.dt-layout-row:first-child > div.dt-layout-end:after {
	content: "";
	display: block;
	clear: both;
}
body div.dt-container div.dt-layout-row:first-child > div.dt-layout-end > .dt-info {
	padding: .6em 0 .2em;
	text-align: right;
	color: #c90c0f;
	font-weight: 500;
	float: left;
}
body div.dt-container div.dt-layout-row:first-child > div.dt-layout-end > .dt-buttons {
	float: right;
}
body div.dt-container .resetFilter,
body div.dt-container .resetView {
	outline: none;
	background: #eee !important;
	border-color: #eee !important;
	color: #bbb !important;
	cursor: not-allowed;
}
body div.dt-container .resetFilter.active,
body div.dt-container .resetView.active {
	background: #c90c0f !important;
	border-color: #c90c0f !important;
	color: #fff !important;
	cursor: pointer;
}
body div.dt-container .resetFilter.active:hover,
body div.dt-container .resetView.active:hover {
	background: #262626 !important;
	border-color: #262626 !important;
}

body div.dt-container .dt-length,
body div.dt-container .dt-search {
	display: inline-block;
	vertical-align: top;
	font-weight: 500;
}
body div.dt-container .dt-length *,
body div.dt-container .dt-search * {
	line-height: 115%;
}
body div.dt-container .dt-length label {
	margin: 0 .5em;
	display: inline-block;
}
body div.dt-container .dt-search label {
	display: none;
}
body div.dt-container .dt-length select,
body div.dt-container .dt-search input {
    padding: .4em 1em;
	width: auto;
    height: 2.3em;
	background-color: transparent;
	border: 1.5px solid #bbb;
	color: #262626;
	-webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 0;
	display: inline-block;
}
body div.dt-container .dt-search input:hover,
body div.dt-container .dt-search input:active,
body div.dt-container .dt-search input:focus,
body div.dt-container .dt-length select:hover,
body div.dt-container .dt-length select:active,
body div.dt-container .dt-length select:focus {
	border-color: #262626
}
body div.dt-container .dt-length select {
	margin-right: .3em;
    padding: .5em 1.9em .4em 1em;
}
body div.dt-container .dt-length option {
	color: #262626;
}
body div.dt-container .dt-search input {
	margin-bottom: 0;
	width: 14em;
	padding-right: .5em;
}
body div.dt-container .dt-search input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  display: inline-block;
  width: 8px;
  height: 8px;
  background:
    linear-gradient(45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 43%,#fff 45%,#fff 55%,rgba(0,0,0,0) 57%,rgba(0,0,0,0) 100%),
    linear-gradient(135deg, transparent 0%,transparent 43%,#fff 45%,#fff 55%,transparent 57%,transparent 100%);
}
body div.dt-container .dt-search input::placeholder {
	color: #bbb;
	font-weight: 400;
}

body div.dt-container .dataTables_info {
	margin-top: 1em;
	color: #fff;
}

/* Pagination */
body div.dt-container .dt-paging {
	margin-top: 1em;
}
body div.dt-container .dt-paging .dt-paging-button {
	margin-bottom: .3em;
	padding: .3em .8em;
	background: #fff;
	border-radius: 0;
	border: 1.5px solid #fff;
	font-size: 100%;
}
body div.dt-container .dt-paging .dt-paging-button.disabled,
body div.dt-container .dt-paging .dt-paging-button.disabled:hover,
body div.dt-container .dt-paging .dt-paging-button.disabled:active {
	background: #fff;
	border: 1.5px solid #fff;
}
body div.dt-container .dt-paging .dt-paging-button.disabled,
body div.dt-container .dt-paging .dt-paging-button.disabled:hover {
	opacity: 1;
	color: #bbb !important;
	cursor: not-allowed;
}
body div.dt-container .dt-paging .dt-paging-button.disabled:hover,
body div.dt-container .dt-paging .dt-paging-button.disabled:active {}

body div.dt-container .dt-paging .ellipsis {
	color: #bbb !important;
}
body div.dt-container .dt-paging .dt-paging-button.current,
body div.dt-container .dt-paging .dt-paging-button.current:hover,
body div.dt-container .dt-paging .dt-paging-button:hover {
	background: transparent;
	color: #c90c0f !important;
	border: 1.5px solid #c90c0f;
}
#product_overlay {
	overflow: hidden;
	padding: 1em;
	background: #c90c0f;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 99999;

	pointer-events: none;
	opacity: 0;

	-webkit-transform: scale(1.02) translateY(-30px);
    -ms-transform: scale(1.02) translateY(-30px);
    transform: scale(1.02) translateY(-30px);

	-webkit-transition: opacity .35s, -webkit-transform .35s;
	-o-transition: opacity .35s, -o-transform .35s;
	transition: opacity .35s, transform .35s;
}
#product_overlay.active {
	pointer-events: all;
	opacity: 1;

	-webkit-transform: scale(1) translateY(0);
	-ms-transform: scale(1) translateY(0);
	transform: scale(1) translateY(0);
}
body.safari #product_overlay {
	z-index: 0;
}
body.safari #product_overlay.active {
	z-index: 99999;
}
#product_overlay .close {
	padding: .5em;
	background: #c90c0f;
	border: 1.5px solid #fff;
	color: #fff;
	line-height: 1;
	font-size: 20px;
	position: absolute;
	top: .5em;
	right: .5em;
	z-index: 20;
	cursor: pointer;
}
#product_overlay .close:hover {
	background: #fff;
	color: #c90c0f;
	border-color: #c90c0f;
}
#product_overlay .close:after {
	content: "\e870";
	font-weight: 500;
}
#product_overlay iframe {
	margin: 0 auto;
	width: 100%;
	max-width: 1260px;
	height: 100%;
	background: #fff;
	display: block;
	position: relative;
	z-index: 10;
}
#product_overlay iframe.loading {
	background: #fff url('/assets/diotec/images/loading.gif') center center no-repeat;
}

@media (min-width: 768px) and (max-width: 1600px) {
	body .noUi-target .input_min,
	body .noUi-target .input_max,
	body .noUi-tooltip,
	body .filter.checkbox_container,
	body table.dataTable th .label,
	body table.dataTable th .unit {
		font-size: 12px;
	}
}

.message_center button {
	margin-bottom: .4em;
	font-size: 14px;
	padding: 7px 15px 6px;
	font-weight: 400;
	border: none;
}

/* Domain-Switcher: mittiges Auswahl-Overlay (.com <-> .cn) - per JS eingefuegt */
/* Region-Button in der Meta-Nav (zwischen Custom-Nav und Sprachwechsler) - per
   JS eingefuegt. Erbt Font/Farbe der Meta-Nav, floatet wie deren Kinder. */
.region_switcher {
	float: left;
	display: inline-flex;
	align-items: center;
	gap: .45em;
	margin: 0 1.1em 0 0;
	padding: .7em 0 0;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	line-height: 1;
	cursor: pointer;
}
.region_switcher:hover {
	background: transparent;
	color: #c90c0f;
}
.region_switcher_flag {
	flex: 0 0 auto;
	display: inline-block;
	width: 20px;
	height: 13px;
	border: 1px solid rgba(0, 0, 0, .2);
	overflow: hidden;
}
.region_switcher_flag svg {
	display: block;
	width: 100%;
	height: 100%;
}
.region_switcher_label {
	white-space: nowrap;
}
/* Im mobilen Menue (mega_navigation) zentriert und groesser, wie die
   uebrigen Menue-/Sprach-Eintraege - statt links-gefloatet. */
.mega_navigation .region_switcher {
	float: none;
	display: flex;
	justify-content: center;
	width: 100%;
	margin: 0;
	padding: .85em 0;
	gap: .5em;
	font-size: 16px;
}
.mega_navigation .region_switcher_flag {
	width: 24px;
	height: 16px;
}
/* Auf Desktop (>=1024px) blendet das Theme die mega-Duplikate von Custom-Nav
   und Sprachwechsler aus - der Region-Button muss mit, sonst erscheint er
   doppelt (Meta-Nav oben rechts UND unter der Hauptnavigation). */
@media (min-width: 1024px) {
	.mega_navigation .region_switcher {
		display: none;
	}
}

html.region_modal_open {
	overflow: hidden;
}
.region_modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity .25s ease;
}
.region_modal.is-visible {
	opacity: 1;
}
.region_modal_backdrop {
	position: absolute;
	inset: 0;
	background: rgba(38, 38, 38, .6);
}
.region_modal_card {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: 90%;
	max-width: 520px;
	padding: 2em 2em 1.6em;
	background: #fff;
	color: #262626;
	box-shadow: 0 10px 40px rgba(0, 0, 0, .3);
	transform: translateY(14px);
	transition: transform .25s ease;
}
.region_modal.is-visible .region_modal_card {
	transform: translateY(0);
}
.region_modal_close {
	position: absolute;
	top: .4em;
	right: .5em;
	width: 1.6em;
	height: 1.6em;
	padding: 0;
	border: 0;
	background: transparent;
	color: #8a8a8a;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}
.region_modal_close:hover {
	color: #262626;
}
.region_modal_title {
	margin: 0 0 1.1em;
	font-size: 1.4rem;
	font-weight: 600;
	color: #262626;
}
.region_modal_choices {
	display: flex;
	gap: 1em;
}
.region_choice {
	position: relative;
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .55em;
	padding: 1.2em .8em;
	border: 1.5px solid #e2e2e2;
	color: #262626;
	text-decoration: none;
	transition: border-color .2s, box-shadow .2s;
}
.region_choice:hover {
	border-color: #c90c0f;
}
.region_choice.is-suggested {
	border-color: #c90c0f;
	box-shadow: inset 0 0 0 1px #c90c0f;
}
.region_choice_flag {
	width: 84px;
	height: 56px;
	display: block;
	border: 1px solid #e2e2e2;
	overflow: hidden;
}
.region_choice_flag svg {
	display: block;
	width: 100%;
	height: 100%;
}
.region_choice_region {
	font-weight: 600;
}
.region_choice_domain {
	font-size: .875rem;
	color: #c90c0f;
}
.region_choice_text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .15em;
}
.region_choice_badge {
	position: absolute;
	top: -.75em;
	padding: .2em .6em;
	background: #c90c0f;
	color: #fff;
	font-size: .68rem;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.region_choice_badge.is-current {
	background: #6b7783;
}
.region_modal_note {
	margin: 0 0 1.4em;
	font-size: .9rem;
	line-height: 1.5;
	color: #555;
}
@media (max-width: 550px) {
	.region_modal_card {
		width: 94%;
		padding: 1.5em 1.15em 1.2em;
	}
	.region_modal_title {
		margin-bottom: .5em;
		font-size: 1.2rem;
	}
	.region_modal_note {
		margin-bottom: 1em;
		font-size: .85rem;
	}
	.region_modal_choices {
		flex-direction: column;
		gap: .6em;
	}
	.region_choice {
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		gap: .9em;
		padding: .85em 1em;
	}
	.region_choice_flag {
		flex: 0 0 auto;
		width: 60px;
		height: 40px;
	}
	.region_choice_text {
		align-items: flex-start;
	}
	.region_choice_region {
		font-size: .95rem;
	}
	.region_choice_domain {
		font-size: .8rem;
	}
	.region_choice_badge {
		top: 50%;
		right: .7em;
		padding: .18em .5em;
		font-size: .6rem;
		transform: translateY(-50%);
	}
}
