/**
 * Load (legacy) compass mixins
 * used throughout the project
 */

/**
 * Load environment
 *
 * this project uses FOUNDATION FOR SITES v4.3.2
 * http://foundation.zurb.com/sites/docs/v/4.3.2/index.html
 *
 */

/**
 * TODO: Document mixins
 */

/**

mixin to generate media querries

use: @include respond-to(tablet, to) {
  -- code --
}

*/

/**
  * All colors
  * toDo delete 95% of these
  */

/* rename after including to $colors and delete above array */

.color-alert-yellow {
    background-color: #fff36f;
}

.color-yellow-light {
    background-color: #fefe9a;
}

.color-white {
    background-color: #fff;
}

.color-white-dark {
    background-color: #f7f7f7;
}

.color-highlight {
    background-color: #f0f4f8;
}

.color-grey-lighter2 {
    background-color: #e0e0e0;
}

.color-lighter-grey-border {
    background-color: #d7d9db;
}

.color-blue-lighter2 {
    background-color: #b8c7db;
}

.color-grey-lighter6 {
    background-color: #bbb;
}

.color-available {
    background-color: #88b29e;
}

.color-grey-dark2 {
    background-color: #999;
}

.color-error-light {
    background-color: #c5858f;
}

.color-error-dark {
    background-color: #b5626f;
}

.color-alert-yellow-dark {
    background-color: #8c8d5f;
}

.color-accent {
    background-color: #7090b7;
}

.color-blue-grey5 {
    background-color: #6481a4;
}

.color-primary-middle {
    background-color: #6e797f;
}

.color-blue-darker {
    background-color: #516885;
}

.color-blue-font {
    background-color: #5e6a71;
}

.color-grey-middle7 {
    background-color: #626262;
}

.color-grey-middle3 {
    background-color: #525c62;
}

.color-grey-middle-dark {
    background-color: #555;
}

.color-dark-grey-border {
    background-color: #485157;
}

.color-grey-dark {
    background-color: #333;
}

.color-grey-dark7 {
    background-color: #222526;
}

.color-black {
    background-color: #000;
}

.typo-description-hl {
    font-family: "Helvetica Extended Bold";
    font-size: 24px;
    line-height: 1.25;
    text-align: left;
}

.typo-hl-main {
    font-family: "Helvetica Extended Light";
    font-weight: normal;
    font-size: 32px;
    line-height: 1.25;
}

.typo-hl-big {
    font-family: 'Helvetica Extended Light';
    font-size: 20px;
    font-weight: bold;
    line-height: 1.25;
}

.typo-hl-medium {
    font-family: 'Helvetica Extended Light';
    font-size: 18px;
    font-weight: bold;
    line-height: 1.4375;
}

.typo-hl-small {
    font-family: 'Helvetica Extended Light';
    font-size: 16px;
    font-weight: bold;
    line-height: 1.375;
}

.typo-hl-xs {
    font-family: 'Helvetica Extended Light';
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857;
}

.typo-lead-in {
    font-family: 'Helvetica';
    font-size: 16px;
    font-weight: 900;
    line-height: 1.5625;
}

@media print {
    .typo-lead-in {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-copy {
    font-family: 'Helvetica';
    font-size: 16px;
    font-weight: normal;
    line-height: 1.25;
}

@media print {
    .typo-copy {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-label-small {
    font-family: 'Helvetica';
    font-weight: normal;
    font-size: 14px;
    line-height: 1.5;
}

@media print {
    .typo-label-small {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-label-big {
    font-family: 'Helvetica';
    font-weight: normal;
    font-size: 22px;
    line-height: 1.36364;
}

@media print {
    .typo-label-big {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-footnote {
    font-family: 'Helvetica';
    font-size: 12px;
    line-height: 1.25;
    font-weight: normal;
}

@media print {
    .typo-footnote {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-small-print {
    font-family: 'Helvetica';
    font-size: 12px;
    line-height: 1.5;
}

@media print {
    .typo-small-print {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-facts-number {
    font-family: "Helvetica Extended Medium";
    font-size: 21px;
    line-height: 1.19048;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-align: center;
}

.typo-year-date {
    font-family: "Helvetica Extended Medium";
    font-size: 20px;
    line-height: 1.25;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.typo-spec-cont-hl {
    font-family: "Helvetica Extended Medium";
    font-size: 30px;
    line-height: .83333;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-align: center;
}

.typo-breadcrumb {
    font-family: 'Helvetica';
    font-size: 14px;
    line-height: 1.42857;
    letter-spacing: .015em;
}

@media print {
    .typo-breadcrumb {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-small-links {
    font-family: 'Helvetica';
    font-weight: bold;
    font-size: 14px;
    line-height: 1.42857;
}

@media print {
    .typo-small-links {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-tabs-links {
    font-family: 'Helvetica';
    font-weight: bold;
    font-size: 18px;
    line-height: 1.11111;
}

@media print {
    .typo-tabs-links {
        /* Helvetica has a bug on OS X where bold font looks silly when printed */
        font-family: Arial, sans-serif;
    }
}

.typo-illu-elem {
    font-family: "Helvetica Extended Bold";
    font-size: 32px;
    line-height: 1;
    letter-spacing: -0.01em;
}

.typo-teaser-big {
    font-family: 'Helvetica Extended Light';
    font-size: 24px;
    font-weight: normal;
    line-height: 1.25;
}

.typo-teaser-small {
    font-family: 'Helvetica Extended';
    font-size: 18px;
    font-weight: normal;
    line-height: 1.5625;
}

/* visually hide something without disturbing screenreaders and focussing as
 * display: none; would do. use this for e.g.:
 * - icon labels
 * - checkboxes which are styled using surrounding elements
 */

/*
    Document   : ssl_tooltip
    Author     : mkr
    Description:
        Storm tooltip specific styles
*/

#powerTip {
    cursor: default;
    background-color: #bbb;
    background-color: rgba(187, 187, 187, .95);
    border-radius: 5px;
    color: #000;
    font-weight: bold;
    font-size: .75em;
    display: none;
    padding: .375em .625em;
    position: absolute;
    /*  white-space: nowrap;*/
    z-index: 2147483647;
    max-width: 20em;
    line-height: 1.125em;
}

#powerTip:before {
    content: "";
    position: absolute;
}

#powerTip.n:before,
#powerTip.s:before {
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    left: 50%;
    margin-left: -5px;
}

#powerTip.e:before,
#powerTip.w:before {
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    margin-top: -5px;
    top: 50%;
}

#powerTip.n:before {
    border-top: 10px solid #bbb;
    border-top: 10px solid rgba(187, 187, 187, .95);
    bottom: -10px;
}

#powerTip.e:before {
    border-right: 10px solid #bbb;
    border-right: 10px solid rgba(187, 187, 187, .95);
    left: -10px;
}

#powerTip.s:before {
    border-bottom: 10px solid #bbb;
    border-bottom: 10px solid rgba(187, 187, 187, .95);
    top: -10px;
}

#powerTip.w:before {
    border-left: 10px solid #bbb;
    border-left: 10px solid rgba(187, 187, 187, .95);
    right: -10px;
}

#powerTip.ne:before,
#powerTip.se:before {
    border-right: 10px solid transparent;
    border-left: 0;
    left: 10px;
}

#powerTip.nw:before,
#powerTip.sw:before {
    border-left: 10px solid transparent;
    border-right: 0;
    right: 10px;
}

#powerTip.ne:before,
#powerTip.nw:before {
    border-top: 10px solid #bbb;
    border-top: 10px solid rgba(187, 187, 187, .95);
    bottom: -10px;
}

#powerTip.se:before,
#powerTip.sw:before {
    border-bottom: 10px solid #bbb;
    border-bottom: 10px solid rgba(187, 187, 187, .95);
    top: -10px;
}

#powerTip.nw-alt:before,
#powerTip.ne-alt:before,
#powerTip.sw-alt:before,
#powerTip.se-alt:before {
    border-top: 10px solid #bbb;
    border-top: 10px solid rgba(187, 187, 187, .95);
    bottom: -10px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    left: 10px;
}

#powerTip.ne-alt:before {
    left: auto;
    right: 10px;
}

#powerTip.sw-alt:before,
#powerTip.se-alt:before {
    border-top: none;
    border-bottom: 10px solid #bbb;
    border-bottom: 10px solid rgba(187, 187, 187, .95);
    bottom: auto;
    top: -10px;
}

#powerTip.se-alt:before {
    left: auto;
    right: 10px;
}

.popup_inner {
    max-width: em-cal(320);
    white-space: normal;
    font-weight: normal;
}

.js-availability-wrapper .tooltip {
    display: block;
    position: relative;
    font-weight: bold;
    font-size: em-cal(15);
    line-height: 1.3125em;
    padding: .5em;
    max-width: inherit;
    left: auto;
    width: 100%;
    border-radius: 0;
}

/*!
Video.js Default Styles (http://videojs.com)
Version 4.8.1
Create your own skin at http://designer.videojs.com
*/

/* SKIN
================================================================================
The main class name for all skin-specific styles. To make your own skin,
replace all occurances of 'vjs-default-skin' with a new name. Then add your new
skin name to your video tag instead of the default skin.
e.g. <video class="video-js my-skin-name">
*/

.vjs-default-skin {
    color: #ccc;
}

/* Custom Icon Font
--------------------------------------------------------------------------------
The control icons are from a custom font. Each icon corresponds to a character
(e.g. "\e001"). Font icons allow for easy scaling and coloring of icons.
*/

@font-face {
    font-family: 'VideoJS';
    src: url("../font/vjs.eot");
    src: url("../font/vjs.eot") format("embedded-opentype"),
         url("../font/vjs.woff") format("woff"),
         url("../font/vjs.ttf") format("truetype"),
         url("../font/vjs.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}

/* Base UI Component Classes
--------------------------------------------------------------------------------
*/

/* Slider - used for Volume bar and Seek bar */

.vjs-default-skin .vjs-slider {
    /* Replace browser focus hightlight with handle highlight */
    outline: 0;
    position: relative;
    cursor: pointer;
    padding: 0;
    /* background-color-with-alpha */
    background-color: #333;
    background-color: rgba(51, 51, 51, .9);
}

.vjs-default-skin .vjs-slider:focus {
    /* box-shadow */
    box-shadow: 0 0 2em #fff;
}

.vjs-default-skin .vjs-slider-handle {
    position: absolute;
    /* Needed for IE6 */
    left: 0;
    top: 0;
}

.vjs-default-skin .vjs-slider-handle:before {
    content: "\e009";
    font-family: VideoJS;
    font-size: 1em;
    line-height: 1;
    text-align: center;
    text-shadow: 0 0 1em #fff;
    position: absolute;
    top: 0;
    left: 0;
    /* Rotate the square icon to make a diamond *//* transform */
    -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
}

/* Control Bar
--------------------------------------------------------------------------------
The default control bar that is a container for most of the controls.
*/

.vjs-default-skin .vjs-control-bar {
    /* Start hidden */
    display: none;
    position: absolute;
    /* Place control bar at the bottom of the player box/video.
     If you want more margin below the control bar, add more height. */
    bottom: 0;
    /* Use left/right to stretch to 100% width of player div */
    left: 0;
    right: 0;
    /* Height includes any margin you want above or below control items */
    height: 3em;
    /* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, .7);
}

/* Show the control bar only once the video has started playing */

.vjs-default-skin.vjs-has-started .vjs-control-bar {
    display: block;
    /* Visibility needed to make sure things hide in older browsers too. */
    visibility: visible;
    opacity: 1;
    /* transition */
    transition: visibility .1s, opacity .1s;
}

/* Hide the control bar when the video is playing and the user is inactive  */

.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
    display: block;
    visibility: hidden;
    opacity: 0;
    /* transition */
    transition: visibility 1s, opacity 1s;
}

.vjs-default-skin.vjs-controls-disabled .vjs-control-bar {
    display: none;
}

.vjs-default-skin.vjs-using-native-controls .vjs-control-bar {
    display: none;
}

/* The control bar shouldn't show after an error */

.vjs-default-skin.vjs-error .vjs-control-bar {
    display: none;
}

/* IE8 is flakey with fonts, and you have to change the actual content to force
fonts to show/hide properly.
  - "\9" IE8 hack didn't work for this
  - Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
*/

@media \0screen {
    .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
        content: "";
    }
}

/* General styles for individual controls. */

.vjs-default-skin .vjs-control {
    outline: none;
    position: relative;
    float: left;
    text-align: center;
    margin: 0;
    padding: 0;
    height: 3em;
    width: 4em;
}

/* FontAwsome button icons */

.vjs-default-skin .vjs-control:before {
    font-family: VideoJS;
    font-size: 1.5em;
    line-height: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .5);
}

/* Replacement for focus outline */

.vjs-default-skin .vjs-control:focus:before,
.vjs-default-skin .vjs-control:hover:before {
    text-shadow: 0 0 1em #fff;
}

.vjs-default-skin .vjs-control:focus {
    /*  outline: 0; *//* keyboard-only users cannot see the focus on several of the UI elements when
  this is set to 0 */
}

/* Hide control text visually, but have it available for screenreaders */

.vjs-default-skin .vjs-control-text {
    /* hide-visually */
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/* Play/Pause
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-play-control {
    width: 5em;
    cursor: pointer;
}

.vjs-default-skin .vjs-play-control:before {
    content: "\e001";
}

.vjs-default-skin.vjs-playing .vjs-play-control:before {
    content: "\e002";
}

/* Playback toggle
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value {
    font-size: 1.5em;
    line-height: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .5);
}

.vjs-default-skin .vjs-playback-rate.vjs-menu-button .vjs-menu .vjs-menu-content {
    width: 4em;
    left: -2em;
    list-style: none;
}

/* Volume/Mute
-------------------------------------------------------------------------------- */

.vjs-default-skin .vjs-mute-control,
.vjs-default-skin .vjs-volume-menu-button {
    cursor: pointer;
    float: right;
}

.vjs-default-skin .vjs-mute-control:before,
.vjs-default-skin .vjs-volume-menu-button:before {
    content: "\e006";
}

.vjs-default-skin .vjs-mute-control.vjs-vol-0:before,
.vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before {
    content: "\e003";
}

.vjs-default-skin .vjs-mute-control.vjs-vol-1:before,
.vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before {
    content: "\e004";
}

.vjs-default-skin .vjs-mute-control.vjs-vol-2:before,
.vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before {
    content: "\e005";
}

.vjs-default-skin .vjs-volume-control {
    width: 5em;
    float: right;
}

.vjs-default-skin .vjs-volume-bar {
    width: 5em;
    height: .6em;
    margin: 1.1em auto 0;
}

.vjs-default-skin .vjs-volume-menu-button .vjs-menu-content {
    height: 2.9em;
}

.vjs-default-skin .vjs-volume-level {
    position: absolute;
    top: 0;
    left: 0;
    height: .5em;
    /* assuming volume starts at 1.0 */
    width: 100%;
    background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
}

.vjs-default-skin .vjs-volume-bar .vjs-volume-handle {
    width: .5em;
    height: .5em;
    /* Assumes volume starts at 1.0. If you change the size of the
     handle relative to the volume bar, you'll need to update this value
     too. */
    left: 4.5em;
}

.vjs-default-skin .vjs-volume-handle:before {
    font-size: .9em;
    top: -0.2em;
    left: -0.2em;
    width: 1em;
    height: 1em;
}

.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
    width: 6em;
    left: -4em;
}

/* Progress
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-progress-control {
    position: absolute;
    left: 0;
    right: 0;
    width: auto;
    font-size: .3em;
    height: 1em;
    /* Set above the rest of the controls. */
    top: -1em;
    /* Shrink the bar slower than it grows. *//* transition */
    transition: all .4s;
}

/* On hover, make the progress bar grow to something that's more clickable.
    This simply changes the overall font for the progress bar, and this
    updates both the em-based widths and heights, as wells as the icon font */

.vjs-default-skin:hover .vjs-progress-control {
    font-size: .9em;
    /* Even though we're not changing the top/height, we need to include them in
      the transition so they're handled correctly. *//* transition */
    transition: all .2s;
}

/* Box containing play and load progresses. Also acts as seek scrubber. */

.vjs-default-skin .vjs-progress-holder {
    height: 100%;
}

/* Progress Bars */

.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
.vjs-default-skin .vjs-progress-holder .vjs-load-progress,
.vjs-default-skin .vjs-progress-holder .vjs-load-progress div {
    position: absolute;
    display: block;
    height: 100%;
    margin: 0;
    padding: 0;
    /* updated by javascript during playback */
    width: 0;
    /* Needed for IE6 */
    left: 0;
    top: 0;
}

.vjs-default-skin .vjs-play-progress {
    /*
    Using a data URI to create the white diagonal lines with a transparent
      background. Surprisingly works in IE8.
      Created using http://www.patternify.com
    Changing the first color value will change the bar color.
    Also using a paralax effect to make the lines move backwards.
      The -50% left position makes that happen.
  */
    background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
}

.vjs-default-skin .vjs-load-progress {
    background: #646464;
    background: rgba(255, 255, 255, .2);
}

/* there are child elements of the load progress bar that represent the
   specific time ranges that have been buffered */

.vjs-default-skin .vjs-load-progress div {
    background: #787878;
    background: rgba(255, 255, 255, .1);
}

.vjs-default-skin .vjs-seek-handle {
    width: 1.5em;
    height: 100%;
}

.vjs-default-skin .vjs-seek-handle:before {
    padding-top: .1em;
}

/* Live Mode
--------------------------------------------------------------------------------
*/

.vjs-default-skin.vjs-live .vjs-time-controls,
.vjs-default-skin.vjs-live .vjs-time-divider,
.vjs-default-skin.vjs-live .vjs-progress-control {
    display: none;
}

.vjs-default-skin.vjs-live .vjs-live-display {
    display: block;
}

/* Live Display
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-live-display {
    display: none;
    font-size: 1em;
    line-height: 3em;
}

/* Time Display
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-time-controls {
    font-size: 1em;
    /* Align vertically by making the line height the same as the control bar */
    line-height: 3em;
}

.vjs-default-skin .vjs-current-time {
    float: left;
}

.vjs-default-skin .vjs-duration {
    float: left;
}

/* Remaining time is in the HTML, but not included in default design */

.vjs-default-skin .vjs-remaining-time {
    display: none;
    float: left;
}

.vjs-time-divider {
    float: left;
    line-height: 3em;
}

/* Fullscreen
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-fullscreen-control {
    width: 3.8em;
    cursor: pointer;
    float: right;
}

.vjs-default-skin .vjs-fullscreen-control:before {
    content: "\e000";
}

/* Switch to the exit icon when the player is in fullscreen */

.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before {
    content: "\e00b";
}

/* Big Play Button (play button at start)
--------------------------------------------------------------------------------
Positioning of the play button in the center or other corners can be done more
easily in the skin designer. http://designer.videojs.com/
*/

.vjs-default-skin .vjs-big-play-button {
    left: .5em;
    top: .5em;
    font-size: 3em;
    display: block;
    z-index: 2;
    position: absolute;
    width: 4em;
    height: 2.6em;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    opacity: 1;
    /* Need a slightly gray bg so it can be seen on black backgrounds *//* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, .7);
    border: .1em solid #3b4249;
    /* border-radius */
    border-radius: .8em;
    /* box-shadow */
    box-shadow: 0 0 1em rgba(255, 255, 255, .25);
    /* transition */
    transition: all .4s;
}

/* Optionally center */

.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
    /* Center it horizontally */
    left: 50%;
    margin-left: -2.1em;
    /* Center it vertically */
    top: 50%;
    margin-top: -1.4000000000000001em;
}

/* Hide if controls are disabled */

.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button {
    display: none;
}

/* Hide when video starts playing */

.vjs-default-skin.vjs-has-started .vjs-big-play-button {
    display: none;
}

/* Hide on mobile devices. Remove when we stop using native controls
    by default on mobile  */

.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button {
    display: none;
}

.vjs-default-skin:hover .vjs-big-play-button,
.vjs-default-skin .vjs-big-play-button:focus {
    outline: 0;
    border-color: #fff;
    /* IE8 needs a non-glow hover state */
    background-color: #505050;
    background-color: rgba(50, 50, 50, .75);
    /* box-shadow */
    box-shadow: 0 0 3em #fff;
    /* transition */
    transition: all 0s;
}

.vjs-default-skin .vjs-big-play-button:before {
    content: "\e001";
    font-family: VideoJS;
    /* In order to center the play icon vertically we need to set the line height
     to the same as the button height */
    line-height: 2.6em;
    text-shadow: .05em .05em .1em #000;
    text-align: center;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
}

.vjs-error .vjs-big-play-button {
    display: none;
}

/* Error Display
--------------------------------------------------------------------------------
*/

.vjs-error-display {
    display: none;
}

.vjs-error .vjs-error-display {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.vjs-error .vjs-error-display:before {
    content: 'X';
    font-family: Arial;
    font-size: 4em;
    color: #666;
    /* In order to center the play icon vertically we need to set the line height
     to the same as the button height */
    line-height: 1;
    text-shadow: .05em .05em .1em #000;
    text-align: center;
    vertical-align: middle;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.5em;
    width: 100%;
}

.vjs-error-display div {
    position: absolute;
    bottom: 1em;
    right: 0;
    left: 0;
    font-size: 1.4em;
    text-align: center;
    padding: 3px;
    background: #000;
    background: rgba(0, 0, 0, .5);
}

.vjs-error-display a,
.vjs-error-display a:visited {
    color: #f4a460;
}

/* Loading Spinner
--------------------------------------------------------------------------------
*/

.vjs-loading-spinner {
    /* Should be hidden by default */
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 4em;
    line-height: 1;
    width: 1em;
    height: 1em;
    margin-left: -0.5em;
    margin-top: -0.5em;
    opacity: .75;
}

/* Show the spinner when waiting for data and seeking to a new time */

.vjs-waiting .vjs-loading-spinner,
.vjs-seeking .vjs-loading-spinner {
    display: block;
    /* only animate when showing because it can be processor heavy *//* animation */
    animation: spin 1.5s infinite linear;
}

/* Errors are unrecoverable without user interaction so hide the spinner */

.vjs-error .vjs-loading-spinner {
    display: none;
    /* ensure animation doesn't continue while hidden *//* animation */
    animation: none;
}

.vjs-default-skin .vjs-loading-spinner:before {
    content: "\e01e";
    font-family: VideoJS;
    position: absolute;
    top: 0;
    left: 0;
    width: 1em;
    height: 1em;
    text-align: center;
    text-shadow: 0 0 .1em #000;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(359deg);
    }
}

/* Menu Buttons (Captions/Subtitles/etc.)
--------------------------------------------------------------------------------
*/

.vjs-default-skin .vjs-menu-button {
    float: right;
    cursor: pointer;
}

.vjs-default-skin .vjs-menu {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    /* (Width of vjs-menu - width of button) / 2 */
    width: 0;
    height: 0;
    margin-bottom: 3em;
    border-left: 2em solid transparent;
    border-right: 2em solid transparent;
    border-top: 1.55em solid #000;
    /* Same width top as ul bottom */
    border-top-color: rgba(7, 40, 50, .5);
    /* Same as ul background */
}

/* Button Pop-up Menu */

.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content {
    display: block;
    padding: 0;
    margin: 0;
    position: absolute;
    width: 10em;
    bottom: 1.5em;
    /* Same bottom as vjs-menu border-top */
    max-height: 15em;
    overflow: auto;
    left: -5em;
    /* Width of menu - width of button / 2 *//* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, .7);
    /* box-shadow */
    box-shadow: -0.2em -0.2em .3em rgba(255, 255, 255, .2);
}

.vjs-default-skin .vjs-menu-button:hover .vjs-menu {
    display: block;
}

.vjs-default-skin .vjs-menu-button ul li {
    list-style: none;
    margin: 0;
    padding: .3em 0 .3em 0;
    line-height: 1.4em;
    font-size: 1.2em;
    text-align: center;
    text-transform: lowercase;
}

.vjs-default-skin .vjs-menu-button ul li.vjs-selected {
    background-color: #000;
}

.vjs-default-skin .vjs-menu-button ul li:focus,
.vjs-default-skin .vjs-menu-button ul li:hover,
.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,
.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover {
    outline: 0;
    color: #111;
    /* background-color-with-alpha */
    background-color: #fff;
    background-color: rgba(255, 255, 255, .75);
    /* box-shadow */
    box-shadow: 0 0 1em #fff;
}

.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
    text-align: center;
    text-transform: uppercase;
    font-size: 1em;
    line-height: 2em;
    padding: 0;
    margin: 0 0 .3em 0;
    font-weight: bold;
    cursor: default;
}

/* Subtitles Button */

.vjs-default-skin .vjs-subtitles-button:before {
    content: "\e00c";
}

/* Captions Button */

.vjs-default-skin .vjs-captions-button:before {
    content: "\e008";
}

/* Chapters Button */

.vjs-default-skin .vjs-chapters-button:before {
    content: "\e00c";
}

.vjs-default-skin .vjs-chapters-button.vjs-menu-button .vjs-menu .vjs-menu-content {
    width: 24em;
    left: -12em;
}

/* Replacement for focus outline */

.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before,
.vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before {
    /* box-shadow */
    box-shadow: 0 0 1em #fff;
}

/*
REQUIRED STYLES (be careful overriding)
================================================================================
When loading the player, the video tag is replaced with a DIV,
that will hold the video tag or object tag for other playback methods.
The div contains the video playback element (Flash or HTML5) and controls,
and sets the width and height of the video.

** If you want to add some kind of border/padding (e.g. a frame), or special
positioning, use another containing element. Otherwise you risk messing up
control positioning and full window mode. **
*/

.video-js {
    background-color: #000;
    position: relative;
    padding: 0;
    /* Start with 10px for base font size so other dimensions can be em based and
     easily calculable. */
    font-size: 10px;
    /* Allow poster to be vertially aligned. */
    vertical-align: middle;
    /*  display: table-cell; *//*This works in Safari but not Firefox.*//* Provide some basic defaults for fonts */
    font-weight: normal;
    font-style: normal;
    /* Avoiding helvetica: issue #376 */
    font-family: Arial, sans-serif;
    /* Turn off user selection (text highlighting) by default.
     The majority of player components will not be text blocks.
     Text areas will need to turn user selection back on. *//* user-select */
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}

/* Playback technology elements expand to the width/height of the containing div
    <video> or <object> */

.video-js .vjs-tech {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
   checking fullScreenEnabled. */

.video-js:-moz-full-screen {
    position: absolute;
}

/* Fullscreen Styles */

body.vjs-full-window {
    padding: 0;
    margin: 0;
    height: 100%;
    /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
    overflow-y: auto;
}

.video-js.vjs-fullscreen {
    position: fixed;
    overflow: hidden;
    z-index: 1000;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
    /* IE6 full-window (underscore hack) */
    _position: absolute;
}

.video-js:-webkit-full-screen {
    width: 100% !important;
    height: 100% !important;
}

.video-js.vjs-fullscreen.vjs-user-inactive {
    cursor: none;
}

/* Poster Styles */

.vjs-poster {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain;
    cursor: pointer;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.vjs-poster img {
    display: block;
    margin: 0 auto;
    max-height: 100%;
    padding: 0;
    width: 100%;
}

/* Hide the poster when native controls are used otherwise it covers them */

.video-js.vjs-using-native-controls .vjs-poster {
    display: none;
}

/* Text Track Styles */

/* Overall track holder for both captions and subtitles */

.video-js .vjs-text-track-display {
    text-align: center;
    position: absolute;
    bottom: 4em;
    /* Leave padding on left and right */
    left: 1em;
    right: 1em;
}

/* Move captions down when controls aren't being shown */

.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
    bottom: 1em;
}

/* Individual tracks */

.video-js .vjs-text-track {
    display: none;
    font-size: 1.4em;
    text-align: center;
    margin-bottom: .1em;
    /* Transparent black background, or fallback to all black (oldIE) *//* background-color-with-alpha */
    background-color: #000;
    background-color: rgba(0, 0, 0, .5);
}

.video-js .vjs-subtitles {
    color: #fff;
}

.video-js .vjs-captions {
    color: #fc6;
}

.vjs-tt-cue {
    display: block;
}

/* Hide disabled or unsupported controls */

.vjs-default-skin .vjs-hidden {
    display: none;
}

.vjs-lock-showing {
    display: block !important;
    opacity: 1;
    visibility: visible;
}

/*  In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
    The .video-js classname on the video tag also isn't considered.
    This optional paragraph inside the video tag can provide a message to users
    about what's required to play video. */

.vjs-no-js {
    padding: 20px;
    color: #ccc;
    background-color: #333;
    font-size: 18px;
    font-family: Arial, sans-serif;
    text-align: center;
    width: 300px;
    height: 150px;
    margin: 0 auto;
}

.vjs-no-js a,
.vjs-no-js a:visited {
    color: #f4a460;
}

/* -----------------------------------------------------------------------------
The original source of this file lives at
https://github.com/videojs/video.js/blob/master/src/css/video-js.less */

/*!
 *  Font Awesome 4.3.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */

/* FONT PATH
 * -------------------------- */

@font-face {
    font-family: 'FontAwesome';
    src: url("../font/fontawesome-webfont.eot");
    src: url("../font/fontawesome-webfont.eot") format("embedded-opentype"),
         url("../font/fontawesome-webfont.woff2") format("woff2"),
         url("../font/fontawesome-webfont.woff") format("woff"),
         url("../font/fontawesome-webfont.ttf") format("truetype"),
         url("../font/fontawesome-webfont.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -ms-transform: translate(0, 0);
        transform: translate(0, 0);
}

/* makes the font 33% larger relative to the icon container */

.fa-lg {
    font-size: 1.33333em;
    line-height: .75em;
    vertical-align: -15%;
}

.fa-2x {
    font-size: 2em;
}

.fa-3x {
    font-size: 3em;
}

.fa-4x {
    font-size: 4em;
}

.fa-5x {
    font-size: 5em;
}

.fa-fw {
    width: 1.28571em;
    text-align: center;
}

.fa-ul {
    padding-left: 0;
    margin-left: 2.14286em;
    list-style-type: none;
}

.fa-ul > li {
    position: relative;
}

.fa-li {
    position: absolute;
    left: -2.14286em;
    width: 2.14286em;
    top: .14286em;
    text-align: center;
}

.fa-li.fa-lg {
    left: -1.85714em;
}

.fa-border {
    padding: .2em .25em .15em;
    border: solid .08em #eee;
    border-radius: .1em;
}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

.fa.pull-left {
    margin-right: .3em;
}

.fa.pull-right {
    margin-left: .3em;
}

.fa-spin {
    animation: fa-spin 2s infinite linear;
}

.fa-pulse {
    animation: fa-spin 1s infinite steps(8);
}

@keyframes fa-spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(359deg);
    }
}

.fa-rotate-90 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    -ms-transform: rotate(90deg);
        transform: rotate(90deg);
}

.fa-rotate-180 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    -ms-transform: rotate(180deg);
        transform: rotate(180deg);
}

.fa-rotate-270 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    -ms-transform: rotate(270deg);
        transform: rotate(270deg);
}

.fa-flip-horizontal {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
    -ms-transform: scale(-1, 1);
        transform: scale(-1, 1);
}

.fa-flip-vertical {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    -ms-transform: scale(1, -1);
        transform: scale(1, -1);
}

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
    filter: none;
}

.fa-stack {
    position: relative;
    display: inline-block;
    width: 2em;
    height: 2em;
    line-height: 2em;
    vertical-align: middle;
}

.fa-stack-1x,
.fa-stack-2x {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center;
}

.fa-stack-1x {
    line-height: inherit;
}

.fa-stack-2x {
    font-size: 2em;
}

.fa-inverse {
    color: #fff;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */

.fa-glass:before {
    content: "";
}

.fa-music:before {
    content: "";
}

.fa-search:before {
    content: "";
}

.fa-envelope-o:before {
    content: "";
}

.fa-heart:before {
    content: "";
}

.fa-star:before {
    content: "";
}

.fa-star-o:before {
    content: "";
}

.fa-user:before {
    content: "";
}

.fa-film:before {
    content: "";
}

.fa-th-large:before {
    content: "";
}

.fa-th:before {
    content: "";
}

.fa-th-list:before {
    content: "";
}

.fa-check:before {
    content: "";
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
    content: "";
}

.fa-search-plus:before {
    content: "";
}

.fa-search-minus:before {
    content: "";
}

.fa-power-off:before {
    content: "";
}

.fa-signal:before {
    content: "";
}

.fa-gear:before,
.fa-cog:before {
    content: "";
}

.fa-trash-o:before {
    content: "";
}

.fa-home:before {
    content: "";
}

.fa-file-o:before {
    content: "";
}

.fa-clock-o:before {
    content: "";
}

.fa-road:before {
    content: "";
}

.fa-download:before {
    content: "";
}

.fa-arrow-circle-o-down:before {
    content: "";
}

.fa-arrow-circle-o-up:before {
    content: "";
}

.fa-inbox:before {
    content: "";
}

.fa-play-circle-o:before {
    content: "";
}

.fa-rotate-right:before,
.fa-repeat:before {
    content: "";
}

.fa-refresh:before {
    content: "";
}

.fa-list-alt:before {
    content: "";
}

.fa-lock:before {
    content: "";
}

.fa-flag:before {
    content: "";
}

.fa-headphones:before {
    content: "";
}

.fa-volume-off:before {
    content: "";
}

.fa-volume-down:before {
    content: "";
}

.fa-volume-up:before {
    content: "";
}

.fa-qrcode:before {
    content: "";
}

.fa-barcode:before {
    content: "";
}

.fa-tag:before {
    content: "";
}

.fa-tags:before {
    content: "";
}

.fa-book:before {
    content: "";
}

.fa-bookmark:before {
    content: "";
}

.fa-print:before {
    content: "";
}

.fa-camera:before {
    content: "";
}

.fa-font:before {
    content: "";
}

.fa-bold:before {
    content: "";
}

.fa-italic:before {
    content: "";
}

.fa-text-height:before {
    content: "";
}

.fa-text-width:before {
    content: "";
}

.fa-align-left:before {
    content: "";
}

.fa-align-center:before {
    content: "";
}

.fa-align-right:before {
    content: "";
}

.fa-align-justify:before {
    content: "";
}

.fa-list:before {
    content: "";
}

.fa-dedent:before,
.fa-outdent:before {
    content: "";
}

.fa-indent:before {
    content: "";
}

.fa-video-camera:before {
    content: "";
}

.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
    content: "";
}

.fa-pencil:before {
    content: "";
}

.fa-map-marker:before {
    content: "";
}

.fa-adjust:before {
    content: "";
}

.fa-tint:before {
    content: "";
}

.fa-edit:before,
.fa-pencil-square-o:before {
    content: "";
}

.fa-share-square-o:before {
    content: "";
}

.fa-check-square-o:before {
    content: "";
}

.fa-arrows:before {
    content: "";
}

.fa-step-backward:before {
    content: "";
}

.fa-fast-backward:before {
    content: "";
}

.fa-backward:before {
    content: "";
}

.fa-play:before {
    content: "";
}

.fa-pause:before {
    content: "";
}

.fa-stop:before {
    content: "";
}

.fa-forward:before {
    content: "";
}

.fa-fast-forward:before {
    content: "";
}

.fa-step-forward:before {
    content: "";
}

.fa-eject:before {
    content: "";
}

.fa-chevron-left:before {
    content: "";
}

.fa-chevron-right:before {
    content: "";
}

.fa-plus-circle:before {
    content: "";
}

.fa-minus-circle:before {
    content: "";
}

.fa-times-circle:before {
    content: "";
}

.fa-check-circle:before {
    content: "";
}

.fa-question-circle:before {
    content: "";
}

.fa-info-circle:before {
    content: "";
}

.fa-crosshairs:before {
    content: "";
}

.fa-times-circle-o:before {
    content: "";
}

.fa-check-circle-o:before {
    content: "";
}

.fa-ban:before {
    content: "";
}

.fa-arrow-left:before {
    content: "";
}

.fa-arrow-right:before {
    content: "";
}

.fa-arrow-up:before {
    content: "";
}

.fa-arrow-down:before {
    content: "";
}

.fa-mail-forward:before,
.fa-share:before {
    content: "";
}

.fa-expand:before {
    content: "";
}

.fa-compress:before {
    content: "";
}

.fa-plus:before {
    content: "";
}

.fa-minus:before {
    content: "";
}

.fa-asterisk:before {
    content: "";
}

.fa-exclamation-circle:before {
    content: "";
}

.fa-gift:before {
    content: "";
}

.fa-leaf:before {
    content: "";
}

.fa-fire:before {
    content: "";
}

.fa-eye:before {
    content: "";
}

.fa-eye-slash:before {
    content: "";
}

.fa-warning:before,
.fa-exclamation-triangle:before {
    content: "";
}

.fa-plane:before {
    content: "";
}

.fa-calendar:before {
    content: "";
}

.fa-random:before {
    content: "";
}

.fa-comment:before {
    content: "";
}

.fa-magnet:before {
    content: "";
}

.fa-chevron-up:before {
    content: "";
}

.fa-chevron-down:before {
    content: "";
}

.fa-retweet:before {
    content: "";
}

.fa-shopping-cart:before {
    content: "";
}

.fa-folder:before {
    content: "";
}

.fa-folder-open:before {
    content: "";
}

.fa-arrows-v:before {
    content: "";
}

.fa-arrows-h:before {
    content: "";
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
    content: "";
}

.fa-twitter-square:before {
    content: "";
}

.fa-facebook-square:before {
    content: "";
}

.fa-camera-retro:before {
    content: "";
}

.fa-key:before {
    content: "";
}

.fa-gears:before,
.fa-cogs:before {
    content: "";
}

.fa-comments:before {
    content: "";
}

.fa-thumbs-o-up:before {
    content: "";
}

.fa-thumbs-o-down:before {
    content: "";
}

.fa-star-half:before {
    content: "";
}

.fa-heart-o:before {
    content: "";
}

.fa-sign-out:before {
    content: "";
}

.fa-linkedin-square:before {
    content: "";
}

.fa-thumb-tack:before {
    content: "";
}

.fa-external-link:before {
    content: "";
}

.fa-sign-in:before {
    content: "";
}

.fa-trophy:before {
    content: "";
}

.fa-github-square:before {
    content: "";
}

.fa-upload:before {
    content: "";
}

.fa-lemon-o:before {
    content: "";
}

.fa-phone:before {
    content: "";
}

.fa-square-o:before {
    content: "";
}

.fa-bookmark-o:before {
    content: "";
}

.fa-phone-square:before {
    content: "";
}

.fa-twitter:before {
    content: "";
}

.fa-facebook-f:before,
.fa-facebook:before {
    content: "";
}

.fa-github:before {
    content: "";
}

.fa-unlock:before {
    content: "";
}

.fa-credit-card:before {
    content: "";
}

.fa-rss:before {
    content: "";
}

.fa-hdd-o:before {
    content: "";
}

.fa-bullhorn:before {
    content: "";
}

.fa-bell:before {
    content: "";
}

.fa-certificate:before {
    content: "";
}

.fa-hand-o-right:before {
    content: "";
}

.fa-hand-o-left:before {
    content: "";
}

.fa-hand-o-up:before {
    content: "";
}

.fa-hand-o-down:before {
    content: "";
}

.fa-arrow-circle-left:before {
    content: "";
}

.fa-arrow-circle-right:before {
    content: "";
}

.fa-arrow-circle-up:before {
    content: "";
}

.fa-arrow-circle-down:before {
    content: "";
}

.fa-globe:before {
    content: "";
}

.fa-wrench:before {
    content: "";
}

.fa-tasks:before {
    content: "";
}

.fa-filter:before {
    content: "";
}

.fa-briefcase:before {
    content: "";
}

.fa-arrows-alt:before {
    content: "";
}

.fa-group:before,
.fa-users:before {
    content: "";
}

.fa-chain:before,
.fa-link:before {
    content: "";
}

.fa-cloud:before {
    content: "";
}

.fa-flask:before {
    content: "";
}

.fa-cut:before,
.fa-scissors:before {
    content: "";
}

.fa-copy:before,
.fa-files-o:before {
    content: "";
}

.fa-paperclip:before {
    content: "";
}

.fa-save:before,
.fa-floppy-o:before {
    content: "";
}

.fa-square:before {
    content: "";
}

.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
    content: "";
}

.fa-list-ul:before {
    content: "";
}

.fa-list-ol:before {
    content: "";
}

.fa-strikethrough:before {
    content: "";
}

.fa-underline:before {
    content: "";
}

.fa-table:before {
    content: "";
}

.fa-magic:before {
    content: "";
}

.fa-truck:before {
    content: "";
}

.fa-pinterest:before {
    content: "";
}

.fa-pinterest-square:before {
    content: "";
}

.fa-google-plus-square:before {
    content: "";
}

.fa-google-plus:before {
    content: "";
}

.fa-money:before {
    content: "";
}

.fa-caret-down:before {
    content: "";
}

.fa-caret-up:before {
    content: "";
}

.fa-caret-left:before {
    content: "";
}

.fa-caret-right:before {
    content: "";
}

.fa-columns:before {
    content: "";
}

.fa-unsorted:before,
.fa-sort:before {
    content: "";
}

.fa-sort-down:before,
.fa-sort-desc:before {
    content: "";
}

.fa-sort-up:before,
.fa-sort-asc:before {
    content: "";
}

.fa-envelope:before {
    content: "";
}

.fa-linkedin:before {
    content: "";
}

.fa-rotate-left:before,
.fa-undo:before {
    content: "";
}

.fa-legal:before,
.fa-gavel:before {
    content: "";
}

.fa-dashboard:before,
.fa-tachometer:before {
    content: "";
}

.fa-comment-o:before {
    content: "";
}

.fa-comments-o:before {
    content: "";
}

.fa-flash:before,
.fa-bolt:before {
    content: "";
}

.fa-sitemap:before {
    content: "";
}

.fa-umbrella:before {
    content: "";
}

.fa-paste:before,
.fa-clipboard:before {
    content: "";
}

.fa-lightbulb-o:before {
    content: "";
}

.fa-exchange:before {
    content: "";
}

.fa-cloud-download:before {
    content: "";
}

.fa-cloud-upload:before {
    content: "";
}

.fa-user-md:before {
    content: "";
}

.fa-stethoscope:before {
    content: "";
}

.fa-suitcase:before {
    content: "";
}

.fa-bell-o:before {
    content: "";
}

.fa-coffee:before {
    content: "";
}

.fa-cutlery:before {
    content: "";
}

.fa-file-text-o:before {
    content: "";
}

.fa-building-o:before {
    content: "";
}

.fa-hospital-o:before {
    content: "";
}

.fa-ambulance:before {
    content: "";
}

.fa-medkit:before {
    content: "";
}

.fa-fighter-jet:before {
    content: "";
}

.fa-beer:before {
    content: "";
}

.fa-h-square:before {
    content: "";
}

.fa-plus-square:before {
    content: "";
}

.fa-angle-double-left:before {
    content: "";
}

.fa-angle-double-right:before {
    content: "";
}

.fa-angle-double-up:before {
    content: "";
}

.fa-angle-double-down:before {
    content: "";
}

.fa-angle-left:before {
    content: "";
}

.fa-angle-right:before {
    content: "";
}

.fa-angle-up:before {
    content: "";
}

.fa-angle-down:before {
    content: "";
}

.fa-desktop:before {
    content: "";
}

.fa-laptop:before {
    content: "";
}

.fa-tablet:before {
    content: "";
}

.fa-mobile-phone:before,
.fa-mobile:before {
    content: "";
}

.fa-circle-o:before {
    content: "";
}

.fa-quote-left:before {
    content: "";
}

.fa-quote-right:before {
    content: "";
}

.fa-spinner:before {
    content: "";
}

.fa-circle:before {
    content: "";
}

.fa-mail-reply:before,
.fa-reply:before {
    content: "";
}

.fa-github-alt:before {
    content: "";
}

.fa-folder-o:before {
    content: "";
}

.fa-folder-open-o:before {
    content: "";
}

.fa-smile-o:before {
    content: "";
}

.fa-frown-o:before {
    content: "";
}

.fa-meh-o:before {
    content: "";
}

.fa-gamepad:before {
    content: "";
}

.fa-keyboard-o:before {
    content: "";
}

.fa-flag-o:before {
    content: "";
}

.fa-flag-checkered:before {
    content: "";
}

.fa-terminal:before {
    content: "";
}

.fa-code:before {
    content: "";
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
    content: "";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
    content: "";
}

.fa-location-arrow:before {
    content: "";
}

.fa-crop:before {
    content: "";
}

.fa-code-fork:before {
    content: "";
}

.fa-unlink:before,
.fa-chain-broken:before {
    content: "";
}

.fa-question:before {
    content: "";
}

.fa-info:before {
    content: "";
}

.fa-exclamation:before {
    content: "";
}

.fa-superscript:before {
    content: "";
}

.fa-subscript:before {
    content: "";
}

.fa-eraser:before {
    content: "";
}

.fa-puzzle-piece:before {
    content: "";
}

.fa-microphone:before {
    content: "";
}

.fa-microphone-slash:before {
    content: "";
}

.fa-shield:before {
    content: "";
}

.fa-calendar-o:before {
    content: "";
}

.fa-fire-extinguisher:before {
    content: "";
}

.fa-rocket:before {
    content: "";
}

.fa-maxcdn:before {
    content: "";
}

.fa-chevron-circle-left:before {
    content: "";
}

.fa-chevron-circle-right:before {
    content: "";
}

.fa-chevron-circle-up:before {
    content: "";
}

.fa-chevron-circle-down:before {
    content: "";
}

.fa-html5:before {
    content: "";
}

.fa-css3:before {
    content: "";
}

.fa-anchor:before {
    content: "";
}

.fa-unlock-alt:before {
    content: "";
}

.fa-bullseye:before {
    content: "";
}

.fa-ellipsis-h:before {
    content: "";
}

.fa-ellipsis-v:before {
    content: "";
}

.fa-rss-square:before {
    content: "";
}

.fa-play-circle:before {
    content: "";
}

.fa-ticket:before {
    content: "";
}

.fa-minus-square:before {
    content: "";
}

.fa-minus-square-o:before {
    content: "";
}

.fa-level-up:before {
    content: "";
}

.fa-level-down:before {
    content: "";
}

.fa-check-square:before {
    content: "";
}

.fa-pencil-square:before {
    content: "";
}

.fa-external-link-square:before {
    content: "";
}

.fa-share-square:before {
    content: "";
}

.fa-compass:before {
    content: "";
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
    content: "";
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
    content: "";
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
    content: "";
}

.fa-euro:before,
.fa-eur:before {
    content: "";
}

.fa-gbp:before {
    content: "";
}

.fa-dollar:before,
.fa-usd:before {
    content: "";
}

.fa-rupee:before,
.fa-inr:before {
    content: "";
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
    content: "";
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
    content: "";
}

.fa-won:before,
.fa-krw:before {
    content: "";
}

.fa-bitcoin:before,
.fa-btc:before {
    content: "";
}

.fa-file:before {
    content: "";
}

.fa-file-text:before {
    content: "";
}

.fa-sort-alpha-asc:before {
    content: "";
}

.fa-sort-alpha-desc:before {
    content: "";
}

.fa-sort-amount-asc:before {
    content: "";
}

.fa-sort-amount-desc:before {
    content: "";
}

.fa-sort-numeric-asc:before {
    content: "";
}

.fa-sort-numeric-desc:before {
    content: "";
}

.fa-thumbs-up:before {
    content: "";
}

.fa-thumbs-down:before {
    content: "";
}

.fa-youtube-square:before {
    content: "";
}

.fa-youtube:before {
    content: "";
}

.fa-xing:before {
    content: "";
}

.fa-xing-square:before {
    content: "";
}

.fa-youtube-play:before {
    content: "";
}

.fa-dropbox:before {
    content: "";
}

.fa-stack-overflow:before {
    content: "";
}

.fa-instagram:before {
    content: "";
}

.fa-flickr:before {
    content: "";
}

.fa-adn:before {
    content: "";
}

.fa-bitbucket:before {
    content: "";
}

.fa-bitbucket-square:before {
    content: "";
}

.fa-tumblr:before {
    content: "";
}

.fa-tumblr-square:before {
    content: "";
}

.fa-long-arrow-down:before {
    content: "";
}

.fa-long-arrow-up:before {
    content: "";
}

.fa-long-arrow-left:before {
    content: "";
}

.fa-long-arrow-right:before {
    content: "";
}

.fa-apple:before {
    content: "";
}

.fa-windows:before {
    content: "";
}

.fa-android:before {
    content: "";
}

.fa-linux:before {
    content: "";
}

.fa-dribbble:before {
    content: "";
}

.fa-skype:before {
    content: "";
}

.fa-foursquare:before {
    content: "";
}

.fa-trello:before {
    content: "";
}

.fa-female:before {
    content: "";
}

.fa-male:before {
    content: "";
}

.fa-gittip:before,
.fa-gratipay:before {
    content: "";
}

.fa-sun-o:before {
    content: "";
}

.fa-moon-o:before {
    content: "";
}

.fa-archive:before {
    content: "";
}

.fa-bug:before {
    content: "";
}

.fa-vk:before {
    content: "";
}

.fa-weibo:before {
    content: "";
}

.fa-renren:before {
    content: "";
}

.fa-pagelines:before {
    content: "";
}

.fa-stack-exchange:before {
    content: "";
}

.fa-arrow-circle-o-right:before {
    content: "";
}

.fa-arrow-circle-o-left:before {
    content: "";
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
    content: "";
}

.fa-dot-circle-o:before {
    content: "";
}

.fa-wheelchair:before {
    content: "";
}

.fa-vimeo-square:before {
    content: "";
}

.fa-turkish-lira:before,
.fa-try:before {
    content: "";
}

.fa-plus-square-o:before {
    content: "";
}

.fa-space-shuttle:before {
    content: "";
}

.fa-slack:before {
    content: "";
}

.fa-envelope-square:before {
    content: "";
}

.fa-wordpress:before {
    content: "";
}

.fa-openid:before {
    content: "";
}

.fa-institution:before,
.fa-bank:before,
.fa-university:before {
    content: "";
}

.fa-mortar-board:before,
.fa-graduation-cap:before {
    content: "";
}

.fa-yahoo:before {
    content: "";
}

.fa-google:before {
    content: "";
}

.fa-reddit:before {
    content: "";
}

.fa-reddit-square:before {
    content: "";
}

.fa-stumbleupon-circle:before {
    content: "";
}

.fa-stumbleupon:before {
    content: "";
}

.fa-delicious:before {
    content: "";
}

.fa-digg:before {
    content: "";
}

.fa-pied-piper:before {
    content: "";
}

.fa-pied-piper-alt:before {
    content: "";
}

.fa-drupal:before {
    content: "";
}

.fa-joomla:before {
    content: "";
}

.fa-language:before {
    content: "";
}

.fa-fax:before {
    content: "";
}

.fa-building:before {
    content: "";
}

.fa-child:before {
    content: "";
}

.fa-paw:before {
    content: "";
}

.fa-spoon:before {
    content: "";
}

.fa-cube:before {
    content: "";
}

.fa-cubes:before {
    content: "";
}

.fa-behance:before {
    content: "";
}

.fa-behance-square:before {
    content: "";
}

.fa-steam:before {
    content: "";
}

.fa-steam-square:before {
    content: "";
}

.fa-recycle:before {
    content: "";
}

.fa-automobile:before,
.fa-car:before {
    content: "";
}

.fa-cab:before,
.fa-taxi:before {
    content: "";
}

.fa-tree:before {
    content: "";
}

.fa-spotify:before {
    content: "";
}

.fa-deviantart:before {
    content: "";
}

.fa-soundcloud:before {
    content: "";
}

.fa-database:before {
    content: "";
}

.fa-file-pdf-o:before {
    content: "";
}

.fa-file-word-o:before {
    content: "";
}

.fa-file-excel-o:before {
    content: "";
}

.fa-file-powerpoint-o:before {
    content: "";
}

.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
    content: "";
}

.fa-file-zip-o:before,
.fa-file-archive-o:before {
    content: "";
}

.fa-file-sound-o:before,
.fa-file-audio-o:before {
    content: "";
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
    content: "";
}

.fa-file-code-o:before {
    content: "";
}

.fa-vine:before {
    content: "";
}

.fa-codepen:before {
    content: "";
}

.fa-jsfiddle:before {
    content: "";
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
    content: "";
}

.fa-circle-o-notch:before {
    content: "";
}

.fa-ra:before,
.fa-rebel:before {
    content: "";
}

.fa-ge:before,
.fa-empire:before {
    content: "";
}

.fa-git-square:before {
    content: "";
}

.fa-git:before {
    content: "";
}

.fa-hacker-news:before {
    content: "";
}

.fa-tencent-weibo:before {
    content: "";
}

.fa-qq:before {
    content: "";
}

.fa-wechat:before,
.fa-weixin:before {
    content: "";
}

.fa-send:before,
.fa-paper-plane:before {
    content: "";
}

.fa-send-o:before,
.fa-paper-plane-o:before {
    content: "";
}

.fa-history:before {
    content: "";
}

.fa-genderless:before,
.fa-circle-thin:before {
    content: "";
}

.fa-header:before {
    content: "";
}

.fa-paragraph:before {
    content: "";
}

.fa-sliders:before {
    content: "";
}

.fa-share-alt:before {
    content: "";
}

.fa-share-alt-square:before {
    content: "";
}

.fa-bomb:before {
    content: "";
}

.fa-soccer-ball-o:before,
.fa-futbol-o:before {
    content: "";
}

.fa-tty:before {
    content: "";
}

.fa-binoculars:before {
    content: "";
}

.fa-plug:before {
    content: "";
}

.fa-slideshare:before {
    content: "";
}

.fa-twitch:before {
    content: "";
}

.fa-yelp:before {
    content: "";
}

.fa-newspaper-o:before {
    content: "";
}

.fa-wifi:before {
    content: "";
}

.fa-calculator:before {
    content: "";
}

.fa-paypal:before {
    content: "";
}

.fa-google-wallet:before {
    content: "";
}

.fa-cc-visa:before {
    content: "";
}

.fa-cc-mastercard:before {
    content: "";
}

.fa-cc-discover:before {
    content: "";
}

.fa-cc-amex:before {
    content: "";
}

.fa-cc-paypal:before {
    content: "";
}

.fa-cc-stripe:before {
    content: "";
}

.fa-bell-slash:before {
    content: "";
}

.fa-bell-slash-o:before {
    content: "";
}

.fa-trash:before {
    content: "";
}

.fa-copyright:before {
    content: "";
}

.fa-at:before {
    content: "";
}

.fa-eyedropper:before {
    content: "";
}

.fa-paint-brush:before {
    content: "";
}

.fa-birthday-cake:before {
    content: "";
}

.fa-area-chart:before {
    content: "";
}

.fa-pie-chart:before {
    content: "";
}

.fa-line-chart:before {
    content: "";
}

.fa-lastfm:before {
    content: "";
}

.fa-lastfm-square:before {
    content: "";
}

.fa-toggle-off:before {
    content: "";
}

.fa-toggle-on:before {
    content: "";
}

.fa-bicycle:before {
    content: "";
}

.fa-bus:before {
    content: "";
}

.fa-ioxhost:before {
    content: "";
}

.fa-angellist:before {
    content: "";
}

.fa-cc:before {
    content: "";
}

.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
    content: "";
}

.fa-meanpath:before {
    content: "";
}

.fa-buysellads:before {
    content: "";
}

.fa-connectdevelop:before {
    content: "";
}

.fa-dashcube:before {
    content: "";
}

.fa-forumbee:before {
    content: "";
}

.fa-leanpub:before {
    content: "";
}

.fa-sellsy:before {
    content: "";
}

.fa-shirtsinbulk:before {
    content: "";
}

.fa-simplybuilt:before {
    content: "";
}

.fa-skyatlas:before {
    content: "";
}

.fa-cart-plus:before {
    content: "";
}

.fa-cart-arrow-down:before {
    content: "";
}

.fa-diamond:before {
    content: "";
}

.fa-ship:before {
    content: "";
}

.fa-user-secret:before {
    content: "";
}

.fa-motorcycle:before {
    content: "";
}

.fa-street-view:before {
    content: "";
}

.fa-heartbeat:before {
    content: "";
}

.fa-venus:before {
    content: "";
}

.fa-mars:before {
    content: "";
}

.fa-mercury:before {
    content: "";
}

.fa-transgender:before {
    content: "";
}

.fa-transgender-alt:before {
    content: "";
}

.fa-venus-double:before {
    content: "";
}

.fa-mars-double:before {
    content: "";
}

.fa-venus-mars:before {
    content: "";
}

.fa-mars-stroke:before {
    content: "";
}

.fa-mars-stroke-v:before {
    content: "";
}

.fa-mars-stroke-h:before {
    content: "";
}

.fa-neuter:before {
    content: "";
}

.fa-facebook-official:before {
    content: "";
}

.fa-pinterest-p:before {
    content: "";
}

.fa-whatsapp:before {
    content: "";
}

.fa-server:before {
    content: "";
}

.fa-user-plus:before {
    content: "";
}

.fa-user-times:before {
    content: "";
}

.fa-hotel:before,
.fa-bed:before {
    content: "";
}

.fa-viacoin:before {
    content: "";
}

.fa-train:before {
    content: "";
}

.fa-subway:before {
    content: "";
}

.fa-medium:before {
    content: "";
}

.action-link {
    font-size: .8125em;
    font-weight: bold;
    color: #6e797f;
}

.box .action-link {
    margin-top: em-cal(10);
}

@media all and (min-width: 768px) {
    .box .action-link {
        margin-top: 0;
        text-align: right;
    }
}

/*
    We use this file to style article-type structure. Due to some eZ limitations with our structure
    we need to apply some custom styling in to make it look good.

    @mkr 22.02.2016
*/

.single-teaser.article-type h3 {
    display: block;
}

.single-teaser.article-type .copy {
    margin-top: 0;
}

.single-teaser.article-type .copy p {
    margin: .625em 0;
}

.single-teaser.article-type .copy p + ul {
    margin: 0;
}

.single-teaser.article-type .copy ul {
    margin: .625em 0 0;
}

.single-teaser.article-type .copy li:last-child {
    margin-bottom: 0;
}

.search-terms {
    /* helps position results */
    position: relative;
}

.suggestion-text-wrapper.with-image {
    float: left;
    width: 16.25em;
}

.suggestion-text-wrapper.product-line strong {
    font-size: .875em;
}

.suggestion-text-wrapper.text-line p {
    font-weight: bold;
    color: #bbb;
    font-size: .875em;
}

.suggestion-text-wrapper.text-line p b {
    color: #5e6a71;
}

.suggestion-link-more {
    display: block;
    border-top: 1px solid #f7f7f7;
    font-size: .75em;
    padding-top: .3125em;
    margin-top: .3125em;
    color: #bbb;
}

ul.quartered li.category ul li div.autocomplete-suggestions {
    display: none;
}

.autocomplete-suggestions {
    border: 1px solid #e0e0e0;
    border-top-color: #525c62;
    background: #fff;
    overflow: auto;
    padding: .625em;
    left: auto !important;
    top: 3.125em !important;
    right: 0 !important;
    width: 22.5em !important;
}

.autocomplete-suggestion {
    overflow: hidden;
    border-top: 1px solid #f7f7f7;
}

.autocomplete-suggestion > div {
    padding: .3125em 0;
}

.autocomplete-suggestion > div:hover {
    cursor: pointer;
    background: #f7f7f7;
}

.autocomplete-suggestion:last-child {
    padding-bottom: 0;
}

.autocomplete-suggestions strong {
    color: #525c62;
    font-size: .75em;
}

.autocomplete-group {
    padding: 0;
    margin-top: 1.5em;
}

.autocomplete-group:first-child {
    margin-top: 0;
}

.autocomplete-group strong {
    display: block;
    color: #7090b7;
    font-weight: bold;
    padding-bottom: .3125em;
    font-size: 1.125em;
}

.autocomplete-suggestion img {
    float: left;
    max-width: 3.75em;
    padding: 0 .3125em;
}

.autocomplete-suggestion p {
    font-size: .75em;
    color: #525c62;
    line-height: 12px;
    margin-top: 2px;
}

/* Basket */

table.basket {
    margin-top: .9375em;
    margin-bottom: .9375em;
    border-collapse: separate !important;
}

table.basket thead th,
table.basket tbody td {
    padding: .625em;
}

table.basket tbody td {
    border-left: 1px solid #d7d9db;
    border-bottom: 1px solid #d7d9db;
    vertical-align: top;
}

table.basket tbody tr td:first-child {
    border-left-color: #485157;
}

table.basket tbody tr td:last-child {
    border-right: 1px solid #485157;
}

table.basket tbody tr:last-child td {
    border-bottom-color: #485157;
}

table.basket thead th {
    background: #5e6a71;
    color: #fff;
    border-left: 1px solid #485157;
    font-size: .875em;
    text-align: right;
}

table.basket thead th:first-child {
    text-align: left;
}

table.basket thead th div {
    line-height: 2.4375em;
}

table.basket thead th:first-child {
    border-top-left-radius: .3125em;
    border: 0;
}

table.basket thead th:last-child {
    border-top-right-radius: .3125em;
    border-right: 0;
}

table.basket tbody tr:last-child td:first-child {
    border-bottom-left-radius: .3125em;
}

table.basket tbody tr:last-child td:last-child {
    border-bottom-right-radius: .3125em;
}

table.basket tbody tr:nth-of-type(even) {
    background-color: #f7f7f7;
}

table.basket tfoot td {
    padding: .625em 0 0 .625em;
    font-size: .875em;
}

.c-basket__total-sum,
table.basket .total_sum td {
    font-size: 1.5em;
}

.c-basket a,
table.basket a {
    color: #5e6a71;
    font-weight: bold;
    display: inline-block;
}

table.basket td {
    font-size: .875em;
}

.c-basket dl.additional_info,
table.basket td dl.additional_info {
    font-size: .75em;
}

.c-basket dl.additional_info dt::after,
table.basket td dl.additional_info dt::after {
    content: ":";
}

.c-basket dl.additional_info dt,
table.basket td dl.additional_info dt {
    float: left;
    margin-right: .25em;
}

.c-basket dl.additional_info dt,
table.basket td dl.additional_info dt,
.c-basket dl.additional_info dd,
table.basket td dl.additional_info dd {
    padding-top: .1875em;
}

.c-basket dl.additional_info dd.statistical_good,
table.basket td dl.additional_info dd.statistical_good {
    float: left;
}

.c-basket dl.additional_info dt.country_of_production,
table.basket td dl.additional_info dt.country_of_production {
    padding-left: .1875em;
}

/* Additional item container fix */

.additional-item {
    position: relative;
}

.c-basket__wrapper {
    width: 96%;
    margin-left: 2%;
}

@media all and (min-width: 1024px) {
    .c-basket__wrapper {
        width: 75%;
    }
}

.c-basket {
    margin-bottom: 15px;
    border: 1px solid #5e6171;
    border-radius: .3125em;
    overflow: hidden;
    font-size: .875em;
}

.c-basket .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.c-basket .row > .columns {
    padding-left: 0;
    padding-right: 0;
}

.c-basket .row > .columns .columns {
    padding-left: .625em !important;
    padding-right: .625em !important;
}

.c-basket .row .row.collapse > .columns {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.c-basket .row .columns .row .columns .row .columns:first-child {
    padding-left: 0 !important;
}

.c-basket .row .columns .row .columns .row .columns:last-child {
    padding-right: 0 !important;
}

.c-basket__header {
    background-color: #5e6a71;
    color: white;
    font-weight: bold;
}

.c-basket__header-item {
    line-height: 35px;
    border-right: 1px solid #485157;
    padding: .5625em .625em !important;
    font-size: 1em;
}

.c-basket__header-item:last-child {
    border-right: none;
}

.c-basket__row {
    border-top: 1px solid #d7d9db;
}

.c-basket__row:nth-child(odd) {
    background-color: #f7f7f7;
}

.c-basket__row:first-child {
    border-top: 1px solid #5e6a71;
}

@media all and (min-width: 768px) {
    .c-basket__row:first-child {
        border-top: none;
    }
}

.c-basket__row input {
    margin-bottom: 0;
}

.c-basket__row > div {
    padding-top: .625em;
    padding-bottom: .625em;
}

@media all and (min-width: 768px) {
    .c-basket__row > div {
        border-right: 1px solid #d7d9db;
    }
}

.c-basket__row > div:last-child {
    border-right: none;
}

@media all and (min-width: 768px) {
    .c-basket__row {
        display: -ms-flexbox;
        display: flex;
    }
}

.c-basket__footer {
    font-size: .875em;
    margin-bottom: .9375em;
}

.c-basket__footer--checkout {
    font-size: 1em;
    border-top: 2px solid #5e6a71;
    margin-bottom: 1.25em;
}

.c-basket__footer--checkout .c-basket__total-sum {
    font-size: 1em;
}

.c-basket__footer-row {
    margin-top: .71429em !important;
}

/* Checkout - delivery addresses list */

.delivery_addresses_wrapper {
    background: #e0e0e0;
    padding: .5em;
    line-height: 1.375em;
    font-size: .8125em;
    border: 1px solid #bbb;
    border-radius: .25em;
}

.delivery_addresses_wrapper .slimScrollDiv ul {
    padding-right: 1.25em;
}

#delivery_address_list li {
    margin-bottom: .5em;
    padding-bottom: .5em;
    border-bottom: 1px solid #e0e0e0;
}

#delivery_address_list li:last-child {
    margin: 0;
    padding: 0;
    border: 0;
}

#delivery_address_list .button {
    font-size: 1em;
    margin: .5em 0 0;
}

.shipping_selection .alert-info {
    margin-top: 0;
}

.address-input {
    margin-bottom: 1.25em;
}

.address-input .a-input {
    margin-bottom: 0;
}

.address-input .a-copy--error {
    margin-top: .625em;
}

#client-information h2 {
    margin: .25em 0;
}

#client-information ul {
    margin: 0;
    padding: 0 0 2em;
    list-style: none;
    font-size: .875em;
    line-height: 1.78571em;
    border-top: 1px solid #d7dadb;
}

#client-information li {
    border-bottom: 1px solid #d7dadb;
    padding: 3px 5px;
    float: left;
    width: 100%;
}

#client-information li.even,
#client-information li:nth-of-type(even) {
    background-color: #f9f9f9;
}

#client-information li strong {
    float: left;
    width: 40%;
}

#client-information li span {
    float: right;
    width: 59%;
}

.flex-container {
    display: -ms-flexbox;
    display: flex;
}

.flex-container.flex-center {
    -ms-flex-align: center;
        align-items: center;
}

/*
    Document        : storm.cookiepolicy
    Author          : mkr, mno
    Dependencies    :
    Description:
        Storm cookie policy plugin stylesheets.
*/

.cp-overlay {
    position: fixed;
    z-index: 9998;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #000;
    filter: alpha(opacity=50);
    opacity: .5;
}

.cp-dialog {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: visible;
    z-index: 9999;
    text-align: left;
}

.cp-dialog h2 {
    margin: 0 0 .625em;
}

.cp-dialog-content {
    padding: 1.25em;
    margin: 1.25em auto;
    width: 43.75em;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    line-height: 1.375em;
}

.clear-cookies-wrapper a {
    color: #6e797f;
    margin-bottom: 0;
    padding-top: .5625em;
    padding-bottom: .5625em;
    line-height: normal;
    height: auto;
}

.cp-dialog .close,
.cp-button-wrap .close {
    position: absolute !important;
    top: 0;
    right: 0;
    padding: 10px 15px;
    margin: 0 !important;
    line-height: 18px;
    height: 18px;
    color: #485157;
    font-size: 1.5em;
}

.cp-save-wrapper .button,
.cp-button-wrap .button {
    background: #7ca295;
    border-color: #7ca295 !important;
    font-size: .875em !important;
}

.cp-button-wrap .button {
    margin-bottom: 0;
}

.cp-dialog-content .cp-logo-link {
    position: absolute;
    bottom: .1875em;
    right: .1875em;
    background-color: #efefef;
    padding: 0 .3125em;
    display: block;
}

.cp-dialog-content h1 {
    font-size: 1.4375em;
    border-bottom: 1px solid;
    border-color: inherit;
    margin: 0 0 1.25em 0;
    line-height: 1.625em;
}

.cp-button-wrap {
    margin-top: 1.25em;
    text-align: center;
}

.cp-level-changer {
    overflow: visible;
    margin: 0 auto .3125em;
    text-align: center;
    padding-bottom: .625em;
}

.cp-level-changer a {
    display: inline-block;
    height: 9.375em;
    cursor: pointer;
    position: relative;
    border: 5px solid #999;
    max-width: 9.375em;
    text-decoration: none !important;
    transition: none;
}

.cp-level-changer a:hover {
    filter: alpha(opacity=90);
    opacity: .9;
    box-shadow: 0 0 5px 0 #88b29e;
}

.cp-level-changer a span.cp-level-button-icon {
    display: block;
    position: absolute;
    top: .6875em;
    left: 10%;
    right: 13%;
    height: 4.6875em;
}

.cp-level-changer a span.cp-level-button-icon div {
    display: block;
    background-color: #999;
    position: absolute;
    bottom: 0;
    border: 1px solid #fff;
}

.cp-level-changer a span.cp-level-button-title {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2.8125em;
    padding-top: .625em;
    background-color: #999;
    color: #fff;
    font-size: .8125em;
    font-weight: bold;
}

.cp-level-changer a.activated {
    border-color: #999;
}

.cp-level-changer a.activated span.cp-level-button-title {
    background-color: #999;
}

.cp-level-changer a.activated span.cp-level-button-icon div.activated {
    background-color: #ec731e;
}

.cp-permission-panels {
    overflow: hidden;
    clear: both;
    margin-bottom: 1.25em;
    display: none !important;
}

.cp-permission-panels ul {
    padding: .3125em 0 0;
    margin: 0 0 0 1.25em;
}

.cp-permission-panels ul li {
    padding: 0 0 .25em 0;
    margin: 0;
    font-size: .875em;
}

.cp-permission-panel-disallowed {
    float: left;
    width: 49%;
}

.cp-permission-panel-allowed {
    float: right;
    width: 49%;
}

.cp-permission-panel-title {
    font-size: 1em;
    padding: .625em 0 0;
    font-weight: bold;
}

/* Cookies Warning */

.cp-popup {
    position: fixed;
    z-index: 97;
    right: 5.625em;
    bottom: 0;
    width: 25em;
    padding: 1.25em;
    background: #fff none;
    line-height: 1.5em;
    border: 1px #d7d9db solid;
    border-bottom: none;
    font-size: .8125em;
}

/* Magic Button */

.cp-toggle-magic-button {
    display: block;
    float: right;
    margin: .625em 0 .625em;
    text-decoration: underline;
}

.cp-toggle-magic-button .ui-icon {
    float: left;
    margin: .1875em .125em 0 0;
}

.cp-dialog .cp-toggle-magic-button {
    line-height: 1.25em;
}

.cp-magic-button-wrap {
    display: none;
}

.cp-magic-button-wrap iframe {
    height: 8.5625em;
    width: 100%;
}

.cp-magic-button-wrap .ui-state-highlight {
    margin: 0 0 .9375em;
    padding: .9375em;
}

/* Policy Links */

.cp-popup .cp-link {
    display: block;
    clear: both;
    margin: -1.875em 0 .625em;
    text-decoration: underline;
}

.cp-link {
    float: left;
}

.cp-link .sprite {
    margin-right: .3125em;
}

.cp-dialog-content .cp-link .sprite {
    float: left;
    margin-top: .25em;
}

/* Additional Styles @mkr */

.cp-notice-wrapper.notice p,
.cp-notice-wrapper.success p {
    margin: 0;
    text-align: center;
}

.notice.border,
.success.border {
    padding-bottom: .3125em;
}

.bottom-links {
    float: left;
    width: 100%;
    clear: both;
    text-align: center;
}

.cp-button-wrap .ui-button.text-link {
    background: none;
    border: none;
    text-decoration: underline;
}

.cp-popup a:hover,
.cp-button-wrap .ui-button.text-link:hover {
    text-decoration: none;
}

.cp-level-changer-wrap {
    float: left;
    width: 100%;
}

p.description {
    text-align: center;
    clear: both;
    padding: .3125em .625em;
}

.cp-save-wrapper {
    text-align: center;
}

.cp-save-wrapper .button {
    margin-bottom: 0;
}

#powerTip ul {
    padding-left: .9375em;
}

/* Messages */

.cp-dialog-content .message {
    border-style: solid;
    border-width: 1px;
    display: block;
    font-weight: bold;
    margin-bottom: 1.25em;
    position: relative;
    padding: .6875em 1.3125em .75em .6875em;
    font-size: .875em;
    background-color: #5e6a71;
    border-color: #525c62;
    color: #fff;
}

.cp-dialog-content .message.success {
    background-color: #7ca295;
    border-color: #6c917d;
    color: #fff;
}

.cp-dialog-content .message.notice {
    background-color: #d7d9db;
    border-color: #bbb;
    color: #555;
}

@media only screen and (max-width: 768px) {
    .cp-permission-panel-title {
        font-size: .875em;
    }

    .cp-popup {
        right: auto;
        width: 100%;
        box-sizing: border-box;
        font-size: .875em;
    }

    .cp-dialog-content {
        width: 94%;
        font-size: .875em;
        margin: .625em auto;
    }
}

#dropzone {
    background-color: #f0f4f8;
    border: 2px dashed #b8c7db;
    padding: 3.75em;
    text-align: center;
    height: 15.5625em;
    line-height: 2em;
}

#dropzone .plus {
    line-height: 3.75em;
    background-origin: border-box;
    background-position: 0 -51px;
    border: 2px dashed #b8c7db;
    height: 3.75em;
    margin: 0 auto 0;
    width: 3.75em;
}

.go-back {
    display: inline-block;
    position: relative;
    padding-left: 10px;
}

.go-back:before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 5px 5px 0;
    border-color: transparent #7090b7 transparent transparent;
    position: absolute;
    content: '';
    top: 2px;
    left: 0;
}

.go-back:last-child {
    margin: 1em 0;
}

/* Details - check Redmine ticket: #10729 */

/*
    Custom background colors
    We use these to make dropdowns greenish
*/

.positive {
    margin-left: -5px;
    background-color: #88b29e;
    color: #fff !important;
}

.positive.change-color {
    color: #fff !important;
    background-color: #88b29e;
    box-shadow: none;
}

.meta-nav .dropdown-handle.positive .arrow {
    border-top-color: #fff;
}

.meta-nav .dropdown-handle.positive i {
    color: #fff;
}

.dropdown-wrapper > .dropdown.positive {
    background-color: #88b29e !important;
}

.dropdown-wrapper > .dropdown.positive > li:not(.plain) {
    background: linear-gradient(#7ca295, #88b29e);
}

.dropdown-wrapper > .dropdown.positive > li:not(.plain):not(.nohover):hover {
    background: linear-gradient(#6c917d, #749b87);
}

/* visibility breakpoints */

@media only screen and (max-width: 1024px) {
    /* found product counter */

    .catalog-list-wrapper .meta-nav div.meta-nav-right:not(.clear-float) {
        position: static;
        border-top-width: 1px;
    }
}

@media screen and (max-width: 640px) {
    /* hide dropdown label, show icon only up to 640px */

    .meta-nav .dropdown-handle span:not(.arrow) {
        display: none;
    }
}

@media screen and (min-width: 640px) {
    /* show dropdown label and show icon when bigger than 640px */

    .meta-nav .dropdown-handle span:not(.arrow) {
        display: inline-block;
    }
}

.with-express-label {
    padding-right: 120px;
}

.results tbody a {
    color: #516885;
    text-decoration: underline;
}

.price_currency {
    display: none;
}

#form-generator textarea {
    height: auto;
}

@media screen and (min-width: 768px) {
    .navigation_sub_head {
        padding: 15px 20px 12px 20px;
        color: #fff;
    }
}

@media screen and (max-width: 767px) {
    .navigation_sub_head {
        padding: 15px 20px 12px 12px;
    }
}

.navigation_sub_head {
    font-weight: bold;
    font-size: 18px;
    display: block;
    cursor: default;
    word-break: normal;
}

#ie_modal {
    height: auto;
}

#main-navigation > nav > ul > li.my-buerkert,
#main-navigation > nav > ul > li.my-buerkert.active {
    background: #7ca295;
}

#main-navigation > nav > ul > li.my-buerkert li.category,
#main-navigation > nav > ul > li.my-buerkert.active li.category,
#main-navigation > nav > ul > li.my-buerkert li.category li {
    background: #88b29e;
}

#main-navigation > nav > ul > li.my-buerkert > i,
#main-navigation > nav > ul > li.my-buerkert a {
    color: #fff;
}

@media screen and (min-width: 769px) {
    #main-navigation > nav > ul > li.my-buerkert .content-wrapper {
        background-color: #88b29e;
        border-top: .5625em solid #7ca295;
    }
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li a:hover,
#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.active a {
    background: #7ca295;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper .content ul li.category > a {
    border-bottom: 1px #7ca295 solid;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.item span {
    background: none;
    border-radius: 3px;
    font-family: 'Helvetica Extended Light';
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857;
    color: #fff;
    display: block;
    padding: 12px 0 6px 20px;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.item.body a,
#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.item.body span {
    font-size: 12px !important;
    font-family: 'Helvetica Extended Light';
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857;
    display: block;
    padding: 3px 0 3px 20px;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.item a i,
#main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.item span i {
    margin-left: 0;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper .footer {
    background: #7ca295;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper .footer .overview {
    background: #88b29e;
    border-top: 1px solid #7ca295;
}

#main-navigation > nav > ul > li.my-buerkert .content-wrapper .footer .teaser-wrapper .teaser figcaption {
    background: #7ca295;
}

.my-buerkert.hidden {
    display: none !important;
}

@media screen and (max-width: 768px) {
    .accordion-navigation li ul.current-visible li:after {
        display: none;
    }

    .my-buerkert .footer {
        padding-top: 1em;
    }

    #main-navigation .contact-person h2,
    .contact-person ul li,
    .my-buerkert .contact-person ul li {
        color: #fff;
    }

    #main-navigation > nav > ul > li.my-buerkert .content-wrapper ul.quartered > li li.item a:after {
        display: none;
    }
}

/* Popup message */

.popup-message {
    position: absolute;
    top: 10.625em !important;
    margin-left: -16.875em;
    width: 33.75em;
    padding: 0;
    font-size: .875em;
    line-height: 1em;
    border-color: #d7d9db;
    box-shadow: none;
}

.popup-message-content {
    padding: 1.25em 1.25em 0;
    position: relative;
}

.popup-message-content.dimmed:after {
    top: -0.0625em;
    right: -0.0625em;
    bottom: -0.0625em;
    left: -0.0625em;
    position: absolute;
    content: '';
    background: #000;
    background: rgba(0, 0, 0, .45);
}

.popup-message-header h4 {
    text-align: center;
    margin-bottom: .625em;
    color: #525c62;
    font-size: 1em;
}

.popup-message-header p {
    padding-left: 1.25em;
    padding-right: 1.25em;
}

.popup-message .choose-website {
    border: 1px solid #e0e0e0;
    border-radius: .1875em;
    padding-top: 1.25em;
    padding-bottom: 1.25em;
    margin-top: 1.25em;
    margin-bottom: 1.25em;
}

.popup-message figcaption {
    padding: .3125em 0;
}

.popup-cookie-link-wrapper {
    margin-bottom: .9375em;
    margin-top: .9375em;
}

.popup-cookie-link-wrapper p {
    margin-bottom: .625em;
}

.popup-cookie-link-wrapper button {
    margin: 0 .3125em;
    padding-top: .5em;
    padding-bottom: .375em;
    height: auto;
}

.popup-message .button {
    margin-bottom: 0;
    font-size: 1.125em;
}

.popup-message input {
    margin-bottom: 0;
}

.popup-message label {
    display: inline-block;
}

@media screen and (max-width: 768px) {
    .popup-message {
        top: 1.25em !important;
        width: 90%;
        margin-left: -45%;
    }

    .popup-message-header p {
        padding-left: .625em;
        padding-right: .625em;
    }

    .popup-message .choose-website {
        padding: .3125em;
    }

    .popup-message .button {
        height: auto;
        padding: .625em;
        width: 100%;
        font-size: 1em;
    }
}

@media screen and (max-width: 380px) {
    .popup-message-content {
        padding: .625em .625em 0;
        position: relative;
    }
}

/* Popup modal window with Ajax content */

.popup-modal {
    max-width: 60.5em;
    width: 100%;
    height: 80%;
    margin: 0 auto;
    background: #fff;
    padding: 1em;
    line-height: 1.25em;
    box-shadow: 0 0 6.25em #999;
}

.popup-modal-inner {
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-right: 1em;
}

.popup-modal header {
    margin-bottom: 2em;
    width: 100%;
    float: left;
}

.popup-modal header h1 {
    line-height: normal;
    float: left;
}

.popup-modal .icon-close {
    float: right;
    font-size: 2em;
    border: 1px solid #d7d9db;
    border-radius: .1875em;
    margin-top: .5em;
    line-height: 2em;
}

/* Ses popup */

.ses_popup label p {
    display: inline;
}

.ses_popup label {
    text-indent: 0 !important;
}

/* Product delivery widget */

.product .product-info .availability-check .text-box span.hide {
    display: none;
}

/* Product list modifications */

.box .footer ul li > a > .right .compare,
.box .footer ul li > a > .right .compare label {
    float: left !important;
    margin-top: .5em;
}

.box .footer ul li > a > .right > span[itemprop=price] {
    float: none;
}

/* in order to fit add to wishlist in product list */

@media screen and (min-width: 1024px) {
    .box .footer ul li > a > .right {
        text-align: right;
    }

    .box .footer ul li > a > .right .compare,
    .box .footer ul li > a > .right .compare label {
        float: right !important;
        margin-top: 0;
    }

    .box .footer ul li > a > .right > span.price {
        float: right;
    }
}

.c-quickorder__csv-field {
    height: 17.85714em;
}

/* Sitemap */

.sitemap.small-copy {
    margin: 0 0 0 1em;
    padding: 0;
}

.sitemap.small-copy ul {
    font-size: 1em;
}

.sitemap a {
    color: #5e6a71;
}

/* Spare parts form elements */

.spare-parts input,
.spare-parts button {
    margin-bottom: 0;
}

.spare-parts input {
    float: left;
    margin-right: 1em;
    width: 25%;
}

.spare-parts tr td:nth-child(4) {
    width: 25%;
}

/* Spare part image */

.spare-part-image {
    margin: 3em 0 1em;
}

.c-table {
    margin: 20px 0;
}

.c-table__head .c-table__cell {
    font-weight: bold;
    background-color: #7090b7;
    color: #fff;
}

.c-table__cell {
    vertical-align: top;
    text-align: left;
    padding: 8px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    background-color: #dbe4ed;
}

.c-table__body .c-table__row:nth-of-type(odd) .c-table__cell {
    background-color: #b8c7da;
}

@media (max-width: 1023px) {
    .c-table {
        position: relative;
        overflow: inherit;
        display: block;
    }

    .c-table__cell {
        height: 65.6px;
        /* Fallback for non-webkit */
        text-overflow: ellipsis;
        overflow: hidden;
        font-size: 16px;
        line-height: 1.2;
        display: block;
    }

    .c-table__body .c-table__cell {
        min-width: 200px;
        max-width: 350px;
    }

    .c-table__row {
        display: table-cell;
    }

    .c-table__head .c-table__row {
        display: block;
    }

    .c-table__head {
        position: absolute;
        display: block;
        float: left;
        width: 160px;
        z-index: 1;
    }

    .c-table__body {
        position: relative;
        overflow-x: auto;
        overflow-y: hidden;
        padding-left: 160px;
        display: block;
    }
}

.c-table-like__wrapper {
    margin-bottom: 15px;
    border: 1px solid #5e6171;
    border-radius: .3125em;
}

.c-table-like__wrapper .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.c-table-like__wrapper .row .columns .columns {
    padding: 0 !important;
}

.c-table-like__header {
    background-color: #5e6a71;
    color: white;
    font-weight: bold;
}

.c-table-like__header-item {
    line-height: 3.33em;
    border-right: 1px solid #485157;
    padding: .5625em .625em !important;
    font-size: .8125em;
}

.c-table-like__header-item:last-child {
    border-right: none;
}

.c-table-like__row {
    border-top: 1px solid #d7d9db;
}

.c-table-like__row:nth-child(even) {
    background-color: #f7f7f7;
}

.c-table-like__row:first-child {
    border-top: 1px solid #5e6a71;
}

@media all and (min-width: 768px) {
    .c-table-like__row:first-child {
        border-top: none;
    }
}

.c-table-like__row input {
    margin-bottom: 0;
}

.c-table-like__row > div {
    padding: .5625em .625em !important;
}

@media all and (min-width: 768px) {
    .c-table-like__row > div {
        line-height: 40px;
        border-right: 1px solid #d7d9db;
    }
}

.c-table-like__row > div:last-child {
    border-right: none;
}

@media all and (min-width: 768px) {
    .c-table-like__row {
        display: -ms-flexbox;
        display: flex;
    }
}

.c-table-like__row.hidden {
    display: none;
}

.toast-title {
    font-weight: bold;
}

.toast-message {
    word-wrap: break-word;
}

.toast-message a,
.toast-message label {
    color: #fff;
}

.toast-message a:hover {
    color: #bbb;
    text-decoration: none;
}

.toast-close-button {
    position: relative;
    right: -0.3125em;
    top: -0.3125em;
    float: right;
    font-size: 1.25em;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 1px 0 #fff;
    opacity: .8;
    filter: alpha(opacity=80);
    box-shadow: none;
}

.toast-close-button:hover,
.toast-close-button:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: .4;
    filter: alpha(opacity=40);
}

/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/

button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
}

.toast-top-center {
    top: 0;
    right: 0;
    width: 100%;
}

.toast-bottom-center {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%;
}

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast-top-left {
    top: .75em;
    left: .75em;
}

.toast-top-right {
    top: .75em;
    right: .75em;
}

.toast-bottom-right {
    right: .75em;
    bottom: .75em;
}

.toast-bottom-left {
    bottom: .75em;
    left: .75em;
}

#toast-container {
    position: fixed;
    z-index: 99999;
    /*overrides*/
}

#toast-container * {
    box-sizing: border-box;
}

#toast-container > div {
    position: relative;
    overflow: hidden;
    margin: 0 0 .375em;
    padding: .9375em .9375em .9375em 3.125em;
    width: 18.75em;
    border-radius: .1875em;
    background-position: .9375em center;
    background-repeat: no-repeat;
    box-shadow: 0 0 12px #999;
    color: #fff;
    opacity: .8;
    filter: alpha(opacity=80);
}

#toast-container > :hover {
    box-shadow: 0 0 12px #000;
    opacity: 1;
    filter: alpha(opacity=100);
    cursor: pointer;
}

#toast-container > .toast-info {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important;
}

#toast-container > .toast-error {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important;
}

#toast-container > .toast-success {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;
}

#toast-container > .toast-warning {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important;
}

#toast-container.toast-top-center > div,
#toast-container.toast-bottom-center > div {
    width: 18.75em;
    margin: auto;
}

#toast-container.toast-top-full-width > div,
#toast-container.toast-bottom-full-width > div {
    width: 96%;
    margin: auto;
}

.toast {
    background-color: #000;
}

.toast-success {
    background-color: #7ca295;
}

.toast-error {
    background-color: #b5626f;
}

.toast-info {
    background-color: #2f96b4;
}

.toast-warning {
    background-color: #ec731e;
}

.toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: .25em;
    background-color: #000;
    opacity: .4;
    filter: alpha(opacity=40);
}

/*Responsive Design*/

@media all and (max-width: 240px) {
    #toast-container > div {
        padding: .5em .5em .5em 3.125em;
        width: 11em;
    }

    #toast-container .toast-close-button {
        right: -0.1875em;
        top: -0.1875em;
    }
}

@media all and (min-width: 241px) and (max-width: 480px) {
    #toast-container > div {
        padding: .5em .5em .5em 3.125em;
        width: 18em;
    }

    #toast-container .toast-close-button {
        right: -0.1875em;
        top: -0.1875em;
    }
}

@media all and (min-width: 481px) and (max-width: 768px) {
    #toast-container > div {
        padding: .9375em .9375em .9375em 3.125em;
        width: 25em;
    }
}

@media only print, screen and (min-width: 75.0625em) {
    #toast-container {
        left: 50%;
        margin-left: 11.1875em;
    }
}

#toast-container > div {
    margin: 0 0 .625em;
    padding: .9375em 1.5625em .9375em 3.125em;
    font-size: .875em;
    border-radius: 0;
    box-shadow: 0 0 30px #bbb;
    opacity: 1;
    line-height: normal;
}

@media only print, screen and (min-width: 48.0625em) {
    #toast-container > div {
        width: 18.75em;
    }
}

#toast-container > div:hover {
    box-shadow: 0 0 30px #999;
}

#toast-container > div:before {
    position: absolute;
    left: .9375em;
    top: 50%;
    -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    font-family: FontAwesome;
    font-size: 1.5em;
}

#toast-container > div.toast-success {
    border-radius: .1875em !important;
    border-left: 5px solid #7ca295;
    color: #fff;
    background-color: #88b29e;
    background-image: none !important;
}

#toast-container > div.toast-success:before {
    content: '\f058';
    color: #7ca295;
}

#toast-container > div.toast-error {
    border-radius: .1875em !important;
    border-left: .3125em solid #b5626f;
    color: #fff;
    background-color: #c5858f;
    background-image: none !important;
}

#toast-container > div.toast-error:before {
    content: '\f06a';
    color: #b5626f;
}

#toast-container > div.toast-info {
    border-radius: .1875em !important;
    border-left: .3125em solid #2f96b4;
    color: #0b4473;
    background-color: #cfe7fb;
    background-image: none !important;
}

#toast-container > div.toast-info:before {
    content: '\f05a';
    color: #use_col info;
}

#toast-container > div.toast-warning {
    border-radius: .1875em !important;
    border-left: .3125em solid #ec731e;
    color: #000;
    background-color: #fbb450;
    background-image: none !important;
}

#toast-container > div.toast-warning:before {
    content: '\f071';
    color: #ec731e;
}

.toast-close-button {
    right: .25em;
    background: inherit;
    color: #333;
    font-size: 1.375em;
    line-height: .875em;
    margin-top: -0.6875em;
    opacity: .3;
    padding: 0 .375em .25em;
    position: absolute;
    top: 50%;
    top: 1em !important;
    right: .375em !important;
    text-shadow: none;
    font-weight: normal;
}

.toast-close-button:hover,
.toast-close-button:focus {
    opacity: .5;
}

.toast-close-button:hover,
.toast-close-button:focus {
    background: none;
    text-decoration: none;
    cursor: pointer;
    opacity: .5;
}

.toast-top-right {
    top: 4.6875em;
    right: .625em;
}

@media only print, screen and (min-width: 48.0625em) {
    .toast-top-right {
        top: 8.125em;
        right: 1.5625em;
    }
}

.wishlist {
    line-height: normal;
}

.country-select {
    margin: 0 0 15px 0;
}

.country-select .custom.dropdown {
    display: none !important;
}

.country-select select {
    display: block;
}

.country-select .chosen-container {
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    border-radius: .1875em;
    border: 1px solid #ccc;
    position: relative;
    display: inline-block;
    width: 100% !important;
    vertical-align: middle;
    font-size: .875em;
}

.country-select .chosen-container a {
    cursor: pointer;
}

.country-select .chosen-container .chosen-single {
    height: 2.85714em;
    background-color: transparent;
}

.country-select .chosen-container .chosen-single a:hover {
    cursor: pointer;
}

.country-select .chosen-container .chosen-single:hover {
    background-color: transparent;
    color: #5e6a71;
}

.country-select .chosen-container .chosen-drop {
    margin-top: 0;
    width: 100%;
    top: 100%;
    left: -9999px;
    z-index: 1010;
    position: absolute;
}

.country-select .chosen-container .chosen-drop:before {
    display: none;
}

.country-select .chosen-container .chosen-drop ul {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    font-size: 1.14286em;
    left: -1px;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    max-height: 14.28571em;
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #d7d9db;
}

.country-select .chosen-container .chosen-drop ul li {
    margin: 0;
    padding: .25em 2.375em .25em .375em;
    color: #555;
    cursor: default;
    font-size: .875em;
    line-height: 1.42857em;
    list-style: none outside none;
    min-height: 1.42857em;
    white-space: nowrap;
}

.country-select .chosen-container .chosen-drop ul li:hover {
    background-color: #e0e0e0;
}

.country-select .chosen-container.chosen-container-single-nosearch .chosen-drop .chosen-search {
    display: none;
}

.country-select .chosen-container-single {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.country-select .chosen-container-single .chosen-search input[type='text'] {
    width: 100%;
    outline: 0;
    border: 1px solid #CCCCC;
    font-size: 1em;
    font-family: sans-serif;
    line-height: normal;
}

.country-select .chosen-container.chosen-with-drop .chosen-single div b {
    margin-top: -3px;
    border-bottom: 5px solid #fff;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}

.country-select .chosen-container.chosen-with-drop .chosen-drop {
    left: 0;
}

.country-select .chosen-container-single .chosen-single {
    position: relative;
    display: block;
    overflow: hidden;
    line-height: 2.85714em;
    background-color: #fff;
    height: 2.875em;
    padding: 0 .71429em;
    color: #5e6a71;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    border-radius: 3px;
}

.country-select .chosen-container-single .chosen-single span {
    display: block;
    overflow: hidden;
    line-height: 40px;
}

.country-select .chosen-container-single .chosen-single div {
    background: -owg-linear-gradient(#5e6a71, #525c62);
    background: linear-gradient(#5e6a71, #525c62);
    border-top-right-radius: .23077em;
    border-bottom-right-radius: .23077em;
    position: absolute;
    display: block;
    top: -1px;
    right: 0;
    width: 35px;
    height: 42px;
    background-color: #516885;
}

.country-select .chosen-container-single .chosen-single div b {
    position: absolute;
    display: block;
    left: .92308em;
    margin-top: -1px;
    top: 50%;
    width: 0;
    height: 0;
    border: 5px solid;
    content: " ";
    border-color: #fff transparent transparent;
    border-top-style: solid;
}

.country-select .chosen-container-single .chosen-drop {
    border-radius: 0 0 3px 3px;
    background-clip: padding-box;
}

.country-select .chosen-container-single .chosen-search {
    position: relative;
    z-index: 1010;
    margin: 0;
    white-space: nowrap;
}

.country-select .chosen-container-single .chosen-search .icon-tool-nav-search {
    display: block;
    font-size: 1.78571em;
    position: absolute;
    right: .35714em;
    top: .35714em;
}

.country-select .chosen-container-single .chosen-search input[type='text'] {
    width: 100%;
    outline: 0;
    border: 1px solid #999;
    font-size: 1em;
    font-family: sans-serif;
    line-height: normal;
    border-radius: 0;
    box-shadow: none;
}

.country-select .chosen-search {
    position: absolute;
    height: 2.85714em;
}

/* Cookie Consent - based on oil.js Plugin */

.as-oil,
#oil-preference-center {
    height: 100%;
    background: rgba(0, 0, 0, .4);
    font-family: "Helvetica Neue Extended", Helvetica, sans-serif;
}

.as-oil .as-oil-cpc__content,
#oil-preference-center .as-oil-cpc__content {
    display: block;
}

.as-oil .as-oil__heading,
.as-oil .as-oil-cpc-wrapper .as-oil__heading,
#oil-preference-center .as-oil__heading,
#oil-preference-center .as-oil-cpc-wrapper .as-oil__heading {
    font-family: "Helvetica Neue Extended", Helvetica, sans-serif;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 23px;
    margin: 0;
    -webkit-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
    word-break: break-word;
    word-wrap: break-word;
    color: #5e6a71;
}

.as-oil .as-oil__intro-txt,
.as-oil .as-oil-cpc-wrapper .as-oil__intro-txt,
#oil-preference-center .as-oil__intro-txt,
#oil-preference-center .as-oil-cpc-wrapper .as-oil__intro-txt {
    min-width: 100%;
    margin: 20px 0;
    max-width: 100%;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #5e6a71;
}

.as-oil .as-oil-cpc__purpose,
#oil-preference-center .as-oil-cpc__purpose {
    height: 40px;
    overflow: hidden;
    position: relative;
    transition: max-height .8s;
    border: 1px solid #d7dadb;
    border-radius: 4px;
    padding: 0;
    color: #5e6a71 !important;
    cursor: pointer;
}

.as-oil .as-oil-cpc__purpose:before,
#oil-preference-center .as-oil-cpc__purpose:before {
    content: "\f0d7";
    height: 40px;
    float: right;
    font-size: 1.25rem;
    font-family: FontAwesome;
    position: absolute;
    top: 0;
    left: 0;
    color: #333;
    line-height: 40px;
    margin-left: 15px;
    z-index: 10;
}

.as-oil .as-oil-cpc__purpose .as-oil-cpc__purpose-text,
#oil-preference-center .as-oil-cpc__purpose .as-oil-cpc__purpose-text {
    padding: 10px 0 0 0;
}

.as-oil .as-oil-cpc__purpose .as-oil-cpc__purpose-text p,
#oil-preference-center .as-oil-cpc__purpose .as-oil-cpc__purpose-text p {
    margin: 0 10px 10px 10px;
    font-family: "Helvetica Neue Extended", Helvetica, sans-serif;
    font-size: .875rem !important;
    font-weight: 400;
    letter-spacing: .3px;
}

.as-oil .as-oil-cpc__row-title,
#oil-preference-center .as-oil-cpc__row-title {
    display: none;
}

.as-oil .as-oil-cpc__purpose.shown,
#oil-preference-center .as-oil-cpc__purpose.shown {
    height: auto;
    overflow: visible;
    transition: max-height .8s;
}

.as-oil .as-oil-cpc__purpose.shown:before,
#oil-preference-center .as-oil-cpc__purpose.shown:before {
    content: "\f0d8";
}

.as-oil .as-oil-cpc__purpose-header,
#oil-preference-center .as-oil-cpc__purpose-header {
    padding: 4px 55px 4px 35px;
    color: #5e6a71;
    font-weight: 400;
    font-size: 1rem;
    margin: 0;
    background-color: #f0f4f8;
    height: 40px;
}

@media (min-width: 1200px) {
    .as-oil .as-oil-cpc__purpose-header,
    #oil-preference-center .as-oil-cpc__purpose-header {
        padding: 10px 75px 10px 0;
        font-size: 1.25rem;
    }
}

.as-oil .as-oil-cpc__middle,
#oil-preference-center .as-oil-cpc__middle {
    -ms-flex: none;
        flex: none;
    padding: 0;
    overflow: visible;
    overflow-y: scroll;
}

.as-oil .as-oil-cpc__left,
#oil-preference-center .as-oil-cpc__left {
    -ms-flex: none;
        flex: none;
    display: none;
}

.as-oil .as-oil-content-overlay,
#oil-preference-center .as-oil-content-overlay {
    border-radius: 4px;
    border: 1px solid #d7dadb;
    background: #fff;
    padding: 20px;
    position: fixed;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    bottom: auto;
    max-width: 800px;
}

.as-oil .as-oil-l-row--fixed-width,
.as-oil .as-oil-l-wrapper-layout-max-width,
#oil-preference-center .as-oil-l-row--fixed-width,
#oil-preference-center .as-oil-l-wrapper-layout-max-width {
    max-width: 100%;
}

.as-oil .as-oil-l-item,
#oil-preference-center .as-oil-l-item {
    text-align: center;
}

.as-oil .as-oil-l-wrapper-layout-max-width,
#oil-preference-center .as-oil-l-wrapper-layout-max-width {
    text-align: center;
}

.as-oil .as-oil-l-wrapper-layout-max-width table,
#oil-preference-center .as-oil-l-wrapper-layout-max-width table {
    text-align: left;
}

.as-oil .as-oil-l-row as-oil-l-buttons,
#oil-preference-center .as-oil-l-row as-oil-l-buttons {
    min-width: 100%;
}

.as-oil .as-oil__btn-optin,
#oil-preference-center .as-oil__btn-optin {
    box-shadow: none;
    background-color: #7090b7;
    border: 1px solid #516987;
    font-size: .875rem;
    line-height: 1.25rem;
    font-family: Helvetica Neue, Helvetica, sans-serif;
    font-weight: 400;
    position: relative;
    color: #fff;
    border-radius: 4px;
    min-height: 48px;
    padding: 0 20px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
        align-items: center;
    text-align: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer;
    transition: color .25s ease-in-out, background-color .15s ease-in-out;
}

.as-oil .as-oil__btn-blue,
#oil-preference-center .as-oil__btn-blue {
    box-shadow: none;
    background-color: #7090b7;
    border: 1px solid #516987;
    font-size: .75rem;
    line-height: 1rem;
    font-family: Helvetica Neue, Helvetica, sans-serif;
    font-weight: 400;
    position: relative;
    color: #fff;
    border-radius: 4px;
    min-height: 28px;
    padding: 0 20px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
        align-items: center;
    text-align: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer;
    transition: color .25s ease-in-out, background-color .15s ease-in-out;
}

.as-oil .as-oil__btn-blue:hover,
#oil-preference-center .as-oil__btn-blue:hover {
    background-color: #6481a4;
    color: #fff;
}

.as-oil .as-oil__btn-optin:hover,
#oil-preference-center .as-oil__btn-optin:hover {
    background-color: #6481a4;
    color: #fff;
}

.as-oil .as-oil__btn-cpc,
#oil-preference-center .as-oil__btn-cpc {
    min-height: 42px;
    margin: 0;
    padding: .5rem 1rem;
    font-size: 1.1rem;
    font-weight: 700;
    border: none;
    border-radius: 3px;
    outline: none;
    cursor: pointer;
    color: #333;
    background-color: #ccc;
    transition: opacity .8s ease 0s;
    margin-top: 5px;
}

.as-oil .as-oil__btn-cpc.as-js-advanced-settings,
#oil-preference-center .as-oil__btn-cpc.as-js-advanced-settings {
    box-shadow: none;
    background-color: #fff;
    border: 1px solid #6f8fb6;
    color: #6f8fb6;
    font-size: .875rem;
    line-height: 1.25rem;
    font-family: Helvetica Neue, Helvetica, sans-serif;
    font-weight: 400;
    position: relative;
    border-radius: 4px;
    min-height: 48px;
    width: 100%;
    padding: 0 20px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
        align-items: center;
    text-align: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer;
    transition: color .25s ease-in-out, background-color .15s ease-in-out;
}

.as-oil .as-oil__btn-grey,
#oil-preference-center .as-oil__btn-grey {
    box-shadow: none;
    background-color: #fff;
    border: 1px solid #6f8fb6;
    color: #6f8fb6;
    font-size: .75rem;
    line-height: 1rem;
    font-family: Helvetica Neue, Helvetica, sans-serif;
    font-weight: 400;
    position: relative;
    border-radius: 4px;
    min-height: 28px;
    padding: 0 20px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
        align-items: center;
    text-align: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer;
    transition: color .25s ease-in-out, background-color .15s ease-in-out;
}

.as-oil .as-oil__btn-grey:hover,
#oil-preference-center .as-oil__btn-grey:hover {
    background-color: #f6f8fb;
    color: #6f8fb6;
}

.as-oil .as-oil__btn-cpc.as-js-advanced-settings:hover,
#oil-preference-center .as-oil__btn-cpc.as-js-advanced-settings:hover {
    background-color: #f6f8fb;
    color: #6f8fb6;
}

.as-oil .as-oil-tabs-cpc__purpose-feature-texts ul li span:nth-child(2),
#oil-preference-center .as-oil-tabs-cpc__purpose-feature-texts ul li span:nth-child(2) {
    display: block;
}

.as-oil .as-oil__btn-cpc:hover,
#oil-preference-center .as-oil__btn-cpc:hover {
    background-color: #ecf0f1;
}

.as-oil .as-oil-tabs-cpc__wrapper .as-oil-tabs-cpc__purpose-text section p,
#oil-preference-center .as-oil-tabs-cpc__wrapper .as-oil-tabs-cpc__purpose-text section p {
    width: auto;
    max-width: 80%;
    display: block;
}

.as-oil .as-oil-tabs-cpc__wrapper .as-oil-tabs-cpc__purpose-text section div,
#oil-preference-center .as-oil-tabs-cpc__wrapper .as-oil-tabs-cpc__purpose-text section div {
    padding: 20px;
}

.as-oil [data-id="4"],
.as-oil [data-id="5"],
#oil-preference-center [data-id="4"],
#oil-preference-center [data-id="5"] {
    display: none !important;
}

.as-oil .as-oil-l-buttons,
#oil-preference-center .as-oil-l-buttons {
    max-width: none;
}

.as-oil .as-oil-tabs-cpc__purpose-feature-texts ul li,
#oil-preference-center .as-oil-tabs-cpc__purpose-feature-texts ul li {
    text-indent: 0;
}

.as-oil .as-oil-cpc-wrapper .as-oil__heading,
.as-oil .as-oil-cpc-wrapper .as-oil__intro-txt,
#oil-preference-center .as-oil-cpc-wrapper .as-oil__heading,
#oil-preference-center .as-oil-cpc-wrapper .as-oil__intro-txt {
    margin-bottom: 35px;
    line-height: 23px;
}

.as-oil .as-oil-tabs-cpc__switch,
#oil-preference-center .as-oil-tabs-cpc__switch {
    right: 0;
    top: 0;
}

.as-oil .as-oil-cpc__switch,
#oil-preference-center .as-oil-cpc__switch {
    top: 10px;
}

.as-oil .as-oil-cpc__switch input + .as-oil-cpc__status:after,
#oil-preference-center .as-oil-cpc__switch input + .as-oil-cpc__status:after {
    display: none !important;
}

.as-oil .as-oil-cpc__switch .as-oil-cpc__slider,
#oil-preference-center .as-oil-cpc__switch .as-oil-cpc__slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    transition: .4s;
    border-radius: 10px;
    border: 1px solid #5e6a71;
    height: 20px;
    width: 38px;
}

.as-oil .as-oil-cpc__switch .as-oil-cpc__slider:before,
#oil-preference-center .as-oil-cpc__switch .as-oil-cpc__slider:before {
    height: 10px;
    width: 10px;
    left: 6px;
    background-color: #5e6a71;
    border-radius: 10px;
    -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    transition: left .2s ease-in-out;
    position: absolute;
    top: 50%;
}

.as-oil .as-oil-cpc__switch input:checked ~ .as-oil-cpc__slider,
#oil-preference-center .as-oil-cpc__switch input:checked ~ .as-oil-cpc__slider {
    background-color: #fff;
    border-color: #7090b7;
}

.as-oil .as-oil-cpc__switch input:checked ~ .as-oil-cpc__slider:before,
#oil-preference-center .as-oil-cpc__switch input:checked ~ .as-oil-cpc__slider:before {
    background: #7090b7;
    top: 4px;
    left: 0;
}

.as-oil table,
#oil-preference-center table {
    border-collapse: collapse;
    border: none;
    padding: 5px;
    color: #5e6a71 !important;
}

.as-oil table thead,
#oil-preference-center table thead {
    border-bottom: 1px solid #d7dadb;
}

.as-oil table thead tr th,
#oil-preference-center table thead tr th {
    font-family: "Helvetica Neue Extended", Helvetica, sans-serif;
    font-size: .875rem !important;
    font-weight: 400;
    letter-spacing: .3px;
    padding: 5px;
}

.as-oil table tbody,
#oil-preference-center table tbody {
    border-bottom: 1px solid #d7dadb;
}

.as-oil table tbody tr td:first-child,
#oil-preference-center table tbody tr td:first-child {
    border-right: 1px solid #d7dadb;
}

.as-oil table tbody tr td,
#oil-preference-center table tbody tr td {
    font-size: .75rem !important;
    font-weight: 400;
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    padding: 5px;
    vertical-align: top;
}

/* IE fix */

.as-oil__btn-cpc.as-js-advanced-settings,
.as-oil__btn-optin.as-js-optin {
    line-height: 48px !important;
}

.as-js-btn-activate-all.as-oil__btn-blue,
.as-js-btn-deactivate-all.as-oil__btn-grey {
    line-height: 28px !important;
}

.as-oil-l-item.as-oil-l-item--stretch {
    float: none;
}

/* IE fix END */

#as-js-third-parties-list {
    display: none !important;
}

#oil-preference-center {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2147483647;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, .4);
    overflow: scroll !important;
}

#oil-preference-center .as-oil-cpc-wrapper {
    border-radius: 4px;
    border: 1px solid #d7dadb;
    background: #fff;
    padding: 20px;
    top: 10%;
    max-width: 800px;
    box-shadow: 0 -8px 20px 0 rgba(0, 0, 0, .2);
}

#oil-preference-center .as-oil-cpc-wrapper .as-oil__heading,
#oil-preference-center .as-oil-cpc-wrapper .as-oil__intro-txt {
    line-height: 1.25rem;
}

#oil-preference-center .as-oil-cpc__switch input:checked ~ .as-oil-cpc__slider:before {
    left: 22px;
    top: 9px;
}

#oil-preference-center .as-oil-back-button {
    padding: 0;
}

#oil-preference-center .as-oil-back-button:hover {
    background: none;
}

.cookie-consent-settings {
    font-size: .875em;
    line-height: 1.42857em;
    color: #fff;
    cursor: pointer;
}

.as-oil-back-button__text {
    display: none;
}

.as-oil-l-wrapper-layout-max-width p.as-oil__intro-txt {
    margin: 0;
}

/* Alert box extend */

.alert-box i {
    font-size: 2em;
    line-height: 0;
    float: left;
    margin: -0.25em .3125em 0 0;
}

.alert-message-text {
    display: inline-block;
}

.alert-info {
    background-color: #fff36f;
}

.alert-box i.icon-shopping-cart {
    font-size: 1.75em;
    margin-top: -0.3125em;
}

/* Ancestor products alert box on product list (category) */

.large-block-grid-1 .alert-info {
    margin: 0 0 1.25em 0 !important;
    display: inline-block;
    width: auto;
}

/* Customer item number */

.flip-scroll table thead tr.search-form th {
    background-color: #5e6a71;
    border-left: 1px solid #485157;
    border-top: 1px solid #485157;
    padding: .625em;
}

.flip-scroll table thead tr.search-form th .columns {
    margin-bottom: 0;
}

.flip-scroll table thead tr.search-form th .columns a,
.flip-scroll table thead tr.search-form th .columns p {
    line-height: 2.5em;
    vertical-align: middle;
}

.flip-scroll table thead tr.search-form th .columns a,
.flip-scroll table thead tr.search-form th .columns input,
.flip-scroll table thead tr.search-form th .columns p {
    margin-bottom: 0;
}

.flip-scroll table thead tr.search-form th .columns input {
    padding: .1875em;
}

.flip-scroll table thead tr.search-form th .columns a.button.postfix {
    padding: 0;
    text-align: center;
    background: linear-gradient(#5e6a71, #485157);
}

.flip-scroll table thead tr.search-form th .columns a.button.postfix i {
    position: relative;
    line-height: 1.375em;
    font-size: 2.0625em;
}

.flip-scroll table thead tr.search-form th .columns p {
    color: #fff;
}

.flip-scroll table thead tr.search-form th .columns input {
    border-top-left-radius: .25em;
    border-bottom-left-radius: .25em;
    padding: .8125em;
}

.flip-scroll table thead tr.search-form th .columns a {
    box-shadow: none;
    border: 1px solid #485157;
    border-left-width: 0;
    border-top-right-radius: .25em;
    border-bottom-right-radius: .25em;
}

.flip-scroll table thead tr.search-form th .columns input {
    border-color: #485157;
}

/* Quick order */

.quickorder .flip-scroll table th,
.quickorder .flip-scroll table td {
    font-size: .8125em;
}

.quickorder table input {
    margin-bottom: 0;
    font-size: 1em;
}

/* hide sorting icons for image column */

#search-table-wrapper-customer-info .flip-scroll table thead .sorting_disabled i {
    display: none;
}

.flip-scroll.emotion table thead tr.header-of-table th {
    background-color: white;
    color: #5e6a71;
    border-color: #d7d9db !important;
    border-top: 1px solid;
    border-left: none;
    padding-top: 3px;
    padding-bottom: 2px;
}

.flip-scroll.emotion table thead tr.header-of-table th:last-child {
    border-right: 1px solid;
    border-radius: 0 .3125em 0 0;
}

.flip-scroll.emotion table thead tr.header-of-table th:first-child {
    border-left: 1px solid;
    border-radius: .3125em 0 0 0;
}

.flip-scroll.emotion table thead tr.header-of-table th div {
    color: #5e6a71;
    font-size: 14px;
    font-weight: 700;
    line-height: 3.33em;
}

.flip-scroll.emotion table tbody tr:first-child td {
    border-top: 1px solid #d7d9db;
}

.flip-scroll.emotion table tbody td:last-child,
.flip-scroll.emotion table tbody tr:last-child td,
.flip-scroll.emotion table tbody td:first-child {
    border-color: #d7d9db;
}

.flip-scroll.emotion table tbody tr.even,
.flip-scroll.emotion table tbody tr:nth-of-type(2n) {
    background-color: #fff;
}

.flip-scroll.emotion table tbody td {
    font-size: 14px;
    line-height: 14px;
    height: 58px;
}

.flip-scroll.emotion table#results-table tr.link_detail:hover {
    background-color: transparent;
}

.flip-scroll.emotion.no-sorting table thead tr.header-of-table th > div {
    padding-right: 0;
}

@media (max-width: 1023px) {
    #search-table-wrapper .flip-scroll.emotion table thead th div,
    #product-detail .flip-scroll.emotion table thead th div {
        line-height: 50px;
    }

    #search-table-wrapper .flip-scroll.emotion table thead th.multi-line div,
    #product-detail .flip-scroll.emotion table thead th.multi-line div {
        height: 70px;
        line-height: 70px;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody tr td.pdf img,
    #product-detail .flip-scroll.emotion table tbody tr td.pdf img {
        height: auto;
    }

    #search-table-wrapper .flip-scroll.emotion table thead,
    #product-detail .flip-scroll.emotion table thead {
        position: absolute;
        display: block;
        z-index: 1;
        width: 30%;
        top: 0;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody,
    #product-detail .flip-scroll.emotion table tbody {
        padding-left: 30%;
        overflow-x: auto;
        overflow-y: hidden;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody tr,
    #product-detail .flip-scroll.emotion table tbody tr {
        display: table-cell;
    }

    #search-table-wrapper .flip-scroll.emotion table thead tr.header-of-table th,
    #product-detail .flip-scroll.emotion table thead tr.header-of-table th {
        height: 50px;
        border-left: 1px solid;
        border-right: 1px solid;
        border-top: none;
        padding: 0 .625em 0 10px;
        width: 100% !important;
    }

    #search-table-wrapper .flip-scroll.emotion table thead tr.header-of-table th:first-child,
    #product-detail .flip-scroll.emotion table thead tr.header-of-table th:first-child {
        border-top: 1px solid;
    }

    #search-table-wrapper .flip-scroll.emotion table thead tr.header-of-table th.multi-line,
    #product-detail .flip-scroll.emotion table thead tr.header-of-table th.multi-line {
        height: 70px;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody td,
    #product-detail .flip-scroll.emotion table tbody td {
        height: 50px;
        line-height: 50px;
        padding: 0 1.53846em;
        overflow: hidden;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody td.multi-line,
    #product-detail .flip-scroll.emotion table tbody td.multi-line {
        line-height: normal;
        padding-top: 7px;
        padding-bottom: 7px;
        height: 70px;
    }

    #search-table-wrapper .flip-scroll.emotion table thead tr.header-of-table th:last-child,
    #product-detail .flip-scroll.emotion table thead tr.header-of-table th:last-child {
        border-radius: 0 0 0 .325em;
    }

    #search-table-wrapper .flip-scroll.emotion table thead tr.header-of-table th:last-child,
    #product-detail .flip-scroll.emotion table thead tr.header-of-table th:last-child {
        border-radius: 0 0 0 .325em;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody tr:first-child td,
    #product-detail .flip-scroll.emotion table tbody tr:first-child td {
        border-top: 0;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody tr:first-child td:first-child,
    #product-detail .flip-scroll.emotion table tbody tr:first-child td:first-child {
        border-top: 1px solid #d7d9db;
    }

    #search-table-wrapper .flip-scroll.emotion table thead tr:last-child,
    #search-table-wrapper .flip-scroll table thead tr:first-child,
    #product-detail .flip-scroll.emotion table thead tr:last-child,
    #product-detail .flip-scroll table thead tr:first-child {
        display: block;
    }

    .flip-scroll.single {
        margin: 0;
        overflow-x: visible;
        width: auto;
    }

    .flip-scroll.single table,
    .flip-scroll.single table tbody,
    .flip-scroll.single table tbody tr,
    .flip-scroll.single table tbody td {
        all: initial;
    }

    .flip-scroll.single table {
        display: table;
        width: 100%;
        margin-bottom: 15px;
    }

    .flip-scroll.single table tbody {
        width: 100%;
        display: table;
    }

    .flip-scroll.single table tbody tr {
        display: table-row;
    }

    .flip-scroll.single table tbody td {
        width: 50%;
        display: table-cell;
        padding: .5625em .625em;
        text-align: left;
        height: auto;
        font-family: Helvetica, Arial, sans-serif;
        font-size: 12px;
        color: #333;
    }

    .flip-scroll.single table tbody tr td {
        border-width: 0 0 1px 1px;
        border-left-color: #485157;
        border-bottom-color: #d7dadb;
        border-style: solid;
    }

    .flip-scroll.single table tbody tr td:last-child {
        border-right: 1px solid #485157;
        border-left: 1px solid #d7dadb;
    }

    .flip-scroll.single table tbody tr:first-child td {
        border-top: 1px solid #485157;
    }

    .flip-scroll.single table tbody tr:last-child td:first-child {
        border-bottom-left-radius: .3125em;
        border-bottom-color: #485157;
    }

    .flip-scroll.single table tbody tr:last-child td:last-child {
        border-bottom-right-radius: .3125em;
        border-bottom-color: #485157;
    }

    .flip-scroll.single table tbody tr:nth-of-type(even) td {
        background-color: #f9f9f9;
    }
}

@media (max-width: 767px) {
    #search-table-wrapper .flip-scroll.emotion table thead,
    #product-detail .flip-scroll.emotion table thead {
        width: 180px;
    }

    #search-table-wrapper .flip-scroll.emotion table tbody,
    #product-detail .flip-scroll.emotion table tbody {
        padding-left: 180px;
    }
}

/* Dropdown multilevel lists */

.list.dropdown li ul li:hover {
    background: transparent;
}

/* 2nd level */

.list.dropdown li ul li {
    font-size: .875em;
}

/* 3rd level */

.list.dropdown li ul li li a {
    font-size: .75em;
    padding-left: 1.875em !important;
}

#products-dropdown > li:not(.plain):not(.nohover):hover {
    background: none;
}

#products-dropdown > li:not(.plain):not(.nohover) a:hover {
    background: #6481a4 linear-gradient(#6481a4, #7090b7);
}

.meta-nav .dropdown-handle i {
    float: left;
}

.dropdown-label {
    max-width: 8.125em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Buy now on product detail page adjustments #8391 */

.f-dropdown.content.custom-dropdown {
    max-width: 17.5em;
}

.f-dropdown.content.custom-dropdown .button {
    line-height: 3.1875em;
}

/* Contact person in main nav */

/*#main-navigation .contact-person {
  font-size: em-calc(14);
}*/

#main-navigation .contact-person ul {
    margin-bottom: 1em;
}

#main-navigation .contact-person li {
    padding: 0 1.25em;
}

#main-navigation .contact-person li.header {
    padding-top: .75em;
    font-size: .875em;
    font-weight: 600;
}

#main-navigation .contact-person li.body {
    padding-top: 0;
    font-size: .875em;
    font-weight: normal;
}

#main-navigation .contact-person li.body a {
    font-size: 1em !important;
    padding-left: 0 !important;
    display: inline !important;
}

#main-navigation .contact-person h2 {
    margin-bottom: .25em;
    color: #fff;
    font-size: 1em;
    font-weight: bold;
}

#main-navigation > nav > ul > li .content-wrapper .content .contact-person ul {
    color: white;
    font-weight: normal;
    line-height: 1.5625em;
}

#main-navigation > nav > ul > li .content-wrapper .content .contact-person ul li i.fa.fa-envelope + span a {
    display: inline-block;
    margin-left: 0;
    padding-left: 0;
    padding-top: 0;
    line-height: 1em;
    font-size: 1em;
}

/*
.accordion-navigation > li .content-wrapper .content .contact-person i {
  margin: 0;
}*/

@media only screen and (max-width: 768px) {
    #main-navigation .contact-person {
        font-size: 1em;
    }

    #main-navigation .contact-person h2,
    .contact-person ul li {
        color: #5e6a71;
    }

    .accordion-navigation > li .content-wrapper .content .contact-person li a {
        border: none;
        display: inline;
        padding: 0;
    }

    .accordion-navigation > li.active .contact-person i {
        display: inline-block;
    }

    .accordion-navigation .contact-person li:not(.active) a:after,
    .accordion-navigation .contact-person ul.current-visible li:after {
        display: none;
    }
}

/* Search field in navigation menu */

body > header .search-terms .large-4 i {
    font-size: 1.75em;
}

/* Custom styling for reveal modal */

.error.reveal-modal {
    color: #b5626f;
}

.notice.reveal-modal {
    color: #485157;
}

.success.reveal-modal {
    color: #7ca295;
}

.btn-continue-shopping,
.btn-goto-basket {
    margin-bottom: 0;
    float: left;
}

.btn-goto-basket {
    float: right;
}

@media only screen and (max-width: 480px) {
    .btn-continue-shopping,
    .btn-goto-basket {
        float: none;
        display: block;
        margin: 0 auto;
    }

    .btn-continue-shopping {
        margin-bottom: .625em;
    }
}

/* Custom Reveal Close Foundation */

.close-reveal-modal-custom {
    font-size: 1.375em;
    line-height: 1em;
    position: absolute;
    top: .5em;
    right: .6875em;
    color: #999;
    font-weight: bold;
    cursor: pointer;
}

/* Cadenas Modal override */

@media only screen and (min-width: 900px) {
    #cadenas-modal {
        max-width: 80%;
    }
}

/* Image size adjustment */

.search-results .left .ezimage-field {
    text-align: center;
}

.search-results .left .ezimage-field img {
    max-height: 9.375em;
    width: auto;
}

/* Filter link - search results */

.toggle-filter {
    position: absolute;
    top: .625em;
    right: .625em;
    padding: .625em;
    z-index: 997;
}

.toggle-filter i {
    font-size: rem-calc(23);
    vertical-align: middle;
}

/* Search template extends */

.search-template .result-product .text-wrap ul {
    padding-bottom: .3125em;
    margin-left: 1.5625em;
    color: #5e6a71;
    font-size: .875em;
    line-height: 1.375em;
}

.search-template div.e-result-count {
    display: none;
}

/* Spinner fixed position */

.spinner.cup {
    background: white url(../image/cup-spinner.gif) center center no-repeat;
    z-index: 998;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: fixed;
    filter: alpha(opacity=90);
    opacity: .9;
}

.spinner.cup.absolute,
.dropdown-wrapper .spinner.cup {
    position: absolute;
    /* in the search spinner is absolute */
}

/* Contact item teaser job title */

.contact-item-teaser .content h4 {
    font-weight: normal;
}

/* Job list responsive adjustments

   We need to override the default structure because we have events with
   start - end date which is not included in the standard delivered by Fork

*/

.two-square-teaser section h2.a-headline.a-headline--small {
    color: inherit;
}

.two-square-teaser .joblist ul li .columns {
    padding: 0;
    line-height: normal;
}

.two-square-teaser .joblist ul li a .columns span.end-date span {
    display: block;
    text-align: center;
}

.two-square-teaser .joblist ul li a .columns span.date {
    float: left;
}

.two-square-teaser .joblist ul li a:after,
.two-square-teaser .joblist ul li:after {
    content: "";
    display: table;
    clear: both;
}

@media (max-width: 768px) {
    .two-square-teaser .joblist ul li a .columns span.date {
        width: auto;
        display: inline-block;
    }

    .two-square-teaser .joblist ul li a .columns span.end-date {
        margin: 0;
    }

    .two-square-teaser .joblist ul li a .columns span.date {
        float: none;
        margin: 0 2.5em 0;
    }

    .two-square-teaser .joblist ul li a .columns span.end-date span {
        display: inline-block;
        margin: 0 1em;
    }

    .two-square-teaser .joblist ul li a .columns p {
        margin: .625em 2.5em 0;
    }
}

/* Embed location block */

.location-teaser {
    background-image: none;
    padding-bottom: 1.875em;
}

.location-teaser figure {
    margin-bottom: 1em;
}

.location-teaser h3 {
    font-size: 1.25em;
    text-transform: uppercase;
    color: #bbb;
    margin-bottom: 1em;
}

.location-teaser address {
    font-style: normal;
    font-weight: bold;
    line-height: 1.5em;
    font-size: .875em;
}

/* List view lower opacity */

.archive-teaser .hover-magnify {
    filter: alpha(opacity=70);
    opacity: .7;
}

.archive-teaser .hover-magnify:hover {
    filter: alpha(opacity=100);
    opacity: 1;
}

/* Event item teaser */

.event-item-teaser .button {
    margin-right: 1em;
}

/* VideoJS override - make it responsive */

.video-js .vjs-tech {
    height: auto !important;
    position: relative !important;
}

.video-js.vjs-fullscreen .vjs-tech {
    height: 100% !important;
    position: absolute !important;
}

/**
*
* didnt find this in html
* TODO: is this in use or not
* if yes refactor code with SCSS
*
*/

.tip-tooltip,
.bubble-tooltip {
    border-radius: 4px;
    opacity: 1;
    box-shadow: none;
}

.tip-tooltip .text-left a,
.bubble-tooltip .text-left a {
    font-weight: bold;
    position: relative;
    color: #5e6a71;
    display: inline-block;
}

.bubble-tooltip,
.tip-tooltip.white {
    border: 1px solid #d7d9db;
    background-image: linear-gradient(top, #fff 0%, #f7f7f7 1px, #fff 100%);
    position: relative;
    border-bottom-width: 2px;
}

.tip-tooltip {
    padding: 10px 15px;
}

.tip-tooltip > div,
.bubble-tooltip > div {
    color: #333;
}

.tip-tooltip h4,
.bubble-tooltip h4 {
    font-size: 14px;
    border-bottom: 1px solid #d7d9db;
    margin: 0 -15px 5px;
    padding: 0 15px 5px;
    background-image: linear-gradient(top, #fff 0%, #f7f7f7 1px, #fff 100%);
    position: relative;
}

.tip-tooltip a,
.bubble-tooltip a {
    font-weight: bold;
}

.tip-tooltip h4:after,
.bubble-tooltip h4:after {
    position: absolute;
    width: 100%;
    height: 1px;
    background: #fff;
    content: '';
    left: 0;
    bottom: -2px;
}

.tip-tooltip.bottom:before {
    top: -15px;
    left: 15px;
}

.u-position-relative {
    position: relative !important;
}

.u-display-inline {
    display: inline !important;
}

.u-font-size-14 {
    font-size: 14px !important;
}

.u-color-brand {
    color: #505050 !important;
}

.u-no-margin {
    margin: 0 !important;
}

.u-margin-top {
    margin-top: 1em !important;
}

.u-text-left {
    text-align: left !important;
}

.padding-bottom {
    padding-bottom: 1em !important;
}

.padding-left {
    padding-left: 1em !important;
}

.float_right {
    float: right;
}

.float_left {
    float: left;
}

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.vertical-middle-text {
    line-height: 2.1875em !important;
}

@media only screen and (max-width: 767px) {
    .small-text-left {
        text-align: left !important;
    }
}

.align-left {
    float: left;
    margin-right: 1em;
}

.align-right {
    float: right;
    margin-left: 1em;
}

.align-center {
    margin: 0 auto;
}

/*
    Author: mkr, ror

    This file contains custom CSS styling for Bürkert project website.

    IMPORTANT!

    Guidelines:
    # Each subsection should be described with a comment that describes what the
      code below is about.

    Notes:
    # 03.12.2014 - our custom code and overrides were merged with Fork's code
      (screen.css)


    Content

    Overrides and fixes for CSS delivered by Fork
    # Search field in navigation
    # Submit button in the header area
    # Filter (website search) navigation tree
    # Type filter adjustments
    # 2nd filer bar margin
    # Fluid calc adjustments
    # Teaser box - website search type box
    # Single teaser - reset the look of the link around image
    # Single teaser - with attachment (icon + link / no long description)
    # Four square image max width
    # Bigger margin bottom for meta-nav when displayed on the bottom of the page
    # Padding around cart dropdown table cells
    # Copy small grid block (thumb gallery)
    # Website search arrow
    # Availability popup
    # Default ordered list
    # Job contact box divider
    # Alert info in the search result list
    # Social sharing icons spacing
    # Product availability form fields
    # Homepage quicklinks pillar
    # Locations box
    # Default cursor for second level navigation
    # Category overview slider adjustments
    # Responsive boxes adjustments
    # Header height on desktop devices
    # Top navigation adjustments
    # Pillar component changes
    # Product type add to basket
    # Side nav header
    # Hidden top menu point

*/

/*=====================================================================
=            Overrides and fixes for CSS delivered by Fork            =
=====================================================================*/

/* Search field in navigation */

body > header li .border-wrapper {
    margin: 0;
    background: #5e6a71;
    border-radius: .25em;
    padding: 0;
}

#main-navigation form input[type="text"] {
    border: 1px solid #485157;
    border-right: 0;
    border-radius: .125em;
}

#main-navigation form button {
    border-top-right-radius: .125em;
    border-bottom-right-radius: .125em;
    box-shadow: none;
    background: linear-gradient(#5e6a71, #525c62);
    border-left-width: 0;
    padding: 0;
    margin: 0;
}

@media only screen and (max-width: 768px) {
    body > header li .border-wrapper {
             border-radius: 0;
        -moz-border-radius: 0;
    }
}

#main-navigation form button i {
    margin: 0;
    display: inline-block;
}

/* Submit button in the header area */

body > header .search-terms .large-4 .button {
    padding: .375em;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Type filter adjustments */

.product.type .catalog-list-wrapper .meta-nav {
    margin: 1.25em 0;
}

.product.type .catalog-list-wrapper .large-block-grid-1 li {
    margin-left: 0;
    font-size: 1em;
}

/* 2nd filer bar margin
 we use a wrapper so we need this extra piece of CSS
 */

.catalog-list-wrapper > .row {
    margin-left: 0;
    margin-right: 0;
}

.reveal-modal {
    -webkit-overflow-scrolling: touch;
    height: 800px;
    left: 50%;
    margin-left: 0;
    max-height: 90vh;
    max-width: 800px;
    overflow: auto;
    padding: 0;
    position: fixed;
    top: 50% !important;
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    width: 100%;
    /* iOS Safari has a bug/feature which auto-expands all iframes to the
   * height of the inner page. To circumvent this, expand the iframe
   * to the whole modal size.
   */
}

@media all and (min-width: 1024px) {
    .reveal-modal {
        width: 80%;
    }
}

.reveal-modal iframe {
    position: absolute;
    height: calc(100% - 45px);
    width: 100%;
    margin-top: 45px !important;
}

/* Fluid calc adjustments */

div#fluid {
    width: auto !important;
}

/* Teaser box - website search type box */

.box.teaser-box {
    padding: 0 !important;
}

.box.teaser-box > * {
    padding: 0 .625em;
    margin-top: .625em;
}

.box.teaser-box h3 {
    margin-bottom: .625em;
}

.box.teaser-box img {
    margin: 0;
}

.box.teaser-box footer {
    margin-bottom: 0;
    position: relative;
    line-height: 1.1875em;
    padding-right: 1.25em;
    color: #fff;
    margin-top: .8125em;
}

.box.teaser-box footer i {
    position: absolute;
    right: .5em;
    top: 50%;
    margin-top: -0.3125em;
    padding: 0;
}

/* Single teaser - reset the look of the link around image */

.single-teaser,
.list-teaser {
    cursor: pointer;
}

.single-teaser figure a {
    line-height: normal;
    background: none;
    padding: 0;
    border: 0;
}

/* Single teaser - with attachment (icon + link / no long description) */

.single-teaser.with-attachment {
    margin-top: 2em;
}

.single-teaser.with-attachment figure img {
    margin: .5625em auto;
}

.single-teaser.with-attachment a {
    border-top: 0;
}

/* Four square image max width */

.meta-nav.with-margin-bottom {
    margin-bottom: 3.75em;
}

/* Padding around cart dropdown table cells */

body > header #cart-dropdown table tr td:first-child a {
    padding: .875em;
}

body > header #cart-dropdown {
    width: 20em;
}

/* Copy small grid block (thumb gallery) */

.copy ul[class*="block-grid-"] li {
    padding: 0 .625em .75em;
    margin: 0;
    background: none;
}

/* Search results box padding */

.search-results .box .left {
    padding-bottom: .625em;
}

/* Website search arrow */

.search-results .open i {
    left: 50%;
    margin-left: -0.125em;
}

/* Availability popup */

.availability-popup-content {
    position: relative;
}

/* Default ordered list */

ol {
    margin: 0 0 1em 2em;
    font-size: .875em;
    line-height: 1.5em;
}

/*-----  End of Overrides and fixes for CSS delivered by Fork  ------*/

/* Job contact box divider */

.job-contact {
    border: none;
}

.job-address address {
    margin-bottom: 1em;
}

.job-address address:last-child {
    margin-bottom: 0;
}

.job-contact-box-wrapper {
    position: relative;
    float: left;
    width: 100%;
}

.job-contact-box-wrapper:after {
    position: absolute;
    left: 50%;
    top: 0;
    width: .0625em;
    height: 100%;
    content: "";
    background: #d7d9db;
    margin-left: -0.0625em;
}

@media only screen and (max-width: 767px) {
    .job-contact-box-wrapper:after {
        display: none;
    }

    .row .job-contact-box {
        border: none;
    }

    .job-address {
        border: .0625em solid #d7d9db;
    }

    .job-address.job-contact {
        margin-top: 2.5em;
    }
}

/* Alert info in the search result list */

.large-block-grid-1 .alert-info {
    margin: 1.0625em 4.3125em 0 1.375em !important;
    display: block;
}

.box .footer ul li .open i {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -0.3125em 0 0 -0.125em;
}

.box .footer.product-list ul {
    width: 100%;
    display: inline-block;
}

.box .footer.product-list ul.hide {
    display: none;
}

.box .footer.product-list ul li#infinity-scroller {
    background: none;
    border: none;
    text-align: center;
}

.box .footer.product-list ul li#infinity-spinner {
    background: none;
    border: none;
    text-align: center;
}

/* Social sharing icons spacing */

.meta-nav .sharing a {
    margin-right: .25em;
    float: left;
}

.meta-nav .sharing a:last-child {
    margin-right: 0;
}

/* Product availability form fields

   W need this change because add to basket is outside the form in the
   examples from Frok
 */

.product .product-info fieldset {
    margin: 1.25em 0;
}

.product .product-info .min_quantity,
.product .product-info .packing_unit {
    display: block;
    color: #999;
    font-weight: 400;
    font-size: .8125em;
    letter-spacing: initial;
    margin-top: .6875em;
}

.product form.custom .product-info input[type="text"] {
    height: auto;
}

.product form.custom .product-info input {
    height: 4.0625em;
}

.product form.custom .product-info input[type="text"] {
    font-size: 1.375em;
    padding: .6875em .5em;
    height: auto;
    margin-bottom: 0;
}

.product form.custom .product-info .button {
    font-size: 1.3125em;
    font-weight: 800;
    height: 2.6875em;
    padding-top: .125em;
    padding-bottom: .125em;
    margin-top: .5em;
    border: 1px #485157 solid;
    background-color: #516885;
    margin-bottom: 0;
    background: linear-gradient(#5e6a71, #525c62);
    border-radius: .125em;
    box-shadow: none;
}

.product form.custom .product-info .button:active {
    background: linear-gradient(#525c62, #5e6a71);
}

@media only screen and (max-width: 767px) {
    .product form.custom .product-info .button {
        width: 100%;
    }
}

@media all and (min-width: 768px) {
    .product form.custom .product-info .button {
        margin-top: 0;
    }
}

/* Homepage quicklinks pillar */

.pillar section > ul > li > div.products > div ul li img {
    border: 0;
    width: auto;
    float: none;
    margin: .5em 0;
}

.pillar section > ul > li > div.products > div ul li figure {
    width: 37.10691823899371%;
    /* 118 / 318 */
    float: left;
    border-right: 1px solid #d7d9db;
    text-align: center;
}

/* Weather location block

   We need position relative to keep the spinner inside this block only
 */

#weather-location-content {
    position: relative;
}

/* Locations box */

.meta-nav span.prev,
.meta-nav span.next {
    height: 3.1875em;
    position: relative;
    border-right: 1px solid #d7d9db;
    display: inline-block;
}

.meta-nav .pagination span.prev,
.meta-nav .pagination span.next {
    padding: 0 1.25em;
    margin-right: 0;
}

.meta-nav .pagination span.prev.inactive .arrow {
    border-right-color: #d7d9db;
}

.meta-nav .pagination span.next.inactive .arrow {
    border-left-color: #d7d9db;
}

.meta-nav > div > span {
    color: #5e6a71;
    font-weight: bold;
    line-height: 3.1875em;
    font-size: .875em;
}

.meta-nav .dropdown-handle {
    margin-right: 0;
}

/* Form styling */

/*form.custom fieldset .custom.dropdown > a.current:hover,
form.custom fieldset .custom.dropdown > a.selector:hover,
form.custom fieldset input:hover {
  cursor: pointer;
}

form.custom fieldset label:hover {
  cursor: auto;
}

form.custom .custom.radio.required,
form.custom .custom.checkbox.required,
form.custom fieldset .custom.dropdown.required,
form.custom fieldset input:invalid,
form.custom fieldset textarea:invalid {
  border-color: use_col(iron, dark);
}

form.custom fieldset input.error:invalid,
form.custom fieldset textarea.error:invalid {
  border-color: use_col(iron);
}

form.custom fieldset .custom.dropdown.error:focus,
form.custom fieldset input.error:focus,
form.custom fieldset textarea.error:focus {
  box-shadow: inset 0 2px 2px rgba(use_col(black), 0.1), inset 0 0 1px rgba(use_col(black), 0.1);
  background: use_col(white);
  border-color: use_col(iron, dark);
}

form.custom fieldset .choice-group {
  margin-bottom: em-calc(16);
}

form.custom fieldset .choice-group.single {
  margin: em-calc(16) auto;
}

form.custom fieldset .choice-group.error {
  border: 1px solid use_col(error, light);
  border-radius: em-calc(3 3 0 0);
  background: rgba(use_col(dark_gray, ultra_dark), 0.1);
  margin-bottom: 0;
}

form.custom fieldset .custom.dropdown.error,
form.custom fieldset input.error,
form.custom fieldset textarea.error {
  background-color: rgba(use_col(dark_gray, ultra_dark), 0.1);
  background-image: none;
  border-color: use_col(iron);
  margin-bottom: 0;
}

form.custom .notice-box {
  line-height: em-calc(24);
  font-size: em-calc(14);
}

form.custom .choice-group.required label {
  display: inline;
  margin-left: em-calc(11);
}*/

/*form.custom {
  section.content-form {
    .content {
      background-color: transparent;
      background: none;
      border: none;

      div.columns {
        margin-bottom: 30px;
      }
    }

    label {
      margin-bottom: 10px;
      font-size: 0.75rem;
      line-height: 1rem;
      font-family: "Helvetica Neue", Helvetica, sans-serif;
      font-weight: normal;
      color: #5e6a71;
      text-indent: 0;
    }

    small {
      font-size: 0.875rem;
      line-height: 1.25rem;
      font-family: "Helvetica Neue", Helvetica, sans-serif;
      font-weight: normal;
      align-items: center;
      color: #5e6a71;
      cursor: help;
      display: flex;
      margin-top: 10px;
    }

    div.a-copy.a-copy--smaller.a-copy--error {
      margin-top: 10px;
    }

    div.e-new-search-dropdown {
      .select2 {
        height: 50px;
      }

      .select2-container--default {
        .select2-selection--single {
          height: 50px;
          border: 1px solid #d7dadb;

          .select2-selection__rendered {
            line-height: 50px;
            padding-right: 2.5em;
            color: #5e6a71;

            .select2-selection__placeholder {
              color: #d7dadb;
            }
          }

          .select2-selection__arrow {
            height: 50px;
            width: 2.5em;
            color: #5e6a71;

            b {
              border-color: #5e6a71 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0)
                rgba(0, 0, 0, 0);
              border-width: 5px 5px 0 5px;
            }
          }
        }

        .select2-results__option[aria-disabled="true"] {
          display: none;
        }
      }
    }

    textarea {
      box-shadow: none;
    }

    textarea::placeholder {
      color: #a9b0b2;
    }

    input.form-control {
      margin-bottom: 0;
      box-shadow: none;
      border: 1px solid #d7dadb;
      box-shadow: none;
      height: 50px;
      color: #5e6a71;
      font-size: 1rem;
      font-family: "Helvetica Neue", Helvetica, sans-serif;
      font-weight: normal;
    }

    input.form-control::placeholder {
      color: #a9b0b2;
    }

    div.choice-group {
      label {
        position: relative;
        display: flex;
        cursor: pointer;
        margin: 0 0 20px;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;

        span.custom.checkbox {
          display: block;
          width: 20px;
          height: 20px;
          border: solid 1px #5e6a71;
          background: #fff;
          border-radius: 4px;
          box-shadow: none;
        }

        span.custom.checkbox.checked {
          background-color: #7090b7;
          border-color: #7090b7;

          + span.label.a-checkbox__text {
            color: #7090b7;
          }
        }
      }
    }

    textarea.form-control:invalid,
    input.form-control:invalid {
      border: 1px solid #d7dadb;
    }

    div.custom.dropdown {
      border: 1px solid #d7dadb;
      box-shadow: none;
      height: 50px;
      margin-bottom: 0;

      a.current {
        height: 50px;
        line-height: 50px;
        padding-right: 2.5em;
        color: #5e6a71;
        font-family: "Helvetica Neue", Helvetica, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1em;
      }

      a.selector {
        background-color: transparent;
        background: none;
        height: 50px;
      }
      a.selector:after {
        border-color: #5e6a71 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
        border-width: 5px 5px 0 5px;
      }

      ul li {
        border-bottom: 1px solid #d7dadb;
        font-size: 1rem;
        line-height: 1.5rem;
        font-family: "Helvetica Neue", Helvetica, sans-serif;
        font-weight: normal;
        padding: 15px 20px;
        position: relative;
        white-space: normal;
      }
    }
  }

  div.custom.dropdown:hover a.selector:after {
    border-color: #5e6a71 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-width: 5px 5px 0 5px;
  }
}

form.custom.submitted {
  section.content-form {
    div.e-new-search-dropdown {
      select:invalid + .select2-container--default {
        .select2-selection--single {
          border: 1px solid #9d6971;
        }
      }

      select:invalid ~ div.a-copy.a-copy--smaller.a-copy--error {
        display: block;
      }
    }

    input:invalid,
    textarea:invalid {
      border: 1px solid #9d6971;

      ~ div.a-copy.a-copy--smaller.a-copy--error {
        display: block;
      }
    }

    div.choice-group {
      label {
        input[type="checkbox"]:invalid {
          + span.custom.checkbox {
            border: 1px solid #9d6971;
          }

          ~ span.label {
            color: #9d6971;
          }

          ~ div.a-copy.a-copy--smaller.a-copy--error {
            display: block;
          }
        }
      }
    }
  }
}

.select2-container--default {
  .select2-results__option[aria-disabled="true"] {
    display: none;
  }

  .select2-results__option.select2-results__option--highlighted[aria-selected] {
    color: #5e6a71;
    background-color: #d7dadb;
  }

  .select2-results__option.select2-results__option--highlighted {
    background: #f3f3f3;
    color: #35495e;
  }

  .select2-results__options .select2-results__option {
    border-bottom: 1px solid #d7dadb;
    font-size: 1rem;
    line-height: 1.5rem;
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    font-weight: normal;
    padding: 15px 20px;
    position: relative;
    white-space: normal;
  }
}*/

/* Default cursor for second level navigation */

@media only screen and (min-width: 767px) {
    #main-navigation > nav > ul > li .content-wrapper .content ul li.category > a {
        cursor: default;
    }
}

/* Category overview slider adjustments - start */

/* Slide size */

/*.product-overview .with-slides > .row {
  margin-right: 0;
  margin-left: 0;
}*/

/*.product-overview .with-slides .slide .slide-content img.heightfix {
    height: auto;
}*/

/* Allow <a> around slide content */

/*.product-overview .slide .slide-content a > div {
  left: em-calc(80);
}*/

/* Category overview slider adjustments - end */

/* Responsive boxes adjustments */

/**
    Remove background, border and padding for anchor elements placed in
    the left column
*/

.single-teaser .large-4 a {
    background: none;
    border: 0;
    padding: 0;
}

@media only screen and (max-width: 767px) {
    .single-teaser .large-4 a {
        height: auto;
    }

    .single-teaser .large-12 .copy-list {
        padding-top: 0;
    }
}

@media only screen and (min-width: 768px) {
    body > header {
       
    }
}

#header-flyout section.branches .languages div.subtitle {
    font-size: .875em;
    margin-bottom: 4.3125em;
    text-align: center;
}

#header-flyout section.branches .languages div.subtitle a {
    color: #5e6a71;
}

.blog-filter {
    padding-top: 1.0625em;
}

/* Top navigation adjustments */

@media only screen and (max-width: 767px) {
    .accordion-navigation > li.active .content-wrapper .footer .teaser-wrapper.is-empty {
        display: none;
    }

    .accordion-navigation > li.active .content-wrapper .footer {
        display: block;
    }

    #main-navigation > nav > ul > li .content-wrapper .overview > a {
        border: none;
        font-size: 1.125em;
        margin-top: 1em;
    }

    #main-navigation > nav > ul > li .content-wrapper .teaser-wrapper {
        margin: 0 1em 1em;
    }

    #main-navigation > nav > ul > li .content-wrapper .teaser-wrapper > a {
        display: block;
        margin-top: .625em;
    }

    #main-navigation > nav > ul > li .content-wrapper .teaser-wrapper > a:first-child {
        margin-top: 0;
    }

    #main-navigation > nav > ul > li .content-wrapper .teaser-wrapper figcaption {
        font-size: 1em;
        margin-top: .625em;
        padding-bottom: .625em;
    }

    #main-navigation > nav > ul > li .content-wrapper .teaser-wrapper a:last-child figcaption {
        margin-bottom: 0;
    }
}

/* Pillar component changes */

/* main wrapper for pillar content */

.pillar section > ul > li > div > div {
    height: auto !important;
}

/* header */

.pillar section > ul > li > div.products > div > div {
    height: auto;
}

/* product list */

.pillar section > ul > li > div.products > div ul {
    position: relative;
}

/* list item - text */

.pillar section > ul > li > div.products > div ul li a.text {
    position: relative;
}

/*
   list item left border
   make sure there is always a border between image and text
   it solves the problem when image is not heigh enough
 */

.pillar section > ul > li > div.products > div ul li a.text:before {
    position: absolute;
    content: "";
    width: .0625em;
    height: 100%;
    background-color: #d7d9db;
    top: 0;
    left: -0.0625em;
}

.orbit-timer {
    display: none;
}

/* Product type add to basket */

.product.type .product-info form.custom {
    margin-top: 2.5em;
    margin-bottom: 0;
}

.product.type .copy .product-info h2 {
    margin-top: .625em;
}

.product.type .product-info form.custom hr {
    margin-top: 1.875em;
    margin-bottom: 0;
}

/* Buy now dropdown content */

.buy-now-dropdown .button {
    font-size: 1.3125em;
    font-weight: 800;
    height: 2.6875em;
    padding-top: .125em;
    padding-bottom: .125em;
    margin-top: 0 !important;
    border: 1px #485157 solid;
    background-color: #516885;
    margin-bottom: 0;
    background: linear-gradient(#5e6a71, #525c62);
    border-radius: .125em;
    box-shadow: none;
}

.buy-now-dropdown p {
    font-size: .875em;
    color: #333;
    line-height: 1.5em;
}

#weather-location-content #info-box-time .title {
    font-size: 2.5em;
}

.only-range-input .range-slider,
.only-range-input .range-slider-scale,
.only-range-input .range-slider-input-separator,
.only-range-input .range-slider-high-input {
    display: none !important;
}

.only-range-input .range-slider-input-wrapper {
    margin-bottom: 0;
}

/* Side nav header */

.side-nav header .side-nav-header {
    margin: 0;
}

.side-nav header .side-nav-header a,
.side-nav header .side-nav-header.with-spacing {
    padding: .625em .875em;
    display: block;
}

.icon-cross-poc {
    background: url("../image/icon-cross-poc.png") 0 0 no-repeat;
    width: 81px;
    height: 81px;
    margin-top: 20px;
}

/* Checkout box overflow */

.checkout .box {
    overflow: inherit;
}

/* Checkout box overflow */

.single-row.contact.hidden {
    display: none !important;
}

/* checkout remark */

.order_reference {
    margin-top: 1em;
}

/* Video JS Background */

.video-js {
    background-color: transparent;
}

.vjs-default-skin .vjs-control-bar {
    display: block;
    color: rgba(255, 255, 255, .9);
    background-color: rgba(112, 144, 183, .7);
}

.vjs-default-skin .vjs-control:before {
    text-shadow: none;
}

.vjs-default-skin .vjs-slider {
    background-color: transparent;
}

.vjs-default-skin .vjs-control-bar {
    font-size: 10px;
}

.vjs-default-skin .vjs-big-play-button {
    left: 45%;
    top: 45%;
    color: #fff;
    background-color: rgba(112, 144, 183, .7);
    border-radius: 0;
    border: 0 none;
    font-size: 2em;
}

.vjs-default-skin .vjs-big-play-button:before {
    text-shadow: none;
}

[v-cloak] {
    display: none;
}

.product .product-info .price .c-card__price {
    display: none;
    vertical-align: top;
    margin-top: .4em;
}

.red {
    color: #f00;
}

.line-through {
    text-decoration: line-through;
}

div.serialnumber-form div.m-form__row {
    margin: 0 0 1em 0;
}

div.serialnumber-form div.m-form__row .a-button {
    min-height: 48px;
}

section#files-download table tbody tr td:nth-child(3) a {
    width: auto;
}

a.a-link.comparison {
    display: inline-block;
}

a.a-link.comparison svg.a-svg-sprite.a-link__icon {
    margin-bottom: 3px;
}

a.event.a-button {
    margin-right: 1em;
}

a.event.a-button.a-button--primary {
    color: #fff;
}

a.event.a-button.a-button--secondary {
    color: #6f8fb6;
}

div.domainswitch a.a-button.switch_no {
    margin-bottom: 0;
}

.compare-bar-top .a-button.right {
    margin: 1em 0;
}

.compare-bar .compare-bar-content .comparison_price .a-button {
    margin-top: .625em;
}

.m-content-box__person {
    position: relative;
}

.m-content-box__person .img-wrapper {
    position: absolute;
    background: rgba(255, 255, 255, 0);
    z-index: 1;
    width: 50px;
    left: 0;
    height: 50px;
    top: 0;
}

.private-img,
.private-img div[class^="align-"] {
    position: relative;
}

.private-img-cover {
    position: absolute;
    z-index: 1000;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

#login-modal {
    height: 300px;
}

.m-accordion__wrinkle {
    scroll-margin-top: 5em;
}

.copy h2.first-header {
    margin-top: 0;
}

.flip-scroll table thead tr.header-of-table th {
    background-color: #5e6a71;
}

.flip-scroll table thead tr.header-of-table th:last-child {
    border-top-right-radius: .3125em;
}

.l-container__grid.wide {
    max-width: 1280px;
}

.o-modal__wrapper.loginmodal {
    max-width: 1000px;
}

.loginmodal #modal_login_register {
    padding: 10px;
}

.loginmodal #modal_login_login {
    padding: 10px;
    border-bottom: 3px solid #e0e0e0;
}

@media all and (min-width: 768px) {
    .loginmodal #modal_login_register {
        float: right;
        width: 50%;
        padding: 30px;
    }

    .loginmodal #modal_login_login {
        float: left;
        width: 50%;
        border-right: 3px solid #e0e0e0;
        padding: 30px;
        border-bottom: none;
    }
}

.loginmodal .modal_login_button {
    text-align: center;
}

.loginmodal .m-mixed-copy {
    height: 200px;
}

.loginmodal .o-modal__body {
    margin-top: 20px;
}

.loginmodal .o-modal__header {
    margin: 0 40px 30px 0;
    height: 84px;
}

/* list for jobs */

.archive-teaser li.job-teaser.hover-magnify {
    padding-bottom: 0;
}

.archive-teaser li.job-teaser.hover-magnify div.job {
    padding-bottom: 1.875em;
}

.archive-teaser li.job-teaser.hover-magnify div.job div.columns div.row {
    margin-top: 1em;
}

.archive-teaser li.job-teaser.hover-magnify ul.a-list li.a-list__item {
    border-bottom: none !important;
}

.archive-teaser li.job-teaser.hover-magnify ul.a-list li.a-list__item:before {
    top: 12px;
}

.archive-teaser li.job-teaser.hover-magnify ul.a-list.country li.a-list__item {
    font-weight: bold;
}

.archive-teaser li.job-teaser.hover-magnify ul.a-list.country li.a-list__item::before {
    display: none;
}

@media only screen and (min-width: 768px) {
    .archive-teaser li.job-teaser.hover-magnify div.job h2 {
        margin-right: 4em;
    }

    .archive-teaser li.job-teaser.hover-magnify ul.a-list.country {
        text-align: right;
    }
}

div.ezlandingpage-field[buerkert_view="product_category"] div.landing-page__zones {
    margin-top: 0;
}

div.ezlandingpage-field[buerkert_view="product_category"] div.landing-page__zones div.landing-page__zone div.landing-page__block:first-child .margin-60-0-0-0 {
    margin-top: 0;
}

div.landing-page__zones {
    margin: 3.125em auto;
}

div.landing-page__block {
    max-width: 80em;
    margin: 0 auto;
}

@media only screen and (min-width: 768px) {
    div.landing-page__block div.block-richtext {
        margin: auto 10em;
    }
}

@media only screen and (max-width: 768px) {
    div.landing-page__block div.block-richtext {
        margin: auto 1em;
    }
}

div.landing-page__block.widescreen_slider_block {
    max-width: initial;
    margin-top: -50px;
    margin-bottom: 2em;
}

@media (min-width: 80em) {
    div.landing-page__block.core_competence_block {
        max-width: initial;
    }
}

div.landing-page__block.info_long_block {
    max-width: initial;
}

div.align-center.ez-embed-type-image {
    display: table;
}

div.ez-embed-type-image figure.ezimage-field {
    display: table;
    position: relative;
    padding: 0;
    margin: 3.125em auto 1em auto;
}

div.ez-embed-type-image figure.ezimage-field figcaption {
    bottom: 0;
    caption-side: bottom;
    padding: .9375em;
    width: 100%;
    display: table-caption;
}

div.ez-embed-type-image figure.ezimage-field figcaption p {
    font-family: revert;
    font-size: .875em;
    font-weight: bold;
    color: #5e6a71;
    margin-bottom: 0;
}

/* 05.08.2015 - mkr
   We use media query instead of separate file with if statement in <head> to reduce number of HTTP requests
 */

@media print {
    /* hide those elements */

    .direct-sticker-container,
    .product.type #product-list .meta-nav,
    button,
    .button,
    .cp-overlay,
    .cp-dialog,
    .cp-popup,
    .dropdown-wrapper,
    .active-filters-overview,
    .social *,
    .search.dropdown.filter .nohover.buttonbar,
    .side-nav header .right,
    .side-nav .header .right,
    .toggle-filter,
    .compare-bar,
    .meta-nav,
    #office-select li > a,
    .locations-select li > a,
    #office-select a.prev,
    #office-select a.next,
    .locations-select a.prev,
    .locations-select a.next,
    #weather-location-content,
    .dataTables_paginate,
    tr.search-form,
    tr.search-form-toggle-row,
    .go-back,
    footer,
    .sf-toolbar,
    #table_products,
    #client-information,
    #content > div.large-3,
    #search-info-wrapper.detail,
    body > header,
    .breadcrumb-wrapper,
    .row.collapse.search-form,
    .header-of-table div i,
    #create-rma .buttons-row,
    header nav,
    header #main-navigation,
    header .hide-for-small,
    #create-rma #main-title {
        display: none !important;
    }/* global font-size reduction */

    html,
    body {
        font-size: 12px;
    }/* global table reset */

    table {
        border-collapse: collapse !important;
        border-right: 1px solid #d7d9db !important;
        border-bottom: 1px solid #d7d9db !important;
        padding: 0 !important;
        margin-bottom: 1em !important;
    }

    table tr.active {
        display: table-row !important;
    }

    table td,
    table th {
        border: 1px solid #d7d9db !important;
        margin: 0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;
        padding: 5px !important;
        border-radius: 0 !important;
    }

    table th div,
    table th {
        font-weight: bold !important;
        color: #5e6a71 !important;
        background-color: transparent !important;
    }

    table th {
        padding: 10px 5px !important;
        background-color: #fff !important;
    }

    table th div {
        padding: 0 !important;
        line-height: normal !important;
    }

    table tbody tr:nth-of-type(odd) {
        background-color: #fff !important;
    }/*a:after{content:" (" attr(href) ") ";font-size:0.8em;font-weight:normal;}*//* grid settings */

    .row .row,
    .row .columns .columns,
    .row .column .column {
        padding: 0;
        margin: 0;
    }

    .column,
    .columns {
        position: relative;
        padding-left: .625em;
        padding-right: .625em;
        float: left;
    }

    .small-1 {
        position: relative;
        width: 6.25%;
    }

    .small-2 {
        position: relative;
        width: 12.5%;
    }

    .small-3 {
        position: relative;
        width: 18.75%;
    }

    .small-4 {
        position: relative;
        width: 25%;
    }

    .small-5 {
        position: relative;
        width: 31.25%;
    }

    .small-6 {
        position: relative;
        width: 37.5%;
    }

    .small-7 {
        position: relative;
        width: 43.75%;
    }

    .small-8 {
        position: relative;
        width: 50%;
    }

    .small-9 {
        position: relative;
        width: 56.25%;
    }

    .small-10 {
        position: relative;
        width: 62.5%;
    }

    .small-11 {
        position: relative;
        width: 68.75%;
    }

    .small-12 {
        position: relative;
        width: 75%;
    }

    .small-13 {
        position: relative;
        width: 81.25%;
    }

    .small-14 {
        position: relative;
        width: 87.5%;
    }

    .small-15 {
        position: relative;
        width: 93.75%;
    }

    .small-16 {
        position: relative;
        width: 100%;
    }

    .small-offset-0 {
        position: relative;
        margin-left: 0;
    }

    .small-offset-1 {
        position: relative;
        margin-left: 6.25%;
    }

    .small-offset-2 {
        position: relative;
        margin-left: 12.5%;
    }

    .small-offset-3 {
        position: relative;
        margin-left: 18.75%;
    }

    .small-offset-4 {
        position: relative;
        margin-left: 25%;
    }

    .small-offset-5 {
        position: relative;
        margin-left: 31.25%;
    }

    .small-offset-6 {
        position: relative;
        margin-left: 37.5%;
    }

    .small-offset-7 {
        position: relative;
        margin-left: 43.75%;
    }

    .small-offset-8 {
        position: relative;
        margin-left: 50%;
    }

    .small-offset-9 {
        position: relative;
        margin-left: 56.25%;
    }

    .small-offset-10 {
        position: relative;
        margin-left: 62.5%;
    }

    .small-offset-11 {
        position: relative;
        margin-left: 68.75%;
    }

    .small-offset-12 {
        position: relative;
        margin-left: 75%;
    }

    .small-offset-13 {
        position: relative;
        margin-left: 81.25%;
    }

    .small-offset-14 {
        position: relative;
        margin-left: 87.5%;
    }

    [class*="column"] + [class*="column"]:last-child {
        float: right;
    }

    [class*="column"] + [class*="column"].end {
        float: left;
    }

    .column.small-centered,
    .columns.small-centered {
        position: relative;
        margin-left: auto;
        margin-right: auto;
        float: none !important;
    }/* Styles for screens that are atleast 768px; */

    .large-1 {
        position: relative;
        width: 6.25%;
    }

    .large-2 {
        position: relative;
        width: 12.5%;
    }

    .large-3 {
        position: relative;
        width: 18.75%;
    }

    .large-4 {
        position: relative;
        width: 25%;
    }

    .large-5 {
        position: relative;
        width: 31.25%;
    }

    .large-6 {
        position: relative;
        width: 37.5%;
    }

    .large-7 {
        position: relative;
        width: 43.75%;
    }

    .large-8 {
        position: relative;
        width: 50%;
    }

    .large-9 {
        position: relative;
        width: 56.25%;
    }

    .large-10 {
        position: relative;
        width: 62.5%;
    }

    .large-11 {
        position: relative;
        width: 68.75%;
    }

    .large-12 {
        position: relative;
        width: 75%;
    }

    .large-13 {
        position: relative;
        width: 81.25%;
    }

    .large-14 {
        position: relative;
        width: 87.5%;
    }

    .large-15 {
        position: relative;
        width: 93.75%;
    }

    .large-centered,
    .large-16 {
        position: relative;
        width: 100% !important;
    }

    .row .large-offset-0 {
        position: relative;
        margin-left: 0;
    }

    .row .large-offset-1 {
        position: relative;
        margin-left: 6.25%;
    }

    .row .large-offset-2 {
        position: relative;
        margin-left: 12.5%;
    }

    .row .large-offset-3 {
        position: relative;
        margin-left: 18.75%;
    }

    .row .large-offset-4 {
        position: relative;
        margin-left: 25%;
    }

    .row .large-offset-5 {
        position: relative;
        margin-left: 31.25%;
    }

    .row .large-offset-6 {
        position: relative;
        margin-left: 37.5%;
    }

    .row .large-offset-7 {
        position: relative;
        margin-left: 43.75%;
    }

    .row .large-offset-8 {
        position: relative;
        margin-left: 50%;
    }

    .row .large-offset-9 {
        position: relative;
        margin-left: 56.25%;
    }

    .row .large-offset-10 {
        position: relative;
        margin-left: 62.5%;
    }

    .row .large-offset-11 {
        position: relative;
        margin-left: 68.75%;
    }

    .row .large-offset-12 {
        position: relative;
        margin-left: 75%;
    }

    .row .large-offset-13 {
        position: relative;
        margin-left: 81.25%;
    }

    .row .large-offset-14 {
        position: relative;
        margin-left: 87.5%;
    }

    .row .large-offset-15 {
        position: relative;
        margin-left: 93.75%;
    }

    .push-1 {
        position: relative;
        left: 6.25%;
        right: auto;
    }

    .pull-1 {
        position: relative;
        right: 6.25%;
        left: auto;
    }

    .push-2 {
        position: relative;
        left: 12.5%;
        right: auto;
    }

    .pull-2 {
        position: relative;
        right: 12.5%;
        left: auto;
    }

    .push-3 {
        position: relative;
        left: 18.75%;
        right: auto;
    }

    .pull-3 {
        position: relative;
        right: 18.75%;
        left: auto;
    }

    .push-4 {
        position: relative;
        left: 25%;
        right: auto;
    }

    .pull-4 {
        position: relative;
        right: 25%;
        left: auto;
    }

    .push-5 {
        position: relative;
        left: 31.25%;
        right: auto;
    }

    .pull-5 {
        position: relative;
        right: 31.25%;
        left: auto;
    }

    .push-6 {
        position: relative;
        left: 37.5%;
        right: auto;
    }

    .pull-6 {
        position: relative;
        right: 37.5%;
        left: auto;
    }

    .push-7 {
        position: relative;
        left: 43.75%;
        right: auto;
    }

    .pull-7 {
        position: relative;
        right: 43.75%;
        left: auto;
    }

    .push-8 {
        position: relative;
        left: 50%;
        right: auto;
    }

    .pull-8 {
        position: relative;
        right: 50%;
        left: auto;
    }

    .push-9 {
        position: relative;
        left: 56.25%;
        right: auto;
    }

    .pull-9 {
        position: relative;
        right: 56.25%;
        left: auto;
    }

    .push-10 {
        position: relative;
        left: 62.5%;
        right: auto;
    }

    .pull-10 {
        position: relative;
        right: 62.5%;
        left: auto;
    }

    .push-11 {
        position: relative;
        left: 68.75%;
        right: auto;
    }

    .pull-11 {
        position: relative;
        right: 68.75%;
        left: auto;
    }

    .push-12 {
        position: relative;
        left: 75%;
        right: auto;
    }

    .pull-12 {
        position: relative;
        right: 75%;
        left: auto;
    }

    .push-13 {
        position: relative;
        left: 81.25%;
        right: auto;
    }

    .pull-13 {
        position: relative;
        right: 81.25%;
        left: auto;
    }

    .push-14 {
        position: relative;
        left: 87.5%;
        right: auto;
    }

    .pull-14 {
        position: relative;
        right: 87.5%;
        left: auto;
    }

    .push-15 {
        position: relative;
        left: 93.75%;
        right: auto;
    }

    .pull-15 {
        position: relative;
        right: 93.75%;
        left: auto;
    }

    .column.large-centered,
    .columns.large-centered {
        position: relative;
        margin-left: auto;
        margin-right: auto;
        float: none !important;
    }

    .column.large-uncentered,
    .columns.large-uncentered {
        margin-left: 0;
        margin-right: 0;
        float: left !important;
    }

    .column.large-uncentered.opposite,
    .columns.large-uncentered.opposite {
        float: right !important;
    }/* HOMEPAGE *//* slider */

    .slideshow-wrapper .orbit-container {
        overflow: visible;
    }

    .slideshow-wrapper .orbit-container .orbit-slides-container,
    .slideshow-wrapper .slide {
        height: auto !important;
    }

    .orbit-container .orbit-slides-container > * {
        position: static;
        margin-left: 0;
    }

    .with-slides .slide .slide-content {
        min-height: 0 !important;
    }

    .with-slides .slide .slide-content .base {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 0;
    }

    .with-slides .slide .slide-content .base p,
    .with-slides .slide .slide-content .base h2,
    .with-slides .slide .slide-content .base .h2,
    .with-slides .slide .slide-content .base h3,
    .with-slides .slide .slide-content .base .h3,
    .with-slides .slide .slide-content .base {
        background: none;
        color: #5e6a71;
    }

    .slide-content .base header {
        display: block !important;
    }

    .with-slides .columns {
        padding-left: .625em;
        padding-right: .625em;
    }/* pillars */

    .pillar-wrapper-bottom,
    .pillar-wrapper-top {
        float: left;
        width: auto;
    }

    .pillar-wrapper-top .pillar.right,
    .pillar-wrapper-bottom .pillar {
        margin-top: 0;
    }/* teaser news */

    .blue-article-teaser .teaser {
        height: auto !important;
    }

    .blue-article-teaser a.article {
        padding-left: 0;
    }/* TABLES */

    .product .flip-scroll table {
        padding-bottom: 0;
        margin-top: 1em;
    }/* CONTENT *//* Archive page */

    .archive-teaser .hover-magnify {
        opacity: 1;
    }

    .archive-teaser .hover-magnify .img {
        margin-left: 0;
    }

    .archive-teaser li .img img {
        height: auto;
    }/* Teasers */

    .two-square-teaser,
    .four-square-teaser {
        margin-top: 0;
        margin-bottom: 0;
    }

    .four-square-teaser ul {
        width: auto;
    }

    .four-square-teaser ul li {
        margin: .5em;
    }

    .four-square-teaser ul li h3,
    .four-square-teaser ul li .h3,
    .four-square-teaser ul li a.link {
        height: auto !important;
        padding: 10px;
        text-align: left;
    }

    .four-square-teaser ul li a.link .arrow {
        display: none;
    }

    .two-square-teaser article,
    .two-square-teaser section {
        margin-right: 0;
        margin-left: 0;
    }/* CATALOG *//* Product list */

    .product-list #filter-dropdown {
        left: auto;
    }

    .product-list .large-12.columns,
    .product-list .large-4.columns {
        width: 100%;
    }

    .product-list .box .footer {
        background-color: transparent;
        border-top: 0;
    }

    .product-list .box .footer ul li {
        display: block !important;
    }

    .product-list .box .footer .expand {
        display: none;
    }

    .side-nav header,
    .side-nav .header {
        background: transparent;
    }

    .side-nav nav,
    .side-nav header h2,
    .side-nav header .h2,
    .side-nav .header h2,
    .side-nav .header .h2 {
        margin: 10px;
        padding: 0;
    }

    .side-nav nav ul li > ul li,
    .side-nav nav ul li a {
        padding-bottom: 5px;
        margin-bottom: 0;
    }

    .side-nav nav ul li {
        margin-bottom: 0;
    }

    .side-nav nav ul li > ul {
        margin: 0;
        padding-left: 20px;
    }

    .dropdown-wrapper > .dropdown {
        top: 0 !important;
        margin: 1em 0;
    }

    .search.dropdown .filter-list > li {
        list-style: none;
    }/* Product detail */

    .m-combi .img-wrapper img {
        height: 70px;
        width: auto;
    }

    .m-combi .table {
        display: table;
        width: 100%;
        margin-bottom: 0;
    }

    .m-combi .row {
        display: table-row;
    }

    .m-combi .table .row a .large-12,
    .m-combi .row .columns:first-child {
        display: table-cell;
        border-bottom: 1px solid #d7d9db;
        height: 80px;
    }

    .product.type .blue-article-teaser > .row {
        margin-bottom: 30px;
    }

    .product .product-info form.custom .button {
        margin-top: 0;
        margin-left: 1em;
    }

    .product .product-info .price,
    .product.type .product-info form.custom {
        margin-top: 0;
    }

    .product .product-info hr,
    .product .product-info .row-leftish.actions,
    .m-combi .combi-btn,
    .product .product-images ul {
        display: none;
    }

    .product .product-info .copy li {
        background: none;
        margin: 0 0 0 20px;
        padding: 0;
        list-style: disc;
    }

    #product-description .copy .large-10 > h2,
    .product .product-info .copy h2 {
        margin-top: 0;
    }

    #product-apps-tools .large-8,
    #product-description .copy .large-5,
    #product-description .copy .large-10 {
        width: 100%;
    }

    #product-apps-tools .descr-box > div,
    #product-apps-tools .large-8 .large-8 {
        width: 24%;
        margin: .5%;
    }

    #product-apps-tools .m-combi {
        max-height: none;
    }

    #available_products {
        margin-bottom: 1em;
    }

    .product #product-list .meta-nav a,
    .product #product-list .meta-nav {
        display: block !important;
        background: none;
        border: 0;
        color: #7090b7 !important;
        box-shadow: none;
        margin: 0;
        padding: 0;
        font-size: 18px;
    }
}