/*
	Theme Name: EUCHNER Base Theme
	Theme URI: https://www.it-em.de
	Description: Base Theme for EUCHNER
	Version: 0.0.3
	Author: Sven Evers
*/


/*! normalize.css v2.1.3 | MIT License | git.io/normalize */


/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */


/**
 * Correct `block` display not defined in IE 8/9.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}


/**
 * Correct `inline-block` display not defined in IE 8/9.
 */

audio,
canvas,
video {
    display: inline-block;
}


/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}


/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */

[hidden],
template {
    display: none;
}


/* ==========================================================================
   Base
   ========================================================================== */


/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-family: sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}


/**
 * Remove default margin.
 */

body {
    margin: 0;
}


/* ==========================================================================
   Links
   ========================================================================== */


/**
 * Remove the gray background color from active links in IE 10.
 */

a {
    background: transparent;
}


/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */

a:focus {
    outline: thin dotted;
}


/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}


/* ==========================================================================
   Typography
   ========================================================================== */


/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}


/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */

abbr[title] {
    border-bottom: 1px dotted;
}


/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */

b,
strong {
    font-weight: bold;
}


/**
 * Address styling not present in Safari 5 and Chrome.
 */

dfn {
    font-style: italic;
}


/**
 * Address differences between Firefox and other browsers.
 */

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}


/**
 * Address styling not present in IE 8/9.
 */

mark {
    background: #ff0;
    color: #000;
}


/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */

code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    font-size: 1em;
}


/**
 * Improve readability of pre-formatted text in all browsers.
 */

pre {
    white-space: pre-wrap;
}


/**
 * Set consistent quote types.
 */

q {
    quotes: "\201C""\201D""\2018""\2019";
}


/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
    font-size: 80%;
}


/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}


/* ==========================================================================
   Embedded content
   ========================================================================== */


/**
 * Remove border when inside `a` element in IE 8/9.
 */

img {
    border: 0;
}


/**
 * Correct overflow displayed oddly in IE 9.
 */

svg:not(:root) {
    overflow: hidden;
}


/* ==========================================================================
   Figures
   ========================================================================== */


/**
 * Address margin not present in IE 8/9 and Safari 5.
 */

figure {
    margin: 0;
}


/* ==========================================================================
   Forms
   ========================================================================== */


/**
 * Define consistent border, margin, and padding.
 */

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}


/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
}


/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */

button,
input,
select,
textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 2 */
    margin: 0;
    /* 3 */
}


/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}


/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */

button,
select {
    text-transform: none;
}


/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"],

/* 1 */

input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    /* 2 */
    cursor: pointer;
    /* 3 */
}


/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
    cursor: default;
}


/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}


/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    /* 2 */
    box-sizing: content-box;
}


/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}


/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}


/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
    overflow: auto;
    /* 1 */
    vertical-align: top;
    /* 2 */
}


/* ==========================================================================
   Tables
   ========================================================================== */


/**
 * Remove most spacing between table cells.
 */

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/*------------------------------------*\
    MAIN
\*------------------------------------*/

body>table.techdata {
    display: none;
}


/* global box-sizing */

*,
*:after,
*:before {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}


/* html element 62.5% font-size for REM use */

html {
    font-size: 62.5%;
}

body,
.fancybox-slide p,
.fancybox-container {
    font: 400 15px/1.4 'EUCHNER-regular', Helvetica, Arial, sans-serif;
    color: #666666;
}

body {
    overflow-y: scroll;
}


/* clear */

.clear:before,
.clear:after {
    content: ' ';
    display: table;
}

.clear:after {
    clear: both;
}

.clear {
    *zoom: 1;
}

a {
    color: #666666;
    text-decoration: none;
}

a:hover {
    color: #666666;
    text-decoration: none;
}

a:focus {
    outline: 0;
}

a:hover,
a:active {
    outline: 0;
}

input:focus {
    outline: 0;
    border: 1px solid #04A4CC;
}

p {
    margin-bottom: 2rem;
}

.background-grey {
    background-color: #f6f6f6;
}

.fullwidth-grey {
    background-color: #f6f6f6;
    min-height: calc( 100vH - 400px);
}

.list-unstyled,
.list-unstyled li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-bottom-50 {
    margin-bottom: 50px;
}

.margin-bottom-100 {
    margin-bottom: 100px;
}

.width-100 {
    width: 100%;
}

.width-200px {
    width: 200px;
}

.fullwidth-grey.products {
    min-height: calc( 100vH - 400px);
}

.fullwidth-grey.home {
    min-height: calc( 100vH - 900px);
}

.icon-404 {
    font-size: 120px;
    color: #efefef;
}

#proxy {
    position: absolute;
    margin-top: -20px;
}

.emph-bold {
    font-weight: 600;
}


/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/


/* wrapper */

.wrapper {
    margin: 0 auto;
    position: relative;
    min-height: calc( 100vH - 260px);
}


/* header */

.header {
    position: relative;
    z-index: 101;
}


/* logo */

.logo {
    width: 200px;
    height: 70px;
    margin-top: 30px;
    margin-bottom: 0px;
    margin-left: auto;
}

.logo-img {}


/* nav */

.nav {}


/* sidebar */

.sidebar {}


/* footer */

.footer {
    /*
    margin-top: 30px;
	*/
    padding-top: 30px;
    background-color: #e0e0e0;
    min-height: 200px;
    /*position: absolute;
	bottom: 0;
	width: 100%;
	*/
}

.footer h3 {
    margin-bottom: 15px;
}

.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 99;
    width: 100%;
}

.overlay.active {
    display: block;
}

#content-spacer {
    height: 45px;
}

main {
    padding-bottom: 50px;
}


/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/

@font-face {
    font-family: "EUCHNER-regular";
    src: url("../fonts/euchner-regular.eot?#iefix");
    src: url("../fonts/euchner-regular.eot?#iefix") format("eot"), url("../fonts/euchner-regular.woff2") format("woff2"), url("../fonts/euchner-regular.woff") format("woff"), url("../fonts/euchner-regular.ttf") format("truetype"), url("../fonts/euchner-regular.svg#euchner-regular") format("svg");
}

@font-face {
    font-family: "EUCHNER-bold";
    src: url("../fonts/euchner-bold.eot?#iefix");
    src: url("../fonts/euchner-bold.eot?#iefix") format("eot"), url("../fonts/euchner-bold.woff2") format("woff2"), url("../fonts/euchner-bold.woff") format("woff"), url("../fonts/euchner-bold.ttf") format("truetype"), url("../fonts/9937da80-c9ad-405a-b7ad-ed7552fbc86a.svg#euchner-bold") format("svg");
}

h1 {
    font-family: EUCHNER-regular, Arial, Helvetica;
    color: #d30132;
    font-size: 26px;
    line-height: 26px;
    margin-bottom: 25px;
    font-weight: 200;
    text-transform: uppercase;
    hyphens: auto;
}

h1:before {
    content: '';
    display: block;
    width: 46px;
    height: 5px;
    margin: 0 0 21px;
    background-color: #d30132;
}

.euchner-intext-icon {
    margin-right: 10px;
    color: #999999;
}

ul.euchner,
.product-details ul,
.product-description-border ul,
.news-content ul {
    list-style-type: none;
    padding-left: 20px;
}

ul.euchner li:before,
.product-details li:before,
.product-description-border li:before,
.news-content li:before {
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 900;
    content: "\f0da";
    margin: 0 8px 0 -15px;
    color: #999999;
}

ul.euchner li,
.product-details li,
.news-content li {
    margin-bottom: 1rem;
}

ul.euchner-narrow li,
.product-description-border li {
    margin-bottom: 0;
}

.small {
    font-size: 13px;
}

.text-justify ul {
    text-align: left;
}


/*------------------------------------*\
    Images
\*------------------------------------*/

img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

figcaption {
    box-shadow: 0 7px 22px rgba(19, 19, 19, .08);
    padding: 10px;
}

figcaption p {
    margin: 0;
    padding: 0;
}

.image-news {
    padding: 10px;
    box-shadow: 0 7px 22px rgba(19, 19, 19, .08);
}

.image-news img {
    display: block;
    margin: auto;
}

.main-image-container {
    width: 100%;
    /* TODO */
    overflow: hidden;
    text-align: center;
}

.main-image-container-small {
    max-height: 250px;
}

.main-image-container-large {
    max-height: 350px;
}

.main-image-container-extralarge {
    height: 500px;
}

.main-image-container-small img,
.main-image-container-large img {
    min-width: 100%;
}


/*------------------------------------*\
    Red box in header images
\*------------------------------------*/

.red-box {
    padding: 10px;
    background-color: #d30132;
    color: #ffffff;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.45);
    font-size: 18px;
    width: 100%;
    text-align: left;
}

.red-box-small {
    width: 95%;
}

.red-box-subline {
    font-size: 14px;
}

.red-box-container-small {
    height: 100px;
    margin-top: -100px;
}

.red-box-container-large {
    height: 125px;
    margin-top: -125px;
}

.red-box-slider {
    margin-top: 550px;
}


/*------------------------------------*\
    Buttons
\*------------------------------------*/

.btn-euchner,
.btn-euchner-small {
    display: inline-block;
    background-color: #aaa;
    color: white;
    position: relative;
    transition: all .25s ease!important;
    vertical-align: middle;
    border-radius: 0;
}

.btn-euchner {
    padding: 10px 10px 10px 25px;
    font-size: 15px;
}

.btn-euchner-small {
    padding: 5px 5px 5px 5px;
    font-size: 13px;
}

.btn-euchner:hover,
.btn-euchner-small:hover {
    background-color: #d30132;
    color: white;
}

.btn-euchner:after {
    display: block;
    position: absolute;
    left: 10px;
    top: 25%;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 900;
    content: "\f0d7";
    font-size: 15px;
}

.btn-euchner.collapsed:after {
    content: "\f0da";
}

.btn-euchner:focus,
.btn-euchner-small:focus {
    box-shadow: none;
}

.btn-reset {}


/*------------------------------------*\
    Footer
\*------------------------------------*/

.footer {
    font-size: 13px;
    left: 0;
    right: 0;
    bottom: 0;
}

.footer-sticky {
    position: fixed;
}

.widget-footer {
    margin-bottom: 30px;
}

.widget-footer ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.widget-footer .current_page_parent,
.widget-footer .current-menu-item,
.widget-footer .current-menu-parent,
.widget-footer .nav>ul>li.current-page-ancestor {
    background-color: transparent !important;
}

.dl-euchner dt,
#footer-column-1 dt,
#footer-column-2 dt,
#footer-column-3 dt,
#footer-column-4 dt {
    float: left;
    clear: left;
    width: 25px;
}

.dl-euchner dd,
#footer-column-1 dd,
#footer-column-2 dd,
#footer-column-3 dd,
#footer-column-4 dd {
    margin: 0 0 0 25px;
    padding: 0 0 0.5em 0;
}

.pl-35 {
    padding-left: 36px;
}


/*------------------------------------*\
    Scroll to top arrow
\*------------------------------------*/

.arrow-top-holder {
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: all 0.2s linear 0s;
    color: #cccccc;
    z-index: 1000;
    border: 3px solid #cccccc;
    padding: 4px 12px;
    font-size: 24px;
    display: none;
}

.arrow-top-holder:hover {
    cursor: pointer;
    color: white;
    background-color: #d30132;
    border-color: #d30132;
}


/*------------------------------------*\
    Navigation
\*------------------------------------*/

#container-navigation {
    width: 100%;
    background-color: #ffffff;
    border-bottom: 1px solid #d30132;
    height: 42px;
}

.home #container-navigation {
    border-bottom: 1px solid #f6f6f6;
}

#container-navigation .container .row {
    margin-left: -15px;
}

.sticky-nav {
    position: fixed;
    top: 0px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .25);
}

#logo-sticky {
    float: right;
    margin-top: 8px;
    display: none;
}

.logo-sticky {
    display: none;
}

#logo-sticky-left {
    margin-top: 8px;
    display: none;
}

#logo-print {
    height: 60px;
}


/*
Too hard
.sticky-nav #logo-sticky{
	display: block;
}
*/

.nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.nav ul>li {
    position: relative;
    float: left;
}

.nav>ul>li a {
    text-transform: uppercase;
}

.nav>ul>li ul.sub-menu a {
    text-transform: none;
    white-space: nowrap;
}

.nav a {
    transition: all .25s ease!important;
    font-size: 16px;
    height: 42px;
    padding: 9px 20px;
    color: #777777;
    position: relative;
    display: block;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    line-height: 1em;
}

.nav>ul>li.current-menu-item>a,
.nav>ul>li.current-menu-parent>a,
.nav>ul>li.current-page-ancestor>a {
    color: #ffffff;
}

.nav>ul>li.current-menu-item>a:after,
.nav>ul>li.current-menu-parent>a:after,
.nav>ul>li.current-page-ancestor>a:after {
    border-color: #ffffff transparent transparent;
}

.current_page_parent,
.current-menu-item,
.current-menu-parent,
.nav>ul>li.current-page-ancestor {
    background-color: #d30132 !important;
}

.sub-menu .current-active-menu-item {
    border-left: 4px solid #d30132 !important;
}

.nav>ul>li ul.sub-menu>li.current-active-menu-item a,
.nav>ul>li ul.sub-menu>li.current-menu-item a {
    background-color: white;
    color: #777 !important;
    padding: 9px 14px;
}

.nav>ul>li.menu-item-has-children>a {
    padding-right: 25px;
}

.nav>ul>li.menu-item-has-children>a:after {
    display: block;
    position: absolute;
    right: 10px;
    top: 25%;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 900;
    content: "\f0d7";
    font-size: 12px;
}

.nav-response-after {
    display: block;
    position: absolute;
    right: 0px;
    top: 0;
    height: 42px;
    width: 30px;
    z-index: 100;
}

.menu-item-has-children>a:after {
    border-color: #777 transparent transparent;
}

.nav>ul>li ul.sub-menu {
    position: absolute;
    top: 105%;
    left: 0;
    background: #fff;
    list-style: none;
    padding: 12px 0;
    margin: 0;
    min-width: 220px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .3);
    visibility: hidden;
    opacity: 0;
    z-index: 1;
    max-width: 400px;
}

.nav>ul>li:hover>ul.sub-menu {
    top: 100%;
    visibility: visible;
    opacity: 1;
}

.nav>ul>li ul.sub-menu>li {
    position: relative;
    width: 100%;
}

.nav>ul>li ul.sub-menu>li>a:hover {
    background-color: #d30132;
    color: white !important;
}

.nav>ul>li:before {
    top: 0px;
    background-color: #D30132;
    left: 0px;
    right: 0px;
    display: block;
    position: absolute;
    height: 4px;
    opacity: 0;
    visibility: hidden;
    content: '';
    transition: all .25s ease!important;
}

.nav>ul>li:hover:before {
    opacity: 1;
    visibility: visible;
    top: 0;
}


/*------------------------------------*\
    Search and language icon
\*------------------------------------*/

.menu-item-special {
    height: 42px;
    padding: 14px 10px 7px;
    margin-left: 5px;
}

.menu-item-special:hover:before {
    visibility: hidden !important;
}

.menu-item-search {
    cursor: pointer;
    color: #888888;
    font-weight: 600;
    padding: 0;
}

.menu-search-wrapper {
    background-color: #f6f6f6;
    padding: 5px;
    width: 170px;
    margin-top: 4px;
    margin-left: 6px;
}

.sub-menu-language,
.slideout-menu-language {
    width: 41px !important;
    min-width: 41px !important;
}

.sub-menu-language a,
.slideout-menu-language a {
    padding: 9px 10px;
}

.menu-item-language>.flag-icon {
    filter: grayscale(90%);
    opacity: 0.5;
    transition: all .25s ease!important;
}

.flag-icon-current {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.menu-item-language:hover>.flag-icon {
    filter: grayscale(0%);
    opacity: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.sub-menu-language .flag-icon,
.slideout-menu-language .flag-icon {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

#search {
    padding-right: 12px;
    padding-left: 13px;
}

#menu-search {
    height: 26px;
    width: 134px;
    font-size: 13px;
    background-color: white;
}

#menu-item-search-submit {
    height: 26px;
    width: 26px;
    padding: 2px;
    position: relative;
}


/*------------------------------------*\
   Tabs
\*------------------------------------*/

.nav-tabs .nav-item {
    margin-top: 10px;
}

.nav-tabs .nav-link,
.nav-tabs .nav-link:hover {
    border-radius: 0;
    margin-right: 10px;
    border: 1px solid #aaaaaa;
    background-color: #aaaaaa;
    color: white;
    line-height: normal;
}

.nav-tabs .nav-link.active,
.nav-link:focus {
    border: 1px solid #d30132;
    background-color: #d30132;
    color: white;
}

#productTabContent .tab-pane {
    min-height: calc(100vh - 450px);
}


/*------------------------------------*\
    Breadcrumps
\*------------------------------------*/

.breadcrumps {
    font-size: 13px;
    padding-top: 15px;
    min-height: 40px;
    margin-bottom: 20px !important;
}

.breadcrumb-delimiter {
    margin-left: 7px;
    margin-right: 5px;
}


/*------------------------------------*\
    Pagination
\*------------------------------------*/

.pagination ul {
    position: relative;
    margin: 20px 0 0 0;
    padding: 0;
}

.pagination ul li {
    box-sizing: border-box;
    float: left;
    height: 30px;
    width: 30px;
    border: 0px none rgb(102, 102, 102);
    list-style: none outside none;
    margin: 0px 11px 0px 0px;
    list-style: none outside none;
}

.pagination ul li .current {
    box-sizing: border-box;
    color: #ffffff;
    display: flex;
    height: 30px;
    min-width: 30px;
    width: 30px;
    background-color: #d30132;
    border: 2px solid #d30132;
    align-items: center;
    justify-content: center;
    text-align: left;
}

.pagination ul li a {
    box-sizing: border-box;
    color: #e0e0e0;
    display: flex;
    height: 30px;
    min-width: 30px;
    text-align: left;
    text-decoration: none;
    width: 30px;
    align-items: center;
    justify-content: center;
    border: 2px solid #e0e0e0;
}

.pagination ul li a:hover {
    border-color: #d30132;
    background-color: #d30132;
    color: #ffffff;
}


/*------------------------------------*\
    Slideshow
\*------------------------------------*/

.slideshow-wrapper {
    display: block;
    position: relative;
}

.slideshow {
    position: relative;
    display: block;
}

.slideshow-starter {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    color: #ffffff;
    height: 100px;
    width: 100px;
    font-size: 100px;
    line-height: 0;
    pointer-events: none;
    transition: all .25s ease !important;
}

.slideshow-wrapper:hover .slideshow-starter {
    color: #d30132;
}


/*------------------------------------*\
    Video
\*------------------------------------*/

.video-starter {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    color: #ffffff;
    height: 50px;
    width: 50px;
    font-size: 50px;
    line-height: 0;
    pointer-events: none;
    padding: 0px;
    transition: all .25s ease !important;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 50px;
}

.tile-products:hover .video-starter,
.product-video-holder:hover .video-starter {
    color: #d30132;
}


/*------------------------------------*\
    PAGES
\*------------------------------------*/


/* HOME */

.container-home-grey {
    background-color: #f6f6f6;
}

.carousel-item {
    /*height: 350px;*/
    overflow: hidden;
    height: 500px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.attachment-euchner-news-home {
    margin: 0 0 20px 0;
    display: block;
}

.attachment-euchner-slider {
    width: 100%;
}

.carousel-control-next,
.carousel-control-prev {
    width: 10%;
}

.carousel-fade .carousel-item {
    opacity: 0;
    transition-duration: .6s;
    transition-property: opacity;
}

.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
    opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
    opacity: 0;
}

.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
    transform: translateX(0);
    transform: translate3d(0, 0, 0);
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    width: 40px;
    height: 40px;
}

.white-box-container {
    width: 100%;
    /*background-color: rgba(211, 1, 50, 0.8);*/
    background-color: rgba(222, 1, 50, 0.93);
    height: 105px;
    margin-top: 395px;
    text-align: left;
}

.white-box-slider {
    width: 100%;
    height: 105px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.white-box-headline {
    font-family: EUCHNER-bold, Helvetica, Arial, sans-serif;
    color: white;
    font-size: 35px;
    line-height: 40px;
    width: 100%;
}

.white-box-subline {
    color: white;
    font-size: 35px;
    line-height: 40px;
    width: 100%;
}

.pseudolink:hover {
    cursor: pointer;
}


/* History */

.history {}

.history-item {
    display: list-item;
    position: relative;
    margin-bottom: 45px !important;
}

ul .history-item:last-child .history-year:before {
    display: none;
}

.history-year {
    font-size: 30px;
    font-weight: 300;
    margin-right: 42px;
    vertical-align: middle;
    display: inline-block;
    /*position: absolute;*/
}

.history-year:before {
    position: absolute;
    content: '';
    display: block;
    background-color: #ddd;
    width: 5px;
    height: 90%;
    top: 48px;
    left: 1.20em;
    z-index: -1;
}

.history-headline {
    display: inline-block;
    max-width: 500px;
    vertical-align: middle;
    margin-bottom: 0;
}

.history-description {
    margin-left: 122px;
    display: block;
}


/*News*/

.container-news {
    margin: 0 0 25px 0;
    padding: 15px;
    box-shadow: 0 1px 5px rgba(19, 19, 19, 0.33);
    border-radius: 0.15em;
    background-color: #fff;
}

.row-news {
    margin-left: -30px;
}

.news-downloads {
    margin-bottom: 20px;
}

.news-headline {
    font-size: 18px;
    min-height: 40px;
    font-weight: 900;
    margin-bottom: 15px;
}

.tile-news {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    transition: all .25s ease!important;
    /*float: left;*/
    height: 100%;
    /*height: 260px;*/
    margin-bottom: 23px;
    /*margin-right: 23px;*/
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    background-color: #ffffff;
    overflow: hidden;
}

.tile-news:hover {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

#newsTabContent {
    background-color: #f6f6f6;
    padding: 10px;
    margin-top: 0;
}

.download-button {
    display: inline-block;
    /*background-color: #aaa;*/
    color: #666666;
    padding: 10px 10px 10px 25px;
    position: relative;
    transition: all .25s ease!important;
    vertical-align: middle;
    /*width: 250px;
    max-width: 100%;*/
}

.download-button:after {
    display: block;
    position: absolute;
    left: 0px;
    top: 10px;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 900;
    font-size: 15px;
}

.download-button-file:after {
    content: "\f019";
}

.download-button-external:after {
    content: "\f35d";
}

.download-button-internal:after {
    content: "\f343";
}

.download-button-pdf:after {
    content: "\f1c1";
    font-weight: 400;
}

.download-button:hover {
    /*background-color: #d30132;*/
    color: #d30132;
    cursor: pointer;
}

.download-image {
    border: 1px solid #dddddd;
}

.news-link,
.link-button {
    display: inline-block;
    background-color: #aaa;
    color: white;
    padding: 10px 10px 10px 25px;
    position: relative;
    transition: all .25s ease!important;
    vertical-align: middle;
}

.news-link:after,
.link-button:after {
    display: block;
    position: absolute;
    left: 10px;
    top: 23%;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 900;
    content: "\f0da";
    font-size: 15px;
}

.news-link:hover,
.link-button:hover {
    background-color: #d30132;
    color: white;
    cursor: pointer;
}

.news-tile {
    display: flex;
    flex-direction: column;
}

.news-overview .news-tile {
    padding-bottom: 6rem!important;
}

.news-teaser {
    margin-bottom: auto;
}

.news-link-wrapper {
    margin-top: auto;
}

.news-date {
    font-size: 13px;
}

.fixed-height {
    height: 120px;
}


/* Courses */

.courses-row {
    padding-top: 25px;
    padding-bottom: 25px;
    border-top: 1px solid #dddddd;
    box-shadow: 5px 0 20px transparent;
    transition: all .25s ease!important;
}

.course-link,
.list-link {
    position: relative;
    display: block;
}

.course-link:before,
.list-link:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: -1px;
    bottom: 0;
    width: 5px;
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 0;
    background-color: #d30132;
    transition: all .25s ease!important;
    box-sizing: border-box;
}

.course-link:hover:before,
.list-link:hover:before,
.list-link:focus:before,
.list-link:active:before {
    transform: scale(1);
    opacity: 1;
}

.course-link:hover .courses-row,
.list-link:hover .list-row,
.list-link:focus .list-row,
.list-link:active .list-row {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    border-top-color: transparent;
}

.course-link:hover+.course-link .courses-row,
.list-link:hover+.list-link .list-row,
.list-link:focus+.list-link .list-row,
.list-link:active+.list-link .list-row {
    border-top-color: transparent;
}

.attachment-euchner-course {
    max-height: 150px;
    max-width: 150px;
}

.border-top {
    border-top: 1px solid #dddddd;
}


/* Contact */

.contact dd {
    margin: 0 0 0 25px;
    padding: 0 0 0.5em 0;
}

.contact dt {
    float: left;
    clear: left;
    width: 25px;
}


/*------------------------------------*\
    Forms
\*------------------------------------*/

input[type=date],
input[type=text],
input[type=email],
input[type=password],
input[type=tel],
input[type=number],
input[type=search],
select,
textarea {
    width: 100%;
    font-size: 15px;
    color: #777;
    background: #efefef;
    border: 0;
    /*border: 3px solid #efefef;*/
    box-shadow: none!important;
    outline: 0!important;
    padding: 0px 10px 0px 10px;
    height: 44px;
    transition: none;
    border-radius: 0;
    vertical-align: top;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-sizing: border-box;
}

textarea {
    border: 3px solid #efefef;
    min-height: 163px;
}

.euchner-textarea {
    padding-top: 5px;
    padding-bottom: 5px;
}

button[type=submit]:not(.btn),
input[type=submit]:not(.btn),
.submit {
    border: none;
    color: #fff;
    font-size: 13px;
    padding: 10px 22px;
    font-weight: 900;
    display: inline-block;
    box-shadow: none!important;
    outline: 0!important;
    transition: all .25s ease!important;
    background-color: #aaa;
}

button[type=submit]:not(.btn):hover,
input[type=submit]:not(.btn):hover,
.submit:hover {
    background-color: #d30132;
}

.euchner-contact-form {
    transition: all .25s ease!important;
}

.form-message {
    display: none;
    padding: 10px;
    margin: 0 0 30px 0;
}

.form-message-required,
.form-message-error {
    color: white;
    background-color: #d30132;
}

.form-message-success {
    padding: 0px;
}

.form-missing {
    border: 3px solid #d30132 !important;
}

.form-missing-label {
    color: #d30132 !important;
}


/*------------------------------------*\
    Tiles
\*------------------------------------*/

.tile {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    transition: all .25s ease!important;
    padding-top: 100%;
    width: 100%;
    position: relative;
    background-color: #ffffff;
}

.tile .inner {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px;
}

.tile:hover {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.tile img {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.tile:before,
.tile-products:before,
.tile-news:before {
    content: '';
    top: 0px;
    background-color: #D30132;
    display: block;
    position: absolute;
    left: var(--ani-distance);
    right: calc(15px + var(--ani-distance));
    height: 1px;
    opacity: 0;
    visibility: hidden;
    box-sizing: border-box;
    transition: all .25s ease!important;
}

.tile:hover:before,
.tile-products:hover:before,
.tile-news:hover:before {
    content: '';
    left: 0px;
    right: 0px;
    height: 4px;
    opacity: 1;
    visibility: visible;
    transition: all .25s ease!important;
}

.tile,
.tile-products,
.tile-news {
    --ani-distance: 15px;
}

.clear_left {
    clear: left;
}

.tile-headline {
    margin-bottom: 20px;
}

.lang-cs-cz #tile-59afee630f780 .tile-text {
    font-size: 14px;
}


/*------------------------------------*\
    PRODUCTS
\*------------------------------------*/

.tile-products {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    transition: all .25s ease!important;
    /*float: left;*/
    width: 260px;
    height: 260px;
    margin-bottom: 23px;
    /*margin-right: 23px;*/
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    background-color: #ffffff;
}

.tile-products:hover {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.tile-text {
    position: absolute;
    bottom: 0;
    height: 64px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    left: 0;
    right: 0;
    text-align: center;
    vertical-align: bottom;
}

.tile-image-holder {
    margin-top: 0px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 10px;
    position: relative;
}

.tile-image-holder img {
    margin: 0;
}

.tile-image {
    max-width: 250px;
    max-height: 150px;
}

.product-list-image {
    margin: auto;
    display: block;
}

.product-main-features {
    background-color: #f6f6f6;
}

.product-main-image {
    max-height: 400px;
    margin: auto;
    display: block;
}

.product-description-border {
    margin-bottom: 40px;
}

.product-description-border:after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 15px;
    right: 15px;
    height: 1px;
    background-color: #dee2e6;
}

.product-description-border p:last-child {
    margin-bottom: 0;
}

.inline-img div {
    display: inline-block;
}

.product-print {
    margin-top: 40px;
    font-size: 26px;
    float: right;
    color: #aaaaaa;
    margin-left: 10px;
}

.product-print:hover {
    cursor: pointer;
    color: #d30132;
}

.product-main-image-holder {
    box-shadow: 0 0 12px rgba(19, 19, 19, .28);
    background-color: white;
    /*height: 100%;*/
    padding: 10px;
}

.product-additional-image {
    box-shadow: 0 0 12px rgba(19, 19, 19, .28);
    width: 260px;
    height: 260px;
    float: left;
    margin-bottom: 23px;
    margin-right: 23px;
    position: relative;
    background-color: #ffffff;
    transition: all .25s ease!important;
}

.border-light-grey {
    border-top: 1px solid #dee2e6;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
}

.techdata {
    width: 100%;
}

.techdata td,
.product-downloads td {
    padding: 4px 10px 4px 4px;
    vertical-align: top;
    border-bottom: 0;
    line-height: 22px;
}

.product-description-table-holder table td,
.product-description-table-holder table th {
    padding: 5px;
    border: 1px solid #dee2e6;
    vertical-align: top;
}

.product-description-table-holder table th {
    background-color: #f6f6f6;
}

.product-description-table-holder table th p {
    margin-bottom: 0;
}

.product-description-table-holder table td:first-child {
    width: 180px;
    padding-right: 20px;
}

.products h2 {
    text-transform: none;
}

.approvals {
    background-color: #f6f6f6;
    padding: 10px;
}

.approvals img {
    max-height: 60px;
    margin-right: 20px;
}

.techdata-details-even,
.downloads-details-odd {
    background-color: #f6f6f6;
}

.techdata-details-odd,
.downloads-details-even {
    background-color: #ffffff;
}

.product-downloads table {
    width: 100%;
    margin-bottom: 80px;
}

.product-downloads table:last-child {
    margin-bottom: 20px;
}

.product-downloads table td,
.product-downloads table th {
    text-align: center;
}

.product-downloads table td:first-child {
    width: 60%;
    text-align: left;
}

.product-downloads table td:nth-child(2) {
    width: 10%;
}

.product-downloads table td:nth-child(3) {
    width: 10%;
}

.product-downloads table td:nth-child(4) {
    width: 10%;
}

.product-downloads table td:nth-child(5) {
    width: 10%;
}

.product-downloads img {
    filter: grayscale(90%);
}

.product-downloads tr:hover img {
    filter: grayscale(0%);
}

.product-downloads h2 {
    margin-bottom: 20px;
}

.product-downloads .card-body {
    padding-top: 20px;
}

#techdata .techdata .techdata-details-parameter {
    width: 40%;
}

#techdata .techdata .wert {
    width: 60%;
}

.zusatz_parameter {
    text-align: right;
    padding-right: 10px;
}

.product-downloads table {
    width: 100%;
}

.wimTextTable td {
    vertical-align: top;
    padding-bottom: 5px;
}

.wimTextTable tr td:first-child {
    padding-right: 10px;
}

.wimEntryImg {
    display: block;
    margin: auto;
    max-width: 150px;
}

.wimEntryImg:hover,
.fancybox:hover {
    cursor: pointer;
}

.wimEntrySymbol {
    display: inline;
    max-height: 20px;
}

.product-details-columns {
    column-count: 2;
    column-gap: 30px;
}

.table-fullwidth table {
    min-width: 100%;
}

.product-video-holder {
    margin-top: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0px;
    margin-right: 0px;
    position: relative;
}

.inline-symbol {
    width: 20px;
    margin-left: 5px;
    margin-right: 5px;
}


/*------------------------------------*\
    PRODUCT COMPARISON
\*------------------------------------*/

#comparison {
    width: max-content;
}

#comparison td {
    width: 370px;
}


/*------------------------------------*\
    DOCUMENTS
\*------------------------------------*/

#document-result {
    min-height: 200px;
}


/*------------------------------------*\
    Tooltips
\*------------------------------------*/

.tooltip {
    opacity: 1 !important;
    filter: alpha(opacity=100);
}

.toolip-trigger {
    width: 20px;
    height: 20px;
    font-size: 15px;
    display: inline-block;
    color: #aaaaaa;
}

.tooltip-inner {
    max-width: 300px;
    padding: 10px;
    color: #fff;
    text-align: center;
    background-color: #aaaaaa;
    border-radius: .25rem;
    font-size: 15px;
}

.tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow::before,
.tooltip.bs-tooltip-bottom .arrow::before {
    margin-left: -3px;
    content: "";
    border-width: 0 5px 5px;
    border-bottom-color: #aaaaaa;
}

.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before,
.tooltip.bs-tooltip-top .arrow::before {
    margin-left: -3px;
    content: "";
    border-width: 5px 5px 0;
    border-top-color: #aaaaaa;
}


/*------------------------------------*\
    Modals
\*------------------------------------*/

.modal-dialog {
    max-width: 70%;
    max-height: 70%;
}

.modal-open,
.fancybox-active {
    padding-right: 0px !important;
    overflow-y: scroll !important;
}

.modal-header {
    border-bottom: 0px;
}

.modal-content {
    border: 0;
    border-radius: 0;
}

#imageModal {
    display: none;
    width: auto;
    padding: 0;
}

#imageModalContent {
    margin: 0 auto;
    padding: 20px;
}

#imageModalContent img {
    max-width: 80vW;
    max-height: 80vH;
}

.legend {
    margin-top: 10px;
}

.legend td {
    padding-right: 10px;
}

.modal-header .close {
    margin: -10px -5px;
}

.modal-header .close:focus {
    outline: none;
}

.compensate-for-scrollbar {
    margin-right: 0 !important;
}

.fancybox-slide--inline.fancybox-slide>* {
    vertical-align: top;
}

.fancybox-bg {
    background-color: #666666;
}

.contentModal {
    display: none;
    min-width: 400px;
    max-width: 600px;
    min-height: 200px;
}

.tile-modal-image {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 15px;
}

.fancybox-close-small:focus:after {
    outline: none;
}


/*------------------------------------*\
    Search Modal
\*------------------------------------*/

#searchField {
    width: calc(100% - 60px);
}

#searchModal {
    display: none;
    max-width: 1100px;
    padding: 0;
    height: calc(100vH - 100px);
}

.close,
.fancybox-close-small:after {
    font-family: 'EUCHNER-regular', Helvetica, Arial, sans-serif;
    font-weight: 700;
    color: #aaa;
    font-size: 40px;
    text-shadow: none;
    background-color: white !important;
    padding: 3px 12px 0 0!important;
    opacity: 1;
}

.close:hover,
.fancybox-close-small:hover:after {
    color: #d30132;
    background: transparent;
    cursor: pointer;
    opacity: 1;
}

.inline-img div img {
    max-height: 150px;
    max-width: 150px;
    margin-bottom: 10px;
}

.inline-img.size-m div img {
    max-height: 150px;
    max-width: 150px;
}

.inline-img.size-xs div img {
    max-height: 50px;
    max-width: 50px;
}

.inline-img.size-xxl div img {
    max-height: 100%;
    max-width: 100%;
}

.inline-img h2 {
    font-size: 13px;
    margin-bottom: 2rem;
}

.search-submit {
    position: absolute;
    height: 44px;
}

.search-result {
    padding: 20px
}

.tab-content {
    margin-top: 30px;
}

.search-wrapper {
    padding: 0 10px 20px 20px;
}

.euchner-spinner {
    font-size: 50px;
    width: 100%;
    text-align: center;
    margin: 50px 0 0 0;
    color: #aaaaaa;
}

#searchTabContent .tab-pane {
    min-height: 150px
}

.search-link {
    padding-left: 30px !important;
}

.searchresultcount {
    display: inline-block;
    width: 40px;
    margin-left: 10px;
}

.modal-title {
    margin-left: 10px;
}

.search-row {
    padding-top: 15px;
    padding-bottom: 15px;
    min-height: 150px;
    border-top: 1px solid #dddddd;
    box-shadow: 5px 0 20px transparent;
    transition: all .25s ease!important;
}

.search-result-image {
    max-height: 100px;
    margin: auto;
    display: block;
}

.download-headline {
    padding-bottom: 15px;
}

.download-headline div {
    font-weight: bold;
}

.download-row {
    padding-top: 15px;
    padding-bottom: 15px;
    min-height: 50px;
    border-top: 1px solid #dddddd;
    box-shadow: 5px 0 20px transparent;
    transition: all .25s ease!important;
}

.website-row {
    padding-top: 15px;
    padding-bottom: 15px;
    min-height: 50px;
    border-top: 1px solid #dddddd;
    box-shadow: 5px 0 20px transparent;
    transition: all .25s ease!important;
}

.search-result .tab-content {
    max-height: calc(100vH - 340px);
    overflow-y: auto;
}

.search-no-result {
    text-align: center;
    font-size: 2rem;
    margin-top: 50px;
}


/*------------------------------------*\
    Slideouts
\*------------------------------------*/

#slideouts {
    position: fixed;
    right: -420px;
    top: 300px;
    width: 460px;
    height: 300px;
    z-index: 100;
    pointer-events: none;
}

#support-icon {
    box-shadow: -1px 3px 8px rgba(0, 0, 0, .3);
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 102;
}

#search-icon {
    box-shadow: -1px 3px 8px rgba(0, 0, 0, .3);
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 102;
    top: 41px;
}

#language-icon {
    box-shadow: -1px 3px 8px rgba(0, 0, 0, .3);
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 102;
    top: 82px;
}

#cart-icon {
    box-shadow: -1px 3px 8px rgba(0, 0, 0, .3);
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 102;
    top: 124px;
}

.slideout-buttons {
    background-color: #aaaaaa;
    color: white;
    padding: 7px 5px 10px 10px;
    font-size: 20px;
    pointer-events: auto;
}

.slideout-buttons:hover {
    cursor: pointer;
    background-color: #d30132;
}

#support-icon.open,
#language-icon.open,
#cart-icon.open {
    cursor: pointer;
    background-color: #d30132;
}

#cart-icon i {
    position: absolute;
}

#support-content,
#cart-content {
    padding: 10px;
    width: 220px;
    position: absolute;
    top: 0;
    left: 40px;
    z-index: 101;
    background-color: #f6f6f6;
    color: #777777;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .3);
}

#cart-content {
    width: 420px;
    min-height: 420px;
}

#language-content {
    padding: 10px;
    width: 60px;
    position: absolute;
    top: 0;
    left: 40px;
    z-index: 101;
    background-color: #f6f6f6;
    color: #777777;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .3);
}

#language-content ul.sub-menu,
.slideout-menu-language {
    list-style: none;
    padding: 0px 0;
    margin: 0;
}

#language-content ul.sub-menu li a,
.slideout-menu-language li a {
    display: block;
    pointer-events: auto;
}

#language-content ul.sub-menu>li>a:hover,
.slideout-menu-language>li>a:hover {
    background-color: #d30132;
    color: white !important;
}


/*------------------------------------*\
    Cart
\*------------------------------------*/

.cart-content-article>div {
    /*border: solid 1px black;*/
}

.cart-content-article {
    pointer-events: auto;
    background-color: white;
}

.cart-content-article>.trash-cart,
#cart-content-checkout {
    display: none;
    pointer-events: auto;
    cursor: pointer;
}

.cart-content-article img {
    max-width: 60px;
    max-height: 60px;
}

#cart-content-cart {
    pointer-events: auto;
}

#cart-content-articles,
#cart-content-thankyou {
    height: 348px;
    overflow-y: auto;
    overflow-x: hidden;
}

.cart-content-article:hover>div.trash-cart {
    display: block;
}

#cart-content-footer .btn {
    pointer-events: auto;
}

#cart-counter {
    position: relative;
    top: -10px;
    left: 10px;
    color: #aaaaaa;
    font-size: 10px;
    font-weight: bold;
}

#cart-icon.open #cart-counter {
    color: #d30132;
}


/*------------------------------------*\
    Accordeon
\*------------------------------------*/

.card {
    border-radius: 0;
    border-bottom: 0px;
}

.card-header {
    border-bottom: 0px;
    color: #d30132;
}

.card-header:hover {
    cursor: pointer;
}

.card-header:after {
    display: block;
    position: absolute;
    right: 10px;
    top: 8px;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 600;
    content: "\f0d8";
    font-size: 15px;
}

.card:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.card-header.collapsed {
    color: #666666;
}

.card-header.collapsed:after {
    display: block;
    position: absolute;
    right: 10px;
    top: 8px;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: 600;
    content: "\f0d7";
    font-size: 15px;
}

.card-body .row {
    margin-right: 0;
}


/* IE11 */

.collapse {
    height: auto;
    overflow: auto;
}


/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/


/*
* Burger menu
*/

.mbc {
    bottom: 0px;
    box-sizing: border-box;
    display: block;
    height: 4px;
    left: 0px;
    position: relative;
    right: 0px;
    top: 0px;
    width: 28px;
    column-rule-color: #d30132;
    perspective-origin: 14px 2px;
    transform-origin: 14px 2px;
    caret-color: #d30132;
    background: #d30132 none repeat scroll 0% 0% / auto padding-box border-box;
    border-radius: 2px 2px 2px 2px;
    margin: 0px 0px 5px;
    transition: top 0.3s ease 0.3s, transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
}

.trigger-responsive.active span:first-child {
    top: 10px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: top .3s 0s, -webkit-transform .3s .3s;
    transition: top .3s 0s, transform .3s .3s;
    transition: top .3s 0s, transform .3s .3s, -webkit-transform .3s .3s;
}

.trigger-responsive.active span:nth-child(2) {
    opacity: 0;
}

.trigger-responsive.active span:last-child {
    top: -8px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: top .3s 0s, -webkit-transform .3s .3s;
    transition: top .3s 0s, transform .3s .3s;
    transition: top .3s 0s, transform .3s .3s, -webkit-transform .3s .3s;
}

#container-responsive {
    z-index: 100;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0 0 10px rgba(0, 0, 0, .25);
}

.logo-responsive {
    width: 129px;
    margin: 10px auto 10px auto;
}

.trigger-responsive {
    position: absolute;
    right: 20px;
    top: 1px;
}


/* Extra small devices (portrait phones, less than 576px) */

@media only screen and (max-width:575.98px) {
    #slideouts {
        top: 80px;
    }
    .nav-tabs .nav-item,
    .submit {
        width: 100%;
    }
}


/* Small devices (landscape phones, 576px and up)*/

@media (min-width: 576px) and (max-width: 767.98px) {}

@media (max-width: 1199.98px) {
    .white-box-slider {}
    .white-box-headline {
        font-size: 30px;
        line-height: 35px;
    }
    .white-box-subline {
        font-size: 30px;
        line-height: 35px;
    }
}


/* For all small screens */

@media only screen and (max-width:991.98px) {
    #container-navigation {
        width: 290px;
        height: 100%;
        left: -290px;
        top: 0px;
        padding: 45px 0 0 0;
        position: fixed;
        box-shadow: -1px 3px 5px rgba(0, 0, 0, .2);
        border-bottom: none;
        z-index: 100;
    }
    .nav {
        padding-right: 0;
        width: 100%;
    }
    .nav-responsive {
        overflow-y: auto;
        height: calc( 100vH - 45px);
    }
    .nav ul {
        width: 100%;
    }
    .nav ul>li {
        float: none;
    }
    #container-navigation.open {
        left: 0;
        display: block;
    }
    .nav>ul>li ul.sub-menu {
        position: static;
        width: 100%;
        box-shadow: none;
        display: none;
        /*display: block;*/
    }
    /*.nav>ul>li.current-page-parent ul.sub-menu,*/
    .nav>ul>li.current-menu-item ul.sub-menu,
    .current-menu-item ul.sub-menu {
        display: block;
    }
    .nav>ul>li.open ul.sub-menu {
        display: block;
        opacity: 1;
        visibility: visible;
    }
    .nav>ul>li:hover:before {
        visibility: hidden;
    }
    .sticky-nav #logo-sticky {
        display: none;
    }
    /* Show submenus OPEN */
    .nav>ul>li.current-menu-item>a,
    .nav>ul>li.current-menu-parent>a,
    .nav>ul>li.current-page-ancestor>a {
        color: #777777;
    }
    .nav>ul>li ul.sub-menu {
        visibility: visible;
        opacity: 1;
        padding-top: 0;
        border-bottom: 1px solid #f6f6f6;
    }
    .nav>ul>li ul.sub-menu a {
        font-size: 15px;
    }
    .current_page_parent,
    .current-menu-item,
    .current-menu-parent,
    .nav>ul>li.current-page-ancestor {
        background-color: white !important;
    }
    .nav-responsive .current-menu-item>a {
        color: white !important;
        background-color: #d30132;
    }
    .nav>ul>li ul.sub-menu>li {
        padding-left: 20px;
    }
    .nav>ul>li ul.sub-menu>li>a:hover {
        background-color: transparent;
        color: #777777 !important;
    }
    /* Language switch */
    /* TODO: make this nice */
    .sub-menu-language {
        /*
        display: block !important;
        visibility: visible;
        */
        width: 100% !important;
        padding-left: 0 !important;
        border-bottom: 0 !important;
        margin-left: -20px !important;
    }
    /*
    .sub-menu-language li{
        display: inline-block;
        width: 34px !important;
    }
    */
    .flag-icon-current {
        display: none;
    }
    /* History */
    .history-description {
        margin-left: 0;
    }
    .history-year:before {
        display: none;
    }
    .product-details-columns {
        column-count: 1;
        column-gap: 0px;
    }
    .modal-dialog {
        max-width: 100%;
    }
    .main-image-container-large {
        height: auto;
    }
    #search {
        font-size: 16px;
        height: 42px;
        padding: 9px 20px;
        text-transform: uppercase;
        font-weight: 400;
    }
    .menu-item-language {
        height: auto;
    }
    #slideouts {
        top: 100px;
    }
    .courses-row {
        height: auto;
    }
    .main-image-container-extralarge {
        height: 300px;
    }
    .carousel-item {
        height: 300px;
    }
    .contentModal {
        min-width: auto;
    }
    .white-box-container {
        margin-top: 175px;
        height: 125px;
    }
    .white-box-slider {
        height: 125px;
    }
    .white-box-headline {
        font-size: 24px;
        line-height: 30px;
    }
    .white-box-subline {
        font-size: 24px;
        line-height: 30px;
    }
    .search-result .tab-content {
        max-height: calc(100vH - 300px);
        margin-top: 10px;
    }
    .search-wrapper {
        padding: 0 10px 0px 20px;
    }
    #search-result .nav-item {
        width: 33.3%;
    }
    #search-result .search-link {
        padding: 10px 0px 10px 0px !important;
        font-size: 13px;
        margin-right: 5px;
        text-align: center;
    }
    .searchresultcount {
        width: 30px;
        margin-left: 0px;
    }
    #productTabContent .tab-pane {
        min-height: auto;
    }
    #document-result {
        min-height: 100px;
    }
    .fullwidth-grey.home {
        min-height: calc( 100vH - 585px);
    }
}

@media only screen and (max-width: 767.98px) {
    #footer-column-5 h3 {
        display: none;
    }
    .white-box-headline {
        font-size: 20px;
        line-height: 25px;
    }
    .white-box-subline {
        font-size: 20px;
        line-height: 25px;
    }
}


/*// Large devices (desktops, 992px and up)*/

@media (min-width: 992px) and (max-width: 1199.98px) {}


/*// Large devices (desktops, 992px and up)*/


/*// Extra large devices (large desktops, 1200px and up)*/

@media (min-width: 1200px) {}


/* Defaults for large screen */

@media only screen and (min-width:1150px) {
    .header {
        background-color: white;
    }
}

@media only screen and (-webkit-min-device-pixel-ratio:1.5),
only screen and (min-resolution:144dpi) {}


/*------------------------------------*\
    MISC
\*------------------------------------*/


/* Selected text */

 ::selection {
    background: #aaaaaa;
    color: #FFF;
    text-shadow: none;
}

 ::-webkit-selection {
    background: #aaaaaa;
    color: #FFF;
    text-shadow: none;
}

 ::-moz-selection {
    background: #aaaaaa;
    color: #FFF;
    text-shadow: none;
}


/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #FFF;
    border: 1px solid #F0F0F0;
    max-width: 96%;
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption .wp-caption-text,
.gallery-caption {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

.sticky {}


/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
    * {
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a,
    a:visited {
        text-decoration: none !important;
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    thead {
        display: table-header-group;
    }
    tr,
    img,
    .search-result-item,
    .product-description-border,
    .widget-footer {
        page-break-before: auto;
        page-break-after: auto;
        page-break-inside: avoid;
        position: relative;
    }
    img {
        max-width: 100% !important;
    }
    @page {
        margin: 0.5cm;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
    h1,
    h2,
    h3 {
        page-break-after: avoid;
        position: relative;
    }
    h1:before {
        background-color: #000;
    }
    td,
    tr,
    th,
    div,
    footer {
        background: transparent !important;
    }
    .fade:not(.show) {
        opacity: 1;
    }
    #productTabContent .tab-pane {
        min-height: 50px;
    }
    .table-responsive th {
        border-bottom: 2px solid #dddddd;
    }
    .techdata td,
    .table-responsive td {
        border-bottom: 1px solid #dddddd;
    }
    .card {
        border: none !important;
    }
    .card-header,
    .card-body {
        padding-left: 0;
    }
    .card-header {
        font-size: 1.75rem;
        font-weight: bold;
    }
    .list-link {
        text-decoration: none !important;
        pointer-events: auto;
    }
    .list-link:before,
    .toolip-trigger,
    .card-header.collapsed:after {
        display: none;
    }
    .search-result-image {
        /* width: 200px; */
    }
    .nav-tabs .nav-link {
        display: none;
    }
    .nav-tabs .nav-link.active {
        display: block;
        background: none;
        border: 0;
        padding: 0;
        font-size: 1.75rem;
        font-weight: bold;
    }
    .product-main-image-holder {
        padding: 0;
        text-align: right;
    }
    .product-description-border:after {
        background-color: #ffffff;
    }
    /*
    .list-row div.col-12 {
        max-width: 30%;
    }
    .download-row div.col-12 {
        max-width: 20%;
    }
    #description .col-12 {
        max-width: 50%;
        float: none;
        display: block;
        flex: none;
    }
    */
    .search-row {}
    .list-row,
    .techdata-details-odd,
    .techdata-details-even {
        page-break-inside: avoid;
    }
    .tab-pane h1 {
        margin-top: 50px;
        page-break-after: avoid;
    }
    .card-header,
    .card-body h3 {
        page-break-after: avoid;
    }
    .wimEntryImg,
    .search-result-image,
    .product-main-image {
        max-width: 100% !important;
        margin: 0;
    }
    .product-main-image {
        display: inline;
    }
    .print-float {
        float: left;
        width: 300px;
    }
    .additional-print-image {
        max-width: 300px !important;
        max-height: 300px !important;
    }
    h1 {
        clear: left;
    }
    .product-details {
        width: 50% !important;
        float: left !important;
    }
    .product-main-image-holder {
        width: 50% !important;
        float: left !important;
    }
    .approvals {
        padding: 0;
    }
    .approvals img {
        height: 60px;
    }
}

#cartModal {
    display: none;
    width: auto;
    padding: 0;
}

#cartModalContent {
    margin: 0 auto;
    padding: 20px;
    min-width: 300px;
}


/*------------------------------------*\
    Cookie Consent
\*------------------------------------*/

.cc-window {
    opacity: 1;
    transition: opacity 1s ease
}

.cc-window.cc-invisible {
    opacity: 0
}

.cc-link {
    text-decoration: underline
}

.cc-window {
    position: fixed;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 1.5em;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    z-index: 9999
}

.cc-window.cc-static {
    position: static
}

.cc-window {
    padding: 1em 1.8em;
    width: 100%;
    -ms-flex-direction: row;
    flex-direction: row
}

.cc-btn,
.cc-close,
.cc-link,
.cc-revoke {
    cursor: pointer
}

.cc-link,
.cc-link:hover {
    color: #ffffff;
    display: inline-block;
    padding: .2em
}

.cc-btn {
    display: inline-block;
    background-color: #aaa;
    color: white;
    padding: 10px 10px 10px 10px;
    position: relative;
    transition: all .25s ease!important;
    vertical-align: middle;
    font-size: 15px;
    border-radius: 0;
}

.cc-btn:hover {
    background-color: #d30132;
    color: white;
}

.cc-highlight .cc-btn:first-child:focus,
.cc-highlight .cc-btn:first-child:hover {
    background-color: #d30132;
    color: white;
}

.cc-window {
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(102, 102, 102, 0.9);
    color: #ffffff;
}

.cc-banner .cc-message {
    -ms-flex: 1;
    flex: 1
}

.cc-compliance {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    margin-left: 10px;
    width: 50px;
    text-align: center;
}

.cc-compliance>.cc-btn {
    -ms-flex: 1;
    flex: 1
}

.cc-btn+.cc-btn {
    margin-left: .5em
}

@media print {
    .cc-revoke,
    .cc-window {
        display: none
    }
}

@media screen and (max-width:900px) {
    .cc-btn {
        white-space: normal
    }
}

@media screen and (max-width:414px) and (orientation:portrait),
screen and (max-width:736px) and (orientation:landscape) {
    .cc-window.cc-top {
        top: 0
    }
    .cc-window.cc-bottom {
        bottom: 0
    }
    .cc-window.cc-banner,
    .cc-window.cc-left,
    .cc-window.cc-right {
        left: 0;
        right: 0
    }
    .cc-window.cc-banner {
        -ms-flex-direction: column;
        flex-direction: column
    }
    .cc-window.cc-banner .cc-compliance {
        -ms-flex: 1;
        flex: 1;
        margin-left: 0;
    }
    .cc-window.cc-banner {
        -ms-flex-align: unset;
        align-items: unset
    }
}

.cta {
    background-color: #d30132;
    color: #fff;
    transition: all .25s ease!important;
    padding: .5rem;
    box-shadow: 0 5px 20px rgb(0 0 0 / 10%);
}

.cta:hover {
    cursor: pointer;
    box-shadow: 0 1px 5px rgb(0 0 0 / 10%);
}

.cta a {
    color: #fff;
    font-family: EUCHNER-bold, Helvetica, Arial, sans-serif;
}

.fit-content {
    width: fit-content;
}