custom/plugins/Theme3S/src/Resources/views/storefront/layout/header/header.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/layout/header/header.html.twig' %}
  3. {% block layout_header %}
  5.     <style>
  8.         .nav-main-toggle {display: none;}
  9.         body {font-family: 'Avenir-Book'; font-size: 16px;}
  10.         .clearingItem {clear: both; float: none;}
  11.         *, ::before, ::after {box-sizing: unset;}
  12.         .btn {border-radius: 0!important;}
  13.         .container-main {padding: 0;}
  14.         .modal-backdrop.show {display: none;}
  15.         .offcanvas-cart-actions .btn {padding: 0;}
  16.         .offcanvas-content-container .btn {padding: 0!important;}
  17.         #addPromotionOffcanvasCart .icon {padding: 0 10px!important;}
  19.         h1 {font-family: 'Avenir-Book';font-weight:300;font-size:24px;color:#000000; letter-spacing: 1.92px}
  20.         h2 {font-family: 'Avenir-Book';font-weight:300;font-size:22px;color:#000000;}
  21.         h3 {font-family: 'Avenir-Book';font-weight:300;font-size:20px;color:#000000;}
  22.         h4 {font-family: 'Avenir-Book';font-weight:300;font-size:18px;color:#000000;}
  25.         /* HÄNDLER REG FROM */
  26.         .register-personal .card-title {display: none;}
  29.         /* CHECKOUT */
  30.         .checkout-additional {margin-left: 0!important;flex: unset!important;position: relative!important; box-sizing: border-box!important; max-width: 50%!important;}
  31.         .checkout-aside.checkout-aside-no-offset {box-sizing: border-box!important; flex: unset!important; max-width: 50%!important;}
  32.         #customerComment {resize: none!important; padding-top: 5px; box-sizing: border-box!important;}
  33.         .cart-item-discount-icon {display: block!important; background-size: cover;}
  34.         .cart-item-discount-icon .icon-success {display: none;}
  38.         /* FARBEN */
  39.         .colorbox {position: absolute; bottom: 105px; left: 20px;}
  40.         .variantcolor {width: 45px; height: 15px; border: solid 1px #999999; float: left; margin-right: 15px;}
  41.         .oliv {background: #5f5834;}
  42.         .weissblau {background: #fff;}
  43.         .weiss {background: #fff;}
  44.         .gelb {background: #f5cd5b ;}
  45.         .gruen {background: #74a435 ;}
  46.         .grau {background: #f0f2f5 ;}
  47.         .blau {background: #395f98 ;}
  48.         .orange {background: #f6790a ;}
  52.         /* WAPPEN */
  53.         .wappenbox {width: 50%; position: absolute; left: 13px;}
  54.         .variantwappen {float: left; width: 55px; height: 65px; background-size: contain; background-repeat: no-repeat;}
  55.         .EN11491 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-1149-5.svg')) }});}
  56.         .EN10732 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-1073-2.svg')) }});}
  57.         .EN11495 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-1149-5.svg')) }});}
  58.         .EN14126 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-14126.svg')) }});}
  59.         .KatIII {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Kat-III.svg')) }});}
  60.         .Typ1 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-1.svg')) }});}
  61.         .Typ2 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-2.svg')) }});}
  62.         .Typ3 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-3.svg')) }});}
  63.         .Typ4 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-4.svg')) }});}
  64.         .Typ5 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-5.svg')) }});}
  65.         .Typ6 {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-6.svg')) }});}
  69.         /* BODY CONTAINER */
  70.         .cms-section {overflow: visible!important;}
  71.         .container {padding: 0; margin: 0; width: 100%;}
  72.         .cms-section-default {max-width: 100%; padding: 0; margin: 0; }
  73.         .container, .cms-section .boxed {max-width: 100%; padding: 0; margin: 0;}
  74.         .cms-section-sidebar-main-content .col-12 {margin: 0; padding: 0;}
  75.         .headline-content .col-12 {margin: 0; padding: 0;}
  76.         .cms-element-product-listing .cms-listing-col {padding-right: 0px; padding-left: 0px;}
  77.         .cms-sections {z-index: 1; position: relative;}
  78.         .container-main {z-index: 1; position: relative;}
  79.         .card-tabs {border: 0;z-index: 0;}
  80.         .is-act-customergroupregistration .account-register .col-12 {padding: 0;}
  81.         .account-register, .account-content {max-width: 1600px; width: 100%; padding: 0 50px; margin: 0 auto; margin-top: 100px; margin-bottom: 100px;}
  82.         .checkout {max-width: 1600px; width: 100%; padding: 0 50px; margin: 0 auto; margin-top: 40px; margin-bottom: 100px;}
  83.         .row {margin: 0!important;}
  84.         .product-list-all {padding-top: 40px;}
  85.         .cms-block {overflow: visible!important;}
  86.         main {overflow: hidden; }
  87.         .header-main {}
  88.         .is-act-search #ShopIcons {display: none;}
  89.         .btn.disabled, .btn:disabled, .btn-buy.disabled, .btn-buy:disabled {background: none;}
  90.         .scroll-up-container {display: none;}
  91.         .search-headline {text-align: left;max-width: 1600px;margin: 0 auto;padding: 0 50px;}
  92.         .swag-amazon-pay-card {display: none;}
  93.         .modal-content .cms-sections .boxed .cms-block .col-12 {padding: 0;}
  96.         /* FROMS  (REG / LOGIN ETC) */
  97.         .account-register .col-lg-4 {float: left; width: calc(35% - 40px); flex: unset!important;}
  98.         .account-register .col-lg-8 {float: left; width: calc(65% - 40px); flex: unset!important;}
  99.         .form-control {padding: 0; padding-left: 10px;}
  100.         .custom-select {padding: 0; padding-left: 10px;}
  101.         .form-row .col-sm-6 {float: left; width: calc(50% - 30px); margin-right: 15px; flex: unset!important;}
  102.         .form-row .col-md-6 {float: left; width: calc(50% - 30px); margin-right: 15px; flex: unset!important;}
  103.         .form-row .col-md-2 {float: left; width: calc(25% - 30px); margin-right: 15px; flex: unset!important; max-width: unset;}
  104.         .form-row .col-md-4 {float: left; width: calc(25% - 30px); margin-right: 15px; flex: unset!important;}
  105.         .privacy-notice {margin-top: 15px;}
  106.         .card-title {letter-spacing: 1.28px;}
  107.         .register-address {margin-bottom: 0;}
  108.         .account-overview-card {padding: 0;}
  109.         .account-content-aside {float: left; width: calc(35% - 40px)!important; flex: unset!important; max-width: unset!important;}
  110.         .account-content-main {float: left; width: calc(65% - 40px)!important; flex: unset!important; max-width: unset!important; margin: 0!important; margin-bottom: 40px !important;}
  111.         .account-welcome {padding-top: 10px;}
  112.         .default-address .address-card {padding-left: 0;}
  113.         .register-login-collapse-toogle {margin-bottom: 30px;}
  114.         .account-profile-credentials .col-12 {padding: 0!important;}
  115.         .address-list .address-card {padding: 0!important;}
  118.         /* SLIDEOUT WARENKORB */
  119.         .summary-total, .shipping-cost {flex: unset!important; width: 100%; padding: 0;}
  122.         /* WARENKORB */
  123.         .checkout-main {flex: unset!important; width: 100%; padding: 0; max-width: 100%!important;}
  124.         .cart-item-quantity-container {width: unset!important;}
  125.         .cart-item-row div {padding: 0!important;}
  126.         .cart-item-details-container {margin-left: 25px;}
  127.         .cart-header-row div {padding: 0!important;}
  128.         .cart-add-product-container {display: none;}
  129.         .cart-shipping-costs-container {display: none;}
  130.         .checkout-aside .btn {padding: 0!important;}
  131.         #addPromotion .icon {padding: 0 15px!important;}
  132.         /* .cart-item-img-link {background-image: url({{ absolute_url(asset('bundles/theme3s/images/3S-Ritter_schwarz.svg')) }}); background-position: 50% 50%; background-size: 50%; background-repeat: no-repeat;}*/
  133.         .noimage.cart-item-img-link {background-image: url({{ absolute_url(asset('bundles/theme3s/images/3S-Ritter_schwarz.svg')) }}); background-position: 50% 50%; background-size: 50%; background-repeat: no-repeat;}
  134.         .checkout-product-table .cart-item-img-link {width: 67px; height: 56px;}
  135.         .cart-item-img-link .icon-placeholder svg {display: none;}
  136.         .offcanvas-cart .cart-quantity-price {width: 300px;}
  139.         .account-orders .dropdown-menu a {display: none;!important}
  140.         .account-orders .dropdown-menu {display: none!important;}
  141.         .account-orders {display: none!important;}
  142.         .offcanvas-cart-items .cart-item-discount-icon {background-image: url({{ absolute_url(asset('bundles/theme3s/images/discount.png')) }}); background-position: 50% 50%; background-size: cover;}
  146.         /* CHECK OUT */
  147.         .payment-method-label img {display: none;}
  148.         .checkout-container .checkout-main {margin-left: 0!important;}
  149.         .js-confirm-overview-addresses {flex: unset;}
  150.         .js-confirm-overview-addresses .card-col {padding: 0!important; width: 50%; float: left;}
  151.         .confirm-payment-shipping .col-sm-6 {padding: 0!important; width: 50%; float: left;}
  152.         .confirm-tos {margin-bottom: 40px;}
  153.         .payment-method {min-height: 35px;}
  154.         .checkout-container .checkout-aside {margin-left: 0!important;}
  155.         .checkout {padding-top: 0!important;}
  156.         .checkout-container .finish-address .row .col-sm-6 {padding: 0!important; flex: unset!important; width: 50%!important;}
  157.         .checkout-container .finish-address .row {max-width: 100%!important;}
  158.         .checkout-container .finish-address {max-width: 100%!important; margin-bottom: 20px;}
  159.         .checkout-container .finish-address {padding: 0!important; flex: unset!important;}
  160.         .checkout-container .finish-order-details {padding: 0!important; margin-bottom: 20px; width: 100%; flex: unset!important; max-width: 100%;}
  161.         .stripe-shopware-payment-card-selection {margin-top: 15px;}
  162.         .checkout .card-body .cart-item-info-img {}
  163.         .checkout .confirm-product .cart-item-img {border: solid 0px; display: none;}
  164.         .checkout .confirm-product .icon-placeholder {height: 70px;}
  165.         .checkout .payment-form-group {margin-bottom: 0;}
  166.         .checkout .confirm-product .cart-item-img-container {background-size: contain;background-repeat: no-repeat;background-position: 50% 50%; width: 80px;height: 80px;border: solid 1px #999999;}
  167.         .stripe-shopware-payment-card-selection__card-cvc-info-button {-ms-flex-positive: 0;flex-grow: 0;position: relative;top: 32px;left: 10px;}
  168.         #changePaymentForm  iframe {height: 42px!important; top: 10px; position: relative;}
  172.         /* BESTELLUNGE ANZEIGEN IM PROFL */
  173.         .order-detail-content-header {flex: unset!important;}
  174.         .order-detail-content-header .row {width: 100%;}
  175.         .order-detail-content-header .row div {max-width: 25%; flex: max-content!important;}
  176.         .order-detail-content-row .order-item-image {max-width: 6%;}
  181.         /* SHOPHEADER */
  182.         #Headernavigation {width: 100%; height: 150px; position: relative; background: #fff; transition: all 500ms; z-index: 51;}
  183.         #ShopIcons {position: absolute;  width: 100%; top: 150px; z-index: 45; transition: all 500ms;}
  184.         #ShopIconInner {position: absolute;  padding: 0 50px;  box-sizing: unset!important; top: -50px; right: 0;}
  185.        /*.product-list-all #ShopIconInner {top: -73px;} */
  187.         .rightProductSide #ShopIconInner {top: 38px; padding: 0;}
  188.         #articleheader2 {z-index: 10; position: relative;}
  190.         #cart-icon {width: 23px;height: auto;margin-top: -5px;}
  191.         .cms-section-default {max-width: 1600px; padding: 0 50px; margin: 0 auto;}
  192.         .header-cart {display: inline-block; float: right;}
  193.         #account-options {float: right; margin-right: 0px;}
  194.         #cartcontainer .btn {padding: 2px 0px;}
  195.         .breadcrumb.cms-breadcrumb {position: relative; max-width: 1600px; padding: 0 50px; margin: 0 auto;}
  196.         .breadcrumb {padding: 0; margin: 0;}
  200.         /* PRODUKT SIDEBAR / SUCHE */
  201.         .filter-panel-item-toggle .icon {color: #000;}
  202.         #filter-panel-wrapper .customsidebar {max-width: 1600px; margin: 0 auto;}
  203.         #filter-panel-wrapper {margin-top: 20px;}
  204.         .cms-section-sidebar-sidebar-content {  width: 1600px; margin: 0 auto;padding: 0 50px; position: relative;}
  205.         .searchinput {display: inline-block; float: left; margin-top: 13px; position: relative; z-index: 500;}
  206.         .header-search-btn {border: none; background-image: url({{ absolute_url(asset('bundles/theme3s/images/lupe_2023.svg')) }}); background-repeat: no-repeat; cursor: default; width: 40px; height: 40px; float: left; position: relative; top: 5px;}
  207.         .header-search {position: relative!important;}
  208.         .header-search .form-control {padding: 0;}
  209.         #filter-panel-wrapper .filter-panel-item {position: relative; margin: 0; display: inline-flex; width: max-content!important;}
  210.         #search-input {max-width: 215px; width: 100%; margin-left: 45px; float: left;margin-top: -40px; height: 30px; border: solid 1px #999999; border-radius: 0; padding-left: 5px;}
  211.         #filter-panel-wrapper .filter-panel-item .filter-panel-item-toggle {border: none; float: left; margin-right: 10px; display: inline-block; width: max-content;}
  212.         #filter-panel-wrapper .is--sidebar .icon-filter-panel-item-toggle {margin-left: unset; position: relative; top: 4px; color: #000; }
  213.         #filter-panel-wrapper .filter-panel {position: relative; top: -5px;}
  214.         #filter-panel-wrapper .produkt-template .btn:focus, .btn.focus, .filter-panel-item-toggle {outline: 0!important; box-shadow: 0 0 0 0 rgba(0, 48, 94, .25)!important; font-size: 14px; }
  215.         #filter-panel-wrapper .custom-control-label {font-size: 14px; position: relative; top: 2px;}
  216.         #filter-panel-wrapper  button:focus {border: none;}
  217.         .filter-panel-item-dropdown {border: none!important; position: absolute; z-index: 50; display: inline-block;  margin-top: 40px; width: max-content!important; background: #fff; overflow-x: hidden;}
  218.         #filter-panel-wrapper .custom-control-label {margin-left: 15px;}
  219.         #filter-panel-wrapper .custom-control-label::before {left: -1rem;}
  220.         #filter-panel-wrapper .custom-control {padding: 0;}
  221.         #filter-panel-wrapper .filter-multi-select-list {background: #fff; margin-top: -10px;}
  222.         #filter-panel-wrapper .filter-range-container {display: block!important;}
  223.         #filter-panel-wrapper .filter-range-min, .filter-range-max {width: 100%;}
  224.         #filter-panel-wrapper .min-input, .max-input {padding: 0!important; border-radius: 0; border: solid 1px #999999;}
  225.         #filter-panel-wrapper .propertie-filter-name {letter-spacing: 1.12px;}
  226.         #filter-panel-wrapper #cartcontainer .btn {padding-right: 0;}
  227.         #filter-panel-wrapper .custom-control-label::after {left: -0.95rem; top: 2px;}
  228.         #filter-panel-wrapper .custom-checkbox .custom-control-label::before {border-radius: 0!important;}
  229.         #filter-panel-wrapper .custom-control-label::before {left: -1rem;top: 1px;}
  230.         #filter-panel-wrapper .filter-active {border-radius: 0px;height: 30px;line-height: 30px;border: 1px solid #000;max-width: max-content; font-size: 14px; letter-spacing: 1.12px;}
  231.         #filter-panel-wrapper .filter-active-remove {right: -22px;}
  232.         #filter-panel-wrapper .btn.filter-reset-all {border-radius: 0px; height: 30px; line-height: 30px;}
  233.         #filter-panel-wrapper .filter-panel-active-container {margin-left: 10px;}
  234.         .offcanvas .filter-panel-item-toggle[aria-expanded="true"] {border-bottom: solid 1px!important;}
  235.         .breadcrumb-link, .breadcrumb-link.is-active {letter-spacing: 1.28px; font-weight: 300!important; }
  236.         .breadcrumb a {font-size: 16px;}
  237.         .btn.filter-panel-wrapper-toggle {border: 1px solid #999999;}
  238.         .icon-checkmark svg {transform: rotate(0deg)!important;}
  242.         /* CUSTOM ADDRESS CREATE */
  243.         #addressesgrid {width: 100%; margin: 15px 0;}
  244.         .griditem {float: left;}
  245.         .addresspick {cursor: pointer; margin-top: 5px; box-sizing: border-box;}
  246.         .addresspick:hover {font-weight: bold;}
  248.         #addressesgrid .griditem {}
  249.         #addressesgrid .addressrow {width: 100%; margin-bottom: 25px; padding-bottom: 10px; border-bottom: solid 1px #bcc1c7;}
  250.         #billing-addressEditorAccordion .griditem.firstgriditem, #shipping-addressEditorAccordion .griditem.firstgriditem {width: 50%;}
  251.         #billing-addressEditorAccordion .griditem.billpickitem, #shipping-addressEditorAccordion .griditem.deliverypickitem {width: 50%; text-align: right;}
  252.         #billing-addressEditorAccordion .griditem.deliverypickitem {display:none;}
  253.         #shipping-addressEditorAccordion .griditem.billpickitem {display:none;}
  255.         .register-form #addressesgrid .firstgriditem {width: 50%;}
  256.         .register-form #addressesgrid .billpickitem {width: 25%; text-align: right;}
  257.         .register-form #addressesgrid .deliverypickitem {width: 25%; text-align: right;}
  259.         #AddressSelection.inprofile .billpickitem {float: right;}
  261.         .account-register #AddressSelection .deliverypickitem {width: calc(25% - 10px); margin-left: 15px;}
  262.         .account-register #AddressSelection .billpickitem {width: calc(25% - 10px);}
  265.         /* CUSTOMGROUP FORM */
  266.         .is-act-customergroupregistration .register-different-shipping {display: none;}
  270.         input[type="radio"], input[type="checkbox"] {
  271.             box-sizing: border-box;
  272.             padding: 0;
  273.             width: 15px;
  274.             height: 15px;
  275.             pointer-events: all;
  276.         }
  278.         .custom-control-input {
  279.             position: absolute;
  280.             z-index: 7;
  281.             opacity: 0;
  282.             cursor: pointer;
  283.         }
  288.         /* ERGEBNISSE SUCHBOX */
  289.         .search-suggest.js-search-result {position: relative; margin-left: 126%;}
  291.         .search-suggest-container {margin-top: -40px; left: 126%;}
  295.         /* SORTIER BOX */
  296.         .sorting-wrapper {position: absolute;  padding: 0 50px;  box-sizing: unset!important;   right: 0;top: 17px; z-index: 500;}
  297.         .sorting {width: 140px; float: right; }
  298.         .sorting.custom-select {height: 30px; font-size: 14px; border: solid 1px #999999; border-radius: 0; padding: 0; padding-left: 5px;}
  302.         /* MAIN CONTENT */
  303.         .cms-section-sidebar-main-content {float: none; clear: both; z-index: 1; position: relative;}
  307.         /* PRODUKTE ÜBERSICHT */
  308.         .cms-block-product-listing {overflow: visible;}
  310.         .dekoline {width: 1px; position: absolute; height: 1px; background: #999999; z-index: 50; transition: width 5000ms;}
  311.         .dekoline.draw {width: 100%;}
  312.         .line1 {top: 0;}
  313.         .line2 {top: 400px;}
  314.         .line3 {top: 800px;}
  315.         .line4 {top: 1200px;}
  316.         .line5 {top: 1600px;}
  317.         .line6 {top: 2000px; display: none;}
  318.         .line7 {top: 2400px; display: none;}
  319.         .line8 {top: 2800px; display: none;}
  320.         .line9 {top: 3200px; display: none;}
  322.         .dekoline2 {width: 1px; position: absolute; height: 1px; background: #999999; z-index: 50; transition: height 5000ms;}
  323.         .dekoline2.draw {height: 100%;}
  324.         .line1topdown {left: 0;}
  325.         .line2topdown {left: 400px;}
  326.         .line3topdown {left: 800px;}
  327.         .line4topdown {left: 1200px;}
  328.         .line5topdown {left: 1600px;}
  330.         .dekoline3 {width: 1px; position: absolute; height: 1px; background: #999999; z-index: 50; transition: height 5000ms;}
  331.         .dekoline3.draw {height: 100%;}
  333.         #ProductList {margin-top: 50px; border-bottom: solid 0px #999999; position: relative; padding-bottom: 1px;}
  334.         .Products-Wrapper {max-width: 1600px; margin: 0 auto; padding: 0; position: relative;}
  335.         .ProductListInner {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 0; width: 100%;}
  336.         .singleproductcol {border: none; border-left: solid 0px #999999;  min-width: 400px; min-height: 400px; position: relative;}
  338.         .singleproductcol:nth-child(4n) {border-right: solid 0px #999999; }
  339.         .singleproductcol:last-child {border-right: solid 0px #999999; }
  341.         .product-price-unit, .product-cheapest-price {display: none;}
  342.         .product-image-link {height: unset!important;}
  343.         .product-action {display: none;}
  344.         .cms-element-product-listing .cms-listing-col {margin-bottom: 0;}
  345.         .card.product-box {border: unset!important; border-radius: 0!important;}
  346.         .product-variant-characteristics {display: none;}
  347.         .product-box {height: 400px; width: 100%; background: none;}
  348.         .product-box .card-body {padding: 30px 20px; margin-top: 1px; margin-left: 1px;}
  349.         .BoxCardName {font-family: 'Avenir-Medium'; font-size: 18px; text-transform: uppercase; letter-spacing: 1.44px; color: #000;   position: absolute;left: 20px;top: 330px; line-height: 21px; right: 20px;}
  350.         .product-image-link:hover {text-decoration: none;}
  351.         .product-price {font-size: 16px;  letter-spacing: 1.28px; font-weight: bold; position: absolute; bottom: 75px; left: 20px;}
  353.         .product-image-wrapper { position: absolute;width: 50%;float: right;right: 5px; height: auto; top: 20px;}
  354.         .product-image {max-height: unset;}
  355.         .product-image-wrapper .product-image-placeholder {background-image: url({{ absolute_url(asset('bundles/theme3s/images/3S-Ritter_schwarz.svg')) }}); width: 90%; height: 280px; background-repeat: no-repeat; background-position: 50% 50%; background-size: contain;}
  356.         #ProductList .product-image.is-standard {max-height: 275px;}
  358.         .box-standard:hover {border: solid 1px #000;}
  359.         .singleproductcol .card-body:hover {border: solid 1px #000;}
  361.         .direktdelivery {color: green;}
  362.         .latedelivery {color: red;}
  365.         /* PRODUKT PAGINATION */
  366.         .pagination-nav {position: relative; max-width: 1600px; padding: 0 50px; margin: 0 auto; box-sizing: unset!important; margin-top: 30px; margin-bottom: 50px;}
  368.         .hoverimages img.cms-image { border: 1px solid #bcc1c7;}
  369.         .hoverimages img.cms-image:hover { border: 1px solid #00305e;}
  372.         /* THREE BLOCK */
  373.         .cms-block-image-three-column {
  374.             width: 100%;
  375.             display: grid;
  376.             grid-template-columns: 1fr 1fr 1fr;
  377.             grid-gap: 20px;
  378.             padding: 0 30px;
  379.         }
  383.         /* PRODUCT DETAIL */
  384.         .product-breadcrumb {display: none;}
  385.         .produktdetail_page { margin-top: 0; position: relative; }
  386.         .produktdetail_page .breadcrumb.cms-breadcrumb {padding: 0; display: none;}
  387.         .produktdetail_page .breadcrump-singleproduktname {margin-left: 30px; margin-top: -23px; letter-spacing: 1.28px;  font-weight: 700;}
  388.         .product-detail-media {width: 100%; }
  389.         .pagecutline {width: 1px;height: 1px;background: #999999;position: fixed;left: 50%;top: 0; transition: height 15000ms;}
  390.         .pagecutline.draw {height: 10000px;}
  391.         .bottomPageCut {position: absolute;  width: 1px; height: 1px; background: #999999; z-index: 5000000; left: -50%; transition: width 10000ms;}
  392.         .bottomPageCut.draw {width: 10000px;}
  393.         .bottomPageCut2 {position: absolute;  width: 1px; height: 1px; background: #999999; z-index: 5000000; left: -50%; transition: width 20000ms;}
  394.         .bottomPageCut2.draw {width: 10000px;}
  395.         .bottomPageCut3 {position: absolute;  width: 1px; height: 1px; background: #999999; z-index: 5000000; left: -50%; transition: width 25000ms;}
  396.         .bottomPageCut3.draw {width: 10000px;}
  398.         .produktdetail_page button.offcanvas-close {display: none!important;}
  399.         .produktdetail_page .gallery-slider-thumbnails-col {max-height: 750px; overflow: scroll; padding-top: 25px; padding-left: 0;}
  401.         .bottomPageLine {position: absolute; bottom: 0; height: 1px;background: #999999;z-index: 5000000;left: -50%;width: 250%;}
  404.         .leftProductSide {width: calc(50% - 1px); float: left; padding-top: 45px; z-index: 10000;}
  405.         .leftProductSide .product-detail-media {max-width: 100%; padding: 0;}
  406.         .leftProductSide .gallery-slider-item {min-height: 730px!important;}
  407.         .leftProductSide .gallery-slider-image {width: 100%; height: auto;}
  408.         .leftProductSide .zoom-modal-wrapper .gallery-slider-image {width: unset; height: auto;}
  409.         .search-articleimage-placeholder {background-image: url({{ absolute_url(asset('bundles/theme3s/images/3S-Ritter_schwarz.svg')) }}); width: unset; height: 600px; background-position: 50% 50%; background-repeat: no-repeat;}
  410.         .search-suggest .search-articleimage-placeholder { width: 70%; height: 600px; }
  411.         .base-slider-controls-prev, .base-slider-controls-next {display: block;background: none;border: 0px solid rgba(255, 255, 255, .5);}
  412.         .base-slider-dot.tns-nav-active {background-color: #000!important;}
  413.         .base-slider-dot {background-color: #fff!important; border: solid 1px #999999!important; border-radius: 0!important; width: 24px!important; height: 8px!important; padding: 0!important;}
  414.         .leftProductSide .gallery-slider-col .gallery-slider-controls .icon {width: 60px; height: 60px; color: #000;}
  415.         .leftProductSide .gallery-slider-col .base-slider-controls-prev:hover {border: none!important; left: 0;}
  416.         .leftProductSide .base-slider-controls-next:hover {border: none!important; right: 25px;}
  417.         .leftProductSide .base-slider-controls-next {right: 25px;}
  418.         .leftProductSide .zoom-modal-wrapper .base-slider-controls-next {right: 25px;}
  419.         .leftProductSide .base-slider-dots  {bottom: -10px;}
  420.         .leftProductSide .gallery-slider-thumbnails-col  {width: 245px;}
  421.         .leftProductSide .gallery-slider-thumbnails  {width: 245px;}
  422.         .leftProductSide .gallery-slider-thumbnails-item  {width: 235px; height: 235px; }
  423.         .gallery-slider-thumbnails-col.is-left .gallery-slider-thumbnails-item  {margin-bottom: 20px!important;}
  424.         .leftProductSide .gallery-slider-thumbnails-item-inner img {display: none;}
  425.         .leftProductSide .gallery-slider-thumbnails-item-inner {background-size: contain; background-position: 50% 50%; background-repeat: no-repeat;}
  427.         .leftProductSide .zoom-modal-wrapper .gallery-slider-thumbnails-col  {width: 100%;}
  428.         .leftProductSide .zoom-modal-wrapper .gallery-slider-thumbnails  {width: 100%;}
  429.         .leftProductSide .zoom-modal-wrapper .gallery-slider-thumbnails-item  {width: 75px; height: 75px; }
  430.         .leftProductSide .zoom-modal-wrapper .gallery-slider-thumbnails-item-inner {padding: 0; max-height: 96%!important; max-width: 96%;}
  431.         .leftProductSide .zoom-modal-wrapper .gallery-slider-image {max-height: 95%!important; }
  432.         .leftProductSide .modal .gallery-slider-thumbnails-item-inner img {display: block;}
  433.         .leftProductSide .gallery-slider-row.is-loading {height: 670px;}
  434.         .leftProductSide .zoom-modal-wrapper .modal {top: 150px; height: calc(100% - 150px); z-index: 10000050;}
  436.         .rightProductSide .product-detail-form-container .form-control.product-detail-quantity-input {height: 31px;}
  440.         .rightProductSide {width: 50%; float: right;  padding-top: 45px; padding-left: 45px; box-sizing: border-box!important; }
  441.         .productLogoImage {width: 100%; max-width: 260px; margin-bottom: 35px; margin-top: 20px;}
  442.         .rightProductSide .product-detail-buy {max-width: 100%!important; padding: 0;  margin-top: -15px;}
  443.         .rightProductSide .prodcttitle {max-width: 500px; padding: 0; margin-bottom: 35px; margin-top: 10px;}
  444.         .rightProductSide .CatName {font-size: 16px; letter-spacing: 1.28px; color: #000; width: 100%; font-family: 'Avenir-Medium';}
  445.         .rightProductSide .CatName .congiguratorname {margin-bottom: 15px;}
  446.         .rightProductSide .product-detail-configurator-group-title {font-size: 16px; letter-spacing: 1.28px; color: #000; width: 100%; margin-bottom: 15px; font-family: 'Avenir-Medium'; font-weight: 300;}
  447.         .rightProductSide .product-detail-configurator-option-label {width: 70px; height: 25px!important; padding: 0!important; border-radius: 0!important; line-height: 25px;}
  448.         .rightProductSide .product-detail-configurator-option-label.is-display-color {box-shadow: none!important; border: solid 1px #999999;}
  449.         .rightProductSide .product-detail-configurator {margin-bottom: 40px;}
  450.         .rightProductSide .delivery-information {color: #000; font-size: 16px; font-family: 'Avenir-Medium'; letter-spacing: 1.28px;}
  451.         .rightProductSide .product-detail-tax-link {font-size: 14px; position: relative; letter-spacing:  1.98px;}
  452.         .rightProductSide .product-detail-tax-container {margin-top: -10px;}
  453.         .rightProductSide .product-detail-quantity-select {width: 90px; height: 30px; line-height: 30px; padding: 0; padding-left: 10px; float: left;}
  454.         .rightProductSide .btn-primary {width: 230px; height: 30px; line-height: 30px; padding: 0; font-size: 14px; letter-spacing: 1.12px; font-weight: 300;}
  455.         .btn-primary:hover {background: #fff; color: #000;}
  456.         .rightProductSide .buy-widget-container div {width: max-content; flex: unset!important;}
  457.         .rightProductSide .swag-amazon-pay-product-detail-wrapper {display: none!important;}
  458.         .rightProductSide .justify-content-end {display: none!important;} /* PAYPAL BUTTON */
  459.         .congiguratorname {float: left;}
  460.         .informationicon {float: left;width: 12px;height: 12px;border-radius: 20px;border: solid 1px #000;color: #000;text-align: center;line-height: 12px;font-size: 8px;font-weight: 700;margin-top: 4px;margin-left: 5px; cursor: pointer;}
  461.         .informationicon:hover {border: solid 2px #000; font-weight: bold;}
  462.         .productdetail_container.product_image.pos-0.cms-block-gallery-buybox {padding-bottom: 50px;}
  463.         .rightProductSide .input-group-text {background-color: transparent!important; line-height: 0.5!important;}
  466.         .zoom-modal-wrapper {display: block;}
  469.         /* WAPPEN */
  470.         .product-wappen-wrapper {max-width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 5px; margin-bottom: 30px;}
  471.         .wappen-icon {width: 100%; height: 75px; background-size: contain; float: left; background-repeat: no-repeat;}
  473.         .product-wappen-wrapper .wappen-icon.noactive {display: none; margin-top: 15px; margin-bottom: 15px;}
  475.         #en11491.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-1149-5.svg')) }});}
  476.         #en11495.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-1149-5.svg')) }});}
  477.         #en14126.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-14126.svg')) }});}
  478.         #en10732.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/EN-1073-2.svg')) }});}
  479.         #typ1.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-1.svg')) }});}
  480.         #typ2.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-2.svg')) }});}
  481.         #typ2.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-2.svg')) }});}
  482.         #typ3.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-3.svg')) }});}
  483.         #typ4.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-4.svg')) }});}
  484.         #typ5.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-5.svg')) }});}
  485.         #typ6.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Typ-6.svg')) }});}
  486.         #kat3.active {background-image: url({{ absolute_url(asset('bundles/theme3s/images/wappen/Kat-III.svg')) }});}
  489.         /* BESCHREIBUNG UND DOKUMENTE */
  490.         .productdetail_container {  position: relative; margin-top: 0px; pointer-events: all;}
  491.         .product-detail-description-text {width: calc(50% - 40px); float: left; padding-right: 40px;}
  492.         .product-detail-properties {margin-top: 20px;}
  493.         .cms-element-product-description-reviews {padding-bottom: 60px; padding-top: 70px;background: #fff !important;}
  494.         .h3.product-detail-description-title {font-size: 24px; letter-spacing: 1.92px; font-family: 'Avenir-Medium';  font-weight: 300;}
  495.         .product-detail-description-text {font-size: 16px;  font-family: 'Avenir-Medium';  font-weight: 300; line-height: 33px; padding-right: 40px;}
  496.         .properties-label {font-family: 'Avenir-Medium'; font-size: 16px; letter-spacing: 1.28px; min-width: 150px;}
  497.         .properties-value {font-family: 'Avenir-Medium'; font-size: 16px; letter-spacing: 1.28px;}
  498.         .docicon {height: auto; width: 35px; height: auto; margin-right: 10px;}
  499.         .doctitle {font-size: 16px; letter-spacing: 1.28px;}
  500.         .product-detail-properties-table .properties-value span {display: inline-block; width: 100%;}
  501.         .product-detail-properties-table {width: calc(100% - 20px);}
  504.         /* COOKIE BANNER */
  505.         .cookie-permission-container .container {position: relative; max-width: 1600px; padding: 0 50px; margin: 0 auto; box-sizing: unset!important;}
  508.         /* FOOTER */
  509.         #footercontent {width: 100%; background: #fff; height: 300px;}
  510.         .footer-main {z-index: 1;}
  514.         /* SWITCH MOBILE UND FULL WIDTH */
  515.         #mobiledocContent {display: none;}
  519.         /* KONTO  */
  520.         .account-menu-login-button {padding: 0;}
  521.         .account-orders .dropdown-menu a {display: none;!important}
  522.         .account-orders .dropdown-menu {padding-left: 7px;}
  523.         .payment-method-description p {display: none;}
  526.         /* SUCHSEITE */
  527.         .search-page {padding-top: 50px;}
  528.         .search-page .filter-panel-item-dropdown {border: none!important; display: none; position: absolute; z-index: 50; margin-top: 0px; width: max-content!important; background: #fff; overflow-x: hidden;}
  529.         .search-page .filter-panel-item-dropdown.show {display: inline-block; }
  530.         .cms-section-sidebar-sidebar-content-searchpage {position: relative; max-width: 1600px; padding: 0 50px; margin: 0 auto; box-sizing: unset!important; z-indeX: 51;}
  531.         .search-page #filter-panel-wrapper .btn {padding-left: 0;}
  533.         .cms-section-sidebar-sidebar-content .col-12 {padding: 0;}
  534.         #filter-panel-wrapper .filter-panel {top: 10px; width: 100%;}
  535.         #filter-panel-wrapper .filter-panel .filter-multi-select:nth-child(1) .filter-panel-item-toggle {padding: 0;}
  536.         .cms-section-sidebar-sidebar-content-searchpage {padding: 0;}
  539.         /* FILTER AUSKLAPPBAR */
  540.         .offcanvas-filter .filter-panel {width: calc(100% - 50px); padding: 0 25px;}
  541.         .offcanvas-filter .filter-panel-item-dropdown {border: solid 1px #999999; position: relative;}
  542.         .offcanvas-filter .propertie-filter-name {padding-left: 15px; font-size: 18px;}
  543.         .offcanvas-filter .icon-arrow-medium-down {padding-right: 15px;}
  544.         .offcanvas-filter .filter-panel-item-dropdown {border: solid 1px #999999!important; margin-top: 0px; border-top: 0!important;}
  545.         .offcanvas-filter .filter-multi-select-item-label {font-size: 14px;}
  546.         .offcanvas-filter .filter-multi-select-list-item {padding-left: 15px;}
  548.         .search-suggest.js-search-result {margin-left: 0;}
  549.         .offcanvas-filter .filter-active-remove {width: 10px;}
  550.         .offcanvas-filter .filter-active {height: 25px;line-height: 25px; border-radius: 0;}
  551.         .offcanvas-filter .btn.filter-reset-all {height: 25px;line-height: 25px; border-radius: 0;}
  553.         .offcanvas-filter .form-control.min-input {padding: 0; width: unset; border: solid 1px #999999; }
  554.         .offcanvas-filter .form-control.max-input {padding: 0; width: inherit; border: solid 1px #999999; }
  555.         .offcanvas-filter .filter-range-container {padding: 10px;}
  557.         .is-act-search .offcanvas .filter-panel-item {width: 100%;}
  558.         .offcanvas .js-offcanvas-close.icon {margin-top: -15px;}
  559.         .is-act-search .offcanvas .filter-panel-item-dropdown.dropdown-menu {display: none;}
  560.         .is-act-search .offcanvas .filter-panel-item-dropdown.dropdown-menu.show {display: block;}
  561.         .is-act-search .offcanvas .filter-panel-item-toggle {width: 100%;}
  562.         .offcanvas .filter-panel-items-container .btn {padding: 0;}
  563.         .is-act-search .offcanvas .filter-panel-item {margin-right: 0;}
  564.         .is-act-search .offcanvas-filter .icon-arrow-medium-down {float: right; margin-top: 5px;}
  565.         .is-act-search .offcanvas .propertie-filter-name {float: left;}
  566.         .is-act-search .offcanvas .filter-multi-select-count {float: left;}
  567.         .is-act-search .offcanvas .filter-panel-item-dropdown {position: relative!important; transform: unset!important; width: 100%!important;}
  570.         /* CROSS SELLING */
  572.         #CrossSellingWrapper {box-sizing: border-box!important;}
  573.         .cms-block-cross-selling .col-12 {padding: 0;}
  574.         #CrossSellingWrapper {width: 100%; background: #fff; box-sizing: border-box!important;}
  575.         #CrossSellingWrapper #CrossSellingInner {width: 100%; max-width: 1600px;  margin: 0 auto; box-sizing: unset; height: auto; position: relative; }
  576.         #CrossSellingSlider {height: 400px; overflow: hidden; max-width: 1600px; margin: 0 auto; box-sizing: border-box!important;}
  577.         #SliderRoll {width: 10000px; height: 400px;}
  578.         .singleProductSlide {width: 400px; height:  400px; float: left;  position: relative; transition: all 500ms; box-sizing: border-box!important;}
  579.         .singleProductSlideClone {width: 400px; height: 400px; float: left;  position: relative; transition: all 500ms; margin-left: -400px; box-sizing: border-box!important;}
  580.         .sliderarrow {width: 40px; height: 60px; position: absolute; top: 220px;}
  581.         #leftSliderArrow {left: -60px;}
  582.         #rightSliderArrow {right: -40px;}
  583.         .sliderimage {max-width: 195px; height: auto; max-height: 245px;}
  584.         .singleProductSlide .wappenbox, .singleProductSlideClone .wappenbox {margin-top: 20px;}
  585.         #CrossSellingWrapper svg {width: 60px!important; height: 60px!important; fill: #999999;}
  586.         #CrossSellingWrapper svg:hover {width: 60px!important; height: 60px!important; color: #000;}
  587.         #CrossSellingWrapper .icon {width: 60px!important; height: 60px!important; }
  588.         #CrossSellingWrapper .base-slider-controls-prev {border: none; border-style: none;}
  589.         #CrossSellingWrapper button:focus {border: none; border-style: none;}
  590.         #CrossSellingWrapper .base-slider-controls-prev:hover {border: none; border-style: none;}
  593.         @media only screen and (max-width: 1700px) {
  594.             #CrossSellingWrapper #CrossSellingInner {max-width: 1200px; }
  595.             #CrossSellingSlider  {max-width: 1200px; }
  596.         }
  598.         @media only screen and (max-width: 1300px) {
  599.             #CrossSellingWrapper #CrossSellingInner {max-width: 800px; }
  600.             #CrossSellingSlider  {max-width: 800px; }
  601.         }
  603.         @media only screen and (max-width: 900px) {
  604.             #CrossSellingWrapper #CrossSellingInner {max-width: 400px; width: 100%;}
  605.             #CrossSellingSlider  {max-width: 300px; width: 100%;}
  606.             #SliderRoll .dekoline2 {display: none;}
  607.             .singleProductSlide {border-left: solid 1px #999; border-right: solid 1px #999; width: 300px;}
  608.             .singleProductSlideClone {border-left: solid 1px #999; border-right: solid 1px #999;  width: 300px;}
  609.             #leftSliderArrow {left: -15px;}
  610.             #rightSliderArrow {right: 5px;}
  611.         }
  625.         /* AUS DEM TWILL PROJEKT */
  626.         .footer-main {border-top: 0px solid #bcc1c7; padding-top: 50px; background: #fff;}
  627.         #header {position: fixed;background: white; width: 100%;z-index: 50;} #header-content {position: relative; padding: 0 30px; height: 150px; transition: all 500ms; background: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.4);} body.scrolled #header-content {height: 110px;} #logo {transition: all 500ms; float: left; max-height: 88px; max-width: 160px; margin-top: 30px;} body.scrolled #logo {margin-top: 10px;} #headerspacer {position: relative; height: 150px;transition:height 500ms;} #header-navigation {float: left; transition: all 500ms, right 0ms; margin: 25px 0 0 40px; width: calc(100% - 130px - 160px - 30px - 100px); max-width: 1920px; position: relative;} body.scrolled #header-navigation {margin-top: 5px;} #navigation {list-style: none; margin: 0; padding: 0; display: flex; height: 100px; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-content: center; align-items: center;} #navigation li {position: relative; padding: 5px 25px; margin: 0;} #navigation li:before {display: none;} #navigation > li {display: block; margin: 0;} #navigation > li a {position: relative; font-size: 16px; padding: 10px 10px; text-transform: uppercase; color: #000; font-family: 'Avenir-Medium', sans-serif; letter-spacing: 1.3px; text-decoration: none; cursor: pointer;} #navigation > li a::after {content: ''; display: block; position: absolute; left: 10px; bottom: 5px; height: 1px; background: rgba(0, 0, 0, 0.4); width: 0; transition: width 300ms;} #navigation > li a:hover::after {width: calc(100% - 20px);} @media (min-width: 1601px) and (max-width: 1700px) { #navigation li {padding: 5px 10px;} } @media (min-width: 1401px) and (max-width: 1600px) { #navigation li {padding: 5px 5px;} } @media (min-width: 991px) and (max-width: 1400px) { #header-navigation {margin-left: 40px; width: calc(100% - 40px - 160px - 30px - 100px);} #navigation li {padding: 5px 2px;} } @media (min-width: 991px) and (max-width: 1300px) { #navigation > li a {padding: 10px 5px; letter-spacing:1px;} } #header-menu-button {display:none; position: absolute; right: 18px; top: 56px; cursor: pointer; outline: 0; width: 50px; height: 50px; background: url('./../img/menu.svg') no-repeat center center; transition:all 500ms;} body.mobileNavOpen #header-menu-button {background-image: url('./../img/menu_close.svg');} body.scrolled #header-menu-button {top: 30px;} #header-right {float:right;width: 100px;margin-top: 30px; transition: all 500ms;} body.scrolled #header-right {margin-top: 20px;} @media (max-width: 990px) { #header-content {height: 120px;} body.scrolled #header-content {height: 80px;} #headerspacer {height: 120px;} body.scrolled #headerspacer {height: 80px;} #logo {margin-top: 15px;} body.scrolled #logo {margin-top: 15px; max-height: 50px;} body.scrolled #header-right {margin-top: 15px;} #header-menu-button {display: block;} #header-navigation {position: fixed; transition: none; margin: 0; width: 420px; right: -421px; top: 120px; bottom: 0; border-left: 1px solid rgba(0, 0, 0, 0.4); background: #fff; overflow: auto; -webkit-overflow-scrolling: touch;} body.scrolled #header-navigation {top: 80px; margin: 0;} body.mobileNavOpen #header-navigation {right: 0;} #navigation {display: block; height: auto; margin: 10px 0;} #navigation li {padding: 0;} #navigation li a {display: block;} #navigation > li a {padding: 8px 10px 8px 30px;} #navigation > li a::after {left: 30px;} #navigation > li a:hover::after {width: 20px;} } @media (min-width: 721px) and (max-width: 990px) { #header-navigation {transition: top 500ms, right 500ms;} } @media (max-width: 720px) { #header-content {padding: 0 15px;} #header-navigation {width: 100%; right: -100%;border-left: 0;} #header-menu-button {right: 2px;} } @media (max-width: 700px) { #header-navigation {transition: top 500ms, right 500ms;} } #languages {width: 40px; float: left;padding-top: 1px;} #lang-button {display: block;background:no-repeat right center url('./../img/lang-arrow.svg');cursor: pointer;} #languages .flag {width: 26px; display: block;} #languages ul {list-style: none; margin: 0; padding: 0; display: none; position: absolute;} #languages ul li {padding: 0; margin: 12px 0 0 0;} #languages ul li::before {display: none;} #languages.open ul {display: block;} #header-social {float: left; } #header-social img {width: 16px; vertical-align: top; margin: 0 0 0 10px;}
  628.         #footer {position: relative;background: #fff; } #footer-data {position: relative;} #footergrid {position: relative; display: flex; } .footerbox {min-height: 355px; width: 25%; position: relative; padding: 30px 15px 40px 15px; font-size: 12px; color: #5C5C5C; line-height: 2; flex: 1;} .footerbox p {margin: 0; padding: 0;} .footerbox p a {color: #000; text-decoration: none;} .footerbox h6 {margin: 0 0 7px 0;} #footerlogo {max-width: 160px;} .bottom-box-content {position: absolute; width: calc(100% - 30px); bottom: 40px;} .footernav, .footernav ul {list-style: none; margin: 0; padding: 0; counter-reset: unset;} .footernav li {margin: 0; padding: 0;list-style: none;counter-increment: none;} .footernav li:before {display: none;} .footernav > li {margin: 0 0 15px 0;} .footernav > li:last-child {margin-bottom: 0;} .footernav > li > a {cursor:default;display: block;font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:12px;color:#5c5c5c;margin:0 0 7px 0;padding:0;line-height: 1.4; text-transform: uppercase; text-decoration: none; } .footernav a {text-decoration:none;} @media (min-width: 721px) and (max-width: 990px) { #footerlogo {max-width: 140px;} } @media (max-width: 720px) { #footerlogo {max-width: 120px;} #footergrid {display: block;} .footerbox {width: 100%; min-height: 0; padding: 20px 15px;} .footerbox .top-to-bottom {display: none;} .bottom-box-content {right: 15px; width: calc(100% - 185px); text-align: right; bottom: 20px;} }
  629.         .mid-box-content {position: absolute; width: calc(100% - 30px); top: 120px;}
  630.         #paymentlogos { width: 100%;}
  631.         .paymenticon {height: 18px; width: auto; margin-right: 10px; margin-top: 10px;}
  632.         #footer h6 {font-weight: 400;font-size: 12px;color: #5c5c5c; font-family: 'Avenir-Medium' ,sans-serif; text-transform: uppercase; line-height: 1.4;}
  633.         @media (max-width: 990px) {
  634.             .paymenticon {height: 16px; width: auto; margin-right: 10px; margin-top: 10px;}
  635.         }
  636.         @media (max-width: 720px) {
  637.             #footerbox-4 {margin-top: 90px;}
  638.             .mid-box-content {top: -90px;}
  639.         }
  642.         #languages ul {
  643.             background: #fff;
  644.             padding: 5px;
  645.             margin-left: -5px;
  646.         }
  649.         /*
  650.         .ql-align-left {text-align:left;} .ql-align-right {text-align:right;} .ql-align-center {text-align:center;} .ql-align-justify {text-align:justify;} .ql-indent-1 {padding-left:3em;} .ql-indent-2 {padding-left:6em;} .ql-indent-3 {padding-left:9em;} .ql-indent-4 {padding-left:12em;} .ql-indent-5 {padding-left:15em;} .clear {float:none;clear:both;} * {box-sizing:border-box;} body {font-family:Avenir-Book, sans-serif;font-weight:normal;font-size:16px;line-height:1.5;color:#000;letter-spacing:0.2px;} p {margin:0 0 15px 0;} table caption {display:none;} p strong {font-family:'Avenir-Medium', sans-serif;font-weight:normal;} h1 {font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:40px;color:#000;margin:0 0 18px 0;padding:0;line-height:1.2;letter-spacing:0.32px;text-transform:uppercase;} h2 {font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:30px;color:#000;margin:0 0 18px 0;padding:0;line-height:1.2;} h3 {font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:24px;color:#000;margin:0 0 15px 0;padding:0;line-height:1.2;} h4 {font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:20px;color:#000;margin:0 0 15px 0;padding:0;} h5 {font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:18px;color:#000;margin:0 0 15px 0;padding:0;} h6 {font-family:'Avenir-Medium', sans-serif;font-weight:normal;font-size:12px;color:#5c5c5c;margin:0 0 2px 0;padding:0;line-height:1.4;text-transform:uppercase;} @media (min-width: 721px) and (max-width: 990px) { h1 {font-size: 34px; hyphens: auto;} h2 {font-size: 27px;} h3 {font-size: 23px;} } @media (max-width: 720px) { h1 {font-size: 28px; hyphens: auto;} h2 {font-size: 24px; hyphens: auto;} h3 {font-size: 20px; hyphens: auto;} h4 {font-size: 18px;} } a:link, a:visited {text-decoration:underline;color:#000;} a:active {color:#000;} a:hover {text-decoration:underline;color:#000;} a img {border-width:0;} hr {height:1px;border:0;display:block;background:#000;padding:0;margin:20px 0;} .ql-indent-1 {padding-left:3em;} .ql-indent-2 {padding-left:4.5em;} .ql-indent-3 {padding-left:6em;} .ql-indent-4 {padding-left:7.5em;} .ql-indent-5 {padding-left:9em;} .ql-indent-6 {padding-left:10.5em;} .ql-indent-7 {padding-left:12em;} .ql-indent-8 {padding-left:13.5em;} ol, ul { margin: 0; padding: 0; counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; } ol li, ul li { padding-left: 1.7em; counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; counter-increment:list-0; } ol>li, ul>li { list-style-type: none; } ol li:before { margin-left: -1.8em; margin-right: 0.5em; text-align: right; content: counter(list-0,decimal) ". "; display: inline-block; white-space: nowrap; width: 1.2em; } ul>li:before { margin-left: -1.5em; margin-right: 0.3em; text-align: right; content: "\2022"; display: inline-block; white-space: nowrap; width: 1.2em; } ol li.ql-indent-1 {counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-1;} ol li.ql-indent-1:before {content:counter(list-1,lower-alpha) ". ";} ol li.ql-indent-2 {counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-2;} ol li.ql-indent-2:before {content:counter(list-2,lower-roman) ". ";} ol li.ql-indent-3 {counter-reset:list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-3;} ol li.ql-indent-3:before {content:counter(list-3,decimal) ". ";} ol li.ql-indent-4 {counter-reset:list-5 list-6 list-7 list-8 list-9;counter-increment:list-4;} ol li.ql-indent-4:before {content:counter(list-4,lower-alpha) ". ";} ol li.ql-indent-5 {counter-reset:list-6 list-7 list-8 list-9;counter-increment:list-5;} ol li.ql-indent-5:before {content:counter(list-5,lower-roman) ". ";} ol li.ql-indent-6 {counter-reset:list-7 list-8 list-9;counter-increment:list-6;} ol li.ql-indent-6:before {content:counter(list-6,decimal) ". ";} ol li.ql-indent-7 {counter-reset:list-8 list-9;counter-increment:list-7;} ol li.ql-indent-7:before {content:counter(list-7,lower-alpha) ". ";} ol li.ql-indent-8 {counter-reset:list-9;counter-increment:list-8;} ol li.ql-indent-8:before {content:counter(list-8,lower-roman) ". ";} .contentwidth { position: relative; max-width: 1480px; margin: 0 auto; padding: 0 30px; } @media (max-width: 720px) { .contentwidth { padding: 0 15px; } } h1.hoverLine, .content_block_image_text_full__content h1 { display: inline-block; position: relative; } h1.hoverLine::after, .content_block_image_text_full__content h1::after { content: ''; display: block; position: absolute; left: 0; bottom: 0; height: 1px; background: #000; width: 20px; transition: width 300ms; } h1.hoverLine:hover::after, .content_block_image_text_full__content h1:hover::after { width: 100%; } a.btn, .btn {text-decoration:none;transition: background 300ms, color 300ms;position:relative;display:inline-block;text-transform:uppercase;color:#000;background:#fff;padding:17px 20px;line-height:1;border:1px solid #000;font-size:12px;text-align:center;} a.btn.black, .btn.black {color:#fff;background:#000;border:1px solid #fff;} a.btn:hover, .btn:hover {color:#fff;background:#000;} a.btn.black:hover, .btn.black:hover {color:#000;background:#fff;} @media (max-width: 720px) { a.btn, .btn {padding: 17px 25px;} }
  651.         */
  653.         .footerbox {box-sizing: border-box!important;}
  654.         #lang-button {background-image: url({{ absolute_url(asset('bundles/theme3s/images/lang-arrow.svg')) }});}
  655.         #header-menu-button {background-image: url({{ absolute_url(asset('bundles/theme3s/images/menu.svg')) }});}
  656.         body.mobileNavOpen #header-menu-button {background-image: url({{ absolute_url(asset('bundles/theme3s/images/menu_close.svg')) }});}
  659.         .animStarted2 {height: 100%!important;}
  660.         .top-to-bottom {width: 1px;height: 0%;background: rgba(0,0,0,.4);position: absolute;transition: all 2s;right: 0;top: 0;z-index: 1;}
  661.         .animStarted {width: 100%!important;}
  662.         .left-to-right {width: 0px;height: 1px;background: rgba(0,0,0,.4);position: absolute;transition: all 4s;top: 0;left: 0;z-index: 1;}
  665.         /* OVERLAYS */
  666.         #overlaybackground {position: fixed;overflow: hidden;top: 0;left: 0; z-index: 1040;width: 100vw;height: 100vh;background-color: rgba(0, 0, 0, .5);}
  667.         #overlaycontent {width: 60%; height: 650px; padding: 25px; background: #fff; position: fixed; z-index: 5000; border: 0; box-shadow: 0 43px 43px -6px rgba(0, 0, 0, .2); margin-left: auto;margin-right: auto;left: 0;right: 0; margin-top: 1.75rem; }
  668.         #overlaycontent iframe {width: 100%; height: 100%; border: none;}
  669.         .modal {background-color: rgba(0, 0, 0, .5);}
  673.         /* KEYFRAMES ANIMATIONS */
  674.         .slide-in-top {
  675.             -webkit-animation: slide-in-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  676.             animation: slide-in-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  677.         }
  679.         @-webkit-keyframes slide-in-top {
  680.             0% {-webkit-transform: translateY(-1000px);transform: translateY(-1000px);opacity: 0;}
  681.             100% {-webkit-transform: translateY(0);transform: translateY(0);opacity: 1;}
  682.         }
  683.         @keyframes slide-in-top {
  684.             0% {-webkit-transform: translateY(-1000px);transform: translateY(-1000px);opacity: 0;}
  685.             100% {-webkit-transform: translateY(0);transform: translateY(0);opacity: 1;}
  686.         }
  691.         /* AUTO NAVIGATION */
  692.         .product-list-all .active {display: block;}
  697.         /* RESPONSIV */
  698.         @media only screen and (max-width: 1700px) {
  700.             .ProductListInner {grid-template-columns: 1fr 1fr 1fr; }
  701.             .Products-Wrapper {max-width: 1200px; }
  704.             .singleproductcol:nth-child(4n) {border-right: solid 0px #999999; }
  705.             .singleproductcol:nth-child(3n) {border-right: solid 0px #999999; }
  706.             .singleproductcol:last-child {border-right: solid 0px #999999; }
  708.             .line6 {display: block;}
  709.             .line7 {display: block;}
  712.             .line5topdown {display: none;}
  715.             .search-headline {max-width: 1200px;}
  716.             .account-register, .account-content, .checkout {max-width: 1200px; }
  717.             .cms-section-sidebar-sidebar-content {width: 1200px;}
  718.             .cms-section-sidebar-sidebar-content-searchpage {max-width: 1200px; padding: 0;}
  719.             .customsidebar {max-width: 1200px; }
  720.             #ShopIconInner {max-width: 1200px;}
  721.             .cms-section-default {max-width: 1200px;}
  722.             .breadcrumb.cms-breadcrumb {max-width: 1200px;}
  723.             #filter-panel-wrapper .filter-panel {top: 10px;width: 100%;}
  724.             .cms-section-sidebar-sidebar-content .col-12 {padding: 0!important;}
  725.             .product_desc .col-12 {padding: 0!important;}
  726.             .filter-panel-item-toggle.btn.btn-block {padding: 0;}
  727.             .pagination-nav {max-width: 1200px;}
  728.             .cookie-permission-container .container {max-width: 1200px; padding: 0 50px;}
  729.             .d-flex {margin-right: 0px;}
  730.             .filter-panel-item .filter-panel-item-toggle {margin-right: 26px;}
  731.             .filter-panel-active-container {margin-left: 0px;}
  732.             #filter-panel-wrapper .filter-panel-item .filter-panel-item-toggle {margin-right: 30px;}
  733.             .filter-multi-select-list-item {padding: 5px 1px;}
  734.             #filter-panel-wrapper .filter-panel-active-container {margin-left: 0px;}
  735.             #cartcontainer .btn {padding: 2px 0px;}
  738.             .leftProductSide .gallery-slider-thumbnails-col  {width: 100px;}
  739.             .leftProductSide .gallery-slider-thumbnails  {width: 100px;}
  740.             .leftProductSide .gallery-slider-thumbnails-item  {width: 90px; height: 90px; }
  741.             .leftProductSide .gallery-slider-image  {bottom: unset!important;}
  742.             .leftProductSide .gallery-slider-item {min-height: 625px !important;}
  746.             .product-wappen-wrapper {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
  747.             .wappen-icon {margin-bottom: 15px;}
  748.             .rightProductSide {padding-left: 25px;}
  749.             .breadcrumb .breadcrumb-placeholder {margin: 0 5px;}
  750.             .product-detail-description-text {font-size: 18px;}
  751.             .search-page .filter-panel-item-toggle {margin-right: 15px!important;}
  752.             .search-page .filter-panel-item-toggle.btn {padding: 0px!important;}
  753.             .search-page .icon.icon-filter-panel-item-toggle {margin-left: 0px;}
  755.             .rightProductSide .prodcttitle {max-width: 400px;}
  757.             /*.product-detail-cross-selling .tns-item {width: calc(6.25%)!important;}
  758.             .product-detail-cross-selling .product-slider-container {transform: translate3d(-31.25%, 0px, 0px)!important; width: calc(533.333%)!important;}
  759.             */
  762.         }
  768.         @media only screen and (max-width: 1300px) {
  770.             .ProductListInner {grid-template-columns: 1fr 1fr; }
  771.             .Products-Wrapper { max-width: 800px; }
  773.             .singleproductcol:nth-child(4n) {border-right: solid 0px #999999; }
  774.             .singleproductcol:nth-child(3n) {border-right: solid 0px #999999; }
  775.             .singleproductcol:nth-child(2n) {border-right: solid 0px #999999; }
  776.             .singleproductcol:last-child {border-right: solid 0px #999999; }
  779.             .line8 {display: block; }
  780.             .line9 {display: block;}
  783.             .line4topdown {display: none;}
  785.             .search-headline {max-width: 800px;}
  786.             .account-register, .account-content, .checkout {max-width: 800px; padding: 0 25px;}
  787.             .account-register .col-lg-8 {max-width: 100%; width: 100%; padding: 0;margin: 0;}
  788.             .account-register .col-lg-4 {max-width: 100%; width: 100%; padding: 0;margin: 0; margin-bottom: 40px;}
  790.             .cms-section-sidebar-sidebar-content-searchpage {max-width: 800px; padding: 0px;}
  791.             .cms-section-sidebar-sidebar-content {width: 800px; padding: 0 25px;}
  792.             .customsidebar {max-width: 800px;  padding: 0 25px;}
  793.             #ShopIconInner {max-width: 800px; padding: 0 25px;}
  794.             .cms-section-default {max-width: 800px; padding: 0 25px;}
  795.             .breadcrumb.cms-breadcrumb {max-width: 800px; padding: 0 25px;}
  796.             .cookie-permission-container .container {max-width: 800px; padding: 0 25px;}
  797.             .pagination-nav {max-width: 800px;}
  800.             .filter-panel-wrapper {display: none!important;}
  801.             .filter-panel-wrapper-toggle {display: block!important; margin-top: 65px; position: relative; padding: 0px!important; border-radius: 0!important;}
  802.             .filter-panel-wrapper-toggle:hover {border: solid 1px #999999; background: lightgray;}
  803.             .sorting-wrapper {padding: 0 25px;}
  809.             .leftProductSide {width: 100%;}
  810.             .rightProductSide {width: 100%;}
  811.             .pagecutline {display: none;}
  812.             .product-wappen-wrapper {grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;}
  815.             .leftProductSide .gallery-slider-item {min-height: 650px !important;}
  816.             .product-detail-media {margin-top: 40px;}
  817.             .rightProductSide {padding-top: 0;}
  818.             .cms-element-product-description-reviews {margin-top: 0px;}
  820.             .product-detail-description-text {width: 100%;}
  821.             .product-detail-properties {width: 100%;}
  822.             .rightProductSide {padding-left: 0px;}
  823.             .cms-block-product-description-reviews .col-12 {padding: 0;}
  824.             .product-detail-properties-container {margin-left: 0px;}
  826.             .product-detail-properties-table {width: 100%;}
  828.             #articleheader {width: 610px;}
  830.         }
  834.         @media only screen and (max-width: 991px) {
  835.             #Headernavigation {height: 120px; }
  836.             #ShopIcons {position: absolute;  width: 100%; top: 120px; z-index: 50;}
  837.             #header-navigation {top: 121px;}
  839.         }
  845.         @media only screen and (max-width: 850px) {
  847.             #articleheader {width: 80%;}
  849.             .singleproductcol {border-right: solid 0px #999999!important; }
  850.             .ProductListInner {grid-template-columns: 1fr;}
  852.             .ProductListInner {grid-template-columns: 1fr;}
  853.             .Products-Wrapper {width: calc(100% - 30px); }
  855.             .line10 {top: 3600px; display: block;}
  856.             .line11 {top: 4000px; display: block;}
  857.             .line12 {top: 4400px; display: block;}
  858.             .line13 {top: 4800px; display: block;}
  859.             .line14 {top: 5200px; display: block;}
  860.             .line15 {top: 5600px; display: block;}
  861.             .line16 {top: 6000px; display: block;}
  862.             .line17 {top: 6400px; display: block;}
  863.             .line3topdown {display: none;}
  864.             .line2topdown {left: unset; right: 0;}
  867.             .leftProductSide .gallery-slider-item {min-height: 550px !important;}
  870.             .account-register, .account-content, .checkout {max-width: calc(100% - 30px); padding: 0 15px;}
  871.             .form-row .col-sm-6 {width: calc(100% - 20px); margin-right: 0;}
  872.             .form-row .col-md-6 {width: calc(100% - 20px); margin-right: 0;}
  873.             .form-row .col-md-2 {width: calc(100% - 20px); margin-right: 0;}
  874.             .form-row .col-md-4 {width: calc(100% - 20px); margin-right: 0; max-width: 100%;}
  877.             .search-headline {max-width: 100%; padding: 0 15px;}
  878.             .cms-section-sidebar-sidebar-content-searchpage {max-width: 100%; padding: 0px;}
  879.             .search-page .cms-section-sidebar-sidebar-content-searchpage {max-width: 100%; padding: 0 15px;}
  880.             .cms-section-sidebar-sidebar-content {width: calc(100% - 30px); padding: 0 15px;}
  881.             .customsidebar {width: 100%;  padding: 0 15px;}
  882.             #ShopIcons {width: calc(100% - 30px);}
  883.             #ShopIconInner {width: 100%;  padding: 0; right: 30px;}
  884.             .cms-section-default {width: calc(100% - 30px);  padding: 0 15px;}
  885.             .breadcrumb.cms-breadcrumb {width: 65%;  padding: 0 15px; margin-left: 0;}
  886.             .cookie-permission-container .container {width: 100%;  padding: 0;}
  887.             .pagination-nav {width: calc(100% - 30px); padding: 0 15px;}
  888.             .product-image.is-standard, .product-image.is-cover, .product-image.is-contain {max-width: 215px;}
  889.             .product-image-wrapper .product-image-placeholder {width: 180px; height: 280px; }
  893.             .singleproductcol {min-width: 100%;}
  894.             #search-input {max-width: 165px;width: 100%;margin-left: 0px;margin-top: 3px;}
  895.             .header-search-btn {width: 20px;}
  896.             .sorting-wrapper {padding: 0;right: 15px;top: 24px;}
  898.             .offcanvas .offcanvas-content-container, .offcanvas .offcanvas-body {padding: 15px;width: calc(100% - 30px);}
  899.             .header-cart {margin-right: -15px;}
  900.             .offcanvas-content-container .btn-block {display: block;width: calc(100% - 25px);}
  902.             .header-cart .header-cart-badge, .header-wishlist .header-wishlist-badge {position: absolute; right: -30px;}
  903.             .search-suggest.js-search-result {margin-left: 0;}
  904.             .offcanvas-filter .filter-active-remove {width: 10px;}
  905.             .offcanvas-filter .filter-active {height: 25px;line-height: 25px; border-radius: 0;}
  906.             .offcanvas-filter .btn.filter-reset-all {height: 25px;line-height: 25px; border-radius: 0;}
  907.             .product-image-wrapper {width: unset; }
  908.             #SliderRoll .product-image-wrapper .placeholderimg {width: 160px;}
  909.             .gallery-slider-thumbnails-col {display: none;}
  910.             .leftProductSide .gallery-slider-image {left: 0!important; right: 0!important;}
  912.             .product-detail-media {padding: 0;}
  913.             .gallery-slider-row {margin: 0;}
  915.             .product-wappen-wrapper {grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
  916.             .rightProductSide .product-detail-tax-link {font-size: 16px;}
  918.             h1 {font-size: 20px;}
  919.             .productLogoImage {max-width: 200px;}
  920.             .product-detail-tab-preview {display: none;}
  922.             #mobiledocContent {display: block;}
  923.             #FulldocContent {display: none;}
  924.             .nav-tabs {border-bottom: 0px solid #bcc1c7;}
  925.             .card-tabs .nav-link.active {border-color: #bcc1c7;}
  926.             .card-tabs .nav-link.active:hover {border-color: #000;}
  927.             .card-tabs .nav-link.active {color: #000; }
  928.             .card-tabs .nav-link {font-family: 'Avenir-Book';}
  930.             .checkout-container .finish-address .row .col-sm-6 {width: 100%!important;}
  931.             .cart-item-row {padding: 0!important; width: 100%; flex: unset!important;}
  932.             .cart-item-product .cart-item-info {max-width: 100%!important; flex: unset;}
  933.             .cart-item-details {width: auto!important; flex: unset!important;}
  936.             .account-content-main {width: 100%!important; padding: 0!important;}
  937.             .order-detail-content-row {padding: 15px;}
  938.             .offcanvas-content-container .btn {padding: 0!important; width: 100%;}
  941.             .rightProductSide {min-height: unset;}
  942.             .leftProductSide .search-articleimage-placeholder {height: 450px;}
  943.             .leftProductSide .gallery-slider-row.is-loading {height: 450px;}
  944.             .filter-multi-select-list {max-width: 300px;}
  946.             #Headernavigation {z-index: 51!important;}
  947.             .cart-item-quantity { order: 0!important;}
  949.             .search-suggest-container {left: 0;box-sizing: border-box !important;padding-left: 0; width: max-content;}
  951.             #overlaycontent {width: calc(100% - 100px);}
  954.             .product-detail-cross-selling .product-slider-controls-prev {left: -15px;}
  955.             .product-detail-cross-selling .product-image.is-standard{max-width: 170px;}
  956.             .product-detail-cross-selling .product-image-wrapper {right: 35px;}
  959.             .checkout-additional {max-width: 100%!important;}
  960.             .checkout-aside.checkout-aside-no-offset {max-width: 100%!important;}
  963.             .account-register #AddressSelection .firstgriditem {width: 100%;}
  964.             .account-register #AddressSelection .billpickitem {width: calc(50% - 10px);}
  965.             .account-register #AddressSelection .deliverypickitem {width: calc(50% - 10px);}
  969.         }
  972.         /* NEU
  974.         .product-image.is-standard, .product-image.is-cover, .product-image.is-contain {
  975.             width: 100%;
  976.             height: 100%;
  977.             max-height: 290px;
  978.         }
  980.         */
  984.         #heandlerreg {width: 100%;text-align: center;margin-top: 15px;}
  988.     </style>
  990.     <script src="{{ absolute_url(asset('bundles/theme3s/js/jquery.min.js')) }}"></script>
  993.     <div id="Headernavigation">
  995.         {% if page.header.activeLanguage.translationCode.code == 'en-GB' %}
  997.             {% sw_include '@Storefront/storefront/layout/header/header-navigation-en.html.twig' %}
  999.         {% elseif page.header.activeLanguage.translationCode.code == 'nl-NL'  %}
  1001.             {% sw_include '@Storefront/storefront/layout/header/header-navigation-nl.html.twig' %}
  1003.         {% elseif page.header.activeLanguage.translationCode.code == 'es-ES'  %}
  1005.             {% sw_include '@Storefront/storefront/layout/header/header-navigation-es.html.twig' %}
  1007.         {% elseif page.header.activeLanguage.translationCode.code == 'fr-FR'  %}
  1009.             {% sw_include '@Storefront/storefront/layout/header/header-navigation-fr.html.twig' %}
  1011.         {% elseif page.header.activeLanguage.translationCode.code == 'it-IT'  %}
  1013.             {% sw_include '@Storefront/storefront/layout/header/header-navigation-it.html.twig' %}
  1015.         {% else %}
  1017.             {% sw_include '@Storefront/storefront/layout/header/header-navigation-de.html.twig' %}
  1019.         {% endif %}
  1022.     </div>
  1027.     <div id="ShopIcons">
  1029.         <div id="ShopIconInner">
  1031.             {% block layout_header_navigation_toggle_tablet %}
  1032.                 <div class="nav-main-toggle">
  1033.                     {% block layout_header_navigation_toggle_tablet_button %}
  1034.                         <button class="btn nav-main-toggle-btn header-actions-btn"
  1035.                                 type="button"
  1036.                                 data-offcanvas-menu="true"
  1037.                                 aria-label="{{ "general.menuLink"|trans|striptags }}">
  1038.                             {% block layout_header_navigation_toggle_tablet_button_icon %}
  1039.                                 {% sw_icon 'stack' %}
  1040.                             {% endblock %}
  1041.                         </button>
  1042.                     {% endblock %}
  1043.                 </div>
  1044.             {% endblock %}
  1047.             <!-- WARENKORB -->
  1048.             {% block layout_header_actions_cart %}
  1050.                     <div class="header-cart"
  1051.                          data-offcanvas-cart="true">
  1053.                         <div id="cartcontainer">
  1054.                             <a class="btn header-cart-btn header-actions-btn"
  1055.                                href="{{ path('frontend.checkout.cart.page') }}"
  1056.                                data-cart-widget="true"
  1057.                                title="{{ 'checkout.cartTitle'|trans|striptags }}"
  1058.                                aria-label="{{ 'checkout.cartTitle'|trans|striptags }}">
  1059.                                 {% sw_include '@Storefront/storefront/layout/header/actions/cart-widget.html.twig' %}
  1060.                             </a>
  1061.                         </div>
  1063.                     </div>
  1065.             {% endblock %}
  1070.             <!-- BENUTEZR -->
  1071.             {% block layout_header_actions_account %}
  1072.                 <div id="account-options">
  1073.                     <div class="account-menu">
  1074.                         {% sw_include '@Storefront/storefront/layout/header/actions/account-widget.html.twig' %}
  1075.                     </div>
  1076.                 </div>
  1077.             {% endblock %}
  1083.         </div>
  1087.     </div>
  1092. {% endblock %}