@charset "UTF-8";
.headline1, .headline1-light { word-wrap: break-word; }

/* TODO: add Documentation (pni) */
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/** Remove default margin. */
body { margin: 0; }

/* HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }

/** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */
audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address `[hidden]` styling not present in IE 8/9/10. Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */
[hidden], template { display: none; }

/* Links ========================================================================== */
/** Remove the gray background color from active links in IE 10. */
a { background: transparent; }

/** Improve readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; }

/* Text-level semantics ========================================================================== */
/** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */
abbr[title] { border-bottom: none; }

/** Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */
b, strong { font-weight: bold; }

/** Address styling not present in Safari and Chrome. */
dfn { font-style: italic; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* Embedded content ========================================================================== */
/** Remove border when inside `a` element in IE 8/9/10. */
img { border: 0; }

/** Correct overflow not hidden in IE 9/10/11. */
svg:not(:root) { overflow: hidden; }

/* Grouping content ========================================================================== */
/** Address margin not present in IE 8/9 and Safari. */
figure { margin: 1em 40px; }

/** Address differences between Firefox and other browsers. */
hr { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; }

/** Contain overflow in all browsers. */
pre { overflow: auto; }

/** Address odd `em`-unit font size rendering in all browsers. */
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

/* Forms ========================================================================== */
/** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */
/** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */
button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ }

/** Address `overflow` set to `hidden` in IE 8/9/10/11. */
button { overflow: visible; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

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

/** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width.  1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. */
input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }

/** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Define consistent border, margin, and padding. */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ }

/** Remove default vertical scrollbar in IE 8/9/10/11. */
textarea { overflow: auto; }

/** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */
optgroup { font-weight: bold; }

/* Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; font-size: inherit; line-height: inherit; }

td, th { padding: 0; }

/** @license MyFonts Webfont Build ID 2930202, 2014-11-27T09:14:00-0500  The fonts listed in this notice are subject to the End User License Agreement(s) entered into by the website owner. All other parties are explicitly restricted from using the Licensed Webfonts(s).  You may obtain a valid license at the URLs below.  Webfont: FF QType Web Comp Light by FontFont URL: http://www.myfonts.com/fonts/fontfont/ff-qtype/ot-comp-light/ Copyright: 2011 Achaz Reuss published by FSI FontShop International GmbH Licensed pageviews: 20,000,000   License: http://www.myfonts.com/viewlicense?type=web&buildid=2930202  © 2014 MyFonts Inc
*/
@font-face { font-family: 'qtype-light'; src: url("../../../../inc/fonts/qtypecomp-light-webfont.eot"); src: url("../../../../inc/fonts/qtypecomp-light-webfont.eot?#iefix") format("embedded-opentype"), url("../../../../inc/fonts/qtypecomp-light-webfont.woff2") format("woff2"), url("../../../../inc/fonts/qtypecomp-light-webfont.woff") format("woff"), url("../../../../inc/fonts/qtypecomp-light-webfont.ttf") format("truetype"), url("../../../../inc/fonts/qtypecomp-light-webfont.svg#qtypecomp-lightregular") format("svg"); font-weight: 300; font-style: normal; }
@font-face { font-family: 'qtype'; src: url("../../../../inc/fonts/qtypecomp-medium-webfont.eot"); src: url("../../../../inc/fonts/qtypecomp-medium-webfont.eot?#iefix") format("embedded-opentype"), url("../../../../inc/fonts/qtypecomp-medium-webfont.woff") format("woff"), url("../../../../inc/fonts/qtypecomp-medium-webfont.ttf") format("truetype"), url("../../../../inc/fonts/qtypecomp-medium-webfont.svg#qtypecomp-mediumregular") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Open Sans Bold'; src: url("../../../../inc/fonts/OpenSans-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'icons'; src: url("../../../../inc/fonts/icons.eot?xomo5ek"); src: url("../../../../inc/fonts/icons.eot?xomo5ek#iefix") format("embedded-opentype"), url("../../../../inc/fonts/icons.woff?xomo5ek") format("woff"), url("../../../../inc/fonts/icons.ttf?xomo5ek") format("truetype"), url("../../../../inc/fonts/icons.svg?xomo5ek#icons") format("svg"); font-weight: normal; font-style: normal; }
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

html { font-size: 62.5%; }

body { background: #f2f2f2; color: #21314d; font-size: 1.3rem; font-family: "Open Sans", sans-serif; line-height: 1.4; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

nav ul { margin: 0; padding: 0; }

iframe { border: 0 none; }

::-moz-selection { background: #b3d4fc; text-shadow: none; }

::selection { background: #b3d4fc; text-shadow: none; }

/*
* A better looking default horizontal rule
*/
hr { display: block; clear: both; height: 1px; border: 0; border-top: 1px solid #d3d6db; margin: 1em 0; padding: 0; }

/*
* Remove the gap between images, videos, audio and canvas and the bottom of
* their containers: h5bp.com/i/440
*/
audio, canvas, img, svg, video { vertical-align: middle; }

/*
* Remove default fieldset styles.
*/
fieldset { border: 0; margin: 0; padding: 0; }

/*
* Allow only vertical resizing of textareas.
*/
.content-wrapper { margin-top: 120px; padding-bottom: 70px; background: #fff; min-height: 50rem; }
@media only screen and (max-width: 960px) { .content-wrapper { margin-top: 60px; padding-bottom: 50px; min-height: 20rem; } }

.inner-wrapper { margin: 0 auto; max-width: 1104px; padding: 0; position: relative; }
@media only screen and (max-width: 1100px) { .inner-wrapper { padding: 0 46px; } }
@media only screen and (max-width: 960px) { .inner-wrapper { padding: 0 10px; } }
.inner-wrapper .inner-wrapper { padding: 0; }

@media only screen and (max-width: 1100px) { .inner-wrapper-invert { margin-left: -46px; margin-right: -46px; } }
@media only screen and (max-width: 960px) { .inner-wrapper-invert { margin-left: -10px; margin-right: -10px; } }

.intro-wrapper img { width: 100%; }
@media only screen and (max-width: 700px) { .intro-wrapper img { display: none; } }

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide:not(.ng-hide-animate) { display: none !important; }

ng\:form { display: block; }

.ng-animate-block-transitions { -webkit-transition: 0s all !important; transition: 0s all !important; }

.ng-hide-add-active, .ng-hide-remove { display: block !important; }

.bg-green { background-color: #84bc34; }

.bg-green-20 { background-color: #e6f2d6; }

.bg-green-40 { background-color: #cee4ae; }

.bg-green-60 { background-color: #b5d785; }

.bg-green-80 { background-color: #9dc95d; }

.bg-green-dark { background-color: #66a543; }

.bg-blue { background-color: #21314d; color: #fff; }

.bg-blue-20 { background-color: #d3d6db; }

.bg-blue-40 { background-color: #a6adb8; }

.bg-blue-60 { background-color: #7a8394; color: #fff; }

.bg-blue-80 { background-color: #4d5a71; }

.bg-grey { background-color: #e5e5e5; color: #21314d; }

.bg-grey-05 { background-color: #f2f2f2; color: #21314d; }

.bg-grey-10 { background-color: #e5e5e5; color: #21314d; }

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

@media only screen and (max-width: 960px) { .bg-blue-m { background-color: #21314d; color: #fff; }
  .bg-green-m { background-color: #84bc34; }
  .bg-green-60-m { background-color: #b5d785; }
  .bg-green-80-m { background-color: #9dc95d; } }
@media only screen and (max-width: 700px) { .bg-blue-s { background-color: #21314d; color: #fff; }
  .bg-green-s { background-color: #84bc34; }
  .bg-green-60-s { background-color: #b5d785; }
  .bg-green-80-s { background-color: #9dc95d; } }
.blue, .is-blue, .is-blue * { color: #21314d; }

.is-blue-80 { color: #4d5a71; }

.is-blue-60 { color: #7a8394; }

.is-blue-40 { color: #a6adb8; }

.is-blue-20 { color: #d3d6db; }

.is-white, .is-white * { color: #fff; }

.is-green, .is-green * { color: #75b03c; }

.is-green-80 { color: #9dc95d; }

.is-green-60 { color: #9dc95d; }

.is-red, .is-red * { color: #df002e; }

.is-black-20 { color: #cccccc; }

.is-black-10 { color: #e5e5e5; }

.is-black-05 { color: #f2f2f2; }

@media only screen and (max-width: 960px) { .is-white-m, .is-white-m * { color: #fff; } }
.gradient-silver { background: #e5e5e5; background-image: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background-image: linear-gradient(45deg, #e5e5e5, #fff); }

.gradient-silver-0 { background: #e5e5e5; background-image: -webkit-linear-gradient(90deg, #e5e5e5, #fff); background-image: linear-gradient(0deg, #e5e5e5, #fff); }

.gradient-silver-45 { background: #e5e5e5; background-image: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background-image: linear-gradient(45deg, #e5e5e5, #fff); }

.gradient-silver-90 { background: #e5e5e5; background-image: -webkit-linear-gradient(0deg, #e5e5e5, #fff); background-image: linear-gradient(90deg, #e5e5e5, #fff); }

.gradient-silver-135 { background: #e5e5e5; background-image: -webkit-linear-gradient(315deg, #e5e5e5, #fff); background-image: linear-gradient(135deg, #e5e5e5, #fff); }

.gradient-silver-180 { background: #e5e5e5; background-image: -webkit-linear-gradient(270deg, #e5e5e5, #fff); background-image: linear-gradient(180deg, #e5e5e5, #fff); }

.gradient-silver-225 { background: #e5e5e5; background-image: -webkit-linear-gradient(225deg, #e5e5e5, #fff); background-image: linear-gradient(225deg, #e5e5e5, #fff); }

.gradient-silver-270 { background: #e5e5e5; background-image: -webkit-linear-gradient(180deg, #e5e5e5, #fff); background-image: linear-gradient(270deg, #e5e5e5, #fff); }

.gradient-silver-315 { background: #e5e5e5; background-image: -webkit-linear-gradient(135deg, #e5e5e5, #fff); background-image: linear-gradient(315deg, #e5e5e5, #fff); }

.gradient-dark-silver { background: #cccccc; background-image: -webkit-linear-gradient(45deg, #cccccc, #f2f2f2); background-image: linear-gradient(45deg, #cccccc, #f2f2f2); }

/* TODO: Add entry in Styleguide (pni) */
[data-icon]:before, .download:before, .icon-plus:before, .device-detail .box-content .close:before, .subnav-list li.active a:before, .subnav-list li a.is-current:before, .subnav-list li a:hover:before, .subnav-list > a:hover:before, a.subnav-more:hover:before, .item-circle-icon:hover a.subnav-more:before, .item-icon:hover .hoverbox-content a:before, .menu-box:hover .hoverbox-content a:before, .vvl-active-filters .filter:before, .vvl-all-filters .filter .arrow:before, .vvl-all-filters .filter-header:before, th.info:before, td.info:before, .modal-header .close:before { margin-right: .25em; content: attr(data-icon) !important; font-family: 'icons'; speak: none; font-size: 1.4em; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

[data-icon-after]:after, .accordion-head:after, .pushmenu-menu .main span:after { margin-left: .25em; content: attr(data-icon-after); font-family: 'icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: inherit; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.info-hover, .more-information-content, .eyecatcher .eyecatcher-tooltip, .accordion-content, .filter-result-search .filter-conditions, .filter-result-search .filter-conditions .cond, .cart-wrapper, .shopping-cart-content, .user-status-content, .user-contact-content, .introslides .slide, .slides .slides-container > li, .slides-box .slides-container-box > li, .slides > li, .modal, .filter-conditions, .filter-conditions .cond, .offer-device, .offer-tariff, .is-invisible, .invisible { opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; }

.info-i:hover + .info-hover, .is-active > .accordion-content, .filter-result-search .filter-conditions .col.is-open .cond, .filter-result-search > li.is-active .filter-conditions, .is-active .cart-wrapper, .is-active .shopping-cart-content, .is-active .user-status-content, .is-active .user-contact-content, .introslides .slide.is-visible, .slides .slides-container > li.is-visible, .slides-box .slides-container-box > li.is-visible, .slides > li.is-visible, .filter-conditions .col.is-open .cond, .filter-result > li.is-active .filter-conditions, .smh-hover:hover .info-hover, .is-visible, .visible { opacity: 1; visibility: visible; }

.inner-wrapper:before, .grid-wrapper:before, .box-holder:before, .form-item:before, .btn-block:before, .infobox-fullwidth:before, header .subnav:before, .vendor-select:before, .table-classic tr.is-active th:before, .table-classic tr.is-active .phone-right:before, .smartphoneBox:before, .apple .intro-wrapper:before, .clearfix:before, .progressbar li:before, .inner-wrapper:after, .grid-wrapper:after, .box-holder:after, .form-item:after, .btn-block:after, .infobox-fullwidth:after, header .subnav:after, .vendor-select:after, .table-classic tr.is-active th:after, .table-classic tr.is-active .phone-right:after, .smartphoneBox:after, .apple .intro-wrapper:after, .clearfix:after, .progressbar li:after { content: ""; display: table; clear: both; }

.grid-wrapper { margin: 0 -10px; }
@media only screen and (max-width: 700px) { .grid-wrapper { margin: 0 -5px; } }

.grid-col, .grid-full { padding: 10px; }
@media only screen and (max-width: 700px) { .grid-col, .grid-full { padding: 5px; } }

.grid-col { float: left; }
.grid-col > .grid-full { padding: 0; }
.grid-col.float-right { float: right; }

.grid-reverse { float: right; }

.grid-xl-12 { width: 100%; }

.grid-xl-11 { width: 91.66667%; }

.grid-xl-10 { width: 83.33333%; }

.grid-xl-9 { width: 75%; }

.grid-xl-8 { width: 66.66667%; }

.grid-xl-7 { width: 58.33333%; }

.grid-xl-6 { width: 50%; }

.grid-xl-5 { width: 41.66667%; }

.grid-xl-4 { width: 33.33333%; }

.grid-xl-3 { width: 25%; }

.grid-xl-2 { width: 16.66667%; }

.grid-xl-1 { width: 8.33333%; }

.grid-xl-pp-1 { margin-left: 8.33333%; }

.grid-xl-ap-1 { margin-right: 8.33333%; }

.grid-xl-pp-2 { margin-left: 16.66667%; }

.grid-xl-ap-2 { margin-right: 16.66667%; }

.grid-xl-pp-3 { margin-left: 25%; }

.grid-xl-ap-3 { margin-right: 25%; }

.grid-xl-pp-4 { margin-left: 33.33333%; }

.grid-xl-ap-4 { margin-right: 33.33333%; }

.grid-xl-pp-5 { margin-left: 41.66667%; }

.grid-xl-ap-5 { margin-right: 41.66667%; }

.grid-xl-pp-6 { margin-left: 50%; }

.grid-xl-ap-6 { margin-right: 50%; }

@media only screen and (max-width: 1100px) { .grid-l-12 { width: 100%; }
  .grid-l-11 { width: 91.66667%; }
  .grid-l-10 { width: 83.33333%; }
  .grid-l-9 { width: 75%; }
  .grid-l-8 { width: 66.66667%; }
  .grid-l-7 { width: 58.33333%; }
  .grid-l-6 { width: 50%; }
  .grid-l-5 { width: 41.66667%; }
  .grid-l-4 { width: 33.33333%; }
  .grid-l-3 { width: 25%; }
  .grid-l-2 { width: 16.66667%; }
  .grid-l-1 { width: 8.33333%; }
  .grid-l-pp-1 { margin-left: 8.33333%; }
  .grid-l-ap-1 { margin-right: 8.33333%; }
  .grid-l-pp-2 { margin-left: 16.66667%; }
  .grid-l-ap-2 { margin-right: 16.66667%; }
  .grid-l-pp-3 { margin-left: 25%; }
  .grid-l-ap-3 { margin-right: 25%; }
  .grid-l-pp-4 { margin-left: 33.33333%; }
  .grid-l-ap-4 { margin-right: 33.33333%; }
  .grid-l-clear { margin-left: 0; margin-right: 0; } }
@media only screen and (max-width: 960px) { .grid-m-12 { width: 100%; }
  .grid-m-11 { width: 91.66667%; }
  .grid-m-10 { width: 83.33333%; }
  .grid-m-9 { width: 75%; }
  .grid-m-8 { width: 66.66667%; }
  .grid-m-7 { width: 58.33333%; }
  .grid-m-6 { width: 50%; }
  .grid-m-5 { width: 41.66667%; }
  .grid-m-4 { width: 33.33333%; }
  .grid-m-3 { width: 25%; }
  .grid-m-2 { width: 16.66667%; }
  .grid-m-1 { width: 8.33333%; }
  .grid-m-pp-1 { margin-left: 8.33333%; }
  .grid-m-ap-1 { margin-right: 8.33333%; }
  .grid-m-pp-2 { margin-left: 16.66667%; }
  .grid-m-ap-2 { margin-right: 16.66667%; }
  .grid-m-pp-3 { margin-left: 25%; }
  .grid-m-ap-3 { margin-right: 25%; }
  .grid-m-pp-4 { margin-left: 33.33333%; }
  .grid-m-ap-4 { margin-right: 33.33333%; }
  .grid-m-clear { margin-left: 0; margin-right: 0; } }
@media only screen and (max-width: 700px) { .grid-s-8 { width: 100%; }
  .grid-s-7 { width: 87.5%; }
  .grid-s-6 { width: 75%; }
  .grid-s-5 { width: 62.5%; }
  .grid-s-4 { width: 50%; }
  .grid-s-3 { width: 37.5%; }
  .grid-s-2 { width: 25%; }
  .grid-s-1 { width: 12.5%; }
  .grid-s-pp-1 { margin-left: 12.5%; }
  .grid-s-ap-1 { margin-right: 12.5%; }
  .grid-s-pp-2 { margin-left: 25%; }
  .grid-s-ap-2 { margin-right: 25%; }
  .grid-s-pp-4 { margin-left: 50%; }
  .grid-s-ap-4 { margin-right: 50%; }
  .grid-s-clear { margin-left: 0; margin-right: 0; } }
.grid-form { width: 100%; }

.grid-form, .grid-form-1, .grid-form-2 { float: left; padding: 0 10px; }
@media only screen and (max-width: 700px) { .grid-form, .grid-form-1, .grid-form-2 { padding: 0; } }

.grid-form-1 { width: 33.3%; }

.grid-form-2 { width: 66.6%; }

@media only screen and (max-width: 700px) { .grid-form-1, .grid-form-2 { width: 100%; } }
p { margin: 0 0 1.8rem; }

h2.has-border, h3.has-border { margin-bottom: .5em; padding-bottom: .5em; border-bottom: 1px solid; }

.headline-mixed { font-family: "canada-type-gibson", sans-serif; }
.headline-mixed span { display: block; font-family: "canada-type-gibson", sans-serif; }

h1, .headline1, .headline1-light { font-family: "canada-type-gibson", sans-serif; font-size: 3.6rem; font-weight: 700; line-height: 1.111; text-align: center; text-transform: uppercase; }
@media only screen and (max-width: 960px) { h1, .headline1, .headline1-light { font-size: 2.8rem; line-height: 1.072; } }
@media only screen and (max-width: 700px) { h1, .headline1, .headline1-light { font-size: 2.4rem; } }

h1 { margin: 0 0 40px; padding-top: 40px; }
@media only screen and (max-width: 700px) { h1 { margin: 0 0 10px; padding: 20px 10px 0; } }

.bg-blue h1 { color: #fff; }

.headline1-light { font-family: "canada-type-gibson", sans-serif; font-weight: normal; }

h2, .headline2, .headline2-light { font-family: "canada-type-gibson", sans-serif; font-size: 2rem; font-weight: 300; line-height: 1.2; margin: 0 0 1.8rem; padding: 0; text-align: left; text-transform: uppercase; }

.headline2-light { font-family: "canada-type-gibson", sans-serif; }

h3, .headline3, .headline3-light, .introslides .slides-bullets li, .introslides .rc-bullets li { font-family: "Open Sans Bold", sans-serif; font-size: 1.6rem; font-weight: 300; line-height: 1.15; text-transform: uppercase; }
h3.box-headline, .headline3.box-headline, .box-headline.headline3-light, .introslides .slides-bullets li.box-headline, .introslides .rc-bullets li.box-headline { font-weight: bold; }

h3 { margin: 0 0 1em; }

.headline3-light, .introslides .slides-bullets li, .introslides .rc-bullets li { font-family: "Open Sans Bold", sans-serif; }

.mixed-headline { padding-bottom: 42px; text-align: center; }
.mixed-headline h1 { margin-bottom: 0; }
.mixed-headline .phone-number { color: #21314d; margin-left: 5px; }
.mixed-headline .phone-number:hover { text-decoration: none; }
@media only screen and (max-width: 960px) { .mixed-headline .phone-number { display: block; } }

.promotion-headline { height: 201px; padding-top: 50px; font-size: 5rem; }
@media only screen and (max-width: 960px) { .promotion-headline { font-size: 2.8rem; } }
@media only screen and (max-width: 700px) { .promotion-headline { height: auto; font-size: 2rem; } }
.promotion-headline > span { display: inline-block; position: relative; color: #21314d; text-align: left; }
.promotion-headline > span:after, .promotion-headline > span:before { bottom: -.3em; left: -.6em; right: -.6em; top: -.3em; position: absolute; background: rgba(132, 188, 52, 0.5); content: ''; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.promotion-headline > span:after { left: -.7em; -webkit-transform: rotate(-2deg) skewX(20deg) skewY(3deg); -ms-transform: rotate(-2deg) skewX(20deg) skewY(3deg); transform: rotate(-2deg) skewX(20deg) skewY(3deg); }
.promotion-headline > span:before { right: -.3em; -webkit-transform: rotate(1deg) skewX(-8deg) skewY(-3deg); -ms-transform: rotate(1deg) skewX(-8deg) skewY(-3deg); transform: rotate(1deg) skewX(-8deg) skewY(-3deg); }
.promotion-headline span span { display: table; padding: 5px; position: relative; z-index: 1; background: #fff; line-height: 1; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.promotion-headline span span:first-child { margin-left: .75em; -webkit-transform: rotate(-1deg); -ms-transform: rotate(-1deg); transform: rotate(-1deg); }
.promotion-headline span span:last-child { margin: -.15em 0 0 -.5em; -webkit-transform: rotate(0.5deg); -ms-transform: rotate(0.5deg); transform: rotate(0.5deg); }

.promotion-headline.is-centered { text-align: center; }
.promotion-headline.is-centered > span { text-align: center; }
.promotion-headline.is-centered > span:after { left: -.6em; -webkit-transform: rotate(-3deg) skewX(12deg) skewY(3deg); -ms-transform: rotate(-3deg) skewX(12deg) skewY(3deg); transform: rotate(-3deg) skewX(12deg) skewY(3deg); }
.promotion-headline.is-centered > span:before { right: -.6em; -webkit-transform: rotate(1deg) skewX(-6deg) skewY(-5deg); -ms-transform: rotate(1deg) skewX(-6deg) skewY(-5deg); transform: rotate(1deg) skewX(-6deg) skewY(-5deg); }
.promotion-headline.is-centered span span { margin: 0 auto; }

.ph--small { height: auto; margin: -.5em 0; min-height: 12rem; padding-top: 0; font-size: 2.8rem; line-height: 1; }

a { color: #75b03c; cursor: pointer; text-decoration: none; }
a:hover { text-decoration: underline; }
a:active, a:visited, a:focus { outline: none; }

a.as-text { color: inherit; text-decoration: none; }

.icon-link { display: inline-block; }

a.icon-link { margin-left: 15px; position: relative; }
a.icon-link:before { position: absolute; left: -20px; height: -webkit-calc(100% - 2px); height: calc(100% - 2px); overflow: hidden; }

.icon-link.only-icon { margin: 0; text-decoration: none; }
.icon-link.only-icon:before { height: -webkit-calc(1em - 2px); height: calc(1em - 2px); left: 0; text-decoration: none; }

a.only-icon[data-icon]:hover { text-decoration: none; }

a.download:before { content: "\e604"; position: absolute; }

a.footnote { color: inherit; font-size: 1.3rem; font-weight: normal; }
a.footnote:hover { text-decoration: none; }

[app-md-footnote] { display: none; }

.footnote-white a.footnote { color: #fff; }

ul { margin: 0 0 1.8rem 1.8rem; padding: 0; list-style-type: disc; }

.list { margin: 0 0 1.8rem 1.3rem; padding: 0; }
.list li { padding-left: 5px; }

ol { margin: 0 0 1.8rem 1.8rem; }

.checklist { list-style: none outside none; padding-left: 4px; }
.checklist li { margin-bottom: .3rem; }
.checklist li:before { content: '\e601'; font-family: "icons"; margin-left: -2rem; margin-right: 6px; position: absolute; }
.checklist li.not-checked:before { content: none; }
.checklist.checklist-green li:before, .checklist.green-icon li:before { color: #84bc34; }

.linklist { list-style: none outside none; margin-left: 0; }
.linklist li { margin-bottom: .6rem; padding-left: 1.8rem; }
.linklist li:before { margin-left: -2rem; padding-top: 3px; position: absolute; color: #75b03c; content: '\e658'; font-family: "icons"; font-size: 1.4em; line-height: 0.71429; }
.linklist li.is-active a { color: #21314d; font-weight: 700; }
.linklist li.is-active:before { color: #21314d; }
.linklist li.go-back:before { color: #4d5a71; content: '\e656'; }
.linklist li.go-back a { color: #cccccc; }
.linklist a.is-active { color: #21314d; font-weight: 700; }
.linklist a.is-active:before { color: #21314d; }

.blue li:before, .blue a { color: #21314d; }

.downloads-list li:before { content: '\e604'; }

.pluslist { list-style: none outside none; padding-left: 4px; }
.pluslist li { color: #df002e; margin-bottom: .3rem; }
.pluslist li:before { content: '\e702'; font-family: "icons"; margin-left: -2rem; margin-right: 6px; position: absolute; }
.pluslist li.not-checked:before { content: none; }
.pluslist li.no-plus:before { content: ''; }
.pluslist li span.fixed { display: inline-block; margin-right: 10px; text-align: right; width: 40px; }
.pluslist.pluslist-red li:before, .pluslist.green-icon li:before { color: #df002e; }

.list.selection-list { height: auto; opacity: 1; visibility: visible; position: static; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; }
.list.selection-list li { padding-left: 2em; }
.list.selection-list li.is-active, .list.selection-list li:hover { cursor: pointer; background-color: #d3d6db; }

.characterlist li:before { content: '\e913'; font-size: 1.3em; position: relative; top: 2px; }
.characterlist li.checked:before { content: '\e912'; }

dl { margin: 0; overflow: hidden; }

dt { float: left; clear: left; }

dd { margin-left: 40px; }

ul.qtype-nav { list-style-type: none; margin: 3rem 0 2rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
@media only screen and (max-width: 700px) { ul.qtype-nav { margin-top: 1rem; display: block; } }
ul.qtype-nav li { font-family: "canada-type-gibson", sans-serif; font-size: 2rem; line-height: 2.4rem; display: inline-block; text-align: center; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }
@media only screen and (max-width: 700px) { ul.qtype-nav li { display: none; width: 80%; -webkit-box-flex: none; -webkit-flex: none; -ms-flex: none; flex: none; }
  ul.qtype-nav li.is-active { display: inline-block; } }
ul.qtype-nav li.is-active a, ul.qtype-nav li:hover a { color: #21314d; }
@media only screen and (max-width: 700px) { ul.qtype-nav li.is-active a, ul.qtype-nav li:hover a { font-size: 2rem; } }
ul.qtype-nav li.next, ul.qtype-nav li.prev { display: none; }
@media only screen and (max-width: 700px) { ul.qtype-nav li.next, ul.qtype-nav li.prev { display: inline-block; width: 8%; } }
ul.qtype-nav li.next:before, ul.qtype-nav li.prev:before { font-size: 2rem; margin-right: 0; }
@media only screen and (max-width: 1100px) { ul.qtype-nav li.next:before, ul.qtype-nav li.prev:before { font-size: 1.6rem; } }
@media only screen and (max-width: 960px) { ul.qtype-nav li.next:before, ul.qtype-nav li.prev:before { font-size: 1.4rem; } }
@media only screen and (max-width: 700px) { ul.qtype-nav li.next:before, ul.qtype-nav li.prev:before { font-size: 2rem; } }
ul.qtype-nav li.next:hover, ul.qtype-nav li.prev:hover { font-size: 100%; }
@media only screen and (max-width: 1100px) { ul.qtype-nav li { font-size: 1.6rem; line-height: 2rem; } }
@media only screen and (max-width: 960px) { ul.qtype-nav li { font-size: 1.4rem; }
  ul.qtype-nav li.is-active a, ul.qtype-nav li.hover a { font-size: 1.4rem; } }
@media only screen and (max-width: 700px) { ul.qtype-nav li { font-size: 2rem; }
  ul.qtype-nav li.is-active a, ul.qtype-nav li.hover a { font-size: 2rem; } }
ul.qtype-nav a { color: #7a8394; font-size: inherit; -webkit-transition: all 0.2s; transition: all 0.2s; }
ul.qtype-nav a:hover { text-decoration: none; }

.suggestlist { list-style: none; margin: 1rem 0; color: #21314d; }
.suggestlist li { padding: 10px 0 4px 5rem; position: relative; border-bottom: 1px solid #21314d; }
.suggestlist li:before { content: attr(data-icon); height: 100%; left: 0; margin-right: 10px; position: absolute; width: auto; font-size: 4rem; }
.suggestlist li div:hover, .suggestlist li div.active { background-color: #cccccc; }
.suggestlist li h4 { margin: 5px 0 0; }
.suggestlist li .suggestion { display: block; padding: 0; }
.suggestlist li a { color: #21314d; }
.suggestlist li a.active { background-color: #cccccc; }
.suggestlist li em { color: #21314d; font-weight: 700; font-style: normal; }

.search-result-page .presuggestion-container.is-active { overflow: visible; }

.presuggestlist { list-style: none; margin: 1rem 0; }
.presuggestlist li { padding: 4px 0; border-bottom: 1px solid #cccccc; cursor: pointer; }
.presuggestlist li:first-child { margin-bottom: 1rem; }
.presuggestlist li:first-child, .presuggestlist li:last-child { border-bottom: none; }
.presuggestlist li:hover, .presuggestlist li.active { background-color: #cccccc; }
.presuggestlist li a { color: #21314d; }
.presuggestlist li a.active { background-color: #cccccc; }

img { max-width: 100%; }

.icon-plus { position: absolute; left: 50%; top: 47%; z-index: 3; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); background: #fff; width: 40px; height: 40px; text-align: center; margin-left: -20px; }
.icon-plus:before { line-height: 40px; font-size: 3rem; margin-right: 0; }

.pushmenu-icon { font-size: 0; height: 50px; padding: 0; width: 40px; cursor: pointer; }
.pushmenu-icon:after { color: #fff; font-size: 3rem !important; line-height: 30px; margin-left: 0; }

.is-arrow-down { display: inline-block; height: 0; width: 0; border-color: #cccccc transparent transparent; border-style: solid; border-width: 8px 6px 0; }

.is-arrow-up { display: inline-block; height: 0; width: 0; border-color: transparent transparent #cccccc; border-style: solid; border-width: 0 6px 8px; }

.info-i { color: #84bc34; display: inline-block; height: 1em; width: 20px; }
.info-i:hover { color: #21314d; }

.info-i:before { content: "\e619"; font-family: "icons"; font-size: 1.2em; line-height: 1; margin-left: 5px; position: absolute; }

.info-hover { position: relative; bottom: 100%; max-width: 100%; min-width: 250px; padding: 10px; position: absolute; }
.info-hover:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -5px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 5px 0; content: ''; cursor: pointer; }

.listen { display: inline-block; width: 30px; }

.listen:before { content: "\e613"; font-family: "icons"; font-size: 1.4em; line-height: 1; position: absolute; }

.icon-circle { border-radius: 50%; width: 50px; font-size: 32px; margin-left: 10%; height: auto; padding-top: 50px; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; text-align: center; z-index: 1; background-color: rgba(33, 49, 77, 0.85); }
.icon-circle [data-icon]::before { margin: auto; }
.icon-circle.blue { background-color: rgba(33, 49, 77, 0.85); }
.icon-circle.white { background-color: white; }
.icon-circle.green { background-color: rgba(132, 188, 52, 0.85); }
.icon-circle.green-80 { background-color: rgba(157, 201, 93, 0.85); }
.icon-circle.green-60 { background-color: rgba(181, 215, 133, 0.85); }
.icon-circle.red { background-color: rgba(223, 0, 46, 0.85); }
.icon-circle.bigger { width: 90px; font-size: 57px; padding-top: 90px; }
.icon-circle.bigger span:before { font-size: 1em; vertical-align: middle; }
.icon-circle .text-holder { width: 100%; overflow: hidden; padding: 0; position: absolute; top: 0; left: 0; text-shadow: none; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.icon-circle .text-holder div { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }

.icon-holder { display: inline-block; }
.icon-holder .icon-circle { display: inline-block; margin: 3px; }

.netsprite, .netsprite-s, .netsprite-m, .netsprite-l { display: inline-block; margin-right: 5px; background-image: url(/inc/images/sprite_cobranding.png); background-repeat: no-repeat; text-indent: -99999px; /*SEO*/ }

.netsprite { height: 18px; width: 24px; }
.netsprite.ep { background-position: -30px 0; }
.netsprite.d2 { background-position: -64px 0; }
.netsprite.o2 { background-position: -96px 0; }
.netsprite.md { background-position: -128px 0; }
.netsprite.d2-netz { background-position: -160px 0; }
.netsprite.netz { background-position: -192px 0; }
.netsprite.o2-netz { background-position: -224px 0; }
.netsprite.dnetz-alt { background-position: -256px 0; }
.netsprite.label { margin-left: 5px; }
.netsprite.label:before { content: "im Netz von"; position: absolute; right: 18px; width: 75px; top: 15px; font-size: 1rem; text-indent: 0; }

.netsprite-s { height: 25px; width: 36px; background-position: 0 -51px; }
.netsprite-s.ep { background-position: -41px -51px; }
.netsprite-s.d2 { background-position: -80px -51px; }
.netsprite-s.o2 { background-position: -120px -51px; }
.netsprite-s.tef, .netsprite-s.tf { background-position: -364px -51px; }
.netsprite-s.tef.label:before, .netsprite-s.tf.label:before { content: 'In den Netzen von'; right: 35px; width: 65px; }
.netsprite-s.md { background-position: -160px -51px; }
.netsprite-s.d2-netz { background-position: -202px -51px; }
.netsprite-s.netz { background-position: -244px -51px; }
.netsprite-s.o2-netz { background-position: -283px -51px; }
.netsprite-s.dnetz-alt { background-position: -322px -51px; }
.netsprite-s.label { margin-left: 5px; }
.netsprite-s.label:before { content: 'im Netz von'; position: absolute; right: 18px; width: 75px; font-size: 1rem; text-indent: 0; }

.netsprite-m { height: 38px; width: 53px; background-position: 0 -100px; }
.netsprite-m.ep { background-position: -62px -100px; }
.netsprite-m.d2 { background-position: -120px -100px; }
.netsprite-m.o2 { background-position: -180px -100px; }
.netsprite-m.md { background-position: -238px -100px; }
.netsprite-m.d2-netz { background-position: -300px -100px; }
.netsprite-m.tef, .netsprite-m.tf { background-position: -543px -100px; }
.netsprite-m.netz { background-position: -363px -100px; }
.netsprite-m.o2-netz { background-position: -423px -100px; }
.netsprite-m.dnetz-alt { background-position: -483px -100px; }
.netsprite-m.label { margin-left: 5px; }
.netsprite-m.label:before { content: "im Netz von"; position: absolute; right: 38px; width: 75px; font-size: 1rem; text-indent: 0; }

.netsprite-l { height: 48px; width: 66px; background-position: 0 -152px; }
.netsprite-l.ep { background-position: -80px -152px; }
.netsprite-l.d2 { background-position: -164px -152px; }
.netsprite-l.o2 { background-position: -244px -152px; }
.netsprite-l.md { background-position: -328px -152px; }
.netsprite-l.d2-netz { background-position: -410px -152px; }
.netsprite-l.tef, .netsprite-l.tf { background-position: -738px -152px; }
.netsprite-l.netz { background-position: -492px -152px; }
.netsprite-l.o2-netz { background-position: -574px -152px; }
.netsprite-l.dnetz-alt { background-position: -656px -152px; }

.offcanvas-contents table .net { position: relative; top: 0.5em; }

.btn.st-message { -webkit-box-shadow: none; box-shadow: none; margin: 0; }
.btn.st-message:hover { background-color: #84bc34; cursor: default; }
.btn.st-message.btn-blue:hover { background-color: #21314d; }

table .btn.st-message, .btn.st-message { display: inline-block; width: auto; }

.status-point { display: inline-block; height: 10px; margin-right: 0.5em; width: 10px; background-color: #df002e; border-radius: 50%; }
.status-point.in-handling { background-color: #e6be00; }
.status-point.is-finished { background-color: #84bc34; }

label { display: inline-block; float: left; font-weight: 700; margin-bottom: 1em; padding-right: 10px; width: 33.3%; }
@media only screen and (max-width: 700px) { label { float: none; width: 100%; } }
label.label-block { display: block; float: none; width: auto; }
label.is-disabled { color: #d3d6db; }

.label-full { margin-bottom: 0; width: 100%; }

.group-radiobox.inline label { padding-right: 10px; width: auto; }

input { padding: 0 10px; -webkit-box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); }

input[type=search] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; -webkit-appearance: none; }
input[type=search]::-ms-clear { display: none; }
.input-container input[type=search] { display: inline-block; height: 30px; outline: none; margin-bottom: 1.5em; background-color: #fff; padding: 0; border-color: #21314d; border-style: solid; border-width: 0 0 1px; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; }
.input-container input[type=search].ng-valid.ng-dirty { border-color: #21314d; }
@media only screen and (max-width: 700px) { input[type=search] { font-size: 16px; } }

input[type="range"] { padding: 0; -webkit-box-shadow: none; box-shadow: none; }

textarea { height: auto; line-height: 1.43; max-width: 100%; overflow: scroll; padding: 10px; resize: none; -webkit-box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); }

.selectbox { display: block; height: 30px; line-height: 30px; outline: none; padding-right: 0; background-color: #fff; border: 1px solid #e5e5e5; border-radius: 0; -webkit-box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; }
.selectbox[disabled], .selectbox[readonly], fieldset[disabled] .selectbox { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; opacity: 1; }
.selectbox option { font-style: normal; padding: 4px 4px 4px 14px; }
.selectbox option:first-child { font-style: italic; }
.selectbox.is-inline { width: auto; }

select:-moz-focusring { outline: none; }

.bg-blue .dropdown:hover .select-box { border-color: #7a8394; }
.bg-blue .dropdown:hover li:hover { background-color: #d3d6db; }

.bg-green .dropdown:hover .select-box { background-color: #fff; }
.bg-green .dropdown:hover li:hover { background-color: #e6f2d6; }

.dropdown.inactive .inner-span { background-color: transparent; }
.dropdown.inactive:focus .inner-span, .dropdown.inactive:hover .inner-span { border-color: #e5e5e5; }
.dropdown.inactive:focus .inner-span:after, .dropdown.inactive:hover .inner-span:after { color: #7a8394; content: '\e7c4'; }
.dropdown.inactive:focus ul, .dropdown.inactive:hover ul { visibility: hidden; opacity: 0; }

.selectbox.multiple { height: auto; max-height: 120px; padding-left: 0; }

.group-radiobox { display: inline-block; }
.group-radiobox input { margin-top: 6px; }

input[type="radio"] { margin-right: .25em; -webkit-box-shadow: none; box-shadow: none; }

.group-checkbox { display: inline-block; }
.group-checkbox input { margin-top: 5px; }

input[type="checkbox"] { margin-right: .25em; }

.form { padding: 20px; }

@media only screen and (max-width: 700px) { .form-introtext { margin: 30px 0 0; } }

.field-item { display: inline-block; width: 66.6%; }
@media only screen and (max-width: 700px) { .field-item { display: block; width: 100%; } }

.upload-item input[type="file"] { opacity: 0; height: 50px; position: relative; top: -50px; width: 100%; z-index: 1; margin-bottom: -45px; cursor: pointer; padding: 0; }
.upload-item .fake-control input { width: auto; margin-bottom: 10px; }
.upload-item .fake-control button { margin-right: 0; margin-left: 0; }
@media only screen and (max-width: 700px) { .upload-item .fake-control { margin-right: 10px; }
  .upload-item .fake-control button { margin-left: 0; } }

.data-container { padding: 20px; background-color: #f2f2f2; }
@media only screen and (max-width: 700px) { .data-container { margin-bottom: 0; } }

.data-discount { padding: 20px; }
@media only screen and (max-width: 700px) { .data-discount { margin-bottom: 0; } }

.data-result-container { margin-bottom: 50px; }

.inline .box-holder { display: inline-block; }

input[type=text], input[type=date], input[type=email], input[type=password], input[type=number], input[type=search], textarea, .selectbox { display: inline-block; height: 30px; outline: none; padding: 4px; margin-bottom: 1em; width: 100%; background-color: #fff; border: 1px solid #e5e5e5; }
input[type=text]::-webkit-input-placeholder, input[type=date]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, input[type=number]::-webkit-input-placeholder, input[type=search]::-webkit-input-placeholder, textarea::-webkit-input-placeholder, .selectbox::-webkit-input-placeholder { color: #7a8394; font-style: italic; }
input[type=text]::-moz-placeholder, input[type=date]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder, input[type=number]::-moz-placeholder, input[type=search]::-moz-placeholder, textarea::-moz-placeholder, .selectbox::-moz-placeholder { color: #7a8394; font-style: italic; }
input[type=text]:-ms-input-placeholder, input[type=date]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, input[type=number]:-ms-input-placeholder, input[type=search]:-ms-input-placeholder, textarea:-ms-input-placeholder, .selectbox:-ms-input-placeholder { color: #7a8394; font-style: italic; }
input[type=text]::placeholder, input[type=date]::placeholder, input[type=email]::placeholder, input[type=password]::placeholder, input[type=number]::placeholder, input[type=search]::placeholder, textarea::placeholder, .selectbox::placeholder { color: #7a8394; font-style: italic; }

body textarea { height: auto; }

input::-moz-placeholder { font-style: italic; }

input[type=text], input[type=date], input[type=email], input[type=password], input[type=number], .selectbox { padding: 4px 10px; }

input:focus, textarea:focus, .selectbox:focus { color: #21314d; outline: none; background-color: #fff; border-color: #7a8394; }
input:focus.ng-valid.ng-dirty, textarea:focus.ng-valid.ng-dirty, .selectbox:focus.ng-valid.ng-dirty { border-color: #75b03c; }
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder, .selectbox:focus::-webkit-input-placeholder { color: transparent; }
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder, .selectbox:focus::-moz-placeholder { color: transparent; }
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder, .selectbox:focus:-ms-input-placeholder { color: transparent; }
input:focus::placeholder, textarea:focus::placeholder, .selectbox:focus::placeholder { color: transparent; }

input.ng-valid.is-visited, input.ng-valid.ng-dirty { border-color: #9dc95d; }

.box-holder { position: relative; }
.box-holder label { cursor: pointer; font-weight: normal; line-height: 1.8; padding-left: 25px; width: auto; }
.box-holder label.checkbox-longlabel { line-height: 1.4; }
.box-holder label.inactive { background: none; }
.box-holder input { float: left; line-height: 1.8; margin-left: -24px; }

.is-invalid input[type=text], .is-invalid input[type=search], .is-invalid input[type=email], .is-invalid input[type=password], .is-invalid textarea, .is-invalid .selectbox { background-color: #ffebe1; border-color: #df002e; -webkit-box-shadow: none; box-shadow: none; color: #df002e; }
.is-invalid .inactive, .is-invalid .inactive:before { background-color: transparent; border-color: #e5e5e5; }

.inactive, .inactive:before { background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-size: 5px 5px; -webkit-box-shadow: none; box-shadow: none; color: #7a8394; }
.inactive::-webkit-input-placeholder, .inactive:before::-webkit-input-placeholder { font-style: normal; }
.inactive::-moz-placeholder, .inactive:before::-moz-placeholder { font-style: normal; }
.inactive:-ms-input-placeholder, .inactive:before:-ms-input-placeholder { font-style: normal; }
.inactive::placeholder, .inactive:before::placeholder { font-style: normal; }

.box-holder { display: block; }

.inactive, .inactive:hover { cursor: not-allowed; }

.bg-green input:focus, .bg-green textarea:focus { border-color: #21314d; }
.bg-green .inactive, .bg-green .inactive:before { background-image: -webkit-linear-gradient(315deg, #b5d785 20%, transparent 20%, transparent 52%, #b5d785 52%, #b5d785 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #b5d785 20%, transparent 20%, transparent 52%, #b5d785 52%, #b5d785 75%, transparent 75%, transparent); background-size: 5px 5px; background-color: #84bc34; border-color: #75b03c; color: #66a543; }

.bg-blue input, .bg-blue select, .bg-blue textarea { color: #21314d; }
.bg-blue .multiple { color: #21314d; }
.bg-blue .inactive, .bg-blue .inactive:before { background-image: -webkit-linear-gradient(315deg, #4d5a71 20%, transparent 20%, transparent 52%, #4d5a71 52%, #4d5a71 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #4d5a71 20%, transparent 20%, transparent 52%, #4d5a71 52%, #4d5a71 75%, transparent 75%, transparent); background-size: 5px 5px; border-color: #4d5a71; }

/** fix for iOS device zoom */
.ios input, .ios select, .ios textarea { font-size: 16px; }

hr.with-arrow { position: relative; position: relative; }
hr.with-arrow:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #fff transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; }
hr.with-arrow:before { z-index: 1; }
hr.with-arrow:after { display: block; height: 0; left: 50%; position: absolute; margin-left: -9px; right: 0; top: 100%; width: 0; border-style: solid; border-color: rgba(211, 214, 219, 0.1) transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; }
hr.with-arrow:before { top: -1px; }
hr.with-arrow:after { top: 0px; margin-left: -10px; border-color: #d3d6db transparent transparent; }

.search-result-count { position: relative; padding: 11px; color: #fff; background: #21314d; text-align: center; }
.search-result-count:after { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 6px 6px 6px 0; border-color: transparent #21314d transparent transparent; position: absolute; left: -6px; margin-top: -6px; top: 50%; z-index: 3; }

.btn[disabled], .btn.inactive, .vendor-list li.is-disabled { background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, #fff 20%, #fff 52%, #e5e5e5 52%, #e5e5e5 75%, #fff 75%, #fff); background-image: linear-gradient(135deg, #e5e5e5 20%, #fff 20%, #fff 52%, #e5e5e5 52%, #e5e5e5 75%, #fff 75%, #fff); background-size: 5px 5px; background-color: transparent; border: 1px solid #e5e5e5; -webkit-box-shadow: none; box-shadow: none; color: #7a8394; cursor: not-allowed; pointer-events: none; }
.btn[disabled]:hover, .btn.inactive:hover, .vendor-list li.is-disabled:hover { background-color: transparent; color: #7a8394; }
.btn-icon.btn[disabled]:before, .btn-icon.btn.inactive:before, .vendor-list li.btn-icon.is-disabled:before { background: none; }

.btn { display: inline-block; font-weight: 700; margin: 0 30px 0 0; min-width: 110px; padding: 5px 20px; text-align: center; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); background-color: #84bc34; border: none; color: #21314d; }
@media only screen and (max-width: 700px) { .btn { height: 40px; line-height: 3rem; margin: 10px 0; width: 100%; } }
.btn:hover, .btn:hover input { cursor: pointer; text-decoration: none; background-color: #b5d785; -webkit-box-shadow: none; box-shadow: none; }

.btn[disabled]:hover, .btn.inactive:hover { cursor: not-allowed; }

.btn-blue { background-color: #21314d; color: #fff; }
.btn-blue:hover, .btn-blue:hover input { background-color: #7a8394; }

.bg-blue .btn-blue { background-color: #4d5a71; }
.bg-blue .btn-blue:hover { background-color: #a6adb8; }
.bg-blue .btn[disabled], .bg-blue .btn.inactive { background-image: -webkit-linear-gradient(315deg, #4d5a71 20%, transparent 20%, transparent 52%, #4d5a71 52%, #4d5a71 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #4d5a71 20%, transparent 20%, transparent 52%, #4d5a71 52%, #4d5a71 75%, transparent 75%, transparent); background-size: 5px 5px; border-color: #4d5a71; color: #a6adb8; }

.bg-green .btn[disabled], .bg-green .btn.inactive { background-image: -webkit-linear-gradient(315deg, #b5d785 20%, transparent 20%, transparent 52%, #b5d785 52%, #b5d785 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #b5d785 20%, transparent 20%, transparent 52%, #b5d785 52%, #b5d785 75%, transparent 75%, transparent); background-size: 5px 5px; border-color: #b5d785; color: #66a543; }

.btn-second { background-color: #cccccc; }
.btn-second:hover, .btn-second:hover input { background-color: #e5e5e5; }

.btn-second-blue { background-color: #4d5a71; color: #fff; }
.btn-second-blue:hover, .btn-second-blue:hover input { background-color: #a6adb8; }

.btn-transparency { background-color: rgba(255, 255, 255, 0.8); }
.btn-transparency:hover, .btn-transparency:hover input { background-color: rgba(33, 49, 77, 0.8); color: #fff; }

.btn-red { background-color: #df002e; color: #fff; }
.btn-red:hover, .btn-red:hover input { background-color: #ff674b; }

.btn-big { padding: 15px 20px; min-width: 170px; }
@media only screen and (max-width: 700px) { .btn-big { height: 40px; line-height: 3rem; padding: 5px 20px; } }

.btn-block { display: block; margin: 5px 0; padding-left: 5px; padding-right: 5px; min-width: 0; width: 100%; }

.btn-right { float: right; margin-right: 0; }

.btn-icon:before { padding-right: 5px; vertical-align: top; }
@media only screen and (max-width: 700px) { .btn-icon:before { vertical-align: middle; } }
.btn-icon.btn-block.btn { text-align: left; padding-left: 40px; position: relative; }
.btn-icon.btn-block.btn:before { position: absolute; left: 10px; }

label.btn { float: none; margin: 10px 0; width: auto; }
label.btn span { padding-left: 0.5em; }
label.btn.is-checked { background-color: #21314d; }
label.btn.is-checked span { color: #fff; }
label.btn.is-checked[disabled] { background-color: inherit; }
label.btn.is-checked[disabled] span { color: #7a8394; }

.dropdown { display: inline-block; margin-bottom: 20px; margin-right: 20px; min-height: 30px; text-align: left; position: relative; }
@media only screen and (max-width: 700px) { .dropdown { width: 100%; } }
.dropdown .btn-blue + ul, .dropdown .btn-second + ul, .dropdown .btn-second-blue + ul { background-color: #fff; }
.no-touch .dropdown:focus .btn, .no-touch .dropdown:hover .btn, .dropdown.is-touched-hover .btn { background-color: #b5d785; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.no-touch .dropdown:focus .btn[disabled], .no-touch .dropdown:focus .btn.inactive, .no-touch .dropdown:hover .btn[disabled], .no-touch .dropdown:hover .btn.inactive, .dropdown.is-touched-hover .btn[disabled], .dropdown.is-touched-hover .btn.inactive { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; color: #7a8394; }
.no-touch .dropdown:focus .btn-blue, .no-touch .dropdown:hover .btn-blue, .dropdown.is-touched-hover .btn-blue { background-color: #7a8394; }
.no-touch .dropdown:focus .btn-blue + ul li:hover, .no-touch .dropdown:hover .btn-blue + ul li:hover, .dropdown.is-touched-hover .btn-blue + ul li:hover { background-color: #d3d6db; }
.no-touch .dropdown:focus .btn-second, .no-touch .dropdown:hover .btn-second, .dropdown.is-touched-hover .btn-second { background-color: #e5e5e5; }
.no-touch .dropdown:focus .btn-second + ul li:hover, .no-touch .dropdown:hover .btn-second + ul li:hover, .dropdown.is-touched-hover .btn-second + ul li:hover { background-color: #f2f2f2; }
.no-touch .dropdown:focus .btn-second-blue, .no-touch .dropdown:hover .btn-second-blue, .dropdown.is-touched-hover .btn-second-blue { background-color: #7a8394; }
.no-touch .dropdown:focus .btn-second-blue + ul li:hover, .no-touch .dropdown:hover .btn-second-blue + ul li:hover, .dropdown.is-touched-hover .btn-second-blue + ul li:hover { background-color: #d3d6db; }
.no-touch .dropdown:focus .btn-red, .no-touch .dropdown:hover .btn-red, .dropdown.is-touched-hover .btn-red { background-color: #ff674b; }
.no-touch .dropdown:focus .btn-red + ul li:hover, .no-touch .dropdown:hover .btn-red + ul li:hover, .dropdown.is-touched-hover .btn-red + ul li:hover { background-color: #f2f2f2; }
.no-touch .dropdown:focus .inner-span:after, .no-touch .dropdown:hover .inner-span:after, .dropdown.is-touched-hover .inner-span:after { content: '\e7c5'; }
.no-touch .dropdown:focus .dropdown-holder, .no-touch .dropdown:hover .dropdown-holder, .dropdown.is-touched-hover .dropdown-holder { height: auto; min-height: 1em; opacity: 1; }
.no-touch .dropdown:focus .dropdown-holder li:hover, .no-touch .dropdown:hover .dropdown-holder li:hover, .dropdown.is-touched-hover .dropdown-holder li:hover { background-color: #e6f2d6; }
.no-touch .dropdown:focus .dropdown-holder li:hover.text, .no-touch .dropdown:hover .dropdown-holder li:hover.text, .dropdown.is-touched-hover .dropdown-holder li:hover.text { background-color: inherit; }

.dropdown.disabled .inner-span { color: #7a8394; cursor: not-allowed; }
.dropdown.disabled .inner-span:after { content: '\e7c5'; }
.dropdown.disabled:hover .dropdown-holder, .dropdown.disabled:focus .dropdown-holder { visibility: none; opacity: 0; }

.bg-green .dropdown.disabled .inner-span { color: #66a543; }

.inner-span { margin: 0; min-width: 140px; width: 100%; padding-right: 50px; text-align: left; }
@media only screen and (max-width: 700px) { .inner-span { margin-top: 0; } }
.inner-span:after { float: right; font-family: "icons"; content: '\e7c4'; line-height: 1.4; margin-right: -30px; padding-left: 10px; }
@media only screen and (max-width: 700px) { .inner-span:after { line-height: 3rem; } }
.inner-span:hover { -webkit-box-shadow: none; box-shadow: none; }

.dropdown-holder { margin-left: 0; margin-top: 0; padding: 0; -webkit-transition: opacity 0.2s linear 0.1s; transition: opacity 0.2s linear 0.1s; width: 100%; height: 0; position: absolute; background-color: #fff; -webkit-box-shadow: 1px 3px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 3px 5px 1px rgba(0, 0, 0, 0.15); list-style: none; opacity: 0; overflow: hidden; z-index: 10; }
@media only screen and (max-width: 700px) { .dropdown-holder { left: 0; } }
.dropdown-holder li { padding: 5px 20px 5px 40px; position: relative; }
.dropdown-holder li.text { color: #7a8394; padding-left: 20px; }
.dropdown-holder li.text a:before { content: normal; }
.dropdown-holder li.is-disabled a { color: #a6adb8; cursor: not-allowed; pointer-events: none; }
.dropdown-holder li * { color: #21314d; display: inline-block; width: 100%; }
.dropdown-holder li *:hover { text-decoration: none; }
.dropdown-holder li *:before { font-family: "icons"; font-size: 1.4em; line-height: 1.4em; content: '\e658'; margin-left: -20px; margin-right: 0.5em; position: absolute; top: 1px; }

.btn-small { display: inline-block; height: 30px; line-height: 30px; margin-left: 10px; margin-right: 0; min-width: 30px; padding: 0; position: relative; width: auto; vertical-align: top; z-index: 0; }
@media only screen and (max-width: 700px) { .btn-small { height: 40px; line-height: 40px; min-width: 40px; } }
.btn-small:before { margin-left: 9px; position: absolute; font-family: "icons"; color: #21314d; content: '\e7c6'; }
@media only screen and (max-width: 700px) { .btn-small:before { margin-top: 0; margin-left: 13px; } }
.btn-small.btn-blue:before, .btn-small.btn-second-blue:before, .btn-small.btn-red:before { color: #fff; }
.btn-small input { cursor: pointer; height: 30px; margin-right: 0; margin-bottom: 0; min-width: 30px; padding: 5px 0; position: relative; width: 30px; z-index: 0; background: transparent; }
@media only screen and (max-width: 700px) { .btn-small input { height: 40px; min-width: 40px; } }
.btn-small input:focus, .btn-small input:hover { background: transparent; }
.btn-small input.btn, .btn-small input.btn-second:hover { background: transparent; }
@media only screen and (max-width: 700px) { .btn-small input.btn, .btn-small input.btn-second:hover { margin: 0; } }
.btn-small.inactive:before { background: none; }

.btn-small[data-icon]:before { color: #fff; content: attr(data-icon); line-height: 30px; }
@media only screen and (max-width: 700px) { .btn-small[data-icon]:before { text-align: center; } }

.btn.btn-vertically { height: 7.2rem; margin-right: 0; min-width: 30px; padding: 0; width: 30px; }
.btn.btn-vertically:before { line-height: 72px; margin: 0; }

.more-information { margin: 20px 0 0; position: relative; }
.more-information.open:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; z-index: 4; }
.more-information:hover:before { border-color: #7a8394 transparent transparent; }
.more-information.btn-blue:before { border-color: #21314d transparent transparent; }
.more-information.btn-blue:hover:before { border-color: #7a8394 transparent transparent; }
.more-information.btn-second:before { border-color: #cccccc transparent transparent; }
.more-information.btn-second:hover:before { border-color: #e5e5e5 transparent transparent; }
.more-information.btn-second-blue:before { border-color: #4d5a71 transparent transparent; }
.more-information.btn-second-blue:hover:before { border-color: #a6adb8 transparent transparent; }
.more-information.btn-red:before { border-color: #df002e transparent transparent; }
.more-information.btn-red:hover:before { border-color: #ff674b transparent transparent; }

.more-information-content { margin: 0 0 60px; padding: 0; height: 0; overflow: hidden; }
.more-information-content.is-visible { height: 100%; padding: 20px 10px 10px; }
.more-information-content .more-information-close { margin: 20px 0; }

.btn-overflow { position: relative; position: absolute; width: 100%; left: 0; top: 100%; margin: 10px 0 0; padding: 5px; }
.btn-overflow:before { display: block; height: 0; left: 50%; position: relative; margin-left: -20px; right: 0; top: -20px; width: 0; border-style: solid; border-color: transparent transparent #84bc34; border-width: 0 20px 20px; content: ''; cursor: pointer; }
.btn-overflow:before { position: absolute; }
.btn-overflow:hover:before { border-color: transparent transparent #b5d785; }
.btn-overflow.btn-blue:before { border-color: transparent transparent #21314d; }
.btn-overflow.btn-blue:hover:before { border-color: transparent transparent #7a8394; }
.btn-overflow.btn-second:before { border-color: transparent transparent #cccccc; }
.btn-overflow.btn-second:hover:before { border-color: transparent transparent #e5e5e5; }
.btn-overflow.btn-second-blue:before { border-color: transparent transparent #4d5a71; }
.btn-overflow.btn-second-blue:hover:before { border-color: transparent transparent #a6adb8; }
.btn-overflow.btn-red:before { border-color: transparent transparent #df002e; }
.btn-overflow.btn-red:hover:before { border-color: transparent transparent #ff674b; }
.btn-overflow.btn-white { background-color: #fff; }
.btn-overflow.btn-white:before { border-color: transparent transparent #fff; }

.btn[disabled], .btn.inactive, .vendor-list li.is-disabled { background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, #fff 20%, #fff 52%, #e5e5e5 52%, #e5e5e5 75%, #fff 75%, #fff); background-image: linear-gradient(135deg, #e5e5e5 20%, #fff 20%, #fff 52%, #e5e5e5 52%, #e5e5e5 75%, #fff 75%, #fff); background-size: 5px 5px; background-color: transparent; border: 1px solid #e5e5e5; -webkit-box-shadow: none; box-shadow: none; color: #7a8394; cursor: not-allowed; pointer-events: none; }
.btn[disabled]:hover, .btn.inactive:hover, .vendor-list li.is-disabled:hover { background-color: transparent; color: #7a8394; }
.btn-icon.btn[disabled]:before, .btn-icon.btn.inactive:before, .vendor-list li.btn-icon.is-disabled:before { background: none; }

.btn-bold { padding: 5px 20px; font-size: 16px; font-weight: bold; }

.tabs { display: block; margin-bottom: 40px; min-height: 30px; position: relative; text-align: left; }
.tabs { -webkit-transition: all .15s; transition: all .15s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 0; visibility: hidden; }
.tabs.is-inited { opacity: 1; visibility: visible; }

.bg-green .tabs ul { border-bottom: 1px solid #9dc95d; }
.bg-green .tabs ul li { background-color: #9dc95d; }
.bg-green .tabs ul li.is-active { position: relative; background-color: #21314d; color: #21314d; }
.bg-green .tabs ul li.is-active:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -8px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 8px 0; content: ''; cursor: pointer; }
.bg-green .tabs ul li.is-active:after { position: absolute; }
.bg-green .tabs ul li.is-active a, .bg-green .tabs ul li.is-active .content { color: #f2f2f2; }
.bg-green .tabs ul.dropdown:hover li:hover, .bg-green .tabs ul.dropdown:hover li:active { background-color: #cee4ae; }
.bg-green .tabs ul.dropdown:hover li:hover.is-active:hover, .bg-green .tabs ul.dropdown:hover li:hover.is-active:active, .bg-green .tabs ul.dropdown:hover li:active.is-active:hover, .bg-green .tabs ul.dropdown:hover li:active.is-active:active { background-color: #21314d; color: #fff; }
.bg-green .tabs ul.dropdown:hover li:hover.is-active:hover a, .bg-green .tabs ul.dropdown:hover li:hover.is-active:hover .content, .bg-green .tabs ul.dropdown:hover li:hover.is-active:active a, .bg-green .tabs ul.dropdown:hover li:hover.is-active:active .content, .bg-green .tabs ul.dropdown:hover li:active.is-active:hover a, .bg-green .tabs ul.dropdown:hover li:active.is-active:hover .content, .bg-green .tabs ul.dropdown:hover li:active.is-active:active a, .bg-green .tabs ul.dropdown:hover li:active.is-active:active .content { color: #fff; }

.bg-blue .tabs ul { border-bottom: 1px solid #4d5a71; }
.bg-blue .tabs ul li { background-color: #4d5a71; }
.bg-blue .tabs ul li a, .bg-blue .tabs ul li .content { color: #fff; }
.bg-blue .tabs ul li.is-active { position: relative; background-color: #84bc34; }
.bg-blue .tabs ul li.is-active:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -8px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #84bc34 transparent transparent; border-width: 10px 8px 0; content: ''; cursor: pointer; }
.bg-blue .tabs ul li.is-active:after { position: absolute; }
.bg-blue .tabs ul li.is-active a, .bg-blue .tabs ul li.is-active .content { color: #fff; }
.bg-blue .tabs ul.dropdown:hover li:hover, .bg-blue .tabs ul.dropdown:hover li:active { background-color: #a6adb8; }
.bg-blue .tabs ul.dropdown:hover li:hover.is-active:hover, .bg-blue .tabs ul.dropdown:hover li:hover.is-active:active, .bg-blue .tabs ul.dropdown:hover li:active.is-active:hover, .bg-blue .tabs ul.dropdown:hover li:active.is-active:active { background-color: #84bc34; color: #fff; }
.bg-blue .tabs ul.dropdown:hover li:hover.is-active:hover a, .bg-blue .tabs ul.dropdown:hover li:hover.is-active:hover .content, .bg-blue .tabs ul.dropdown:hover li:hover.is-active:active a, .bg-blue .tabs ul.dropdown:hover li:hover.is-active:active .content, .bg-blue .tabs ul.dropdown:hover li:active.is-active:hover a, .bg-blue .tabs ul.dropdown:hover li:active.is-active:hover .content, .bg-blue .tabs ul.dropdown:hover li:active.is-active:active a, .bg-blue .tabs ul.dropdown:hover li:active.is-active:active .content { color: #21314d; }

.tabs ul { display: block; width: 100%; height: auto; margin: 0; padding: 0; position: relative; border-bottom: 1px solid rgba(0, 0, 0, 0.15); text-align: center; z-index: 1; }
.tabs ul li { display: inline-block; list-style: none; margin-left: .25em; background-color: #84bc34; font-weight: 700; z-index: 1; }
.tabs ul li:first-child { margin-left: 0; }
.tabs ul li a { color: #21314d; display: block; padding: 10px 25px; width: 100%; text-align: center; text-decoration: none; }
.tabs ul li.is-active { position: relative; background-color: #21314d; font-weight: 700; }
.tabs ul li.is-active:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -8px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 8px 0; content: ''; cursor: pointer; }
.tabs ul li.is-active:after { position: absolute; }
.tabs ul li.is-active a, .tabs ul li.is-active .content * { color: #fff; }
.tabs ul.dropdown:hover li:hover, .tabs ul.dropdown:hover li:active { background-color: #b5d785; }
.tabs ul.dropdown:hover li:hover.is-active:hover, .tabs ul.dropdown:hover li:hover.is-active:active, .tabs ul.dropdown:hover li:active.is-active:hover, .tabs ul.dropdown:hover li:active.is-active:active { background-color: #21314d; }
.tabs ul.is-visible { display: table; height: 100%; }

.tabs.highlights ul { display: table; border-collapse: separate; border-spacing: 10px 0; width: 100%; }
.tabs.highlights ul li { display: table-cell; position: relative; text-align: left; }
.tabs.highlights ul li.is-active .content:before { color: #fff; }
.tabs.highlights ul li a { height: 100%; margin: -25px 0 0 -50px; position: absolute; width: 100%; }
.tabs.highlights ul .content { margin: 25px; padding-left: 25px; }
.tabs.highlights ul h2 { text-align: left; }

.tabs.tabs-big li { position: relative; text-align: left; padding: 20px; }
.tabs.tabs-big li.is-active .content:before { color: #fff; }
.tabs.tabs-big .content { padding-left: 20px; }
.tabs.tabs-big .content a { left: 0; right: 0; bottom: 0; top: 0; margin: -20px -40px -20px -20px; position: absolute; }
.tabs.tabs-big .content h2 { text-align: left; margin: 0 0 0 20px; }
.tabs.tabs-big .content .text { text-align: left; font-weight: normal; }
.tabs.tabs-big .content.content-devices:before { content: '\a004'; font-size: 6.5rem; top: -32px; }
.tabs.tabs-big .content.content-tarifs:before { content: '\a030'; font-size: 6.5rem; top: -32px; }

.tabs .content { position: relative; }
.tabs .content h2, .tabs .content .text { margin: 0 0 0 40px; }
.tabs .content .text { display: inline-block; font-weight: normal; }
.tabs .content:before { position: absolute; content: '\a021'; font-family: "icons"; font-size: 2.143rem; left: 0; top: 0; }

.tabs.tabs-big .content:before, .tabs.highlights .content:before { font-size: 8rem; font-weight: normal; left: -20px; top: -20px; }
@media only screen and (max-width: 700px) { .tabs.tabs-big .content:before, .tabs.highlights .content:before { content: none; } }

.tabs.tabs-big.tabs-asDropdown .content-devices::before, .tabs.tabs-big.tabs-asDropdown .content-tarifs::before { content: none; }

.tabs-asDropdown { margin: 0 0 20px; min-height: 40px; z-index: 4; }

.bg-green .tabs-asDropdown ul { border: none; }
.bg-green .tabs-asDropdown ul li { background-color: #fff; color: #21314d; }
.bg-green .tabs-asDropdown ul li.is-active { background-color: #9dc95d; }
.bg-green .tabs-asDropdown ul li.is-active a, .bg-green .tabs-asDropdown ul li.is-active .content { color: #21314d; }
.bg-green .tabs-asDropdown ul li.is-active.is-open { background-color: #21314d; color: #fff; }
.bg-green .tabs-asDropdown ul li.is-active.is-open a, .bg-green .tabs-asDropdown ul li.is-active.is-open .content { color: #fff; }
.bg-green .tabs-asDropdown ul li.is-active:before { content: normal; }
.bg-green .tabs-asDropdown ul.dropdown:hover li:hover, .bg-green .tabs-asDropdown ul.dropdown:hover li:active { background-color: #d3d6db; }

.bg-blue .tabs-asDropdown ul { border: none; }
.bg-blue .tabs-asDropdown ul li { background-color: #fff; }
.bg-blue .tabs-asDropdown ul li a, .bg-blue .tabs-asDropdown ul li .content { color: #21314d; }
.bg-blue .tabs-asDropdown ul li.is-active { background-color: #4d5a71; }
.bg-blue .tabs-asDropdown ul li.is-active.is-open { background-color: #84bc34; color: #21314d; }
.bg-blue .tabs-asDropdown ul li.is-active.is-open a, .bg-blue .tabs-asDropdown ul li.is-active.is-open .content { color: #21314d; }
.bg-blue .tabs-asDropdown ul li.is-active:before { content: normal; }
.bg-blue .tabs-asDropdown ul.dropdown:hover li:hover, .bg-blue .tabs-asDropdown ul.dropdown:hover li:active { background-color: #e6f2d6; }

.tabs-asDropdown ul { position: absolute; background-color: #fff; border: 1px solid #e5e5e5; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.tabs-asDropdown ul li { display: block; margin: 0; opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; background-color: #fff; font-weight: normal; }
.tabs-asDropdown ul li.is-visible { opacity: 1; visibility: visible; height: 100%; z-index: 1; }
.tabs-asDropdown ul li a { padding: 10px; text-align: left; }
.tabs-asDropdown ul li.is-active { opacity: 1; visibility: visible; height: 100%; z-index: 1; background-color: #e5e5e5; }
.tabs-asDropdown ul li.is-active.is-open { background-color: #84bc34; }
.tabs-asDropdown ul li.is-active:before { content: normal; }
.tabs-asDropdown ul li.is-active a { color: #21314d; display: block; width: 100%; }
.tabs-asDropdown ul li.is-active .arrow { height: 100%; position: absolute; right: 0; top: 0; text-align: right; width: 100%; z-index: 5; cursor: pointer; }
.tabs-asDropdown ul li.is-active .arrow:before { font-family: "icons"; right: 10px; position: absolute; bottom: 10px; content: '\e7c4'; }
.tabs-asDropdown ul li.is-active .arrow.up:before { content: '\e7c5'; }
.tabs-asDropdown ul li.is-active .content * { color: #21314d; }
.tabs-asDropdown ul.dropdown:hover li:hover, .tabs-asDropdown ul.dropdown:hover li:active { background-color: #e6f2d6; }
.tabs-asDropdown ul.dropdown:hover li:hover.is-active:hover, .tabs-asDropdown ul.dropdown:hover li:hover.is-active:active, .tabs-asDropdown ul.dropdown:hover li:active.is-active:hover, .tabs-asDropdown ul.dropdown:hover li:active.is-active:active { background-color: #84bc34; }

.tabs-asDropdown.highlights ul, .tabs-asDropdown.tabs-big ul { position: absolute; border-spacing: inherit; }
.tabs-asDropdown.highlights ul li, .tabs-asDropdown.tabs-big ul li { display: block; padding: 0 0 0 10px; width: 100%; }
.tabs-asDropdown.highlights ul li.is-active, .tabs-asDropdown.tabs-big ul li.is-active { display: block; }
.tabs-asDropdown.highlights ul li a, .tabs-asDropdown.tabs-big ul li a { margin: 0 0 0 -35px !important; }
.tabs-asDropdown.highlights ul .content, .tabs-asDropdown.tabs-big ul .content { margin: 0; }
.tabs-asDropdown.highlights ul .content:before, .tabs-asDropdown.tabs-big ul .content:before { margin-top: 5px; }
.tabs-asDropdown.highlights ul .content .text, .tabs-asDropdown.tabs-big ul .content .text { display: none; }
.tabs-asDropdown.highlights ul h2, .tabs-asDropdown.tabs-big ul h2 { display: inline-block; padding: 10px 0; width: 85%; }
.tabs-asDropdown.highlights ul h2, .tabs-asDropdown.highlights ul .text, .tabs-asDropdown.tabs-big ul h2, .tabs-asDropdown.tabs-big ul .text { margin-left: 10px; }

.tabs-asDropdown.tabs-big .content:before { left: auto; top: auto; margin: 12px 0 0 -25px; }

.tabs.tabs-icons li { vertical-align: bottom; }
.tabs.tabs-icons li .content { padding: 10px 25px 0 10px; min-height: 5.8rem; cursor: pointer; }
.tabs.tabs-icons li .content::before { position: absolute; content: attr(data-icon); font-size: 4.5rem; top: 7px; left: 5px; }
@media only screen and (max-width: 700px) { .tabs.tabs-icons li .content::before { color: #21314d; } }
.tabs.tabs-icons li .content h2 { display: table-cell; vertical-align: middle; font-size: 1.6rem; height: 4rem; padding-left: 40px; }
@media only screen and (max-width: 700px) { .tabs.tabs-icons li .content { min-height: 28px; } }
.tabs.tabs-icons li.is-active .content::before { color: #d3d6db; }
.tabs.tabs-icons.tabs-asDropdown li.is-active .content::before { color: #21314d; }

.tabs.plain:not(.tabs-asDropdown) ul { border-bottom: none; }
.tabs.plain:not(.tabs-asDropdown) ul li, .tabs.plain:not(.tabs-asDropdown) ul li.is-active { background-color: transparent; }
.tabs.plain:not(.tabs-asDropdown) ul li a, .tabs.plain:not(.tabs-asDropdown) ul li.is-active a { padding: 10px; color: #21314d; text-transform: uppercase; }
.tabs.plain:not(.tabs-asDropdown) ul li.is-active:before { content: normal; }
.tabs.plain:not(.tabs-asDropdown) ul.dropdown:hover li:hover, .tabs.plain:not(.tabs-asDropdown) ul.dropdown:hover li:active { background-color: transparent; }
.tabs.plain:not(.tabs-asDropdown) ul.dropdown:hover li:hover.is-active:active, .tabs.plain:not(.tabs-asDropdown) ul.dropdown:hover li:hover.is-active:hover, .tabs.plain:not(.tabs-asDropdown) ul.dropdown:hover li:active.is-active:active, .tabs.plain:not(.tabs-asDropdown) ul.dropdown:hover li:active.is-active:hover { background-color: transparent; }

.price { display: inline-block; margin-right: 20px; }
.price .price-intro { display: block; margin-bottom: 0.3em; text-align: left; white-space: nowrap; }
.price .price-value { float: left; font-family: "canada-type-gibson", sans-serif; font-size: 3.5rem; line-height: 0.75em; position: relative; }
.price .price-prefix { font-family: "Open Sans", sans-serif; font-size: 1.3rem; line-height: 0; padding-right: 0.5em; }
.price .price-euro { padding-right: 0.35em; /* nur von links */ position: relative; }
.price .price-cent { font-size: 0.5em; line-height: 0.85em; position: absolute; right: 0; top: 0; }
.price .price-currency { font-size: 0.4em; line-height: 0.85em; position: absolute; right: 0; top: 1em; }
.price .price-footnote { font-family: "Open Sans", sans-serif; line-height: 0.97rem; position: absolute; right: -1rem; top: 0; }
.price .price-footnote .footnote { display: block; vertical-align: top; }
.price .price-foot { clear: both; white-space: nowrap; }
.price.price-s .price-footnote { top: -0.6rem; right: -1.5rem; }
.price.price-m .price-value { font-size: 4.4rem; }
.price.price-m .price-footnote { top: -0.20rem; }
@media only screen and (max-width: 700px) { .price.price-m .price-value { font-size: 3.5rem; }
  .price.price-m .price-footnote { top: -0.1rem; right: -1rem; } }
.price.price-l .price-value { font-size: 6.4rem; }
.price.price-l .price-footnote { top: -0.23rem; }
@media only screen and (max-width: 1100px) { .price.price-l .price-value { font-size: 4.4rem; }
  .price.price-l .price-footnote { top: -0.20rem; } }
@media only screen and (max-width: 700px) { .price.price-l .price-value { font-size: 3.5rem; }
  .price.price-l .price-footnote { top: -0.1rem; right: -1rem; } }
.price.price-xl .price-value { font-size: 8.4rem; }
.price.price-xl .price-foot { font-size: 2.4rem; }
@media only screen and (max-width: 1100px) { .price.price-xl .price-value { font-size: 6rem; }
  .price.price-xl .price-foot { font-size: 2rem; } }
@media only screen and (max-width: 700px) { .price.price-xl .price-value { font-size: 4rem; }
  .price.price-xl .price-foot { font-size: 1.2rem; } }
.price.price-xxl .price-value { font-size: 12rem; }
.price.price-xxl .price-foot { font-size: 3rem; }
.price.price-xxl .caper-price { font-weight: bold; }
@media only screen and (max-width: 1100px) { .price.price-xxl .price-value { font-size: 8rem; }
  .price.price-xxl .price-foot { font-size: 2.4rem; } }
@media only screen and (max-width: 700px) { .price.price-xxl .price-value { font-size: 5rem; }
  .price.price-xxl .price-foot { font-size: 1.6rem; } }
.price.price-right { float: right; margin: 0 0 0 20px; text-align: right; }
.price.price-right .price-euro { position: static; }
.price.price-right .price-value { float: right; }
.price.price-right .price-intro { text-align: right; }
.price.price-block { display: block; margin: 1em 0 0; text-align: right; }
.price.price-block .price-intro { text-align: inherit; }
.price.price-block .price-value { float: none; white-space: nowrap; }
.price.price-inline { display: inline-block; }
.price.price-center { margin: 0; text-align: center; }
.price.price-center .price-intro { text-align: center; }

.caper-price { position: relative; }
.caper-price .line { display: inline-block; height: 100%; -webkit-transform: rotate(170deg); -ms-transform: rotate(170deg); transform: rotate(170deg); width: 100%; border-bottom: 1px solid #df002e; position: absolute; top: 50%; left: 2px; }

.availability { font-family: "Open Sans", sans-serif; color: #84bc34; }
.availability strong { color: #21314d; }
.availability:before { content: '\e601'; font-family: "icons"; margin-right: 0.5em; }
.availability.warning:before { content: none; }
.availability.unavailable:before { content: '\e6fd'; color: #df002e; }

.eyecatcher { display: inline-block; position: relative; color: #fff; font-family: "canada-type-gibson", sans-serif; font-size: 1.5rem; line-height: 1.2; text-align: center; vertical-align: middle; }
.eyecatcher.is-right { position: absolute; right: 220px; }
.eyecatcher > div { padding: 5px; position: relative; z-index: 1; background: #df002e; }
.eyecatcher .is-big { display: block; font-size: 1.5em; }
.eyecatcher.is-xl { font-size: 2rem; }
.eyecatcher.has-arrow:before { bottom: 1px; left: 1px; position: absolute; right: -18px; top: -18px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjEwMHB4IiBoZWlnaHQ9IjEwMHB4IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTAwIDEwMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+ICA8cG9seWdvbiBvcGFjaXR5PSIwLjgiIGZpbGw9IiNERjAwMkUiIHBvaW50cz0iNzkuODE0IDEwMCA5OS45OTMgMCAwIDE5Ljk3OSAwIDk5Ljc3NyAiLz48L3N2Zz4=); background-position: top right; background-repeat: no-repeat; background-size: cover; content: ''; }
.eyecatcher.no-border > div { border: none; }
.eyecatcher .eyecatcher-tooltip { position: absolute; left: 0; bottom: 0; z-index: 100; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.eyecatcher .eyecatcher-tooltip img { max-width: 960px; }
.eyecatcher:hover .eyecatcher-tooltip { opacity: 1; visibility: visible; }
@media only screen and (max-width: 700px) { .eyecatcher:hover .eyecatcher-tooltip { opacity: 0; visibility: hidden; } }
.eyecatcher .price { margin: 0; padding: 5px; }

.eyecatcher.is-tl:before { left: -18px; right: 1px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjEwMHB4IiBoZWlnaHQ9IjEwMHB4IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTAwIDEwMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+ICA8cG9seWdvbiBvcGFjaXR5PSIwLjgiIGZpbGw9IiNERjAwMkUiIHBvaW50cz0iMjAuMTkgMTAwIDAuMDA5IDAgMTAwIDE5Ljk3OSAxMDAgOTkuNzc3ICIvPjwvc3ZnPg==); background-position: top left; }
.eyecatcher.is-tl .eyecatcher-tooltip { left: auto; right: 0; }

.eyecatcher.no-arrow:before { display: none; }

.eyecatcher.is-br:before { bottom: -18px; top: 1px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjEwMHB4IiBoZWlnaHQ9IjEwMHB4IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTAwIDEwMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+ICA8cG9seWdvbiBvcGFjaXR5PSIwLjgiIGZpbGw9IiNERjAwMkUiIHBvaW50cz0iNzkuODE0IDAgOTkuOTkzIDEwMCAwIDgwLjAyMSAwIDAuMjIzICIvPjwvc3ZnPg==); background-position: bottom right; }
.eyecatcher.is-br .eyecatcher-tooltip { bottom: auto; top: 0; }

.eyecatcher.is-bl:before { bottom: -18px; left: -18px; right: 1px; top: 1px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJFYmVuZV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjEwMHB4IiBoZWlnaHQ9IjEwMHB4IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTAwIDEwMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+ICA8cG9seWdvbiBvcGFjaXR5PSIwLjgiIGZpbGw9IiNERjAwMkUiIHBvaW50cz0iMjAuMTgyIDAgMC4wMDUgMTAwIDEwMCA4MC4wMjEgMTAwIDAuMjIzICIvPjwvc3ZnPg==); background-position: bottom left; }
.eyecatcher.is-bl .eyecatcher-tooltip { bottom: auto; left: auto; right: 0; top: 0; }

.connect { text-align: right; }

.contact-disturber, .bookapointment-disturber, .disturber { background-color: rgba(223, 0, 46, 0.85); border-radius: 50%; height: 160px; width: 160px; position: relative; }
.contact-disturber .text-holder, .bookapointment-disturber .text-holder, .disturber .text-holder { height: 100%; overflow: hidden; padding: 30px 0 20px 20px; position: relative; }
.contact-disturber .phone-icon, .bookapointment-disturber .phone-icon, .disturber .phone-icon { left: -20px; position: absolute; top: 30px; -webkit-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); }
.contact-disturber .phone-icon:before, .bookapointment-disturber .phone-icon:before, .disturber .phone-icon:before { font-size: 80px; }
.contact-disturber h3, .bookapointment-disturber h3, .disturber h3 { font-size: 12px; margin: 0 0 5px 10px; }
.contact-disturber .hotline, .bookapointment-disturber .hotline, .disturber .hotline { font-family: "canada-type-gibson", sans-serif; font-size: 28px; line-height: 1; margin-bottom: 5px; }
.contact-disturber .hotline a, .bookapointment-disturber .hotline a, .disturber .hotline a { color: #21314d; }
.contact-disturber .hotline .second-line, .bookapointment-disturber .hotline .second-line, .disturber .hotline .second-line { display: block; text-align: right; }
.contact-disturber .times, .bookapointment-disturber .times, .disturber .times { padding-right: 20px; }
.contact-disturber .times span, .bookapointment-disturber .times span, .disturber .times span { display: block; font-family: "canada-type-gibson", sans-serif; font-size: 11px; letter-spacing: -0.5px; }

.contact-disturber.rectangle, .bookapointment-disturber.rectangle, .disturber.rectangle { -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); background-color: #df002e; border-radius: 0; height: 110px; width: 300px; -webkit-transition: height 0.3s ease 0.1s, width 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s; transition: height 0.3s ease 0.1s, width 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s; /* easeOutBack */ overflow: hidden; z-index: 9; }
@media only screen and (max-width: 700px) { .contact-disturber.rectangle, .bookapointment-disturber.rectangle, .disturber.rectangle { margin: 10px 5px; width: -webkit-calc(100% - 10px); width: calc(100% - 10px); } }
.contact-disturber.rectangle .text-holder, .bookapointment-disturber.rectangle .text-holder, .disturber.rectangle .text-holder { padding: 13px 0 0; }
.contact-disturber.rectangle .phone-icon, .bookapointment-disturber.rectangle .phone-icon, .disturber.rectangle .phone-icon { color: #fff; height: 40px; left: 0; top: 0; -webkit-transform: none; -ms-transform: none; transform: none; width: 40px; }
.contact-disturber.rectangle .phone-icon:before, .bookapointment-disturber.rectangle .phone-icon:before, .disturber.rectangle .phone-icon:before { font-size: 20px; text-shadow: none; position: absolute; top: 25%; left: 25%; }
.contact-disturber.rectangle h3, .bookapointment-disturber.rectangle h3, .disturber.rectangle h3 { color: #fff; font-size: 16px; margin: 0 0 10px 35px; opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; }
.contact-disturber.rectangle .hotline-holder, .bookapointment-disturber.rectangle .hotline-holder, .disturber.rectangle .hotline-holder { height: 70px; padding: 10px; position: relative; }
.contact-disturber.rectangle .hotline, .bookapointment-disturber.rectangle .hotline, .disturber.rectangle .hotline { font-family: "canada-type-gibson", sans-serif; }
.contact-disturber.rectangle .times span, .bookapointment-disturber.rectangle .times span, .disturber.rectangle .times span { font-family: "Open Sans", sans-serif; }
.contact-disturber.rectangle .close, .contact-disturber.rectangle .close-phone, .bookapointment-disturber.rectangle .close, .bookapointment-disturber.rectangle .close-phone, .disturber.rectangle .close, .disturber.rectangle .close-phone { cursor: pointer; display: none; position: absolute; right: 5px; top: 12px; }
.contact-disturber.rectangle .close:before, .contact-disturber.rectangle .close-phone:before, .bookapointment-disturber.rectangle .close:before, .bookapointment-disturber.rectangle .close-phone:before, .disturber.rectangle .close:before, .disturber.rectangle .close-phone:before { opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; }
@media only screen and (max-width: 700px) { .contact-disturber.rectangle .close-phone, .bookapointment-disturber.rectangle .close-phone, .disturber.rectangle .close-phone { display: block; } }
.contact-disturber.rectangle.closed, .bookapointment-disturber.rectangle.closed, .disturber.rectangle.closed { height: 40px; width: 40px; }
.contact-disturber.rectangle.closed h3, .bookapointment-disturber.rectangle.closed h3, .disturber.rectangle.closed h3 { opacity: 0; visibility: hidden; }
.contact-disturber.rectangle.closed .close, .bookapointment-disturber.rectangle.closed .close, .disturber.rectangle.closed .close { height: 100%; width: 100%; top: 0; right: 0; }
.contact-disturber.rectangle.closed .close:before, .bookapointment-disturber.rectangle.closed .close:before, .disturber.rectangle.closed .close:before { opacity: 0; visibility: hidden; }
@media only screen and (min-width: 701px) and (max-width: 1100px) { .contact-disturber.rectangle, .bookapointment-disturber.rectangle, .disturber.rectangle { width: 230px; }
  .contact-disturber.rectangle h3, .bookapointment-disturber.rectangle h3, .disturber.rectangle h3 { font-size: 15px; }
  .contact-disturber.rectangle .hotline, .bookapointment-disturber.rectangle .hotline, .disturber.rectangle .hotline { font-size: 24px; word-spacing: -.15em; } }

.contact-disturber.sticky, .bookapointment-disturber.sticky { position: fixed; top: 150px; right: 0; z-index: 10; }
.contact-disturber.sticky .close, .bookapointment-disturber.sticky .close { display: block; }

#stoererHolder { position: fixed; top: 150px; right: 0; z-index: 10; /*#trigger-mobile-phone { height: 40px; width: 40px; margin:0;
}*/ }
#stoererHolder .contact-disturber.sticky, #stoererHolder .bookapointment-disturber.sticky, #stoererHolder .disturber.rectangle { cursor: pointer; position: relative; top: auto; margin-bottom: 5px; float: right; }
#stoererHolder .contact-disturber.sticky:after, #stoererHolder .bookapointment-disturber.sticky:after, #stoererHolder .disturber.rectangle:after { clear: both; }
#stoererHolder hr { clear: both; margin: 0; border: none; width: 100%; height: 0; color: transparent; padding: 0; }
@media only screen and (max-width: 700px) { #stoererHolder { bottom: 0; top: auto; background-color: #df002e; width: 100%; /*jason*/ }
  #stoererHolder hr { width: 0; clear: none; }
  #stoererHolder .contact-disturber.sticky, #stoererHolder .bookapointment-disturber.sticky, #stoererHolder #trigger-mobile-phone, #stoererHolder .disturber.rectangle { margin: 0; float: left; border-left: 1px solid #ffffff; height: 40px; margin: 0; }
  #stoererHolder .trigger-mobile-phone { padding: 20px 20px 10px 20px; position: relative; }
  #stoererHolder .trigger-mobile-phone h3 { font-size: 16px; margin-bottom: 13px; }
  #stoererHolder .trigger-mobile-phone .hotline { font-size: 28px; font-family: "qtype-light",Helvetica,Arial,sans-serif; line-height: 28px; }
  #stoererHolder .trigger-mobile-phone .close { cursor: pointer; position: absolute; right: 20px; top: 20px; z-index: 4; }
  #stoererHolder .elements1 { width: 100%; }
  #stoererHolder .elements2 { width: 50%; }
  #stoererHolder .elements3 { width: 33.3%; }
  #stoererHolder .elements4 { width: 25%; }
  #stoererHolder .elements1 .phone-icon, #stoererHolder .elements2 .phone-icon, #stoererHolder .elements3 .phone-icon, #stoererHolder .elements4 .phone-icon { left: 50%; margin-left: -20px; } }

@-webkit-keyframes Vibrate { 0% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  4% { -webkit-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  8% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  12% { -webkit-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  16% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  20% { -webkit-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  24% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  28% { -webkit-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  32% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  36% { -webkit-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  40% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  44% { -webkit-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  48% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  100% { -webkit-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); } }

@keyframes Vibrate { 0% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  4% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  8% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  12% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  16% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  20% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  24% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  28% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  32% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  36% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  40% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  44% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  48% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  100% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); } }
.ringring .phone-icon { -webkit-animation: Vibrate 2s linear 3s 3; animation: Vibrate 2s linear 3s 3; }

.contact-box { font-style: normal; }
.contact-box .contact-cont { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); height: 7rem; margin: 0; width: 100%; position: relative; }
@media only screen and (max-width: 700px) { .contact-box .contact-cont { height: auto; } }
.contact-box .contact-text { padding-left: 50px; }
@media only screen and (max-width: 700px) { .contact-box .contact-text { padding: 15px 0 5px 80px; } }

.contact-image { position: relative; height: 100%; }
.contact-image img { height: 100%; }
.contact-image img.only-mobile { height: auto; width: 100%; }
.contact-image:after { background-color: #21314d; border-radius: 50%; color: #84bc34; content: '\e664'; display: inline-block; font-family: "icons"; font-size: 2.5em; height: 7rem; line-height: 68px; text-align: center; width: 7rem; position: absolute; top: 0; right: -3.5rem; }
@media only screen and (max-width: 700px) { .contact-image:after { top: 100%; margin: 15px 0 0; font-size: 2.5rem; height: 50px; left: 15px; line-height: 2em; width: 50px; } }

.contact-text { position: relative; }
.contact-text h2 { margin-bottom: 0.15em; }
.contact-text .h-card { padding-left: 0.5em; }
@media only screen and (max-width: 700px) { .contact-text .h-card { display: block; padding-left: 0; } }
.contact-text .h-card a { color: inherit; }
.contact-text .h-card a:hover { text-decoration: none; }

.eyecatcher-circle { background-color: #df002e; border-radius: 50%; width: 80%; margin-left: 10%; height: auto; padding-top: 80%; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; z-index: 1; }
.eyecatcher-circle.blue { background-color: rgba(33, 49, 77, 0.85); }
.eyecatcher-circle .text-holder { width: 100%; overflow: hidden; padding: 13%; position: absolute; top: 0; left: 0; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.eyecatcher-circle .text-holder div { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }
.eyecatcher-circle .text-holder .headline2, .eyecatcher-circle .text-holder .headline2-light { margin: 0; }
.eyecatcher-circle.absolute { position: absolute; margin-top: 60px; }
.eyecatcher-circle.absolute.top-negative { margin-top: -45px; }
.eyecatcher-circle.absolute .text-holder { position: absolute; top: 0; left: 0; bottom: 0; right: 0; }
@media only screen and (max-width: 960px) { .eyecatcher-circle.absolute { margin-top: 30px; } }
@media only screen and (max-width: 700px) { .eyecatcher-circle.absolute { margin-top: 0px; } }
.eyecatcher-circle.absolute.left { left: -50px; }
.eyecatcher-circle.absolute.right { margin-top: 0; right: 0; }
.eyecatcher-circle.absolute.top { margin-top: 0; margin-left: 0; }
.eyecatcher-circle.half-size { width: 40%; padding-top: 40%; }

.chat-disturber.rectangle { -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); background-color: #fff; border-radius: 0; height: auto; width: 280px; -webkit-transition: height 0.3s ease 0.1s, width 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s; transition: height 0.3s ease 0.1s, width 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s; overflow: visible; z-index: 9; }
.chat-disturber.rectangle .text-holder { overflow: visible; padding: 5px 0 0; }
.chat-disturber.rectangle .text-holder .headline2-light { height: 48px; margin: 0 10px 0 10px; text-transform: none; }
.chat-disturber.rectangle .text-holder .headline2-light.type-chat, .chat-disturber.rectangle .text-holder .headline2-light.type-hotline { line-height: 2.2; }
.chat-disturber.rectangle .text-holder .headline1-light { font-size: 28px; }
.chat-disturber.rectangle .text-holder .text { padding: 10px 10px 30px; }
.chat-disturber.rectangle .text-holder .type-select, .chat-disturber.rectangle .text-holder .type-chat, .chat-disturber.rectangle .text-holder .type-hotline { display: none; }
.chat-disturber.rectangle hr { margin: 5px 0 1em 0; }
.chat-disturber.rectangle .far { display: inline; }
.chat-disturber.rectangle .phone-icon { cursor: pointer; color: #fff; height: 40px; left: 0; top: 0; -webkit-transform: none; -ms-transform: none; transform: none; width: 40px; }
.chat-disturber.rectangle .phone-icon:before { color: #fff; background-color: red; font-size: 3em; font-style: normal; font-weight: 200; font-variant: normal; text-transform: none; line-height: 1; padding: 10px; position: absolute; top: 0; left: -59px; border-radius: 8px 0 0 8px; -webkit-box-shadow: -2px 0 10px rgba(0, 0, 0, 0.5); box-shadow: -2px 0 10px rgba(0, 0, 0, 0.5); }
.chat-disturber.rectangle h3 { color: #fff; font-size: 16px; margin: 0 0 10px 35px; opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; }
.chat-disturber.rectangle .hotline { font-family: "canada-type-gibson", sans-serif; }
.chat-disturber.rectangle .times span { font-family: "Open Sans", sans-serif; }
.chat-disturber.rectangle .close { cursor: pointer; display: none; position: absolute; right: 10px; top: 15px; }
.chat-disturber.rectangle .close:before { opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; transition: opacity 0.5s ease 0.1s, visible 0.5s ease 0.1s; }
.chat-disturber.rectangle .minimize { cursor: pointer; display: block; position: absolute; right: 35px; top: 21px; }
.chat-disturber.rectangle.closed { height: 40px; width: 0; }
.chat-disturber.rectangle.closed .minimize { height: 100%; width: 100%; top: 0; right: 0; }
.chat-disturber.rectangle.closed .close { height: 100%; width: 100%; top: 0; right: 0; }
.chat-disturber.rectangle.closed .close:before { opacity: 0; visibility: hidden; }

.chat-disturber.sticky { position: fixed; top: 130px; right: 0; z-index: 10; }
.chat-disturber.sticky .close { display: block; }

@keyframes Vibrate { 0% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  4% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  8% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  12% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  16% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  20% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  24% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  28% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  32% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  36% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  40% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  44% { -webkit-transform: rotate(-15deg) translateY(-1px); -ms-transform: rotate(-15deg) translateY(-1px); transform: rotate(-15deg) translateY(-1px); }
  48% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); }
  100% { -webkit-transform: rotate(0deg) translateY(0px); -ms-transform: rotate(0deg) translateY(0px); transform: rotate(0deg) translateY(0px); } }
.accordion-section { border-top: 1px solid #d3d6db; }
.accordion-section.is-active { border-top: 1px solid #21314d; }

.accordion-head { font-weight: bold; margin: 0; padding: 10px 0; position: relative; cursor: pointer; }
.accordion-head:after { position: absolute; right: 10px; top: 12px; content: '\e7c4'; }
.is-active > .accordion-head { color: #21314d; }
.is-active > .accordion-head:after { content: '\e7c5'; }

.accordion-content { height: 0; min-height: 0; overflow: hidden; padding: 0 30px 0 0; }
.is-active > .accordion-content { height: auto; min-height: 1em; overflow: visible; padding: 0 30px 10px 0; }

.has-bars .accordion-section, .has-bars .accordion-section.is-active { border: none; margin-bottom: 2px; }
.has-bars .accordion-head { padding: 10px; background: #f2f2f2; }
.has-bars .accordion-head:hover { background: #d3d6db; }
.has-bars .accordion-content.accordion-text { padding-left: 1rem; }
.has-bars .is-active .accordion-content { padding: 10px 0; }
.has-bars .is-active .accordion-content.accordion-text { padding: 10px; }
.has-bars .is-active .accordion-head { background: #e5e5e5; }
.has-bars .bg-blue-40 { background-color: #a6adb8; }
.has-bars .bg-blue-40:hover { background: #4d5a71; }
.has-bars.is-active .bg-blue-40 { background-color: #7a8394; }

.accordion .accordion-head { font-family: "Open Sans", sans-serif; font-size: 1.3rem; letter-spacing: 0; line-height: 1.4; padding-right: 3rem; text-transform: none; }
.accordion table { table-layout: fixed; }
.accordion td { padding: 10px; }

.pricebox-blue { background-color: #21314d; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); color: #fff; float: left; margin-right: 20px; padding: 15px 10px; position: relative; width: 18rem; }
.pricebox-blue:last-child { margin-right: 0; }
@media only screen and (max-width: 1100px) { .pricebox-blue { width: 17rem; } }
@media only screen and (max-width: 700px) { .pricebox-blue { margin-right: 5px; max-width: 50%; width: 15rem; } }
.pricebox-blue .price { margin-bottom: 1em; }

.infobox { display: inline-block; float: none; margin-right: -.25em; vertical-align: top; }

.infobox-short img { width: auto; }

.infobox-fullwidth { padding: 10px 0; border-bottom: 1px solid #d3d6db; }
.infobox-fullwidth > img, .infobox-fullwidth > h3 { float: left; padding-right: 20px; width: 25%; }
@media only screen and (max-width: 700px) { .infobox-fullwidth > img, .infobox-fullwidth > h3 { float: none; width: auto; } }
.infobox-fullwidth img + h3 { float: none; padding-right: 0; width: auto; }
@media only screen and (max-width: 700px) { .infobox-fullwidth img + h3 { margin-top: 20px; } }

.infobox-content { overflow: hidden; }

.infobox-shadowed { padding: 10px; position: relative; width: 100%; background-color: #fff; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
@media only screen and (max-width: 700px) { .infobox-shadowed { padding: 10px; } }
.infobox-shadowed img { padding-bottom: 10px; width: inherit; }
.infobox-shadowed img.inline { width: 100%; }
.infobox-shadowed.with-gradient { background: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background: linear-gradient(45deg, #e5e5e5, #fff); }
.infobox-shadowed.with-gradient:hover { background: -webkit-linear-gradient(45deg, #cccccc, #f2f2f2); background: linear-gradient(45deg, #cccccc, #f2f2f2); }
.infobox-shadowed.with-gradient .infobox-content { position: absolute; bottom: 10px; left: 10px; right: 10px; }

.gradient-shadow { position: absolute; top: -10px; left: -10px; right: -10px; bottom: -10px; background: -webkit-gradient(linear, left top, left bottom, from(white), to(rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(top, white 49%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(to bottom, white 49%, rgba(255, 255, 255, 0) 100%); }

.infobox-icon { margin-top: 20px; padding: 30px 20px 0; position: relative; z-index: 2; }
.infobox-icon[data-icon]::before { font-size: 6rem; left: -5px; top: -5px; position: absolute; z-index: -1; }

.infobox-icon-left { margin-left: 20px; margin-top: 20px; padding: 5px 0 0 30px; position: relative; }
.infobox-icon-left span[data-icon] { left: -20px; top: -10px; position: absolute; }
.infobox-icon-left span[data-icon]::before { font-size: 5rem; top: 0; left: 0; }

.infobox.table-like { display: table; }
@media only screen and (max-width: 700px) { .infobox.table-like .infobox-img { text-align: center; } }
.infobox.table-like > div { display: table-cell; float: none; vertical-align: middle; }
@media only screen and (max-width: 700px) { .infobox.table-like > div { display: block; } }

.infobox.tab-like { position: relative; background-color: #84bc34; cursor: pointer; text-align: center; }
.infobox.tab-like .infobox-checkbox { background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-size: 5px 5px; position: absolute; left: 20px; top: 20px; width: 30px; height: 30px; background-color: #fff; }
.infobox.tab-like .infobox-content p { font-weight: normal; padding: 0 20px; min-height: 2.8em; }
.infobox.tab-like .infobox-icon { margin-top: 20px; }
.infobox.tab-like .infobox-icon span:before { font-size: 15rem; margin-right: 0; }

.infobox.tab-like.is-active { position: relative; background-color: #21314d; color: #fff; }
.infobox.tab-like.is-active:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -16px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 16px 0; content: ''; cursor: pointer; }
.infobox.tab-like.is-active .infobox-checkbox { background-color: #fff; background-image: none; }
.infobox.tab-like.is-active .infobox-checkbox:before { color: #000; content: '\e601'; font-family: "icons"; font-size: 3rem; position: relative; top: -6px; }

.infobox.tab-like.is-checked .infobox-checkbox { background-color: #fff; background-image: none; }
.infobox.tab-like.is-checked .infobox-checkbox:before { color: #000; content: '\e601'; font-family: "icons"; font-size: 3rem; position: relative; top: -6px; }

.infobox-image.tab-like { margin-top: 100px; }
.infobox-image.tab-like .infobox-image { top: -125px; position: relative; height: 100px; width: 100%; }
.infobox-image.tab-like .infobox-image img { width: inherit; }

.product-keyvisual { position: absolute; }
@media only screen and (max-width: 700px) { .product-keyvisual { position: static; } }

.product-variants { position: relative; top: -10px; }
@media only screen and (max-width: 700px) { .product-variants { -webkit-box-shadow: 0 4rem 4rem -4rem #999 inset; box-shadow: 0 4rem 4rem -4rem #999 inset; border-top: 1px solid #cccccc; margin-top: 13rem; top: 0; } }

@media only screen and (max-width: 700px) { .product-variant:first-child .product-switch { left: 0; } }

@media only screen and (max-width: 960px) { .product-switch { margin-bottom: 1em; } }
@media only screen and (max-width: 700px) { .product-switch { cursor: pointer; height: 100%; opacity: .5; padding: 0; position: absolute; right: 0; top: -13rem; width: 50%; } }

@media only screen and (max-width: 700px) { .product-variants .product-variant .product-switch img { height: 100%; width: auto; } }

@media only screen and (max-width: 700px) { .product-features { height: 0; opacity: 0; visibility: hidden; -webkit-transition: opacity 0.5s ease-in-out 0.1s; transition: opacity 0.5s ease-in-out 0.1s; } }

@media only screen and (max-width: 700px) { .product-variant.is-active { padding-top: 20px; }
  .product-variant.is-active .product-features { height: auto; opacity: 1; visibility: visible; }
  .product-variant.is-active .product-switch { position: relative; opacity: 1; position: absolute; }
  .product-variant.is-active .product-switch:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #fff transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; }
  .product-variant.is-active .product-switch:before { margin-top: 10px; } }

.box { height: 0; min-height: 0; padding: 0 0 100%; position: relative; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); z-index: 1; }
.box.dom:before, .box.box-rectangle:before { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 30px 0 0 30px; border-color: transparent transparent transparent #21314d; position: absolute; right: 0; top: -1px; z-index: 3; }
.box.dom:after, .box.box-rectangle:after { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 0 50px 50px 0; border-color: transparent #fff transparent transparent; position: absolute; right: -7px; top: -14px; z-index: 3; }
.box.box-rectangle.box-full:after, .box.box-rectangle.box-full:before { content: none; }
.box .btn-icon { margin: 0; padding: 5px 10px; }
.box .btn-icon:before { padding-right: 0; }
@media only screen and (max-width: 700px) { .box { margin-top: 10px; } }

.box-rectangle { padding: 0 0 48%; padding-bottom: -webkit-calc(49.9% - 10px); padding-bottom: calc(49.9% - 10px); }
@media only screen and (max-width: 700px) { .box-rectangle { margin-top: 0; padding: 0; }
  .box-rectangle.added { height: auto; min-height: 300px; }
  .box-rectangle.added.d2-prepaid { min-height: 1150px; }
  .box-rectangle h3:not(.prepaid-inclusive) span { display: block; }
  .box-rectangle .box-content { position: relative; }
  .box-rectangle .box-content .slides-box { margin-bottom: 0 !important; } }

.box-content { height: 100%; overflow: hidden; left: 0; max-height: 100%; max-width: 100%; padding: 0; position: absolute; top: 0; width: 100%; }
.box-content h3 { margin-right: 1em; }
.box-content .text.bottom { bottom: 40px; padding: 0 40px; margin-left: -20px; width: 100%; position: absolute; }
.box-content .big { font-family: "canada-type-gibson", sans-serif; font-size: 4.4rem; line-height: 1em; }
@media only screen and (max-width: 700px) { .box-content .big { font-size: 2.7rem; } }
.box-content .is-d2-prepaid .big { font-size: 3.4rem; }

.box-text { padding: 20px; }

.box-link { cursor: pointer; display: block; height: 100%; width: 100%; position: absolute; left: 0; top: 0; z-index: 3; }
.box-link .btn { position: absolute; bottom: 0; left: 0; }

.bg-img { width: 100%; position: absolute; top: 0; left: 0; z-index: -1; }
.bg-img img { width: 100%; }

.dom-icon { display: inline-block; height: 100%; padding-top: 30%; text-align: center; text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25); width: 100%; position: absolute; left: 0; top: 0; }
.dom-icon:after { display: inline; color: #fff; font-size: 120px; margin: 0; vertical-align: middle; }
@media only screen and (max-width: 1100px) { .dom-icon:after { font-size: 13vw; } }
@media only screen and (max-width: 960px) { .dom-icon:after { font-size: 20vw; } }
@media only screen and (max-width: 700px) { .dom-icon:after { font-size: 35vw; } }

.added .dom-icon { padding-top: 10%; }
@media only screen and (max-width: 700px) { .added .dom-icon { padding-top: 12%; } }
.added .dom-icon:after { color: #4d5a71; font-size: 200px; }
@media only screen and (max-width: 1100px) { .added .dom-icon:after { font-size: 18vw; } }
@media only screen and (max-width: 960px) { .added .dom-icon:after { font-size: 30vw; } }
@media only screen and (max-width: 700px) { .added .dom-icon:after { font-size: 50vw; } }

.dom.added, .box-rectangle.added { background-color: #21314d; }
.dom.added:before, .box-rectangle.added:before { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 30px 0 0 30px; border-color: transparent transparent transparent #84bc34; position: absolute; right: 0; top: -1px; z-index: 3; }
.dom.added .tlBrand, .box-rectangle.added .tlBrand { margin-bottom: 1em; width: 25%; }

.is-slider .box-text { padding: 0; }

.slides-container, .slides-container-box { height: 100%; margin: 0; padding: 0; width: 100%; position: absolute; left: 0; top: 0; }
.slides-container > li, .slides-container-box > li { height: 100% !important; list-style: none; padding: 20px; width: 100%; position: absolute; top: 0; left: 0; -webkit-transition: opacity 1s ease 0s, visibility 1s ease 0s; transition: opacity 1s ease 0s, visibility 1s ease 0s; }
@media only screen and (max-width: 700px) { .slides-container > li, .slides-container-box > li { position: absolute; } }
@media only screen and (max-width: 700px) { .slides-container, .slides-container-box { min-height: 460px; position: relative; } }

@media only screen and (max-width: 700px) { .is-no-sliding .slides-container, .is-no-sliding .slides-container-box { min-height: auto; }
  .is-no-sliding .slides-container .box-edit, .is-no-sliding .slides-container-box .box-edit { position: relative; margin-bottom: 5px; }
  .is-no-sliding .slides-container .box-edit .icon-link, .is-no-sliding .slides-container-box .box-edit .icon-link { margin-top: 20px; } }
@media only screen and (max-width: 700px) { .is-no-sliding .slides-container > li, .is-no-sliding .slides-container-box > li { position: relative !important; } }

.element-wrapper { height: 100%; }
.element-wrapper > .btn { position: absolute; bottom: 0; left: 0; }
.element-wrapper h3 { margin-bottom: 0; }
.element-wrapper h3 span + span { display: inline-block; margin-left: 0.5em; width: auto; }
@media only screen and (max-width: 700px) { .element-wrapper h3 span + span { display: block; margin-left: 0; max-width: -webkit-calc(100% - 10rem); max-width: calc(100% - 10rem); } }
.element-wrapper h4 { margin: 7px 0; }
.element-wrapper .arrow-nav { position: absolute; right: 20px; top: 0; }
@media only screen and (max-width: 700px) { .element-wrapper .arrow-nav { margin-top: 30px; position: relative; right: auto; top: auto; } }
.element-wrapper .prepaid-inclusive { margin: 20px 0; }
@media only screen and (max-width: 700px) { .element-wrapper .prepaid-inclusive { bottom: 50px; } }
.element-wrapper .prepaid-inclusive .font-default { font-size: 1.3rem; }

.slides-container-box .spinner { position: relative; top: 50%; }
@media only screen and (max-width: 700px) { .slides-container-box .spinner { top: 125px; } }

.box-details { margin: 10px 0 0; }
@media only screen and (max-width: 700px) { .box-details { margin: 0; padding: 0; } }
.box-details li { float: left; height: 100%; list-style: none; padding: 0 10px; text-align: center; width: 50%; }
@media only screen and (max-width: 700px) { .box-details li { position: relative; height: auto; margin-bottom: 10px; padding: 0; } }
.box-details div { border: 6px solid #7a8394; border-radius: 50%; height: 6vw; margin: 0 auto 1em; min-height: 10rem; min-width: 10rem; padding-top: 1.5rem; width: 6vw; }
@media only screen and (max-width: 960px) { .box-details div { height: 15vw; width: 15vw; } }
@media only screen and (max-width: 700px) { .box-details div { min-height: 8.5rem; min-width: 8.5rem; padding-top: 14%; /*  height: 14rem; width: 14rem; padding-top: 2rem;*/ } }
.box-details.is-d2-prepaid div { height: 110px; width: 110px; }
@media only screen and (max-width: 960px) { .box-details.is-d2-prepaid div { height: 15vw; width: 15vw; } }
@media only screen and (max-width: 700px) { .box-details.is-d2-prepaid div { height: 14rem; width: 14rem; padding-top: 2rem; } }

.set-3 li { width: 33.3%; }
.set-3.is-d2-prepaid li { width: 25%; }
@media only screen and (max-width: 700px) { .set-3.is-d2-prepaid li { width: 100%; } }

.is-d2-prepaid.box-details { margin: 10px 0 0 10px; }
@media only screen and (max-width: 700px) { .is-d2-prepaid.box-details { margin: 10px 0 0 0; } }
.is-d2-prepaid.box-details li { padding: 0; }
.is-d2-prepaid.box-details div { margin: 0 auto 0.5em; }

.box-device .device { display: inline-block; margin: -40px 0 0 0; width: 85%; position: relative; }
@media only screen and (max-width: 700px) { .box-device .device { display: none; } }
.box-device .device-icon:after { color: #7a8394; display: block; font-size: 23rem; margin: 0; position: absolute; top: -40px; left: -40px; }
@media only screen and (max-width: 1100px) { .box-device .device-icon:after { font-size: 21rem; } }

.box-edit { clear: both; text-align: right; position: absolute; bottom: 30px; right: 8.5rem; }
@media only screen and (max-width: 1100px) { .box-edit .icon-link:last-child { margin-right: 0; } }
@media only screen and (max-width: 960px) { .box-edit { right: 11rem; } }
@media only screen and (max-width: 700px) { .box-edit { text-align: left; position: absolute; right: auto; margin-bottom: 20px; max-width: 100%; }
  .box-edit .icon-link:last-child { display: none; } }
.box-edit .icon-link { margin-right: 20px; }

.stoerer { height: 13rem; padding: 10px; text-align: center; width: 13rem; background-color: #84bc34; border-radius: 50%; color: #21314d; position: absolute; right: 15px; top: -20px; }
@media only screen and (max-width: 700px) { .stoerer { right: 0; top: 0; width: 10.3rem; height: 10.3rem; position: relative; padding: 1px 3px 3px; }
  .stoerer .vvl { margin-top: 5px !important; }
  .stoerer .vvl:before { display: none !important; } }
.stoerer .vvl { margin-top: 15px; line-height: 1.2em; position: relative; }
.stoerer .vvl:before { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 30px 0 0 30px; border-color: transparent transparent transparent #84bc34; position: absolute; right: 0; top: -1px; z-index: 3; }
.stoerer .vvl:before { right: 73%; top: 85%; }
.stoerer .vvl .big { font-size: 3rem; line-height: 1em; }
@media only screen and (max-width: 700px) { .stoerer .vvl .big { font-size: 1.8rem; } }
.stoerer .vvl.prepaid { margin-top: 9px; line-height: 1.5em; }
.stoerer .vvl.prepaid .medium { font-family: "qtype", Helvetica, Arial, sans-serif; font-size: 1.6rem; line-height: 1.2em; }
@media only screen and (max-width: 700px) { .stoerer .vvl.prepaid .small { font-size: 1.2rem; line-height: 1.1em; } }
.stoerer .vvl.prepaid .big { font-size: 2.3rem; line-height: 1.2em; }
@media only screen and (max-width: 700px) { .stoerer .vvl.prepaid { padding-top: 2px; } }

.stoerer-box { height: 0; }

.smartphones-distribution .box-link:hover .btn { background-color: rgba(33, 49, 77, 0.8); color: #fff; }
.smartphones-distribution .box-link .btn { text-align: left; width: 100%; }
@media only screen and (max-width: 700px) { .smartphones-distribution .box-link .btn { background-color: rgba(33, 49, 77, 0.8); color: #fff; } }
.smartphones-distribution .bg-img { bottom: 20px; text-align: center; top: auto; }
@media only screen and (max-width: 700px) { .smartphones-distribution .bg-img { display: none; } }
.smartphones-distribution .bg-img img { width: 80%; }

.box-logo { background-position: top center; background-size: 100% auto; display: block; height: 54px; width: 82.5px; }
@media only screen and (max-width: 700px) { .box-logo { height: 72px; margin: 15% auto 0; width: 110px; } }

.box-link:hover + .box-logo { background-position: bottom center; }

.hoverbox { position: relative; }
.hoverbox .hoverbox-content { -webkit-transition: opacity 0.3s ease 0.1s; transition: opacity 0.3s ease 0.1s; opacity: 0; background-color: rgba(33, 49, 77, 0.9); padding: 20px; position: absolute; top: 0; height: 100%; width: 100%; }
.hoverbox .hoverbox-content .linklist.is-white li:before { color: #fff; }
.hoverbox .hoverbox-content .linklist.is-green li:before { color: #84bc34; }
.hoverbox:hover .hoverbox-content { opacity: 1; }
.hoverbox h3 { padding-bottom: 40px; }
@media only screen and (max-width: 700px) { .hoverbox.box { padding: 0; height: auto; }
  .hoverbox .hoverbox-content { opacity: 1; position: relative; background-color: #21314d; height: auto; }
  .hoverbox .hoverbox-content .list { margin-bottom: 0; }
  .hoverbox .hoverbox-content .linklist li:nth-last-child(1) { margin-bottom: 0; }
  .hoverbox .box-content { position: relative; }
  .hoverbox .bg-img { position: relative; }
  .hoverbox h3 { padding-bottom: 15px; }
  .hoverbox .box-text { position: absolute; } }

.hoverbox.center .box-text { opacity: 1; -webkit-transition: opacity 0.3s ease 0.1s; transition: opacity 0.3s ease 0.1s; }
.hoverbox.center .box-text, .hoverbox.center .hoverbox-content { height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
@media only screen and (max-width: 700px) { .hoverbox.center .box-text, .hoverbox.center .hoverbox-content { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; text-align: left; }
  .hoverbox.center .box-text *, .hoverbox.center .hoverbox-content * { text-align: left; } }
.hoverbox.center:hover .box-text { opacity: 0; }
@media only screen and (max-width: 700px) { .hoverbox.center:hover .box-text { opacity: 1; } }

.qab-icon { position: relative; }
.qab-icon[data-icon]:before { content: none; }
.qab-icon .text { min-height: 7rem; position: relative; padding-right: 25%; }
@media only screen and (max-width: 700px) { .qab-icon .text { margin-bottom: 20px; padding-right: 35%; } }
.qab-icon .text[data-icon]:before { color: #7a8394; top: -10px; font-size: 10rem; position: absolute; right: -4rem; }
.qab-icon .btn { position: static; margin: 0; }

.qab { padding: 20px; width: 100%; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.qab h3 { padding-bottom: 5px; border-bottom: 1px solid #21314d; }
@media only screen and (max-width: 700px) { .qab.qab-btn { position: relative; padding-bottom: 40px; }
  .qab .btn { bottom: 0; left: 0; margin-bottom: 0; position: absolute; } }

.device-item:hover .box-header, .device-item.is-active .box-header, .productbox:hover .box-header, .productbox.is-active .box-header { background: -webkit-linear-gradient(45deg, #cccccc, #f2f2f2); background: linear-gradient(45deg, #cccccc, #f2f2f2); }
.device-item ul, .productbox ul { margin: 0; padding-left: 15px; font-size: 1.3rem; }
.device-item .box, .productbox .box { height: auto; padding: 0; width: 100%; }
.device-item .box-content, .productbox .box-content { position: static; cursor: pointer; padding: 15px 20px 18px 18px; }
.device-item .box-header, .productbox .box-header { background: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background: linear-gradient(45deg, #e5e5e5, #fff); position: absolute; top: 0; left: 0; right: 0; height: 170px; padding: 15px 20px 0; z-index: 2; }
.device-item .box-header h3, .productbox .box-header h3 { margin: 0 0 10px; }
.device-item .box-header hr, .productbox .box-header hr { border-top: 2px solid #84bc34; margin-top: 0; }
.device-item .box-footer, .productbox .box-footer { border: none; margin-top: 150px; padding-top: 25px; font-weight: normal; }
.device-item .box-footer.with-button, .productbox .box-footer.with-button { padding-bottom: 66px; }
.device-item .box-footer a.btn-bottom, .productbox .box-footer a.btn-bottom { position: absolute; margin: 0; left: 20px; right: 20px; bottom: 20px; max-width: -webkit-calc( 100% - $global-gap*2); max-width: calc( 100% - $global-gap*2); }
@media only screen and (max-width: 700px) { .device-item .box-footer a.btn-bottom, .productbox .box-footer a.btn-bottom { left: 10px; right: 10px; bottom: 10px; width: auto; } }
.device-item .image, .productbox .image { position: absolute; left: 25px; top: 55px; height: 150px; z-index: 3; }
.device-item .image .image-stoerer, .productbox .image .image-stoerer { position: absolute; left: 0; top: -4px; right: 0; bottom: 0; }
.device-item .image .image-stoerer img, .productbox .image .image-stoerer img { height: auto; }
.device-item .image img, .productbox .image img { height: 100%; }
.device-item .device-price, .productbox .device-price { position: absolute; right: 20px; top: 100px; z-index: 3; }

.tabs-vvl { margin: 10px 0 15px; }

/** the following are helper-classes, because you cannot select pseudo-elements (:before) with javascript these classes only exist to position the arrow correctly
*/
.device-detail.arr14:before { left: 11.5%; }

.device-detail.arr24:before { left: 36.5%; }

.device-detail.arr34:before { left: 62.5%; }

.device-detail.arr04:before { left: 88.5%; }

.device-detail.arr13:before { left: 16.5%; }

.device-detail.arr23:before { left: 49.5%; }

.device-detail.arr03:before { left: 82.5%; }

.device-detail.arr12:before { left: 25%; }

.device-detail.arr02:before { left: 75%; }

.device-detail.arr01:before { left: 50%; }

.productbox .box-header { height: 20rem; }
.productbox .box-header h3 { min-height: 2.5em; }
.productbox .image { position: static; }
.productbox .price { position: absolute; bottom: 20px; right: 20px; }
.productbox .box-footer { margin-top: 185px; }
.productbox .box-footer .btn { margin-top: 20px; width: 100%; }

.device-detail { position: relative; padding-top: 0; margin-top: -5px; z-index: 5; }
.device-detail:before { display: block; height: 0; left: 50%; position: relative; margin-left: -10px; right: 0; top: -10px; width: 0; border-style: solid; border-color: transparent transparent #84bc34; border-width: 0 10px 10px; content: ''; cursor: pointer; }
.device-detail:before { top: 0; left: 0; }
.device-detail.animate .box { height: 50rem; }
@media only screen and (max-width: 960px) { .device-detail.animate .box { height: 340px; } }
@media only screen and (max-width: 700px) { .device-detail.animate .box { height: auto; margin-top: 0; } }
.device-detail .box { height: 0; -webkit-transition: all 1s ease; transition: all 1s ease; }
@media only screen and (max-width: 700px) { .device-detail .box { margin-top: 0; -webkit-transition: none; transition: none; } }
.device-detail .box-content { background-color: #f2f2f2; border-top: 4px solid #84bc34; cursor: default; }
.device-detail .box-content .close { position: absolute; right: 20px; top: 20px; cursor: pointer; z-index: 5; }
.device-detail .box-content .close:before { content: '\e6fd'; }
@media only screen and (max-width: 700px) { .device-detail .box-content .close { right: 10px; } }
.device-detail .bg-upper-layer { left: 0; }
.device-detail .left-side .device-thumbs ul li { height: 8rem; }
.device-detail .left-side .device-thumbs ul li::after { margin-top: -4px; }
.device-detail .left-side .device-img { background-size: contain; background-repeat: no-repeat; }
.device-detail .left-side .device-img a::before { top: 100%; margin-top: -5px; height: 20px; }
.device-detail .device-text { padding-top: 30px; }
.device-detail .device-buy .dropdown-holder { padding: 0; font-size: 1.25rem; }
.device-detail .device-buy li { padding-left: 25px; }
.device-detail .bg-contain { background-size: contain; background-position: center center; background-repeat: no-repeat; }
.device-detail .price { position: relative; right: 0; bottom: 0; }
.device-detail .availability span { color: #000; font-weight: 700; }
.device-detail .right-side .device-info .device-price { right: 20px; }
@media only screen and (max-width: 960px) { .device-detail.device-item-big .device-buy { right: 0; text-align: right; padding-bottom: 0; }
  .device-detail.device-item-big .device-img .icon-link::before { margin-top: -1px; } }
@media only screen and (max-width: 700px) { .device-detail .box-content { height: auto; max-height: none; overflow: visible; padding: 7.5px 10px 0 9px; }
  .device-detail .box-content .box-upper-layer { position: static; }
  .device-detail .dropdown { margin: 0; width: -webkit-calc(100% + 13px); width: calc(100% + 13px); }
  .device-detail.device-item-big { height: auto; }
  .device-detail.device-item-big .right-side { padding: 0; }
  .device-detail.device-item-big .right-side .device-buy, .device-detail.device-item-big .right-side .device-price, .device-detail.device-item-big .right-side .device-info, .device-detail.device-item-big .right-side .device-details, .device-detail.device-item-big .right-side .device-text { position: static; padding: 0; }
  .device-detail.device-item-big .right-side .device-info { min-height: auto; margin-top: 20px; }
  .device-detail.device-item-big .right-side .device-info .device-price { width: 35%; }
  .device-detail.device-item-big .right-side .device-info .device-details { width: 65%; }
  .device-detail.device-item-big .right-side .device-text h2 { margin-right: 20px; }
  .device-detail.device-item-big .right-side .device-buy { margin-top: 10px; margin-left: -7px; margin-right: -10px; } }
@media only screen and (max-width: 700px) and (max-width: 700px) { .device-detail.device-item-big.vvl-device-item-big .right-side .device-info .device-details { position: static; } }
@media only screen and (max-width: 700px) { .device-detail .left-side { display: none; }
  .device-detail .device-text { padding: 20px 10px; } }

/** the following are helper-classes, because you cannot select pseudo-elements (:before) with javascript these classes only exist to position the arrow correctly
*/
.device-detail.arr14:before { left: 11.5%; }

.device-detail.arr24:before { left: 36.5%; }

.device-detail.arr34:before { left: 62.5%; }

.device-detail.arr04:before { left: 88.5%; }

.device-detail.arr13:before { left: 16.5%; }

.device-detail.arr23:before { left: 49.5%; }

.device-detail.arr03:before { left: 82.5%; }

.device-detail.arr12:before { left: 25%; }

.device-detail.arr02:before { left: 75%; }

.device-detail.arr01:before { left: 50%; }

.device-bonus:hover .box .box-header { background: none; }
.device-bonus .box { background-image: url("/inc/images/gutschrift.png"); background-size: cover; background-position: center center; }
.device-bonus .box-header { position: static; padding: 0; height: auto; background-color: transparent; background-image: none; }
.device-bonus p { margin: 0; }
.device-bonus .box-content { cursor: pointer; }
.device-bonus .bonus { display: block; font-family: "canada-type-gibson", sans-serif; text-align: center; font-size: 6rem; color: #21314d; margin-top: -20px; }
.device-bonus .bonus-button { position: absolute; left: 20px; right: 20px; bottom: 20px; }
.device-bonus button { margin: 0; width: 100%; }

/*div*/
.tariff-item { display: table; table-layout: fixed; width: 100%; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); margin-bottom: 20px; background-color: rgba(255, 255, 255, 0.75); min-height: 125px; }
.tariff-item ul { margin: 0; padding: 0; }
.tariff-item ul li { list-style-type: none; }

.tariff-icon, .tariff-info, .tariff-phone, .tariff-price, .tariff-sms, .tariff-surf, .tariff-options { display: table-cell; padding: 20px 10px 10px 10px; }
@media only screen and (max-width: 700px) { .tariff-icon, .tariff-info, .tariff-phone, .tariff-price, .tariff-sms, .tariff-surf, .tariff-options { display: block; padding: 10px; width: auto !important; } }

.tariff-icon { width: 144px; padding: 10px 0 0 0; vertical-align: middle; }
@media only screen and (max-width: 700px) { .tariff-icon { display: none; } }
@media only screen and (max-width: 1100px) { .tariff-icon { width: 70px; } }
@media only screen and (max-width: 960px) { .tariff-icon { display: none; } }

.tariff-info { width: 194px; position: relative; }
.tariff-info .tariff-stoerer-container { position: relative; }
.tariff-info .tariff-stoerer { height: 50px; padding-top: 8px; position: absolute; right: -18px; top: -30px; width: 62px; background: url(/inc/images/320x320_blanko.png) no-repeat; background-size: 100% 100%; font-size: 0.9rem; color: #df002e; text-align: center; font-weight: 700; }
.tariff-info .tariff-stoerer .tariff-stoerer-value { font-size: 1.5em; padding-left: 5px; }
.tariff-info .tariff-stoerer-circle { position: absolute; right: -10px; top: -25px; border-radius: 50%; background-color: #df002e; color: #fff; width: 40px; height: 40px; padding-top: 2px; font-size: 2.5rem; font-weight: 700; text-align: center; }
.tariff-info h3.with-stoerer { padding-right: 40px; }
@media only screen and (max-width: 1100px) { .tariff-info { width: auto; } }
@media only screen and (max-width: 960px) { .tariff-info { width: auto; } }

.tariff-phone { width: 164px; }
@media only screen and (max-width: 1100px) { .tariff-phone { width: 120px; } }
@media only screen and (max-width: 960px) { .tariff-phone { width: 120px; } }

.tariff-sms { width: 156px; }
@media only screen and (max-width: 960px) { .tariff-sms { width: 120px; } }
@media only screen and (max-width: 1100px) { .tariff-sms { width: 120px; } }

.tariff-surf { width: 230px; }
@media only screen and (max-width: 1100px) { .tariff-surf { width: 150px; } }
@media only screen and (max-width: 960px) { .tariff-surf { width: 120px; } }

.tariff-price { text-align: right; width: 192px; padding: 10px 20px 20px 10px; vertical-align: bottom; }
.tariff-price .btn { margin: 20px 0 0 0; }
@media only screen and (max-width: 1100px) { .tariff-price { width: 170px; padding: 10px; } }
@media only screen and (max-width: 960px) { .tariff-price { width: 160px; height: auto; } }

.tariff-current { background-color: #21314d; }
.tariff-current .tariff-info { width: 368px; color: #fff; }
.tariff-current .tariff-options { vertical-align: bottom; }
.tariff-current .tariff-options .bonus, .tariff-current .tariff-options .device { position: relative; height: 100px; text-align: center; }
@media only screen and (max-width: 700px) { .tariff-current .tariff-options .bonus, .tariff-current .tariff-options .device { height: 130px; } }
.tariff-current .tariff-options .bonus:before { position: absolute; font-family: "canada-type-gibson", sans-serif; color: #a6adb8; content: attr(data-bonus); font-size: 7.8rem; z-index: 0; top: -13px; left: 45%; margin-left: -80px; }
.tariff-current .tariff-options .device:before { position: absolute; font-family: "icons"; font-size: 8rem; color: #a6adb8; content: '\a004'; z-index: 0; top: -12px; left: 50%; margin-left: -70px; }
@media only screen and (max-width: 700px) { .tariff-current .tariff-options .device:before { left: 43%; } }
.tariff-current .tariff-options .device:after { position: absolute; font-family: "icons"; font-size: 8rem; color: #a6adb8; content: '\a005'; z-index: 0; top: -7px; left: 50%; margin-left: -10px; }
@media only screen and (max-width: 700px) { .tariff-current .tariff-options .device:after { left: 45%; } }
.tariff-current .btn { margin: 55px 0 0 0; position: relative; z-index: 1; }
@media only screen and (max-width: 700px) { .tariff-current .btn { margin-top: 70px; } }

.arrow-box, html body div .arrow-box { position: relative; display: inline-block; height: 0px; width: 100%; padding-bottom: 20%; background-clip: content-box; overflow: hidden; z-index: 0; }
.arrow-box:after, html body div .arrow-box:after { content: ""; position: absolute; top: 0; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; background-color: inherit; z-index: -1; left: -1%; padding-bottom: 29%; width: 60%; -webkit-transform: rotate(-16.5deg) skewX(57deg); -ms-transform: rotate(-16.5deg) skewX(57deg); transform: rotate(-16.5deg) skewX(57deg); }
.arrow-box.left:after, html body div .arrow-box.left:after { left: 0; padding-bottom: 19.2%; width: 79%; -webkit-transform: rotate(-11deg) skewX(48deg); -ms-transform: rotate(-11deg) skewX(48deg); transform: rotate(-11deg) skewX(48deg); }
.arrow-box.right:after, html body div .arrow-box.right:after { left: 0; padding-bottom: 50.6%; width: 29%; -webkit-transform: rotate(-30.3deg) skewX(49deg); -ms-transform: rotate(-30.3deg) skewX(49deg); transform: rotate(-30.3deg) skewX(49deg); }
@media only screen and (max-width: 960px) { .arrow-box.is-hidden-m, html body div .arrow-box.is-hidden-m { display: none; } }
@media only screen and (max-width: 700px) { .arrow-box.not-mobile, html body div .arrow-box.not-mobile { display: none; } }

.box-search { color: #21314d; background-color: #fff; height: 100%; padding: 0; width: 100%; }
@media only screen and (max-width: 700px) { .box-search { padding: 0; }
  .box-search .description { float: right; padding-left: 15px; } }
.box-search:hover:not(.top-results) { background-color: #e5e5e5; }
.box-search.top-results:hover, .box-search.top-results:hover .is-blue * { color: #84bc34; }
.box-search .box-content { position: relative; padding: 15px 10px 10px; }
@media only screen and (max-width: 700px) { .box-search .box-content { padding: 15px 0 10px; } }
.box-search.shophit .box-content { padding: 15px 10px 70px; }
.box-search.shophit .box-content .description { bottom: 0; left: 0; position: absolute; }
@media only screen and (max-width: 700px) { .box-search.shophit .box-content { padding: 15px 20px 10px 18px; }
  .box-search.shophit .box-content .description { bottom: inherit; left: inherit; position: relative; } }
.box-search .box-header { min-height: 68px; }
@media only screen and (max-width: 700px) { .box-search .box-header { min-height: 40px; float: right; padding-left: 15px; } }
.box-search .image { min-height: 140px; padding: 5px; }
.box-search .image.has-icon { height: 140px; }
.box-search .image img { max-height: 130px; }
@media only screen and (max-width: 960px) { .box-search .image { max-height: none; } }
@media only screen and (max-width: 700px) { .box-search .image { height: 100%; min-height: none; } }
.box-search .image .icon-circle.bigger { width: 125px; font-size: 57px; padding-top: 125px; margin: auto; }
.box-search .image .icon-circle.bigger span:before { margin: auto; vertical-align: -webkit-baseline-middle; vertical-align: -moz-middle-with-baseline; vertical-align: -43% \9\0; font-size: 1.4em; }
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .box-search .image .icon-circle.bigger span:before { vertical-align: -43%; } }
@media only screen and (max-width: 700px) { .box-search .image .icon-circle.bigger { top: 0; margin-top: 0; padding-top: 115px; width: 115px; } }
.box-search .right-bottom { margin-top: 20px; }
@media only screen and (max-width: 700px) { .box-search .right-bottom { margin-top: 60px; } }
.box-search .left-bottom { position: absolute; padding-left: 18px; padding-bottom: 15px; bottom: 0; left: 0; }
@media only screen and (max-width: 700px) { .box-search .left-bottom { padding-left: 0px; position: relative; } }
.box-search.top-results { -webkit-box-shadow: none; box-shadow: none; }
@media only screen and (max-width: 700px) { .box-search.top-results { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); float: left; height: auto; padding-top: 10px; padding-bottom: 10px; } }
.box-search.top-results h3 { margin-bottom: 10px; }
@media only screen and (max-width: 700px) { .box-search.top-results h3 { padding-left: 15px; } }
.box-search.top-results .image { height: auto; max-height: none; margin-bottom: 10px; }
.box-search.top-results .image img { width: 100%; }
@media only screen and (max-width: 700px) { .box-search.top-results .image { margin-bottom: 0; } }

.password-first { display: inline-block; }
.password-first span { display: none; height: 5px; }
.password-first .line-uncertainly { background-color: #df002e; width: 33.3%; }
.password-first .line-normally { background-color: #e6be00; width: 66.6%; }
.password-first .line-surely { background-color: #84bc34; width: 100%; }

.password-first.uncertainly .line-uncertainly { display: block; }

.password-first.normally .line-normally { display: block; }

.password-first.surely .line-surely { display: block; }

.message { font-size: 1.2rem; line-height: 1.34; color: #7a8394; }

.obligation { margin: 0 10px 70px 0; text-align: right; }

.tooltip { display: none; position: relative; padding: 0 0 0 10px; margin-bottom: 1em; width: 100%; background-color: #e6f2d6; }
.tooltip:before { display: block; height: 0; left: 50%; position: relative; margin-left: -6px; right: 0; top: -6px; width: 0; border-style: solid; border-color: transparent transparent #e6f2d6; border-width: 0 6px 6px; content: ''; cursor: pointer; }
.tooltip .message { display: inline-block; padding: 5px 10px 10px 25px; color: #66a543; position: relative; }
.tooltip .message:before { content: '\e603'; font-family: "icons"; font-size: 1.4em; line-height: 1; color: #84bc34; position: absolute; left: 0; }

.is-successful .tooltip { display: inline-block; }

.is-inform .tooltip { display: inline-block; }

.bg-blue .message { color: #a6adb8; }

.bg-green .message { color: #66a543; }

.info { background-color: #fcf8e5; }
.info:before { border-bottom-color: #fcf8e5; }
.info .message { color: #21314d; }
.info .message:before { content: '\e619'; color: #e6be00; }

.error.tooltip { background-color: #ffebe1; }
.error.tooltip:before { border-bottom-color: #ffebe1; }

.error .message { color: #df002e; }
.error .message:before { content: '\e607'; color: #df002e; }

.is-invalid .error.tooltip { display: inline-block; }

fieldset { position: relative; }

.label-box { float: none; margin-right: 20px; padding: 10px 20px 10px 10px; position: relative; width: auto; border-top-left-radius: 5px; background-color: #f2f2f2; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); cursor: pointer; line-height: 1.8; overflow: visible; }
.label-box input { float: left; margin-right: -25px; margin-top: 7px; line-height: 1.8; }
.label-box span { display: block; margin-left: 20px; color: #a6adb8; font-size: 1.4rem; font-weight: normal; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.label-box strong { display: block; }
.label-box :checked + span { color: #000; }
.label-box.with-image { padding-right: 25px; }
.label-box.with-icon { display: inline-block; min-height: 115px; padding: 10px 65px 10px 15px; white-space: normal; }
.label-box.with-icon span { color: #000; }
.label-box.with-icon strong { white-space: nowrap; }
@media only screen and (max-width: 960px) { .label-box.with-icon strong { white-space: normal; } }
.label-box.with-icon:before { margin-right: 0; position: absolute; right: 0; top: 25px; color: #e5e5e5; font-size: 8rem; }
.label-box.last-child { margin-right: 0; }
.label-box .netsprite-s { position: absolute; top: 3px; right: -16px; -webkit-filter: gray; filter: gray; -webkit-filter: grayscale(100%); }
.label-box :checked ~ .netsprite-s { -webkit-filter: grayscale(0%); }

.grid-col .label-box { margin-right: 0; width: 100%; }

.intro-standard { height: auto; min-height: 180px; margin: 0 auto; max-width: 1440px; width: 100%; background-position: center top; background-repeat: no-repeat; background-size: 100% auto; }
@media only screen and (max-width: 1100px) { .intro-standard { background-position: 7rem top; } }
@media only screen and (max-width: 960px) { .intro-standard { background-position: 5rem top; } }
@media only screen and (max-width: 700px) { .intro-standard { display: none; } }

.intro-fullscreen { height: 380px; margin-bottom: 10px; background-position: center top; background-size: cover;   /*@include breakpoint(desktop-wide) { background-size: auto; background-repeat: no-repeat; margin-left: auto; margin-right: auto; width: 1440px; position: relative;
 &:before, &:after { content: ' '; width: 124px; height: 380px; position: absolute; transition: all 0.3s; } &:before { lefT: 0; @include linear-gradient-l-to-r(rgba(255,255,255,1), rgba(255,255,255,0)); } &:after { right: 0; @include linear-gradient-l-to-r(rgba(255,255,255,0), rgba(255,255,255,1)); } }*/ }
@media only screen and (max-width: 960px) { .intro-fullscreen { height: 280px; } }
@media only screen and (max-width: 700px) { .intro-fullscreen:not(.prevent-defaults) { display: none; } }
.intro-fullscreen.prevent-defaults { height: auto; }

.intro-narrow { height: 240px; background-position: center; }

.laser-intro { bottom: -140px; display: block; height: 210px; position: absolute; width: 100%; z-index: 2; background-image: url(/assets/images/laser.svg); background-position: center bottom; pointer-events: none; }

.hideIntro .intro-fullscreen, .hideIntro .introslides { display: none; }
.hideIntro .content-intro-prefix { position: inherit; }

.hpintro { max-height: 438px; max-width: 1084px; position: relative; pointer-events: none; height: 0; padding-bottom: 40.40%; }
.hpintro a { pointer-events: all; }
.hpintro .button-text, .hpintro .btn { margin: 0; width: auto; }
.hpintro h3 { font-size: 2.6rem; }
.hpintro .-hp-container-headlines { height: 100%; }
.hpintro .-hp-container-headlines .-hp-container-headlines-element { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.hpintro .-hp-container-headlines .-hp-container-headlines-element.-valight-top { position: relative; top: 0%; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); }
@media only screen and (max-width: 700px) { .hpintro .-hp-container-headlines .-hp-container-headlines-element.-valight-top { position: relative; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }
.hpintro .-hp-container-headlines .-hp-container-headlines-element.-valight-bottom { position: relative; top: 100%; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); }
@media only screen and (max-width: 700px) { .hpintro .-hp-container-headlines .-hp-container-headlines-element.-valight-bottom { position: relative; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }
.hpintro .-hp-container-headlines .-hp-container-headlines-element.-valight-center { position: relative; top: 38%; -webkit-transform: translateY(-38%); -ms-transform: translateY(-38%); transform: translateY(-38%); }
@media only screen and (max-width: 700px) { .hpintro .-hp-container-headlines .-hp-container-headlines-element.-valight-center { position: relative; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }
@media only screen and (max-width: 700px) { .hpintro .-hp-container-headlines .-hp-container-headlines-element { position: relative; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }
@media only screen and (max-width: 700px) { .hpintro .-hp-container-headlines { width: 100%; position: absolute; top: 0; left: 0; } }
@media only screen and (max-width: 960px) { .hpintro .-hp-container-headlines .headline2__subline { display: none; } }
.hpintro .is-content { font-size: 1.5rem; display: none; }
@media only screen and (max-width: 1100px) { .hpintro { height: auto; padding-bottom: 0; } }
@media only screen and (max-width: 700px) { .hpintro { max-height: none; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; margin: 0 10px; padding-bottom: 50px; background: #f2f2f2; } }
@media only screen and (max-width: 700px) { .ps-dashboard .hpintro { margin: 0; } }
.hpintro .is-countdown { text-align: left; position: absolute; top: 19%; left: 0; right: 0; width: 100%; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; }
@media only screen and (max-width: 960px) { .hpintro .is-countdown { text-align: center; top: 10%; left: -40px; }
  .hpintro .is-countdown .counterslogan { margin: 22px -4px -26px; width: 58px; } }
@media only screen and (max-width: 700px) { .hpintro .is-countdown { width: 100%; margin: -2px -4px -23px; top: 19%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } }
.hpintro .is-countdown h1 { display: none; }
.hpintro .is-countdown .clock.is-counter { margin-bottom: 32px; }
.hpintro .is-countdown .counterslogan { width: 131px; display: inline-block; margin: 0px -4px -11px; }
@media only screen and (max-width: 1100px) { .hpintro .is-countdown .counterslogan { width: 100px; margin: 3px -4px -26px; } }
@media only screen and (max-width: 700px) { .hpintro .is-countdown .counterslogan { width: 53px; margin: 2px -4px -23px; } }
.hpintro .is-countdown .counterslogan.inro-top { left: 0; }
.hpintro .is-countdown .counterslogan.inro-deal { right: 0; }
@media (min-width: 701px) and (max-width: 960px) { .hpintro .is-countdown { text-align: left; left: 0; }
  .hpintro .is-countdown .counterslogan { display: none; } }
@media (max-width: 365px) { .hpintro .is-countdown .counterslogan { display: none; } }
.hpintro #newsticker, .hpintro .newsticker { background: #df002e; border: #df002e; font-family: qtype, Helvetica, Arial, sans-serif; font-weight: normal; color: white; font-size: 18px; padding: 5px 10px; max-height: 35px; overflow: hidden; position: absolute; width: 100%; top: 0; }
.hpintro #newsticker .content, .hpintro .newsticker .content { float: left; white-space: nowrap; height: 100%; overflow: hidden; width: 100%; -webkit-animation: type2 13s steps(60, end) infinite; animation: type2 13s steps(60, end) infinite; }
.hpintro #newsticker span.blink, .hpintro .newsticker span.blink { -webkit-animation: blink 1s infinite; animation: blink 1s infinite; float: left; }
@-webkit-keyframes type2 { 0% { width: 0; }
  50% { width: 100%; }
  100% { width: 100%; } }
@keyframes type2 { 0% { width: 0; }
  50% { width: 100%; }
  100% { width: 100%; } }
.hpintro-textl, .hpintro-textr { bottom: 0; padding: 50px 50px 50px 10px; position: absolute; top: 0; width: 50%; }
.hpintro-textl h3, .hpintro-textr h3 { margin: 0 0 0.6rem; }
.hpintro-textl .button-text, .hpintro-textl .btn, .hpintro-textl .price, .hpintro-textr .button-text, .hpintro-textr .btn, .hpintro-textr .price { bottom: 35px; position: absolute; }
@media only screen and (max-width: 960px) { .hpintro-textl .button-text.price-xl .price-value, .hpintro-textl .btn.price-xl .price-value, .hpintro-textl .price.price-xl .price-value, .hpintro-textr .button-text.price-xl .price-value, .hpintro-textr .btn.price-xl .price-value, .hpintro-textr .price.price-xl .price-value { font-size: 4.4rem; } }
@media only screen and (max-width: 700px) { .hpintro-textl .button-text.price-xl .price-value, .hpintro-textl .btn.price-xl .price-value, .hpintro-textl .price.price-xl .price-value, .hpintro-textr .button-text.price-xl .price-value, .hpintro-textr .btn.price-xl .price-value, .hpintro-textr .price.price-xl .price-value { font-size: 3.5rem; } }
.hpintro-textl .button-text, .hpintro-textl .btn, .hpintro-textr .button-text, .hpintro-textr .btn { right: 45px; }
@media only screen and (max-width: 960px) { .hpintro-textl .button-text, .hpintro-textl .btn, .hpintro-textr .button-text, .hpintro-textr .btn { bottom: 25px; } }
@media only screen and (max-width: 700px) { .hpintro-textl .button-text, .hpintro-textl .btn, .hpintro-textr .button-text, .hpintro-textr .btn { bottom: 5px; } }
.hpintro-textl .price, .hpintro-textr .price { left: 0; }
.hpintro-textl .price .price-foot, .hpintro-textr .price .price-foot { text-align: left; }
.hpintro-textl .as-text *, .hpintro-textr .as-text * { text-align: left; }
body .is-marketing .hpintro-textl, body .is-marketing .hpintro-textr { padding-top: 18%; }
body .is-marketing .hpintro-textl h2, body .is-marketing .hpintro-textr h2 { display: none; }
@media only screen and (max-width: 700px) { body .is-marketing .hpintro-textl h2, body .is-marketing .hpintro-textr h2 { display: block !important; } }
@media only screen and (max-width: 700px) { body .is-marketing .hpintro-textl, body .is-marketing .hpintro-textr { padding-top: 0; } }
@media only screen and (max-width: 1100px) { .hpintro-textl.hpintro-textl, .hpintro-textr.hpintro-textl { padding-left: 50px; padding-right: 20px; }
  .hpintro-textl .price, .hpintro-textr .price { left: 0; }
  .hpintro-textl .button-text, .hpintro-textl .btn, .hpintro-textr .button-text, .hpintro-textr .btn { right: 20px; } }
@media only screen and (max-width: 960px) { .hpintro-textl, .hpintro-textr { padding: 50px; }
  .hpintro-textl .price, .hpintro-textr .price { left: 50px; }
  .hpintro-textl .is-content, .hpintro-textr .is-content { display: none; } }
@media only screen and (max-width: 700px) { .hpintro-textl, .hpintro-textr { padding: 10px; }
  .hpintro-textl h3, .hpintro-textr h3 { display: none; }
  .hpintro-textl .price, .hpintro-textr .price { bottom: 70px; left: 25px; } }

.hpintro-textr { right: 0; }
@media only screen and (max-width: 960px) { .hpintro-textr { padding-left: 0; }
  .hpintro-textr .button-text, .hpintro-textr .btn { right: 30px; } }
@media only screen and (max-width: 700px) { .hpintro-textr .button-text, .hpintro-textr .btn { right: 5%; } }
.hpintro-textr .price { left: 20px; }
@media only screen and (max-width: 960px) { .hpintro-textr .price { left: 0; } }

.hpintro-textl { left: 0; padding: 50px 0 50px 4.61%; }
.hpintro-textl .price { left: 50px; }
@media only screen and (max-width: 700px) { .hpintro-textl .button-text, .hpintro-textl .btn { left: 5%; } }

.hpintro span.fn.hpintro-textl { bottom: auto; color: red; padding: 0; position: absolute; right: auto; width: auto; }
.hpintro span.fn.hpintro-textl.fn-tl { left: 63%; top: 47%; }
.hpintro span.fn.hpintro-textl.fn-tr { left: 93.5%; top: 19%; }
.hpintro span.fn.hpintro-textl.fn-bl { left: 63%; top: 76%; }
.hpintro span.fn.hpintro-textl.fn-br { left: 93.5%; top: 67%; }
.hpintro span.fn.hpintro-textl.fn-bc { left: 78%; top: 76%; }
.hpintro span.fn.hpintro-textl.fn-tc { left: 78%; top: 19%; }
@media only screen and (max-width: 700px) { .hpintro span.fn.hpintro-textl.fn-tl, .hpintro span.fn.hpintro-textl.fn-tr, .hpintro span.fn.hpintro-textl.fn-bl, .hpintro span.fn.hpintro-textl.fn-br { left: auto; padding: 0 !important; right: 8vw; top: 48vw; } }

.hpintro span.fn.hpintro-textr { bottom: auto; color: #df002e; padding: 0; position: absolute; right: auto; width: auto; }
.hpintro span.fn.hpintro-textr.fn-tl { left: 14.5%; top: 17%; }
.hpintro span.fn.hpintro-textr.fn-tr { left: 44%; top: 48%; }
.hpintro span.fn.hpintro-textr.fn-bl { left: 14.5%; top: 67%; }
.hpintro span.fn.hpintro-textr.fn-br { left: 44%; top: 76%; }
.hpintro span.fn.hpintro-textr.fn-tc { left: 29.25%; top: 17%; }
.hpintro span.fn.hpintro-textr.fn-bc { left: 30%; top: 79%; }
@media only screen and (max-width: 700px) { .hpintro span.fn.hpintro-textr.fn-tl, .hpintro span.fn.hpintro-textr.fn-bl { left: 28vw; padding: 0 !important; top: 35vw; } }
@media only screen and (max-width: 700px) { .hpintro span.fn.hpintro-textr.fn-tr { left: 91%; padding: 0 !important; top: 48vw; } }
@media only screen and (max-width: 700px) { .hpintro span.fn.hpintro-textr.fn-br { left: 87%; padding: 0 !important; top: 55%; } }
@media only screen and (max-width: 700px) { .hpintro span.fn.hpintro-textr.fn-m-tc { left: 29.5%; top: 21vw; } }

.as-contentintro { max-height: 348px; max-width: 1084px; padding-bottom: 0; height: auto; }
.as-contentintro .-hp-container-headlines { height: 100%; }
.as-contentintro .-hp-container-headlines .-hp-container-headlines-element { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.as-contentintro .-hp-container-headlines .-hp-container-headlines-element.-valight-top { position: relative; top: 0%; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); }
@media only screen and (max-width: 700px) { .as-contentintro .-hp-container-headlines .-hp-container-headlines-element.-valight-top { position: relative; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }
.as-contentintro .-hp-container-headlines .-hp-container-headlines-element.-valight-bottom { position: relative; top: 100%; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); }
@media only screen and (max-width: 700px) { .as-contentintro .-hp-container-headlines .-hp-container-headlines-element.-valight-bottom { position: relative; top: 0%; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } }
.as-contentintro .-hp-container-headlines .-hp-container-headlines-element.-valight-center { position: relative; top: 36%; -webkit-transform: translateY(-36%); -ms-transform: translateY(-36%); transform: translateY(-36%); }
@media only screen and (max-width: 700px) { .as-contentintro .-hp-container-headlines .-hp-container-headlines-element.-valight-center { position: relative; top: 0%; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } }
@media only screen and (max-width: 700px) { .as-contentintro .-hp-container-headlines .-hp-container-headlines-element { position: relative; top: 0%; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } }
@media only screen and (max-width: 700px) { .as-contentintro .-hp-container-headlines { width: 100%; position: absolute; top: 0; left: 0; } }
.as-contentintro .hpintro-textl, .as-contentintro .hpintro-textr { padding: 30px; }
.as-contentintro .hpintro-textr { padding-left: 10px; }
.as-contentintro .price { left: 30px; }
.as-contentintro .button-text, .as-contentintro .btn, .as-contentintro .price { bottom: 30px; }
.as-contentintro .intro_list { margin: 0; list-style: none; }
.as-contentintro.is-marketing .hpintro-textl, .as-contentintro.is-marketing .hpintro-textr { padding-top: 16%; }
@media only screen and (max-width: 700px) { .as-contentintro.is-marketing .hpintro-textl, .as-contentintro.is-marketing .hpintro-textr { padding-top: 0; } }
.as-contentintro span.fn.hpintro-textr.fn-tl { top: 15%; left: 14%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textr.fn-tl { top: -webkit-calc(15% - 10px); top: calc(15% - 10px); } }
.as-contentintro span.fn.hpintro-textr.fn-tr { top: 18%; left: 43.5%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textr.fn-tr { top: -webkit-calc(18% - 12px); top: calc(18% - 12px); left: 42.5%; } }
.as-contentintro span.fn.hpintro-textr.fn-bl { top: 67%; left: 14%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textr.fn-bl { top: -webkit-calc(67% - 40px); top: calc(67% - 40px); } }
.as-contentintro span.fn.hpintro-textr.fn-br { top: 67%; left: 42.5%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textr.fn-br { top: -webkit-calc(67% - 40px); top: calc(67% - 40px); } }
.as-contentintro span.fn.hpintro-textl.fn-tl { top: 15%; left: 66%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textl.fn-tl { top: -webkit-calc(15% - 10px); top: calc(15% - 10px); } }
.as-contentintro span.fn.hpintro-textl.fn-tr { top: 15%; left: 94.5%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textl.fn-tr { top: -webkit-calc(15% - 10px); top: calc(15% - 10px); } }
.as-contentintro span.fn.hpintro-textl.fn-bl { top: 68%; left: 66%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textl.fn-bl { top: -webkit-calc(68% - 40px); top: calc(68% - 40px); } }
.as-contentintro span.fn.hpintro-textl.fn-br { top: 68%; left: 94.5%; }
@media only screen and (max-width: 700px) { .as-contentintro span.fn.hpintro-textl.fn-br { top: -webkit-calc(68% - 40px); top: calc(68% - 40px); } }
@media only screen and (max-width: 1100px) { .as-contentintro .hpintro-textl, .as-contentintro .hpintro-textr { padding: 20px; }
  .as-contentintro .hpintro-textr { padding-left: 10px; }
  .as-contentintro .price { left: 20px; }
  .as-contentintro .button-text, .as-contentintro .btn, .as-contentintro .price { bottom: 20px; } }
@media only screen and (max-width: 960px) { .as-contentintro .hpintro-textr { padding-left: 0; }
  .as-contentintro .hpintro-textr .price { left: 0; }
  .as-contentintro .hpintro-textl { padding-right: 0; } }
@media only screen and (max-width: 700px) { .as-contentintro { max-height: none; }
  .as-contentintro .price { bottom: 70px; }
  .as-contentintro .button-text, .as-contentintro .btn { bottom: 10px; }
  .as-contentintro h2.headline1, .as-contentintro h2.headline1-light { position: absolute; top: 10px; left: 10px; right: 10px; font-size: 6vw; text-align: center !important; }
  .as-contentintro .hpintro-textl, .as-contentintro .hpintro-textr { width: 100%; position: static; padding: 0; } }

.teaser-clips-and-bars { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); overflow: hidden; padding: 20px 20px 50px 20px; position: relative; width: 100%; }
.teaser-clips-and-bars .teaser-theme { max-height: 1.4em; overflow: hidden; }
@media only screen and (max-width: 700px) { .teaser-clips-and-bars .teaser-theme { height: auto; } }
.teaser-clips-and-bars h3 { height: 2.5em; margin-bottom: 0; margin-bottom: .7em; overflow: hidden; }
@media only screen and (max-width: 700px) { .teaser-clips-and-bars h3 { height: auto; } }
.teaser-clips-and-bars .teaser-image { background-position: center; background-size: cover; border-top: 1px solid #a6adb8; position: relative; }
.teaser-clips-and-bars .teaser-text { margin: 20px 0; position: relative; z-index: 3; }
.teaser-clips-and-bars .teaser-link { bottom: 10px; left: 0; padding: 0 20px; width: 100%; z-index: 3; }
.teaser-clips-and-bars span.fn { color: #df002e; position: absolute; z-index: 4; }
.teaser-clips-and-bars span.fn.fn-l { left: 35%; top: 35%; }
.teaser-clips-and-bars span.fn.fn-r { left: 85%; top: 36%; }
.teaser-clips-and-bars span.fn.fn-c { left: 61%; top: 77%; }

@media only screen and (max-width: 1100px) { .box.teaser .box-text { padding-top: 10px; } }
.shop-clips { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.shop-clips > div { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; }
@media only screen and (max-width: 700px) { .shop-clips > div { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; } }

.shop-clip { /** shop-clip with only and image and button */ /** shop-clip with an image and text. image at top */ /** shop-clip with an image and text. image at bottom */ /** button on the left side */ /** button on the right side */ /** Fussnoten */ /****************************************************************************************************************** TABLET VIEW */ /****************************************************************************************************************** PHONE VIEW */ }
.shop-clip.box { padding-bottom: 92%; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.15); }
.shop-clip .box-content { padding: 0; }
.shop-clip .shop-clip-text { padding: 0 20px; padding-top: 20px; position: relative; min-height: 33%; }
.shop-clip .shop-clip-text .btn { bottom: 0; }
.shop-clip .shop-clip-image + .shop-clip-text { padding-top: 0; margin-top: 20px; }
.shop-clip .shop-clip-image + .shop-clip-text .btn { bottom: 20px; }
.shop-clip .shop-clip-text + .shop-clip-image { margin-top: 20px; }
.shop-clip .btn { position: absolute; margin: 0; bottom: 20px; }
.shop-clip h3.light { margin-bottom: 5px; }
.shop-clip.image-only .box-content { padding: 0; }
.shop-clip.image-only img { width: 100%; height: 100%; }
.shop-clip.image-only.btn-right .btn { right: 20px; }
.shop-clip.image-only.btn-left .btn { left: 20px; }
.shop-clip.btn-left { float: none; }
.shop-clip.btn-left .btn { left: 20px; }
.shop-clip.btn-right { float: none; }
.shop-clip.btn-right .btn { right: 20px; }
.shop-clip .shop-clip-image { position: relative; }
.shop-clip .shop-clip-image .fn { position: relative; color: red; }
.shop-clip .shop-clip-image .fn-tr { position: absolute; right: 8%; top: 20%; }
.shop-clip .shop-clip-image .fn-br { position: absolute; right: 8%; top: 60%; }
.shop-clip .shop-clip-image .fn-tl { position: absolute; left: 29%; top: 15%; }
.shop-clip .shop-clip-image .fn-bl { position: absolute; left: 30%; top: 58%; }
.shop-clip.image-only .shop-clip-image { bottom: 0; }
.shop-clip.image-only .shop-clip-image .fn-tr { position: absolute; top: 32%; right: 8%; }
.shop-clip.image-only .shop-clip-image .fn-tl { position: absolute; top: 32%; left: 29%; }
.shop-clip.image-only .shop-clip-image .fn-br { position: absolute; top: 61%; right: 8%; }
.shop-clip.image-only .shop-clip-image .fn-bl { position: absolute; top: 61%; left: 29%; }
@media only screen and (max-width: 960px) { .shop-clip h3.light { margin-bottom: 0; }
  .shop-clip h2 { font-size: 1.9rem; line-height: 1.1; }
  .shop-clip .price.price-block { margin-top: 0; }
  .shop-clip .shop-clip-image + .shop-clip-text { margin-top: 15px; }
  .shop-clip .box-content { padding: 0; }
  .shop-clip .shop-clip-text { min-height: 32%; padding: 0 15px; }
  .shop-clip .btn { bottom: 15px; padding: 10px 10px; } }
@media only screen and (max-width: 700px) { .shop-clip.box { padding-bottom: 0; height: auto; }
  .shop-clip .box-content { position: relative; }
  .shop-clip .btn { padding: 5px 20px; }
  .shop-clip .btn { position: relative; left: 0 !important; bottom: 0 !important; margin-bottom: 10px; width: 100%; }
  .shop-clip .shop-clip-image + .shop-clip-text h2 { font-size: 1.5rem; }
  .shop-clip .shop-clip-image + .shop-clip-text .price { margin-top: -4px; } }

.shop-clip.image-only {  /******************************************************************************************************************
* PHONE VIEW
*/ }
@media only screen and (max-width: 700px) { .shop-clip.image-only .btn { margin-bottom: 0; } }

.menubox_list .menubox-wrap { padding: 5px; }

.menu-box { height: 20rem; position: relative; overflow: hidden; }
@media only screen and (max-width: 1100px) { .menu-box { height: 18rem; } }
.menu-box .teaser-image { background-position: center top; background-repeat: no-repeat; height: 100%; position: relative; width: 100%; }
.menu-box img { height: 100%; max-width: none; width: auto; }
.menu-box .hoverbox-content { visibility: hidden; }
.menu-box .hoverbox-content a { color: #fff; font-size: 1.5rem; }
.menu-box.hoverbox:hover .hoverbox-content { visibility: visible; }
.menu-box.hoverbox:hover .hoverbox-content a { text-decoration: none; }

.icon-list { list-style: none outside none; margin-left: 0; padding-top: 10px; border-top: 1px solid #21314d; }
.icon-list.no-border { border: none; }
.icon-list li { margin-bottom: .6rem; padding: 0 0.5em 10px 3em; position: relative; border-bottom: 1px solid #e5e5e5; color: #75b03c; }
.icon-list li:before { left: 0; position: absolute; top: .25em; font-size: 2em; }
.icon-list li:after { right: 0; position: absolute; top: .25em; font-size: 1em; font-weight: bold; }
.icon-list li.is-blue { padding: 0 0.5em 10px 4em; color: #21314d; }
.icon-list li.is-blue:before { top: 0; font-size: 4rem; }
.icon-list a { display: block; }
.icon-list strong { display: block; }

.pagination { margin-bottom: 20px; padding-top: 5px; padding-bottom: 5px; border: 1px solid #cccccc; border-width: 1px 0; }
.pagination .pagination-pages-container { text-align: right; }
@media only screen and (max-width: 700px) { .pagination .pagination-pages-container { text-align: center; }
  .pagination .pagination-pages-container strong { margin-right: 5px; }
  .pagination .pagination-pages-container .only-mobile, .pagination .pagination-pages-container .pagination-pages, .pagination .pagination-pages-container .selectbox { display: inline-block; }
  .pagination .pagination-pages-container .selectbox { width: 50px; margin-bottom: 0; padding: 4px 5px; }
  .pagination .pagination-pages-container .next-page, .pagination .pagination-pages-container .previous-page { margin: 0; padding: 5px; height: 30px; width: 30px; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); background-color: #84bc34; border: none; color: #21314d; }
  .pagination .pagination-pages-container .next-page:hover, .pagination .pagination-pages-container .next-page:hover input, .pagination .pagination-pages-container .previous-page:hover, .pagination .pagination-pages-container .previous-page:hover input { cursor: pointer; text-decoration: none; background-color: #b5d785; -webkit-box-shadow: none; box-shadow: none; }
  .pagination .pagination-pages-container .next-page:before, .pagination .pagination-pages-container .previous-page:before { margin-right: 0; }
  .pagination .pagination-pages-container .next-page { float: right; }
  .pagination .pagination-pages-container .previous-page { float: left; }
  .pagination .pagination-pages-container .next-page.disabled, .pagination .pagination-pages-container .previous-page.disabled { background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-size: 5px 5px; background-color: transparent; border: 1px solid #e5e5e5; -webkit-box-shadow: none; box-shadow: none; color: #7a8394; cursor: not-allowed; }
  .pagination .pagination-pages-container .next-page.disabled:hover, .pagination .pagination-pages-container .previous-page.disabled:hover { background-color: transparent; color: #7a8394; }
  .pagination .pagination-pages-container .next-page.disabled.btn-icon:before, .pagination .pagination-pages-container .previous-page.disabled.btn-icon:before { background: none; }
  .pagination .pagination-pages-container .pagination-pages { top: 0; } }
.pagination .pagination-pages { display: inline-block; margin-left: 30px; margin-right: 30px; position: relative; top: -3px; color: #84bc34; }
.pagination .pagination-pages strong { color: #21314d; }
.pagination a { margin-left: 10px; margin-right: 10px; }
.pagination > a:hover { text-decoration: none; }
.pagination .is-active { font-weight: 700; color: #21314d; }
.pagination .disabled { color: #e5e5e5; }

.pagination-bottom { border-width: 1px 0 0; }

.shipment-tracking { display: table; margin: 0; padding: 0 30px; width: 100%; }
@media only screen and (max-width: 700px) { .shipment-tracking { padding: 0 5px; } }
.shipment-tracking li { display: table-cell; float: left; width: 33.3333%; }
.shipment-tracking li:first-child .start-point { position: absolute; }
.shipment-tracking li:first-child .start-point .tracking-info { left: -30px; }
@media only screen and (max-width: 700px) { .shipment-tracking li:first-child .start-point .tracking-info p { padding-left: 20px; } }
@media only screen and (max-width: 700px) { .shipment-tracking li:last-child .tracking-info p { left: -22px; position: relative; } }
.shipment-tracking .finish-point { text-align: right; }
.shipment-tracking .tracking-info { float: right; left: 30px; text-align: center; padding-top: 60px; position: relative; width: 60px; z-index: 2; }
.shipment-tracking .tracking-info.step-1 { background: url("/assets/placeholder/110x110.jpg") no-repeat scroll 0 0/100% auto; }
.shipment-tracking .tracking-info.step-2 { background: url("/assets/placeholder/110x110.jpg") no-repeat scroll 0 0/100% auto; }
.shipment-tracking .tracking-info.step-3 { background: url("/assets/placeholder/110x110.jpg") no-repeat scroll 0 0/100% auto; }
.shipment-tracking .tracking-info.step-4 { background: url("/assets/placeholder/110x110.jpg") no-repeat scroll 0 0/100% auto; }
@media only screen and (max-width: 700px) { .shipment-tracking li .start-point .tracking-info, .shipment-tracking li .finish-point .tracking-info { background: none; padding-top: 0; } }
.shipment-tracking .tracking-point { background-color: #d3d6db; border-radius: 50%; display: inline-block; height: 30px; margin-top: 1em; width: 30px; }
@media only screen and (max-width: 700px) { .shipment-tracking .tracking-point { height: 20px; width: 20px; } }
.shipment-tracking .tracking-bar { background-color: #d3d6db; height: 15px; position: relative; top: 81px; }
@media only screen and (max-width: 700px) { .shipment-tracking .tracking-bar { height: 10px; top: 18px; } }
.shipment-tracking .is-finished .tracking-bar, .shipment-tracking .is-finished .tracking-point { background-color: #21314d; }

.progressbar-container { position: relative; }
.progressbar-container:before { clear: both; display: block; border-bottom: 1px solid #cccccc; content: ''; position: absolute; left: 0; top: 35px; width: 100%; z-index: 1; }
@media only screen and (max-width: 700px) { .progressbar-container:before { display: none; } }

.progressbar { width: 100%; height: auto; margin-bottom: 50px; margin-left: 0; padding: 0 33.3%; position: relative; z-index: 1; }
@media only screen and (max-width: 700px) { .progressbar { display: inline-block; margin: 0 -5px 5px; padding: 0; width: 100vw; } }
.progressbar:after { content: ''; display: table; clear: both; }
.progressbar li { float: left; list-style: none; text-align: center; padding: 0 20px; width: 50%; }
@media only screen and (max-width: 700px) { .progressbar li { border-right: 1px solid #fff; display: block; float: left; height: 10vw; width: 10vw; } }
.progressbar li:first-child { border-left: none; }
.progressbar li:last-child, .progressbar li.is-active { border-right: none; }
.progressbar li span { background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, #e5e5e5 20%, transparent 20%, transparent 52%, #e5e5e5 52%, #e5e5e5 75%, transparent 75%, transparent); background-size: 5px 5px; display: inline-block; width: 50px; height: 50px; font-family: "canada-type-gibson", sans-serif; font-size: 1.7em; font-weight: 300; line-height: 50px; margin-bottom: 10px; background-color: #fff; border: 1px solid #e5e5e5; color: #7a8394; }
@media only screen and (max-width: 700px) { .progressbar li span { display: block; float: left; line-height: 10vw; height: 10vw; width: 100%; } }
.progressbar li p { font-size: 13px; margin: 0 auto; overflow: hidden; text-align: center; text-overflow: ellipsis; }
@media only screen and (max-width: 700px) { .progressbar li p { visibility: hidden; max-width: 80%; width: 0; margin: 0; }
  .progressbar li p:before { content: ''; display: inline-block; width: 15px; } }
@media only screen and (max-width: 700px) { .progressbar li.is-active { width: 90vw; background-color: #84bc34; border-right: 1px solid #fff; } }
.progressbar li.is-active span { position: relative; background-color: #84bc34; background-image: none; border-color: #84bc34; color: #21314d; }
.progressbar li.is-active span:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -6px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #84bc34 transparent transparent; border-width: 10px 6px 0; content: ''; cursor: pointer; }
@media only screen and (max-width: 700px) { .progressbar li.is-active span { width: 10vw; border-right: 1px solid #fff; -webkit-transition: width 0.2s linear 0.1s; transition: width 0.2s linear 0.1s; } }
@media only screen and (max-width: 700px) { .progressbar li.is-active p { -webkit-transition: width 0.25s linear 0.2s; transition: width 0.25s linear 0.2s; display: block; float: left; height: 10vw; line-height: 10vw; margin-right: -0.25em; text-align: left; text-overflow: ellipsis; width: 100%; white-space: nowrap; visibility: visible; background-color: #84bc34; } }
.progressbar li.is-finished span { background-color: #21314d; border-color: #21314d; background-image: none; color: #fff; }
.progressbar.steps-3 { padding: 0 20%; }
.progressbar.steps-3 li { width: 33.3%; }
.progressbar.steps-4 { padding: 0 20%; }
.progressbar.steps-4 li { width: 25%; }
.progressbar.steps-5 { padding: 0 10%; }
.progressbar.steps-5 li { width: 20%; }
.progressbar.steps-6 { padding: 0 10%; }
.progressbar.steps-6 li { width: 16.6%; }
@media only screen and (max-width: 960px) { .progressbar, .progressbar.steps-3, .progressbar.steps-4, .progressbar.steps-5, .progressbar.steps-6 { padding: 0; } }
@media only screen and (max-width: 700px) { .progressbar, .progressbar.steps-3, .progressbar.steps-4, .progressbar.steps-5, .progressbar.steps-6 { padding: 0; }
  .progressbar li, .progressbar.steps-3 li, .progressbar.steps-4 li, .progressbar.steps-5 li, .progressbar.steps-6 li { padding: 0; width: 10vw; }
  .progressbar.steps-3 .is-active { width: 80vw; }
  .progressbar.steps-4 .is-active { width: 70vw; }
  .progressbar.steps-5 .is-active { width: 60vw; }
  .progressbar.steps-6 .is-active { width: 50vw; } }

.guide-section-desc > .progressbar:last-child { margin: 0 -20px; }

abbr.info-i { border-bottom: none; cursor: pointer; }

#tooltip { background: rgba(33, 49, 77, 0.95); color: #fff; padding: 10px; text-align: left; position: absolute; z-index: 100; }
#tooltip:after { width: 0; height: 0; border-left: .7rem solid transparent; border-right: .7rem solid transparent; border-top: 0.7rem solid rgba(33, 49, 77, 0.95); content: ''; position: absolute; left: 50%; bottom: -.7rem; margin-left: -.4rem; }
#tooltip.top:after { border-top-color: transparent; border-bottom: 10px solid rgba(33, 49, 77, 0.95); top: -20px; bottom: auto; }
#tooltip.left:after { left: 1.4rem; margin: 0; }
#tooltip.right:after { right: 10px; left: auto; margin: 0; }

.info__tooltip { position: relative; font-weight: normal; }
.info__tooltip--content { -webkit-transition: all .15s; transition: all .15s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 0; visibility: hidden; }
.info__tooltip:hover .info__tooltip--content { opacity: 1; visibility: visible; }
.info__tooltip--content { padding: 10px; position: absolute; width: 200px; z-index: 99; background: #fff; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); color: #21314d; }
.info__tooltip--left .info__tooltip--content { margin-top: 6.5px; right: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.info__tooltip--right .info__tooltip--content { left: 100%; margin-top: 6.5px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.info__tooltip--top .info__tooltip--content { bottom: 100%; margin-left: 10px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.info__tooltip--bottom .info__tooltip--content { margin-left: 10px; top: 100%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.info__tooltip--center .info__tooltip--content { left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
@media only screen and (max-width: 700px) { .info__tooltip { display: none; } }

.is-round { display: block; border-radius: 50%; height: 100px; width: 100px; }

.info__tooltip-round { position: relative; }
.info__tooltip-round .is-round { position: relative; }
.info__tooltip-round .content { position: absolute; top: 50px; left: 60px; }

.spinner { margin: 0 auto; width: 70px; text-align: center; }

.spinner > div { width: 18px; height: 18px; background-color: #e5e5e5; border-radius: 100%; display: inline-block; -webkit-animation: bouncedelay 1.4s infinite ease-in-out; animation: bouncedelay 1.4s infinite ease-in-out; /* Prevent first frame from flickering when animation starts */ -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.spinner .bounce1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; }

.spinner .bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; }

.spinner-overlay { bottom: -5px; left: -5px; position: absolute; right: -5px; top: -5px; background: rgba(255, 255, 255, 0.8); }
.spinner-overlay .spinner { margin-top: 2em; }
.spinner-overlay .spinner > div { background-color: #cccccc; }

@-webkit-keyframes bouncedelay { 0%,
  80%,
  100% { -webkit-transform: scale(0); }
  40% { -webkit-transform: scale(1); } }
@keyframes bouncedelay { 0%,
  80%,
  100% { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transform: scale(0); }
  40% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transform: scale(1); } }
.spinner-alt { width: 300px; padding-top: 100px; }
@media only screen and (max-width: 700px) { .spinner-alt { padding-top: 0; } }

.spinner-alt > div { background-color: #84bc34; }

.spinner-blue > div { background-color: #21314d; }

[app-md-step-slider] select { display: none; }

input[app-md-range-slider] { display: none; }

[app-md-step-slider].disabled { opacity: 0.6; }

.rangeslider { position: relative; height: 20px; width: 100%; border: 1px solid #cccccc; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.range-slider { position: relative; position: relative; position: absolute; left: -7px; height: 26px; width: 14px; z-index: 1; cursor: move; }
.range-slider:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -7px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #84bc34 transparent transparent; border-width: 10px 7px 0; content: ''; cursor: pointer; }
.range-slider:before { z-index: 1; }
.range-slider:after { display: block; height: 0; left: 50%; position: absolute; margin-left: -7px; right: 0; top: 100%; width: 0; border-style: solid; border-color: rgba(0, 0, 0, 0.1) transparent transparent; border-width: 8px 8px 0; content: ''; cursor: pointer; }
.range-slider .range-handle { position: relative; top: -7px; left: -7px; height: 33px; width: 14px; background-color: #84bc34; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.range-slider span { position: absolute; bottom: -30px; left: 50%; width: 50px; margin-left: -25px; text-align: center; }
.range-slider:before, .range-slider:after { margin-left: -14px; }

.range-caption { display: inline-block; width: 100%; margin-left: -90px; margin-top: 60px; text-align: center; }
.range-caption.is-active { color: #84bc34; }

.range-segment { float: left; width: 100%; height: 100%; background-color: #f2f2f2; border-right: 1px solid #cccccc; }
.range-segment.is-active .range-caption { color: #84bc34; }
.range-segment.highlight { background-color: #fcf8e5; }

.range-segment:nth-child(2) .range-caption { text-align: left; margin-left: 0; }

.range-segment:last-child { border: none; width: 0; }

.range-highlight { position: absolute; height: 100%; width: 0; background-color: #cccccc; }

.rzslider { position: relative; display: inline-block; width: 100%; height: 4px; margin: 0 0 15px 0; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.rzslider.with-legend { margin-bottom: 40px; }
.rzslider span { position: absolute; display: inline-block; white-space: nowrap; }
.rzslider .rz-base { width: 100%; height: 100%; padding: 0; }
.rzslider .rz-bar-wrapper { left: 0; z-index: 1; width: 100%; height: 32px; padding-top: 16px; margin-top: -16px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.rzslider .rz-bar-wrapper.rz-draggable { cursor: move; }
.rzslider .rz-bar { left: 0; z-index: 1; width: 100%; height: 4px; background: #d3d6db; border-radius: 2px; }
.rzslider .rz-bar.rz-selection { z-index: 2; background: #21314d; border-radius: 2px; }
.rzslider .rz-pointer { top: -10px; z-index: 3; width: 22px; height: 22px; cursor: pointer; background-color: #7a8394; border-radius: 16px; outline: none; }
.rzslider .rz-pointer:hover { background-color: #21314d; }
.rzslider .rz-pointer.rz-active { z-index: 4; }
.rzslider .rz-pointer.rz-active:after { background-color: #451aff; }
.rzslider .rz-bubble { bottom: 16px; padding: 1px 3px; color: #55637d; cursor: default; }
.rzslider .rz-bubble.rz-selection { top: 16px; }
.rzslider .rz-bubble.rz-limit { color: #55637d; }
.rzslider .rz-ticks { position: absolute; top: -3px; left: 0; z-index: 1; width: 100%; height: 0; margin: 0; list-style: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.rzslider .rz-ticks .rz-tick { position: absolute; top: 1px; left: 0; width: 8px; height: 8px; margin-left: 10px; text-align: center; cursor: pointer; background: #d3d6db; border-radius: 50%; }
.rzslider .rz-ticks .rz-tick.rz-selected { background: #21314d; }
.rzslider .rz-ticks .rz-tick .rz-tick-value { position: absolute; top: -30px; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); }
.rzslider .rz-ticks .rz-tick .rz-tick-legend { position: absolute; top: 24px; max-width: 50px; white-space: normal; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); }
.rzslider .rz-ticks.rz-ticks-values-under .rz-tick-value { top: initial; bottom: -32px; }

.rzslider[disabled] { cursor: not-allowed; }

.rzslider[disabled] .rz-pointer { cursor: not-allowed; background-color: #d8e0f3; }

.rzslider[disabled] .rz-bar-wrapper.rz-draggable { cursor: not-allowed; }

.rzslider[disabled] .rz-bar.rz-selection { background: #8b91a2; }

.actual-value-speicher { line-height: 4.6rem; }

.clock.flip-clock-wrapper { display: inline-block; margin: 10px 0; width: auto; background-color: #f2f2f2; background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), color-stop(50%, #999999), to(#f2f2f2)); background: -webkit-linear-gradient(top, #f2f2f2 0%, #999999 50%, #f2f2f2 100%); background: linear-gradient(to bottom, #f2f2f2 0%, #999999 50%, #f2f2f2 100%); font-family: "Open Sans", sans-serif; }
.clock.flip-clock-wrapper .flip { margin: 0; width: 50px; -webkit-box-shadow: none; box-shadow: none; background: transparent; }
.clock.flip-clock-wrapper .inn { border-radius: 0; background-color: #f2f2f2; background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), color-stop(50%, #999999), to(#f2f2f2)); background: -webkit-linear-gradient(top, #f2f2f2 0%, #999999 50%, #f2f2f2 100%); background: linear-gradient(to bottom, #f2f2f2 0%, #999999 50%, #f2f2f2 100%); color: #21314d; text-shadow: 0 1px 2px rgba(255, 255, 255, 0.4); }
.clock.flip-clock-wrapper .down { border-radius: 0; }
.clock.flip-clock-wrapper .up:after { height: 1px; background: rgba(255, 255, 255, 0.4); }
.clock .flip-clock-divider { height: 90px; width: 3px; background: #fff; }
.clock .flip-clock-divider span.flip-clock-label { padding: 10px 0; right: -100px; top: 100%; width: 100px; border-top: 3px solid #fff; background: #21314d; color: #fff; font-family: "canada-type-gibson", sans-serif; text-align: center; text-transform: uppercase; }
.clock .flip-clock-dot { display: none; }
.clock .flip-clock-label { display: none; }
.clock.is-counter { margin-bottom: 40px; }
.clock.is-counter .flip-clock-label { display: block; }

@media only screen and (max-width: 960px) { .clock.flip-clock-wrapper .flip { height: 80px; width: 40px; }
  .clock.flip-clock-wrapper .inn { font-size: 50px; line-height: 77px; }
  .clock.flip-clock-wrapper .up:after { top: 39px; }
  .clock .flip-clock-divider { height: 80px; }
  .clock .flip-clock-divider span.flip-clock-label { right: -80px; width: 80px; } }
@media (max-width: 400px) { .clock.is-counter .seconds, .clock.is-counter .seconds ~ .flip { display: none; } }
.ib { overflow: hidden; padding-bottom: 100%; position: relative; border-radius: 50%; background: #a6adb8; }
.ib:hover { background: #84bc34; }

.ib_ow { bottom: 0; left: 0; position: absolute; right: 0; top: 0; }

.ib_iw { display: table; height: 100%; width: 100%; }

.ib_c { display: table-cell; padding: 10px; text-align: center; vertical-align: middle; }
@media only screen and (max-width: 700px) { .ib_c { padding: 5px; } }
.ib_c.has-icon img { margin-bottom: 5px; max-width: 30%; }
.ib_c.has-hover .as-hover { display: none; padding: 10px; }
.ib_c.has-hover:hover .as-default { display: none; }
.ib_c.has-hover:hover .as-hover { display: block; }

.oidc-login-overlay { background: rgba(33, 49, 77, 0.9); bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 999; }
.oidc-login-overlay img { height: 128px; left: 50%; position: absolute; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 96px; }

/* TODO: Eigende Datei für jeden Eintrag im Styleguide erstellen (pni) */
.search-result { margin-bottom: 1rem; }
.search-result h3 { margin: 0.5rem 0; }
.search-result .uppercase { color: #7a8394; }
.search-result p { margin-bottom: 1rem; padding-right: 40px; }
@media only screen and (max-width: 700px) { .search-result p { padding-right: 0; } }
.search-result a { text-decoration: none; color: inherit; }
.search-result a:hover { text-decoration: none; }
.search-result a:hover .search-more { text-decoration: underline; }
.search-result a.search-more { color: #84bc34; }
.search-result a.search-more:hover { text-decoration: underline; }
.search-result img { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }

.grid-search-image { padding-right: 30px; }

/* TODO: Sieht im Styleguide nicht so aus, wie in der Realität -> in Organismus überführen? (pni */
.search-result .float-right { color: #7a8394; }

/* TODO Bild zu groß, fließt über Text (pni) */
#search-layer { display: block; left: 0; padding: 40px 0; position: absolute; width: 100%; z-index: 4; }
#search-layer.mobile { padding: 0 20px; z-index: 9; }

.search-content { width: 400px; text-align: left; }
.search-content .micro { position: absolute; right: 0; top: -10px; width: 40px; cursor: pointer; }
.search-content .speech-hint { padding: 10px; position: absolute; width: 200px; z-index: 99; background: #fff; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); color: #21314d; opacity: 0; visibility: hidden; }
.search-content .speech-hint:not(.start-speech) { right: 100%; top: 20px; width: 400px; }
.search-content .micro:hover .speech-hint:not(.start-speech).is-active, .search-content .speech-hint.start-speech.is-active { opacity: 1; visibility: visible; }
.search-content.mobile { display: none; }
@media only screen and (max-width: 960px) { .search-content.mobile { display: block; padding: 10px; } }
.search-content.mobile .micro { right: -5px; top: -13px; }
.search-content.mobile .speech-hint { left: -237px; }
.search-content.mobile .speech-hint:not(.start-speech) { top: 40px; width: 300px; }
.search-content.mobile .micro:hover .speech-hint:not(.start-speech).is-active, .search-content.mobile .speech-hint.start-speech.is-active { opacity: 1; visibility: visible; }
.search-content.mobile .input-container { display: inline; }
@media only screen and (max-width: 960px) { .search-content { max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px); overflow: auto; } }
.search-content.search-result-page { background: #fff; overflow: visible; width: auto; }
.search-content .presuggestion-container { left: 0; padding: 0; width: 100%; z-index: 13; background-color: #fff; overflow: hidden; }
@media only screen and (max-width: 700px) { .search-content .presuggestion-container { position: absolute; } }
.search-content .presuggestion-container ul { height: 0; min-height: 0; overflow: hidden; -webkit-transition: min-height 0.5s; transition: min-height 0.5s; }
.search-content .presuggestion-container.is-active { overflow: visible; padding: 1rem 0; }
@media only screen and (max-width: 700px) { .search-content .presuggestion-container.is-active { padding: 1rem 5px; }
  .search-content .presuggestion-container.is-active.mobile { padding: 1rem 10px; } }
.search-content .presuggestion-container.is-active ul { height: 100%; min-height: 215px; }
.search-content h3 { border-bottom: 1px solid #e5e5e5; padding-bottom: 10px; }
.search-content ul { margin-bottom: 0; }
.search-content .frequent { position: relative; }
.search-result-page .search-content .frequent { padding: 0 20px 20px; }
.search-content .frequent h3 { color: #fff; }
.search-content .frequent li { float: left; width: 50%; }
.search-content .close { position: absolute; right: 20px; top: 20px; cursor: pointer; }
.search-content span.ellipsis { display: block; /* Fallback for non-webkit */ display: -webkit-box; height: 5.46rem; /* Fallback for non-webkit */ -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }

.search-content { background: #fff; overflow: visible; width: 100%; }
.search-content.only-mobile { padding: 10px 10px 0; }
.search-content .input-container input[type=search] { margin-bottom: 0; border-radius: none; -webkit-appearance: none; }
@media only screen and (max-width: 960px) { .search-content .input-container input[type=search] { width: -webkit-calc(100% - 40px); width: calc(100% - 40px); } }
@media only screen and (max-width: 700px) { .search-content .input-container input[type=search] { font-size: 16px; } }
.search-content .input-container input[type=search]::-webkit-input-placeholder { font-style: italic; }
.search-content .input-container input[type=search]::-moz-placeholder { font-style: italic; }
.search-content .input-container input[type=search]:-ms-input-placeholder { font-style: italic; }
.search-content .input-container input[type=search]::placeholder { font-style: italic; }
.search-content #hidden-text, .search-content #hidden-text-mobile { height: 0; visibility: hidden; }
.search-content .autocomplete { position: absolute; top: 1px; }
.search-content .acc-autocomplete { font-weight: bold; cursor: pointer; }
.search-content .search-phrase { cursor: pointer; }
.search-content .input-container { display: inline; position: relative; }
.search-content span.btn-small { width: 30px; height: 30px; min-width: 30px; margin: 0 0 0 5px; background-color: #fff; -webkit-box-shadow: none; box-shadow: none; }
.search-content span.btn-small:before { top: 1px; margin: 0; left: 0; width: 30px; color: #21314d; }
.search-content span.btn-small.is-active:before { content: ''; }
.search-content .frequent { margin: 5px 0 10px; display: block; background-color: #fff; left: 0; padding: 0 0 20px; width: 100%; z-index: 10; }
@media only screen and (max-width: 700px) { .search-content .frequent { padding: 0 20px 20px; position: absolute; } }
.search-content .frequent ul { list-style-type: none; background-color: #fff; margin: 0; }
.search-content .frequent li { float: none; width: 100%; }
.search-content .frequent li span { color: #21314d; padding: 5px; display: block; cursor: pointer; text-decoration: none; }

@media only screen and (max-width: 960px) { .search-header > div { padding: 5px 10px; } }
.search-header input { height: 40px; padding: 4px 10px; margin-bottom: 0; }
.search-header .as-table .as-tablecell:last-child { width: 40px; line-height: 40px; }
.search-header .as-table .as-tablecell:last-child span { top: -2px; height: 40px; width: 40px; vertical-align: middle; }
.search-header .as-table .as-tablecell:last-child span:before { margin: 0 11px; line-height: 40px; }
.search-header .as-table .as-tablecell:last-child span input { height: 40px; width: 40px; }
.search-header .search-close { top: 22px; position: absolute; right: 10px; cursor: pointer; }
@media only screen and (max-width: 960px) { .search-header .search-close { top: 17px; } }
.search-header .search-close [data-icon]:before { margin: 0; }
.search-header .autocompletion { top: 21px; position: absolute; font-weight: 700; left: 0; }
.search-header .spellcheck { padding: 0 0 0; line-height: 1rem; }
.search-header .micro { position: absolute; right: 25px; top: 10px; width: 40px; cursor: pointer; }
@media only screen and (max-width: 960px) { .search-header .micro { top: 7px; } }
@media only screen and (max-width: 700px) { .search-header .micro { top: 5px; } }
.search-header .speech-hint { padding: 10px; position: absolute; width: 200px; z-index: 99; background: #fff; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); color: #21314d; opacity: 0; visibility: hidden; }
@media only screen and (max-width: 700px) { .search-header .speech-hint { left: -237px; } }
.search-header .speech-hint:not(.start-speech) { right: 100%; top: 20px; width: 400px; }
@media only screen and (max-width: 700px) { .search-header .speech-hint:not(.start-speech) { left: -237px; top: 40px; width: 300px; } }
.search-header .micro:hover .speech-hint:not(.start-speech).is-active, .search-header .speech-hint.start-speech.is-active { opacity: 1; visibility: visible; }

body#suche .search, body#suche .search-content.mobile { display: none; }

.search { display: inline-block; float: right; margin-top: 0; }
nav + .search { display: none; }
@media only screen and (max-width: 1100px) { .search { margin-right: 15px; } }
@media only screen and (max-width: 960px) { .search { margin-top: 0; margin-right: 5px; } }
.search form { position: relative; width: 100%; }
@media only screen and (max-width: 960px) { .search form { margin-top: 0; display: none; }
  .search form.is-active { display: block; z-index: 5; }
  .search form .btn-small { display: none; } }
.search .form-item { display: block; }
.search .form-item input[type=text] { border-color: #cccccc; border-width: 0 0 2px; border-style: solid; -webkit-box-shadow: none; box-shadow: none; }
.search .form-item input[type=text]::-webkit-input-placeholder { font-style: normal; }
.search .form-item input[type=text]::-moz-placeholder { font-style: normal; }
.search .form-item input[type=text]:-ms-input-placeholder { font-style: normal; }
.search .form-item input[type=text]::placeholder { font-style: normal; }
@media only screen and (max-width: 960px) { .search .form-item { position: relative; }
  .search .form-item input { width: 200px; position: absolute; top: 100%; right: 0; } }
.search .btn-small { margin-left: 2px; }
.search .btn-small:before { font-size: 1.6rem; }
.search .search-icon.not-mobile { display: block; padding: 10px; margin-bottom: 9px; position: relative; width: 140px; background-color: white; cursor: pointer; }
.search .search-icon.not-mobile::after { position: absolute; right: 10px; top: 5px; }
.search .search-icon.not-mobile::before { content: 'SUCHE'; }
.search .search-icon.not-mobile.is-open::before { content: 'SCHLIEßEN'; }
.search .search-icon.not-mobile.is-open::after { content: "\e6fd"; }
@media screen and (min-width: 961px) and (max-width: 993px) { .search .search-icon.not-mobile { width: 104px; display: block; } }
.search .search-icon.not-mobile:after { color: #21314d; font-size: 2rem; }
.search .is-flexbox > div:first-of-type { padding-left: 0; }
.search .is-flexbox > div > div { border: 2px solid #e5e5e5; padding: 20px; }

.filter-wrapper.search-filter { position: relative; }
@media only screen and (max-width: 1100px) { .filter-wrapper.search-filter { position: absolute; } }

.filter-result-search { position: relative; top: 0; width: 255px; list-style: outside none none; margin: 0; }
@media only screen and (max-width: 1100px) { .filter-result-search { position: relative; top: 0; width: 100%; } }
.filter-result-search > li { border-bottom: 1px solid #f2f2f2; }
.filter-result-search > li.is-active > .head { position: relative; background-color: #21314d; border-bottom: none; color: #fff; }
.filter-result-search > li.is-active > .head:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; }
.filter-result-search > li.is-active > .head .arrow:before { content: '\e7c5'; }
.filter-result-search > li.is-checked > .head { background-color: #21314d; color: #fff; }
.filter-result-search > li:last-child { border-bottom: none; }
.filter-result-search > li > .head { background-color: #a6adb8; line-height: 5rem; position: relative; z-index: 2; padding-left: 10px; padding-right: 20px; cursor: pointer; }
.filter-result-search > li > .head .is-icon { width: 50px; height: 50px; padding-top: 3px; font-size: 25px; }
.filter-result-search > li > .head .arrow { position: absolute; right: 15px; top: 2px; }
.filter-result-search > li > .head .arrow:before { content: '\e7c4'; font-family: "icons"; font-size: 1.8rem; line-height: 4.6rem; }
.filter-result-search > li .filter-conditions { overflow: hidden; padding: 0 20px; }

.filter-result-search .filter-conditions { background-color: #f2f2f2; color: #21314d; height: 0; }
.filter-result-search .filter-conditions .criteria { cursor: pointer; position: relative; }
.filter-result-search .filter-conditions .criteria strong { display: block; line-height: 4.6rem; }
.filter-result-search .filter-conditions .criteria .arrow { position: absolute; right: -2px; top: 2px; }
.filter-result-search .filter-conditions .criteria .arrow:before { content: '\e7c4'; font-family: "icons"; font-size: 1.8rem; line-height: 4.6rem; }
.filter-result-search .filter-conditions .cond { height: 0; }
.filter-result-search .filter-conditions .col { border-bottom: 2px solid #d3d6db; color: #7a8394; }
.filter-result-search .filter-conditions .col.is-open { color: #21314d; padding: 0 0 10px; }
.filter-result-search .filter-conditions .col.is-open .cond { height: auto; }
.filter-result-search .filter-conditions .col.is-open .arrow:before { content: '\e7c5'; }
.filter-result-search .filter-conditions .col:last-child { border-bottom: 0; }
.filter-result-search .filter-conditions .group-checkbox { width: 100%; }
.filter-result-search .filter-conditions .group-checkbox label { margin-bottom: 0; }
.filter-result-search .filter-conditions .num { display: inline-block; line-height: 1.8; }

.filter-result-search > li.is-active .filter-conditions { height: auto; }

.logo { position: relative; display: inline-block; height: 60px; padding: 5px 0 0; top: 25px; width: 161px; z-index: 5; }
@media only screen and (max-width: 1100px) { .logo { width: 150px; } }
@media only screen and (max-width: 960px) { .logo { position: absolute; line-height: 5.5rem; padding: 0; top: 0; left: 8px; overflow: hidden; } }
.logo img { width: 100%; }

.blue-nav { display: block; float: right; list-style: none; margin: 0; }
.blue-nav > li { display: block; background: #21314d; position: relative; float: left; }
.blue-nav > li [data-icon-after] { display: block; color: #fff; cursor: pointer; padding: 5px 30px 5px 15px; text-decoration: none; border-right: 1px solid #a6adb8; }
.blue-nav > li [data-icon-after]:after { padding: 1px 0 0 5px; position: absolute; right: 10px; top: 4px; }
.blue-nav > li:last-child [data-icon-after] { border-right: none; }
.blue-nav > li:hover, .blue-nav > li.is-active { background-color: #f2f2f2; }
.blue-nav > li:hover [data-icon-after], .blue-nav > li.is-active [data-icon-after] { color: #21314d; }
.blue-nav > li.is-current [data-icon-after] { color: #84bc34; }
.blue-nav > li.is-active [data-icon-after]:hover { background-color: #f2f2f2; border-color: #f2f2f2; color: #21314d; }
@media only screen and (max-width: 960px) { .blue-nav > li.is-active [data-icon-after]:hover { background-color: transparent; color: #fff; } }
.blue-nav > li#shopsBlock [data-icon-after]:after { content: '\e946'; font-size: 2rem; top: -2px; }
@media only screen and (max-width: 960px) { .blue-nav > li#shopsBlock [data-icon-after]:after { font-size: 2.5rem; top: 12px; } }
.blue-nav > li.home-block.is-active a { color: #84bc34; background-color: #21314d; }
.blue-nav > li.login-block { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; min-width: 21rem; }
@media only screen and (max-width: 960px) { .blue-nav > li.login-block { min-width: 40px; } }
.blue-nav > li.shops span:after { font-size: 1.6rem; top: 1px; }
.blue-nav > li.shops .user-status-content { min-width: 210px; left: 0; background: inherit; }
.blue-nav > li.shops .user-status-content .field-item { width: auto; }
@media only screen and (max-width: 960px) { .blue-nav > li.shops .user-status-content .field-item { width: 100%; } }
@media only screen and (max-width: 960px) { .blue-nav > li.shops { color: #fff; } }
.blue-nav .search-block, .blue-nav .pushmenu-block { display: none; }

@media only screen and (max-width: 960px) { .blue-nav .search-block, .blue-nav .pushmenu-block { display: block; } }
@media only screen and (max-width: 960px) { .blue-nav { height: 100%; padding-left: 0; margin-right: 0; }
  ul.blue-nav > li.is-active, ul.blue-nav > li.pseudo-class-hover { background-color: #21314d; }
  .blue-nav > li { position: static; height: 60px; background-color: transparent; }
  .blue-nav > li:hover { background-color: #21314d; }
  .blue-nav > li.is-active, .blue-nav > li.pseudo-class-hover { background-color: #21314d; }
  .blue-nav > li.is-active [data-icon-after]:hover, .blue-nav > li.pseudo-class-hover [data-icon-after]:hover { background-color: transparent; color: #fff; }
  .blue-nav > li.login-block { position: static; min-width: 40px; }
  .blue-nav > li.search-block, .blue-nav > li.contact-block, .blue-nav > li.search-block { position: static; }
  .blue-nav > li.shops [data-icon-after]:after { color: #fff; font-size: 2rem; position: absolute; top: 15px; right: auto; }
  .blue-nav > li [data-icon-after] { position: relative; border: none; font-size: 0; padding: 0; width: 40px; height: 0; }
  .blue-nav > li [data-icon-after]:after { color: #fff; font-size: 2rem; position: absolute; top: 15px; right: auto; } }
/*.blue-nav .shopping-cart-block { @include breakpoint(tablet-portrait){ //position: static; }
}*/
@media only screen and (max-width: 960px) { .shopping-cart-status { position: absolute; left: 0; width: 100%; } }

.cart-wrapper { max-height: 0; overflow: hidden; position: absolute; left: 0; width: 42.7rem; z-index: 10; }
@media only screen and (max-width: 960px) { .cart-wrapper { top: 60px; left: 0; right: 0; width: 100%; margin: 0; } }
.is-active .cart-wrapper { max-height: 1000px; }
@media only screen and (max-width: 960px) { .is-active .cart-wrapper { max-height: 80vh; max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px); overflow: auto; } }

.shopping-cart-content { background: #f2f2f2; -webkit-box-shadow: 1px 4px 4px 1px rgba(0, 0, 0, 0.12); box-shadow: 1px 4px 4px 1px rgba(0, 0, 0, 0.12); margin-left: 0; max-height: 0; overflow: hidden; padding: 1em 0 0; position: absolute; left: 0; width: 42.7rem; z-index: 10; }
@media only screen and (max-width: 960px) { .shopping-cart-content { padding: 0; top: 60px; left: 0; right: 0; width: 100%; margin: 0; } }
.is-active .shopping-cart-content { max-height: 1000px; }
@media only screen and (max-width: 960px) { .is-active .shopping-cart-content { max-height: 80vh; max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px); overflow: auto; } }

.user-status { position: relative; background: #f2f2f2; }
@media only screen and (max-width: 960px) { .user-status { position: static; } }

.user-status-content { margin-left: 0; max-height: 0; overflow: hidden; padding: 1em 0 0; position: absolute; z-index: 10; background: inherit; -webkit-box-shadow: 1px 4px 4px 1px rgba(0, 0, 0, 0.12); box-shadow: 1px 4px 4px 1px rgba(0, 0, 0, 0.12); }
.is-active .user-status-content { max-height: 1000px; }
@media only screen and (max-width: 960px) { .is-active .user-status-content { max-height: 80vh; max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px); overflow: auto; } }
.user-status-content .btn { margin: 10px 0 20px; }
.user-status-content .layer-content { padding: 0 15px; }
.user-status-content .layer-content .list { margin-top: 1rem; }
@media only screen and (max-width: 960px) { .user-status-content { top: 60px; left: 0; right: 0; width: 100%; margin: 0; } }

.user-register { padding: 15px 20px 1px; }

@media only screen and (max-width: 960px) { .home-block { display: none !important; } }

#searchBlock { display: none; }
@media only screen and (max-width: 960px) { #searchBlock { display: block; } }

.user-logged-in { padding: 1em 0 0; }
.user-logged-in > div { padding: 0 20px 0; }
.user-logged-in > strong, .user-logged-in > span { padding: 0 20px; }
.user-logged-in .list { margin-top: 1rem; }

.breadcrumb { color: #fff; min-height: 30px; padding: 5px 0 5px; background-color: #21314d; }
@media only screen and (max-width: 960px) { .breadcrumb { display: none; } }
.breadcrumb .inner-wrapper { padding-left: 18.6rem; }
@media only screen and (max-width: 960px) { .breadcrumb .inner-wrapper { padding-left: 6.4rem; } }
.breadcrumb span { display: inline-block; margin-right: 10px; }
.breadcrumb a, .breadcrumb a:after { color: #fff; }
.breadcrumb a:hover { text-decoration: none; }
.breadcrumb a:after { position: relative; top: 2px; }
.breadcrumb a:last-child:after { content: none; }

.nav-list > li > a.is-current { background-color: #21314d; color: #fff; }
.nav-list > li > a.is-active { background-color: rgba(255, 255, 255, 0.4); }

header .subnav { background-color: #fff; font-size: 1.4rem; left: 0; min-height: 200px; padding: 20px 0; position: absolute; text-align: left; top: 59px; width: 100%; z-index: 10; }
@media only screen and (max-width: 1100px) { header .subnav .inner-wrapper { padding: 0 15px; } }
header .subnav a { color: #21314d; }
header .subnav .item-highligh *, header .subnav .is-white a { color: #fff; }
header .subnav .col, header .subnav .row { float: left; padding: 5px 20px 20px; width: 18.75%; }
header .subnav .col .main, header .subnav .row .main { display: block; font-weight: 700; margin-bottom: 1em; white-space: normal; }
header .subnav .col .subnav-more, header .subnav .row .subnav-more { font-weight: 700; }
header .subnav .col ul + a.main, header .subnav .col a.main + a.main, header .subnav .row ul + a.main, header .subnav .row a.main + a.main { margin-top: 15px; }
header .subnav .col a, header .subnav .row a { font-size: 1.5rem; font-weight: normal; line-height: 2.2rem; padding: 0; white-space: nowrap; }
@media only screen and (max-width: 1100px) { header .subnav .col a, header .subnav .row a { font-size: 1.4rem; } }
header .subnav .row { padding: 0; width: 100%; }
header .subnav .row.row-bottom .subnav-list { display: table; width: 100%; }
header .subnav .row.row-bottom .subnav-list li { display: table-cell; height: 70px; text-align: center; }
header .subnav .row.row-bottom .subnav-list li a { background-position: center; background-repeat: no-repeat; background-size: contain; display: block; height: 100%; width: 100%; }
header .subnav .row.row-bottom .subnav-list li a:hover:before { content: none; margin: 0; }
header .subnav .subnav-list { float: none; padding: 0; }
header .subnav .subnav-list li { display: block; height: auto; }
header .subnav .subnav-list li a { line-height: 2.4rem; }
@media only screen and (max-width: 1100px) { header .subnav .subnav-list li a { line-height: 2.2rem; } }
header .subnav .subnav-list li a.is-active { background: transparent; }
header .subnav .subnav-item { height: 20rem; padding: 15px 15px 15px 25px; position: relative; }
@media only screen and (max-width: 1100px) { header .subnav .subnav-item { height: 18rem; } }
header .subnav .item-icon, header .subnav .item-circle-icon { padding: 15px 10px; }
@media only screen and (max-width: 1100px) { header .subnav .item-icon .headline2, header .subnav .item-icon .headline2-light, header .subnav .item-circle-icon .headline2, header .subnav .item-circle-icon .headline2-light { font-size: 16px; line-height: 1.4; }
  header .subnav .item-icon .icon-circle, header .subnav .item-circle-icon .icon-circle { font-size: 28px; margin: 0 3px; padding-top: 4rem; width: 4rem; } }
header .subnav .item-image { padding: 15px; }
header .subnav .item-image .img-single { height: 60%; }
@media only screen and (max-width: 1100px) { header .subnav .item-image .img-single { height: 55%; } }
header .subnav .item-image .img-single img { height: 100%; }
header .subnav .item-image .img-single .icon-center img { margin-top: 0; max-height: none; -webkit-transition: all .1s ease .01s; transition: all .1s ease .01s; }
header .subnav .item-image:hover .icon-center img { height: 140%; margin-top: -7%; }
header .subnav .item-icon span[data-icon] { margin-bottom: 20px; }
header .subnav .item-icon span[data-icon]:before { font-size: 8rem; margin: 0; }
header .subnav .item-icon .hoverbox-content { background-color: inherit; }
header .subnav .item-icon .hoverbox-content a { height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
header .subnav .item-icon .hoverbox-content a, header .subnav .item-icon .hoverbox-content a:before { line-height: 20rem; }
@media only screen and (max-width: 1100px) { header .subnav .item-icon .hoverbox-content a, header .subnav .item-icon .hoverbox-content a:before { line-height: 18rem; } }
header .subnav .item-icon .hoverbox-content:hover a { text-decoration: none; }
header .subnav .item-highlight a { color: #fff; }
header .subnav .item-double > div { height: 10rem; }
header .subnav .item-double > div img { height: 100%; margin-top: 0; -webkit-transition: all .1s ease .01s; transition: all .1s ease .01s; }
@media only screen and (max-width: 1100px) { header .subnav .item-double > div img { height: 70%; } }
header .subnav .item-double > div:hover img { height: 120%; margin-top: -10%; max-width: none; }
@media only screen and (max-width: 1100px) { header .subnav .item-double > div:hover img { height: 90%; } }
header .subnav .item-double .img-half { height: 100%; position: relative; }
header .subnav .item-double .img-half img { height: 80%; margin-top: 5%; }
header .subnav .item-double:hover .img-half img { height: 100%; margin-top: 0; }
header .subnav .item-triple .box-text img { -webkit-transition: all .2s ease .03s; transition: all .2s ease .03s; }
header .subnav .item-triple .box-text strong { text-align: left; margin-left: 25%; }
@media only screen and (max-width: 1100px) { header .subnav .item-triple .box-text strong { margin-left: 6vw; } }
header .subnav .item-triple:hover .box-text { opacity: 1; }
header .subnav .item-triple .item-icon:hover .mm__box-icon img { opacity: 1; width: 70%; }
header .subnav .item-half { display: table; height: 9.5rem; margin-bottom: 10px; width: 100%; }
@media only screen and (max-width: 1100px) { header .subnav .item-half { height: 8.5rem; } }
header .subnav .item-half:last-child { margin-bottom: 0; }
header .subnav .item-half span { display: table-cell; font-size: 1.5rem; font-weight: 700; text-transform: uppercase; vertical-align: middle; }
header .subnav .item-half:hover span { text-decoration: underline; }
header .subnav .col-full { width: 25%; }
header .subnav .col-full a.teaser-full, header .subnav .col-full a.teaser-half { text-align: center; }
header .subnav .col-full a.teaser-full img, header .subnav .col-full a.teaser-half img { display: block; margin: 0 auto; }
header .subnav .col-full a.teaser-full .title, header .subnav .col-full a.teaser-half .title { color: #84bc34; text-transform: uppercase; }
header .subnav .col-full a.teaser-full:hover, header .subnav .col-full a.teaser-half:hover { text-indent: 0; }
header .subnav .col-full a.teaser-full:hover:before, header .subnav .col-full a.teaser-half:hover:before { display: none; }
header .subnav .col-full a.teaser-full p, header .subnav .col-full a.teaser-half p { font-size: 1.3rem; font-weight: normal; line-height: 1em; margin: 0; white-space: normal; }
header .subnav .col-full a.teaser-full img { width: 80px; }
header .subnav .col-full a.teaser-half { float: left; width: 50%; }
header .subnav .col-full a.teaser-half img { width: 100%; }
header .subnav .col-full a.teaser-icon { line-height: 3rem; }
header .subnav .col-full a.teaser-icon:before { color: #cccccc; font-size: 3rem; line-height: 3rem; vertical-align: middle; }
header .subnav .col-full a.teaser-icon:hover { color: #000; }
header .subnav .col-full a.teaser-icon:hover:before { color: #000; text-shadow: 1px 2px 5px rgba(0, 0, 0, 0.75); }

/** campaign column in navigation
*/
nav .col-campaign { background-color: #84bc34; position: absolute; clear: both; font-size: 1.3rem; padding: 10px; margin-top: 60px; left: 0; right: 0; bottom: 0; }
nav .col-campaign .campaign-image { width: 25%; display: inline-block; position: absolute; left: 0; bottom: 0; }
nav .col-campaign .campaign-image img { position: absolute; bottom: -10px; left: 50%; margin-left: -105px; max-width: 190px; }
@media only screen and (max-width: 960px) { nav .col-campaign .campaign-image img { max-width: 120px; margin-left: -70px; } }
nav .col-campaign .campaign-text { display: inline-block; width: 50%; left: 25%; position: relative; }
nav .col-campaign h3, nav .col-campaign p { margin: 0; }
nav .col-campaign a.btn { float: right; font-size: 1.3rem; line-height: 3.5rem; text-transform: none; margin-right: 0; color: #fff; }

.is-ie9 .header .subnav .item-icon span[data-icon]::before, .is-ie10 .header .subnav .item-icon span[data-icon]::before { display: block; }
.is-ie9 .header .subnav .item-icon .mm__box-icon + span, .is-ie10 .header .subnav .item-icon .mm__box-icon + span { visibility: hidden; }
.is-ie9 .header .subnav .item-icon:hover .mm__box-icon + span, .is-ie10 .header .subnav .item-icon:hover .mm__box-icon + span { visibility: visible; }
.is-ie9 .header .subnav .item-icon:hover .mm__box-icon img, .is-ie10 .header .subnav .item-icon:hover .mm__box-icon img { opacity: 0; }
.is-ie9 .header .subnav .item-triple .item-icon:hover .mm__box-icon img, .is-ie10 .header .subnav .item-triple .item-icon:hover .mm__box-icon img { opacity: 1; }
.is-ie9 .header .subnav .mm__box-icon, .is-ie10 .header .subnav .mm__box-icon { position: static; }

.mm__subnav .row > .grid-col { padding: 5px; }
.mm__subnav .row h2 a { font-size: inherit; }
.mm__subnav--close { bottom: 100%; position: absolute; right: 0; cursor: pointer; text-transform: uppercase; }
@media only screen and (max-width: 1100px) { .mm__subnav--close { right: 20px; } }
.mm__overlay { background-color: transparent; content: ''; height: 0; left: 0; opacity: 0; position: fixed; top: 90px; width: 100%; z-index: 4; }
.is-expanded .mm__overlay { background-color: rgba(0, 0, 0, 0.5); height: 100%; opacity: 1; }
.mm__box-icon { height: 8rem; margin-bottom: 20px; position: relative; }
.mm__box-icon img { left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.mm__icon-text { position: relative; }
.mm__icon-text [data-icon] { bottom: 3rem; position: absolute; }
.mm__icon-text [data-icon]::before { padding: 8px; border-radius: 50%; background-color: #e6f2d6; font-size: 6rem; -webkit-transition: font-size .2s ease .01s; transition: font-size .2s ease .01s; }
.mm__icon-text:hover [data-icon]:before { font-size: 7rem; }
.mm__icon-text.bg-green-20 [data-icon]::before { background-color: #b5d785; }
.mm__icon-text--more { bottom: 3.8rem; position: absolute; left: 11rem; }
a:hover + .mm__icon-text--content { text-decoration: underline; }

.row-bottom li { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: .5; -webkit-transition: opacity .15s; transition: opacity .15s; }
.row-bottom li:hover, .row-bottom li:active { -webkit-filter: grayscale(0); filter: grayscale(0); opacity: 1; }

.pushmenu-wrapper { min-height: 100%; overflow: hidden; position: relative; width: 100%; z-index: 2; background: #fff; -webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; }
.pushmenu-wrapper.is-open { -webkit-box-shadow: 0 0 1em rgba(0, 0, 0, 0.75); box-shadow: 0 0 1em rgba(0, 0, 0, 0.75); overflow: hidden; position: fixed; -webkit-transform: translateX(-90%); -ms-transform: translateX(-90%); transform: translateX(-90%); width: 100%; }
.pushmenu-wrapper.is-open .pushmenu-icon { display: none; }
.pushmenu-wrapper.is-open .pushmenu-close-icon { display: block; position: absolute; height: 100vh; width: 100%; right: 0; top: 0; color: #fff; cursor: pointer; z-index: 11; }
.pushmenu-wrapper.is-open .blue-nav .pushmenu-close-icon { position: relative; width: 40px; height: 40px; }
.pushmenu-wrapper.is-open .blue-nav .pushmenu-close-icon::before { display: block; margin-right: 0; position: absolute; top: 15px; text-indent: 7px; line-height: 30px; font-size: 2.6rem; }
.pushmenu-wrapper.no-header header, .pushmenu-wrapper.no-header .vvl-header-contact { display: none; }
.pushmenu-wrapper.no-header .content-wrapper { margin-top: 0; }

/** this is the actual pushmenu
*/
.pushmenu-menu { min-height: 100%; overflow: auto; position: absolute; right: 0; top: 0; width: 90%; z-index: 1; line-height: 40px; background-color: #84bc34; }
.pushmenu-menu.is-visible { -webkit-transform: translate3d(0, 0, 0) rotateY(0deg); -ms-transform: translate3d(0, 0, 0) rotateY(0deg); transform: translate3d(0, 0, 0) rotateY(0deg); -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s; }
.pushmenu-menu ul { margin: 0; padding: 0; }
.pushmenu-menu li { list-style-type: none; border-top: 1px solid #9dc95d; border-bottom: 1px solid #b5d785; }
.pushmenu-menu li:first-child { border-top: none; }
.pushmenu-menu li:last-child { border-bottom: none; }
.pushmenu-menu li.active { background-color: #75b03c; border-top: 1px solid #84bc34; }
.pushmenu-menu li.active .subnav { display: block; }
.pushmenu-menu li.active > a.main { background-color: #75b03c; color: #21314d; }
.pushmenu-menu li.active > a.main span:after { content: '\e7c5'; }
.pushmenu-menu a { text-transform: uppercase; color: #fff; font-weight: 700; display: block; padding: 0 20px; }
.pushmenu-menu a:hover { color: #21314d; text-decoration: none; }
.pushmenu-menu a.main { position: relative; }
.pushmenu-menu a.main span { position: absolute; right: 0; width: 50px; margin-left: 0; text-align: center; }
.pushmenu-menu a.main.active span { content: '\e7c4'; }
.pushmenu-menu a.no-icon span { display: none; }
.pushmenu-menu a.teaser-icon:before { display: none; }
.pushmenu-menu .subnav { display: none; background: #f2f2f2; position: relative; }
.pushmenu-menu .subnav:before { border-color: #75b03c transparent transparent; border-style: solid; border-width: 10px 10px 0; content: ''; display: block; height: 0; left: 50%; margin-left: -10px; position: absolute; top: 0; width: 0; }
.pushmenu-menu .subnav a.main { display: block; text-transform: none; padding: 0 20px; border-bottom: 1px solid #e5e5e5; cursor: pointer; position: relative; color: #21314d; }
.pushmenu-menu .subnav a.main span { position: absolute; }
.pushmenu-menu .subnav a.main.active { border-bottom: none; }
.pushmenu-menu .subnav a.main.active span { content: '\e7c5'; }
.pushmenu-menu .subnav ul { height: 0; overflow: hidden; padding: 0 20px; -webkit-transition: all 0.3s; transition: all 0.3s; }
.pushmenu-menu .subnav ul li { border: none; line-height: 30px; }
.pushmenu-menu .subnav ul li.active { background: transparent; border: none; }
.pushmenu-menu .subnav ul li a { text-transform: none; color: #21314d; margin-left: 20px; padding: 0 20px 0 0; font-weight: normal; position: relative; }
@media only screen and (max-width: 700px) { .pushmenu-menu .subnav ul li a { margin-left: 1.8rem; } }
.pushmenu-menu .subnav ul.active { display: block; }
.pushmenu-menu .main span:after { content: '\e7c4'; font-size: 1.5em; }
.pushmenu-menu .main.active span:after { content: '\e7c5'; }
.pushmenu-menu .psnav-block { position: relative; height: auto; }
.pushmenu-menu .psnav-block:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -6px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #7a8394 transparent transparent; border-width: 10px 6px 0; content: ''; cursor: pointer; }
.pushmenu-menu .psnav-block a { color: #fff; background: #7a8394; padding: 0 20px; line-height: 40px; }
.pushmenu-menu .psnav-dialog { width: 100%; display: block; padding: 0; position: static; background-color: #f2f2f2; }
.pushmenu-menu .psnav-dialog li { width: 100%; float: none; border-bottom: 1px solid #7a8394; border-top: 1px solid #f2f2f2; margin-bottom: 0; padding-left: 0; }
.pushmenu-menu .psnav-dialog li a { text-transform: none; margin-bottom: 0; text-align: left; font-weigh: normal; }
.pushmenu-menu .psnav-dialog li a:hover { color: #84bc34; font-weigh: 700; }
.pushmenu-menu .psnav-dialog li:before { display: none; }
.pushmenu-menu .psnav-dialog li span.icon { display: none; }
.pushmenu-menu .psnav-dialog hr { display: none; }

.subnav-list li.active a, .subnav-list li a.is-current, .subnav-list li a:hover, .subnav-list > a:hover, a.subnav-more:hover, .item-circle-icon:hover a.subnav-more, .item-icon:hover .hoverbox-content a, .menu-box:hover .hoverbox-content a { background: transparent; text-decoration: underline; }
.subnav-list li.active a:before, .subnav-list li a.is-current:before, .subnav-list li a:hover:before, .subnav-list > a:hover:before, a.subnav-more:hover:before, .item-circle-icon:hover a.subnav-more:before, .item-icon:hover .hoverbox-content a:before, .menu-box:hover .hoverbox-content a:before { content: '\e7c6'; font-size: 1.2rem; line-height: 1.9em; margin-left: -1.5rem; position: absolute; }
@media only screen and (max-width: 700px) { .subnav-list li.active a:before, .subnav-list li a.is-current:before, .subnav-list li a:hover:before, .subnav-list > a:hover:before, a.subnav-more:hover:before, .item-circle-icon:hover a.subnav-more:before, .item-icon:hover .hoverbox-content a:before, .menu-box:hover .hoverbox-content a:before { line-height: 3rem; margin-left: -1.8rem; } }

.subnav .col li.active a { font-weight: 700; }

.pushmenu-close-icon { display: none; }

.user-contact { position: relative; background: #f2f2f2; border-left: 1px solid #d3d6db; border-right: 1px solid #d3d6db; }
@media only screen and (max-width: 960px) { .user-contact { position: static; } }
.user-contact .spinner div { background-color: #d3d6db; }

.user-contact-content { margin-left: -30px; max-height: 0; position: absolute; right: -1px; width: 300px; z-index: 1; background: inherit; -webkit-box-shadow: 1px 4px 4px 1px rgba(0, 0, 0, 0.12); box-shadow: 1px 4px 4px 1px rgba(0, 0, 0, 0.12); }
.is-active .user-contact-content { max-height: 1000px; padding: 0; }
@media only screen and (max-width: 960px) { .is-active .user-contact-content { max-height: 80vh; max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px); overflow: auto; } }
@media only screen and (max-width: 960px) { .user-contact-content { left: 0; right: 0; top: 60px; margin: 0; width: 100%; } }

/*ul*/
.contact-list { list-style-type: none; margin: 0 0 1rem 1.8rem; }

/*li*/
.contact-list-item { padding: 15px 0 10px; border-bottom: 1px solid #cccccc; margin-right: 20px; }
.contact-list-item:first-child { padding: 15px 0; }
.contact-list-item a.tel, .contact-list-item .p-tel { display: block; color: #21314d; font-size: 3.0rem; font-family: "canada-type-gibson", sans-serif; }
.contact-list-item a.tel:hover, .contact-list-item .p-tel:hover { text-decoration: none; }
.contact-list-item a.tel { display: none; }
.ios .contact-list-item a.tel { display: block; }
.ios .contact-list-item .p-tel { display: none; }
.ios .contact-list-item .p-tel.showIphone { display: block; }
.contact-list-item .list.linklist { margin-bottom: 0; }
.contact-list-item strong { display: block; text-transform: uppercase; }
.contact-list-item .desc { font-size: 1.1rem; display: block; max-width: 230px; }
.contact-list-item img { position: absolute; right: 15px; width: 80px; }
.contact-list-item p { padding-right: 70px; }
.contact-list-item:last-child { border: none; }
.contact-list-item:before { left: 200px; margin-top: 5px; position: absolute; color: #cccccc; font-size: 7rem; }
.contact-list-item.is-chat:before { margin-top: -5px; }
.contact-list-item#bookNavi, .contact-list-item#kundenappNavi { position: relative; border: none; cursor: pointer; }
.contact-list-item#bookNavi:before, .contact-list-item#kundenappNavi:before { display: block; position: absolute; content: "\e663"; right: 15px; top: 0; font-family: 'icons'; width: auto; max-width: 20px; height: auto; max-height: 20px; left: auto; font-size: 3.5rem; }
.contact-list-item#kundenappNavi:before { content: '\e945'; font-size: 4rem; }
.contact-list-item#kundenappNavi li > a, .contact-list-item#kundenappNavi li > a:hover { color: #21314d; }

.user-contact-suggestions { background-color: #21314d; padding: 20px; color: #fff; }
.user-contact-suggestions strong { margin-bottom: 10px; }
.user-contact-suggestions ul { margin: 10px 0 0 0; }

.servicenav, .brandnav { padding: 0; }
.servicenav li, .brandnav li { display: inline-block; margin-right: -.25em; line-height: 1; }
@media only screen and (max-width: 700px) { .servicenav li, .brandnav li { margin-right: 0; } }
.servicenav li a, .brandnav li a { padding: 0 10px; border-left: 1px solid #7a8394; }
@media only screen and (max-width: 700px) { .servicenav li a, .brandnav li a { padding: 0; border: none; } }
.servicenav li:first-child a, .brandnav li:first-child a { border: none; padding-left: 0; }
@media only screen and (max-width: 700px) { .servicenav li:first-child, .brandnav li:first-child { padding: 10px 10px; } }
.servicenav li:last-child, .brandnav li:last-child { border-right: 0 none; }
@media only screen and (max-width: 700px) { .servicenav li, .brandnav li { display: block; padding: 10px; border-bottom: 1px solid #a6adb8; border-left: 0 none; } }

.servicenav { margin: 20px 0 0; }
@media only screen and (max-width: 700px) { .servicenav { margin: 0; } }

@media only screen and (max-width: 960px) { .brandnav { width: 88%; } }
.brandnav li:last-child { display: block; padding: 5px 0 0; border: none; }
@media only screen and (max-width: 700px) { .brandnav li { display: none; }
  .brandnav li:last-child { display: block; padding: 10px; } }

.doormat { margin: 10px 0 10px; width: 100%; }
@media only screen and (max-width: 700px) { .doormat { display: none; } }
.doormat li { display: inline-block; margin-right: -0.25em; vertical-align: top; width: 20%; font-weight: 700; text-transform: uppercase; }
.doormat li li { display: block; font-weight: normal; margin: 0; padding: 0 10px 0 0; width: 100%; text-transform: none; }
.doormat li li:last-child { padding: 0; }
.doormat li li a { color: #4d5a71; }
.doormat li li a:hover { color: #21314d; }
.doormat .social-links-wrapper { padding: 20px 0; width: 60%; }
@media only screen and (min-width: 961px) and (max-width: 1100px) { .doormat .social-links-wrapper { width: 70%; } }
@media only screen and (max-width: 700px) { .doormat .social-links-wrapper { width: 50%; } }
.doormat .kundenapp-wrapper { padding: 20px 0; width: 40%; }
@media only screen and (min-width: 961px) and (max-width: 1100px) { .doormat .kundenapp-wrapper { width: 30%; } }
@media only screen and (max-width: 700px) { .doormat .kundenapp-wrapper { width: 50%; } }
.doormat .social-links { display: block; }
.doormat .social-links li { display: inline-block; padding: 0 20px 0 0; width: auto; line-height: 2em; }

.social-links { display: inline-block; position: relative; }
@media only screen and (max-width: 700px) { .social-links.no-margin-padding { white-space: nowrap; padding-left: 10px; } }
.social-links .social-label, .social-links li { display: inline-block; padding-right: 35px; }
@media only screen and (max-width: 1100px) { .social-links .social-label, .social-links li { padding-right: 30px; } }
@media only screen and (max-width: 960px) { .social-links .social-label, .social-links li { padding-right: 20px; font-size: 95%; } }
@media only screen and (max-width: 700px) { .social-links .social-label, .social-links li { padding: 0 16px 0 0; font-size: 100%; } }
.social-links a { color: #4d5a71; font-weight: normal; text-decoration: none; }
.social-links a:before { height: 2.8rem; padding-right: 5px; color: #a6adb8; font-family: "icons"; font-size: 2em; content: ' '; vertical-align: middle; }
@media only screen and (max-width: 700px) { .social-links a:before { padding: 0; font-size: 2em; } }
.social-links a:hover { color: #21314d; }
.social-links a:hover span { text-decoration: underline; }
@media only screen and (max-width: 700px) { .social-links a span { font-size: 0; } }

.social-share .social-label { display: inline-block; padding-right: 35px; }
@media only screen and (max-width: 1100px) { .social-share .social-label { padding-right: 30px; } }
@media only screen and (max-width: 960px) { .social-share .social-label { padding-right: 20px; } }
@media only screen and (max-width: 700px) { .social-share .social-label { padding: 0 16px 0 0; } }

.social-links a.icon-fb:before { content: '\e901'; color: #3b5998; margin-left: -7px; margin-right: -7px; }
.social-links a.icon-twitter:before { content: '\e902'; font-size: 3em; color: #55acee; margin-left: -6px; margin-right: -6px; }
.social-links a.icon-g:before { content: '\e903'; }
.social-links a.icon-blog:before { content: "\e947"; color: transparent; background-image: url("https://www.mobilcom-debitel.de/img/blog-digitalrepublic.svg"); background-size: 98% 98%; background-repeat: no-repeat; margin-right: 2px; }
@media only screen and (max-width: 700px) { .social-links a.icon-blog:before { padding-right: 5px; } }
.social-links a.icon-instagram:before { content: '\e93e'; color: transparent; background-image: url("https://www.mobilcom-debitel.de/img/instagram.svg"); background-size: auto 90%; background-repeat: no-repeat; margin-left: 0; margin-right: 0; }
@media only screen and (max-width: 700px) { .social-links a.icon-instagram:before { padding-right: 7px; padding-bottom: 2px; } }
.social-links a.icon-kundenapp:before { content: '\e945'; }
li > .social-links a.icon-kundenapp:hover:before { color: #21314d; }
.social-links a.icon-yt:before { content: '\e94c'; color: #cc181e; margin-left: 3px; margin-right: 3px; }
@media only screen and (max-width: 700px) { .social-links a.icon-yt:before { margin-left: 0; } }

@media only screen and (max-width: 960px) { .newsletter .group-radioboxes > label:first-child { display: block; float: none; } }
@media only screen and (max-width: 700px) { .newsletter strong { display: none; }
  .newsletter a, .newsletter a strong { display: inline-block; }
  .newsletter p.uppercase { display: block; line-height: 2.5em; margin-bottom: 0; padding-left: 10px; }
  .newsletter .field-item { width: 80%; }
  .newsletter .btn-small { height: 30px; line-height: 30px; min-width: 30px; width: 30px; }
  .newsletter .btn-small:before { margin-left: 9px; }
  .newsletter .btn-small input { height: 30px; min-width: 30px; } }
.newsletter label { width: auto; padding-right: 20px; line-height: 1.4rem; }
.newsletter .box-holder label { overflow: visible; }

.footnotes { margin-top: -10px; position: relative; color: #4d5a71; }
@media only screen and (max-width: 700px) { .footnotes { margin: 0; } }
.footnotes dl { border-bottom: 1px solid #d3d6db; overflow: inherit; }
.footnotes dl.middle { font-size: 1.6rem; }
.footnotes dl.big { font-size: 1.8rem; }
@media only screen and (max-width: 700px) { .footnotes dl { border-bottom: 1px solid #4d5a71; } }
.footnotes dt, .footnotes dd { padding: 10px 0; border-top: 1px solid #d3d6db; }
.footnotes dt.is-visible, .footnotes dd.is-visible { border-top: 1px solid #21314d; color: #21314d; }
.footnotes dt { display: inline-block; width: 3%; }
@media only screen and (max-width: 700px) { .footnotes dt { padding-left: 10px; width: 10%; } }
.footnotes dd { display: inline-block; margin: 0; width: 97%; cursor: pointer; }
@media only screen and (max-width: 700px) { .footnotes dd { padding-right: 10px; width: 90%; } }
.footnotes dd .footnote-detail { display: inline-block; overflow: hidden; text-overflow: ellipsis; width: 88%; white-space: nowrap; }
.footnotes dd.is-visible { border-top: 1px solid #21314d; }
.footnotes dd.is-visible .footnote-detail { overflow: visible; width: 97%; white-space: normal; cursor: normal; }
.footnotes dd .is-arrow { left: 98%; margin-top: 5px; position: absolute; right: 10px; top: inherit; }
@media only screen and (max-width: 700px) { .footnotes dd .is-arrow { left: 93%; } }
.footnotes dd .is-arrow:before { font-family: "icons"; content: '\e7c4'; color: #4d5a71; }
.footnotes dd .is-arrow.up:before { content: '\e7c5'; color: #21314d; }

.footnotes-headline { float: left; margin: 10px 0; width: 90%; color: #7a8394; font-weight: 700; font-size: 1.4rem; }
@media only screen and (max-width: 700px) { .footnotes-headline { padding-left: 10px; width: 80%; } }

.footnotes-content { clear: both; display: block; }

.sizes { display: block; float: left; line-height: 1.4rem; margin: 10px 0; width: 10%; color: #a6adb8; font-weight: 700; text-align: right; }
@media only screen and (max-width: 700px) { .sizes { display: none; } }
.sizes span { padding: 0 2px; cursor: pointer; }
.sizes span:hover, .sizes span.is-active { color: #21314d; }
.sizes span.middle { font-size: 1.6rem; }
.sizes span.big { font-size: 1.8rem; }

.dealersearch .grid-form-2 { padding-right: 0; }
@media only screen and (max-width: 700px) { .dealersearch { border-bottom: 1px solid #4d5a71; } }
.dealersearch a { display: none; }
@media only screen and (max-width: 700px) { .dealersearch strong { display: none; }
  .dealersearch a, .dealersearch a strong { display: inline-block; }
  .dealersearch p.uppercase { display: block; line-height: 2.5em; margin-bottom: 0; padding-left: 10px; } }

.contextswitch { clear: left; }
.contextswitch li { display: inline-block; margin: 5px -0.25em 5px 0; padding: 0 10px; border-right: 2px solid #4d5a71; font-weight: 700; line-height: 1; }
@media only screen and (max-width: 700px) { .contextswitch li { display: block; padding: 10px; margin: 0; border-right: none; border-top: 1px solid #a6adb8; } }
.contextswitch li:first-child { padding-left: 0; }
@media only screen and (max-width: 700px) { .contextswitch li:first-child { padding: 10px; border-top: none; } }
.contextswitch li:last-child { border-right: none; }
.contextswitch li a { text-transform: uppercase; color: #4d5a71; }

.hint { color: #7a8394; }
.hint.tooltip, .hint.note { font-size: 12px; font-size: 1.2rem; line-height: 16px; line-height: 1.6rem; }
.hint.tooltip { background-color: #fff; color: #21314d; }
.hint.is-active { display: block; }

.btn.st-message { -webkit-box-shadow: none; box-shadow: none; margin: 0; }
.btn.st-message:hover { background-color: #84bc34; cursor: default; }
.btn.st-message.btn-blue:hover { background-color: #21314d; }

table .btn.st-message, .btn.st-message { display: inline-block; width: auto; }

.system-error { padding-top: 50px; text-align: center; min-height: 300px; }
.system-error .icon { font-size: 4rem; }

.vvl-filters h2 { margin-bottom: 10px; }
.vvl-filters h2 small { font-weight: normal; font-family: "canada-type-gibson", sans-serif; color: #4d5a71; }

.vvl-active-filters { margin-top: 10px; }
.vvl-active-filters .filter { position: relative; display: inline-block; padding: 5px 30px 5px 10px; background-color: #fff; border: 1px solid #f2f2f2; cursor: pointer; margin-right: 10px; }
.vvl-active-filters .filter::before { content: ''; position: absolute; right: 0; top: 5px; }

.vvl-active-filters-mobile { background-color: #f2f2f2; margin-top: 5px; padding: 5px 10px; }
.vvl-active-filters-mobile a { font-weight: 700; }

.vvl-all-filters { /** Mobile
*/ }
.vvl-all-filters .filter { position: relative; background-color: #f2f2f2; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); z-index: 0; }
.vvl-all-filters .filter .title { cursor: pointer; padding: 7px 10px 7px 20px; text-transform: none; margin-bottom: 0; font-size: 1.5rem; }
@media only screen and (max-width: 700px) { .vvl-all-filters .filter .title { padding: 10px 10px 10px 20px; } }
.vvl-all-filters .filter .arrow { position: absolute; right: 5px; top: 5px; }
.vvl-all-filters .filter .arrow::before { content: ''; }
.vvl-all-filters .filter ul { position: absolute; display: none; margin: 0; top: 31px; left: 0; right: 0; background-color: #f2f2f2; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.vvl-all-filters .filter li { list-style-type: none; padding: 5px 5px 5px 20px; cursor: pointer; }
.vvl-all-filters .filter li label { float: none; width: 100%; margin: 0; }
.vvl-all-filters .filter.hover { z-index: 5; }
.vvl-all-filters .filter.hover ul { z-index: 6; display: block; }
.vvl-all-filters .filter.hover .arrow::before { content: ''; }
.vvl-all-filters .filter-header { border-bottom: 1px solid #fff; }
.vvl-all-filters .filter-header::before { position: absolute; color: #000; right: 5px; top: 7px; content: ''; pointer-events: none; }
@media only screen and (max-width: 700px) { .vvl-all-filters .filter-header::before { top: 10px; } }
.vvl-all-filters .filter-header h3 { background-color: #e5e5e5; color: #21314d; }
.vvl-all-filters hr { margin-bottom: 0; }
@media only screen and (max-width: 700px) { .vvl-all-filters { overflow: hidden; }
  .vvl-all-filters .grid-wrapper { display: none; }
  .vvl-all-filters .grid-col { background-color: #4d5a71; }
  .vvl-all-filters .filter { background-color: #4d5a71; color: #fff; -webkit-box-shadow: none; box-shadow: none; }
  .vvl-all-filters .filter .filter-values { background-color: transparent; position: static; display: none; -webkit-box-shadow: none; box-shadow: none; }
  .vvl-all-filters .filter.is-active .filter-values { display: block; }
  .vvl-all-filters.is-active .filter-header h3 { background-color: #21314d; color: #fff; }
  .vvl-all-filters.is-active .filter-header::before { color: #fff; top: 12px; content: ''; } }
@media only screen and (max-width: 700px) and (max-width: 700px) { .vvl-all-filters.is-active .filter-header::before { top: 10px; } }
@media only screen and (max-width: 700px) { .vvl-all-filters.is-active .grid-wrapper { display: block; } }

#vvl-filter-device, #vvl-filter-tariff { position: relative; }
@media only screen and (max-width: 1100px) { #vvl-filter-device, #vvl-filter-tariff { margin-top: 1rem; } }
#vvl-filter-device .slider-index, #vvl-filter-tariff .slider-index { font-size: 2rem; }
#vvl-filter-device .icon-glass, #vvl-filter-tariff .icon-glass { font-size: 1.6em; line-height: 1.6em; color: #21314d; }
#vvl-filter-device .icon-glass:hover, #vvl-filter-tariff .icon-glass:hover { text-decoration: none; }
#vvl-filter-device .link-open, #vvl-filter-tariff .link-open { color: #21314d; font-weight: 700; position: relative; padding-right: 2rem; }
#vvl-filter-device .link-open:hover, #vvl-filter-tariff .link-open:hover { text-decoration: none; }
#vvl-filter-device .link-open span, #vvl-filter-tariff .link-open span { font-size: 1.35em; bottom: -5px; position: absolute; right: 0; }
#vvl-filter-device .close, #vvl-filter-tariff .close { font-size: 27px; position: absolute; right: 0; top: 7px; color: #21314d; cursor: pointer; }
#vvl-filter-device .close:before, #vvl-filter-tariff .close:before { margin-right: 0; }
#vvl-filter-device .filter-group, #vvl-filter-tariff .filter-group { margin-top: 2rem; padding-top: 1rem; }
#vvl-filter-device .filter-group:before, #vvl-filter-device .filter-group:after, #vvl-filter-tariff .filter-group:before, #vvl-filter-tariff .filter-group:after { content: ''; border: 1px solid #21314d; border-width: 1px 0 0 0; width: -webkit-calc(50% - 100px); width: calc(50% - 100px); position: absolute; top: -4px; }
#vvl-filter-device .filter-group:before, #vvl-filter-tariff .filter-group:before { left: 0; }
#vvl-filter-device .filter-group:after, #vvl-filter-tariff .filter-group:after { right: 0; }
#vvl-filter-device .filter-group .label-filter, #vvl-filter-tariff .filter-group .label-filter { margin-top: -24px; }
#vvl-filter-device .filter-group .label-filter span, #vvl-filter-tariff .filter-group .label-filter span { padding: 0 10px; }
#vvl-filter-device .filter-group .reset-filter:before, #vvl-filter-tariff .filter-group .reset-filter:before { display: inline-block; }
#vvl-filter-device .filter-group .vendor-list-wrapper, #vvl-filter-tariff .filter-group .vendor-list-wrapper { height: auto; }
#vvl-filter-device .filter-group .vendor-select, #vvl-filter-tariff .filter-group .vendor-select { margin-top: 10px; margin-bottom: 0; }
#vvl-filter-device .filter-group .color-select, #vvl-filter-tariff .filter-group .color-select { margin: 1rem 0 1rem; }
#vvl-filter-device .horizontal-nav-text-img, #vvl-filter-tariff .horizontal-nav-text-img { table-layout: fixed; margin: 1rem 0 1rem; }
#vvl-filter-device .horizontal-nav-text-img li, #vvl-filter-tariff .horizontal-nav-text-img li { background-color: #fff; cursor: pointer; text-align: center; position: relative; }
#vvl-filter-device .horizontal-nav-text-img li a, #vvl-filter-tariff .horizontal-nav-text-img li a { padding: 0 5px; }
#vvl-filter-device .horizontal-nav-text-img li strong, #vvl-filter-tariff .horizontal-nav-text-img li strong { font-size: 1.8rem; }
@media only screen and (min-width: 701px) and (max-width: 1100px) { #vvl-filter-device .horizontal-nav-text-img li strong, #vvl-filter-tariff .horizontal-nav-text-img li strong { font-size: 1.6rem; } }
#vvl-filter-device .horizontal-nav-text-img li.is-active, #vvl-filter-tariff .horizontal-nav-text-img li.is-active { border-top: 3px solid transparent; border-bottom: 3px solid transparent; }
#vvl-filter-device .horizontal-nav-text-img li.is-active:after, #vvl-filter-tariff .horizontal-nav-text-img li.is-active:after { border: 3px solid #84bc34; content: ''; height: 72px; left: 0; position: absolute; top: -3px; width: 100%; }
@media only screen and (max-width: 960px) { #vvl-filter-device .horizontal-nav-text-img li.is-active:after, #vvl-filter-tariff .horizontal-nav-text-img li.is-active:after { height: 62px; } }
#vvl-filter-device .horizontal-nav-text-img li.is-active:hover .horizontal-nav-text-img__item-link, #vvl-filter-tariff .horizontal-nav-text-img li.is-active:hover .horizontal-nav-text-img__item-link { border-bottom: 3px solid transparent; }
#vvl-filter-device .info__tooltip--content, #vvl-filter-tariff .info__tooltip--content { width: 70px; text-align: center; }
#vvl-filter-device .option-input.is-disabled, #vvl-filter-tariff .option-input.is-disabled { pointer-events: none; }

#vvl-filter-layer-device .filter-row .is-disabled, #vvl-filter-layer-tariff .filter-row .is-disabled { cursor: not-allowed; pointer-events: none; background-image: -webkit-linear-gradient(315deg, #e5e5e5 20%, #fff 20%, #fff 52%, #e5e5e5 52%, #e5e5e5 75%, #fff 75%, #fff); background-image: linear-gradient(135deg, #e5e5e5 20%, #fff 20%, #fff 52%, #e5e5e5 52%, #e5e5e5 75%, #fff 75%, #fff); background-size: 5px 5px; background-color: transparent; }

#vvl-filter-tariff .vendor-list li { text-transform: uppercase; }

.color-select { margin: 5px 0; }
.color-select .option-input, .color-select .option-input-inactive { border: 1px solid #bcc1c9; }
.color-select .option-input:hover, .color-select .option-input.selected, .color-select .option-input-inactive:hover, .color-select .option-input-inactive.selected { border-color: #21314d; -webkit-box-shadow: 0 0 0 1px #fff inset; box-shadow: 0 0 0 1px #fff inset; }
.color-select > div { position: relative; display: inline-block; height: 18px; margin-right: 6px; width: 32px; cursor: pointer; }
.color-select > div.is-disabled::before { content: ''; position: absolute; background: url("data:image/svg+xml;utf8,<svg version='1.1' baseProfile='tiny' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='100%' height='100%' ><line fill='none' stroke='%23000' x1='100%' y1='0' x2='0' y2='100%' style='stroke:rgb(255,0,0); stroke-width:1' /></svg>"); background-position: 0 0; background-repeat: no-repeat; background-size: cover; height: 100%; width: 100%; left: 0; top: 0; }
.color-select > div.is-disabled a { pointer-events: none; }
.color-select.has-title { margin-bottom: 30px; position: relative; }
.color-select.has-title .selected:after { left: 0; position: absolute; top: 100%; content: attr(title); }
.color-select.is-big > div { height: 25px; margin-right: 6px; width: 60px; }

ul.memory-select { margin: 5px 0; }
ul.memory-select > li { position: relative; display: inline-block; height: 25px; margin: 0 6px 6px 0; width: 60px; border: 1px solid #bcc1c9; text-align: center; line-height: 23px; cursor: pointer; color: #7a8394; }
ul.memory-select > li:hover, ul.memory-select > li.selected { color: #21314d; border-color: #21314d; -webkit-box-shadow: 0 0 0 1px #fff inset; box-shadow: 0 0 0 1px #fff inset; }
ul.memory-select > li.selected { font-weight: bold; }
ul.memory-select > li.is-disabled::before, ul.memory-select > li.is-unavailable::before { content: ''; position: absolute; background: url("data:image/svg+xml;utf8,<svg version='1.1' baseProfile='tiny' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='100%' height='100%' ><line fill='none' stroke='%23000' x1='100%' y1='0' x2='0' y2='100%' style='stroke:rgb(255,0,0); stroke-width:1' /></svg>"); background-position: 0 0; background-repeat: no-repeat; background-size: cover; height: 100%; width: 100%; left: 0; top: 0; }
ul.memory-select > li.is-disabled { cursor: not-allowed; }
ul.memory-select > li.is-disabled a { pointer-events: none; }

.vendor-select { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); height: 72px; margin: 0 0 30px; position: relative; }
.vendor-select .selected { display: none; }
.vendor-select.no-arrows .vendor-list-wrapper { left: 0; right: 0; }
.vendor-select.no-arrows .vendor-list-prev, .vendor-select.no-arrows .vendor-list-next { display: none; }

.vendor-list-prev, .vendor-list-next { color: #75b03c; bottom: 0; cursor: pointer; position: absolute; height: 72px; text-align: center; top: 0; width: 30px; opacity: 1; -webkit-transition: opacity 300ms; transition: opacity 300ms; }
.vendor-list-prev:before, .vendor-list-next:before { line-height: 72px !important; margin-right: 0 !important; }
.vendor-list-prev.disabled, .vendor-list-next.disabled { cursor: default; color: #cccccc; }

.vendor-list-prev { left: 0; }

.vendor-list-next { right: 0; }

.vendor-list-wrapper { height: 80px; overflow: hidden; position: absolute; left: 30px; right: 30px; }

.vendor-list { margin: 0; padding: 0; display: table; table-layout: fixed; }
.vendor-list li { list-style-type: none; display: table-cell; height: 72px; width: 11rem; min-width: 11rem; cursor: pointer; text-align: center; border-right: 1px solid #cccccc; vertical-align: middle; }
.vendor-list li.text { position: relative; color: #a6adb8; }
.vendor-list li.text > span { position: absolute; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); display: block; width: 100%; }
.vendor-list li.text span.big { font-size: 2.4rem; vertical-align: middle; }
.vendor-list li:first-child { border-left: 1px solid #cccccc; }
.vendor-list li.is-active { border-bottom: 4px solid #21314d; }
.vendor-list li.is-active .img { background-position: center -72px; }
.vendor-list li.is-active:before { top: auto; bottom: -12px; }
.vendor-list li.is-active.text { color: #21314d; }
.vendor-list li.is-active.with-arrow { position: relative; }
.vendor-list li.is-active.with-arrow:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; }
.vendor-list li.is-active .text { display: block; padding-top: 4px; }
.vendor-list li.is-disabled { cursor: not-allowed; }
.vendor-list li:hover { background-color: #f2f2f2; border-bottom: none; }
.vendor-list li:hover .img { background-position: center -72px; }
.vendor-list li:hover.text { color: #21314d; }
.vendor-list li:hover .text { display: block; padding-top: 4px; }
.vendor-list li.is-active:hover { background-color: transparent; border-bottom: 4px solid #21314d; }
.vendor-list li .img { display: block; height: 100%; width: 11rem; background-position: center top; }
.vendor-list li .badge { position: absolute; top: 5px; right: 10px; border-radius: 50%; padding: 0 6px 1px; background-color: #84bc34; color: #fff; }

/** styles for dropdown version */
.vendor-select.dropdown { z-index: 3; height: auto; margin: 0 0 30px 0; display: block; }
.vendor-select.dropdown .selected { background-color: #e5e5e5; display: block; height: 40px; padding: 0 20px 0 35px; font-family: "canada-type-gibson", sans-serif; font-size: 1.6rem; line-height: 40px; }
.vendor-select.dropdown .vendor-list-wrapper { display: none; }
.vendor-select.dropdown .prev, .vendor-select.dropdown .next { display: none; }
.vendor-select.dropdown .vendor-list-wrapper { left: 0; right: 0; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.vendor-select.dropdown ul { padding: 10px; }
.vendor-select.dropdown .vendor-list li { float: left; width: 50%; height: 72px; -webkit-transition: background-color 300ms; transition: background-color 300ms; border: none; }
.vendor-select.dropdown .vendor-list li.text:first-child { width: 100%; border-bottom: 2px solid #e5e5e5; }
.vendor-select.dropdown .vendor-list li.is-active .img { background-color: #cccccc; }
.vendor-select.dropdown .vendor-list li.is-active:before { display: none; }
.vendor-select.dropdown .vendor-list li .img { width: 100%; border-bottom: 2px solid #e5e5e5; background-repeat: no-repeat; }
.vendor-select.dropdown .vendor-list li .text { display: block; background-color: #84bc34; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); margin: 20px 10px 10px 0; padding: 4px 12px; }
.vendor-select.dropdown:hover span.selected { background-color: #84bc34; cursor: pointer; }
@media only screen and (max-width: 700px) { .vendor-select.dropdown:hover span.selected { background-color: #e5e5e5; } }
.vendor-select.dropdown.is-open { z-index: 5; }
.vendor-select.dropdown.is-open .vendor-list-wrapper { background-color: #f2f2f2; height: auto; display: block; z-index: 1; }
.vendor-select.dropdown.is-open span.selected { background-color: #84bc34; }
.vendor-select.dropdown.is-open span.arrow:before { content: '\e7c5'; }
@media only screen and (max-width: 700px) { .vendor-select.dropdown.is-open { background-color: #84bc34; } }
.vendor-select.dropdown span.arrow { cursor: pointer; }
.vendor-select.dropdown span.arrow:before { font-family: "icons"; right: 10px; position: absolute; bottom: 10px; top: 0; content: '\e7c4'; }

.vendor-list-center .vendor-list { margin: 0 auto; }

.vendor-list li a { display: block; height: 100%; }

.vendor-select.multiple .vendor-list li { position: relative; }
.vendor-select.multiple .vendor-list li:hover:checked ~ .text { border-color: #000; }
.vendor-select.multiple .vendor-list li:hover .text { border-color: #cccccc; }
.vendor-select.multiple .vendor-list li:hover .text ~ .img { background-position: center -54px; }
.vendor-select.multiple label { height: 68px; padding: 0; margin: 0; width: 100%; cursor: pointer; line-height: 1; font-weight: normal; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.vendor-select.multiple label.image .text { padding-top: 0; }
.vendor-select.multiple label.icon:before { margin-right: 0; font-size: 5rem; }
.vendor-select.multiple span.img { margin: -10px auto; height: 60px; }
.vendor-select.multiple span.text { bottom: 0; display: block; padding: 0 0 5px; position: absolute; width: 100%; border-bottom: 4px solid #fff; }
.vendor-select.multiple :checked + .img { background-position: center -72px; }
.vendor-select.multiple :checked ~ .text { border-color: #000; }
.vendor-select.multiple .text ~ .img { background-size: 75%; height: 45px; margin-top: -5px; }
.vendor-select.multiple :checked ~ .text ~ .img { background-position: center -54px; }

.vendor-select.multiple.dropdown .vendor-list > li { width: 50%; }
.vendor-select.multiple.dropdown .vendor-list > li label { width: 100%; border-bottom: 1px solid #e5e5e5; }
.vendor-select.multiple.dropdown .vendor-list > li:first-child { border-bottom: none; }
.vendor-select.multiple.dropdown .vendor-list > li:hover .img { background-position: center -64px; }
.vendor-select.multiple.dropdown .vendor-list > li img { margin: 0 10px; border-bottom: 2px solid #e5e5e5; }
.vendor-select.multiple.dropdown span.text { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; border: none; top: 5px; text-align: left; padding-left: 25px; margin: 0; }
.vendor-select.multiple.dropdown span.img { margin-top: -10px; background-size: 100%; border: none; height: 70px; width: 100px; position: absolute; right: 0; }
.vendor-select.multiple.dropdown :checked ~ .text ~ .img { background-position: center -64px; }

.vendor-list li input { position: absolute; left: 5px; top: 5px; }

.vendor-select.as-flexbox .vendor-list { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.vendor-select.as-flexbox .vendor-list > li { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; display: block; }
.vendor-select.as-flexbox.as-mobile-flexbox .vendor-list > li { width: auto; min-width: 0; }
.vendor-select.as-flexbox.as-mobile-flexbox .vendor-list > li span.img { background-size: cover; }

/** on phone the flexboxes will become very small, so we introduce a flex-flow of multiple rows */
@media only screen and (max-width: 700px) { .vendor-select.as-flexbox:not(.as-mobile-flexbox) { height: auto; }
  .vendor-select.as-flexbox:not(.as-mobile-flexbox) .vendor-list-wrapper { height: auto; overflow: visible; position: static; }
  .vendor-select.as-flexbox:not(.as-mobile-flexbox) .vendor-list { -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; }
  .vendor-select.as-flexbox:not(.as-mobile-flexbox) .vendor-list > li { -webkit-box-flex: 0; -webkit-flex: 0 50%; -ms-flex: 0 50%; flex: 0 50%; }
  .vendor-select.as-flexbox:not(.as-mobile-flexbox) .vendor-list > li:first-child { border-left: none; }
  .vendor-select.as-flexbox:not(.as-mobile-flexbox) .vendor-list > li label { width: 100%; } }

.vendor-big .vendor-list li { height: 16.4rem; width: 14.4rem; position: relative; }
.vendor-big .vendor-list li a { color: #21314d; font-weight: normal; }
.vendor-big .vendor-list li a:hover { color: #21314d; }
.vendor-big .vendor-list li .img { margin: 0 auto; width: 100%; background-repeat: no-repeat; }
.vendor-big .vendor-list li:hover .img, .vendor-big .vendor-list li.is-active .img { background-position: center -14.4rem; }
.vendor-big .vendor-list li .text { width: 100%; position: absolute; bottom: 12px; left: 0; }
.vendor-big .vendor-list-prev, .vendor-big .vendor-list-next { line-height: 16.4rem !important; }
.vendor-big .vendor-list-prev:before, .vendor-big .vendor-list-next:before { line-height: 16.4rem !important; }

.vendor-img .vendor-list li { width: 24rem; opacity: 0.7; }
.vendor-img .vendor-list li a { width: 24rem; }
.vendor-img .vendor-list li img { max-height: 14rem; width: auto; }
.vendor-img .vendor-list li .text { bottom: 8px; }
.vendor-img .vendor-list li:hover { opacity: 0.9; }
.vendor-img .vendor-list li.is-active { opacity: 1; }
.vendor-img .vendor-list li.is-active .text { bottom: 4px; }

.vendor-img.dropdown ul.vendor-list { padding: 10px 0; }
.vendor-img.dropdown ul.vendor-list li { height: auto; }
.vendor-img.dropdown ul.vendor-list li a { width: auto; }
.vendor-img.dropdown ul.vendor-list li .img { width: auto; height: auto; }
.vendor-img.dropdown ul.vendor-list li .text { position: static; -webkit-box-shadow: none; box-shadow: none; background-color: transparent; margin: 0; }

.device-selected { margin: 0 0 10px; }
.device-selected .device-selected-text { margin-bottom: 6rem; }
.device-selected > div { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.device-selected .device-container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.device-selected .device-container > div { padding: 10px; }
.device-selected .device-container > div:first-child { width: 87%; }
.device-selected .icon-container { width: 13%; padding: 0 !important; position: relative; }
.device-selected .icon-container > div { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; height: 100%; width: 100%; position: absolute; }
.device-selected .icon-container > div > div { -webkit-box-flex: 50%; -webkit-flex: 50%; -ms-flex: 50%; flex: 50%; margin: 0 0 0 2px; position: relative; cursor: pointer; }
.device-selected .icon-container > div > div:last-child { margin: 2px 0 0 2px; }
.device-selected .icon-container > div > div:hover { background-color: #84bc34; }
.device-selected .icon-container > div > div > * { position: absolute; top: 50%; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); color: #21314d; }
.device-selected .icon-container > div > div > *:before { margin-right: 0; font-size: 2rem; }
.device-selected .icon-container > div > div > a { height: 50%; margin: 0; width: 100%; }
.device-selected .icon-container > div > div > a:before { font-size: 2.5rem; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }

.no-header .vvl-sticky { display: none; }

.vvl-sticky { display: none; height: 60px; left: 0; padding-top: 5px; position: fixed; right: 50px; top: 0; z-index: 999; }
@media only screen and (max-width: 700px) { .vvl-sticky { display: block; } }

.vvl-sticky-desktop { padding-top: 6rem; }
@media only screen and (max-width: 1100px) { .vvl-sticky-desktop { padding-top: 4rem; } }
.vvl-sticky-desktop .grid-wrapper { position: relative; }
.vvl-sticky-desktop .grid-wrapper.line-bottom { border-bottom: 1px solid #cccccc; }
.vvl-sticky-desktop .grid-wrapper.btn-container { padding-top: 1rem; }
.vvl-sticky-desktop .grid-wrapper.btn-container > div { padding: 0; }
.vvl-sticky-desktop .grid-wrapper.btn-container > div + div { float: right; width: -webkit-calc(50% - 1rem); width: calc(50% - 1rem); }
@media only screen and (max-width: 1100px) { .vvl-sticky-desktop .grid-wrapper.btn-container > div + div { width: 100%; } }
.vvl-sticky-desktop .grid-wrapper .icon { display: none; }
.vvl-sticky-desktop .grid-wrapper.is-editable { cursor: pointer; }
.vvl-sticky-desktop .grid-wrapper.is-editable:hover { background-color: rgba(0, 0, 0, 0.3); margin-left: -40px; padding-left: 30px; }
.vvl-sticky-desktop .grid-wrapper.is-editable:hover .icon { display: block; height: 100%; left: 0; position: absolute; width: 40px; }
.vvl-sticky-desktop .grid-wrapper.is-editable:hover .icon:before { bottom: 10px; content: '\e616'; font-family: icons; font-size: 24px; left: 24%; position: absolute; }
.vvl-sticky-desktop .price-desktop { bottom: 0; position: absolute; right: 0; }
.vvl-sticky-desktop .price { margin-right: 0; margin-top: 6px; }

#vvl-breadcrumb { text-transform: uppercase; margin: 3rem 0; }
@media only screen and (max-width: 1100px) { #vvl-breadcrumb { margin: 2rem 0 0; } }
#vvl-breadcrumb a { color: #21314d; }
#vvl-breadcrumb [ng-click] { cursor: pointer; }
#vvl-breadcrumb [ng-click]:hover { text-decoration: underline; }
#vvl-breadcrumb [data-icon-after]:after { margin-left: 0; }
@media only screen and (max-width: 700px) { #vvl-breadcrumb { text-transform: none; margin-top: 5px; } }

#sendOrderForm .selected-date .btn { display: none; }

.selected-date { background: #f2f2f2; display: block; padding: 20px 0; }
@media only screen and (max-width: 700px) { .selected-date { padding: 20px 0 0; text-align: center; } }
.selected-date > div { display: inline-block; position: relative; width: auto; }
.selected-date > div:first-of-type:after { content: ' '; height: 100%; top: 0; right: 0; position: absolute; width: 1px; border-right: 1px solid #d0d0d0; }
.selected-date > div:not(.dash) { padding: 0 40px; }
@media only screen and (max-width: 1200px) { .selected-date > div:not(.dash) { padding: 0 20px; } }
@media only screen and (max-width: 700px) { .selected-date > div.not-mobile { display: none; }
  .selected-date > div.float-right.dash { display: block; float: none; } }

@media only screen and (max-width: 960px) { .confirm .selected-date { margin-bottom: 20px; } }
@media only screen and (max-width: 700px) { .confirm .selected-date { margin: 0; padding: 20px 0; } }
.confirm .selected-date > div:not(.dash) { padding: 0 10px; }
.confirm .selected-date > div.dealer-addr { display: block; margin: 20px 10px 0; padding: 20px 0 0; border-top: 1px solid #d0d0d0; text-align: left; }
.confirm .selected-date > div.dealer-addr .btn { margin-top: -10px; }

.big-font { font-family: "qtype", Helvetica, Arial, sans-serif; font-size: 5.6rem; font-weight: normal; line-height: 1.111; }

.dash .btn-icon { margin-top: 20%; }
@media only screen and (max-width: 700px) { .dash .btn-icon { margin-top: 20px; } }

.border-bottom { display: block; height: 1px; margin: 40px 0 20px; border-bottom: 4px solid #e5e5e5; }
@media only screen and (max-width: 700px) { .border-bottom { display: none; } }

header { position: fixed; width: 100%; z-index: 103; }
.ios8 header { position: fixed; }
.is-open header { z-index: 2; }
@media only screen and (max-width: 960px) { header { z-index: 10; } }

.header-first { height: 30px; background-color: #84bc34; border-top: 2px solid #21314d; }
@media only screen and (max-width: 1100px) { .header-first .inner-wrapper { padding: 0 15px; } }
@media only screen and (max-width: 960px) { .header-first .inner-wrapper { padding: 0; } }
@media only screen and (max-width: 960px) { .header-first { border-top: none; height: 60px; } }

@media only screen and (max-width: 960px) { .is-open .header-first { overflow: hidden; } }

.header-second { height: 60px; background-color: #84bc34; border-bottom: 1px solid #cee4ae; position: relative; /*nav*/ }
.header-second .nav-list.pushmenu { display: none; }
.header-second .inner-wrapper, .header-second .nav, .header-second .nav-list, .header-second .nav-list > li, .header-second .nav-list > li > a { height: 100%; }
.header-second .nav { padding-top: 10px; padding-left: 163px; display: block; margin: 0 auto; max-width: 1104px; width: 100%; }
.header-second .subnav { opacity: 0; visibility: hidden; -webkit-transition: opacity 0.2s easy 0.5s, visibility 0.2s easy 0.5s; transition: opacity 0.2s easy 0.5s, visibility 0.2s easy 0.5s; }
@media only screen and (max-width: 960px) { .header-second { display: none; } }
.header-second .main { text-transform: uppercase; }
.header-second .main.no-link { cursor: default; text-decoration: none; }
.header-second .main.is-light, .header-second .main .is-light { font-weight: 400; }
.header-second .main.no-uppercase, .header-second .main .no-uppercase { text-transform: none; }

header .nav-list { float: none; margin: 0; display: inline-block; padding-left: 9px; font-size: 0; }
@media only screen and (max-width: 960px) { header .nav-list { display: none; } }
header .nav-list > li { display: inline-block; list-style-type: none; }
header .nav-list > li > a { line-height: 4.5rem; padding: 0 12px; text-decoration: none; color: #21314d; font-size: 1.5rem; font-weight: 700; }
header .nav-list > li > a { display: inline-block; position: relative; top: 1px; }
@media only screen and (max-width: 960px) { header .nav-list > li > a { position: static; } }
header .nav-list > li:hover > a { -webkit-transition: all 0.2s linear 0.1s; transition: all 0.2s linear 0.1s; background-color: #fff; color: #21314d; line-height: 4.5rem; padding: 0 12px; z-index: 5; }
header .nav-list > li.is-expanded .subnav { opacity: 1; visibility: visible; }
header .nav-list > li.active a { padding: 17px 12px; background-color: #9dc95d; color: #21314d; }

.footer { border-top: 1px solid #d3d6db; color: #7a8394; font-weight: 700; }
.footer .inner-wrapper { padding: 0 10px; }
@media only screen and (max-width: 1100px) { .footer .inner-wrapper { padding: 0 64px; } }
@media only screen and (max-width: 700px) { .footer .inner-wrapper { margin: 0; padding: 0 10px; } }
.footer .grid-full { padding: 10px 0; }

footer { padding: 30px 0 20px; background-color: #f2f2f2; -webkit-box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); color: #4d5a71; }
@media only screen and (max-width: 700px) { footer { padding: 10px 0; } }
footer .inner-wrapper { padding: 0 10px; }
footer .inner-wrapper .grid-full { padding: 10px 0; border-top: 1px solid #d3d6db; }
footer .inner-wrapper:first-child .grid-full, footer .inner-wrapper:last-child .grid-full { border-top: none; }
@media only screen and (max-width: 700px) { footer .inner-wrapper .grid-full { padding: 0; border-top: 1px solid #d3d6db; }
  footer .inner-wrapper:nth-child(2) { display: none; }
  footer .inner-wrapper:nth-child(3) .grid-full { border-top: none; }
  footer .inner-wrapper:nth-child(4) .grid-full { border-top: 1px solid #4d5a71; } }
@media only screen and (max-width: 1100px) { footer .inner-wrapper { padding: 0 64px; } }
@media only screen and (max-width: 700px) { footer .inner-wrapper { padding: 0; } }
footer section { display: table-cell; padding: 0; width: 50%; vertical-align: top; }
footer section:first-child { width: 40%; }
footer section:first-child label { float: left; }
footer section:first-child .btn { margin-top: 0; }
footer section:last-child { width: 10%; }
footer section p { width: 83%; }
@media only screen and (max-width: 700px) { footer section { display: block; padding: 0; width: 100%; }
  footer section:first-child { width: 100%; border-bottom: 1px solid #d3d6db; }
  footer section:first-child h3 { margin: 0; }
  footer section:last-child, footer section.dealersearch p, footer section.dealersearch form { display: none; }
  footer section.newsletter { padding: 0 10px; }
  footer section h3 { margin: 0 10px; padding: 8px 0; color: #4d5a71; } }
footer ul { list-style: none; margin: 0; padding: 0; }
footer a { display: block; color: #4d5a71; }
footer .social-links li { display: block; }
@media only screen and (max-width: 960px) { footer .social-links li { display: inline-block; width: auto; }
  footer .social-links li span { font-size: 0; } }
@media only screen and (max-width: 700px) { footer .social-links li { display: inline-block; width: auto; }
  footer .social-links li span { font-size: 0; } }

.clip_list, .bar_list { margin: 0; }
.clip_list li, .bar_list li { list-style-type: none; }

html:not(.is-ie9) .clip_list.is-flexbox, html:not(.is-ie9) .bar_list.is-flexbox, html:not(.is-ie10) .clip_list.is-flexbox, html:not(.is-ie10) .bar_list.is-flexbox { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.is-ie9 .teaser-clips-and-bars { height: 100%; }

.clip { overflow: hidden; margin-bottom: 0; }
.clip img { width: 100%; }

.bar { overflow: hidden; }
.bar img { width: 100%; }

.teaser-intro { height: 100%; margin-bottom: 20px; max-width: 1048px; position: relative; background-size: 100% auto; }
.teaser-intro .teaser-theme { font-weight: 600; }
.teaser-intro .teaser-text { left: 50%; padding: 40px 40px 40px 0; position: absolute; top: 0; }
.teaser-intro .headline1, .teaser-intro .headline1-light { margin-bottom: 20px; text-align: left; }
.teaser-intro .price { bottom: 40px; position: absolute; left: 50%; }
.teaser-intro .teaser-link { bottom: 40px; right: 0; z-index: 5; }
.teaser-intro.text-white { color: #fff; }
@media only screen and (max-width: 960px) { .teaser-intro .headline1, .teaser-intro .headline1-light, .teaser-intro .headline1-light { margin-bottom: 0; }
  .teaser-intro .teaser-text { padding: 20px 40px 20px 0; }
  .teaser-intro .price { bottom: 20px; }
  .teaser-intro .teaser-link { bottom: 20px; right: 20px; } }
@media only screen and (max-width: 700px) { .teaser-intro .teaser-theme { display: none; }
  .teaser-intro h2.headline1, .teaser-intro h2.headline1-light { position: absolute; top: 10px; left: 10px; right: 10px; font-size: 6vw; text-align: center; } }

.teaser-intro.text-left .teaser-text, .teaser-intro.text-left .price { left: 0; right: 50%; }
.teaser-intro.text-left .price { left: 40px; }
.teaser-intro.text-left .teaser-text { padding: 40px 0 40px 40px; }
.teaser-intro.text-left .teaser-link { right: 50%; }
.teaser-intro.text-left .teaser-link a { margin: 0; }
@media only screen and (max-width: 960px) { .teaser-intro.text-left .teaser-text { padding: 20px 0 20px 40px; } }

@media only screen and (min-width: 961px) and (max-width: 1100px) { .teaser-intro.text-left .teaser-text, .teaser-intro.text-left .price { right: 45%; }
  .teaser-text ul { display: none; }
  .teaser-link { right: 45%; } }
@media only screen and (max-width: 960px) { .teaser-text ul, .teaser-text p { display: none; } }
.hp-intros { margin: 0 auto 40px; max-width: 1084px; position: relative; /** total rework of mobile layout incoming */ /** fix buttons
*/ }
@media only screen and (max-width: 960px) { .hp-intros { max-width: 100%; } }
.hp-intros .slides { height: 100%; }
.hp-intros .slides > li img { width: 100%; max-height: none; }
.hp-intros .slides-button, .hp-intros .rc-next, .hp-intros .rc-prev { height: 60px; width: 20px; font-size: 1em; line-height: 60px; }
.hp-intros .slides-button.next, .hp-intros .next.rc-next, .hp-intros .next.rc-prev { margin: -15px -40px 0 0; }
.hp-intros .slides-button.next:before, .hp-intros .next.rc-next:before, .hp-intros .next.rc-prev:before { margin-left: 6px; }
.hp-intros .slides-button.prev, .hp-intros .prev.rc-next, .hp-intros .prev.rc-prev { margin: -15px 0 0 -40px; }
.hp-intros .slides-button.prev:before, .hp-intros .prev.rc-next:before, .hp-intros .prev.rc-prev:before { margin-left: 3px; }
.hp-intros .slides-button.btn, .hp-intros .btn.rc-next, .hp-intros .btn.rc-prev { padding: 20px 0; }
.hp-intros .slides-bullets, .hp-intros .rc-bullets { bottom: -30px; right: auto; width: 100%; text-align: center; }
@media only screen and (max-width: 700px) { .hp-intros .slides-bullets, .hp-intros .rc-bullets { overflow: hidden; display: block; } }
.hp-intros:after, .hp-intros:before { height: 100%; position: absolute; top: 0; width: 100%; z-index: 8; background: rgba(255, 255, 255, 0.6); content: ''; }
.hp-intros:before { margin-right: 10px; right: 100%; }
.hp-intros:after { left: 100%; margin-left: 10px; }
@media only screen and (max-width: 960px) { .hp-intros { margin-bottom: 60px; }
  .hp-intros .slides-bullets, .hp-intros .rc-bullets { bottom: -30px; } }
@media only screen and (max-width: 700px) { .hp-intros { margin-bottom: 40px; /** Mobile fussnoten
*/ }
  .hp-intros .hpintro { max-height: inherit; padding-bottom: 0; background-color: #fff; margin: 0 13px; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
  .hp-intros .hpintro-textl, .hp-intros .hpintro-textr { position: static; padding: 0; width: 100%; }
  .hp-intros .hpintro-textl.is-white, .hp-intros .hpintro-textl.is-white *, .hp-intros .hpintro-textr.is-white, .hp-intros .hpintro-textr.is-white * { color: #fff; }
  .hp-intros .hpintro-textl .is-content, .hp-intros .hpintro-textr .is-content { display: block; }
  .hp-intros .hpintro-textl h2.headline1, .hp-intros .hpintro-textl h2.headline1-light, .hp-intros .hpintro-textr h2.headline1, .hp-intros .hpintro-textr h2.headline1-light { position: absolute; top: 10px; left: 10px; right: 10px; font-size: 6vw; text-align: center !important; }
  .hp-intros .hpintro-textl .price, .hp-intros .hpintro-textr .price { margin-right: 0; margin-top: 10px; position: static; }
  .hp-intros .hpintro-textl .price.price-l, .hp-intros .hpintro-textl .price.price-xl, .hp-intros .hpintro-textr .price.price-l, .hp-intros .hpintro-textr .price.price-xl { right: 0; float: right; } }
@media only screen and (max-width: 700px) and (max-width: 700px) { .hp-intros .hpintro-textl .price.price-l, .hp-intros .hpintro-textl .price.price-xl, .hp-intros .hpintro-textr .price.price-l, .hp-intros .hpintro-textr .price.price-xl { float: left; right: auto; } }
@media only screen and (max-width: 700px) { .hp-intros .hpintro-textl .price.price-r, .hp-intros .hpintro-textr .price.price-r { right: 0; float: right; }
  .hp-intros .hpintro-textl .btn, .hp-intros .hpintro-textr .btn { width: 80vw; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); left: 50%; /* position: static; margin-top: $global-gap; width: 100%; */ }
  .hp-intros .slides-button, .hp-intros .rc-next, .hp-intros .rc-prev { top: -webkit-calc(50vw - 40px); top: calc(50vw - 40px); }
  .hp-intros .slides-bullets, .hp-intros .rc-bullets { bottom: -30px; }
  .hp-intros .slide .hpintro span.fn.fn-m-tc { left: 58%; top: 64vw; }
  .hp-intros .slide .hpintro span.fn.fn-m-tl { left: 30%; padding: 0 !important; top: 34vw; }
  .hp-intros .slide .hpintro span.fn.fn-m-tr { left: 89%; top: 48vw; } }
@media (max-width: 1084px) { .hp-intros {     /*.slides-button { &.next { margin-right: 0; }
 &.prev { margin-left: 0; } }*/ }
  .hp-intros:after, .hp-intros:before { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; margin: 0; padding-bottom: 50px; width: 18px; background: #fff; }
  .hp-intros:before { left: 0; right: auto; }
  .hp-intros:after { left: auto; right: 0; } }
@media (max-width: 1084px) { .hp-intros:after, .hp-intros:before { width: 10px; } }
@media (max-width: 1184px) { .hp-intros .slides-button.next, .hp-intros .next.rc-next, .hp-intros .next.rc-prev { margin-right: 0; }
  .hp-intros .slides-button.prev, .hp-intros .prev.rc-next, .hp-intros .prev.rc-prev { margin-left: 0; } }

.teaser .teaser-theme { text-transform: uppercase; }
.teaser .teaser-link { position: absolute; }

.powerlayer_list { margin: 0; }

.box.teaser .teaser-image { position: relative; }
.box.teaser .teaser-image span.fn { color: #df002e; position: absolute; }
.box.teaser .teaser-image .fn.fn-l { left: 31%; top: 36%; }
.box.teaser .teaser-image .fn.fn-r { left: 89%; top: 51%; }
.box.teaser .teaser-image .fn.fn-c { left: 60%; top: 70%; }

table { margin-bottom: 20px; width: 100%; }
@media only screen and (max-width: 700px) { table { margin-top: 20px; } }
table .group-radiobox label { margin-bottom: 0; }

thead { background-color: #21314d; color: #fff; }
thead td { font-weight: 700; }

thead { position: relative; clip: auto; height: auto; width: auto; overflow: auto; }

tbody { display: table-row-group; padding: 0; white-space: normal; }

tr { border-bottom: 1px solid #cccccc; }
@media only screen and (max-width: 700px) { tr { border-bottom: none; } }
tr:last-child { border-bottom: 1px solid #a6adb8; }

th, th[scope="row"] { font-weight: normal; text-align: left; }

.table-classic th[scope="row"] { color: #21314d; overflow: hidden; }

th.info, td.info { background-color: transparent; }
th.info:before, td.info:before { content: ""; font-size: 1em; margin-right: 0.5em; }

@media only screen and (max-width: 700px) { .table-classic th[scope="row"] { background-color: #21314d; border-bottom: 1px solid #cccccc; color: #fff; cursor: pointer; font-weight: 700; padding-right: 30px; position: relative; }
  .table-classic th[scope="row"]:before { font-family: "icons"; margin-top: -10px; right: 10px; position: absolute; top: 50%; content: '\e7c4'; }
  .table-classic th[scope="row"].is-open:before { content: '\e7c5'; } }
td, th { padding: 10px 20px; position: relative; }
@media only screen and (max-width: 700px) { td, th { padding: 10px; } }
td.right, th.right { padding-right: 0; }
td.right a.icon-link, th.right a.icon-link { margin: 0; padding: 0; }
td .data-title, th .data-title { display: none; }

.as-grid td, .as-grid th { padding: 10px; }

@media only screen and (max-width: 700px) { .table-classic tr, .table-classic td, .table-classic th, .table-classic .btn { display: block; width: 100%; }
  .table-classic thead { display: none; }
  .table-classic thead td.no-value { display: none; }
  .table-classic tbody th { padding: 10px; }
  .table-classic th input[type="radio"] { margin-right: 5px; }
  .table-classic tbody td { padding: 0; opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; }
  .table-classic tbody td.is-visible, .table-classic tbody td.visible { padding: 10px; opacity: 1; visibility: visible; height: 100%; z-index: 1; }
  .table-classic tbody td.is-visible .data-title, .table-classic tbody td.is-visible .data-content, .table-classic tbody td.visible .data-title, .table-classic tbody td.visible .data-content { height: auto; }
  .table-classic tbody td .data-title { display: block; height: 0; left: 0; position: absolute; text-align: left; top: 10px; width: 40%; }
  .table-classic tbody td .data-title.not-mobile { display: none; }
  .table-classic tbody td .data-content { height: 0; text-align: right; float: right; width: 60%; word-break: break-word; }
  .phone-right { text-align: right; } }
tfoot { text-align: right; }
@media only screen and (max-width: 700px) { tfoot span { float: left; } }
tfoot .last { float: right; margin: 0; }
tfoot td { padding: 10px 0; }
@media only screen and (max-width: 700px) { tfoot td { opacity: 1; visibility: visible; height: 100%; z-index: 1; } }
tfoot a.icon-link { margin: 0; padding: 0; }

.table-classic.dowloads th[scope="row"] { line-height: 1.7em; }
@media only screen and (max-width: 700px) { .table-classic.dowloads { line-height: inherit; } }
.table-classic.dowloads td.phone-right { white-space: nowrap; }

table.table-flip { table-layout: fixed; position: relative; }
table.table-flip thead tr, table.table-flip thead th { font-weight: 700; }
table.table-flip thead tr { background-color: #21314d; border-bottom: 1px solid #cccccc; color: #fff; cursor: pointer; position: relative; }
table.table-flip thead tr th:last-of-type:before { font-family: "icons"; right: 15px; position: absolute; content: '\e7c4'; }
@media only screen and (max-width: 700px) { table.table-flip thead tr th:last-of-type:before { right: 10px; } }
table.table-flip thead tr.is-open th:last-of-type:before { content: '\e7c5'; }
table.table-flip tr { border-bottom: none; border-top: 1px solid #cccccc; }
table.table-flip th[scope="col"], table.table-flip tbody td { text-align: center; }
table.table-flip tfoot td { text-align: left; }
table.table-flip tbody tr > th, table.table-flip tr > td { display: none; }
table.table-flip.show-body tbody { display: table-row-group; opacity: 1; visibility: visible; height: 100%; z-index: 1; }
table.table-flip.show-body tbody tr > th, table.table-flip.show-body tbody tr > td { display: table-cell; }
@media only screen and (max-width: 700px) { table.table-flip.show-body tbody tr > th, table.table-flip.show-body tbody tr > td { display: block; } }
@media only screen and (max-width: 700px) { table.table-flip.show-body tbody tr.tr-caption > th { background-color: #4d5a71; color: #fff; } }
table.table-flip.show-body tfoot { display: table-footer-group; opacity: 1; visibility: visible; height: 100%; z-index: 1; }
table.table-flip tbody, table.table-flip tfoot { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; }
@media only screen and (max-width: 700px) { table.table-flip thead th { font-size: 0; padding: 0; }
  table.table-flip thead tr:after { content: attr(data-heading); display: block; font-size: 1.3rem; padding: 10px; text-align: left; }
  table.table-flip th[scope="col"]:last-of-type:before { font-size: 1.3rem; padding: 10px 0; }
  table.table-flip tbody, table.table-flip tr, table.table-flip th, table.table-flip td { display: block; text-align: left; white-space: normal; }
  table.table-flip tbody { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
  table.table-flip th:first-of-type { text-align: left; }
  table.table-flip tbody th[scope="row"] { background-color: #e5e5e5; font-weight: 700; }
  table.table-flip tr { border: none; }
  table.table-flip tbody td[data-title] { border-bottom: 1px solid #cccccc; }
  table.table-flip tbody td[data-title]:last-of-type { border: none; }
  table.table-flip tbody td[data-title]:before { content: attr(data-title); float: left; }
  table.table-flip tbody td { text-align: right; }
  table.table-flip th .data-content, table.table-flip td .data-content { padding-left: 50%; } }

.tr-caption { border: none; }

.table-simple { table-layout: fixed; position: relative; }
.table-simple thead th { font-weight: 700; }
.table-simple th[scope="row"] { background-color: #21314d; border-bottom: 1px solid #cccccc; color: #fff; cursor: pointer; position: relative; }
.table-simple th[scope="row"]:before { font-family: "icons"; right: 15px; position: absolute; content: '\e7c4'; }
@media only screen and (max-width: 700px) { .table-simple th[scope="row"]:before { right: 10px; } }
.table-simple th[scope="row"].is-open:before { content: '\e7c5'; }
.table-simple tr { border-bottom: none; border-top: 1px solid #cccccc; }
.table-simple tr:last-child { border-bottom: none; }
.table-simple tbody, .table-simple tfoot { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; display: none; }
.table-simple tbody td, .table-simple tfoot td { text-align: center; }
@media only screen and (max-width: 700px) { .table-simple tbody td, .table-simple tfoot td { text-align: right; } }
.table-simple tfoot td { text-align: left; }
.table-simple.show-body tbody { display: block; display: table-row-group; opacity: 1; visibility: visible; height: 100%; z-index: 1; }
.table-simple.show-body tfoot { display: block; display: table-footer-group; opacity: 1; visibility: visible; height: 100%; z-index: 1; }

.tr-caption { background-color: #e5e5e5; border: none; }
.tr-caption th { font-weight: 700; }

.table-sort-checkbox th { background-color: #21314d; color: #fff; }
.table-sort-checkbox th.sortable:after { font-family: "icons"; left: 20px; position: relative; content: '\e605'; }

@media only screen and (max-width: 700px) { .table-sort-checkbox thead th { opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; padding: 0; }
  .table-sort-checkbox thead th:nth-child(2) { opacity: 1; visibility: visible; height: 100%; z-index: 1; padding: 10px 20px; } }
.table-sort-checkbox td .content { opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; position: absolute; }

.table-tariff { table-layout: fixed; }
@media only screen and (max-width: 700px) { .table-tariff { display: inline-block; margin-top: 0; overflow-x: auto; padding: 30px 0; table-layout: inherit; white-space: nowrap; } }
.table-tariff tbody tr td:first-child { border-top: 1px solid #a6adb8; }
@media only screen and (max-width: 700px) { .table-tariff tbody tr td:first-child > div { min-width: 15rem; padding-left: 0; } }
.table-tariff tbody tr:last-child td:first-child { border-bottom: 1px solid #a6adb8; }
.table-tariff tbody tr, .table-tariff tbody tr:last-child { border-bottom: 1px solid #f2f2f2; }
.table-tariff thead { color: #21314d; background-color: transparent; }
.table-tariff thead tr, .table-tariff thead th:first-child { border-bottom: none; }
.table-tariff thead th { border-bottom: 1px solid #f2f2f2; }
.table-tariff thead th > div { padding: 20px 20px 10px; background: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background: linear-gradient(45deg, #e5e5e5, #fff); }
.table-tariff tfoot tr { border-bottom: none; }
.table-tariff tfoot td > div { padding-bottom: 20px; }
.table-tariff th, .table-tariff td { padding: 0; position: relative;     /*&>div:before, &>div:after { content: " "; display: block; height: 100%; width: 49%;
 position: absolute; top: 0; right: 2px; z-index: -1;
 box-shadow: $boxShadowOut; }
 &>div:before { left: 0; right: auto; }*/ }
.table-tariff th > div, .table-tariff td > div { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); margin: 0 10px; padding: 10px 15px; position: relative; }
@media only screen and (max-width: 700px) { .table-tariff th > div, .table-tariff td > div { min-width: 22rem; } }
.table-tariff th:first-child, .table-tariff td:first-child { text-align: left; width: 25%; }
.table-tariff th:first-child > div, .table-tariff td:first-child > div { -webkit-box-shadow: none; box-shadow: none; margin: 0; }
.table-tariff th:first-child > div:before, .table-tariff th:first-child > div:after, .table-tariff td:first-child > div:before, .table-tariff td:first-child > div:after { content: none; }
.table-tariff th:last-child > div, .table-tariff td:last-child > div { margin-right: 0; }
.table-tariff th:first-child > div { background: none; }
.table-tariff th:first-child + th > div { margin-left: 2px; }
.table-tariff th h3 { margin-bottom: 0.3em; }
.table-tariff .head-clean th div { -webkit-box-shadow: none; box-shadow: none; background: transparent; margin-left: 10px; padding-left: 0; padding-right: 0; }
.table-tariff .head-clean th:first-child + th > div { margin-left: 0; }
.table-tariff .tr-caption th { padding: 10px 15px; }
.table-tariff td > div { min-height: 4rem; text-align: center; background-color: #fff; }
.table-tariff td:first-child > div { text-align: left; }
.table-tariff td:first-child + td div { margin-left: 2px; }
.table-tariff.text-left tbody td > div { text-align: left; }
.table-tariff a { margin-right: 0; }
.table-tariff .tfoot .icon-link { display: inline-block; margin-top: 1em; padding: 0; }
@media only screen and (max-width: 700px) { .table-tariff .tfoot .icon-link { margin-left: 20px; } }
.table-tariff thead th > div { padding-bottom: 4.3rem; }
.table-tariff thead .price { bottom: 25px; right: 20px; position: absolute; }
.table-tariff thead .price .price-foot { position: absolute; right: 0; }
.table-tariff .net { bottom: 25px; left: 20px; position: absolute; }

.table-tariff .flag, .tariff-box .flag { width: 75px; position: absolute; right: -1.6rem; top: -3.2rem; }

.table-tariff thead.head-blue th > div { color: #fff; background: #21314d; }
.table-tariff thead.head-blue hr { border-color: #a6adb8; }

.table-tariff .tr-caption { cursor: pointer; border-bottom: 2px solid #e5e5e5; }
.table-tariff .tr-caption.is-active { border-bottom: 2px solid #fff; }
.table-tariff .tr-caption .arrow { display: block; position: relative; }
.table-tariff .tr-caption .arrow:after { font-family: "icons"; right: 5px; top: -1.8rem; position: absolute; content: '\e7c5'; }
.table-tariff .tr-caption.is-open .arrow:after { content: '\e7c4'; }
.table-tariff tr[data-row-group].is-invisible { display: table-column; opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; }

.introslides { height: 500px; height: 66vh; min-height: 500px; }
@media only screen and (max-width: 700px) { .introslides { display: none; } }
.introslides .slide { bottom: 0; left: 0; position: absolute; right: 0; top: 0; background-size: cover; background-position: center top; }
.introslides .slides-bullets, .introslides .rc-bullets { left: 0; right: 0; text-align: center; }
.introslides .slides-bullets li, .introslides .rc-bullets li { height: 220px; margin: 0 10px; width: 220px; background-color: rgba(77, 90, 113, 0.4); color: #fff; text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25); }
.introslides .slides-bullets li.is-active, .introslides .rc-bullets li.is-active, .introslides .slides-bullets li:active, .introslides .rc-bullets li:active, .introslides .slides-bullets li:hover, .introslides .rc-bullets li:hover { background: rgba(132, 188, 52, 0.85); }
.introslides .slides-bullets li:before, .introslides .rc-bullets li:before, .introslides .slides-bullets li .is-centered, .introslides .rc-bullets li .is-centered { display: inline-block; margin-left: -.25em; vertical-align: middle; }
.introslides .slides-bullets li:before, .introslides .rc-bullets li:before { height: 100%; content: ''; }
@media only screen and (max-width: 960px) { .introslides .slides-bullets li, .introslides .rc-bullets li { margin: 0 5px; height: 180px; width: 180px; } }

.introslides.bullets-vertical .slides-bullets, .introslides.bullets-vertical .rc-bullets { top: 0; right: auto; }
.introslides.bullets-vertical .slides-bullets li, .introslides.bullets-vertical .rc-bullets li { display: block; margin-bottom: 20px; }

.content-intro { margin-bottom: 20px; position: relative; }

.content-intro-prefix { position: absolute; width: 100%; z-index: 1; }
@media only screen and (max-width: 700px) { .content-intro-prefix { position: relative; } }

.nav-boxes { position: relative; }
@media only screen and (max-width: 700px) { .nav-boxes { position: static; } }
.nav-boxes .infobox-shadowed.with-btn { padding-bottom: 3.5rem; }
@media only screen and (max-width: 700px) { .nav-boxes .infobox-shadowed.with-btn { padding-bottom: 10px; } }
.nav-boxes .infobox-btn { bottom: 10px; margin-left: -10px; padding: 0 10px; position: absolute; width: 100%; }
.nav-boxes .infobox-btn .btn { margin: 0; }
@media only screen and (max-width: 700px) { .nav-boxes .infobox-btn { position: static; margin: 0; padding: 0; }
  .nav-boxes .infobox-btn .btn { margin: 5px 0; } }

.intro-fullscreen + .nav-boxes { top: -8rem; }

.introslides + .nav-boxes { margin-bottom: 8rem; top: 8rem; }

.intro-addonimg { margin-top: -220px; min-height: 220px; }
@media only screen and (max-width: 960px) { .intro-addonimg { margin-top: -120px; } }
@media only screen and (max-width: 700px) { .intro-addonimg { margin-top: 0; min-height: 0; } }
.intro-addonimg img { max-width: 100%; }

.autocomplete { position: absolute; height: auto; top: 55px; width: 100%; z-index: 3; }
@media only screen and (max-width: 960px) { .autocomplete { position: relative; top: inherit; height: 0; } }

.autocomplete-suggestions { list-style-type: none; margin: 0; background-color: #fff; }

.autocomplete-suggestion { cursor: pointer; border-color: #cccccc; border-style: solid; border-width: 0 1px; padding: 4px 10px; }
.autocomplete-suggestion:hover, .autocomplete-suggestion.active { color: #21314d; background: #d3d6db; }
.autocomplete-suggestion.last { border-bottom-width: 1px; }
.autocomplete-suggestion em { color: #84bc34; font-style: normal; font-weight: 700; }
.autocomplete-suggestion .badge { display: inline-block; float: right; padding: 3px 7px; color: #7a8394; border-radius: 10px; vertical-align: baseline; font-size: 1rem; }

.form-btn-set { clear: both; margin: 12px 10px 20px 0; position: relative; z-index: 1; }
.form-btn-set.thx { margin-right: 0; text-align: right; }
@media only screen and (max-width: 700px) { .form-btn-set { margin-top: 30px; } }
.form-btn-set .right { float: right; margin-right: 0; }

.steps fieldset { border-bottom: 1px solid #cccccc; padding: 20px 0 0; }
@media only screen and (max-width: 700px) { .steps fieldset { padding: 30px 0 10px 0; } }
.steps fieldset:first-of-type { padding-top: 0; }
.steps fieldset:last-of-type { border-bottom: none; }

.api-form-success, .api-form-error { display: none; }

form.api-success .form-item { display: none; }
form.api-success .api-form-success { display: block; }

form.api-error .form-item { display: none; }
form.api-error .api-form-error { display: block; }

@media only screen and (max-width: 700px) { .ps-dashboard .box-rectangle.as-contentintro { height: auto; max-height: none; padding: 0; } }

.box-device, #costCheck { position: absolute; top: 70px; }
.box-device#boxDevice, #costCheck#boxDevice { right: 0; }
@media only screen and (max-width: 700px) { .box-device#boxDevice, #costCheck#boxDevice { top: 20px; min-height: 5px; } }
.box-device.is-d2-prepaid, #costCheck.is-d2-prepaid { top: 110px; }
@media only screen and (max-width: 700px) { .box-device, #costCheck { position: relative; top: 0; } }

@media only screen and (max-width: 700px) { .box-device { height: 0; overflow: visible; } }
.box-selected, .box-suggested { padding-bottom: 80%; }
.box-selected h2, .box-suggested h2 { padding-bottom: 10px; }
.box-selected h3, .box-suggested h3 { font-family: "canada-type-gibson", sans-serif; font-size: 1.7rem; margin-bottom: 5px; }
.box-selected .box-text, .box-suggested .box-text { height: 66%; background: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background: linear-gradient(45deg, #e5e5e5, #fff); }
.box-selected .details, .box-suggested .details { margin-left: 45%; font-size: 1.3rem; }
.box-selected ul, .box-suggested ul { margin: 0 0 10px 24px; padding: 0; }
.box-selected .icon-pen, .box-suggested .icon-pen { position: absolute; top: 0; right: 10px; font-size: 1.2rem; line-height: 40px; text-align: center; cursor: pointer; }
.box-selected .icon-pen:hover, .box-suggested .icon-pen:hover { text-decoration: none; }
.box-selected .icon-pen:after, .box-suggested .icon-pen:after { vertical-align: middle; line-height: 40px; font-size: 1.8rem; }
.box-selected .box-content, .box-suggested .box-content { overflow: visible; }

.box-phone .box-image, .box-tariff .box-image { position: absolute; bottom: 7%; left: 30px; width: 26%; }
.box-phone .box-image img, .box-tariff .box-image img { width: 100%; }

.box-price { position: absolute; bottom: 5%; right: 20px; }

.element-wprapper { position: relative; }

.ps-dashboard .slides-box { height: 100% !important; }

.ps-dashboard .as-contentintro .btn, .ps-dashboard .as-contentintro .price { bottom: 20px; }

.slides, .slides-box { margin: 0; max-height: 100%; max-width: 100%; padding: 0; position: relative; width: 100%; list-style: none; }
@media only screen and (max-width: 700px) { .slides, .slides-box { height: 100% !important; } }

.slides .slides-container > li, .slides-box .slides-container-box > li { bottom: 0; left: 0; position: absolute; right: 0; top: 0; }
.slides .slides-container > li img, .slides-box .slides-container-box > li img { height: auto; max-width: 100%; width: auto; }
.slides .slides-container > li > span, .slides-box .slides-container-box > li > span { width: 100%; }

.slides-container > li, .slides-container-box > li { right: auto; width: 100%; z-index: 1; }
.slides-container > li.is-visible, .slides-container-box > li.is-visible { opacity: 1; visibility: visible; }

.slides > li { bottom: 0; left: 0; position: absolute; right: 0; text-align: center; top: 0; }
.slides > li img { height: auto; margin: 0 auto; max-height: 100%; max-width: 100%; width: auto; }
.slides > li > span { width: 100%; }

.is-slider .slides > li { right: auto; width: 100%; z-index: 1; opacity: 1; visibility: visible; -webkit-transform-origin: right; -ms-transform-origin: right; transform-origin: right; -webkit-transform: scale(0.85); -ms-transform: scale(0.85); transform: scale(0.85); }
.is-slider .slides > li.is-visible { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
.is-slider .slides > li.is-cloned:last-child { -webkit-transition: all 0s; transition: all 0s; -webkit-transform-origin: right; -ms-transform-origin: right; transform-origin: right; }
.is-slider .slides li.is-visible + li { -webkit-transform-origin: left; -ms-transform-origin: left; transform-origin: left; }

.ps-dashboard .slides-counter { font-weight: 700; top: auto; right: 20px; }

.slides-bullets, .rc-bullets, .slides-counter { bottom: 10px; right: 20px; margin: 0; padding: 0; position: absolute; list-style: none; text-align: right; z-index: 3; }
@media only screen and (max-width: 700px) { .slides-bullets, .rc-bullets, .slides-counter { display: none; } }
.slides-bullets li, .rc-bullets li, .slides-counter li { display: inline-block; height: 10px; font-size: 0; width: 10px; margin-left: 0.7rem; overflow: hidden; border-radius: 50%; background: #7a8394; cursor: pointer; line-height: 1; }
.slides-bullets li:first-child, .rc-bullets li:first-child, .slides-counter li:first-child { margin-left: 0; }
.slides-bullets li.is-active, .rc-bullets li.is-active, .slides-bullets li:active, .rc-bullets li:active, .slides-bullets li:hover, .rc-bullets li:hover, .slides-counter li.is-active, .slides-counter li:active, .slides-counter li:hover { background: #84bc34; }

.bullets-vertical .slides-bullets li:first-child, .bullets-vertical .rc-bullets li:first-child { margin: 0 10px 20px; }

.bg-white .slides-bullets li, .bg-white .rc-bullets li { background-color: #cccccc; }
.bg-white .slides-bullets li.is-active, .bg-white .rc-bullets li.is-active, .bg-white .slides-bullets li:active, .bg-white .rc-bullets li:active, .bg-white .slides-bullets li:hover, .bg-white .rc-bullets li:hover { background-color: #21314d; }

.slides-button, .rc-next, .rc-prev { display: block; height: 30px; overflow: hidden; position: absolute; top: 50%; width: 30px; z-index: 8; cursor: pointer; text-align: center; line-height: 30px; min-width: 30px; }
.slides-button.next, .next.rc-next, .next.rc-prev { margin: -5px 0 0 0; right: 0; }
.slides-button.prev, .prev.rc-next, .prev.rc-prev { left: 0; margin: -5px 0 0 0; }
.slides-button.btn, .btn.rc-next, .btn.rc-prev { padding: 6px 0; }
.slides-button.btn:before, .btn.rc-next:before, .btn.rc-prev:before { margin: 0; vertical-align: top; }

.bg-white .slides-button, .bg-white .rc-next, .bg-white .rc-prev { color: #21314d; }
.bg-white .slides-button.btn, .bg-white .btn.rc-next, .bg-white .btn.rc-prev { background-color: #fff; }
.bg-white .slides-button.btn:active, .bg-white .btn.rc-next:active, .bg-white .btn.rc-prev:active, .bg-white .slides-button.btn:hover, .bg-white .btn.rc-next:hover, .bg-white .btn.rc-prev:hover { background: #cccccc; }

.slides-counter { display: block; position: absolute; top: 16px; right: 64px; z-index: 101; }

.search-results-shop { margin-bottom: 40px; /*.btn.rc-next:before { padding-right: 0;
}*/ }
.search-results-shop .rc-item { margin-right: 0; vertical-align: top; }

.search-results-shop .device-item .box-content { padding: 10px; cursor: default; }
.search-results-shop .device-item .box-header { height: 130px; }
.search-results-shop .device-item .box-footer { margin-top: 120px; position: relative; min-height: 170px; }
.search-results-shop .device-item .box-footer .btn { position: absolute; bottom: 0; margin: 0; }
.search-results-shop .device-item .image { left: 30px; height: 100px; }
.search-results-shop .device-item .device-price { right: 0; top: 95px; }
.search-results-shop .device-item ul { margin-left: 5px; }
.search-results-shop .device-item ul.linklist { padding-left: 0; margin: 5px 0; }
.search-results-shop .device-item a.btn-block { margin-top: 20px; }

.results-wrapper.filter-is-fixed { margin-top: 50px; }

.search-flex { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-flex-basis: 200px; }
.search-flex > div { padding-bottom: 20px; }

.options-group .options-list { display: none; }

.options-group.open .options-list { display: block; }

.accessory-item { display: table; table-layout: fixed; padding: 20px; width: 100%; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }

.accessory-image, .accessory-details, .accessory-amount, .accessory-price { display: table-cell; }

.accessory-amount { width: 100px; }
.accessory-amount input { width: 50px; }

.accessory-price { text-align: right; }
.accessory-price label { padding-right: 25px; padding-left: 0; }
.accessory-price input { float: right; margin-left: 0; margin-right: -25px; }

@media only screen and (max-width: 700px) { #vvl-options-panel label.btn { height: auto; line-height: 2rem; } }

/*div*/
.tariff-wrapper { position: relative; }

/*div*/
.tariff-list { margin: 0; padding: 0; position: relative; z-index: 1; }
.tariff-list .tariff-item:last-child { margin-bottom: 0; }

/** tariff header
*/
.tariff-header { margin-bottom: 20px; font-size: 0; display: table; table-layout: fixed; width: 100%; }
@media only screen and (max-width: 700px) { .tariff-header { display: none; } }
.tariff-header .tariff-icon, .tariff-header .tariff-info, .tariff-header .tariff-phone, .tariff-header .tariff-sms, .tariff-header .tariff-surf, .tariff-header .tariff-price { padding: 0; }
.tariff-header h3 { color: #fff; display: block; background-color: #21314d; margin: 0 10px 0 0; padding: 10px 0 10px 10px; }
.tariff-header .tariff-surf h3 { margin-right: 0; }
.tariff-header .tariff-price { height: auto; }

/** tariff lines
*/
.line-wrapper { position: absolute; left: 10px; right: 10px; z-index: 0; top: 10px; bottom: 10px; }
@media only screen and (max-width: 1100px) { .line-wrapper { left: 56px; right: 56px; } }
@media only screen and (max-width: 960px) { .line-wrapper { left: 18px; right: 18px; } }
@media only screen and (max-width: 700px) { .line-wrapper { display: none; } }

.tariff-lines { height: 100%; width: 100%; z-index: 0; display: table; table-layout: fixed; }
.tariff-lines .tariff-phone, .tariff-lines .tariff-sms, .tariff-lines .tariff-surf { border-left: 1px solid #cccccc; }
.tariff-lines .tariff-surf { border-right: 1px solid #cccccc; }

.vvl-selection .btn-cart { float: right; margin-right: 0; }
.vvl-selection .btn-big { min-width: initial; }
.vvl-selection .box-settings { left: 35%; position: absolute; width: 120px; bottom: 5%; }
.vvl-selection .box-settings .dropdown { margin-bottom: 0; }
.vvl-selection .box-settings .inner-span { min-width: 107px; padding-right: 40px; font-weight: normal; }
.vvl-selection .box-settings .dropdown-holder { margin: 0; }
.vvl-selection hr { margin: 10px 0 40px; }
.vvl-selection .box-device-0 .box-image { width: 50%; }
@media only screen and (max-width: 960px) { .vvl-selection h2 { margin-bottom: 10px; }
  .vvl-selection ul { margin-bottom: 5px; }
  .vvl-selection .box-text { padding: 15px; }
  .vvl-selection .details { margin-left: 32%; }
  .vvl-selection .box-image { bottom: 5%; width: 25%; left: 15px; }
  .vvl-selection .box-settings { left: 35%; }
  .vvl-selection .box-price { bottom: 0; }
  .vvl-selection .dropdown { font-size: 1.3rem; } }
@media only screen and (max-width: 700px) { .vvl-selection .box { height: auto; padding: 0; }
  .vvl-selection .box-content { position: static; }
  .vvl-selection .box-text { padding: 10px; }
  .vvl-selection .box-image { margin-left: 5px; margin-bottom: 5px; width: 70px; position: static; }
  .vvl-selection .box-settings { bottom: 50px; }
  .vvl-selection .box-price { bottom: 0; right: 10px; }
  .vvl-selection .box-price .price-value { font-size: 12vw; }
  .vvl-selection h3 { font-size: 1.3rem; }
  .vvl-selection h2 { font-size: 1.5rem; padding-bottom: 5px; margin-bottom: 5px; }
  .vvl-selection .details { margin-left: 0; font-size: 1.3rem; }
  .vvl-selection .icon-plus { display: none; } }

.vvl-selection-options h3 { font-size: 1.4rem; }
.vvl-selection-options h2 { font-size: 1.4rem; }
.vvl-selection-options .box-list ul { position: absolute; left: 20px; top: 40px; right: 20px; bottom: 60px; overflow-y: auto; }
@media only screen and (max-width: 960px) { .vvl-selection-options .box-list ul { position: static; } }
.vvl-selection-options .box-list ul li { padding-right: 20px; }
.vvl-selection-options .box-list ul li .option-name strong[ng-click] { color: #84bc34; cursor: pointer; }
.vvl-selection-options .has-recommendation .box-foot { bottom: 0 !important; padding-bottom: 0; }
.vvl-selection-options .has-recommendation .box-list ul { bottom: 120px; }
.vvl-selection-options .has-recommendation .box-recommendation { margin: 10px -10px 0; padding: 10px 20px; background-color: #f2f2f2; }
.vvl-selection-options .details { position: absolute; right: 0; bottom: 75px; margin: 0; }
.vvl-selection-options .details a { padding-right: 10px; margin: 0; }
.vvl-selection-options .box-tariff .box-content .box-image { left: 0; width: 100%; top: 51.5%; }
.vvl-selection-options .box-tariff .box-content .box-image img { max-width: 66%; }
.vvl-selection-options .box-tariff .box-content .box-foot { bottom: 5px; }
@media only screen and (max-width: 700px) { .vvl-selection-options .details { bottom: 25vw; }
  .vvl-selection-options .box-tariff .box-content .box-image { width: 50%; } }

@media only screen and (max-width: 700px) { .vvl-overview-container { overflow: auto; } }

.vvl-overview { margin-bottom: 10px; }
.vvl-overview tr.has-error { background-color: #ffebe1; }
.vvl-overview td { vertical-align: top; }
.vvl-overview td.image { text-align: center; }
.vvl-overview td.image img { max-height: 100px; }
.vvl-overview td.price { text-align: center; }
.vvl-overview td.amount { text-align: center; }
.vvl-overview td.price { text-align: right; }
.vvl-overview td.center { text-align: center; }
.vvl-overview tfoot td { text-align: left; vertical-align: middle; padding: 10px 20px; }
.vvl-overview tfoot .text-right { text-align: right; }
.vvl-overview span.delivery:before { font-size: 4rem; }

.vvl-send-options { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -10px 30px; }
.vvl-send-options .flex-col { position: relative; -webkit-box-flex: 0; -webkit-flex: 0 0 33%; -ms-flex: 0 0 33%; flex: 0 0 33%; padding: 10px; }
.vvl-send-options .flex-col .container { position: relative; margin-right: 0; padding: 20px; margin-bottom: 0; width: 100%; color: #21314d; font-weight: normal; cursor: pointer; }
.vvl-send-options .flex-col .container span { font-size: 13px; display: block; }
.vvl-send-options .flex-col .container strong { display: block; font-weight: 700; margin-bottom: 20px; }
.vvl-send-options .flex-col .container:first-child p:first-child { margin: 0; }
.vvl-send-options .flex-col.is-active::before { border: 3px solid #84bc34; }
.vvl-send-options .flex-col::before { content: ''; position: absolute; z-index: 0; left: 10px; right: 10px; top: 10px; bottom: 10px; background-color: #fff; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); cursor: pointer; line-height: 1.8; overflow: visible; }
@media only screen and (max-width: 700px) { .vvl-send-options .flex-col { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; min-height: 0; padding: 10px 10px 0; -webkit-transition: all 0.4s linear; transition: all 0.4s linear; }
  .vvl-send-options .flex-col .container.is-active { padding: 15px 0 0; }
  .vvl-send-options .flex-col strong { margin-bottom: 10px; }
  .vvl-send-options .flex-col span { height: 24px; overflow: hidden; }
  .vvl-send-options .flex-col.is-active span { height: auto; } }

.vvl-send-shop { margin-bottom: 20px; }
.vvl-send-shop label { width: 100%; font-weight: normal; margin-left: 20px; }
.vvl-send-shop label input { margin-left: -20px; }
@media only screen and (max-width: 700px) { .vvl-send-shop .form-item { margin-bottom: 20px; }
  .vvl-send-shop .grid-form-1 { width: -webkit-calc(35% - 25px); width: calc(35% - 25px); }
  .vvl-send-shop .grid-form-2 { width: -webkit-calc(65% - 25px); width: calc(65% - 25px); padding: 0 10px; }
  .vvl-send-shop span.btn { margin: -5px 0 0; float: right; } }

.vvl-overview-footer, .vvl-confirmation-footer { margin-top: 30px; }
.vvl-overview-footer hr, .vvl-confirmation-footer hr { margin-bottom: 30px; }
.vvl-overview-footer .btn-big, .vvl-confirmation-footer .btn-big { min-width: initial; }

.tabs-bg { padding: 40px; }

.rc { margin-bottom: 40px; position: relative; }

.rc-container { overflow: hidden; }

.rc-wrapper { left: 0; position: relative; white-space: nowrap; -webkit-transition: left .3s ease-out; transition: left .3s ease-out; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.rc-item { display: inline-block; margin-right: -.25em; vertical-align: top; white-space: normal; }

.rc-next, .rc-prev { margin: -15px 0 0; text-align: right; }

.rc-next { right: 0; }

.rc-prev { left: 0; }

.rc-bullets { display: block; left: 0; margin-top: 10px; right: 0; top: 100%; text-align: center; }

.rc-count { display: none; }

.rc-full .rc-item { width: 100%; }

.big-arrow[data-icon] { height: auto; margin-top: -3.5rem; width: auto; }
@media only screen and (max-width: 1100px) { .big-arrow[data-icon] { padding: 0 46px; } }
@media only screen and (max-width: 960px) { .big-arrow[data-icon] { padding: 0; } }
.big-arrow[data-icon]:before { font-size: 8rem; line-height: 0.8; margin-left: 0.2em; }
@media only screen and (max-width: 960px) { .big-arrow[data-icon]:before { font-size: 4rem; } }

/* Slider */
.slick-loading .slick-list { background: #fff url("./ajax-loader.gif") center center no-repeat; }

/* Icons */
/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0px; font-size: 0px; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -10px; padding: 0; border: none; outline: none; }
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; }
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

.slick-prev:before, .slick-next:before { font-family: "icons"; font-size: 20px; line-height: 1; color: #000; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: -25px; }
[dir="rtl"] .slick-prev { left: auto; right: -25px; }
.slick-prev:before { content: ""; }
[dir="rtl"] .slick-prev:before { content: ""; }

.slick-next { right: -25px; }
[dir="rtl"] .slick-next { left: -25px; right: auto; }
.slick-next:before { content: ""; }
[dir="rtl"] .slick-next:before { content: ""; }

/* Dots */
.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; }
.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "icons"; font-size: 6px; line-height: 20px; text-align: center; color: #000; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { color: #000; opacity: 0.75; }

/* Slider */
.slick-slider { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; }
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }
[dir="rtl"] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

.rc--offers { text-align: center; }
.rc--offers .rc-item:hover { -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); background-color: #f2f2f2; }
.rc--offers .rc-item, .rc--offers .rc-item * { color: #21314d; }
.rc--offers .rc-item a { text-decoration: none; }
.rc--offers .rc-item h3 { min-height: 3em; }
.rc--offers .rc-item .price, .rc--offers .rc-item .btn { margin-bottom: 20px; margin-right: 0; }
@media only screen and (min-width: 701px) { .rc--offers .rc-next, .rc--offers .rc-prev { height: 60px; margin-top: -30px; padding: 20px 0; line-height: 60px; } }

.infoboxes { margin-bottom: 20px; }
@media only screen and (max-width: 700px) { .infoboxes { margin-bottom: 10px; } }

.infoboxes-short-list .infobox-short:first-child { border-top: 1px solid #21314d; }
@media only screen and (max-width: 700px) { .infoboxes-short-list + .infoboxes-short-list .infobox-short:first-child { border-top: none; } }

@media only screen and (max-width: 700px) { .infoboxes-shadowed { display: block; } }

.frequent-questions { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); min-height: auto; }
.frequent-questions > div * { max-width: 100%; }
@media only screen and (max-width: 960px) { .frequent-questions.is-flexbox { display: none; } }
.frequent-questions .box-theme, .frequent-questions .box-questions { -webkit-box-flex: 0; -webkit-flex: 0 1 25%; -ms-flex: 0 1 25%; flex: 0 1 25%; width: 25%; }
.frequent-questions .box-responses { background-color: #fff; -webkit-box-flex: 0; -webkit-flex: 0 1 50%; -ms-flex: 0 1 50%; flex: 0 1 50%; width: 50%; }
.frequent-questions .box-theme, .frequent-questions .box-questions, .frequent-questions .box-responses { padding: 20px; }

.box-questions > ul, .box-responses > ul { list-style: none; margin: 0; width: 100%; }

.box-questions li { color: #7a8394; cursor: pointer; font-weight: 700; padding-bottom: 10px; }
.box-questions li.is-active { color: #21314d; position: relative; }
.box-questions li.is-active:after { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 5px; border-color: transparent transparent transparent #f2f2f2; position: absolute; right: -5px; top: 50%; z-index: 3; }
.box-questions li.is-active:after { right: -2.4rem; top: .5em; }

.box-responses > ul > li { opacity: 0; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: hidden; height: 0; z-index: 0; }
.box-responses > ul > li.is-visible, .box-responses > ul > li.is-always-visible { margin-bottom: 20px; opacity: 1; visibility: visible; height: 100%; z-index: 1; }

.division-2 .box-footer { width: 50%; float: right; }
.division-2 .box-footer .btn { float: right; margin-right: 0; width: auto; }

.division-btn-3  .btn { float: right; right: 20px; left: auto; width: 33%; }
@media only screen and (max-width: 700px) { .division-btn-3  .btn { right: 10px; width: auto; } }

.smartphoneBox { margin-bottom: 15px; }
@media only screen and (max-width: 700px) { .smartphoneBox { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); } }
.smartphoneBox .device, .smartphoneBox .tariff { float: left; height: 35rem; position: relative; z-index: 2; /*.price { position: absolute; top: 65%; right: 0; @include breakpoint(tablet-landscape) { bottom: 0; top: auto; } @include breakpoint(phone) { top: auto; bottom: $global-gap; right: $global-gap; }
}*/ }
@media only screen and (max-width: 1100px) { .smartphoneBox .device, .smartphoneBox .tariff { height: 30rem; } }
@media only screen and (max-width: 700px) { .smartphoneBox .device, .smartphoneBox .tariff { height: auto; padding: 20px; } }
.smartphoneBox .device .details, .smartphoneBox .tariff .details { margin-top: 2em; }
@media only screen and (max-width: 700px) { .smartphoneBox .device .details, .smartphoneBox .tariff .details { margin-top: 0; } }
.smartphoneBox .device { width: 66.66%; }
@media only screen and (max-width: 960px) { .smartphoneBox .device { width: 100%; } }
@media only screen and (max-width: 700px) { .smartphoneBox .device { border-bottom: 2px solid #e5e5e5; } }
.smartphoneBox .device .link-hwo { position: absolute; right: 0; bottom: -15px; }
@media only screen and (max-width: 1100px) { .smartphoneBox .device .link-hwo { bottom: -15px; top: auto; } }
@media only screen and (max-width: 700px) { .smartphoneBox .device .link-hwo { bottom: -15px; top: auto !important; } }
.smartphoneBox .device .device-price { position: absolute; right: 0; bottom: 0; top: auto; }
.smartphoneBox .tariff { min-width: 30rem; padding-right: 20px; width: 33.3%; position: relative; }
@media only screen and (max-width: 1100px) { .smartphoneBox .tariff { min-width: 25rem; } }
@media only screen and (max-width: 960px) { .smartphoneBox .tariff { margin-left: 50%; padding-right: 0; width: 45%; margin-top: 20px; } }
@media only screen and (max-width: 700px) { .smartphoneBox .tariff { margin-left: 0; padding-right: 20px; padding-top: 30px; width: 100%; } }
.smartphoneBox .tariff .tariff-change.not-mobile { float: right; margin: 0; padding: 0; }
.smartphoneBox .tariff .net { margin: 0; position: absolute; right: 20px; top: 20px; }
@media only screen and (max-width: 700px) { .smartphoneBox .tariff .net { top: 42px; } }
.smartphoneBox .tariff .icon-plus { left: -40px; margin-left: -20px; margin-top: -20px; top: 35%; }
.smartphoneBox .tariff .icon-plus:before { line-height: 40px; font-size: 3rem; margin-right: 0; }
@media only screen and (max-width: 1100px) { .smartphoneBox .tariff .icon-plus { display: none; } }
@media only screen and (max-width: 700px) { .smartphoneBox .tariff .icon-plus { display: block; left: 50%; margin-left: -20px; top: -23px; } }
.smartphoneBox .tariff [app-md-price] { position: absolute; bottom: -15px; right: 20px; }
@media only screen and (max-width: 700px) { .smartphoneBox .tariff [app-md-price] { position: static; right: 0; } }
.smartphoneBox .tariff [app-md-price].with-foot { bottom: -15px; }

.deviceCond { height: 100%; min-width: 30rem; max-width: 35rem; position: relative; }
@media only screen and (max-width: 1100px) { .deviceCond { min-width: 25rem; width: 50%; } }
@media only screen and (max-width: 960px) { .deviceCond { width: 45vw; } }
@media only screen and (max-width: 700px) { .deviceCond { width: 100%; max-width: none; } }
.deviceCond .details > h3 { padding-top: 1.3em; }

.deviceImg, .deviceCond { float: left; }

@media only screen and (max-width: 700px) { .deviceCond { clear: both; } }
.deviceImg { height: 35rem; min-width: 35rem; position: relative; top: 20px; }
@media only screen and (max-width: 1100px) { .deviceImg { height: 30rem; min-width: 30rem; top: 0; } }
@media only screen and (max-width: 960px) { .deviceImg { height: 50vw; width: 50%; } }
@media only screen and (max-width: 700px) { .deviceImg { display: inline-block; height: auto; min-width: 50%; width: 70%; } }
.deviceImg img { height: auto; max-width: 30rem; }
@media only screen and (max-width: 700px) { .deviceImg img { width: 100%; } }

.offer-foot { position: relative; }

.phoneFlags { display: inline-block; float: left; padding-top: 20px; text-align: right; width: 30%; }
.phoneFlags .flagsLine { margin: 0; list-style: none; }

.back-link { border-bottom: 1px solid #e5e5e5; height: 40px; }
.back-link a, .back-link a:before { line-height: 30px; }

.bestseller { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 1.5rem; position: relative; }
@media only screen and (max-width: 700px) { .bestseller { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); padding: 20px 20px 10px; } }
.bestseller__image { -webkit-box-flex: 0; -webkit-flex: 0 0 30%; -ms-flex: 0 0 30%; flex: 0 0 30%; padding-top: 2rem; }
@media only screen and (max-width: 700px) { .bestseller__image { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; padding-top: 0; }
  .bestseller__image img { min-width: 50%; width: 70%; } }
.bestseller__device { -webkit-box-flex: 0; -webkit-flex: 0 0 35%; -ms-flex: 0 0 35%; flex: 0 0 35%; position: relative; padding-top: 3.5em; }
@media only screen and (max-width: 1100px) { .bestseller__device { min-height: 28rem; padding-bottom: 20px; } }
@media only screen and (max-width: 700px) { .bestseller__device { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; border-bottom: 2px solid #e5e5e5; padding-top: 0; padding-bottom: 4rem; min-height: auto; } }
.bestseller__device-price { position: absolute; bottom: 0; right: 20%; }
.bestseller__device-price.with-foot { bottom: -20px; }
@media only screen and (max-width: 1100px) { .bestseller__device-price { bottom: -13px; } }
@media only screen and (max-width: 700px) { .bestseller__device-price { right: 0; bottom: 40px; } }
.bestseller__device-price-hwo { position: absolute !important; right: 20%; bottom: -20px; }
@media only screen and (max-width: 1100px) { .bestseller__device-price-hwo { bottom: -30px; } }
@media only screen and (max-width: 700px) { .bestseller__device-price-hwo { right: 0; bottom: 21px; } }
.bestseller__device ul.list { padding-right: 55px; }
@media only screen and (max-width: 700px) { .bestseller__device ul.list { padding-right: 10px; } }
.bestseller__device .icon-plus { top: 35%; right: 20px; left: auto; margin-left: -20px; margin-top: -20px; }
@media only screen and (max-width: 1100px) { .bestseller__device .icon-plus { display: none; } }
@media only screen and (max-width: 700px) { .bestseller__device .icon-plus { display: block; left: 50%; margin-left: -20px; top: auto; bottom: -20px; } }
.bestseller__tariff { -webkit-box-flex: 0; -webkit-flex: 0 0 35%; -ms-flex: 0 0 35%; flex: 0 0 35%; position: relative; padding-top: 2em; }
@media only screen and (max-width: 700px) { .bestseller__tariff { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; padding-top: 3rem; } }
.bestseller__tariff-change-link { position: absolute !important; top: 0; right: 20px; }
@media only screen and (max-width: 700px) { .bestseller__tariff-change-link { display: none; } }
.bestseller__tariff-price { position: absolute; bottom: 0; right: 20px; }
@media only screen and (min-width: 1101px) { .bestseller__tariff-price.with-foot { bottom: -18px; } }
@media only screen and (max-width: 1100px) { .bestseller__tariff-price { bottom: -30px; } }
@media only screen and (max-width: 700px) { .bestseller__tariff-price { position: static; right: 0; } }
.bestseller__tariff .net { margin: 0; position: absolute; right: 20px; top: 20px; }
.bestseller__footer { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; margin-top: 4rem; height: 8rem; padding: 10px; background-color: #f2f2f2; }
@media only screen and (max-width: 700px) { .bestseller__footer { background-color: #fff; margin-top: 0; height: auto; padding: 0; }
  .bestseller__footer .eyecatcher { position: absolute; right: 20px; top: 20px; } }
.bestseller__share { padding: 10px; text-align: right; width: 100%; }
@media only screen and (max-width: 700px) { .bestseller__share { padding: 0 10px; } }

.tariff-boxes { position: relative; }
.tariff-boxes .btn-nav { position: absolute; top: 50%; margin-top: -3.6rem; }
.tariff-boxes .btn-nav.prev { left: -4rem; }
.tariff-boxes .btn-nav.next { right: -4rem; }

.tariff-boxes-wrapper { overflow-x: hidden; position: relative; }

.tariff-box-list { padding-top: 25px; position: relative; }
@media only screen and (max-width: 960px) { .tariff-box-list.is-flexbox { display: block; } }
.tariff-box-list > div { min-width: 25%; }

ul.tariff-box { list-style: none; margin: 0; padding: 0 0 7rem; width: 100%; position: relative; }
ul.tariff-box.green .head, ul.tariff-box.green a.btn { background-color: #219a07; color: #fff; }
ul.tariff-box .flag { right: -1rem; }
ul.tariff-box .head { padding: 20px 20px 10px; }
ul.tariff-box .head h3 { margin-bottom: 0.3em; }
ul.tariff-box > li { padding: 0.8rem; }
ul.tariff-box > li.no-padding { padding: 0; }
ul.tariff-box > li.detail { border-bottom: 1px solid #cccccc; }
ul.tariff-box > li:last-child { bottom: 10px; position: absolute; width: 100%; }
ul.tariff-box > li > img { display: block; margin: 0 auto; max-width: 32rem; padding: 10px; width: 100%; }
ul.tariff-box .checklist { margin: 0; padding: 0; }
ul.tariff-box .checklist li { border-bottom: 1px solid #cccccc; padding: 0.8rem 0.8rem 0.8rem 30px; margin: 0; }
ul.tariff-box .checklist li:before { margin-left: -2rem; }
ul.tariff-box li.no-border, ul.tariff-box .no-border > li { border-bottom: none; }

ul.tariff-box .head a.btn { position: absolute; bottom: 2rem; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
ul.tariff-box a.btn { margin-right: 0; }
@media only screen and (max-width: 700px) { ul.tariff-box { margin-bottom: 10px; }
  ul.tariff-box .flag { right: 0; } }

@media only screen and (max-width: 700px) { .is-flexbox ul.tariff-box { margin-bottom: 0px; } }

.padding-left { padding-left: 4px; }

@media only screen and (max-width: 960px) { .tariff-box-arrowbox-header { padding-top: 10px; }
  .tariff-box-arrowbox-footer { margin-bottom: -15px; position: relative; z-index: 1; } }
.tariff-select-list { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; }
.tariff-select-list > div { -webkit-box-flex: 0; -webkit-flex: 0 0 -webkit-calc(33.33% - 13.33px); -ms-flex: 0 0 calc(33.33% - 13.33px); flex: 0 0 calc(33.33% - 13.33px); padding: 10px; margin-bottom: 20px; margin-right: 20px; }
.tariff-select-list > div:nth-child(3n) { margin-right: 0; }
@media only screen and (max-width: 1100px) { .tariff-select-list > div:nth-child(3n) { margin-right: 0; } }
@media only screen and (max-width: 960px) { .tariff-select-list > div { -webkit-box-flex: 0; -webkit-flex: 0 0 -webkit-calc(50% - 10px); -ms-flex: 0 0 calc(50% - 10px); flex: 0 0 calc(50% - 10px); }
  .tariff-select-list > div:nth-child(odd) { margin-right: 20px; }
  .tariff-select-list > div:nth-child(even) { margin-right: 0; } }
@media only screen and (max-width: 700px) { .tariff-select-list > div { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; margin-right: 0; margin-bottom: 10px; } }
.tariff-select-list .tariff-select { position: relative; padding: 10px 20px 10px 30px; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); border: 1px solid #fff; -webkit-animation: tariffselect-slidein 0.5s; animation: tariffselect-slidein 0.5s; }
.tariff-select-list .tariff-select.is-topseller { border: 1px solid #df002e; }
.tariff-select-list .tariff-select.is-topseller:before { position: absolute; left: -1px; top: -17px; padding: 2px 5px; font-size: 10px; font-weight: 700; height: 17px; content: 'TOP-SELLER'; color: #fff; background-color: #df002e; }
.tariff-select-list .tariff-select.is-topseller.is-active:before { background-color: #84bc34; }
.tariff-select-list .tariff-select.is-active { border: 1px solid #84bc34; }
.tariff-select-list .tariff-select h4 { margin-top: 0; }
.tariff-select-list .tariff-select span.net { position: absolute; top: 10px; right: 10px; }
.tariff-select-list .tariff-select input[type=radio] { position: absolute; left: 10px; top: 14px; }
.tariff-select-list .tariff-select label { font-weight: normal; width: 100%; }
.tariff-select-list .tariff-select .tariff-select-footer { min-height: 130px; }
.tariff-select-list .tariff-select div[app-md-price] { position: absolute; right: 10px; bottom: 10px; }
.tariff-select-list .tariff-select .device-price div[app-md-price] { right: auto; left: 10px; }
.tariff-select-list .tariff-select .tariff-price .price-right { margin: 0 5px 0 20px; }
.tariff-select-list .tariff-select .tariff-price .price-right .price-footnote { right: -1.3rem; }
.tariff-select-list .tariff-select .tariff-select-double-bw { position: absolute; bottom: 60px; left: 10px; }
.tariff-select-list .tariff-select .tariff-select-links { position: absolute; left: 12px; bottom: 110px; }
.tariff-select-list .tariff-select .bottom { position: absolute; bottom: 0; margin-bottom: 1em; width: auto; }

@-webkit-keyframes tariffselect-slidein { 0% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes tariffselect-slidein { 0% { opacity: 0; }
  100% { opacity: 1; } }
.pricebox-container { right: 0; position: absolute; }

.chat { bottom: 0; max-width: 100%; position: fixed; right: 40px; width: 344px; z-index: 102; border: 1px solid #21314d; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); background: #21314d; color: #fff; }
@media only screen and (max-width: 960px) { .chat { right: 0; } }
@media only screen and (max-width: 700px) { .chat { left: 0; top: 0; width: 100%; } }
.chat .btn-block { margin: 5px; width: auto; }

.ios .chat--body { overflow: hidden; position: fixed; width: 100%; }

.ios .chat:not(.is-minimized) { bottom: auto; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: auto; z-index: 99999; }
.ios .chat:not(.is-minimized) .chat-content { height: 100%; }

.chat-header { padding: 6px 8px; position: relative; cursor: pointer; font-size: 14px; font-weight: bold; line-height: 28px; }

.chat-minimize { display: block; overflow: hidden; }
.chat-minimize:before { font-size: 2em; line-height: .5; vertical-align: middle; }
.chat-minimize:after { float: right; padding-right: 34px; font-size: 1.5em; vertical-align: middle; }

.chat-close { position: absolute; right: 8px; top: 10px; }

.chat-content { height: 299px; border-bottom: 5px solid #21314d; background: #e5e5e5 url(../images/logo-10.svg) no-repeat center 66%; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all .1s ease-out; transition: all .1s ease-out; -webkit-overflow-scrolling: touch; }
.chat-content > div { height: 100%; }
.chat-content iframe { height: 100%; overflow: hidden; width: 100%; }
@media only screen and (max-width: 700px) { .chat-content { height: 100%; height: -webkit-calc(100% - 45px); height: calc(100% - 45px); } }

.chat-headline { margin: 0; padding: 15px; border-bottom: 1px solid #7a8394; background: #a6adb8; color: #21314d; font-weight: bold; }

.chat-loading { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: 1; background: rgba(255, 255, 255, 0.35); }
.chat-loading .spinner { left: 0; margin-top: -12px; position: absolute; right: 0; top: 40%; }
.chat-loading .spinner > div { background-color: #84bc34; }

@media only screen and (max-width: 700px) { .is-minimized { top: auto; border: 1px solid #84bc34; } }
.is-minimized .chat-content { height: 0; border-bottom: 0; }
.is-minimized .chat-minimize:after { content: '\e702'; }

.angebot { margin-bottom: 40px; border-bottom: 1px solid #e5e5e5; }
.angebot .angebot-text { padding: 40px 0; }
@media only screen and (max-width: 700px) { .angebot .angebot-text { margin-bottom: 20px; padding: 20px 0; } }
.angebot:last-child { border-bottom: none; }
.angebot .angebot-teaser { position: relative; }

.angebot-foot { position: relative; }
.angebot-foot .price + .btn { bottom: 0; margin-right: 0; position: absolute; right: 0; }
@media only screen and (max-width: 960px) { .angebot-foot .price + .btn { float: left; position: static; margin-top: 20px; }
  .angebot-foot .price + .btn.right { float: right; } }
@media only screen and (max-width: 700px) { .angebot-foot .price + .btn { position: static; } }
@media only screen and (max-width: 960px) { .angebot-foot .price { display: block; } }

.angebot-thumb { display: block; margin-bottom: 10px; padding-bottom: 1px; border: 1px solid #cccccc; }
.angebot-thumb.is-active, .angebot-thumb:hover { border-color: #75b03c; }

.zoomContainer { z-index: 10; }
@media only screen and (max-width: 700px) { .zoomContainer { display: none; } }

.offcanvas { overflow: hidden; }

.offcanvas-container { left: 0; position: relative; -webkit-transition: all .3s; transition: all .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
@media only screen and (max-width: 700px) { .offcanvas-container { width: 200%; }
  .is-contents .offcanvas-container { left: -100%; } }

.offcanvas-controls { margin: 0; }

.offcanvas-control { padding-bottom: .5em; }
.offcanvas-control, .offcanvas-control a { display: block; }
.offcanvas-control.is-active, .offcanvas-control.is-active:before, .offcanvas-control.is-active a { color: #21314d; font-weight: bold; }
@media only screen and (max-width: 700px) { .offcanvas-control.is-active, .offcanvas-control.is-active:before, .offcanvas-control.is-active a { color: #75b03c; font-weight: normal; } }

.offcanvas-contents > div { display: none; }
.offcanvas-contents > .is-active { display: block; }

.offcanvas-back { display: none; background: #d3d6db; }
.offcanvas-back:focus { outline: none; }
@media only screen and (max-width: 700px) { .offcanvas-back { display: block; } }

.oc-nested .offcanvas-controls { left: 0; position: relative; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: .3s all; transition: .3s all; }

.oc-wrapper { overflow: hidden; padding-right: 0; }
.oc-wrapper li { padding-right: 10px; position: static; }
.oc-wrapper li ul { left: 100%; position: absolute; top: 0; width: 100%; }

a.oc-next + ul { opacity: 0; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: .3s all; transition: .3s all; visibility: hidden; }
a.oc-next.is-active { color: #75b03c; font-weight: normal; }
a.oc-next.is-active + ul { opacity: 1; visibility: visible; }

.push-cont { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); position: relative; }

.push-btn { padding: 15px 20px; position: absolute; right: -50px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.push-btn:hover { cursor: pointer; }
.push-btn:before { position: absolute; background-color: inherit; content: ''; top: -20px; right: 50px; left: -20px; bottom: -20px; z-index: -1; }
.push-btn.btn-left { left: -50px; right: auto; }
.push-btn.btn-left:before { left: 50px; right: -20px; }

.sticky-wrapper { margin-top: 10px; }

.sticky-basket { background-color: #21314d; color: #fff; padding: 0 10px; position: static; }
.sticky-basket.sticky-white { background-color: #fff; border-bottom: 1px solid #cccccc; border-top: 1px solid #cccccc; color: #21314d; left: 50%; position: relative; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 100vw !important; }
.sticky-basket.sticky-white .sticky-basket__desktop { left: 50%; max-width: 1084px; position: relative; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.sticky-basket.sticky-white.is-sticky { -webkit-box-shadow: -2px -8px 7px -5px rgba(0, 0, 0, 0.25); box-shadow: -2px -8px 7px -5px rgba(0, 0, 0, 0.25); }
.sticky-basket__mobile { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; display: none; }
@media only screen and (max-width: 700px) { .sticky-basket__mobile { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
  .sticky-basket__mobile > div { padding: 5px; width: 50%; }
  .sticky-basket__mobile .sticky-basket__cta { padding: 5px 5px 5px 0; } }
.sticky-basket__desktop { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
@media only screen and (max-width: 700px) { .sticky-basket__desktop { display: none; } }
.sticky-basket__desktop > div { padding: 10px; width: 33%; }
.sticky-basket__desktop > div.-full-width { width: 66%; }
.sticky-basket__selection { padding: 5px 0 0; text-align: center; }
.sticky-basket__selection a, .sticky-basket__selection a:hover { text-decoration: none; }
.sticky-basket__selection ul { margin-bottom: 0; max-height: 0; min-height: 0; opacity: 0; overflow: hidden; text-align: left; -webkit-transition: all .24s; transition: all .24s; }
.sticky-basket__selection ul li:before { display: none; }
.sticky-basket__selection.is-open { border-bottom: 1px solid #fff; padding-bottom: 10px; }
.sticky-basket__selection.is-open ul { height: auto; min-height: 60px; opacity: 1; -webkit-transition: .24s ease .1s; transition: .24s ease .1s; }
.sticky-basket__selection.is-open ul li:before { display: block; }
.sticky-basket__price { text-align: right; }
.sticky-basket__price:nth-of-type(2) { padding-right: 4rem; }
.sticky-basket__price .caper-price [app-md-price] { display: inline-block; }
@media only screen and (max-width: 960px) { .sticky-basket__price:nth-of-type(2) { padding-right: 0; } }
@media only screen and (max-width: 700px) { .sticky-basket__price { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
  .sticky-basket__price > div { text-align: right; width: 50%; }
  .sticky-basket__price > div:nth-of-type(2) { font-weight: 700; width: 41.6667%; } }
.sticky-basket__cta .small { text-align: center; }
@media only screen and (max-width: 700px) { .sticky-basket__cta .btn { height: 32px; margin: 4px 0 0; padding: 2px 6px; }
  .sticky-basket__cta .small { font-size: 11px; } }
.sticky-basket.is-sticky { bottom: 0; left: 50%; position: fixed; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 9999; }
@media only screen and (max-width: 700px) { .sticky-basket.is-sticky { left: 0; right: 0; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } }
.sticky-basket .price { margin-right: 0; }

.facebook-overlay { bottom: 18pt; position: fixed; right: 18pt; z-index: 999; }
.facebook-overlay--icon { background-color: #fff; border-radius: 50%; bottom: 0; color: #21314d; cursor: pointer; -webkit-filter: grayscale(0%); filter: grayscale(0%); height: 45pt; position: absolute; right: 0; width: 45pt; }
.facebook-overlay--icon.-active { color: #cccccc; }
.facebook-overlay--close { color: #21314d; cursor: pointer; float: right; font-size: 2.5rem; height: 30px; margin-right: -5px; margin-top: -8px; text-align: center; width: 30px; }
.facebook-overlay--confirmation { background-color: #fff; border: 1px solid #a6adb8; border-radius: 10px; bottom: 51pt; max-width: 100vw; padding: 10px; position: absolute; right: 0; width: 250px; }
.facebook-overlay--confirmation a { text-decoration: underline; }

body#popup { background-color: transparent; }

.fancybox-wrap * { color: #21314d; }
.fancybox-wrap a { color: #75b03c; }
.fancybox-wrap a.btn { color: #21314d; }
.fancybox-wrap .fancybox-skin { padding: 40px 10px 20px; }
.fancybox-wrap .fancybox-title { margin: 0 20px 10px; padding-bottom: 10px; border-bottom: 1px solid #cccccc; }
@media only screen and (max-width: 700px) { .fancybox-wrap .fancybox-title { margin: 0 10px; } }
.fancybox-wrap .fancybox-inner { margin: 0 auto; }
.fancybox-wrap .fancybox-close { top: 10px; }
.fancybox-wrap .fancybox-close:before { color: #21314d; font-size: 2rem; }

#popup { padding: 0 20px; }
#popup.details { max-width: 820px; }
#popup > .fancybox-title-inside-wrap { margin: 0; }
#popup #wrapper { padding: 0; }
#popup .accordion { margin-bottom: 20px; }
#popup .inner-wrapper { padding: 0; }
#popup .footnotes { margin-top: 20px; max-width: -webkit-calc(100vw - 40px); max-width: calc(100vw - 40px); }

.stoerer-corner { background-color: #df002e; padding: 10px; position: absolute; right: 0; top: 0; }

.tarifdetails { position: relative; }
.tarifdetails .inkl { display: inline-block; font-weight: bold; margin-bottom: 10px; margin-right: 10px; height: 7rem; padding: 1.5rem; text-align: center; vertical-align: top; width: 18rem; background-color: #a6adb8; color: #fff; }
.tarifdetails .rabatt { position: absolute; top: 0; right: 0; width: 8rem; height: 8rem; }
.tarifdetails .rabatt img { width: 100%; }
.tarifdetails h2 .net { vertical-align: bottom; }

.details h2 { margin-top: 20px; }
.details .accordion table td:first-child { width: 40%; }

.modal-is-open { overflow: hidden; }
.ios .modal-is-open { position: fixed; }

.modal { bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 9999; text-align: center; }
.modal:before { display: inline-block; height: 100%; margin-right: -0.25em; content: ''; vertical-align: middle; }
@media only screen and (max-width: 700px) { .modal:before { display: none; } }
@media only screen and (max-width: 700px) { .modal:before { display: none; } }

.modal-overlay { height: 100%; position: absolute; top: 0; width: 100%; z-index: 1; background: rgba(33, 49, 77, 0.5); }

.modal-header { position: relative; background-color: #fff; z-index: 1; border-bottom: 1px solid #000; }
@media only screen and (max-width: 700px) { .modal-header { padding: 12px 0 0; } }
.modal-header .close { position: absolute; top: -6px; right: -8px; height: 36px; width: 36px; cursor: pointer; font-size: 0; text-align: center; }
.modal-header .close:before { font-size: 2.4rem; line-height: 36px; margin-right: 0; }
@media only screen and (max-width: 700px) { .modal-header .close { top: 4px; right: -10px; } }
.modal-header h3 { margin: 0 0 1em; }
@media only screen and (max-width: 700px) { .modal-header h3 { margin: 0 40px 1em 0; } }

.modal-content { display: inline-block; max-width: 90%; padding: 30px; position: relative; z-index: 2; background: #fff; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); text-align: left; vertical-align: middle; max-height: 100vh; overflow: auto; }
@media only screen and (max-width: 700px) { .modal-content { height: 99%; padding: 10px 20px; overflow: auto; } }

.modal-body.modal-sm { max-width: 450px; }
.modal-body .inner-wrapper { padding: 0; }
.modal-body .obligation { margin-top: 20px; margin-bottom: 10px; }
@media only screen and (max-width: 700px) { .modal-body { height: -webkit-calc(99% - 40px); height: calc(99% - 40px); } }

/** Login Form
*/
@media only screen and (max-width: 700px) { form[name="modalForm"] { max-width: 100% !important; } }
form[name="modalForm"] .form-footer { margin-top: 10px; }
form[name="modalForm"] .form-footer ul { float: left; margin: 0; }
form[name="modalForm"] .form-footer input[type="submit"] { margin: 5px 0 0 0; float: right; }

/** Modal Quick Login
*/
.modal-login-body { margin-top: 15px; }
.modal-login-body form[name="modalForm"] { max-width: 348px; }

/** Theme-Layer
*/
.modal-theme-body { margin-top: 0; max-width: 696px; }
.modal-theme-body .modal-intro { min-height: 1px; }
.modal-theme-body form { max-width: auto; }

/*div*/
.modal-theme-img { margin-bottom: 20px; }
.modal-theme-img img { width: 100%; }

.steps-indicator li a { color: #21314d; text-decoration: none; cursor: pointer; -webkit-transition: 0.25s; transition: 0.25s; }

.steps-indicator li a:before { position: absolute; bottom: 100%; left: 50%; margin-left: -7px; width: 14px; height: 14px; background-color: #e6e6e6; border-radius: 100%; -webkit-transition: 0.25s; transition: 0.25s; }

.steps-indicator li a:hover { color: #4d4d4d; }

.steps-indicator li.default { pointer-events: none; }

.steps-indicator li.default a:hover { color: #808080; }

.steps-indicator li.current, .steps-indicator li.editing { pointer-events: none; }

.steps-indicator li.current a:before { background-color: #808080; }

.steps-indicator li.done a:before { background-color: #339933; }

.steps-indicator li.editing a:before { background-color: #ff0000; }

.box-shop { height: 50rem; }
.box-shop .box-text { height: 50%; }
.box-shop .box-text + .box-text { background: transparent; }
.box-shop .box-content .box-image { bottom: auto; top: 50%; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.box-shop .box-content .box-image img { height: auto; max-height: 100%; max-width: 100%; width: auto; }
.box-shop .box-content .box-image .details { bottom: auto; }
@media only screen and (max-width: 700px) { .box-shop .box-content .box-image { left: 10px; top: auto; -webkit-transform: none; -ms-transform: none; transform: none; } }
.box-shop .details { margin-left: 36%; }
@media only screen and (max-width: 700px) { .box-shop { height: auto; padding-bottom: 0; }
  .box-shop.box-phone .box-image, .box-shop.box-tariff .box-image { float: left; position: relative; }
  .box-shop .box-content { overflow: auto; padding-bottom: 20px; }
  .box-shop .box-content, .box-shop .box-price { position: relative; }
  .box-shop .box-text { height: auto; padding: 10px; background: transparent; } }

.box-suffix { bottom: 0; position: absolute; left: 10px; }
.box-suffix label { font-weight: normal; }

.box-pens { position: absolute; right: 10px; top: 0; line-height: 40px; }
.box-pens a { text-decoration: none; }
@media only screen and (max-width: 700px) { .box-pens + .box-text { padding-top: 40px; } }

.box .has-fallback h3 { margin-bottom: 1.8rem; }
.box .has-fallback img { display: block; height: 66%; margin: 0 auto; }
@media only screen and (max-width: 700px) { .box .has-fallback img { float: left; height: auto; width: 26%; }
  .box .has-advice { margin-left: 36%; padding-top: 0; overflow: auto; } }

.box-tariff .group-radiobox label { margin-bottom: 0; padding: 0 2px 0 20px; }
.box-tariff .group-radiobox input { margin-left: -18px; }
@media only screen and (min-width: 701px) and (max-width: 960px) { .box-tariff .box-content .box-image { top: auto; -webkit-transform: none; -ms-transform: none; transform: none; }
  .box-tariff .details--tariff { margin-left: 0; } }

@media only screen and (max-width: 700px) { .box-shop.box-options { padding-bottom: 30px; } }
.box-shop.box-options h3 { margin-bottom: 1em; }
.box-shop.box-options .box-content { background-image: url("/assets/images/online-shop/prepaid-optionen/handy-option.png"); background-repeat: no-repeat; background-position: center center; background-size: 40% auto; padding: 20px; }
@media only screen and (max-width: 960px) { .box-shop.box-options .box-content { background: none; } }
@media only screen and (max-width: 700px) { .box-shop.box-options .box-content { position: relative; } }
.box-shop.box-options .box-list ul { list-style: none; }
.box-shop.box-options .box-list ul li { margin-bottom: 5px; position: relative; }
.box-shop.box-options .box-list ul .option-remove { position: absolute; right: 0; top: 11px; }
@media only screen and (max-width: 960px) { .box-shop.box-options .box-list ul .option-name { padding: 5px 10px 0; }
  .box-shop.box-options .box-list ul .option-price { padding: 0 10px 5px; text-align: left; } }
.box-shop.box-options .box-foot { position: absolute; bottom: 20px; }
@media only screen and (max-width: 960px) { .box-shop.box-options .box-foot { bottom: 0; } }
.box-shop.box-options .box-foot a:hover { text-decoration: none; }
.box-shop.box-options .box-foot .text-center.is-green { position: relative; }
.box-shop.box-options .box-recommendation h3, .box-shop.box-options .box-recommendation h4 { margin: 0; }
.box-shop.box-options .box-recommendation .grid-wrapper .grid-col { padding-top: 0; padding-bottom: 0; }

.options-selection .icon-plus--1st { left: 25%; }
@media only screen and (min-width: 961px) and (max-width: 1100px) { .options-selection .icon-plus--1st { margin-left: 3px; } }
@media only screen and (min-width: 701px) and (max-width: 960px) { .options-selection .icon-plus--1st { margin-left: -16px; } }
@media only screen and (max-width: 700px) { .options-selection .icon-plus { display: inline-block; left: 50%; position: relative; top: auto; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
  .options-selection .icon-plus + .grid-col { float: none; margin-top: -40px; } }

.box.is-overview .details { position: absolute; bottom: 50%; margin-bottom: 10px; }
@media only screen and (max-width: 700px) { .box.is-overview .details { position: static; } }
@media only screen and (min-width: 701px) and (max-width: 960px) { .box.is-overview.box-tariff .box-image { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } }
@media only screen and (max-width: 960px) { .box.is-overview .box-pens + .box-text { padding-top: 40px; } }

.device-item-big .box { height: 50rem; }
.device-item-big .box-header { height: 50%; }
@media only screen and (max-width: 700px) { .device-item-big .box-header { height: 12.5rem; } }
.device-item-big .box-upper-layer { height: 100%; position: absolute; top: 0; left: 0; width: 100%; z-index: 3; }
.device-item-big .full-height { height: 100%; }
@media only screen and (max-width: 700px) { .device-item-big .left-side { height: 24rem; } }
.device-item-big .right-side { position: relative; }
@media only screen and (max-width: 700px) { .device-item-big .right-side { position: static; } }
.device-item-big .right-side > div { max-height: 50%; }
.device-item-big .right-side .device-info { position: absolute; top: 50%; }
@media only screen and (max-width: 700px) { .device-item-big .right-side .device-info { min-height: 24rem; top: 0; } }
.device-item-big .right-side .device-info .device-price { right: 0; top: 10px; }
@media only screen and (max-width: 1100px) { .device-item-big .right-side .device-info .device-price { right: 25px; } }
@media only screen and (max-width: 960px) { .device-item-big .right-side .device-info .device-price { right: 20px; } }
@media only screen and (max-width: 700px) { .device-item-big .right-side .device-info .device-price { position: static; } }
@media only screen and (max-width: 700px) { .device-item-big .right-side .device-info .device-details { position: absolute; top: 13rem; } }
.device-item-big .right-side .counter-controller { display: inline-block; }
.device-item-big .right-side .device-buy { position: absolute; bottom: 0; right: 0; }
@media only screen and (max-width: 1100px) { .device-item-big .right-side .device-buy { padding-left: 20px; } }
@media only screen and (max-width: 960px) { .device-item-big .right-side .device-buy { padding-left: 0; padding-right: 30px; right: auto; left: 20px; text-align: left; } }
@media only screen and (max-width: 700px) { .device-item-big .right-side .device-buy { position: static; padding: 5px 0; } }
@media only screen and (max-width: 700px) { .device-item-big .right-side .device-buy .btn { height: 3rem; line-height: 1.4; } }
.device-item-big .bg-center { background-size: cover; background-position: center center; }
.device-item-big .device-thumbs { overflow: hidden; }
.device-item-big .device-thumbs .thumbs-overlay { height: 43rem; padding: 20px 0 0; width: 11rem; }
.device-item-big .device-thumbs ul { list-style: none; padding: 0; width: 9rem; }
.device-item-big .device-thumbs ul li { background-color: #fff; border: 1px solid #d3d6db; cursor: pointer; height: 13rem; margin: 0 0 10px; padding: 10px 0; position: relative; }
.device-item-big .device-thumbs ul li:focus { outline: none; }
.device-item-big .device-thumbs ul li.is-active { border-color: #84bc34; }
.device-item-big .device-thumbs ul li.is-active:after { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 7px; border-color: transparent transparent transparent #84bc34; position: absolute; right: -7px; top: 50%; z-index: 3; }
.device-item-big .device-img { position: relative; }
@media only screen and (max-width: 700px) { .device-item-big .device-img { background-size: 22rem; height: 22rem; } }
.device-item-big .device-img .icon-link:before { bottom: 0; left: 50%; margin-left: -7px; }
@media only screen and (max-width: 700px) { .device-item-big .device-img .icon-link:before { bottom: auto; top: 100%; } }
.device-item-big .slick-vertical .slick-prev, .device-item-big .slick-vertical .slick-next { left: 50%; margin-left: -10px; right: auto; }
.device-item-big .slick-vertical .slick-prev::before, .device-item-big .slick-vertical .slick-next::before { color: #75b03c; }
.device-item-big .slick-vertical .slick-prev { top: -20px; }
.device-item-big .slick-vertical .slick-prev:before { content: '\e7c5'; }
.device-item-big .slick-vertical .slick-next { bottom: -20px; top: auto; }
.device-item-big .slick-vertical .slick-next:before { content: '\e7c4'; }

.wk__payments .wk__payment { padding-bottom: 10px; padding-top: 10px; border-top: 1px solid #cccccc; }
.wk__payments .wk__payment:first-of-type { border-top: 2px solid #21314d; }

.table-shopping-cart { margin: 0; }
.table-shopping-cart tr { border-bottom: none; border-top: 1px solid #cccccc; }
.table-shopping-cart tr.double-border-top { border-top: 2px solid #21314d; }
.table-shopping-cart tr.no-border { border: none; }
.table-shopping-cart .elm-img { max-width: 13rem; }
@media only screen and (max-width: 1100px) { .table-shopping-cart .elm-img { max-width: 10rem; } }
@media only screen and (max-width: 960px) { .table-shopping-cart .elm-img { max-width: 8rem; } }
.table-shopping-cart .elm-name-mobile.elm-icon span { font-size: 26px; }
.table-shopping-cart .elm-name-mobile.elm-plus span { font-size: 20px; }
@media only screen and (max-width: 700px) { .table-shopping-cart .elm-name-mobile.elm-plus .data-content { right: 20px; } }
@media only screen and (max-width: 700px) { .table-shopping-cart .elm-name-mobile .data-title { position: static; width: 70%; }
  .table-shopping-cart .elm-name-mobile .data-title h3 { margin-bottom: 0; }
  .table-shopping-cart .elm-name-mobile .data-content { position: absolute; top: 10px; right: 10px; } }
.table-shopping-cart .data-content > div { padding-left: 0; padding-right: 0; }
@media only screen and (max-width: 700px) { .table-shopping-cart .data-content > div { padding: 0; } }
@media only screen and (max-width: 700px) { .table-shopping-cart .elm-price-mtl.phone-right { padding-bottom: 0; } }
@media only screen and (max-width: 700px) { .table-shopping-cart .elm-price-einm.phone-right { padding-top: 0; position: relative; }
  .table-shopping-cart .elm-price-einm.phone-right .data-title { top: 0; }
  .table-shopping-cart .elm-price-einm.phone-right .elm-reset { position: absolute; right: 20px; top: 0; } }

.wk__teaser .bar_list { margin: 0 -10px; }
@media only screen and (min-width: 1101px) { .wk__teaser .bar_list.is-flexbox { display: block; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin: 0; }
  .wk__teaser .bar_list.is-flexbox li { display: list-item; float: none; padding: 0; width: auto; } }

.table-warenkorb-summary tbody tr { border-bottom: 1px solid #cccccc; }
@media only screen and (max-width: 960px) { .table-warenkorb-summary tbody td { padding: 10px; } }
@media only screen and (max-width: 700px) { .table-warenkorb-summary tbody td .data-title { width: 5rem; }
  .table-warenkorb-summary tbody td .data-content { padding-left: 5rem; text-align: left; } }
.table-warenkorb-summary tfoot td { padding: 10px 20px; }
@media only screen and (max-width: 960px) { .table-warenkorb-summary tfoot td { padding: 10px; } }
@media only screen and (max-width: 700px) { .table-warenkorb-summary tfoot td .data-title.only-mobile { display: inline-block; float: left; width: 50%; } }

.wk { position: relative; }

.wk-overlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: 99; background: rgba(33, 49, 77, 0.5); }
.wk-overlay__wrapper { display: table; height: 100%; width: 100%; text-align: center; }
.wk-overlay__cell { display: table-cell; vertical-align: middle; }
.wk-overlay__content { font-family: "Open Sans Bold", sans-serif; font-size: 1.6rem; font-weight: 300; line-height: 1.15; text-transform: uppercase; display: inline-block; margin: 0; padding: 20px; background: #fff; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.wk-overlay__content:before { margin-right: .25em; content: "" !important; font-family: 'icons'; speak: none; font-size: 1.4em; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.wk-overlay__content::before { color: #84bc34; font-size: 2em; line-height: inherit; vertical-align: middle; }
@media only screen and (max-width: 700px) { .wk-overlay { position: static; }
  .wk-overlay__content { display: block; padding: 10px 0; border-top: 1px solid #d3d6db; -webkit-box-shadow: none; box-shadow: none; text-align: left; }
  .wk-overlay + .wk-content { display: none; } }

.cart-list { list-style: none; }
.cart-list li { border-bottom: 1px solid #a6adb8; position: relative; }
.cart-list li.cart-bundle-product { background-color: #e5e5e5; }
.cart-list li.cart-bundle-product:first-child { border-top: 1px solid #a6adb8; border-bottom: none; }
@media only screen and (max-width: 700px) { .cart-list li.cart-bundle-product:first-child { border-top: none; border-bottom: 1px solid #a6adb8; } }
.cart-list .product-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cart-list .product-price { position: absolute; right: 10px; top: 20px; }

.product-filter { position: relative; background: #f2f2f2; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); height: auto; width: 100%; margin: 0 0 15px; padding: 10px 15px 7px; }

.product-filter .filter-infos { float: left; width: 50%; }

.product-filter .filter-infos a.icon-link { font-weight: bold; }

.product-filter span { display: block; }

.product-filter .filter-infos .filter-results { font-weight: bold; }

.product-filter .filter-infos .filter-details { display: none; }

.product-filter .filter-sort { width: 33%; float: left; position: relative; }

.product-filter .filter-sort label { padding-right: 0px; margin-top: 9px; width: auto; }

.product-filter .field-item { margin-top: 2px; }

.product-filter .field-item select { margin-bottom: 0; }

.product-filter a.filter-grid, .product-filter a.filter-list { display: icon-block; position: relative; float: right; color: #A6ADB8; font-size: 21px; margin-top: 5px; width: 30px; height: 30px; }

.product-filter a.filter-grid.is-active, .product-filter a.filter-list.is-active { color: #21314D; }

.product-filter a.filter-grid { right: 35px; }

.product-filter a.filter-list { right: -30px; }

@media only screen and (max-width: 960px) { .product-filter .filter-infos .filter-results { float: left; margin-right: 0.5rem; }
  .product-filter .filter-infos .filter-details { display: block; } }
@media only screen and (max-width: 700px) { .product-filter .filter-infos { width: 100%; }
  .product-filter .filter-infos .filter-results { float: none; } }
/* Filter Buttons for smaller views - will trigger overlays */
.filter-icon { right: 10px; position: absolute; top: 5px; }

.btn-filter { background-color: #e5e5e5; display: block; height: 40px; padding: 0 20px 0 35px; font-family: "qtype", Helvetica, Arial, sans-serif; font-size: 1.6rem; font-weight: normal; line-height: 40px; }

.btn-filter:after { line-height: 4rem; font-size: 2.2rem; margin-right: 0px; content: attr(data-icon-after); }

.btn-filter:hover { background-color: #84BC34; }

.toggle-filter-wrapper.is-fixed { position: fixed; width: -webkit-calc(100% - 20px); width: calc(100% - 20px); background: #fff; top: 60px; z-index: 3; }

.toggle-filter { background-color: #e5e5e5; display: none; cursor: pointer; line-height: 4rem; padding: 0 20px; position: relative; z-index: 1; }
@media only screen and (max-width: 1100px) { .toggle-filter { display: block; } }
@media only screen and (max-width: 700px) { .toggle-filter { font-family: "canada-type-gibson", sans-serif; font-size: 1.6rem; padding: 0 20px 0 35px; }
  .toggle-filter .opened, .toggle-filter .closed { font-weight: normal; } }
.toggle-filter:before { position: absolute; right: 10px; top: 10px; }
@media only screen and (max-width: 700px) { .toggle-filter:before { right: 2px; } }
.toggle-filter:hover, .toggle-filter.is-active { background-color: #84bc34; }
@media only screen and (max-width: 700px) { .toggle-filter:hover { background-color: #e5e5e5; } }
.toggle-filter .opened { display: none; }
.toggle-filter.is-active:before { content: "\e7c6"; }
.toggle-filter.is-active .closed { display: none; }
.toggle-filter.is-active .opened { display: block; }

.filter-result { list-style: outside none none; margin: 0; }
.filter-result > li { border-bottom: 1px solid #f2f2f2; }
.filter-result > li.is-active > .head { position: relative; background-color: #21314d; border-bottom: none; color: #fff; }
.filter-result > li.is-active > .head:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; }
.filter-result > li:last-child { border-bottom: none; }
.filter-result > li > .head { background-color: #a6adb8; line-height: 5rem; position: relative; z-index: 2; }
.filter-result > li > .head, .filter-result > li .filter-conditions { padding: 0 20px; }

.filter-conditions { background-color: #f2f2f2; color: #21314d; height: 0; }
.filter-conditions .criteria { cursor: pointer; position: relative; }
.filter-conditions .criteria strong { display: block; line-height: 4.6rem; }
.filter-conditions .criteria .arrow { position: absolute; right: -2px; top: 2px; }
.filter-conditions .criteria .arrow:before { content: '\e7c4'; font-family: "icons"; font-size: 1.8rem; line-height: 4.6rem; }
.filter-conditions .cond { height: 0; }
.filter-conditions .col { border-bottom: 2px solid #d3d6db; color: #7a8394; }
.filter-conditions .col.is-open { color: #21314d; padding: 0 0 10px; }
.filter-conditions .col.is-open .cond { height: auto; }
.filter-conditions .col.is-open .arrow:before { content: '\e7c5'; }
.filter-conditions .col:last-child { border-bottom: 0; }
.filter-conditions .group-checkbox { width: 100%; }
.filter-conditions .group-checkbox label { margin-bottom: 0; }
.filter-conditions .num { display: inline-block; line-height: 1.8; }

.filter-result > li.is-active .filter-conditions { height: auto; }

.shop-item .box-header { height: 190px; }
.shop-item .box-header h3 { width: 80%; }

.shop-item .image { top: 75px; }

.shop-item .device-price { top: 90px; right: 20px; }

@media only screen and (min-width: 961px) and (max-width: 1101px) { .shop-item .device-price { right: 15px; } }
@media only screen and (min-width: 700px) and (max-width: 740px) { .shop-item .device-price { right: 15px; } }
.shop-item .box-footer { padding-top: 60px; }
@media only screen and (min-width: 701px) { .shop-item .box-footer { padding-bottom: 80px; } }

.shop-item .device-usps { margin-bottom: 1em; }

@media only screen and (max-width: 700px) { .shop-item .box-footer-actions { margin-bottom: 1em; position: relative; } }
@media only screen and (min-width: 701px) { .shop-item .box-footer-actions { bottom: 50px; position: absolute; } }

.shop-item .box-footer-actions a.icon-link { margin: 0 10px 0 1.4rem; padding: 12px 0px 0px 0px; position: relative; float: left; }

.shop-item .box-footer-actions .group-checkbox { padding-top: 10px; position: relative; float: left; }

.shop-item .box-footer-btn { bottom: 15px; margin-left: -20px; padding: 0 20px; position: absolute; width: 100%; }
@media only screen and (max-width: 700px) { .shop-item .box-footer-btn { margin: 0; padding: 0; position: static; } }

.shop-item .box-content { padding: 20px 20px 40px; }
@media only screen and (max-width: 700px) { .shop-item .box-content { padding: 20px; } }

.shop-item-list { width: 100%; }

.shop-item-list .device-usps { display: none; }

.shop-item-list .box { height: 125px; }

.shop-item-list .box-content { padding: 10px; }

.shop-item-list .box-header { background: #fff; height: auto; position: absolute; top: 10px; left: 90px; padding-top: 0px; }

@media only screen and (max-width: 700px) { .shop-item-list .box-header { left: 100px; } }
.shop-item-list:hover .box-header { background: #fff; }

.shop-item-list .box-footer { margin-top: 0px; padding-left: 100px; }

.shop-item-list .box-footer-actions { bottom: 10px; }

.shop-item-list .box-footer-btn { margin: 0; padding: 0; position: static; }

@media only screen and (max-width: 700px) { .shop-item-list .box-footer-actions { display: none; } }
.shop-item-list .box-footer-actions a.icon-link { margin-left: 1.6rem; }

.shop-item-list .btn { position: absolute; bottom: 15px; right: 20px; margin-right: 0px; width: auto; padding: 5px 20px; display: inline-block; }

.shop-item-list .device-price { bottom: 15px; right: 200px; top: auto; }

@media only screen and (max-width: 700px) { .shop-item-list .device-price { left: 120px; right: auto; } }
.shop-item-list .image { position: absolute; top: 10px; left: 20px; height: 80%; width: auto; }

.filter-wrapper, .results-wrapper { -webkit-transition: all 0.2s linear 0.1s; transition: all 0.2s linear 0.1s; }

@media only screen and (max-width: 1100px) { .filter-wrapper { position: absolute; left: -33.3333%; top: 6rem; } }
@media only screen and (max-width: 960px) { .filter-wrapper { left: -100%; } }
@media only screen and (max-width: 700px) { .filter-wrapper { left: -100%; top: 0; } }

@media only screen and (max-width: 1100px) { .results-wrapper { position: relative; left: 0; } }
.results-wrapper .product-content { margin-left: -10px; margin-right: -10px; }
.results-wrapper .is-flexbox { -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; }
.results-wrapper .is-flexbox > div { -webkit-box-flex: 1; -webkit-flex: 1 33.33%; -ms-flex: 1 33.33%; flex: 1 33.33%; -webkit-flex-basis: -webkit-calc(33.33% - 20px); flex-basis: calc(33.33% - 20px); max-width: 33.33%; }
@media only screen and (max-width: 960px) { .results-wrapper .is-flexbox > div { -webkit-box-flex: 1; -webkit-flex: 1 50%; -ms-flex: 1 50%; flex: 1 50%; -webkit-flex-basis: -webkit-calc(50% - 20px); flex-basis: calc(50% - 20px); max-width: 50%; } }
@media only screen and (max-width: 700px) { .results-wrapper .is-flexbox > div { -webkit-box-flex: 1; -webkit-flex: 1 100%; -ms-flex: 1 100%; flex: 1 100%; max-width: none; } }
.results-wrapper .is-flexbox > div.shop-item-list { -webkit-box-flex: 0; -webkit-flex: 0 100%; -ms-flex: 0 100%; flex: 0 100%; max-width: none; }

.main-wrapper { position: relative; overflow: hidden; }
@media only screen and (max-width: 1100px) { .main-wrapper.show-filter .filter-wrapper { left: 0; } }
@media only screen and (max-width: 700px) { .main-wrapper.show-filter .filter-wrapper { position: relative; } }
@media only screen and (max-width: 1100px) { .main-wrapper.show-filter .results-wrapper { left: 33.3333%; } }
@media only screen and (max-width: 960px) { .main-wrapper.show-filter .results-wrapper { left: 100%; } }
@media only screen and (max-width: 700px) { .main-wrapper.show-filter .results-wrapper { height: 0; left: 100%; } }

.hardware-page .vendor-select, .hardware-page .vendor-select.dropdown { margin: 0; }

.offer { position: relative; z-index: 1; margin-top: -30px; }
@media only screen and (max-width: 1100px) { .offer { padding: 0; } }
@media only screen and (max-width: 700px) { .offer { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); } }
@media only screen and (min-width: 1101px) { .offer .contact-box { position: absolute; z-index: 10; bottom: 56px; }
  .offer .contact-box .contact-cont { height: 8rem; -webkit-box-shadow: none; box-shadow: none; }
  .offer .contact-box .contact-image::after { content: none; }
  .offer .contact-box .contact-text { top: 3px; left: -7rem; padding-left: 10px; } }
@media only screen and (max-width: 1100px) { .offer .contact-box .contact-cont { margin-bottom: 20px; } }
.offer .eyecatcher { position: absolute; z-index: 1; }
.offer .offer-inactive { display: none; }
.offer .offer-image { position: relative; }
@media only screen and (max-width: 700px) { .offer .offer-image { margin-top: 0; } }
.offer .offer-image img { max-width: 130%; margin-top: -230px; margin-left: -90px; }
@media only screen and (max-width: 1100px) { .offer .offer-image img { max-width: 150%; margin-top: -100px; margin-left: -90px; } }
@media only screen and (max-width: 700px) { .offer .offer-image img { max-width: 100%; margin: 100px auto 0; } }
.offer.is-inactive .offer-inactive { display: inline-block; }
.offer .is-visuallyhidden > div { border-color: transparent; }
.offer .infobox-offer.is-invisible { display: none; }
.offer .infobox-offer.is-invisible.is-visible { display: block; margin-bottom: 20px; }

.offer-devices, .offer-tariffs { position: relative; min-height: 320px; }
@media only screen and (max-width: 960px) { .offer-devices, .offer-tariffs { min-height: auto; } }
@media only screen and (max-width: 700px) { .offer-devices h3, .offer-tariffs h3 { margin-top: 1em; } }

.offer-thumbs { position: absolute; z-index: 4; bottom: 100%; width: 100%; }
@media only screen and (max-width: 700px) { .offer-thumbs { border-bottom: 1px solid #e5e5e5; } }
.offer-thumbs h3 { margin-bottom: 5px; }
.offer-thumbs a { line-height: 64px; display: inline-block; width: 26%; height: 60px; margin-right: 1%; text-align: center; background-color: #e5e5e5; }
@media only screen and (max-width: 700px) { .offer-thumbs a { line-height: 55px; min-width: 75px; height: 55px; }
  .offer-thumbs a.is-active { border-bottom: 2px solid #21314d; position: relative; }
  .offer-thumbs a.is-active:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; } }
.offer-thumbs a:last-child { margin-right: 0; }
.offer-thumbs a:hover, .offer-thumbs a.is-active { background-color: #fff; }
.offer-thumbs a * { vertical-align: middle; }

.offer-share[data-rel], .offer-link[data-rel] { display: none; }
.offer-share[data-rel].is-visible, .offer-link[data-rel].is-visible { display: inline-block; }

@media only screen and (max-width: 960px) { .offer-devices { padding-bottom: 90px; } }
@media only screen and (max-width: 700px) { .offer-devices { position: static; border-bottom: 2px solid #e5e5e5; } }
.offer-devices .offer-thumbs { z-index: 5; min-height: 82px; }
@media only screen and (max-width: 700px) { .offer-devices .offer-thumbs { position: absolute; top: 0; width: 90%; height: 94px; } }
.offer-devices .offer-thumbs a { margin-bottom: -5px; -webkit-transition: none; transition: none; text-decoration: none; }
.offer-devices .offer-thumbs a .offer-thumb-container { display: block; width: 100%; height: 100%; -webkit-transition: none; transition: none; background-color: #e5e5e5; background-repeat: no-repeat; background-size: cover; -webkit-box-shadow: none; box-shadow: none; padding-top: 0.3em; padding-left: 0.5em; padding-right: 0.5em; }
.offer-devices .offer-thumbs a .offer-thumb-container .thumb { height: 100%; background-size: cover; background-position: top center; }
.offer-devices .offer-thumbs a strong { font-size: 1.3rem; line-height: 1.2; display: none; text-decoration: none; text-transform: uppercase; color: #21314d; padding-bottom: 5px; }
.offer-devices .offer-thumbs a.is-active .offer-thumb-container { background-color: #fff; }
.offer-devices .options { clear: both; }

.no-touch .offer-devices .offer-thumbs a:hover { position: absolute; width: 40%; margin-left: -6%; }
@media only screen and (max-width: 700px) { .no-touch .offer-devices .offer-thumbs a:hover { position: relative; margin: 0 1% -5px 0; width: 26%; -webkit-transition: none; transition: none; -webkit-transform: none; -ms-transform: none; transform: none; } }
.no-touch .offer-devices .offer-thumbs a:hover .offer-thumb-container { height: auto; -webkit-transition: height .05s ease .1s, background-color .05s ease .1s; transition: height .05s ease .1s, background-color .05s ease .1s; background-color: #e5e5e5; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.no-touch .offer-devices .offer-thumbs a:hover .offer-thumb-container .thumb { width: 100%; display: block; background-size: contain; background-repeat: no-repeat; height: 194px; }
@media only screen and (max-width: 700px) { .no-touch .offer-devices .offer-thumbs a:hover .offer-thumb-container .thumb { height: 100%; padding-top: 0; background-size: cover; } }
@media only screen and (max-width: 700px) { .no-touch .offer-devices .offer-thumbs a:hover .offer-thumb-container { height: 100%; -webkit-transition: none; transition: none; background-color: inherit; -webkit-box-shadow: none; box-shadow: none; padding-bottom: 0; } }
.no-touch .offer-devices .offer-thumbs a:hover strong { display: block; }
@media only screen and (max-width: 700px) { .no-touch .offer-devices .offer-thumbs a:hover strong { display: none; } }
.no-touch .offer-devices .offer-thumbs a:hover + a { margin-left: 27%; }
@media only screen and (max-width: 700px) { .no-touch .offer-devices .offer-thumbs a:hover + a { margin-left: 0; } }

.offer-tariffs .offer-thumb-container { display: none; }

@media only screen and (max-width: 960px) { .offer-tariffs.with-hover .offer-thumbs { position: relative; } }
@media only screen and (max-width: 700px) { .offer-tariffs.with-hover .offer-thumbs { position: absolute; } }

.offer-tariffs.with-hover .offer-thumbs a { line-height: 1.5em; }
.offer-tariffs.with-hover .offer-thumbs a .offer-thumb-container { display: block; height: 100%; }
.offer-tariffs.with-hover .offer-thumbs a .offer-thumb-container div { display: none; padding-left: 5px; padding-right: 5px; }

@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a.is-active:hover:before { display: block; }
  .no-touch .offer-tariffs.with-hover .offer-thumbs a.is-active:hover .offer-thumb-container { background-color: #fff; } }
.no-touch .offer-tariffs.with-hover .offer-thumbs a.is-active .offer-thumb-container { background-color: #fff; }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a img { max-height: 40px; } }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover { width: 40%; margin-left: -6%; position: absolute; z-index: 2; }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover:before { display: none; }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .hide-on-hover { display: none; }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container { line-height: 1; font-size: 125%; height: auto; padding: 5px 0 20px 0; -webkit-transition: height .05s ease .1s, background-color .05s ease .1s; transition: height .05s ease .1s, background-color .05s ease .1s; background-color: #e5e5e5; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); z-index: 2; }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container { font-size: 100%; padding: 0; line-height: 1.5em; -webkit-transition: none; transition: none; -webkit-box-shadow: none; box-shadow: none; } }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container div { display: block; }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container div { display: none; } }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container { height: 100%; } }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container .thumb { width: 100%; display: block; background-size: contain; background-repeat: no-repeat; height: 194px; }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a:hover .offer-thumb-container .thumb { height: 100%; padding-top: 0; background-size: cover; } }
.no-touch .offer-tariffs.with-hover .offer-thumbs a:hover + a { margin-left: 27%; }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a:hover + a { margin-left: 0; } }
@media only screen and (max-width: 700px) { .no-touch .offer-tariffs.with-hover .offer-thumbs a:hover { width: 26%; margin-left: 0; position: relative; background-color: #fff; } }

@media only screen and (max-width: 960px) { .offer-tariffs { margin-top: 40px; } }
@media only screen and (max-width: 700px) { .offer-tariffs { margin-top: 20px; } }
@media only screen and (max-width: 960px) { .offer-tariffs .eyecatcher { top: 60px; }
  .offer-tariffs .offer-thumbs { position: relative; margin-bottom: 10px; border-bottom: 1px solid #e5e5e5; }
  .offer-tariffs .offer-thumbs a.is-active { border-bottom: 2px solid #21314d; position: relative; }
  .offer-tariffs .offer-thumbs a.is-active:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; } }
.offer-tariffs .eyecatcher { top: -60px; right: 0; }
.offer-tariffs .icon-plus { top: 60px; left: -40px; }
@media only screen and (max-width: 960px) { .offer-tariffs .icon-plus { top: -40px; left: 50%; } }

@media only screen and (max-width: 960px) { .offer-special-case .grid-reverse { float: left; } }

.offer-device, .offer-tariff { overflow: hidden; height: 0; }
.offer-device.is-visible, .offer-tariff.is-visible { position: absolute; overflow: visible; width: 100%; height: auto; min-height: 100%; }
@media only screen and (max-width: 960px) { .offer-device.is-visible, .offer-tariff.is-visible { position: static; width: 100%; } }
.offer-device .list, .offer-tariff .list { margin-bottom: 0; }
.offer-device .offer-options, .offer-tariff .offer-options { clear: both; margin-top: 1.3em; }
.offer-device .icon-link, .offer-tariff .icon-link { display: block; }
.offer-device .icon-link.is-invisible, .offer-tariff .icon-link.is-invisible { height: 0; }
.offer-device .icon-link.is-invisible.is-visible, .offer-tariff .icon-link.is-invisible.is-visible { height: auto; }
.offer-device .offer-prices, .offer-device .price, .offer-tariff .offer-prices, .offer-tariff .price { position: absolute; bottom: 0; left: 0; max-height: 84px; }
@media only screen and (max-width: 960px) { .offer-device .offer-prices, .offer-device .price, .offer-tariff .offer-prices, .offer-tariff .price { position: static; } }
.offer-device .offer-prices .price .is-invisible, .offer-tariff .offer-prices .price .is-invisible { height: 0; }
.offer-device .offer-prices .price .is-invisible.is-visible, .offer-tariff .offer-prices .price .is-invisible.is-visible { height: auto; }
.offer-device .offer-prices .is-invisible .price, .offer-tariff .offer-prices .is-invisible .price { height: 0; }
.offer-device .offer-prices .is-invisible.is-visible .price, .offer-tariff .offer-prices .is-invisible.is-visible .price { height: auto; }

.offer-device .list { padding-right: 25%; }
@media only screen and (max-width: 960px) { .offer-device .list { padding-right: 0; } }

.offer-tariff { display: none; }
@media only screen and (max-width: 960px) { .offer-tariff h3 { margin-top: 1em; } }
.offer-tariff .price .price-foot { position: absolute; top: 100%; }
@media only screen and (max-width: 960px) { .offer-tariff .price .price-foot { position: relative; } }

.offer-tariff.is-visible { display: block; }
@media only screen and (max-width: 1100px) { .offer-tariff.is-visible { height: 25rem; } }
@media only screen and (max-width: 960px) { .offer-tariff.is-visible { height: auto; } }

.offer-foot { z-index: 1; clear: both; height: 8rem; margin-top: 40px; background-color: #f2f2f2; }
@media only screen and (max-width: 960px) { .offer-foot { margin-top: 20px; } }
@media only screen and (max-width: 700px) { .offer-foot { height: auto; margin-top: 0; background-color: white; } }

.offer-discounts { position: relative; z-index: 10; }
@media only screen and (max-width: 700px) { .offer-discounts.text-right { text-align: left; } }
.offer-discounts .eyecatcher { position: relative; margin-left: 20px; }
@media only screen and (max-width: 700px) { .offer-discounts .eyecatcher { width: 45%; margin: 0; }
  .offer-discounts .eyecatcher + .eyecatcher { margin-left: 10px; } }
.offer-discounts .eyecatcher:before { top: -14px; right: -14px; }
.offer-discounts .eyecatcher:hover { z-index: 10; }
.offer-discounts .eyecatcher .eyecatcher-tooltip img { max-width: 50rem; }
@media only screen and (max-width: 1100px) { .offer-discounts .eyecatcher .eyecatcher-tooltip img { max-width: 40rem; } }

.offer-discounts.is-invisible, .offer-btn.is-invisible, .offer-share-link.is-invisible { display: none; }

.offer-discounts.is-invisible.is-visible, .offer-btn.is-invisible.is-visible, .offer-share-link.is-invisible.is-visible { display: block; }

.offer-share-link { z-index: -1; }
@media only screen and (max-width: 700px) { .offer-share-link { float: left; } }

.is-visualheader { display: block; width: auto; max-width: 100%; height: auto; max-height: 100%; margin: 0 auto; }

.device-price.eyecatcher .is-invisible { display: none; }
.device-price.eyecatcher .is-invisible.is-visible { display: block; }

.offer.offer-sim .offer-image img { max-width: 75%; margin-top: -25%; margin-left: 0; }
@media only screen and (max-width: 700px) { .offer.offer-sim .offer-image img { margin-top: 100px; margin-left: -5vw; } }
.offer.offer-sim .offer-device.is-visible { position: relative; }
@media only screen and (max-width: 700px) { .offer.offer-sim .offer-device .offer-tariffs .offer-thumbs { top: 0; width: 90%; height: 94px; } }
.offer.offer-sim .offer-device .offer-tariffs .offer-btn { position: absolute; bottom: -30px; }
@media only screen and (max-width: 960px) { .offer.offer-sim .offer-device .offer-tariffs .offer-btn { position: relative; bottom: 0; } }
.offer.offer-sim .offer-device .price { position: relative; }
@media only screen and (max-width: 960px) { .offer.offer-sim .offer-device .price-value { height: auto; } }
.offer.offer-sim .offer-tariffs { margin-top: 0; }
.offer.offer-sim .offer-tariffs .icon-plus { top: auto; }
.offer.offer-sim .offer-tariffs .offer-btn { position: absolute; bottom: -30px; }
@media only screen and (max-width: 960px) { .offer.offer-sim .offer-tariffs .offer-btn { position: relative; bottom: 0; } }
.offer.offer-sim .offer-tariff .list { margin-bottom: 1em; }
@media only screen and (max-width: 700px) { .offer.offer-sim .offer-devices, .offer.offer-sim .offer-tariffs { position: static; }
  .offer.offer-sim .offer-devices.with-hover, .offer.offer-sim .offer-tariffs.with-hover { margin-top: 40px; }
  .offer.offer-sim .offer-devices.with-hover .offer-thumbs, .offer.offer-sim .offer-tariffs.with-hover .offer-thumbs { top: 0; }
  .offer.offer-sim .offer-devices.with-hover .offer-btn, .offer.offer-sim .offer-tariffs.with-hover .offer-btn { margin-top: 30px; } }

.apple .tabs { margin-bottom: 10px; }
.apple .intro-wrapper { margin-bottom: 20px; position: relative; }
.apple .intro-wrapper div { padding-top: 0; }
.apple .intro-text { position: absolute; right: 0; top: 33%; }
@media only screen and (max-width: 700px) { .apple .intro-text { position: static; } }
.apple .infobox-shadowed img { padding: 0; width: 100%; max-width: 20rem; }
.apple .infobox-img { height: 23rem; }
.apple .infobox-img img { height: 100%; width: auto; }
.apple .infobox-cont { position: relative; }
.apple .infobox-content { position: absolute; bottom: 10px; right: 10px; }
.apple .infobox-content .btn { margin: 0; }
@media only screen and (max-width: 960px) { .apple .infobox-content { position: static; } }
.apple .margin-right-15 { margin-right: 15px; }

.apple .price.price-m .price-footnote { position: absolute; left: auto; right: -8px; top: 0; }
.apple .table-tariff .dropdown { margin-left: 0; margin-right: 0; }
.apple .table-tariff th:first-child, .apple .table-tariff td:first-child { width: 20%; }

.product-info .content-wrapper .inner-wrapper { padding: 0; }
.product-info .content-wrapper { color: #333; font-size: 1.6rem; line-height: 1.87em; }
.product-info .btn { font-size: 1.3rem; }
.product-info .btn1 { left: 8%; }
@media only screen and (max-width: 700px) { .product-info .btn1 { margin-bottom: 20px; } }
.product-info .btn2 { left: 74%; }
.product-info .angebot { border: none; margin: 0; }
@media only screen and (max-width: 700px) { .product-info .angebot { padding: 20px; } }
.product-info .angebot:first-child { padding-top: 0; }
.product-info .angebot .angebot-text { padding: 0; }
@media only screen and (max-width: 700px) { .product-info .angebot { padding: 40px 20px; } }
.product-info .angebot-odd { padding-top: 30px; }
.product-info .angebot-odd .angebot-text { padding-top: 100px; }
@media only screen and (max-width: 700px) { .product-info .angebot-odd .angebot-text { padding-top: 20px; } }
@media only screen and (max-width: 700px) { .product-info .angebot-odd { padding-top: 100px; padding-bottom: 0; } }
.product-info .angebot-even { background-color: #f0f0f0; padding: 75px 0; }
@media only screen and (max-width: 700px) { .product-info .angebot-even { padding-top: 100px; } }
.product-info .angebot-even .angebot-text { padding: 0 20px; }
.product-info .angebot-even.angebot-sale { margin-bottom: 20px; padding: 40px 0; }
@media only screen and (max-width: 700px) { .product-info .angebot-even.angebot-sale { padding: 60px 20px 20px; } }
.product-info .angebot-even.angebot-sale .angebot-text { padding: 0; }
@media only screen and (max-width: 700px) { .product-info .angebot-even.angebot-sale .angebot-text { padding-top: 40px; } }
.product-info .cont-intro .btn { margin: 0; bottom: 20%; position: absolute; }
@media only screen and (max-width: 700px) { .product-info .cont-intro .btn { position: static; margin-bottom: 20px; } }
.product-info .cont-intro .angebot-teaser { position: relative; }
.product-info .cont-intro .angebot-text { padding-bottom: 40px; }
.product-info .angebot-07 { padding-bottom: 0; }
.product-info .show-phone { display: none; }
@media only screen and (max-width: 700px) { .product-info .show-phone { display: block; } }
@media only screen and (max-width: 700px) { .product-info .show-std { display: none; } }

.product-info.iphone5s .angebot { padding: 40px 0; }
.product-info.iphone5s .angebot-odd .angebot-text { padding-top: 0; }

.apple .headline01, .apple .headline02 { position: absolute; top: 45%; }
@media only screen and (max-width: 700px) { .apple .headline01, .apple .headline02 { display: none; } }
.apple .headline01 { left: 15%; }
.apple .headline02 { right: 15%; }

.ipad-air-2.product-info .angebot-odd.cont-intro, .ipad-mini-3.product-info .angebot-odd.cont-intro { padding: 0; }
.ipad-air-2.product-info .angebot-even, .ipad-mini-3.product-info .angebot-even { padding: 0; }
@media only screen and (max-width: 700px) { .ipad-air-2.product-info .angebot-even, .ipad-mini-3.product-info .angebot-even { padding: 3rem 0 0; } }
.ipad-air-2.product-info .angebot-odd, .ipad-mini-3.product-info .angebot-odd { padding: 7rem 0 5rem; }
@media only screen and (max-width: 700px) { .ipad-air-2.product-info .angebot-odd, .ipad-mini-3.product-info .angebot-odd { padding: 3rem 0; } }
.ipad-air-2.product-info .angebot-odd .angebot-teaser + .angebot-text, .ipad-mini-3.product-info .angebot-odd .angebot-teaser + .angebot-text { padding-top: 3rem; }
@media only screen and (max-width: 700px) { .ipad-air-2.product-info .angebot-odd .angebot-teaser + .angebot-text, .ipad-mini-3.product-info .angebot-odd .angebot-teaser + .angebot-text { padding-top: 0; } }
.ipad-air-2.product-info .angebot-odd .angebot-text, .ipad-mini-3.product-info .angebot-odd .angebot-text { padding-top: 0; }
@media only screen and (max-width: 700px) { .ipad-air-2.product-info .angebot-odd .angebot-text, .ipad-mini-3.product-info .angebot-odd .angebot-text { padding: 0 2rem 0; } }
.ipad-air-2.product-info .angebot-teaser.grid-xl-6 .show-phone img, .ipad-mini-3.product-info .angebot-teaser.grid-xl-6 .show-phone img { max-width: 70vw; }
.ipad-air-2 .cont-intro .angebot-teaser > div, .ipad-mini-3 .cont-intro .angebot-teaser > div { text-align: center; }
.ipad-air-2 .cont-intro .angebot-teaser > div a, .ipad-mini-3 .cont-intro .angebot-teaser > div a { position: static; }

.product-info .content-wrapper h2 { font-family: "Open Sans", sans-serif; font-size: 2.8rem; letter-spacing: 0; text-transform: none; }

.ipad-air.product-info .cont-intro .btn, .ipad-mini-3.product-info .cont-intro .btn, .ipad-mini-2.product-info .cont-intro .btn { left: 50%; margin-left: -5rem; top: 25%; bottom: auto; position: absolute; }
@media only screen and (max-width: 700px) { .ipad-air.product-info .cont-intro .btn, .ipad-mini-3.product-info .cont-intro .btn, .ipad-mini-2.product-info .cont-intro .btn { margin-left: 0; margin-top: 2rem; position: static; } }

.ipad-air.product-info .angebot-even, .ipad-mini-2.product-info .angebot-even { padding: 7rem 0; }
@media only screen and (max-width: 700px) { .ipad-air.product-info .angebot-even, .ipad-mini-2.product-info .angebot-even { padding: 3rem 0; } }
.ipad-air.product-info .angebot-odd, .ipad-mini-2.product-info .angebot-odd { padding-bottom: 7rem; padding-top: 7rem; }
@media only screen and (max-width: 700px) { .ipad-air.product-info .angebot-odd, .ipad-mini-2.product-info .angebot-odd { padding-bottom: 3rem; padding-top: 3rem; } }
.ipad-air.product-info .angebot-odd .angebot-text, .ipad-mini-2.product-info .angebot-odd .angebot-text { padding-top: 0; }

.ipad-mini-2.product-info .cont-intro .btn { top: 30%; }

.btn-compare, .boxes-compare a { bottom: 40px; left: 50%; position: absolute; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
@media only screen and (max-width: 960px) { .btn-compare, .boxes-compare a { bottom: 20px; } }
@media only screen and (max-width: 700px) { .btn-compare.btn-compare, .boxes-compare a.btn-compare { width: 50%; } }

.boxes-compare a { bottom: 20px; margin: 0; white-space: nowrap; }
@media only screen and (max-width: 960px) { .boxes-compare a { bottom: 70px; } }
@media only screen and (max-width: 700px) { .boxes-compare a { bottom: 25px; width: 90%; } }

@media only screen and (max-width: 700px) { .boxes-compare { padding: 10px; } }

.product-info .bg-black { background-color: black; }
.product-info .bg-dark-grey { background-color: #121212; }

#smh-kamera-logo { float: right; margin-top: 8rem; }
@media only screen and (max-width: 960px) { #smh-kamera-logo { float: left; margin-top: 0; } }

#smarthome-img { position: relative; }

.smh-hover { cursor: pointer; position: absolute; }
.smh-hover:hover .info-i { color: #21314d; }
.smh-hover .info-i { position: absolute; right: 0; top: 10px; }
.smh-hover .info-hover:before { left: 23%; }

#handy { height: 150px; left: 9%; top: 45%; width: 7rem; }
@media only screen and (max-width: 1100px) { #handy { height: 105px; } }
@media only screen and (max-width: 960px) { #handy { width: 6rem; } }

#tablet { height: 11.5rem; left: 15%; top: 65%; width: 10.5rem; }
#tablet .info-hover { left: 25px; }
@media only screen and (max-width: 960px) { #tablet { height: 8.5rem; width: 9rem; } }

#pc { height: 14.5rem; left: 33%; top: 72%; width: 9.5rem; }
@media only screen and (max-width: 960px) { #pc { height: 10rem; width: 8.5rem; } }

@media only screen and (max-width: 1100px) { #interContainer .posCube { left: 40%; } }
@media only screen and (max-width: 960px) { #interContainer .posCube { left: 37%; } }
@media only screen and (max-width: 1100px) { #interContainer .posLine { left: 34%; } }
@media only screen and (max-width: 960px) { #interContainer .posLine { left: 30%; } }

.contracts-list .tariff-box-blue, .tariff-container .tariff-box-blue { max-width: 27.5rem; width: 30%; }
@media only screen and (max-width: 700px) { .contracts-list .tariff-box-blue, .tariff-container .tariff-box-blue { max-width: 100%; width: 100%; } }
.contracts-list .tariff-box-blue + div, .tariff-container .tariff-box-blue + div { width: 70%; }
@media only screen and (max-width: 700px) { .contracts-list .tariff-box-blue + div, .tariff-container .tariff-box-blue + div { width: 100%; } }
.contracts-list .is-inactive .tariff-box-blue, .contracts-list .is-inactive .main-info, .tariff-container .is-inactive .tariff-box-blue, .tariff-container .is-inactive .main-info { opacity: 0.3; }
.contracts-list .is-inactive .vvl-info.extension > div, .tariff-container .is-inactive .vvl-info.extension > div { background-color: #cccccc; }
.contracts-list .is-inactive .vvl-info.extension [data-icon-after], .contracts-list .is-inactive .vvl-info.extension h3, .tariff-container .is-inactive .vvl-info.extension [data-icon-after], .tariff-container .is-inactive .vvl-info.extension h3 { color: #21314d; }

.tariff-name { float: left; padding: 20px; width: 100%; background-color: #21314d; position: relative; }
.tariff-name:after { content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 10px; border-color: transparent transparent transparent #21314d; position: absolute; right: -10px; top: 50%; z-index: 3; }
@media only screen and (max-width: 700px) { .tariff-name { position: relative; }
  .tariff-name:after { content: normal; }
  .tariff-name:before { display: block; height: 0; left: 50%; position: absolute; margin-left: -10px; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; cursor: pointer; } }

.tariff-details { float: left; padding: 0; width: 100%; background-color: #f2f2f2; position: relative; }
.tariff-details .main-info, .tariff-details .vvl-info, .tariff-details .prepaid-info { float: left; }
.tariff-details dt { width: 45%; }
@media only screen and (max-width: 700px) { .tariff-details dt { width: 100%; } }
.tariff-details dd { white-space: nowrap; }
@media only screen and (max-width: 700px) { .tariff-details dd { margin: 0 0 1em; white-space: normal; } }
.tariff-details .main-info { padding: 20px; height: 100%; width: 66.6%; }
.tariff-details .main-info.dom-info { width: 100%; }
.tariff-details .main-info.dom-info dt { width: 30%; float: left; }
@media only screen and (max-width: 960px) { .tariff-details .main-info.dom-info dt { width: 45%; } }
@media only screen and (max-width: 700px) { .tariff-details .main-info.dom-info dt { width: 100%; } }
.tariff-details .main-info.dom-info dd { white-space: normal; width: 70%; float: right; margin-left: 0; }
@media only screen and (max-width: 960px) { .tariff-details .main-info.dom-info dd { width: 55%; } }
@media only screen and (max-width: 700px) { .tariff-details .main-info.dom-info dd { width: 100%; } }
@media only screen and (max-width: 700px) { .tariff-details .main-info { padding: 20px; width: 100%; border-right: none; } }
.tariff-details .main-info dl { margin-bottom: 20px; }
@media only screen and (max-width: 700px) { .tariff-details .main-info dl { margin-bottom: 10px; } }
.tariff-details .vvl-info, .tariff-details .prepaid-info { height: 100%; padding: 20px 10px 10px; width: 33.3%; position: absolute; right: 0; }
@media only screen and (max-width: 700px) { .tariff-details .vvl-info, .tariff-details .prepaid-info { height: auto; padding: 20px 20px 40px; width: 100%; border-top: 2px solid #fff; position: relative; right: auto; } }
.tariff-details .vvl-info.extension, .tariff-details .prepaid-info.extension { border-left: 2px solid #fff; padding: 0; height: 100%; }
@media only screen and (max-width: 700px) { .tariff-details .vvl-info.extension, .tariff-details .prepaid-info.extension { border: none; } }
.tariff-details .vvl-info.extension > div, .tariff-details .prepaid-info.extension > div { background-color: #84bc34; height: 100%; min-height: 15rem; width: 100%; position: relative; }
.tariff-details .vvl-info.extension .icon-link:before, .tariff-details .prepaid-info.extension .icon-link:before { position: relative; left: 5px; top: 4px; }
.tariff-details .vvl-info .vvl-date, .tariff-details .prepaid-info .vvl-date { font-size: 2rem; margin: 20px 0; text-align: center; }
@media only screen and (max-width: 700px) { .tariff-details .vvl-info .vvl-date, .tariff-details .prepaid-info .vvl-date { margin: 20px 0; text-align: left; } }
.tariff-details .vvl-info .icon-link, .tariff-details .prepaid-info .icon-link { display: block; padding: 0; white-space: nowrap; width: 100%; bottom: 20px; position: absolute; }
@media only screen and (max-width: 700px) { .tariff-details .vvl-info div .icon-link, .tariff-details .prepaid-info div .icon-link { position: static; margin: 0; text-align: center; padding: 9em 0 1em 0; } }
.tariff-details .prepaid-info { background-color: #84bc34; }
@media only screen and (max-width: 700px) { .tariff-details .prepaid-info div .icon-link { position: absolute; margin: 0 0 0 20px; text-align: left; padding: 0; } }
.tariff-details .option-info { clear: both; padding: 5px 33.3% 5px 20px; border-right: 2px solid #f2f2f2; border-top: 2px solid #fff; }
@media only screen and (max-width: 700px) { .tariff-details .option-info { padding: 20px 20px 10px 20px; } }
.tariff-details .option-info dl { padding-right: 20px; }

.further-topics .icon-link { margin-right: 0; padding-right: 0; }

@media only screen and (max-width: 700px) { .contracts-list .main-info { border-bottom: 2px solid #fff; } }
@media only screen and (max-width: 700px) { .contracts-list .vvl-info { padding: 0; border: none; } }

.vvl-info.extension h3 { padding-top: 20px; color: #fff; text-align: center; }
.vvl-info.extension .icon-link { margin: 0 0 0 -5px; text-align: center; }
@media only screen and (max-width: 700px) { .vvl-info.extension .icon-link { margin-left: 20px; text-align: left; } }
.vvl-info.extension .icon-link:before { left: 0; }
.vvl-info.extension [data-icon-after] { margin-left: -5px; margin-top: -5px; text-align: center; width: 100%; top: 20px; position: absolute; }
@media only screen and (max-width: 700px) { .vvl-info.extension [data-icon-after] { top: 22%; } }
.vvl-info.extension [data-icon-after]:after { display: block; font-size: 6rem; margin-top: 3rem; color: #fff; }

.sim-form { margin: 20px 10px; }
.sim-form .data-changed-container { padding: 20px 0 20px 20px; }

.sim-from-phone { margin-top: 20px; position: relative; padding: 10px 20px; background-color: #21314d; color: #fff; }
.sim-from-phone:before { display: block; height: 0; left: 50%; margin-left: -10px; position: absolute; right: 0; top: 100%; width: 0; border-style: solid; border-color: #21314d transparent transparent; border-width: 10px 10px 0; content: ''; }

.sim-img { height: 11rem; margin-left: 6rem; }
@media only screen and (max-width: 700px) { .sim-img { margin-left: 2rem; } }
td .sim-img { height: 8rem; margin-left: 0; }
.sim-img img { height: 100%; }

.usages .box-details { margin: 0 auto 40px; padding: 0; }
.usages .box-details li { display: inline-block; float: none; }
.usages .big { font-family: "canada-type-gibson", sans-serif; font-size: 4.4rem; line-height: 1em; }
.usages .roaming:before { content: 'Roaming'; position: absolute; top: 5px; }

.bills { /*li*/ }
.bills .bill { position: relative; }
.bills .further-items { display: block; position: relative; text-align: center; }
.bills .further-items a:after { display: block; left: 38%; top: 100%; }
.bills figure { float: left; margin: 0; padding: 0; position: relative; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); z-index: 0; }
.bills ul.info-list { float: left; margin: 0; padding: 0; }
.bills ul.info-list.is-horizontal li.info-arrow { padding: 10px 5px 10px 17px; }
.bills ul.info-list.is-horizontal li.info-arrow a { margin-left: -10px; }
.bills ul.info-list.is-horizontal .info-arrow-top:after { left: 3px; }
.bills .info-arrow { display: block; margin: 0; padding: 10px 0 10px 10px; position: absolute; width: auto; background-color: #fff; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); z-index: 2; }
.bills .info-arrow:before { content: ''; height: 0; left: -10px; position: absolute; width: 0; z-index: 4; border-color: transparent #fff transparent; border-style: solid; border-width: 10px 10px 10px 0; }
.bills .info-arrow:after { content: ''; height: 0; left: -11px; top: 11px; position: absolute; width: 0; z-index: 3; border-color: transparent #f2f2f2 transparent; border-style: solid; border-width: 11px 11px 11px 0; }
.bills .info-arrow:hover .info-box { display: block; }
.bills .info-arrow a { height: 14px; margin-right: -0.25em; }
.bills .info-arrow a:hover:before { color: #9dc95d; }
.bills .info-arrow a.is-playing { color: #21314d; }
.bills .info-arrow.is-active a.info-i { color: #21314d !important; }
.bills .info-arrow a.info-i:before { margin-left: 0; }
.bills .info-arrow span.title { display: none; }
.bills .info-arrow-top:before { content: ''; height: 0; left: 3px; top: -10px; position: absolute; width: 0; z-index: 4; border-color: transparent transparent #fff; border-style: solid; border-width: 0px 10px 10px 10px; }
.bills .info-arrow-top:after { content: ''; height: 0; left: 9px; top: -11px; position: absolute; width: 0; z-index: 3; border-color: transparent transparent #f2f2f2; border-style: solid; border-width: 0px 11px 11px 11px; }
.bills .info-highlight { display: none; position: absolute; border: 1px solid #84bc34; background-color: rgba(132, 188, 52, 0.35); }
.bills .caption-area { display: none; position: absolute; border: 1px solid #75b03c; }
.bills .caption-area.one { height: 100px; right: 0; top: 40px; width: 100px; }
.bills img { width: 100%; }
.bills .tooltip-container { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.bills .accordion-section { position: relative; z-index: 2; }
.bills .has-bars .accordion-head, .bills .accordion .accordion-head { padding-left: 20px; }
.bills .manyBills.has-bars .accordion-head, .bills .manyBills.accordion .accordion-head, .bills .manyBills th[scope="row"] { padding-left: 35px; }
@media only screen and (max-width: 700px) { .bills .manyBills .accordion-content { padding-top: 0; } }
@media only screen and (max-width: 700px) { .bills .manyBills table { margin: 0; } }
.bills .checkbox { display: block; position: absolute; left: 10px; top: 13px; z-index: 4; }
.bills .download-collection { text-align: center; }
@media only screen and (max-width: 1100px) { .bills .download-collection { text-align: left; } }
.bills .prev, .bills .next { display: none; }
.bills .hint.tooltip { padding: 20px; }
.bills .hint.tooltip p { margin-bottom: 0; }
.bills .hint.tooltip.is-active:before { display: none; }
@media only screen and (max-width: 700px) { .bills figure { float: none; margin-bottom: 10px; }
  .bills ul.info-list { float: none; margin-left: 38px; margin-right: 38px; margin-bottom: 5px; }
  .bills .prev, .bills .next { display: block; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); height: 38px; width: 38px; text-align: center; padding: 10px; }
  .bills .prev:hover, .bills .next:hover { text-decoration: none; }
  .bills .prev { float: left; }
  .bills .next { float: right; }
  .bills .info-arrow { display: none; position: static; }
  .bills .info-arrow span.title { display: inline-block; }
  .bills .info-arrow a.listen { float: right; }
  .bills .info-arrow.is-active { display: block; }
  .bills .info-arrow a.info-i { margin-right: 5px; padding-top: 2px; }
  .bills .info-arrow a.info-i:before { margin-left: 0; }
  .bills .info-arrow a.info-i, .bills .info-arrow:before, .bills .info-arrow:after { display: none; } }

.bills[horizontal] figure { height: 425px; overflow: hidden; margin-bottom: 35px; }
@media only screen and (max-width: 700px) { .bills[horizontal] figure { height: 80vw; margin-bottom: 5px; } }
.bills[horizontal] ul.info-list { position: absolute; }
@media only screen and (max-width: 700px) { .bills[horizontal] ul.info-list { position: static; } }

table .mrg-right-20 { margin-right: 10px; }

.bills-journey { /*li*/ }
.bills-journey .bill { position: relative; }
.bills-journey .further-items { display: block; position: relative; text-align: center; }
.bills-journey .further-items a:after { display: block; left: 38%; top: 100%; }
.bills-journey figure { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); float: left; margin: 0 0 0 60px; padding: 0; position: relative; z-index: 0; }
@media only screen and (max-width: 700px) { .bills-journey figure { margin: 70px 0 0 0; } }
.bills-journey ul.info-list { margin: 0; padding: 0; }
.bills-journey ul.info-list.is-horizontal li.info-arrow { padding: 10px 5px 10px 17px; }
.bills-journey ul.info-list.is-horizontal li.info-arrow a { margin-left: -10px; }
.bills-journey ul.info-list.is-horizontal .info-arrow-top:after { left: 3px; }
.bills-journey .info-arrow { background-color: #84bc34; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); display: block; margin: 0; min-width: 50px; padding: 10px 0 10px 10px; position: absolute; width: auto; z-index: 2; }
.bills-journey .info-arrow:before { border-color: transparent #84bc34 transparent; border-style: solid; border-width: 10px 0 10px 10px; content: ''; height: 0; position: absolute; right: -10px; width: 0; z-index: 4; }
.bills-journey .info-arrow:after { border-color: transparent #f2f2f2 transparent; border-style: solid; border-width: 11px 0 11px 11px; content: ''; height: 0; position: absolute; right: -11px; top: 10px; width: 0; z-index: 3; }
.bills-journey .info-arrow:hover { background-color: #9dc95d; }
.bills-journey .info-arrow:hover .info-box { display: block; }
.bills-journey .info-arrow:hover:before { border-color: transparent #9dc95d transparent; }
.bills-journey .info-arrow a { height: 14px; margin-right: -0.25em; }
.bills-journey .info-arrow a:hover:before { color: #4d5a71; }
.bills-journey .info-arrow a.is-playing { color: #21314d; }
.bills-journey .info-arrow.is-active a.info-i { color: #21314d !important; }
.bills-journey .info-arrow a.info-i { color: #fff; }
.bills-journey .info-arrow a.info-i:before { font-size: 1.8em; margin-left: 0; }
.bills-journey .info-arrow span.title { display: none; }
.bills-journey .info-arrow-top:before { border-color: transparent transparent #84bc34; border-style: solid; border-width: 0 10px 10px 10px; content: ''; height: 0; left: 3px; position: absolute; top: -10px; width: 0; z-index: 4; }
.bills-journey .info-arrow-top:after { border-color: transparent transparent #f2f2f2; border-style: solid; border-width: 0 11px 11px 11px; content: ''; height: 0; left: 9px; position: absolute; top: -11px; width: 0; z-index: 3; }
.bills-journey .info-highlight { background-color: rgba(132, 188, 52, 0.4); border: 2px solid #84bc34; display: none; position: absolute; }
.bills-journey .caption-area { border: 1px solid #75b03c; display: none; position: absolute; }
.bills-journey .caption-area.one { height: 100px; right: 0; top: 40px; width: 100px; }
.bills-journey img { width: 100%; }
.bills-journey .tooltip-container { background: #fff; }
.bills-journey .info-highlight-tooltip { position: absolute; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); width: 100%; }
.bills-journey .accordion-section { position: relative; z-index: 2; }
.bills-journey .has-bars .accordion-head, .bills-journey .accordion .accordion-head { padding-left: 20px; }
.bills-journey .manyBills.has-bars .accordion-head, .bills-journey .manyBills.accordion .accordion-head, .bills-journey .manyBills th[scope="row"] { padding-left: 35px; }
@media only screen and (max-width: 700px) { .bills-journey .manyBills .accordion-content { padding-top: 0; } }
@media only screen and (max-width: 700px) { .bills-journey .manyBills table { margin: 0; } }
.bills-journey .checkbox { display: block; left: 10px; position: absolute; top: 13px; z-index: 4; }
.bills-journey .download-collection { text-align: center; }
@media only screen and (max-width: 1100px) { .bills-journey .download-collection { text-align: left; } }
.bills-journey .prev, .bills-journey .next { display: none; }
.bills-journey .hint.tooltip { margin: 0; padding: 20px; }
.bills-journey .hint.tooltip p { margin-bottom: 0; }
.bills-journey .hint.tooltip.is-active { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
.bills-journey .hint.tooltip.is-active:before { display: none; }
@media only screen and (max-width: 700px) { .bills-journey .info-container { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }
  .bills-journey figure { float: none; margin-bottom: 10px; }
  .bills-journey ul.info-list { float: none; margin-bottom: 5px; margin-left: 38px; margin-right: 38px; text-align: center; }
  .bills-journey .prev, .bills-journey .next { -webkit-box-shadow: none; box-shadow: none; display: block; height: 38px; padding: 10px; text-align: center; width: 38px; }
  .bills-journey .prev:hover, .bills-journey .next:hover { text-decoration: none; }
  .bills-journey .prev { float: left; }
  .bills-journey .next { float: right; }
  .bills-journey .info-arrow { background-color: #fff; -webkit-box-shadow: none; box-shadow: none; display: none; position: static; text-align: center; }
  .bills-journey .info-arrow span.title { display: inline-block; font-weight: bold; }
  .bills-journey .info-arrow.is-active { display: block; }
  .bills-journey .info-arrow a.info-i { margin-right: 5px; padding-top: 2px; }
  .bills-journey .info-arrow a.info-i:before { margin-left: 0; }
  .bills-journey .info-arrow a.info-i, .bills-journey .info-arrow:before, .bills-journey .info-arrow:after { display: none; } }
.bills-journey .video-box { background-color: #fff; -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); margin-bottom: 15px; }
.bills-journey .product-info-box-text__content { padding: 5px; margin: -5px; }
.bills-journey .journey-contact.-has-top-border:before { border-top: solid 1px #000000; content: ''; margin-left: 10px; top: 0; width: -webkit-calc(100% - 20px); width: calc(100% - 20px); }
@media only screen and (max-width: 700px) { .bills-journey .journey-contact.-has-top-border:before { border-top: 0; }
  .bills-journey .journey-contact.-has-top-border-mobile:before { border-top: solid 1px #000000; } }
.bills-journey .journey-contact:after { border-bottom: solid 1px rgba(0, 0, 0, 0.2); bottom: 0; content: ''; margin-left: 10px; width: -webkit-calc(100% - 20px); width: calc(100% - 20px); }
.bills-journey .advantages-img { padding: 1.6rem 1rem; max-width: 65px; }
@media only screen and (max-width: 700px) { .bills-journey .advantages-img { padding: 1.6rem; } }
.bills-journey .advantages-img .advantages-icon { font-size: 45px; }

.bills[horizontal] figure { height: 425px; margin-bottom: 35px; overflow: hidden; }
@media only screen and (max-width: 700px) { .bills[horizontal] figure { height: 80vw; margin-bottom: 5px; } }
.bills[horizontal] ul.info-list { position: absolute; }
@media only screen and (max-width: 700px) { .bills[horizontal] ul.info-list { position: static; } }

table .mrg-right-20 { margin-right: 10px; }

.my-jobs .table-classic .data-status { padding-left: 20px; position: relative; }
@media only screen and (max-width: 700px) { .my-jobs .table-classic .data-status { padding-left: 0; } }
.my-jobs .table-classic .data-status .status-point { left: 0; position: absolute; top: 5px; }
@media only screen and (max-width: 700px) { .my-jobs .table-classic .data-status .status-point { position: static; } }
@media only screen and (max-width: 960px) { .my-jobs .table-classic td, .my-jobs .table-classic th { padding: 10px; } }
@media only screen and (max-width: 700px) { .my-jobs .table-classic td { padding: 0; } }

#newsletterForm, #newsletterFormFinal { margin-top: 20px; }

#newsletterForm .obligation { text-align: left; }
#newsletterForm .form-btn-set { height: 30px; }

#newsletterFormFinal .box-holder { margin-left: 0; }

.box-holder.wbk { margin-left: 24px; }

body.tariff-advisor .content-wrapper .content-intro form { margin-top: -275px; }
@media only screen and (max-width: 960px) { body.tariff-advisor .content-wrapper .content-intro form { margin-top: -190px; } }
@media only screen and (max-width: 700px) { body.tariff-advisor .content-wrapper .content-intro form { margin-top: 0; } }

.ta-intro .offcanvas-back { margin-bottom: 20px; }
.ta-intro .offcanvas-container .offcanvas-col:first-child { padding: 0; }
.ta-intro .offcanvas-container .offcanvas-col:first-child .is-flexbox { margin: 0 -10px 40px; }
@media only screen and (max-width: 700px) { .ta-intro > div { margin: 0; }
  .ta-intro .is-flexbox { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .ta-intro .infobox.tab-like { width: 100%; }
  .ta-intro .infobox.tab-like .infobox-icon span:before { font-size: 10rem; }
  .ta-intro .infobox.tab-like:before { display: none; } }

.ta-settings .has-gradient { padding: 20px; width: 100%; position: relative; }
.ta-settings .has-gradient a.icon-pen { position: absolute; right: 20px; top: 20px; margin: 0; padding: 0; }

.table-tariff[app-md-tarif-advisor] { table-layout: auto; }

.search-filter .search-filter-header { padding: 10px; position: relative; }
.search-filter .search-filter-trigger { position: absolute; right: 0; top: 0; bottom: 0; cursor: pointer; padding: 10px 5px 10px 10px; }
.search-filter .search-filter-content { padding: 0 10px; height: 0; min-height: 0; opacity: 0; overflow: hidden; border: 1px solid #cccccc; border-width: 0 1px 1px; margin-bottom: 20px; }
.search-filter .search-filter-content label { font-weight: normal; }
.search-filter .search-filter-content.open { padding: 10px 10px 5px 10px; height: auto; opacity: 1; min-height: 100px; }

/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; }

.fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; }

@media only screen and (min-width: 701px) { .fancybox-type-iframe.fancybox-wrap { width: 100vw !important; max-width: 1125px !important; }
  .fancybox-type-iframe.fancybox-wrap .fancybox-inner { width: 100% !important; } }
.fancybox-skin { position: relative; background: #ffffff; color: #444; text-shadow: none; padding: 24px 24px 24px 24px; }

.fancybox-opened { z-index: 8030; }

.fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); }

.fancybox-outer, .fancybox-inner { position: relative; }

.fancybox-inner { overflow: hidden; }

.fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; }

.fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; }

.fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; }

.fancybox-image { max-width: 100%; max-height: 100%; }

#fancybox-loading, .fancybox-prev span, .fancybox-next span { background-image: url("vendor/fancybox/fancybox_sprite.png"); }

#fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; }

#fancybox-loading div { width: 44px; height: 44px; background: url("vendor/fancybox/fancybox_loading.gif") center center no-repeat; }

.fancybox-close { position: absolute; top: 10px; right: 10px; height: 36px; width: 36px; z-index: 8900; color: #000; cursor: pointer; text-align: center; }

.fancybox-close:hover { text-decoration: none; }

.fancybox-close:before { font-size: 2.4rem; line-height: 36px; margin-right: 0; }

.fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url("vendor/fancybox/blank.gif"); /* helps IE */ -webkit-tap-highlight-color: transparent; z-index: 8040; }

.fancybox-prev { left: 0; }

.fancybox-next { right: 0; }

.fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; }

.fancybox-prev span { left: 10px; background-position: 0 -36px; }

.fancybox-next span { right: 10px; background-position: 0 -72px; }

.fancybox-nav:hover span, .touch .fancybox-nav span { visibility: visible; }

.fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; }

/* Overlay helper */
.fancybox-lock { overflow: hidden !important; width: auto; }

.fancybox-lock body { overflow: hidden !important; }

.fancybox-lock-test { overflow-y: hidden !important; }

.fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: rgba(33, 49, 77, 0.5); }

.fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; }

.fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; }

/* Title helper */
.fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050; }

.fancybox-opened .fancybox-title { visibility: visible; }

.fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; }

.fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; }

.fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; }

.fancybox-title-inside-wrap { margin: 0; font-family: "Open Sans Bold",sans-serif; font-size: 1.6rem; font-weight: 300; letter-spacing: .05em; line-height: 1.25; text-transform: uppercase; border-bottom: 1px solid #000; }

.fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, 0.8); }

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { #fancybox-loading, .fancybox-prev span, .fancybox-next span { background-image: url("vendor/fancybox/fancybox_sprite@2x.png"); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ }
  #fancybox-loading div { background-image: url("vendor/fancybox/fancybox_loading@2x.gif"); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } }
.has-shadow { -webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.15); }

.has-shadow-inset { -webkit-box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15); }

.has-text-shadow { text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25); }

.has-shadow-filter { -webkit-filter: drop-shadow(1px 2px 5px rgba(0, 0, 0, 0.25)); filter: drop-shadow(1px 2px 5px rgba(0, 0, 0, 0.25)); }

.no-opacity { opacity: 1; }

.has-opacity-60 { opacity: 0.6; }

.has-opacity-30 { opacity: 0.3; }

.has-opacity-0 { opacity: 0; }

.is-visuallyhidden {  /*
* Hide only visually, but have it available for screen readers:
* http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/ border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; /* Extends the .is-visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: https://www.drupal.org/node/897638 */ }
.is-visuallyhidden.focusable:active, .is-visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

.is-hidden { display: none !important; visibility: hidden; }

body .text-left { text-align: left; }
body .text-center { text-align: center; }
body .text-right { text-align: right; }
body .valign-top { vertical-align: top; }
body .valign-middle { vertical-align: middle; }
body .valign-bottom { vertical-align: bottom; }
body .no-margin { margin: 0; }
body .no-margin-top { margin-top: 0; }
body .no-margin-left { margin-left: 0; }
body .no-margin-right { margin-right: 0; }
body .no-margin-bottom { margin-bottom: 0; }
body .no-padding { padding: 0; }
body .no-padding-top { padding-top: 0; }
body .no-padding-left { padding-left: 0; }
body .no-padding-right { padding-right: 0; }
body .no-padding-bottom { padding-bottom: 0; }
body .no-margin-padding { margin: 0; padding: 0; }
body .center-center { position: absolute; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 100%; }

.center { text-align: center; }

.center-div { float: none; display: inline-block; text-align: center; }

.is-bold { font-weight: 700; }

.is-italic { font-style: italic; }

.light { font-family: "canada-type-gibson", sans-serif; }

.uppercase { text-transform: uppercase; }

.no-uppercase { text-transform: none; }

.no-box-shadow { -webkit-box-shadow: none; box-shadow: none; }

.no-text-shadow { text-shadow: none; }

.big { font-family: "canada-type-gibson", sans-serif; font-size: 4.4rem; line-height: 1em; }
@media only screen and (max-width: 700px) { .big { font-size: 3rem; } }

.font-accent { font-size: 1.267em; line-height: 0.78927; }

.font-33 { font-size: 3.3em; }

.font-default { font-family: "Open Sans", sans-serif; }

.is-flexbox { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; }
.is-flexbox > div { width: 100%; }
.is-flexbox > div, .is-flexbox > li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; padding: 10px; }
@media only screen and (max-width: 700px) { .is-flexbox, .is-flexbox > div { display: block; }
  .is-flexbox > div { padding: 10px 5px; } }

.is-block { display: block; width: 100%; }

.as-table { display: table; }

.as-tablecell { display: table-cell; }

.has-column-2 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; }
@media only screen and (max-width: 960px) { .has-column-2 { -webkit-column-count: auto; -moz-column-count: auto; column-count: auto; } }

.resp-media-wrapper { height: 0; overflow: hidden; padding-bottom: 56.25%; position: relative; }
.resp-media-wrapper > * { position: absolute; height: 100%; width: 100%; }

.is-relative { position: relative; }

.float-right { float: right; }

.float-left { float: left; }

.no-float { float: none; }

.clear-both { clear: both; }

.no-selection { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: -moz-none; -o-user-select: none; -ms-user-select: none; user-select: none; }

.no-wrap { white-space: nowrap; }

.has-gradient { background: -webkit-linear-gradient(45deg, #e5e5e5, #fff); background: linear-gradient(45deg, #e5e5e5, #fff); }

.anchor { position: relative; top: -150px; z-index: -1; visibility: hidden; }
@media only screen and (max-width: 700px) { .anchor { top: 0; } }

body .color-d1 { color: #e20074; }
body .bg-color-d1 { background-color: #e20074; color: white; }
body .bg-color-d1:hover { color: white; }
body .color-d2 { color: #e60000; }
body .bg-color-d2 { background-color: #e60000; color: white; }
body .color-tf, body .color-tef { color: #006476; }
body .bg-color-tf, body .bg-color-tef { background-color: #006476; color: white; }
body .color-o2 { color: #002e6e; }
body .bg-color-o2 { background-color: #002e6e; color: white; }

@media only screen and (max-width: 700px) { body .not-mobile { display: none; } }
body .only-mobile { display: none; }
@media only screen and (max-width: 700px) { body .only-mobile { display: block; } }

@media only screen and (min-width: 1101px) { html body .is-hidden-xl { display: none; } }
@media only screen and (min-width: 961px) and (max-width: 1100px) { html body .is-hidden-l { display: none; } }
@media only screen and (min-width: 701px) and (max-width: 960px) { html body .is-hidden-m { display: none; } }
@media only screen and (max-width: 700px) { html body .is-hidden-s { display: none; } }
html body td.not-mobile, html body th.not-mobile { display: table-cell; }
@media only screen and (max-width: 700px) { html body td.not-mobile, html body th.not-mobile { display: none; } }

@media only screen and (min-width: 1101px) { html body .is-visible-xl { display: block; } }
@media only screen and (min-width: 961px) and (max-width: 1100px) { html body .is-visible-l { display: block; } }
@media only screen and (min-width: 701px) and (max-width: 960px) { html body .is-visible-m { display: block; } }
@media only screen and (max-width: 700px) { html body .is-visible-s { display: block; } }

html.ios .not-ios { display: none; }

#outdated, #outdatedNs { display: none; }

#outdated, #outdatedNs { padding: 16px 48px 16px 16px; position: relative; z-index: 9999; border-top: 2px solid #ff674b; background-color: #df002e; color: #fff; font-size: 18px; font-weight: bold; }
#outdated .btn-wrapper, #outdatedNs .btn-wrapper { height: 30px; position: absolute; right: 8px; top: 12px; width: 30px; }
#outdated p, #outdatedNs p { margin: 0; }

#outdatedCloseBtn { display: block; height: 100%; position: relative; width: 100%; color: #fff; font-size: 30px; line-height: 30px; text-decoration: none; }

#outdatedNs #outdatedCloseBtn { display: none; }

.no-js #outdatedNs { display: block; }

#outdatedOverlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: 9998; background: url(../images/outdated_overlay.png); }

/* ==========================================================================
Print styles.
Inlined to avoid the additional HTTP request: h5bp.com/r
========================================================================== */
@media print { * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ -webkit-box-shadow: none !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  /* Don't show links that are fragment identifiers, or use the `javascript:` pseudo protocol */
  a[href^="#"]:after, a[href^="javascript:"]:after { content: ""; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; /* h5bp.com/t */ }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
  .header { position: static; }
  .header-first { border-top: none; }
  .header-first .logo { top: 10px; left: 10px; height: auto; }
  .header-first .blue-nav { display: none; }
  header .breadcrumb, header .header-second { display: none; }
  .content-wrapper { margin-top: 0; padding-bottom: 20px; }
  article.footer, footer section.newsletter, footer section.dealersearch, footer section.connect, footer ul.doormat { display: none; }
  footer .inner-wrapper .grid-full { border-top: none; }
  .vvl-confirmation-footer { display: none; }
  .progressbar { display: none; }
  .tooltip::before { content: none; }
  .print-link { display: none; }
  app-md-bar, .bar_list { display: none; }
  .contextswitch { display: none; }
  .accordion-content { padding: 10px 0; opacity: 1; visibility: visible; }
  .footnotes dd .footnote-detail { overflow: visible; width: 97%; white-space: normal; cursor: default; } }
.grayscale img { -webkit-filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 10+ */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ -webkit-transition: -webkit-filter .5s; /* Chrome 19+, Safari 6+, Safari 6+ iOS */ transition: filter .5s; transition: -webkit-filter .5s; }
.grayscale.grayscale-disable-hover:hover img, .grayscale.grayscale-disable-hover.is-active img, .grayscale.grayscale-disabled img { -webkit-filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale"); filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale"); -webkit-filter: grayscale(0%); }

/*# sourceMappingURL=main.css.map */