PageSourceSearch

https://www.boxsys.de/calculation/index/index/product_id/boxsys_fs_sb/

html boxsys.de collected 2026-10-06 16:17:55 UTC 321,246 bytes, 4,666 lines download raw bytes

1<!doctype html>
2<html lang="de">
3    <head >
4        
4<script>
5    var LOCALE = 'de\u002DDE';
6    var BASE_URL = 'https\u003A\u002F\u002Fwww.boxsys.de\u002F';
7    var require = {
8        'baseUrl': 'https\u003A\u002F\u002Fwww.boxsys.de\u002Fstatic\u002Fversion1790068900\u002Ffrontend\u002FBoxsys\u002Fblank_child\u002Fde_DE'
9    };</script>
9        <meta charset="utf-8"/>
10<meta name="title" content="Konfiguration: Faltschachtel mit Steckboden"/>
11<meta name="robots" content="NOINDEX,NOFOLLOW"/>
12<meta name="viewport" content="width=device-width, initial-scale=1"/>
13<meta name="format-detection" content="telephone=no"/>
14<title>Konfiguration: Faltschachtel mit Steckboden</title>
15<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/mage/calendar.css" />
16<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/styles-m.css" />
17<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/custom.css" />
18<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/bootstrap-grid.min.css" />
19<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/owl.carousel.css" />
20<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/font-awesome.min.css" />
21<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/jquery/uppy/dist/uppy-custom.css" />
22<link  rel="stylesheet" type="text/css"  media="all" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/Boxsys_Calculation/css/product-config.css" />
23<link  rel="stylesheet" type="text/css"  media="screen and (min-width: 768px)" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/styles-l.css" />
24<link  rel="stylesheet" type="text/css"  media="print" href="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/css/print.css" />
25<link  rel="stylesheet" type="text/css"  media="all" href="https://use.typekit.net/fhv8igl.css" />
26<script  type="text/javascript"  src="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/requirejs/require.min.js"></script>
vendor: 1 bytes, line 26
26
27<script  type="text/javascript"  src="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/requirejs-min-resolver.min.js"></script>
vendor: 1 bytes, line 27
27
28<script  type="text/javascript"  src="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/mage/requirejs/mixins.min.js"></script>
vendor: 1 bytes, line 28
28
29<script  type="text/javascript"  src="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/requirejs-config.min.js"></script>
vendor: 1 bytes, line 29
29
30<script  type="text/javascript"  src="https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/js/main.min.js"></script>
30
31<link  rel="canonical" href="https://www.boxsys.de/calculation/index/index/product_id/boxsys_fs_sb/" />
32<link  rel="icon" type="image/x-icon" href="https://www.boxsys.de/media/favicon/default/boxsys-favicon.png" />
33<link  rel="shortcut icon" type="image/x-icon" href="https://www.boxsys.de/media/favicon/default/boxsys-favicon.png" />
34                
34<script>
35        window.getWpGA4Cookie = function(name) {
36            match = document.cookie.match(new RegExp(name + '=([^;]+)'));
37            if (match) return decodeURIComponent(match[1].replace(/\+/g, ' ')) ;
38        };
39
40        window.dataLayer = window.dataLayer || [];
41                var dl4Objects = [{"pageName":"Konfiguration: Faltschachtel mit Steckboden","pageType":"product","ecommerce":{"currency":"EUR","value":0.16,"items":[{"item_name":"Faltschachtel mit Steckboden ","affiliation":"Boxsys Website - Boxsys Store - Boxsys Default Store View","item_id":"2","price":0.16,"item_category":"Sortiment","item_category2":"Faltschachteln","item_category3":"mit Steckboden","item_list_name":"Sortiment\/Faltschachteln\/mit Steckboden","item_list_id":"21","item_stock_status":"In stock","item_sale_product":"No","item_reviews_count":"0","item_reviews_score":"0"}]},"event":"view_item"}];
42        for (var i in dl4Objects) {
43            window.dataLayer.push({ecommerce: null});
44            window.dataLayer.push(dl4Objects[i]);
45        }
46                var wpGA4Cookies = ['wp_ga4_user_id','wp_ga4_customerGroup'];
47        wpGA4Cookies.map(function(cookieName) {
48            var cookieValue = window.getWpGA4Cookie(cookieName);
49            if (cookieValue) {
50                var dl4Object = {};
51                dl4Object[cookieName.replace('wp_ga4_', '')] = cookieValue;
52                window.dataLayer.push(dl4Object);
53            }
54        });
55    </script>
55
56
57    <!-- Google Tag Manager -->
58<script>
vendor: 331 bytes, lines 58-62
58(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
59new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
60j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
61'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
62})(window,document,'script','dataLayer','
62GTM-TXHJFDG
vendor: 3 bytes, line 62
62');
62</script>
62
63<!-- End Google Tag Manager -->    
63<script type="text/x-magento-init">
64        {
65            "*": {
66                "Magento_PageCache/js/form-key-provider": {
67                    "isPaginationCacheEnabled":
68                        0                }
69            }
70        }
71    </script>
71
72    </head>
73    <body data-container="body"
74          data-mage-init='{"loaderAjax": {}, "loader": { "icon": "https://www.boxsys.de/static/version1790068900/frontend/Boxsys/blank_child/de_DE/images/loader-2.gif"}}'
75        id="html-body" class="calculation-index-index page-layout-1column">
76        <!-- Google Tag Manager (noscript) -->
vendor: 69 bytes, lines 76-77
76
77<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
77GTM-TXHJFDG
vendor: 85 bytes, lines 77-78
77"
78height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
79<!-- End Google Tag Manager (noscript) -->
80<script type="text/x-magento-init">
81    {
82        "*": {
83            "Magento_PageBuilder/js/widget-initializer": {
84                "config": {"[data-content-type=\"slider\"][data-appearance=\"default\"]":{"Magento_PageBuilder\/js\/content-type\/slider\/appearance\/default\/widget":false},"[data-content-type=\"map\"]":{"Magento_PageBuilder\/js\/content-type\/map\/appearance\/default\/widget":false},"[data-content-type=\"row\"]":{"Magento_PageBuilder\/js\/content-type\/row\/appearance\/default\/widget":false},"[data-content-type=\"tabs\"]":{"Magento_PageBuilder\/js\/content-type\/tabs\/appearance\/default\/widget":false},"[data-content-type=\"slide\"]":{"Magento_PageBuilder\/js\/content-type\/slide\/appearance\/default\/widget":{"buttonSelector":".pagebuilder-slide-button","showOverlay":"hover","dataRole":"slide"}},"[data-content-type=\"banner\"]":{"Magento_PageBuilder\/js\/content-type\/banner\/appearance\/default\/widget":{"buttonSelector":".pagebuilder-banner-button","showOverlay":"hover","dataRole":"banner"}},"[data-content-type=\"buttons\"]":{"Magento_PageBuilder\/js\/content-type\/buttons\/appearance\/inline\/widget":false},"[data-content-type=\"products\"][data-appearance=\"carousel\"]":{"Magento_PageBuilder\/js\/content-type\/products\/appearance\/carousel\/widget":false}},
85                "breakpoints": {"desktop":{"label":"Desktop","stage":true,"default":true,"class":"desktop-switcher","icon":"Magento_PageBuilder::css\/images\/switcher\/switcher-desktop.svg","conditions":{"min-width":"1024px"},"options":{"products":{"default":{"slidesToShow":"5"}}}},"tablet":{"conditions":{"max-width":"1024px","min-width":"768px"},"options":{"products":{"default":{"slidesToShow":"4"},"continuous":{"slidesToShow":"3"}}}},"mobile":{"label":"Mobile","stage":true,"class":"mobile-switcher","icon":"Magento_PageBuilder::css\/images\/switcher\/switcher-mobile.svg","media":"only screen and (max-width: 768px)","conditions":{"max-width":"768px","min-width":"640px"},"options":{"products":{"default":{"slidesToShow":"3"}}}},"mobile-small":{"conditions":{"max-width":"640px"},"options":{"products":{"default":{"slidesToShow":"2"},"continuous":{"slidesToShow":"1"}}}}}            }
86        }
87    }
88</script>
88
89
90<div class="cookie-status-message" id="cookie-status">
91    The store will not work correctly when cookies are disabled.</div>
92<script type="text&#x2F;javascript">document.querySelector("#cookie-status").style.display = "none";</script>
vendor: 1 bytes, line 92
92
93<script type="text/x-magento-init">
94    {
95        "*": {
96            "cookieStatus": {}
97        }
98    }
99</script>
99
100
101<script type="text/x-magento-init">
102    {
103        "*": {
104            "mage/cookies": {
105                "expires": null,
106                "path": "\u002F",
107                "domain": ".www.boxsys.de",
108                "secure": true,
109                "lifetime": "3600"
110            }
111        }
112    }
113</script>
113
114    <noscript>
115        <div class="message global noscript">
116            <div class="content">
117                <p>
118                    <strong>JavaScript scheint in Ihrem Browser deaktiviert zu sein.</strong>
119                    <span>
120                        Um unsere Website in bester Weise zu erfahren, aktivieren Sie Javascript in Ihrem Browser.                    </span>
121                </p>
122            </div>
123        </div>
124    </noscript>
125
126<script>
127    window.cookiesConfig = window.cookiesConfig || {};
128    window.cookiesConfig.secure = true;
129</script>
129<script>    require.config({
130        map: {
131            '*': {
132                wysiwygAdapter: 'mage/adminhtml/wysiwyg/tiny_mce/tinymceAdapter'
133            }
134        }
135    });</script>
135<script>    require.config({
136        paths: {
137            googleMaps: 'https\u003A\u002F\u002Fmaps.googleapis.com\u002Fmaps\u002Fapi\u002Fjs\u003Fv\u003D3.53\u0026key\u003D'
138        },
139        config: {
140            'Magento_PageBuilder/js/utils/map': {
141                style: '',
142            },
143            'Magento_PageBuilder/js/content-type/map/preview': {
144                apiKey: '',
145                apiKeyErrorMessage: 'You\u0020must\u0020provide\u0020a\u0020valid\u0020\u003Ca\u0020href\u003D\u0027https\u003A\u002F\u002Fwww.boxsys.de\u002Fadminhtml\u002Fsystem_config\u002Fedit\u002Fsection\u002Fcms\u002F\u0023cms_pagebuilder\u0027\u0020target\u003D\u0027_blank\u0027\u003EGoogle\u0020Maps\u0020API\u0020key\u003C\u002Fa\u003E\u0020to\u0020use\u0020a\u0020map.'
146            },
147            'Magento_PageBuilder/js/form/element/map': {
148                apiKey: '',
149                apiKeyErrorMessage: 'You\u0020must\u0020provide\u0020a\u0020valid\u0020\u003Ca\u0020href\u003D\u0027https\u003A\u002F\u002Fwww.boxsys.de\u002Fadminhtml\u002Fsystem_config\u002Fedit\u002Fsection\u002Fcms\u002F\u0023cms_pagebuilder\u0027\u0020target\u003D\u0027_blank\u0027\u003EGoogle\u0020Maps\u0020API\u0020key\u003C\u002Fa\u003E\u0020to\u0020use\u0020a\u0020map.'
150            },
151        }
152    });</script>
152<script>
153    require.config({
154        shim: {
155            'Magento_PageBuilder/js/utils/map': {
156                deps: ['googleMaps']
157            }
158        }
159    });</script>
vendor: 1 bytes, line 159
159
160<script>    var et_pagename = 'Konfiguration%3A%20Faltschachtel%20mit%20Steckboden%2C%20product-boxsys_fs_sb';
161    var et_areas = '%2Fcalculation%2Findex%2Findex%2Fproduct_id%2Fboxsys_fs_sb';
162    var _etr = { debugMode :false };</script>
162
163
164<script id="_etLoader"
165        charset="UTF-8"
166        data-block-cookies="true"
167        data-secure-code="zQbWEb"
168        src="//code.etracker.com/code/e.js"
169        data-plugin-version="Magento2_1.7.3"
170        async>
171</script>
171
172
173<script type="text&#x2F;x-magento-init">{
174    "*": {
175        "Etracker_Etracker/js/etracker": {
176        }
177    }
178}</script>
178
179<div class="page-wrapper"><header class="page-header"><div class="panel wrapper"><div class="panel header"><ul class="header links"><li class="link my-account-link">
180    <a href="https://www.boxsys.de/customer/account/">
181        <span>Mein Konto</span>
182    </a>
183</li>
184
185</ul><a class="action skip contentarea"
186   href="#contentarea">
187    <span>
188        Direkt zum Inhalt    </span>
189</a>
190<div class="block block-search">
191    <div class="block block-title"><strong>Suche</strong></div>
192    <div class="block block-content">
193        <form class="form minisearch" id="search_mini_form"
194              action="https://www.boxsys.de/catalogsearch/result/" method="get">
195                        <div class="field search">
196                <label class="label" for="search" data-role="minisearch-label">
197                    <span>Suche</span>
198                </label>
199                <div class="control">
200                    <input id="search"
201                           data-mage-init='{
202                            "quickSearch": {
203                                "formSelector": "#search_mini_form",
204                                "url": "https://www.boxsys.de/search/ajax/suggest/",
205                                "destinationSelector": "#search_autocomplete",
206                                "minSearchLength": "3"
207                            }
208                        }'
209                           type="text"
210                           name="q"
211                           value=""
212                           placeholder="Hier&#x20;den&#x20;ganzen&#x20;Shop&#x20;durchsuchen..."
213                           class="input-text"
214                           maxlength="128"
215                           role="combobox"
216                           aria-haspopup="false"
217                           aria-autocomplete="both"
218                           autocomplete="off"
219                           aria-expanded="false"/>
220                    <div id="search_autocomplete" class="search-autocomplete"></div>
221                    <div class="nested">
222    <a class="action advanced" href="https://www.boxsys.de/catalogsearch/advanced/" data-action="advanced-search">
223        Erweiterte Suche    </a>
224</div>
225                </div>
226            </div>
227            <div class="actions">
228                <button type="submit"
229                        title="Suche"
230                        class="action search"
231                        aria-label="Search"
232                >
233                    <span>Suche</span>
234                </button>
235            </div>
236        </form>
237    </div>
238</div>
239
240<div data-block="minicart" class="minicart-wrapper">
241    <a class="action showcart" href="https://www.boxsys.de/checkout/cart/"
242       data-bind="scope: 'minicart_content'">
243        <span class="text">Mein Warenkorb</span>
244        <span class="counter qty empty"
245              data-bind="css: { empty: !!getCartParam('summary_count') == false && !isLoading() },
246               blockLoader: isLoading">
247            <span class="counter-number">
248                <!-- ko if: getCartParam('summary_count') -->
249                <!-- ko text: getCartParam('summary_count').toLocaleString(window.LOCALE) --><!-- /ko -->
250                <!-- /ko -->
251            </span>
252            <span class="counter-label">
253            <!-- ko if: getCartParam('summary_count') -->
254                <!-- ko text: getCartParam('summary_count').toLocaleString(window.LOCALE) --><!-- /ko -->
255                <!-- ko i18n: 'items' --><!-- /ko -->
256            <!-- /ko -->
257            </span>
258        </span>
259    </a>
260            <div class="block block-minicart"
261             data-role="dropdownDialog"
262             data-mage-init='{"dropdownDialog":{
263                "appendTo":"[data-block=minicart]",
264                "triggerTarget":".showcart",
265                "timeout": "2000",
266                "closeOnMouseLeave": false,
267                "closeOnEscape": true,
268                "triggerClass":"active",
269                "parentClass":"active",
270                "buttons":[]}}'>
271            <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
272                <!-- ko template: getTemplate() --><!-- /ko -->
273            </div>
274                    </div>
275        
275<script>window.checkout = {"shoppingCartUrl":"https:\/\/www.boxsys.de\/checkout\/cart\/","checkoutUrl":"https:\/\/www.boxsys.de\/checkout\/","updateItemQtyUrl":"https:\/\/www.boxsys.de\/checkout\/sidebar\/updateItemQty\/","removeItemUrl":"https:\/\/www.boxsys.de\/checkout\/sidebar\/removeItem\/","imageTemplate":"Magento_Catalog\/product\/image_with_borders","baseUrl":"https:\/\/www.boxsys.de\/","minicartMaxItemsVisible":5,"websiteId":"1","maxItemsToDisplay":10,"storeId":"1","storeGroupId":"1","customerLoginUrl":"https:\/\/www.boxsys.de\/customer\/account\/login\/referer\/aHR0cHM6Ly93d3cuYm94c3lzLmRlL2NhbGN1bGF0aW9uL2luZGV4L2luZGV4L3Byb2R1Y3RfaWQvYm94c3lzX2ZzX3NiLw~~\/","isRedirectRequired":false,"autocomplete":"off","captcha":{"user_login":{"isCaseSensitive":false,"imageHeight":50,"imageSrc":"","refreshUrl":"https:\/\/www.boxsys.de\/captcha\/refresh\/","isRequired":false,"timestamp":1791303474}}}</script>
275    
275<script type="text/x-magento-init">
276    {
277        "[data-block='minicart']": {
278            "Magento_Ui/js/core/app": {"components":{"minicart_content":{"children":{"subtotal.container":{"children":{"subtotal":{"children":{"subtotal.totals":{"config":{"display_cart_subtotal_incl_tax":0,"display_cart_subtotal_excl_tax":1,"template":"Magento_Tax\/checkout\/minicart\/subtotal\/totals"},"children":{"subtotal.totals.msrp":{"component":"Magento_Msrp\/js\/view\/checkout\/minicart\/subtotal\/totals","config":{"displayArea":"minicart-subtotal-hidden","template":"Magento_Msrp\/checkout\/minicart\/subtotal\/totals"}}},"component":"Magento_Tax\/js\/view\/checkout\/minicart\/subtotal\/totals"}},"component":"uiComponent","config":{"template":"Magento_Checkout\/minicart\/subtotal"}}},"component":"uiComponent","config":{"displayArea":"subtotalContainer"}},"item.renderer":{"component":"Magento_Checkout\/js\/view\/cart-item-renderer","config":{"displayArea":"defaultRenderer","template":"Magento_Checkout\/minicart\/item\/default"},"children":{"item.image":{"component":"Magento_Catalog\/js\/view\/image","config":{"template":"Magento_Catalog\/product\/image","displayArea":"itemImage"}},"checkout.cart.item.price.sidebar":{"component":"uiComponent","config":{"template":"Magento_Checkout\/minicart\/item\/price","displayArea":"priceSidebar"}}}},"extra_info":{"component":"uiComponent","config":{"displayArea":"extraInfo"}},"promotion":{"component":"uiComponent","config":{"displayArea":"promotion"}}},"config":{"itemRenderer":{"default":"defaultRenderer","simple":"defaultRenderer","virtual":"defaultRenderer"},"template":"Magento_Checkout\/minicart\/content"},"component":"Magento_Checkout\/js\/view\/minicart"}},"types":[]}        },
279        "*": {
280            "Magento_Ui/js/block-loader": "https\u003A\u002F\u002Fwww.boxsys.de\u002Fstatic\u002Fversion1790068900\u002Ffrontend\u002FBoxsys\u002Fblank_child\u002Fde_DE\u002Fimages\u002Floader\u002D1.gif"
281        }
282    }
283    </script>
283
284</div>
285<script>
286    window.addEventListener('load', function () {
287        require(['Magento_Customer/js/customer-data', 'domReady!'], function (customerData) {
288            var sections = ['cart'];
289            customerData.initStorage();
290            customerData.invalidate(sections);
291            customerData.reload(sections, true);
292        });
293    });
294</script>
294
295</div></div><div class="header content"><span data-action="toggle-nav" class="action nav-toggle"><span>Navigation umschalten</span></span>
296<a
297    class="logo"
298    href="https://www.boxsys.de/"
299    title="BOXSYS,&#x20;die&#x20;Online-Druckerei&#x20;f&#xFC;r&#x20;Aufsteller&#x20;und&#x20;Verpackungen"
300    aria-label="store logo">
301    <img src="https://www.boxsys.de/media/logo/stores/1/boxsys_logo_400px.png"
302         title="BOXSYS,&#x20;die&#x20;Online-Druckerei&#x20;f&#xFC;r&#x20;Aufsteller&#x20;und&#x20;Verpackungen"
303         alt="BOXSYS,&#x20;die&#x20;Online-Druckerei&#x20;f&#xFC;r&#x20;Aufsteller&#x20;und&#x20;Verpackungen"
304            width="450"            height="52"    />
305</a>
306</div></header>    <div class="sections nav-sections">
307                <div class="section-items nav-sections-items"
308             data-mage-init='{"tabs":{"openedState":"active"}}'>
309                                            <div class="section-item-title nav-sections-item-title"
310                     data-role="collapsible">
311                    <a class="nav-sections-item-switch"
312                       data-toggle="switch" href="#store.menu">
313                        Menü                    </a>
314                </div>
315                <div class="section-item-content nav-sections-item-content"
316                     id="store.menu"
317                     data-role="content">
318                    
319<nav class="navigation" data-action="navigation">
320    <ul data-mage-init='{"menu":{"responsive":true, "expanded":true, "position":{"my":"left top","at":"left bottom"}}}'>
321        <li  class="level0 nav-1 category-item first level-top parent"><a href="https://www.boxsys.de/sortiment.html"  class="level-top" ><span>Sortiment</span></a><ul class="level0 submenu"><li  class="level1 nav-1-1 category-item first parent"><img src="/media/boxsys/topmenu/box-sort1.webp" alt="Verpackungen" loading="lazy" style="width: 60% !important;"/><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung.html" ><span>Verpackungen</span></a><ul class="level1 submenu"><li  class="level2 nav-1-1-1 category-item first"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/versandkartons-bedrucken.html" ><span>Versandkartons</span></a></li><li  class="level2 nav-1-1-2 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/wellpappverpackungen.html" ><span>Wellpappverpackungen</span></a></li><li  class="level2 nav-1-1-3 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/klappdeckelkartons.html" ><span>Klappdeckelkartons</span></a></li><li  class="level2 nav-1-1-4 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/stuelpdeckelkartons.html" ><span>Stülpdeckelkartons</span></a></li><li  class="level2 nav-1-1-5 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/schiebeschachteln.html" ><span>Schiebeschachteln</span></a></li><li  class="level2 nav-1-1-6 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/schuber.html" ><span>Schuber</span></a></li><li  class="level2 nav-1-1-7 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/banderolen.html" ><span>Banderolen</span></a></li><li  class="level2 nav-1-1-8 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/geschenkverpackung.html" ><span>Geschenkverpackungen</span></a></li><li  class="level2 nav-1-1-9 category-item"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/einsaetze-inlays-polster-fuellstuecke.html" ><span>Einsätze / Inlays / Polster / Füllstücke</span></a></li><li  class="level2 nav-1-1-10 category-item last"><a href="https://www.boxsys.de/sortiment/nachhaltige-verpackung/koffer-trageverpackung-verpackung-mit-griff.html" ><span>Koffer / Trageverpackung / Verpackung mit Griff</span></a></li></ul></li><li  class="level1 nav-1-2 category-item parent"><img src="/media/boxsys/topmenu/box-sort2.webp"  alt="Faltschachteln" loading="lazy" style="width: 60% !important;"/><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass.html" ><span>Faltschachteln</span></a><ul class="level1 submenu"><li  class="level2 nav-1-2-1 category-item first"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachteln-mit-steckboden.html" ><span>mit Steckboden</span></a></li>
321<li  class="level2 nav-1-2-2 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/automatikboden-karton.html" ><span>mit Automatikboden</span></a></li><li  class="level2 nav-1-2-3 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachtel-mit-einstecklaschen.html" ><span>mit Einstecklaschen</span></a></li><li  class="level2 nav-1-2-4 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/versetzten-einstecklaschen.html" ><span>mit versetzten Einstecklaschen</span></a></li><li  class="level2 nav-1-2-5 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/eurolochaufhaenger.html" ><span>mit Steckboden und Eurolochaufhängung</span></a></li><li  class="level2 nav-1-2-6 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/eurolochaufhaenger-karton.html" ><span>mit Automatikboden und Eurolochaufhängung</span></a></li><li  class="level2 nav-1-2-7 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachteln-mit-einstecklaschen-und-eurolochaufhangung.html" ><span>mit Einstecklaschen und Eurolochaufhängung</span></a></li><li  class="level2 nav-1-2-8 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/eurolochaufhaenger-pappe.html" ><span>mit versetzten Einstecklaschen und Eurolochaufhängung</span></a></li><li  class="level2 nav-1-2-9 category-item"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachteln-mit-tragegriff.html" ><span>Faltschachteln mit Tragegriff</span></a></li><li  class="level2 nav-1-2-10 category-item last"><a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachteln-mit-eurolochaufhaengung.html" ><span>Faltschachteln mit Eurolochaufhängung</span></a></li></ul></li><li  class="level1 nav-1-3 category-item parent"><img src="/media/boxsys/topmenu/box-sort3.webp"  alt="Aufsteller" loading="lazy" style="width: 60% !important;"/><a href="https://www.boxsys.de/sortiment/pos-displays.html" ><span>POS / Displays</span></a><ul class="level1 submenu"><li  class="level2 nav-1-3-1 category-item first"><a href="https://www.boxsys.de/sortiment/pos-displays/aufsteller-bedrucken.html" ><span>Zwei- und dreidimensionale Aufsteller</span></a></li><li  class="level2 nav-1-3-2 category-item"><a href="https://www.boxsys.de/sortiment/pos-displays/prospektstaender.html" ><span>Flyerständer / Prospektständer</span></a></li><li  class="level2 nav-1-3-3 category-item"><a href="https://www.boxsys.de/sortiment/pos-displays/losboxen-bedrucken.html" ><span>Losboxen / Einwurfboxen / Wahlurnen</span></a></li><li  class="level2 nav-1-3-4 category-item"><a href="https://www.boxsys.de/sortiment/pos-displays/thekendisplays-trays-schuetten.html" ><span>Thekendisplays / Trays / Schütten</span></a></li><li  class="level2 nav-1-3-5 category-item"><a href="https://www.boxsys.de/sortiment/pos-displays/werbeschilder.html" ><span>Werbeschilder / Deckenhänger / Regalwobbler</span></a></li><li  class="level2 nav-1-3-6 category-item last"><a href="https://www.boxsys.de/sortiment/pos-displays/spendenboxen.html" ><span>Spendenboxen</span></a></li></ul></li><li  class="level1 nav-1-4 category-item last parent"><img src="/media/boxsys/topmenu/box-sort4.webp"  alt="Boxen für Experten" loading="lazy" style="width: 60% !important;"/><a href="https://www.boxsys.de/sortiment/karton-individuell-gestalten.html" ><span>Boxen für Experten</span></a><ul class="level1 submenu"><li  class="level2 nav-1-4-1 category-item first"><a href="https://www.boxsys.de/sortiment/karton-individuell-gestalten/fefco.html" ><span>FEFCO-Verpackungen</span></a></li><li  class="level2 nav-1-4-2 category-item last"><a href="https://www.boxsys.de/sortiment/karton-individuell-gestalten/ecma-faltschachtel.html" ><span>Ecma-Faltschachteln</span></a></li></ul></li></ul></li><li  class="level0 nav-2 category-item level-top"><a href="https://www.boxsys.de/ueber-boxsys.html"  class="level-top" ><span>Über Boxsys</span></a></li><li  class="level0 nav-3 category-item level-top"><a href="https://www.boxsys.de/inspirationen.html"  class="level-top" ><span>Inspirationen</span></a></li>
321<li  class="level0 nav-4 category-item level-top"><a href="https://www.boxsys.de/nachhaltigkeit.html"  class="level-top" ><span>Nachhaltigkeit</span></a></li><li  class="level0 nav-5 category-item level-top parent"><a href="https://www.boxsys.de/service.html"  class="level-top" ><span>Service</span></a><ul class="level0 submenu"><li  class="level1 nav-5-1 category-item first"><a href="/blog/"><img src="/media/boxsys/topmenu/boxsys-blog-2.webp" alt="BOXSYS Wiki" loading="lazy" style="width: 40% !important;"/></a><a href="https://www.boxsys.de/blog/" ><span>Blog</span></a></li><li  class="level1 nav-5-2 category-item"><a href="/service/boxsys-wiki.html"><img src="/media/boxsys/topmenu/boxsys-wiki.webp" alt="BOXSYS Wiki" loading="lazy" style="width: 40% !important;"/></a><a href="https://www.boxsys.de/service/boxsys-wiki.html" ><span>Wiki</span></a></li><li  class="level1 nav-5-3 category-item"><a href="/service/faq.html"><img src="/media/boxsys/topmenu/boxsys-faq.webp"  alt="BOXSYS FAQ" loading="lazy" style="width: 40% !important;"/></a><a href="https://www.boxsys.de/service/faq.html" ><span>FAQ</span></a></li><li  class="level1 nav-5-4 category-item"><a href="/service/druckdaten.html"><img src="/media/boxsys/topmenu/boxsys-druck.webp"  alt="BOXSYS Druckdaten" loading="lazy" style="width: 40% !important;"/></a><a href="https://www.boxsys.de/service/druckdaten.html" ><span>Druckdaten</span></a></li><li  class="level1 nav-5-5 category-item last"><a href="/service/online-beratung.html"><img src="/media/boxsys/topmenu/boxsys-beratung.webp"  alt="BOXSYS Onlineberatung" loading="lazy" style="width: 40% !important;"/></a><a href="https://www.boxsys.de/service/online-beratung.html" ><span>Online-Beratung</span></a></li></ul></li><li  class="level0 nav-6 category-item last level-top"><a href="https://www.boxsys.de/kontakt.html"  class="level-top" ><span>Kontakt</span></a></li>            </ul>
322</nav>
323                </div>
324                                            <div class="section-item-title nav-sections-item-title"
325                     data-role="collapsible">
326                    <a class="nav-sections-item-switch"
327                       data-toggle="switch" href="#store.links">
328                        Konto                    </a>
329                </div>
330                <div class="section-item-content nav-sections-item-content"
331                     id="store.links"
332                     data-role="content">
333                    <!-- Account links -->                </div>
334                                    </div>
335    </div>
336    <div class="breadcrumbs">
337        <ul class="items">
338                            <li class="item 0">
339                                            <a href="https://www.boxsys.de/" title="Zur Homepage">
340                            Home                        </a>
341                                    </li>
342                            <li class="item category3">
343                                            <a href="https://www.boxsys.de/sortiment.html" title="Sortiment">
344                            Sortiment                        </a>
345                                    </li>
346                            <li class="item category9">
347                                            <a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass.html" title="Faltschachteln">
348                            Faltschachteln                        </a>
349                                    </li>
350                            <li class="item category21">
351                                            <a href="https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachteln-mit-steckboden.html" title="mit Steckboden">
352                            mit Steckboden                        </a>
353                                    </li>
354                            <li class="item product">
355                                            <a href="https://www.boxsys.de/faltschachtel-mit-steckboden.html" title="Faltschachtel mit Steckboden ">
356                            Faltschachtel mit Steckboden                         </a>
357                                    </li>
358                            <li class="item calculation">
359                                            <strong>Konfiguration</strong>
360                                    </li>
361                    </ul>
362    </div>
363<!-- Boxsys_Calculation -->
364<script type="application/ld+json">
365        {
366            "@context": "https://schema.org",
367            "@type": "BreadcrumbList",
368            "itemListElement":
369            [
370                
371            {
372                "@type": "ListItem",
373                "position": 1,
374                "name": "Home",
375                "item": "https://www.boxsys.de/"
376            },
377            {
378                "@type": "ListItem",
379                "position": 2,
380                "name": "Sortiment",
381                "item": "https://www.boxsys.de/sortiment.html"
382            },
383            {
384                "@type": "ListItem",
385                "position": 3,
386                "name": "Faltschachteln",
387                "item": "https://www.boxsys.de/sortiment/faltschachtel-nach-mass.html"
388            },
389            {
390                "@type": "ListItem",
391                "position": 4,
392                "name": "mit Steckboden",
393                "item": "https://www.boxsys.de/sortiment/faltschachtel-nach-mass/faltschachteln-mit-steckboden.html"
394            },
395            {
396                "@type": "ListItem",
397                "position": 5,
398                "name": "Faltschachtel mit Steckboden ",
399                "item": "https://www.boxsys.de/faltschachtel-mit-steckboden.html"
400            },
401            {
402                "@type": "ListItem",
403                "position": 6,
404                "name": "Konfiguration"
405                
406            }            ]
407}
408</script>
408
409<main id="maincontent" class="page-main"><a id="contentarea" tabindex="-1"></a>
410    <div class="page-title-wrapper">
411        <h1 class="page-title"
412                        >
413            <span class="base" data-ui-id="page-title-wrapper" >Konfiguration: Faltschachtel mit Steckboden  </span>        </h1>
414            </div>
415<div class="page messages"><div data-placeholder="messages"></div>
416<div data-bind="scope: 'messages'">
417    <!-- ko if: cookieMessagesObservable() && cookieMessagesObservable().length > 0 -->
418    <div aria-atomic="true" role="alert" class="messages" data-bind="foreach: {
419        data: cookieMessagesObservable(), as: 'message'
420    }">
421        <div data-bind="attr: {
422            class: 'message-' + message.type + ' ' + message.type + ' message',
423            'data-ui-id': 'message-' + message.type
424        }">
425            <div data-bind="html: $parent.prepareMessageForHtml(message.text)"></div>
426        </div>
427    </div>
428    <!-- /ko -->
429
430    <div aria-atomic="true" role="alert" class="messages" data-bind="foreach: {
431        data: messages().messages, as: 'message'
432    }, afterRender: purgeMessages">
433        <div data-bind="attr: {
434            class: 'message-' + message.type + ' ' + message.type + ' message',
435            'data-ui-id': 'message-' + message.type
436        }">
437            <div data-bind="html: $parent.prepareMessageForHtml(message.text)"></div>
438        </div>
439    </div>
440</div>
441
442<script type="text/x-magento-init">
443    {
444        "*": {
445            "Magento_Ui/js/core/app": {
446                "components": {
447                        "messages": {
448                            "component": "Magento_Theme/js/view/messages"
449                        }
450                    }
451                }
452            }
453    }
454</script>
454
455</div><div class="columns"><div class="column main"><input name="form_key" type="hidden" value="e1pawflSdLlOCitA" /><div id="authenticationPopup" data-bind="scope:'authenticationPopup', style: {display: 'none'}">
456        
456<script>window.authenticationPopup = {"autocomplete":"off","customerRegisterUrl":"https:\/\/www.boxsys.de\/customer\/account\/create\/","customerForgotPasswordUrl":"https:\/\/www.boxsys.de\/customer\/account\/forgotpassword\/","baseUrl":"https:\/\/www.boxsys.de\/","customerLoginUrl":"https:\/\/www.boxsys.de\/customer\/ajax\/login\/"}</script>
456    <!-- ko template: getTemplate() --><!-- /ko -->
457        
457<script type="text/x-magento-init">
458        {
459            "#authenticationPopup": {
460                "Magento_Ui/js/core/app": {"components":{"authenticationPopup":{"component":"Magento_Customer\/js\/view\/authentication-popup","children":{"messages":{"component":"Magento_Ui\/js\/view\/messages","displayArea":"messages"},"captcha":{"component":"Magento_Captcha\/js\/view\/checkout\/loginCaptcha","displayArea":"additional-login-form-fields","formId":"user_login","configSource":"checkout"},"recaptcha":{"component":"Magento_ReCaptchaFrontendUi\/js\/reCaptcha","displayArea":"additional-login-form-fields","reCaptchaId":"recaptcha-popup-login","settings":{"rendering":{"sitekey":"6Lfi0UEoAAAAADFKtpUnqoFCtVcVcL2aGaIzODZP","badge":"inline","size":"invisible","theme":"light","hl":""},"invisible":true}}},"config":{"template":"Boxsys_Calculation\/authentication-popup"}}}}            },
461            "*": {
462                "Magento_Ui/js/block-loader": "https\u003A\u002F\u002Fwww.boxsys.de\u002Fstatic\u002Fversion1790068900\u002Ffrontend\u002FBoxsys\u002Fblank_child\u002Fde_DE\u002Fimages\u002Floader\u002D1.gif"
463                            }
464        }
465    </script>
465
466</div>
467<script type="text/x-magento-init">
468    {
469        "*": {
470            "Magento_Customer/js/section-config": {
471                "sections": {"stores\/store\/switch":["*"],"stores\/store\/switchrequest":["*"],"directory\/currency\/switch":["*"],"*":["messages"],"customer\/account\/logout":["*","recently_viewed_product","recently_compared_product","persistent"],"customer\/account\/loginpost":["*"],"customer\/account\/createpost":["*"],"customer\/account\/editpost":["*"],"customer\/ajax\/login":["checkout-data","cart","captcha"],"catalog\/product_compare\/add":["compare-products","wp_ga4"],"catalog\/product_compare\/remove":["compare-products"],"catalog\/product_compare\/clear":["compare-products"],"sales\/guest\/reorder":["cart"],"sales\/order\/reorder":["cart"],"checkout\/cart\/add":["cart","directory-data","wp_ga4"],"checkout\/cart\/delete":["cart","wp_ga4"],"checkout\/cart\/updatepost":["cart","wp_ga4"],"checkout\/cart\/updateitemoptions":["cart","wp_ga4"],"checkout\/cart\/couponpost":["cart"],"checkout\/cart\/estimatepost":["cart"],"checkout\/cart\/estimateupdatepost":["cart"],"checkout\/onepage\/saveorder":["cart","checkout-data","last-ordered-items"],"checkout\/sidebar\/removeitem":["cart","wp_ga4"],"checkout\/sidebar\/updateitemqty":["cart","wp_ga4"],"rest\/*\/v1\/carts\/*\/payment-information":["cart","last-ordered-items","captcha","instant-purchase","wp_ga4"],"rest\/*\/v1\/guest-carts\/*\/payment-information":["cart","captcha","wp_ga4"],"rest\/*\/v1\/guest-carts\/*\/selected-payment-method":["cart","checkout-data"],"rest\/*\/v1\/carts\/*\/selected-payment-method":["cart","checkout-data","instant-purchase"],"customer\/address\/*":["instant-purchase"],"customer\/account\/*":["instant-purchase"],"vault\/cards\/deleteaction":["instant-purchase"],"multishipping\/checkout\/overviewpost":["cart"],"persistent\/index\/unsetcookie":["persistent"],"review\/product\/post":["review"],"paymentservicespaypal\/smartbuttons\/placeorder":["cart","checkout-data"],"paymentservicespaypal\/smartbuttons\/cancel":["cart","checkout-data"],"wishlist\/index\/add":["wishlist","wp_ga4"],"wishlist\/index\/remove":["wishlist"],"wishlist\/index\/updateitemoptions":["wishlist"],"wishlist\/index\/update":["wishlist"],"wishlist\/index\/cart":["wishlist","cart","wp_ga4"],"wishlist\/index\/fromcart":["wishlist","cart"],"wishlist\/index\/allcart":["wishlist","cart","wp_ga4"],"wishlist\/shared\/allcart":["wishlist","cart"],"wishlist\/shared\/cart":["cart"],"euvat\/vatnumber\/validation":["cart","checkout-data"],"checkout\/cart\/configure":["wp_ga4"],"rest\/*\/v1\/guest-carts\/*\/shipping-information":["wp_ga4"],"rest\/*\/v1\/carts\/*\/shipping-information":["wp_ga4"]},
472                "clientSideSections": ["checkout-data","cart-data"],
473                "baseUrls": ["https:\/\/www.boxsys.de\/"],
474                "sectionNames": ["messages","customer","compare-products","last-ordered-items","cart","directory-data","captcha","instant-purchase","loggedAsCustomer","persistent","review","payments","wishlist","etracker-custom-section","wp_ga4","recently_viewed_product","recently_compared_product","product_data_storage"]            }
475        }
476    }
477</script>
vendor: 1 bytes, line 477
477
478<script type="text/x-magento-init">
479    {
480        "*": {
481            "Magento_Customer/js/customer-data": {
482                "sectionLoadUrl": "https\u003A\u002F\u002Fwww.boxsys.de\u002Fcustomer\u002Fsection\u002Fload\u002F",
483                "expirableSectionLifetime": 60,
484                "expirableSectionNames": ["cart","persistent"],
485                "cookieLifeTime": "3600",
486                "cookieDomain": "",
487                "updateSessionUrl": "https\u003A\u002F\u002Fwww.boxsys.de\u002Fcustomer\u002Faccount\u002FupdateSession\u002F",
488                "isLoggedIn": ""
489            }
490        }
491    }
492</script>
vendor: 1 bytes, line 492
492
493<script type="text/x-magento-init">
494    {
495        "*": {
496            "Magento_Customer/js/invalidation-processor": {
497                "invalidationRules": {
498                    "website-rule": {
499                        "Magento_Customer/js/invalidation-rules/website-rule": {
500                            "scopeConfig": {
501                                "websiteId": "1"
502                            }
503                        }
504                    }
505                }
506            }
507        }
508    }
509</script>
vendor: 1 bytes, line 509
509
510<script type="text/x-magento-init">
511    {
512        "body": {
513            "pageCache": {"url":"https:\/\/www.boxsys.de\/page_cache\/block\/render\/product_id\/boxsys_fs_sb\/","handles":["default","calculation_index_index"],"originalRequest":{"route":"calculation","controller":"index","action":"index","uri":"\/calculation\/index\/index\/product_id\/boxsys_fs_sb\/"},"versionCookieName":"private_content_version"}        }
514    }
515</script>
515
516    <!--suppress CssUnusedSymbol -->
517    <style>
518        .boxcalcinfo {
519            position: absolute;
520            top: 0;
521            left: calc(50% - 130px);
522            width: 260px;
523            background: #fff;
524            border: solid 3px #1374bb;
525            box-shadow: 0 0 100px #000;
526            cursor: pointer;
527            padding: 20px 40px;
528            font-size: 12px;
529            color: #333;
530            z-index: 999999;
531        }
532
533        .boxcalcinfo span {
534            position: absolute;
535            top: 5px;
536            right: 15px;
537            color: #1374bb;
538            font-weight: 700;
539        }
540
541        @media (min-width: 769px) {
542            .boxcalcinfo {
543                display: none;
544            }
545        }
546
547        .save-modal .modal-inner-wrap {
548            max-width: 400px;
549        }
550
551        .save-modal .modal-inner-wrap p {
552            margin-bottom: 20px;
553        }
554    </style>
555    <div class="boxcalcinfo" onclick="boxcalcinfo(this, 'none')"><span>X</span><b>Information</b><br><br>In unserem
556        Konfigurator können Sie unter zahlreichen Funktionen auswählen.<br> Auf größeren Bildschirmen haben wir die für
557        Sie sehr übersichtlich
558        angeordnet.<br><br> Wir empfehlen Ihnen, die Konfiguration auf einem Desktop durchzuführen.
559    </div>
560    
560<script>
561        function boxcalcinfo(element, display) {
562            element.style.display = display;
563        }
564    </script>
564
565    <!-- Messages-Modal -->
566    <div id="modal-messages" style="display: none;">
567        <div class="modal-wrapper">
568            <div class="modal-messages">
569                <div class="error-messages">
570                                    </div>
571            </div>
572        </div>
573    </div>
574    
574<script type="text/javascript">
575        require([
576            "jquery",
577            "Magento_Ui/js/modal/modal"
578        ], function ($, modal) {
579            const options = {
580                type: 'popup',
581                responsive: true,
582                modalClass: 'messages-modal'
583            };
584            const $modal = $('#modal-messages');
585            modal(options, $modal);
586
587            const $hasError = false;
588            if ($hasError) {
589                // Reload of whole page only on errors on load
590                $modal.on('modalclosed', function () {
591                    location.reload();
592                });
593                $modal.modal('openModal');
594            }
595        });
596    </script>
596
597    <div class="page-wrapper">
598        <form
599            class="form calculation"
600            action="https://www.boxsys.de/calculation/cart/add/"
601            id="calculation-form"
602            method="post"
603            data-mage-init='{"validation":{}}'
604            data-hasrequired="* Required Fields">
605            <input type="hidden" name="product_id" value="boxsys_fs_sb">
606            <input type="hidden" name="calculation_id" value="144813">
607            <input type="hidden" id="xe" value="220.5">
608            <!-- for online designer, add spacing for multipart -->
609            <input type="hidden" id="ye" value="190.25"><!-- for online designer -->
610            <input type="hidden" id="printing_print" value="1">
611            <!-- for online designer -->
612            <input type="hidden" id="printess-token" name="form_printess_token"
613                   value="">
614                            <input type="hidden" id="printess-png-out" name="form_printess_png_out"
615                       value="">
616                            <input type="hidden" id="printess-png-in" name="form_printess_png_in"
617                       value="">
618                        <input type="hidden" id="calculation-is-valid" value="1">
619            <input type="hidden" id="toggle-update" name="toggle_update" value="0"><!-- for JS -->
620            <input type="hidden" id="saved" name="saved" value=""><!-- for JS -->
621            <input type="hidden" id="updated" name="updated" value="0"><!-- for JS -->
622            <input type="hidden" id="submitting" name="submitting" value="0"><!-- for JS -->
623            <input name="form_key" type="hidden" value="e1pawflSdLlOCitA" />            <main>
624                <div class="row boxsys_config">
625                    <div class="reset-con">
626                        <div class="reset-around">
627                            <p>Möchten sie alle Änderungen wirklich zurücksetzen?</p>
628                            <div class="confirmation-div">
629                                <a class="confirm">Ja</a>
630                                <a class="cancel">Nein</a>
631                            </div>
632                        </div>
633                    </div>
634                    <div class="boxsys_config_grid">
635                        <div class="boxsys_config_left">
636                            <div class="boxsys_config_left_button">
637                                <div class="boxsys_button active switch-tab" id="boxsys_format_button"
638                                     data-target="format">
639                                    <div class="boxsys_button_svg">
640                                        <svg id="boxsys-format-svg" xmlns="http://www.w3.org/2000/svg"
641                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
642                                             viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;"
643                                             xml:space="preserve">
644                                    <g>
645                                        <path class="boxsys-weiß" d="M0.6,0.6v34.8h8.5V9.1h26.3V0.6H0.6z"></path>
646                                        <path class="boxsys-blau" d="M9.1,36H0.6C0.3,36,0,35.7,0,35.4V0.6C0,0.3,0.3,0,0.6,0h34.8C35.7,0,36,0.3,36,0.6v8.5c0,0.3-0.3,0.6-0.6,0.6
647                                            H9.7v25.7C9.7,35.7,9.4,36,9.1,36z M1.2,34.8h7.2V9.1c0-0.3,0.3-0.6,0.6-0.6h25.7V1.2H1.2V34.8z"></path>
648                                        <path class="boxsys-blau" d="M9,32.5H5.6c-0.2,0-0.3-0.1-0.3-0.3c0-0.2,0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3C9.3,32.3,9.2,32.5,9,32.5z
649                                            M9,29.2H3.5c-0.2,0-0.3-0.1-0.3-0.3s0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3S9.2,29.2,9,29.2z M9,25.9H5.6
650                                            c-0.2,0-0.3-0.1-0.3-0.3c0-0.2,0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3C9.3,25.7,9.2,25.9,9,25.9z M9,22.5H3.5
651                                            c-0.2,0-0.3-0.1-0.3-0.3s0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3S9.2,22.5,9,22.5z M9,19.2H5.6c-0.2,0-0.3-0.1-0.3-0.3
652                                            c0-0.2,0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3C9.3,19.1,9.2,19.2,9,19.2z M9,15.9H3.5c-0.2,0-0.3-0.1-0.3-0.3
653                                            c0-0.2,0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3C9.3,15.8,9.2,15.9,9,15.9z M9,12.6H5.6c-0.2,0-0.3-0.1-0.3-0.3
654                                            c0-0.2,0.1-0.3,0.3-0.3H9c0.2,0,0.3,0.1,0.3,0.3C9.3,12.5,9.2,12.6,9,12.6z M32.1,9.4c-0.2,0-0.3-0.1-0.3-0.3V5.7
655                                            c0-0.2,0.1-0.3,0.3-0.3c0.2,0,0.3,0.1,0.3,0.3v3.4C32.4,9.2,32.3,9.4,32.1,9.4z M28.8,9.4c-0.2,0-0.3-0.1-0.3-0.3V3.6
656                                            c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3v5.5C29.1,9.2,29,9.4,28.8,9.4z M25.5,9.4c-0.2,0-0.3-0.1-0.3-0.3V5.7
657                                            c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3v3.4C25.8,9.2,25.7,9.4,25.5,9.4z M22.2,9.4c-0.2,0-0.3-0.1-0.3-0.3V3.6
658                                            c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3v5.5C22.5,9.2,22.3,9.4,22.2,9.4z M18.9,9.4c-0.2,0-0.3-0.1-0.3-0.3V5.7
659                                            c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3v3.4C19.2,9.2,19,9.4,18.9,9.4z M15.6,9.4c-0.2,0-0.3-0.1-0.3-0.3V3.6
660                                            c0-0.2,0.1-0.3,0.3-0.3c0.2,0,0.3,0.1,0.3,0.3v5.5C15.9,9.2,15.7,9.4,15.6,9.4z M12.3,9.4c-0.2,0-0.3-0.1-0.3-0.3V5.7
661                                            c0-0.2,0.1-0.3,0.3-0.3c0.2,0,0.3,0.1,0.3,0.3v3.4C12.6,9.2,12.4,9.4,12.3,9.4z"></path>
662                                    </g>
663                                        </svg>
664                                    </div>
665                                    1. Format
666                                </div>
667                                <div class="boxsys_button switch-tab" id="boxsys_material_button"
668                                     data-target="material">
669                                    <div class="boxsys_button_svg">
670                                        <svg id="boxsys-material-svg" xmlns="http://www.w3.org/2000/svg"
671                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
672                                             viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;"
673                                             xml:space="preserve">
674                                        <g>
675                                            <path class="boxsys-weiß" d="M0.6,0.6v27.7l7.3,7h27.4V0.6H0.6z"/>
676                                            <path class="boxsys-blau" d="M35.4,36H8c-0.2,0-0.3-0.1-0.4-0.2l-7.3-7C0.1,28.7,0,28.5,0,28.3V0.6C0,0.3,0.3,0,0.6,0h34.8
677                                            C35.7,0,36,0.3,36,0.6v34.8C36,35.7,35.7,36,35.4,36z M8.2,34.8h26.6V1.2H1.2v26.8L8.2,34.8z"/>
678                                            <path class="boxsys-weiß" d="M0.6,28.4l7.3,7v-7H0.6z"/>
679                                            <path class="boxsys-blau" d="M7.9,35.7c-0.1,0-0.2,0-0.2-0.1l-7.3-7c-0.1-0.1-0.1-0.2-0.1-0.3c0-0.1,0.2-0.2,0.3-0.2h7.3
680                                            c0.2,0,0.3,0.1,0.3,0.3v7c0,0.1-0.1,0.2-0.2,0.3C8,35.7,8,35.7,7.9,35.7z M1.4,28.7l6.3,6v-6H1.4z"/>
681                                        </g>
682                                        </svg>
683                                    </div>
684                                    2. Material
685                                </div>
686                                <div class="boxsys_button switch-tab" id="boxsys_bedruckung_button"
687                                     data-target="bedruckung">
688                                    <div class="boxsys_button_svg">
689                                        <svg id="boxsys-farbigkeit-svg" xmlns="http://www.w3.org/2000/svg"
690                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
691                                             viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;"
692                                             xml:space="preserve">
693                                        <g>
694                                            <path class="boxsys-weiß" d="M14.6,26.4c1.8-1.5,4.3-1.4,6.6-1s4.5,1.1,6.8,0.7c1.8-0.5,3.5-1.3,5.1-2.3c1.4-0.7,2.3-2.1,2.3-3.7v0
695                                            c0-9.6-7.8-17.4-17.4-17.4c-0.1,0-0.2,0-0.3,0C8.5,2.8,1,10.2,0.6,19.5C0.4,24.1,2.2,28.6,5.4,32c1.6,1.7,4.3,1.8,6,0.1
696                                            c0.6-0.6,1-1.3,1.2-2C12.8,28.7,13.5,27.4,14.6,26.4z"/>
697                                            <path class="boxsys-blau" d="M8.4,33.9c-1.3,0-2.6-0.5-3.5-1.5C1.6,29-0.2,24.2,0,19.4C0.4,9.9,8.2,2.2,17.7,2.1l0.3,0c0,0,0,0,0,0
698                                            c9.9,0,18,8.1,18,18c0,1.8-1,3.4-2.6,4.3c-1.6,1-3.4,1.8-5.3,2.3c-2,0.4-3.9,0-5.7-0.4c-0.5-0.1-0.9-0.2-1.4-0.3
699                                            c-2.8-0.5-4.8-0.2-6.1,0.9c-1,0.9-1.6,2.1-1.8,3.4c-0.2,0.9-0.7,1.7-1.4,2.4C10.8,33.5,9.6,33.9,8.4,33.9z M18,3.3
700                                            C18,3.3,18,3.3,18,3.3l-0.3,0C8.8,3.4,1.6,10.6,1.2,19.5c-0.2,4.5,1.5,8.9,4.6,12.1c1.4,1.5,3.7,1.5,5.1,0.1c0.5-0.5,0.8-1.1,1-1.7
701                                            c0.3-1.5,1.1-3,2.2-4c0,0,0,0,0,0c1.6-1.3,3.9-1.7,7.1-1.1c0.5,0.1,0.9,0.2,1.4,0.3c1.8,0.4,3.5,0.7,5.2,0.4
702                                            c1.7-0.5,3.4-1.2,4.9-2.2c1.2-0.6,2-1.9,2-3.2C34.8,10.8,27.3,3.3,18,3.3z"/>
703                                            <path class="boxsys-blau" d="M6.5,28.7c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7c1.5,0,2.7,1.2,2.7,2.7c0,0,0,0,0,0
704                                            C9.2,27.5,8,28.7,6.5,28.7C6.5,28.7,6.5,28.7,6.5,28.7z M6.5,23.9c-1.1,0-2,0.9-2,2c0,1.1,0.9,2,2,2c0,0,0,0,0,0c1.1,0,2-0.9,2-2v0
705                                            C8.5,24.8,7.6,23.9,6.5,23.9z M8.9,25.9L8.9,25.9L8.9,25.9z M5.6,20.7c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7
706                                            c1.5,0,2.7,1.2,2.7,2.7v0C8.4,19.5,7.1,20.7,5.6,20.7z M5.6,16c-0.5,0-1.1,0.2-1.4,0.6c-0.4,0.4-0.6,0.9-0.6,1.4c0,1.1,0.9,2,2,2
707                                            c1.1,0,2-0.9,2-2v0C7.7,16.9,6.7,16,5.6,16z M29.6,20.3c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7c1.5,0,2.7,1.2,2.7,2.7
708                                            c0,0,0,0,0,0C32.4,19.1,31.1,20.3,29.6,20.3z M29.6,15.5c-1.1,0-2,0.9-2,2c0,1.1,0.9,2,2,2s2-0.9,2-2
709                                            C31.7,16.5,30.7,15.5,29.6,15.5z M9.4,13.6c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7c1.5,0,2.7,1.2,2.7,2.7v0
710                                            C12.2,12.4,10.9,13.6,9.4,13.6z M9.4,8.8C8.9,8.8,8.4,9,8,9.4c-0.4,0.4-0.6,0.9-0.6,1.4c0,1.1,0.9,2,2,2c1.1,0,2-0.9,2-2
711                                            C11.5,9.7,10.6,8.8,9.4,8.8z M11.8,10.9L11.8,10.9L11.8,10.9z M25.7,12.8c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7
712                                            c1.5,0,2.7,1.2,2.7,2.7c0,0,0,0,0,0C28.4,11.5,27.2,12.8,25.7,12.8L25.7,12.8z M25.7,8c-1.1,0-2,0.9-2,2c0,1.1,0.9,2,2,2h0
713                                            c1.1,0,2-0.9,2-2C27.7,8.9,26.8,8,25.7,8z M28.1,10L28.1,10L28.1,10z M17.5,10.1c-1.5,0-2.7-1.2-2.7-2.7c0-1.5,1.2-2.7,2.7-2.7
714                                            c1.5,0,2.7,1.2,2.7,2.7v0C20.3,8.9,19,10.1,17.5,10.1z M17.5,5.3c-1.1,0-2,0.9-2,2c0,1.1,0.9,2,2,2c1.1,0,2-0.9,2-2
715                                            C19.6,6.2,18.7,5.3,17.5,5.3z M19.9,7.4L19.9,7.4L19.9,7.4z"/>
716                                        </g>
717                                        </svg>
718                                    </div>
719                                    3. Farbigkeit
720                                </div>
721                                <div class="boxsys_button switch-tab" id="boxsys_auflage_button" data-target="auflage">
722                                    <div class="boxsys_button_svg">
723                                        <svg id="boxsys-auflage-svg" xmlns="http://www.w3.org/2000/svg"
724                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
725                                             viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;"
726                                             xml:space="preserve">
727                                        <g>
728                                            <path class="boxsys-weiß"
729                                                  d="M16.4,4C7.7,4,0.6,8.1,0.6,13.2V19c0,5.1,7.1,9.2,15.8,9.2v-15h15.8C32.1,8.1,25.1,4,16.4,4"/>
730                                            <path class="boxsys-weiß"
731                                                  d="M19.7,17.1V32c8.7,0,15.7-4.1,15.7-9.2v-5.7H19.7z"/>
732                                            <path class="boxsys-blau" d="M16.4,28.8C7.3,28.8,0,24.4,0,19v-5.7c0-5.4,7.3-9.8,16.4-9.8s16.4,4.4,16.4,9.8c0,0.3-0.3,0.6-0.6,0.6H17
733                                            v14.3C17,28.5,16.7,28.8,16.4,28.8z M16.4,4.6C8,4.6,1.2,8.5,1.2,13.2V19c0,4.6,6.5,8.4,14.5,8.6V13.2c0-0.3,0.3-0.6,0.6-0.6h15.1
734                                            C30.9,8.2,24.4,4.6,16.4,4.6z"/>
735                                            <path class="boxsys-blau" d="M16.4,22.8c-8.9,0-16.1-4.3-16.1-9.5c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3c0,4.9,6.9,8.9,15.4,8.9
736                                            c0.2,0,0.3,0.1,0.3,0.3S16.5,22.8,16.4,22.8z"/>
737                                            <path class="boxsys-blau" d="M19.7,32.6c-0.3,0-0.6-0.3-0.6-0.6V17.1c0-0.3,0.3-0.6,0.6-0.6h15.7c0.3,0,0.6,0.3,0.6,0.6v5.7
738                                            C36,28.2,28.7,32.6,19.7,32.6z M20.3,17.7v13.7c8-0.2,14.5-4,14.5-8.6v-5.1H20.3z"/>
739                                            <path class="boxsys-blau" d="M19.6,26.5c-0.2,0-0.3-0.1-0.3-0.3s0.1-0.3,0.3-0.3c8.3,0,15.1-4.1,15.1-9.2c0-0.2,0.1-0.3,0.3-0.3
740                                            s0.3,0.1,0.3,0.3C35.4,22.2,28.3,26.5,19.6,26.5z"/>
741                                        </g>
742                                        </svg>
743                                    </div>
744                                    4. Auflage
745                                </div>
746                                <div class="boxsys_button switch-tab" id="boxsys_service_button" data-target="service">
747                                    <div class="boxsys_button_svg">
748                                        <svg id="boxsys-service-svg" xmlns="http://www.w3.org/2000/svg"
749                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
750                                             viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;"
751                                             xml:space="preserve">
752                                        <g>
753                                            <path class="boxsys-weiß"
754                                                  d="M23.3,5.1c3.7,5,2.7,12-2.3,15.7s-12,2.7-15.7-2.3S2.7,6.5,7.7,2.8c0,0,0,0,0,0C12.6-0.9,19.6,0.2,23.3,5.1"/>
755                                            <path class="boxsys-blau" d="M14.4,23.6c-3.6,0-7.2-1.6-9.5-4.7c-1.9-2.5-2.7-5.6-2.2-8.8C3.1,7,4.8,4.2,7.3,2.3c5.2-3.9,12.6-2.8,16.5,2.4
756                                            c1.9,2.5,2.7,5.6,2.2,8.8c-0.5,3.1-2.1,5.9-4.6,7.8C19.3,22.8,16.8,23.6,14.4,23.6z M14.4,1.2c-2.2,0-4.4,0.7-6.3,2.1
757                                            c-2.3,1.7-3.7,4.2-4.2,7c-0.4,2.8,0.3,5.6,2,7.9c1.7,2.3,4.2,3.7,7,4.1c2.8,0.4,5.6-0.3,7.9-2c2.3-1.7,3.7-4.2,4.1-7
758                                            s-0.3-5.6-2-7.9l0,0C20.8,2.7,17.6,1.2,14.4,1.2z"/>
759                                            <path class="boxsys-weiß" d="M21,20.8c-1,0.7-2,1.3-3.2,1.6L26.5,34c1.2,1.6,3.4,1.9,4.9,0.7c1.6-1.2,1.9-3.4,0.7-4.9l0,0l-8.6-11.6
760                                            C22.8,19.2,22,20.1,21,20.8"/>
761                                            <path class="boxsys-blau" d="M29.3,36c-1.3,0-2.5-0.6-3.3-1.7l-8.6-11.6c-0.1-0.2-0.2-0.4-0.1-0.5c0.1-0.2,0.2-0.3,0.4-0.4
762                                            c1.1-0.4,2.1-0.9,3-1.6l0,0c0.9-0.7,1.7-1.5,2.3-2.4c0.1-0.2,0.3-0.3,0.5-0.3c0,0,0,0,0,0c0.2,0,0.4,0.1,0.5,0.2l8.6,11.6
763                                            c1.4,1.8,1,4.4-0.8,5.8C31,35.7,30.2,36,29.3,36z M18.9,22.7L27,33.6c1,1.3,2.8,1.6,4.1,0.6c0.6-0.5,1-1.1,1.1-1.9
764                                            c0.1-0.8-0.1-1.5-0.5-2.2l-8.1-10.9c-0.6,0.8-1.3,1.4-2.1,2c0,0,0,0,0,0C20.6,21.8,19.8,22.3,18.9,22.7z M21,20.8L21,20.8L21,20.8z
765                                            "/>
766                                            <path class="boxsys-blau" d="M12.2,16C12.2,16,12.2,16,12.2,16c-0.1,0-0.3-0.1-0.4-0.2L8.2,12c-0.2-0.2-0.2-0.5,0-0.7
767                                            c0.2-0.2,0.5-0.2,0.7,0l3.3,3.4l7.1-7.1c0.2-0.2,0.5-0.2,0.7,0c0.2,0.2,0.2,0.5,0,0.7l-7.5,7.5C12.4,15.9,12.3,16,12.2,16z"/>
768                                        </g>
769                                        </svg>
770                                    </div>
771                                    5. Service
772                                </div>
773                                <div class="boxsys_button switch-tab" id="boxsys_produktion_button"
774                                     data-target="produktion">
775                                    <div class="boxsys_button_svg">
776                                        <svg id="boxsys-produktion-svg" xmlns="http://www.w3.org/2000/svg"
777                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
778                                             viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;"
779                                             xml:space="preserve">
780                                        <g>
781                                            <path class="boxsys-weiß" d="M20,7.7V4h1V0h-6v4h1v3.7c-6.9,1-12.3,6.9-12.3,14.1C3.7,29.6,10.1,36,18,36c7.9,0,14.3-6.4,14.3-14.2
782                                            C32.3,14.6,26.9,8.6,20,7.7z"/>
783                                            <path class="boxsys-blau" d="M18,36c-7.9,0-14.3-6.4-14.3-14.3S10.1,7.4,18,7.4s14.3,6.4,14.3,14.3c0,0,0,0,0,0
784                                            C32.3,29.6,25.9,36,18,36 M18,8.6c-7.3,0-13.1,5.9-13.1,13.1S10.7,34.9,18,34.9c7.3,0,13.1-5.9,13.1-13.1
785                                            C31.1,14.5,25.3,8.6,18,8.6"/>
786                                            <path class="boxsys-blau" d="M18,32.3c-5.9,0-10.6-4.7-10.6-10.6S12.1,11.1,18,11.1s10.6,4.7,10.6,10.6c0,0,0,0,0,0
787                                            C28.6,27.6,23.8,32.3,18,32.3 M18,11.7c-5.5,0-10,4.5-10,10s4.5,10,10,10s10-4.5,10-10c0,0,0,0,0,0C28,16.2,23.5,11.7,18,11.7"/>
788                                            <path class="boxsys-blau" d="M18,22c-0.2,0-0.3-0.1-0.3-0.3v-6.6c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3v6.6
789                                            C18.3,21.9,18.2,22,18,22"/>
790                                            <path class="boxsys-blau" d="M21.6,4.7h-7.1c-0.3,0-0.6-0.3-0.6-0.6c0,0,0,0,0,0V0.6c0-0.3,0.3-0.6,0.6-0.6c0,0,0,0,0,0h7.1
791                                            c0.3,0,0.6,0.3,0.6,0.6c0,0,0,0,0,0v3.6C22.1,4.5,21.9,4.7,21.6,4.7L21.6,4.7 M15,3.6h6V1.1h-6L15,3.6z"/>
792                                            <path class="boxsys-blau" d="M20,8.4C20,8.4,20,8.4,20,8.4c-1.4-0.2-2.7-0.2-3.9,0c-0.3,0-0.6-0.2-0.6-0.5c0,0,0-0.1,0-0.1
793                                            V4.1c0-0.3,0.3-0.6,0.6-0.6l0,0h4c0.3,0,0.6,0.3,0.6,0.6c0,0,0,0,0,0v3.7C20.6,8.1,20.3,8.4,20,8.4L20,8.4 M16.6,4.7v2.5
794                                            c1-0.1,1.9-0.1,2.9,0V4.7L16.6,4.7z"/>
795                                        </g>
796                                        </svg>
797                                    </div>
798                                    6. Optionen
799                                </div>
800                                <div class="boxsys_button" id="boxsys_reset_button">
801                                    <div class="boxsys_button_reset">
802                                        <svg id="Ebene_1" xmlns="http://www.w3.org/2000/svg"
803                                             xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
804                                             viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;"
805                                             xml:space="preserve">
806                                        <path class="boxsys-blau" d="M45.6,10.5H9.7l6-6l-3.6-3.6L0,13l12.1,12.1l3.6-3.6l-6-6h35.2V44H9.1V31H4v13.7c0,2.4,2,4.4,4.4,4.4h37.2
807                                        c2.4,0,4.4-2,4.4-4.4V14.9C50,12.5,48,10.5,45.6,10.5z"/>
808                                        </svg>
809                                        <span class="tooltip">zurücksetzen</span></div>
810                                </div>
811                            </div>
812                            <div class="boxsys_config_left_grid">
813                                <div class="boxsys_config_left_input">
814                                    <div class="boxsys-config-container active" id="boxsys_format_container">
815                                        <div class="info">
816                                            <span class="icon-info-sign">i</span>
817                                            <div class="extra-info">
818                                                <div class="extra-info-con">
819                                                    <div>
820                                                        <p><span
821                                                                class="info-cross">x</span>Bei Verpackungen, Faltschachteln und Kartons geben Sie bei der Eingabe bitte das gewünschte Innenmaß in Millimetern an.<br>
822Angegeben werden die Länge, die Breite und die Höhe.<br><br>
823In der Zusammenfassung rechts wird Ihnen zusätzlich das Außenformat angezeigt. Die Länge und die Breite beschreiben die beiden Seiten an der Öffnung, wobei sich der Deckel an der Länge befindet. Das verbleibende Maß ist die Höhe.
824<br>
825<div style="text-align:center;position:relative;width:100%;height:350px;">
826<div style="position:absolute;top:0;left:0; width:80%;">
827<img src="/media/boxsys/images/info/boxsys_info_fs.png">
828</div>
829<div style="text-align:left;padding-left:60px;position:absolute;bottom:0;right:0; width:40%;">
830L = Länge<br>
831B = Breite<br>
832H = Höhe<br><br>
833</div>
834</div>
835<br><p style="text-align:left;">
836In unserem Wiki haben wir die Grundlagen der Bemaßungen noch einmal ausführlich erklärt. <a href="https://www.boxsys.de/service/boxsys-wiki.html#wiki_massangaben" target="_blank">...Boxsys Wiki</a></p>                                                        </p>
837                                                    </div>
838                                                </div>
839                                            </div>
840                                        </div>
841                                        <p class="boxsys_config_container_header">Vorausgewählte Formate</p>
842                                        <!--suppress HtmlFormInputWithoutLabel -->
843                                        <select id="boxsys_format_select">
844                                                                                            <option
845                                                    value="14">50x20x60mm</option>
846                                                                                            <option
847                                                    value="15">50x30x80mm</option>
848                                                                                            <option
849                                                    value="16" selected="selected">60x40x100mm</option>
850                                                                                            <option
851                                                    value="17">70x30x120mm</option>
852                                                                                            <option
853                                                    value="18">90x40x130mm</option>
854                                                                                            <option
855                                                    value="19">
855100x50x150mm</option>
856                                                                                            <option
857                                                    value="20">120x60x200mm</option>
858                                                                                            <option
859                                                    value="21">150x80x150mm</option>
860                                                                                    </select>
861                                        <div class="boxsys-config-container-2">
862                                            <p class="boxsys_config_container_header">Eigene Formateingabe</p>
863                                                                                            <div class="boxsys_format_input_box form_a required">
864                                                    <div class="boxsys-format-input-name">
865                                                        <p for="form_a">Länge</p>
866                                                    </div>
867                                                    <div class="boxsys-format-min-max">
868                                                        <div class="boxsys-format-min-max-left">
869                                                                                                                            von<br>
870                                                                bis
871                                                                                                                    </div>
872                                                        <div class="boxsys-format-min-max-right">
873                                                                                                                            <p for="form_a">30</p> mm                                                                <br>
874                                                                                                                                                                                        <p for="form_a"
875                                                                   id="format-range-to-a">50000000</p> mm                                                                                                                    </div>
876                                                    </div>
877                                                    <div class="boxsys-format-input">
878                                                        <input
879                                                            name="form_a"
880                                                            id="calculation-form-a"
881                                                            title="Länge"
882                                                            value="60"
883                                                            class="formatDesiredformatLength_a input-text"
884                                                            type="number"
885                                                            data-validate='{"required":true,"validate-number-range":"30-50000000","rule_f_3":"true","rule_f_4":"true","a_max_calc":"true"}'/>
886                                                    </div>
887                                                    <div class="boxsys-format-input-button">
888                                                        <button tabindex="-1" type="button" class="add"
889                                                                data-target="length">+
890                                                        </button>
891                                                        <button tabindex="-1" type="button" class="sub"
892                                                                data-target="length">–
893                                                        </button>
894                                                    </div>
895                                                </div>
896                                                                                            <div class="boxsys_format_input_box form_b required">
897                                                    <div class="boxsys-format-input-name">
898                                                        <p for="form_b">Breite</p>
899                                                    </div>
900                                                    <div class="boxsys-format-min-max">
901                                                        <div class="boxsys-format-min-max-left">
902                                                                                                                            von<br>
903                                                                bis
904                                                                                                                    </div>
905                                                        <div class="boxsys-format-min-max-right">
906                                                                                                                            <p for="form_b">15</p> mm                                                                <br>
907                                                                                                                                                                                        <p for="form_b"
908                                                                   id="format-range-to-b">50000000</p> mm                                                                                                                    </div>
909                                                    </div>
910                                                    <div class="boxsys-format-input">
911                                                        <input
912                                                            name="form_b"
913                                                            id="calculation-form-b"
914                                                            title="Breite"
915                                                            value="40"
916                                                            class="formatDesiredformatLength_b input-text"
917                                                            type="number"
918                                                            data-validate='{"required":true,"validate-number-range":"15-50000000","rule_f_3":"true","b_max_calc":"true"}'/>
919                                                    </div>
920                                                    <div class="boxsys-format-input-button">
921                                                        <button tabindex="-1" type="button" class="add"
922                                                                data-target="length">+
923                                                        </button>
924                                                        <button tabindex="-1" type="button" class="sub"
925                                                                data-target="length">–
926                                                        </button>
927                                                    </div>
928                                                </div>
929                                                                                            <div class="boxsys_format_input_box form_h required">
930                                                    <div class="boxsys-format-input-name">
931                                                        <p for="form_h">Höhe</p>
932                                                    </div>
933                                                    <div class="boxsys-format-min-max">
934                                                        <div class="boxsys-format-min-max-left">
935                                                                                                                            von<br>
936                                                                bis
937                                                                                                                    </div>
938                                                        <div class="boxsys-format-min-max-right">
939                                                                                                                            <p for="form_h">45</p> mm                                                                <br>
940                                                                                                                                                                                        <p for="form_h"
941                                                                   id="format-range-to-h">50000000</p> mm                                                                                                                    </div>
942                                                    </div>
943                                                    <div class="boxsys-format-input">
944                                                        <input
945                                                            name="form_h"
946                                                            id="calculation-form-h"
947                                                            title="Höhe"
948                                                            value="100"
949                                                            class="formatDesiredformatLength_h input-text"
950                                                            type="number"
951                                                            data-validate='{"required":true,"validate-number-range":"45-50000000","rule_f_4":"true","h_max_calc":"true"}'/>
952                                                    </div>
953                                                    <div class="boxsys-format-input-button">
954                                                        <button tabindex="-1" type="button" class="add"
955                                                                data-target="length">+
956                                                        </button>
957                                                        <button tabindex="-1" type="button" class="sub"
958                                                                data-target="length">–
959                                                        </button>
960                                                    </div>
961                                                </div>
962                                                                                        <a class="submit format-container active update"><input id="update"
963                                                                                                    value="Über
963nehmen"
964                                                                                                    title="Übernehmen"
965                                                                                                    type="button"></a>
966                                            <p style="clear: both; padding-top: 10px;" class="boxsys_config_container_description">Das Eingabefenster aktualisiert sich automatisch mit Ihrer Eingabe.</p>                                                       
967                                        </div>
968                                                                                    <div style="clear:both; position:relative; padding-top:10px;">
969                                                <div class="info" style="right:0; top:22px;">
970                                                    <span class="icon-info-sign">i</span>
971                                                    <div class="extra-info">
972                                                        <div class="extra-info-con">
973                                                            <div>
974                                                                <p>
975                                                                    <span class="info-cross">x</span>Die meisten
976                                                                    Faltschachteln werden manuell aufgestellt und mit
977                                                                    dem Inhalt befüllt. Wenn Sie maschinell
978                                                                    konfektioniert werden, brauchen die <a
979                                                                        href="https://www.boxsys.de/service/boxsys-wiki.html#wiki_staublasche">Staublaschen</a>
980                                                                    die sogenannten <a
981                                                                        href="https://www.boxsys.de/service/boxsys-wiki.html#wiki_magazinschlitze">Magazinschlitze</a>.
982                                                                </p><br>
983                                                                <div
984                                                                    style="text-align:center;position:relative;width:100%;">
985                                                                    <div style="width:100%;">
986                                                                        <img
987                                                                            src="/media/boxsys/images/info/boxsys_magazin_info.png"
988                                                                            alt="Magazinschlitz Info">
989                                                                    </div>
990                                                                </div>
991                                                                <br>
992                                                                <p>
993                                                                    Diese sind in der Herstellung aufwändiger und daher
994                                                                    etwas teurer. Natürlich können
995                                                                    Automatenfaltschachteln auch manuell aufgestellt
996                                                                    werden.
997                                                                </p>
998                                                            </div>
999                                                        </div>
1000                                                    </div>
1001                                                </div>
1002                                                <p class="boxsys_config_container_header" style="padding-top:10px;">
1003                                                    Geeignet für manuelle oder maschinelle Befüllung</p>
1004                                                <!--suppress HtmlFormInputWithoutLabel -->
1005                                                <select id="boxsys_ms_select" name="form_ms">
1006                                                                                                            <option
1007                                                            value="
10070" selected="selected">manuelle Befüllung</option>
1008                                                                                                            <option
1009                                                            value="1">maschinelle Befüllung</option>
1010                                                                                                    </select>
1011                                            </div>
1012                                                                                                                            <div style="clear:both; position:relative; padding-top:10px;">
1013                                                                                                <p class="boxsys_config_container_header" style="padding-top:10px;">
1014                                                    Deckelversion                                                </p>
1015                                                <!--suppress HtmlFormInputWithoutLabel -->
1016                                                <select id="boxsys_ms_select" name="form_de_vs">
1017                                                                                                            <option
1018                                                            value="0" selected="selected">Deckel rechts</option>
1019                                                                                                            <option
1020                                                            value="1">Deckel links</option>
1021                                                                                                    </select>
1022                                            </div>
1023                                                                                                                        <a class="submit format-container active">
1024                                            <input class="switch-tab"
1025                                                   data-target="material"
1026                                                   value="WEITER&nbsp;&nbsp;&Gt;"
1027                                                   title="Weiter zum Material" type="button">
1028                                        </a>
1029                                    </div>
1030                                    <div class="boxsys-config-container" id="boxsys_material_container">
1031                                        <div class="boxsys-config-container_1">
1032                                            <p class="boxsys_config_container_header">Materialauswahl</p>
1033                                            <p class="boxsys_config_container_description">Durchdachte und bewährte
1034                                                Auswahl an gängigen Materialien für ein perfektes Druckobjekt:</p>
1035                                            <div
1036                                                class="boxsys_material_container_static boxsys_container_selection_mlb">
1037                                                <div id="calculation-form-material"
1038                                                     class="form-control materialMaterialselection"
1039                                                     title="Material">
1040                                                    <input
1041                                                        id="material_value_hidden"
1042                                                        type="hidden"
1043                                                        name="form_material_id"
1044                                                        data-validate='{"required":true}'>
1045                                                    <div class="material-options">
1046                                                                                                                    <div class="boxsys_material_selection active">
1047                                                                                                                                <div class="boxsys_material_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/mat_icon_card_ww.png);"></div>
1048                                                                <p data-value="m2">
1049                                                                    Chromosulfatkarton<br>
1050                                                                    <sp
1050an style="font-size:11px;">
1051                                                                         FSC® Mix 300-400 g/m²                                                                    </span>
1052                                                                </p>
1053                                                            </div>
1054                                                                                                                    <div class="boxsys_material_selection ">
1055                                                                                                                                <div class="boxsys_material_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/mat_icon_card_ww_be.png);"></div>
1056                                                                <p data-value="m3">
1057                                                                    ICON Nature diamant FSC + Blauer Engel<br>
1058                                                                    <span style="font-size:11px;">
1059                                                                         FSC® Mix 270-350 g/m² weiß matt                                                                    </span>
1060                                                                </p>
1061                                                            </div>
1062                                                                                                                    <div class="boxsys_material_selection ">
1063                                                                                                                                <div class="boxsys_material_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/mat_icon_card_bb.png);"></div>
1064                                                                <p data-value="m5">
1065                                                                    Kraftboard braun<br>
1066                                                                    <span style="font-size:11px;">
1067                                                                         FSC® Mix 300-400 g/m²                                                                    </span>
1068                                                                </p>
1069                                                            </div>
1070                                                                                                                    <div class="boxsys_material_selection ">
1071                                                                                                                                <div class="boxsys_material_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/mat_icon_welle_ww.png);"></div>
1072                                                                <p data-value="m18">
1073                                                                    F-Welle weiß/weiß<br>
1074                                                                    <span style="font-size:11px;">
1075                                                                          FSC® Mix 70%                                                                    </span>
1076                                                                </p>
1077                                                            </div>
1078                                                                                                            </div>
1079                                                </div>
1080                                            </div>
1081                                        </div>
1082                                        <div class="materialhinweis">
1083                                            <div class="info">
1084                                                Materialhinweis&nbsp;&nbsp;<span class="icon-info-sign">i</span>
1085                                                <div class="extra-info">
1086                                                    <div class="extra-info-con">
1087                                                        <div>
1088                                                            <p><span class="info-cross">x</span>Aus dem gewählten
1089                                                                Material suchen wir für Sie, abhängig von der Größe, die
1090                                                                richtige Grammatur (Stärke) aus.<br>Wenn Sie dazu
1091                                                                Nachfragen oder besondere Wünsche
1092                                                                an die Festigkeit haben, sprechen Sie uns gern
1093                                                                direkt aus diesem Fenster unter „Anfrage stellen“
1094                                                                an.<br><br>
1095                                                                Sie können sich ein Weißmuster aus dem Originalmaterial
1096                                                                bestellen, indem Sie Ihr Produkt konfigurieren und die
1097                                                                Auflage 1 (oder mehr) in der Farbigkeit „unbedruckt“
1098                                                                über den Warenkorb
1099                                                                bestellen.
1100                                                            </p>
1101                                                        </div>
1102                                                    </div>
1103                                                </div>
1104                                            </div>
1105                                        </div>
1106                                        <a class="submit config-container active">
1107                                            <input class="switch-tab back"
1108                                                   data-target="format"
1109                                                   value="&Lt;"
1110                                                   title="Zurück zum Format"
1111                                                   type="button">
1112                                            <input class="switch-tab next"
1113                                                   data-target="bedruckung"
1114                                                   value="WEITER&nbsp;&nbsp;&Gt;"
1115                                                   title="Weiter zur Farbigkeit"
1116                                                   type="button">
1117                                        </a>
1118                                    </div>
1119                                    <div class="boxsys-config-container" id="boxsys_bedruckung_container">
1120                                        <div class="boxsys-config-container_1">
1121                                            <div class="info">
1122                                                <span class="icon-info-sign">i</span>
1123                                                <div class="extra-info">
1124                                                    <div class="extra-info-con">
1125                                                        <div>
1126                                                            <p><span class="info-cross">x</span>Das Druckergebnis ist
1127                                                                abhängig vom Druckverfahren, dem Digitaldruck oder dem
1128                                                                Offsetdruck, und von der Oberfläche des bedruckten
1129                                                                Materials.<br><br>
1130                                                                Auf glatten und weißen Oberflächen entspricht das
1131                                                                Druckbild dem Branchenstandard PSO (<a
1132                                                                    href="https://www.boxsys.de/boxsys-wiki.html#pso/"
1133                                                                    target="_blank">ProzessStandard Offset</a>).<br>
1134                                                                Bei offenen und farbigen Oberflächen gibt es zum Teil
1135                                                                deutliche, verfahrensbedingte Abweichungen.<br><br>Bitte
1136                                                                sprechen Sie uns dazu gern an, für jede Aufgabe gibt es
1137                                                                eine passende Lösung.
1138                                                            </p>
1139                                                        </div>
1140                                                    </div>
1141                                                </div>
1142                                            </div>
1143                                            <p class="boxsys_config_container_header">Farbigkeit</p>
1144                                            <p class="boxsys_config_container_description">Entwerfen Sie ihr eigens
1145                                                Design und nutzen Sie dazu auch unsere breite Auswahl an Sonderfarben
1146                                                (SF) nach Pantone oder HKS.</p>
1147                                            <div
1148                                                class="boxsys_bedruckung_container_static boxsys_container_selection_mlb">
1149                                                <div id="calculation-form-printing"
1150                                                     class="form-control bedruckungBedruckungselection"
1151                                                     title="Bedruckung">
1152                                                    <input id="printing_value_hidden"
1153                                                           type="hidden"
1154                                                           name="form_printing_id"
1155                                                           data-validate='{"required":true}'>
1156                                                    <div class="printing-options">
1157                                                                                                                    <div class="boxsys_bedruckung_selection ">
1158                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_none.svg);"></div>
1159                                                                <p data-value="p1">unbedruckt</p>
1160                                                            </div>
1161                                                                                                                    <div class="boxsys_bedruckung_selection ">
1162                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_1-0.svg);"></div>
1163                                                                <p data-value="p2">1/0c schwarz</p>
1164                                                            </div>
1165                                                                                                                    <div class="boxsys_bedruckung_selection active">
1166                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_4-0.svg);"></div>
1167                                                                <p data-value="p3">4/0c Euroskala</p>
1168                                                            </div>
1169                                                                                                                    <div class="boxsys_bedruckung_selection ">
1170                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_1-1.svg);"></div>
1171                                                                <p data-value="p10">1/1c schwarz beidseitig</p>
1172                                                            </div>
1173                                                                                                                    <div class="boxsys_bedruckung_selection ">
1174                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_4-1.svg);"></div>
1175                                                                <p data-value="p12">4/1c Euroskala beidseitig</p>
1176                                                            </div>
1177                                                                                                                    <div class="boxsys_bedruckung_selection ">
1178                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_4-4.svg);"></div>
1179                                                                <p data-value="p11">4/4c Euroskala beidseitig</p>
1180                                                            </div>
1181                                                                                                                    <div class="boxsys_bedruckung_selection ">
1182                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_0-1-0.svg);"></div>
1183                                                                <p data-value="p15">1/0c Sonderfarbe</p>
1184                                                            </div>
1185                                                                                                                    <div class="boxsys_bedruckung_selection ">
1186                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_1-1-0.svg);"></div>
1187                                                                <p data-value="p13">2/0c schwarz + 1 Sonderfarbe</p>
1188                                                            </div>
1189                                                                                                                    <div class="boxsys_bedruckung_selection ">
1190                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_4-1-0.svg);"></div>
1191                                                                <p data-value="p4">5/0c Euroskala + 1 Sonderfarbe</p>
1192                                                            </div>
1193                                                                                                                    <div class="boxsys_bedruckung_selection ">
1194                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_4-2-0.svg);"></div>
1195                                                                <p data-value="p5">6/0c Euroskala + 2 Sonderfarben</p>
1196                                                            </div>
1197                                                                                                                    <div class="boxsys_bedruckung_selection ">
1198                                                                                                                                <div class="boxsys_bedruckung_background" style="background-image: url(/media/boxsys/icon/produktkonfigurator/print_icon_1-1-1-1.svg);"></div>
1199                                                                <p data-value="p14">2/2c schwarz + 1 Sonderfarbe beidseitig</p>
1200                                                            </div>
1201                                                                                                            </div>
1202                                                </div>
1203                                            </div>
1204                                        </div>
1205                                        <a class="submit config-container active">
1206                                            <input class="switch-tab back"
1207                                                   data-target="material"
1208                                                   value="&Lt;"
1209                                                   title="Zurück zum Material"
1210                                                   type="button">
1211                                            <input class="switch-tab next"
1212                                                   data-target="auflage"
1213                                                   value="WEITER&nbsp;&nbsp;&Gt;"
1214                                                   title="Weiter zur Auflage"
1215                                                   type="button">
1216                                        </a>
1217                                    </div>
1218                                    <div class="boxsys-config-container" id="boxsys_auflage_container">
1219                                        <div class="boxsys-config-container_1">
1220                                            <div class="info">
1221                                                <span class="icon-info-sign">i</span>
1222                                                <div class="extra-info">
1223                                                    <div class="extra-info-con">
1224                                                        <div>
1225                                                            <p><span class="info-cross">x</span>Wir fertigen jedes
1226                                                                Produkt nach Ihrer Bestellung für Sie an. Bei größeren
1227                                                                Stückzahlen sinkt der Stückpreis daher teilweise
1228                                                                deutlich.<br><br>
1229                                                                Bitte geben Sie in der Zusammenfassung rechts auch die
1230                                                                Postleitzahl an, zu der wir Ihre Sendung schicken
1231                                                                dürfen. Ihnen wird dann der Preis inkl. der
1232                                                                Versandkosten angezeigt.</p>
1233                                                        </div>
1234                                                    </div>
1235                                                </div>
1236                                            </div>
1237                                            <p class="boxsys_config_container_header">Auflage</p>
1238                                            <p class="boxsys_config_container_description">
1239                                                Wählen Sie aus der Preisstaffelung oder geben Sie unten eine
1240                                                individuelle Stückzahl ein. Die Tabellenpreise sind die Nettopreise ohne
1241                                                die Versandkosten.
1242                                            </p>
1243                                            <div class="boxsys_auflage_container_static">
1244                                                <table name="form_quantity_options"
1245                                                       id="calculation-form-quantity-options" class="form-control"
1246                                                       title="Auflage">
1247                                                    <tbody class="auflageselection">
1248                                                    <th><b>Stückzahl</b></th>
1249                                                    <th><b>Gesamtpreis €*</b></th>
1250                                                                                                            <tr class="table-tr ">
1251                                                            <td><a class="auflage-defined-value quantity"
1252                                                                   data-value="10">10</a>
1253                                                            </td>
1254                                                            <td>
1255                                                                <a class="auflage-defined-value auflage-price">72,88                                                                    €</a></td>
1256                                                        </tr>
1257                                                                                                            <tr class="table-tr ">
1258                                                            <td><a class="auflage-defined-value quantity"
1259                                                                   data-value="50">50</a>
1260                                                            </td>
1261                                                            <td>
1262                                                                <a class="auflage-defined-value auflage-price">122,94                                                                    €</a></td>
1263                                                        </tr>
1264                                                                                                            <tr class="table-tr ">
1265                                                            <td><a class="auflage-defined-value quantity"
1266                                                                   data-value="100">100</a>
1267                                                            </td>
1268                                                            <td>
1269                                                                <a class="auflage-defined-value auflage-price">180,74                                                                    €</a></td>
1270                                                        </tr>
1271                                                                                                            <tr class="table-tr ">
1272                                                            <td><a class="auflage-defined-value quantity"
1273                                                                   data-value="500">500</a>
1274                                                            </td>
1275                                                            <td>
1276                                                                <a class="auflage-defined-value auflage-price">403,63                                                                    €</a></td>
1277                                                        </tr>
1278                                                                                                            <tr class="table-tr ">
1279                                                            <td><a class="auflage-defined-value quantity"
1280                                                                   data-value="1000">1.000</a>
1281                                                            </td>
1282                                                            <td>
1283                                                                <a class="auflage-defined-value auflage-price">631,69                                                                    €</a></td>
1284                                                        </tr>
1285                                                                                                            <tr class="table-tr ">
1286                                                            <td><a class="auflage-defined-value quantity"
1287                                                                   data-value="2500">2.500</a>
1288                                                            </td>
1289                                                            <td>
1290                                                                <a class="auflage-defined-value auflage-price">1.057,30                                                                    €</a></td>
1291                                                        </tr>
1292                                                                                                            <tr class="table-tr ">
1293                                                            <td><a class="auflage-defined-value quantity"
1294                                                                   data-value="5000">5.000</a>
1295                                                            </td>
1296                                                            <td>
1297                                                                <a class="auflage-defined-value auflage-price">1.372,16                                                                    €</a></td>
1298                                                        </tr>
1299                                                                                                            <tr class="table-tr active">
1300                                                            <td><a class="auflage-defined-value quantity"
1301                                                                   data-value="10000">10.000</a>
1302                                                            </td>
1303                                                            <td>
1304                                                                <a class="auflage-defined-value auflage-price">1.929,26                                                                    €</a></td>
1305                                                        </tr>
1306                                                                                                        </tbody>
1307                                                </table>
1308                                            </div>
1309                                            <p class="boxsys_config_container_header">Wunschauflage:</p>
1310                                            <p class="boxsys_config_container_description">geben Sie hier ihre
1311                                                gewünschte Menge ein und bestätigen Sie mit "Übernehmen". Der Stückpreis
1312                                                und der Gesamtpreis werden Ihnen in der Zusammenfassung rechts
1313                                                angezeigt.</p>
1314                                            <div class="boxsys_config_container_input_calculation">
1315                                                                                                <input id="calculation-form-quantity"
1316                                                       name="form_quantity"
1317                                                       title="Auflage"
1318                                                       value="10000"
1319                                                       class="calculatorAuflage input-text"
1320                                                       type="number"
1321                                                       data-validate='{"required":true,"validate-number-range":"1-200000"}'/>
1322                                                <input id="submit_auflage" type="button" value="Übernehmen">
1323                                            </div>
1324                                        </div>
1325                                        <div class="boxsys-config-container_1 hide-noprint" style="position: relative; margin-top: 15px;">
1326                                            <div class="info" style="top: -3px; right: 2px;">
1327                                                <span class="icon-info-sign">i</span>
1328                                                <div class="extra-info">
1329                                                    <div class="extra-info-con">
1330                                                        <div>
1331                                                            <span class="info-cross">x</span>
1332                                                            <h3>Druckbilder</h3>
1333                                                            <p>
1334                                                                Motive/Druckbilder/Versionen etc.
1335                                                            </p>
1336                                                        </div>
1337                                                    </div>
1338                                                </div>
1339                                            </div>
1340                                            <p class="boxsys_config_container_header">Anzahl der Druckmotive</p>
1341                                            <!--suppress HtmlFormInputWithoutLabel -->
1342                                            <select id="form_calc_select_motifs_2" onchange="motifsSync(this)">
1343                                                <option value="1" selected>1</option>
1344                                                <option value="2">2</option>
1345                                                <option value="3">3</option>
1346                                                <option value="4">4</option>
1347                                                <option value="5">5</option>
1348                                                <option value="6">6</option>
1349                                                <option value="7">7</option>
1350                                                <option value="8">8</option>
1351                                                <option value="9">9</option>
1352                                                <option value="10">10</option>
1353                                            </select>
1354                                        </div>
1355                                        <a class="submit config-container active">
1356                                            <input class="switch-tab back"
1357                                                   data-target="bedruckung"
1358                                                   value="&Lt;"
1359                                                   title="Zurück zur Farbigkeit"
1360                                                   type="button">
1361                                            <input class="switch-tab next"
1362                                                   data-target="service"
1363                                                   value="WEITER&nbsp;&nbsp;&Gt;"
1364                                                   title="Weiter zum Service"
1365                                                   type="button">
1366                                        </a>
1367                                    </div>
1368                                    <div class="boxsys-config-container" id="boxsys_service_container">
1369                                        <div class="boxsys-config-container_1">
1370                                            <div class="info">
1371                                                <span class="icon-info-sign">i</span>
1372                                                <div class="extra-info">
1373                                                    <div class="extra-info-con">
1374                                                        <div style="width:90%;">
1375                                                            <span class="info-cross">x</span>
1376                                                            <h3>Einfache Datenprüfung:</h3>
1377                                                            <h4>Stanzdatenprüfung</h4>
1378                                                            <li>Verwendung der Original-Stanzkontur, wurde die von
1379                                                                Boxsys bereitgestellte Stanzkontur verwendet
1380                                                                (unverändert, unverzerrt, nicht neu gezeichnet)? Ist sie
1381                                                                identisch mit der Bestellung.
1382                                                            </li>
1383                                                            <br>
1384                                                            <h4>Druckdatenprüfung</h4>
1385                                                            <li>Entspricht das Dateiformat dem Produktionsmaß inkl.
1386                                                                korrektem Beschnitt (mind. 3 mm)?
1387                                                            </li>
1388                                                            <li>Wurde das richtige Dateiformat verwendet (z.B. PDF/X-4)?
1389                                                                Sind keine offenen oder verlinkten Dateien vergessen
1390                                                                worden?
1391                                                            </li>
1392                                                            <li>Sind alle Daten im CMYK-Modus und passt die Farbanzahl
1393                                                                zur Bestellung? Hinweis auf abweichende Farbwiedergabe
1394                                                                bei farbigen Materialien.
1395                                                            </li>
1396                                                            <li>Liegt die Auflösung aller Bilder bei mind. 300 dpi in
1397                                                                Originalgröße?
1398                                                            </li>
1399                                                            <li>Wurden alle Schriften korrekt eingebettet oder
1400                                                                vollständig in Pfade konvertiert?
1401                                                            </li>
1402                                                            <li>Wurden Transparenzen reduziert und sind alle Ebenen auf
1403                                                                eine druckfähige Version reduziert?
1404                                                            </li>
1405                                                            <br><br>
1406                                                            <h3>Erweiterte Datenprüfung:</h3>
1407                                                            <h4>Stanzdatenprüfung</h4>
1408                                                            <li>Wurde die von Boxsys bereitgestellte Stanzkontur
1409                                                                verwendet (unverändert, unverzerrt, nicht neu
1410                                                                gezeichnet)? Ist sie identisch mit der Bestellung.
1411                                                            </li>
1412                                                            <li>Sind alle grafischen Elemente korrekt auf der
1413                                                                Stanzkontur platziert und ausgerichtet (z.B.
1414                                                                Vorder-/Rückseite, Boden, Laschen
1414)? Sind alle Inhalte
1415                                                                (Texte, Logos, Bilder) korrekt positioniert, im
1416                                                                Endprodukt sichtbar und nicht zu nah an Schnitt- oder
1417                                                                Falzkanten?
1418                                                            </li>
1419                                                            <li>Wird das Layout beim Zusammenbau optisch korrekt wirken?
1420                                                                Gibt es unerwartete Umbrüche, Überläufe oder
1421                                                                Positionierungsfehler?
1422                                                            </li>
1423                                                            <br>
1424                                                            <h4>Druckdatenprüfung</h4>
1425                                                            <li>Entspricht das Dateiformat dem Produktionsmaß inkl.
1426                                                                korrektem Beschnitt (mind. 3 mm)?
1427                                                            </li>
1428                                                            <li>Wurde das richtige Dateiformat verwendet (z.B. PDF/X-4)?
1429                                                                Sind keine offenen oder verlinkten Dateien vergessen
1430                                                                worden?
1431                                                            </li>
1432                                                            <li>Sind alle Daten im CMYK-Modus und passt die Farbanzahl
1433                                                                zur Bestellung? Hinweis auf abweichende Farbwiedergabe
1434                                                                bei farbigen Materialien.
1435                                                            </li>
1436                                                            <li>Liegt die Auflösung aller Bilder bei mind. 300 dpi in
1437                                                                Originalgröße?
1438                                                            </li>
1439                                                            <li>Wurden alle Schriften korrekt eingebettet oder
1440                                                                vollständig in Pfade konvertiert?
1441                                                            </li>
1442                                                            <li>Sind Sonderfarben für z.B. Lack, Prägung oder Stanze
1443                                                                sauber benannt (z.B. „Lack“, „Stanze“) und als
1444                                                                Volltonfarbe angelegt? Nicht versehentlich überdruckend
1445                                                                gesetzt.
1446                                                            </li>
1447                                                            <li>Wurden Transparenzen reduziert und sind alle Ebenen auf
1448                                                                eine druckfähige Version reduziert?
1449                                                            </li>
1450                                                            <li>Softproof* zur Kontrolle</li>
1451                                                            <br><br>
1452                                                            <h3>Erweiterte Datenprüfung bei FSC-Logo Einsatz:</h3>
1453                                                            <h4>Stanzdatenprüfung</h4>
1454                                                            <li>Wurde die von Boxsys bereitgestellte Stanzkontur
1455                                                                verwendet (unverändert, unverzerrt, nicht neu
1456                                                                gezeichnet)? Ist sie identisch mit der Bestellung.
1457                                                            </li>
1458                                                            <li>Sind alle grafischen Elemente korrekt auf der
1459                                                                Stanzkontur platziert und ausgerichtet (z.B.
1460                                                                Vorder-/Rückseite, Boden, Laschen
1460)? Sind alle Inhalte
1461                                                                (Texte, Logos, Bilder) korrekt positioniert, im
1462                                                                Endprodukt sichtbar und nicht zu nah an Schnitt- oder
1463                                                                Falzkanten?
1464                                                            </li>
1465                                                            <li>Wird das Layout beim Zusammenbau optisch korrekt wirken?
1466                                                                Gibt es unerwartete Umbrüche, Überläufe oder
1467                                                                Positionierungsfehler?
1468                                                            </li>
1469                                                            <br>
1470                                                            <h4>Druckdatenprüfung</h4>
1471                                                            <li>Entspricht das Dateiformat dem Produktionsmaß inkl.
1472                                                                korrektem Beschnitt (mind. 3 mm)?
1473                                                            </li>
1474                                                            <li>Ist das FSC-Logo richtig eingesetzt, ggf. Abstimmung und
1475                                                                Korrektur. Gestaltungsvorgaben und Download hier
1476                                                            </li>
1477                                                            <li>Wurde das richtige Dateiformat verwendet (z.B. PDF/X-4)?
1478                                                                Sind keine offenen oder verlinkten Dateien vergessen
1479                                                                worden?
1480                                                            </li>
1481                                                            <li>Sind alle Daten im CMYK-Modus und passt die Farbanzahl
1482                                                                zur Bestellung? Hinweis auf abweichende Farbwiedergabe
1483                                                                bei farbigen Materialien.
1484                                                            </li>
1485                                                            <li>Liegt die Auflösung aller Bilder bei mind. 300 dpi in
1486                                                                Originalgröße?
1487                                                            </li>
1488                                                            <li>Wurden alle Schriften korrekt eingebettet oder
1489                                                                vollständig in Pfade konvertiert?
1490                                                            </li>
1491                                                            <li>Sind Sonderfarben für z.B. Lack, Prägung oder Stanze
1492                                                                sauber benannt (z.B. „Lack“, „Stanze“) und als
1493                                                                Volltonfarbe angelegt? Nicht versehentlich überdruckend
1494                                                                gesetzt.
1495                                                            </li>
1496                                                            <li>Wurden Transparenzen reduziert und sind alle Ebenen auf
1497                                                                eine druckfähige Version reduziert?
1498                                                            </li>
1499                                                            <li>Softproof* zur Kontrolle</li>
1500                                                            <br>
1501                                                            <h4>Gestaltungsvorgaben für das FSC-Logo</h4>
1502                                                            <p>Erlaubte Farben: Grün (Pantone 626C), Schwarz oder Weiß
1503                                                                (negativ auf dunklem Hintergrund). Das Logo darf nicht
1504                                                                in anderen Farben verwendet oder eingefärbt werden.
1505                                                                Mindesthöhe: 7 mm (bei kleinen Verpackungen), 10 mm (bei
1506                                                                A5-Formaten oder größer. Das Logo darf nicht verzerrt
1507                                                                oder gestaucht werden.
1508                                                                Das Logo muss auf hellem, einfarbigem Hintergrund
1509                                                                platziert werden, sodass es gut lesbar ist. Es muss ein
1510                                                                Mindestabstand zu anderen Elementen eingehalten werden:
1511                                                                mindestens die Höhe der Buchstaben „FSC“ rund um das
1512                                                                Logo.
1513                                                                Das Logo darf nicht verändert, beschnitten, gedreht oder
1514                                                                mit anderen Elementen kombiniert werden.
1515                                                                Keine Effekte wie Schatten, Verläufe oder Umrandungen
1516                                                                hinzufügen.<br><br>
1517                                                                <b>Logo Platzhalter zum Download, das Richtige wird von
1518                                                                    uns platziert.</b><br><br>
1519                                                                <img src="/media/boxsys/images/MIX_Packaging_Landscape_BlackOnWhite.png" style="background:#ffffff;">
1520                                                                Download:
1521                                                                <a href="/media/boxsys/images/MIX_Packaging_Landscape_BlackOnWhite.svg" download>SVG</a>
1522                                                                oder
1523                                                                <a href="/media/boxsys/images/MIX_Packaging_Landscape_BlackOnWhite.png" download>PNG</a><br><br>
1524                                                                <img src="/media/boxsys/images/MIX_Packaging_Portrait_BlackOnWhite.png" style="background:#ffffff;">
1525                                                                Download:
1526                                                                <a href="/media/boxsys/images/MIX_Packaging_Portrait_BlackOnWhite.svg" download>SVG</a>
1527                                                                oder
1528                                                                <a href="/media/boxsys/images/MIX_Packaging_Portrait_BlackOnWhite.png" download>PNG</a>
1529                                                            </p>
1530                                                            <br><br>
1531                                                            <p><small>* Das Softproof (Bildschirmproof) ist eine
1532                                                                    digitale Vorschau des Druckergebnisses. Er
1533                                                                    ermöglicht die Überprüfung von Farben, Layout, Text
1534                                                                    und Bildern, um Fehler oder Abweichungen zu
1535                                                                    erkennen. Nicht korrekt angelegte Druckdaten könnten
1536                                                                    zu verkehrten Druckergebnissen führen. : Achten Sie
1537                                                                    auf den aktuellen Stand Ihrer
1538                                                                    PDF-Betrachtungs-Software (z.B. Adobe Acrobat
1539                                                                    Reader) und die richtigen Einstellungen. Vor allem
1540                                                                    die „Überdrucken-Vorschau“ muss immer eingeschaltet
1541                                                                    sein.</small></p>
1542                                                        </div>
1543                                                    </div>
1544                                                </div>
1545                                            </div>
1546                                            <p class="boxsys_config_container_header">Produktionskontrolle</p>
1547                                            <p class="boxsys_config_container_description">
1548                                                Eine kostenlose 3D-Ansicht zu Ihrer Kontrolle ist im Bestellablauf
1549                                                enthalten.
1550                                            </p>
1551                                            <div class="boxsys_service_container_static">
1552                                                <div class="boxsys_service_sec-1">
1553                                                                                                            <div class="boxsys_service_checkbox hide-noprint">
1554                                                            <input type="checkbox" id="service_1_s2_checkbox" name="form_service[]"
1555                                                                   value="s2"  checked="checked" />
1556                                                            <label for="service_1_s2_checkbox">Einfache Druckdatenprüfung (kostenlos)</label>
1557                                                        </div>
1558                                                                                                            <div class="boxsys_service_checkbox hide-noprint">
1559                                                            <input type="checkbox" id="service_1_s3_checkbox" name="form_service[]"
1560                                                                   value="s3" />
1561                                                            <label for="service_1_s3_checkbox">Erweiterte Druckdatenprüfung (15€)</label>
1562                                                        </div>
1563                                                                                                    </div>
1564                                            </div>
1565                                            <p class="boxsys_config_container_header">Kontrollmittel</p>
1566                                            <div class="boxsys_service_container_static">
1567                                                <div class="boxsys_service_sec-2">
1568                                                                                                            <div
1569                                                            class="boxsys_service_checkbox hide-noprint">
1570                                                            <input type="checkbox" id="service_2_s5_checkbox" name="form_service[]"
1571                                                                   value="s5" />
1572                                                            <label
1573                                                                for="service_2_s5_checkbox">Farbproof per Postversand vorab, auf DIN A3 verkleinert (30€)</label>
1574                                                        </div>
1575                                                                                                            <div
1576                                                            class="boxsys_service_checkbox">
1577                                                            <input type="checkbox" id="service_2_s7_checkbox" name="form_service[]"
1578                                                                   value="s7" />
1579                                                            <label
1580                                                                for="service_2_s7_checkbox">Unbedrucktes Muster aus Originalmaterial vorab (<span id="sample_u"><span class="price">8,89 €</span></span>)</label>
1581                                                        </div>
1582                                                                                                    </div>
1583                                            </div>
1584                                            <p class="boxsys_config_container_header">Präsentation</p>
1585                                            <div class="boxsys_service_container_static boxsys_container_selection_mlb">
1586                                                <div class="boxsys_service_sec-3">
1587                                                                                                            <div class="boxsys_service_checkbox">
1588                                                            <input type="checkbox" id="service_3_s12_checkbox" name="form_service[]"
1589                                                                   value="s12" />
1590                                                            <label for="service_3_s12_checkbox">Individuell angepasst an Ihr eingesandtes Produkt (30€)</label>
1591                                                        </div>
1592                                                                                                            <div class="boxsys_service_checkbox">
1593                                                            <input type="checkbox" id="service_3_s8_checkbox" name="form_service[]"
1594                                                                   value="s8" />
1595                                                            <label for="service_3_s8_checkbox">Hochwertiges 3D-Rendering zu Präsentationszwecken vorab (150€)</label>
1596                                                        </div>
1597                                                                                                    </div>
1598                                            </div>
1599                                            <p class="boxsys_config_container_header">Druckdaten-Erstellung</p>
1600                                            <div class="boxsys_service_container_static boxsys_container_selection_mlb">
1601                                                <div class="boxsys_service_sec-4">
1602                                                                                                            <div class="boxsys_service_checkbox hide-noprint">
1603                                                            <input type="checkbox" id="service_4_s11_checkbox" name="form_service[]"
1604                                                                   value="s11" />
1605                                                            <label for="service_4_s11_checkbox">FSC-Logo in Ihre Druckdaten platzieren  (25€)</label>
1606                                                        </div>
1607                                                                                                            <div class="boxsys_service_checkbox hide-noprint">
1608                                                            <input type="checkbox" id="service_4_s9_checkbox" name="form_service[]"
1609                                                                   value="s9" />
1610                                                            <label for="service_4_s9_checkbox">Reinzeichnung (75€)</label>
1611                                                        </div>
1612                                                                                                            <div class="boxsys_service_checkbox hide-noprint">
1613                                                            <input type="checkbox" id="service_4_s10_checkbox" name="form_service[]"
1614                                                                   value="s10" />
1615                                                            <label for="service_4_s10_checkbox">Gestaltung und Reinzeichnung (ab 150€)</label>
1616                                                        </div>
1617                                                                                        
1617            </div>
1618                                            </div>
1619                                        </div>
1620                                        <a class="submit config-container active">
1621                                            <input class="switch-tab back"
1622                                                   data-target="auflage"
1623                                                   value="&Lt;"
1624                                                   title="Zurück zur Auflage"
1625                                                   type="button">
1626                                            <input class="switch-tab next"
1627                                                   data-target="produktion"
1628                                                   value="WEITER&nbsp;&nbsp;&Gt;"
1629                                                   title="Weiter zu den Optionen"
1630                                                   type="button">
1631                                        </a>
1632                                    </div>
1633                                    <div class="boxsys-config-container" id="boxsys_produktion_container">
1634                                        <div class="boxsys-config-container_1">
1635                                            <div class="info">
1636                                                <span class="icon-info-sign">i</span>
1637                                                <div class="extra-info">
1638                                                    <div class="extra-info-con">
1639                                                        <div>
1640                                                            <p>
1641                                                                <span class="info-cross">x</span>Die Produktionszeit ist
1642                                                                die Zeit, in der Ihr Produkt bei uns im Hause
1643                                                                hergestellt wird und versandbereit ist. Beim Versand
1644                                                                kann es zu bestimmten Zeiten zu den
1645                                                                bekannten Abweichungen kommen. Bestellen
1646                                                                Sie Ihr Produkt daher besser rechtzeitig.
1647                                                            </p>
1648                                                        </div>
1649                                                    </div>
1650                                                </div>
1651                                            </div>
1652                                            <p class="boxsys_config_container_header">Produktionszeit</p>
1653                                            <div
1654                                                class="boxsys_produktion_container_static boxsys_container_selection_mlb form-control"
1655                                                id="calculation-form-prod-time"
1656                                                title='Produktionszeit'>
1657                                                <div id="prod_time_ins">
1658                                                                                                            <div class="boxsys_produktion_radio">
1659                                                            <!--suppress HtmlFormInputWithoutLabel -->
1660                                                            <input
1661                                                                id="production_value_t1"
1662                                                                type="radio"
1663                                                                class="boxsys_produktion_selection"
1664                                                                name="form_prod_time_id"
1665                                                                data-validate='{"required":true}'
1666                                                                value='t1'
1667                                                                >
1668                                                            <label
1669                                                                for="production_value_t1">Express                                                                : 10                                                                Werktage (Mo.-Fr.), Versand
1670                                                                am 20.10.2026</label>
1671                                                        </div>
1672                                                                                                            <div class="boxsys_produktion_radio">
1673                                                            <!--suppress HtmlFormInputWithoutLabel -->
1674                                                            <input
1675                                                                id="production_value_t2"
1676                                                                type="radio"
1677                                                                class="boxsys_produktion_selection"
1678                                                                name="form_prod_time_id"
1679                                                                data-validate='{"required":true}'
1680                                                                value='t2'
1681                                                                checked>
1682                                                            <label
1683                                                                for="production_value_t2">Standard                                                                : 16                                                                Werktage (Mo.-Fr.), Versand
1684                                                                am 28.10.2026</label>
1685                                                        </div>
1686                                                                                                            <div class="boxsys_produktion_radio">
1687                                                            <!--suppress HtmlFormInputWithoutLabel -->
1688                                                            <input
1689                                                                id="production_value_t3"
1690                                                                type="radio"
1691                                                                class="boxsys_produktion_selection"
1692                                                                name="form_prod_time_id"
1693                                                                data-validate='{"required":true}'
1694                                                                value='t3'
1695                                                                >
1696                                                            <label
1697                                                                for="production_value_t3">Economy                                                                : 23                                                                Werktage (Mo.-Fr.), Versand
1698                                                                am 06.11.2026</label>
1699                                                        </div>
1700                                                                                                    </div>
1701                                            </div>
1702                                        </div>
1703                                        <div class="boxsys-config-container_1" style="position: relative;">
1704                                            <div class="info" style="top: -3px; right: 2px;">
1705                                                <span class="icon-info-sign">i</span>
1706                                                <div class="extra-info">
1707                                                    <div class="extra-info-con">
1708                                                        <div>
1709                                                            <span class="info-cross">x</span>
1710                                                            <h3>Beste Druckqualität, im Offsetdruck</h3>
1711                                                            <p>
1712                                                                Kleine Mengen drucken wir preisgünstig im Digitaldruck.
1713                                                                Optional können Sie hier gegen einen Mehrpreis den
1714                                                                Offsetdruck wählen. Mehr Infos zu Druckqualitäten in
1715                                                                unserem Wikibeitrag
1716                                                                "<a href="https://www.boxsys.de/service/boxsys-wiki.html#wiki_druckqualitaet" target="_blank">Druckqualität
1717                                                                    verschiedener
1718                                                                    Verfa
1718hren</a>".
1719                                                            </p>
1720                                                            <h3>Beste Stanzqualität, mit Stanzwerkzeug </h3>
1721                                                            <p>
1722                                                                Kleine Mengen rillen und stanzen wir preisgünstig
1723                                                                digital mit einem Schneidplotter. Die Qualität der
1724                                                                Rillungen verbessert sich mit dem Einsatz von
1725                                                                Stanzwerkzeugen, die Sie hier gegen einen Mehrpreis
1726                                                                auswählen können. Mehr dazu in unserem Wikibeitrag
1727                                                                "<a href="https://www.boxsys.de/service/boxsys-wiki.html#wiki_stanztechniken" target="_blank">Stanztechniken,
1728                                                                    digital und analog</a>".
1729                                                            </p>
1730                                                        </div>
1731                                                    </div>
1732                                                </div>
1733                                            </div>
1734                                            <p class="boxsys_config_container_header">Qualität</p>
1735                                            <div
1736                                                class="boxsys_produktion_container_static boxsys_container_selection_mlb form-control"
1737                                                id="calculation-form-best-quality"
1738                                                title='Qualität'>
1739                                                <input
1740                                                    id="calc_select_offset"
1741                                                    type="checkbox"
1742                                                    name="form_calc_select_offset"
1743                                                    >
1744                                                <label class="label"
1745                                                       for="calc_select_offset"><span>Beste Qualität im Offsetdruck</span></label>
1746                                            </div>
1747                                            <div
1748                                                id="calculation-form-best-quality-fix"
1749                                                title='Qualität'>
1750                                                <input
1751                                                    id="calc_select_offset_fix"
1752                                                    type="checkbox"
1753                                                    name="form_calc_select_offset_fix"
1754                                                    onclick="return false" checked/>
1755                                                <label class="label" for="calc_select_offset_fix"><span>Beste Qualität im Offsetdruck</span></label>
1756                                            </div>
1757                                            <div
1758                                                class="boxsys_produktion_container_static boxsys_container_selection_mlb form-control"
1759                                                id="calculation-form-best-quality-cut"
1760                                                title='Qualität'>
1761                                                <input
1762                                                    id="calc_select_cut"
1763                                                    type="checkbox"
1764                                                    name="form_calc_select_cut"
1765                                                    >
1766                                                <label class="label" for="calc_select_cut"><span>Beste Qualität mit Stanzform</span></label>
1767                                            </div>
1768                                            <div
1769                                                id="calculation-form-best-quality-cut-fix"
1770                                                title='Qualität'>
1771                                                <input
1772                                                    id="calc_select_cut_fix"
1773                                                    type="checkbox"
1774                                                    name="form_calc_select_cut_fix"
1775                                                    onclick="return false" checked/>
1776                                                <label class="label" for="calc_select_cut_fix"><span>Beste Qualität mit Stanzform</span></label>
1777                                            </div>
1778                                        </div>
1779                                        <div class="boxsys-config-container_1 hide-noprint" style="position: relative;">
1780                                            <div class="info" style="top: -3px; right: 2px;">
1781                                                <span class="icon-info-sign">i</span>
1782                                                <div class="extra-info">
1783                                                    <div class="extra-info-con">
1784                                                        <div>
1785                                                            <span class="info-cross">x</span>
1786                                                            <h3>Druckbilder</h3>
1787                                                            <p>
1788                                                                Motive/Druckbilder/Versionen etc.
1789                                                            </p>
1790                                                        </div>
1791                                                    </div>
1792                                                </div>
1793                                            </div>
1794                                            <p class="boxsys_config_container_header">Anzahl der Druckmotive</p>
1795                                            <!--suppress HtmlFormInputWithoutLabel -->
1796                                            <select id="form_calc_select_motifs" name="form_motifs" onchange="motifsSync(this)">
1797                                                <option value="1" selected>1</option>
1798                                                <option value="2">2</option>
1799                                                <option value="3">3</option>
1800                                                <option value="4">4</option>
1801                                                <option value="5">5</option>
1802                                                <option value="6">6</option>
1803                                                <option value="7">7</option>
1804                                                <option value="8">8</option>
1805                                                <option value="9">9</option>
1806                                                <option value="10">10</option>
1807                                            </select>
1808                                        </div>
1809                                        
1809<script>
1810                                        function motifsSync(changed) {
1811                                            ['form_calc_select_motifs', 'form_calc_select_motifs_2'].forEach(function (id) {
1812                                                var sel = document.getElementById(id);
1813                                                if (sel && sel !== changed) sel.value = changed.value;
1814                                            });
1815                                        }
1816                                        </script>
1816
1817                                                                                <div class="boxsys-config-container_1">
1818                                            <p class="boxsys_config_container_header">Kundenname / Referenz</p>
1819                                            <div
1820                                                class="boxsys_produktion_container_static boxsys_container_selection_mlb form-control"
1821                                                id="calculation-form-customer-reference">
1822                                                <label class="label" for="calc_customer_reference"><span>Geben Sie Ihrer Konfiguration einen Namen:</span></label>
1823                                                <input
1824                                                    id="calc_customer_reference"
1825                                                    type="text"
1826                                                    name="form_customer_reference"
1827                                                    value="">
1828                                                <a class="submit active"><input id="update-customer-reference"
1829                                                                                value="Übernehmen"
1830                                                                                title="Übernehmen"
1831                                                                                type="button"></a>
1832                                            </div>
1833                                            <a class="submit config-container active">
1834                                                <input class="switch-tab back"
1835                                                       data-target="service"
1836                                                       value="&Lt;"
1837                                                       title="Zurück zum Service"
1838                                                       type="button">
1839                                                <div class="boxsys_config_button cart none"
1840                                                     title="Wähle zuerst Material, Farbigkeit und Auflage"
1841                                                     style="width: 80%;border-radius: 0 3px 3px 0;height: 45px;margin-top: 24px;">
1842                                                    IN DEN WARENKORB                                                </div>
1843                                                <input class="switch-tab next add-to-cart-clone"
1844                                                       data-target="add-to-cart"
1845                                                       value="In den Warenkorb"
1846                                                       title="IN DEN WARENKORB LEGEN"
1847                                                       type="button">
1848                                            </a>
1849                                        </div>
1850                                    </div>
1851                                </div>
1852                                <div class="boxsys_config_center">
1853                                                                            <iframe src="/media/vkalk/144813/3d.html" id="3d-frame" scrolling="no"></iframe>
1854                                                                        <div id="boxsys_2d_button">
1855                                        2D
1856                                    </div>
1857                                    <div id="boxsys_3d_button">
1858                                        3D
1859                                    </div>
1860                                </div>
1861                            </div>
1862                        </div>
1863                        <div class="boxsys_config_right">
1864                            <div class="boxsys_config_right_button">
1865                                <div>
1866                                    <div class="boxsys_button_design boxsys_vorlagen"
1867                                         style="color:#fff;background-color:#1174BB;border-left: solid 1px #1174BB;">
1868                                        Designvorlagen
1869                                        <div class="boxsys_vorlagen_menu">
1870                                            <ul>
1871                                                <li id="download-noprint"
1872                                                    class="boxsys_config_left_button noprint" style="display: none;">
1873                                                    Unbedruckt: Kein Design benötigt.                                                </li>
1874                                                                                                                                                        <li class="download-out">
1875                                                        <a id="download-opener-out">Designvorlage / Stanzdatei
1876                                                            (außen)</a>
1877                                                    </li>
1878                                                    <!-- Download-Modal -->
1879                                                    <!-- Download-Modal -->
1880<div id="modal-download-out" style="display: none;">
1881    <div class="modal-wrapper">
1882        <h3>Hinweis</h3>
1883        <p>Die herunterladbare Designvorlage ist mit umlaufenden 20 mm Rand angelegt. Nachdem Sie Ihre im offenen Format angelegten Daten bei BOXSYS zum Druck hochgeladen haben, können Sie ihr Produkt in der 3D-Ansicht überprüfen. Dafür werden die 20 mm Rand gebraucht, bitte behalten Sie die beim Gestaltungsprozess bei. Druckbar sind die Daten mit jedem abweichendem Rand, nur die 3D-Kontrollmöglichkeit entfällt.</p>
1884        <p>Weitere, allgemeine Infos finden sie unter Service, Druckdaten.</p>
1885        <p>
1885Beachten Sie bitte auch, dass beim Design-Upload nur Dateien mit einer Größe von maximal 200 MB hochgeladen werden können.</p>
1886    </div>
1887</div>
1888<script type="text/javascript">
1889    require([
1890        "jquery",
1891        "Magento_Ui/js/modal/modal"
1892    ], function ($, modal) {
1893        const options = {
1894            type: 'popup',
1895            responsive: true,
1896            modalClass: 'download-modal',
1897            buttons: [{
1898                text: $.mage.__('Download'),
1899                class: '',
1900                click: function () {
1901                    const url = '/media/vkalk/144813/boxsys-144813-aussen.pdf';
1902                    window.open(url);
1903                    $modal.modal('closeModal');
1904                }
1905            }]
1906        };
1907        const $modal = $('#modal-download-out'), $opener = $('#download-opener-out');
1908        modal(options, $modal);
1909        $opener.click(function () {
1910            $modal.modal('openModal');
1911        });
1912    });
1913</script>
1913
1914                                                                                                                                                        <li class="download-in" style="display: none;">
1915                                                        <a id="download-opener-in">Designvorlage / Stanzdatei
1916                                                            (innen)</a>
1917                                                    </li>
1918                                                    <!-- Download-Modal -->
1919                                                    <!-- Download-Modal -->
1920<div id="modal-download-in" style="display: none;">
1921    <div class="modal-wrapper">
1922        <h3>Hinweis</h3>
1923        <p>Die herunterladbare Designvorlage ist mit umlaufenden 20 mm Rand angelegt. Nachdem Sie Ihre im offenen Format angelegten Daten bei BOXSYS zum Druck hochgeladen haben, können Sie ihr Produkt in der 3D-Ansicht überprüfen. Dafür werden die 20 mm Rand gebraucht, bitte behalten Sie die beim Gestaltungsprozess bei. Druckbar sind die Daten mit jedem abweichendem Rand, nur die 3D-Kontrollmöglichkeit entfällt.</p>
1924        <p>Weitere, allgemeine Infos finden sie unter Service, Druckdaten.</p>
1925        <p>Beachten Sie bitte auch, dass beim Design-Upload nur Dateien mit einer Größe von maximal 200 MB hochgeladen werden können.</p>
1926    </div>
1927</div>
1928<script type="text/javascript">
1929    require([
1930        "jquery",
1931        "Magento_Ui/js/modal/modal"
1932    ], function ($, modal) {
1933        const options = {
1934            type: 'popup',
1935            responsive: true,
1936            modalClass: 'download-modal',
1937            buttons: [{
1938                text: $.mage.__('Download'),
1939                class: '',
1940                click: function () {
1941                    const url = '/media/vkalk/144813/boxsys-144813-innen.pdf';
1942                    window.open(url);
1943                    $modal.modal('closeModal');
1944                }
1945            }]
1946        };
1947        const $modal = $('#modal-download-in'), $opener = $('#download-opener-in');
1948        modal(options, $modal);
1949        $opener.click(function () {
1950            $modal.modal('openModal');
1951        });
1952    });
1953</script>
1953
1954                                                                                            </ul>
1955                                        </div>
1956                                    </div>
1957                                    <div class="boxsys_button_design boxsys_vorlagen"
1958                                         style="border-left: solid 1px #1174BB;">Infos
1959                                        <div class="boxsys_vorlagen_menu">
1960                                            <ul>
1961                                                                                                    <li>
1962                                                        <a href="/media/boxsys/produktdatenblatt/boxsys_pdb_fs_sb.pdf"
1963                                                           target="_blank">Produktdatenblatt</a>
1964                                                    </li>
1965                                                                                                <li class="hide-noprint">
1966                                                    <a href="/media/boxsys/boxsys_druckdaten_erstellung.pdf"
1967                                                       target="_blank">Druckdatenanleitung</a>
1968                                                </li>
1969                                            </ul>
1970                                        </div>
1971                                    </div>
1972                                </div>
1973                                <div>
1974                                                                            <div class="boxsys_button_design boxsys_vorlagen" id="printess-noprint" style="display: none;">
1975                                            Online-Designer                                            <div class="boxsys_vorlagen_menu">
1976                                                <ul>
1977                                                    <li class="boxsys_config_left_button noprint">
1978                                                        Unbedruckt: Kein Design benötigt.                                                    </li>
1979                                                </ul>
1980                                            </div>
1981                                        </div>
1982                                        <div class="boxsys_button_design boxsys_vorlagen" id="printess-opener" >
1983                                            <!-- Online-Designer-Button -->
1984                                            <a href="#" id="layer-printess-opener"
1985                                               style="display: none;"
1986                                               title="Online-Designer">
1987                                                Online-Designer                                            </a>
1988                                            <div class="boxsys_vorlagen_menu">
1989                                                <ul>
1990                                                    <li id="printess-dismiss" style="display: none;" >
1991                                                        <a href="#" data-confirm="Möchten Sie wirklich Ihre Gestaltung endgültig löschen?">verwerfen</a>
1992                                                    </li>
1993                                                </ul>
1994                                            </div>
1995                                        </div>
1996                                                                        <div class="boxsys_button_design boxsys_vorlagen boxsys_uploads">Design-Upload
1997                                        <div class="boxsys_vorlagen_menu">
1998                                            <ul>
1999                                                <li id="upload-noprint"
2000                                                    class="boxsys_config_left_button noprint"
2001                                                     style="display: none;">
2002                                                    Kein Upload benötigt.                                                </li>
2003                                                                                                    <li id="upload-out">
2004                                                        <div class="boxsys_button_design boxsys_config_left_button file_upload">
2005                                                            <input type="file" name="form_upload_out"
2006                                                                   id="calculation-form-upload-out"
2007                                                                   class="form-control form-upload-input"
2008                                                                   title="Eigenes Design (PDF)"/>
2009                                                            <span class="form-upload-trigger">Außen (PDF)</span>
2010                                                        </div>
2011                                                        <div id="upload-info-out"
2012                                                             class="upload_info boxsys_config_left_button"  style="display: none;">
2013                                                            <a id="upload-link-out"
2014                                                               href="/media/vkalk/144813/uploads/"
2015                                                               target="_blank">
2016                                                                außen ansehen                                                            </a>
2017                                                            <a id="upload-delete-link-out"
2018                                                               href="#"
2019                                                               data-confirm="Möchten Sie wirklich Ihren Upload für außen endgültig löschen?">
2020                                                                X
2021                                                            </a>
2022                                                            <input type="hidden" id="upload-delete-out" name="form_upload_delete_out" value="0"/>
2023                                                        </div>
2024                                                    </li>
2025                                                                                                    <li id="upload-in" style="display: none;">
2026                                                        <div class="boxsys_button_design boxsys_config_left_button file_upload">
2027                                                            <input type="file" name="form_upload_in"
2028                                                                   id="calculation-form-upload-in"
2029                                                                   class="form-control form-upload-input"
2030                                                                   title="Eigenes Design (PDF)"/>
2031                                                            <span class="form-upload-trigger">Innen (PDF)</span>
2032                                                        </div>
2033                                                        <div id="upload-info-in"
2034                                                             class="upload_info boxsys_config_left_button"  style="display: none;">
2035                                                            <a id="upload-link-in"
2036                                                               href="/media/vkalk/144813/uploads/"
2037                                                               target="_blank">
2038                                                                innen ansehen                                                            </a>
2039                                                            <a id="upload-delete-link-in"
2040                                                               href="#"
2041                                                               data-confirm="Möchten Sie wirklich Ihren Upload für innen endgültig löschen?">
2042                                                                X
2043                                                            </a>
2044                                                            <input type="hidden" id="upload-delete-in" name="form_upload_delete_in" value="0"/>
2045                                                        </div>
2046                                                    </li>
2047                                                                                                <input type="hidden" id="has-upload" value="0">
2048                                                <!-- for online designer -->
2049                                            </ul>
2050                                        </div>
2051                                    </div>
2052                                </div>
2053                            </div>
2054                            <div class="boxsys_config_zusammenfassung">
2055                                <!-- Share-Button -->
2056                                <a href="#" id="modal-share-opener" style="display: none;"
2057                                   title="Konfiguration senden">
2058                                    <i class="fa-solid fa-share-alt"></i>
2059                                </a>
2060                                <div class="boxsys_config_zusammenfassung_fp">ZUSAMMENFASSUNG<br>
2061                                    <span>Versand und Lieferung</span>
2062                                    <div class="info versand">
2063                                        <span class="icon-info-sign versand">i</span>
2064                                        <div class="extra-info">
2065                                            <div class="extra-info-con">
2066                                                <div>
2067                                                    <p>
2068                                                        <span class="info-cross">x</span>Die genannten Preise verstehen
2069                                                        sich ab Werk.
2070                                                        Versandkosten sind erst im Warenkorb einsehbar und werden dort
2071                                                        nach Versand-Art und -Adresse berechnet. Bei Sammelbestellungen
2072                                                        reduzieren sich die Kosten.
2073                                                    </p>
2074                                                </div>
2075                                            </div>
2076                                        </div>
2077                                    </div>
2078                                </div>
2079                                <!-- Save-Button -->
2080                                <div class="boxsys_config_save">
2081                                                                            <a class="submit active">
2082                                            <input id="save-calculation"
2083                                                   style="display: none;"
2084                                                   title="Konfiguration speichern"
2085                                                   type="button">
2086                                        </a>
2087                                        <!--suppress JSUnresolvedReference -->
2088                                        
2088<script>
2089                                            require([
2090                                                'jquery',
2091                                                'Magento_Ui/js/modal/modal',
2092                                                'Magento_Customer/js/model/authentication-popup',
2093                                                'Magento_Customer/js/customer-data'
2094                                            ], function ($, modal, authenticationPopup, customerData) {
2095                                                $(document).ready(function () {
2096                                                    $.removeCookie('login_redirect'); // Reset
2097                                                    const saveCalculationButton = $('#save-calculation');
2098                                                    const saveCalculationUrl = "https://www.boxsys.de/calculation/index/save/calculation_id/144813/";
2099                                                    saveCalculationButton.on('click', function (event) {
2100                                                        event.preventDefault();
2101                                                        $('#submitting').val('1');
2102                                                        const toggleUpdate = $('#toggle-update'); // Bridge to update on form
2103                                                        const customer = customerData.get('customer');
2104                                                        toggleUpdate.val(1).trigger('change');
2105                                                        if (!customer().firstname) {
2106                                                            // Not logged-in users have to log in first
2107                                                            $.cookie('login_redirect', saveCalculationUrl); // Redirect to save calculation after login or registration
2108                                                            authenticationPopup.showModal();
2109                                                            return false;
2110                                                        }
2111                                                        // Logged in users
2112                                                        $saveModal.modal('openModal');
2113                                                        return false;
2114                                                    });
2115                                                    saveCalculationButton.show();
2116                                                    // Save-modal
2117                                                    const options = {
2118                                                        type: 'popup',
2119                                                        responsive: true,
2120                                                        modalClass: 'save-modal',
2121                                                        buttons: [{
2122                                                            text: $.mage.__('Save'),
2123                                                            class: '',
2124                                                            click: function () {
2125                                                                const saveForm = $("#calculation-save-form");
2126                                                                saveForm.submit();
2127                                                            }
2128                                                        }]
2129                                                    };
2130                                                    const $saveModal = $('#modal-save');
2131                                                    modal(options, $saveModal);
2132                                                });
2133                                            });
2134                                        </script>
2134
2135                                                                    </div>
2136                                <!-- Print-Button -->
2137                                <!--suppress DuplicatedCode -->
2138                                <a href="#" id="print-offer" style="display: none;" title="Angebot drucken">
2139                                    <i class="fa-solid fa-print"></i>
2140                                </a>
2141                                <div class="boxsys_config-list switch-tab active" id="boxsys_config_format"
2142                                     data-target="format">
2143                                    <p>
2144                                        Format in mm
2145                                        (<span class="summary-format-title">Innenmaß / Außenmaß</span>)
2146                                        <br>
2147                                        <span class="summary-format">60 x 40 x 100 mm / 61,5 x 41,5 x 102,5 mm</span>
2148                                    </p>
2149                                </div>
2150                                <div class="boxsys_config-list switch-tab" id="boxsys_config_material"
2151                                     data-target="material">
2152                                    <p>
2153                                        Material
2154                                        <br>
2155                                        <span class="summary-material-name">Chromosulfatkarton</span>&nbsp;
2156                                        <span class="summary-material-subname">FSC® Mix 300-400 g/m²</span>&nbsp;
2157                                        <span class="summary-material-subname_2"></span>&nbsp;
2158                                        <span class="summary-material-subname_3 boxsys_config_zusammenfassung_grün"></span>
2159                                    </p>
2160                                </div>
2161                                <div class="boxsys_config-list switch-tab" id="boxsys_config_bedruckung"
2162                                     data-target="bedruckung">
2163                                    <p>
2164                                        Farbigkeit<br>
2165                                        <span
2166                                            class="summary-printing-name">4/0c Euroskala</span>&nbsp;
2167                                        <span
2168                                            class="summary-printing-process">(Offsetdruck)</span>
2169                                    <div id="info_digital_farbe" class="info farbe">
2170                                        <span class="icon-info-sign">i</span>
2171                                        <div class="extra-info">
2172                                            <div class="extra-info-con">
2173                                                <div>
2174                                                    <p><span class="info-cross">x</span>Boxsys druckt je nach Format und
2175                                                        Auflage im Offsetdruck, im Digitaldruck und im UV-Inkjet,
2176                                                        jeweils mit den besten Systemen der Marktführer. Hier wurde der
2177                                                        UV-Inkjet ausgewählt der bei feinen Details und kleinen
2178                                                        Schriftgrößen Unschärfen hat. Lesen Sie dazu auch unseren
2179                                                        ausführlichen Wikibeitrag "<b>Druckqualität verschiedener
2180                                                            Verfa
2180hren</b>". <br>Bei vielen Produkten können Sie
2181                                                        alternativ unter dem Reiter „Optionen“ die Qualität
2182                                                        „Offsetdruck“ wählen.
2183                                                    </p>
2184                                                </div>
2185                                            </div>
2186                                        </div>
2187                                    </div>
2188                                </div>
2189                                <div class="boxsys_config-list switch-tab" id="boxsys_config_auflage" data-target="auflage">
2190                                    <p>
2191                                        Auflage<br>
2192                                        <span class="summary-quantity">10.000 Stück</span>
2193                                    </p>
2194                                </div>
2195                                <div class="boxsys_config-list" id="boxsys_config_veredelung">
2196                                    <p>
2197                                        Veredelung<br>
2198                                        <span class="summary-finishing-process">Lackierung: Dispersionslack</span>
2199                                    </p>
2200                                </div>
2201                                <div class="boxsys_config-list" id="boxsys_config_ausfuehrung">
2202                                    <p>
2203                                        Verarbeitung<br>
2204                                        <span class="summary-calc-cut-name">stanzen</span>, <span class="summary-processing">kleben, flachliegend verpackt</span>
2205                                    </p>
2206                                </div>
2207                                <div class="boxsys_config-list switch-tab" id="boxsys_config_service"
2208                                     data-target="service">
2209                                    <p>
2210                                        Service<br>
2211                                        <span class="summary-services">Einfache Druckdatenprüfung (kostenlos)</span>
2212                                    </p>
2213                                </div>
2214                                <div class="boxsys_config-list switch-tab" id="boxsys_config_produktionszeit" data-target="produktion">
2215                                    <p>
2216                                        Produktionszeit
2217                                        <br>
2218                                        <span class="summary-prod-time">Standard - 16 Werktage (Mo.-Fr.)</span>
2219                                    </p>
2220                                </div>
2221                                <div class="boxsys_config-list" id="boxsys_config_co2">
2222                                    <div class="info info-zf">
2223                                        <span class="icon-info-sign icon-info-sign-g">i</span>
2224                                        <div class="extra-info">
2225                                            <div class="extra-info-con">
2226                                                <div>
2227                                                    <p><span class="info-cross">x</span>Hier wird Ihnen das genaue
2228                                                        Gewicht Ihres Druckproduktes (Stückgewicht), das Gesamtgewicht
2229                                                        und die bei der Herstellung entstehende CO₂-Emission angezeigt.
2230                                                        Als eine der
2231                                                        führenden Umweltdruckereien Deutschlands achten wir auf einen
2232                                                        besonders niedrigen CO₂-Fußabdruck.<br>
2233                                                        Mehr dazu auch auf unserer <a href="/umwelt-nachhaltigkeit"
2234                                                                                      target="_blank">Umweltseite</a>.<br><br>
2235                                                        Die unvermeidbare Emission gleichen wir für Sie aus, Ihr
2236                                                        Druckprodukt wird Ihnen somit vollständig klima kompensiert
2237                                                        (klimaneutral) geliefert.<br><br>
2238                                                        Für Ihr Produkt gleichen wir im Einzelnen diese CO₂-Emission
2239                                                        aus:<br><br></p>
2240                                                    <div class="boxsys_co2_info_grid">
2241                                                        <div style="text-align: left;">Material:</div>
2242                                                        <div style="text-align: right;">
2243                                                            <span class="summary-material-co2-total">80,60 kg</span>
2244                                                        </div>
2245                                                        <div style="text-align: left;">Druck:</div>
2246                                                        <div style="text-align: right;">
2247                                                            <span class="summary-printing-co2-total">41,12 kg</span>
2248                                                        </div>
2249                                                        <div style="text-align: left;">Verarbeitung:</div>
2250                                                        <div style="text-align: right;">
2251                                                            <span class="summary-co2-processing">88,31 kg</span>
2252                                                        </div>
2253                                                        <div style="text-align: left; margin-top: 10px;"><b>Gesamt:</b>
2254                                                        </div>
2255                                                        <div style="text-align: right; margin-top: 10px;">
2256                                                            <span class="summary-co2-total" style="font-weight: bold;">210 kg</span>
2257                                                        </div>
2258                                                    </div>
2259                                                </div>
2260                                            </div>
2261                                        </div>
2262                                    </div>
2263                                    <p>
2264                                        Einzelgewicht / Gesamtgewicht / <span
2265                                            class="boxsys_config_zusammenfassung_grün">CO₂ </span>
2266                                        <br>
2267                                        <span
2268                                            class="summary-weight-single">12 g</span>
2269                                        <span> / </span>
2270                                        <span
2271                                            class="summary-weight-total">116,47 kg</span>
2272                                        <span> / </span>
2273                                        <span
2274                                            class="summary-co2-total boxsys_config_zusammenfassung_grün">210 kg</span>
2275                                        <span class="boxsys_config_zusammenfassung_grün">
2276                                            <small>(CO₂-Kompensierung durch BOXSYS)</small>
2277                                        </span>
2278                                    </p>
2279                                </div>
2280                                <hr style="width: 100%;margin: 0;">
2281                                <div class="boxsys_config_rechts">
2282                                    <div class="boxsys_config_bottom_container_rechts_auflage">
2283                                        Vorauswahl Auflage: <span
2284                                            class="summary-quantity">10.000 Stück</span>
2285                                    </div>
2286                                    <div class="boxsys_config_bottom_container_rechts kosten">
2287                                        <div class="boxsys_config_button_rechts">
2288                                            <div class="boxsys_config_description_rechts">
2289                                                <p>
2290                                                    <b>Stückpreis netto</b> / brutto<br>
2291                                                    <span class="summary-calc-price-unit"
2292                                                          style="color: #1174BB;"><span class="price">0,19 €</span></span>
2293                                                    &nbsp;/&nbsp;
2294                                                    <span class="summary-calc-price-unit-brutto"
2295                                                          style="color: #777777;"><span class="price">0,23 €</span></span>
2296                                                    <span style="color: #777777;">*</span>
2297                                                </p>
2298                                                <p>
2299                                                    <b>Gesamtpreis netto</b>&nbsp;/&nbsp;brutto<br>
2300                                                    <span class="summary-calc-price"
2301                                                          style="color: #1174BB;"><span class="price">1.929,26 €</span></span>
2302                                                    &nbsp;/&nbsp;
2303                                                    <span class="summary-calc-price-brutto"
2304                                                          style="color: #777777;"><span class="price">2.295,82 €</span></span>
2305                                                    <span style="color: #777777;">*</span>
2306                                                </p>
2307                                            </div>
2308                                        </div>
2309                                        <p>* ohne Versandkosten; Bruttopreise inkl. der gesetzlichen MwSt. von
2310                                            19&nbsp;%</p>
2311                                    </div>
2312                                </div>
2313                            </div>
2314                            <div class="boxsys_config_right_bottom">
2315                                <div class="boxsys_config_button cart none"
2316                                     title="Wähle zuerst Material, Farbigkeit und Auflage">
2317                                    IN DEN WARENKORB                                </div>
2318                                <div class="boxsys_config_button cart" id="cart-final">
2319                                    <input type="hidden" name="product_id"
2320                                           value="boxsys_fs_sb">
2321                                    <input type="hidden" name="calculation_id" value="144813">
2322                                    <input type="hidden" name="item_id" id="item_id" value="">
2323                                    <input name="form_key" type="hidden" value="e1pawflSdLlOCitA" />                                    IN DEN WARENKORB                                    <button id="add-to-cart-button" style="width: 100%;height: 100%;opacity: 0;"
2324                                            type="submit" title="In den Warenkorb legen"
2325                                            class="action submit primary"></button>
2326                                </div>
2327                                <div class="boxsys_config_button muster">
2328                                    <a href="#" id="modal-inquiry-white-sample-opener"
2329                                       style="display:none;">Weißmuster</a>
2330                                </div>
2331                                <div class="boxsys_config_button muster">
2332                                    <a href="#" id="modal-inquiry-printed-sample-opener" style="display:none;">Bedrucktes
2333                                        Muster</a>
2334                                </div>
2335                                <div class="boxsys_config_button help">
2336                                    <a href="#" id="modal-inquiry-opener" style="display:none;">Brauchen Sie Hilfe?</a>
2337                                </div>
2338                            </div>
2339                        </div>
2340                    </div>
2341                </div>
2342            </main>
2343        </form>
2344    </div>
2345    <div id="modal-save" style="display: none;">
2346        <div class="modal-wrapper" style="margin-bottom:-20px;">
2347            <p>Ihre Konfiguration wird gespeichert und kann unter „Mein Konto“ geöffnet werden.</p>
2348            <form
2349                class="form calculation-save"
2350                action="https://www.boxsys.de/calculation/index/save/"
2351                id="calculation-save-form"
2352                method="post">
2353                <input name="form_key" type="hidden" value="e1pawflSdLlOCitA" />                <input type="hidden" name="hideit" value=""/>
2354                <input type="hidden" name="calculation_id" value="144813"/>
2355                <label>
2356                    Optional – Projektnamen eingeben:
2357                    <input type="text" name="name" value=""/>
2358                </label>
2359            </form>
2360        </div>
2361    </div>
2362    <!-- Share-Modal -->
2363<div id="modal-share" style="display: none;">
2364    <div class="modal-wrapper">
2365        <h3>Teilen Sie die aktuelle Konfiguration per Mail mit bis zu 3 Empfängern.</h3>
2366        <p>Sie wird nicht gespeichert, kann aber 30 Tage über den erzeugten Link erneut aufgerufen werden.</p>
2367        <form
2368            class="form calculation-share"
2369            action=""
2370            id="calculation-share-form"
2371            method="post"
2372            data-mage-init='{"validation":{}}'
2373            data-hasrequired="* Required Fields">
2374            <input type="hidden" name="calculation_id" value="144813">
2375            <input name="form_key" type="hidden" value="e1pawflSdLlOCitA" />            <input type="hidden" name="hideit" id="hideit" value=""/>
2376            <fieldset class="fieldset">
2377                <div class="field form_email required">
2378                    <label class="label" for="email"><span>an folgende E-Mail:</span></label>
2379                    <div class="control">
2380                        <input name="email"
2381                               id="calculation-share-form-email"
2382                               title="E-Mail"
2383                               value=""
2384                               class="input-text"
2385                               type="email"
2386                               data-validate="{required:true, 'validate-email':true}"/>
2387                    </div>
2388                </div>
2389                <div class="field form_email" id="calculation-share-form-email-2-wrapper" style="display: none;">
2390                    <label class="label" for="email"><span>zusätzliche E-Mail:</span></label>
2391                    <div class="control">
2392                        <input name="email_2"
2393                               id="calculation-share-form-email-2"
2394                               title="E-Mail"
2395                               value=""
2396                               class="input-text"
2397                               type="email"
2398                               data-validate="{'validate-email':true}"/>
2399                    </div>
2400                </div>
2401                <div class="field form_email" id="calculation-share-form-email-3-wrapper" style="display: none;">
2402                    <label class="label" for="email"><span>zusätzliche E-Mail:</span></label>
2403                    <div class="control">
2404                        <input name="email_3"
2405                               id="calculation-share-form-email-3"
2406                               title="E-Mail"
2407                               value=""
2408                               class="input-text"
2409                               type="email"
2410                               data-validate="{'validate-email':true}"/>
2411                    </div>
2412                </div>
2413                <div class="field form_message">
2414                    <label class="label" for="email"><span>Nachricht:</span></label>
2415                    <div class="control">
2416                        <textarea name="message"
2417                                  id="calculation-share-form-message"
2418                                  title="Nachricht"
2419                                  rows="5"></textarea>
2420                    </div>
2421                </div>
2422            </fieldset>
2423        </form>
2424        <div class="response"></div>
2425    </div>
2426</div>
2427<script type="text/javascript">
2428    require([
2429        "jquery",
2430        "Magento_Ui/js/modal/modal"
2431    ], function ($, modal) {
2432        const options = {
2433            type: 'popup',
2434            responsive: true,
2435            modalClass: 'share-modal',
2436            buttons: [{
2437                text: $.mage.__('Submit'),
2438                class: '',
2439                click: function () {
2440                    const shareForm = $("#calculation-share-form");
2441                    if (shareForm.validation('isValid')) {
2442                        $.ajax({
2443                            url: "https://www.boxsys.de/calculation/ajax/share/",
2444                            type: 'POST',
2445                            data: shareForm.serialize(),
2446                            showLoader: true,
2447                            cache: false,
2448                            success: function (response) {
2449                                if (response.success === true) {
2450                                    $('.share-modal .response').html('<span style="color:rgba(102, 150, 64, 0.9);">' + response.success_message + '</span>');
2451                                    $('.share-modal #calculation-share-form-email').removeAttr('value');
2452                                    $('.share-modal form').hide();
2453                                    $('.share-modal .modal-footer').hide();
2454                                } else {
2455                                    $('.share-modal .response').html('<span style="color:#e02b27;">' + response.error_messages + '</span>');
2456                                }
2457                            },
2458                            error: function (response) {
2459                                console.log('An error occurred.');
2460                                console.log(response);
2461                                $('.share-modal .response').html('<span style="color:#e02b27;">' + $.mage.__('An error occurred while processing your form. Please try again later.') + '</span>');
2462                            },
2463                        });
2464                    }
2465                }
2466            }]
2467        };
2468        const $modal = $('#modal-share'), $opener = $('#modal-share-opener');
2469        modal(options, $modal);
2470        $opener.click(function () {
2471            const calculationForm = $('#calculation-form');
2472            calculationForm.validation('clearError'); // Prevent duplicate errors from previous validation (onchange)
2473            if (calculationForm.validation() && calculationForm.validation('isValid')) {
2474                $('.share-modal .response').html('');
2475                $('.share-modal form').show();
2476                $('.share-modal .modal-footer').show();
2477                $modal.modal('openModal');
2478            }
2479        });
2480        $('#calculation-share-form').on("keyup keypress", function (e) {
2481            const code = e.keyCode || e.which;
2482            if (code === 13) {
2483                e.preventDefault();
2484                return false;
2485            }
2486        });
2487        $('#calculation-share-form-email').on("keyup keypress", function () {
2488            $('#calculation-share-form-email-2-wrapper').show();
2489        });
2490        $('#calculation-share-form-email-2').on("keyup keypress", function () {
2491            $('#calculation-share-form-email-3-wrapper').show();
2492        });
2493        $(document).ready(function () {
2494            $('#modal-share-opener').show(); // Share-Button
2495        });
2496    });
2497</script>
2497
2498<!-- Inquiry-Modal -->
2499<div id="modal-inquiry" style="display: none;">
2500    <div class="modal-wrapper" style="margin-bottom:-20px;">
2501        <h2 style="margin-top:-40px;">Brauchen Sie Hilfe?</h2>
2502        Senden Sie uns das ausgefüllte Formular oder rufen Sie uns an: <a href="tel:+494088919149"><b>+49 40 - 88 91 91 49</b></a>
2503        <form
2504            class="form calculation-inquiry"
2505            action=""
2506            id="calculation-inquiry-form"
2507            method="post"
2508            data-mage-init='{"validation":{}}'
2509            data-hasrequired="* Required Fields">
2510            <input name="form_key" type="hidden" value="e1pawflSdLlOCitA" />            <input type="hidden" name="hideit" id="hideit" value=""/>
2511            <input type="hidden" name="product_id" id="product-id" value="boxsys_fs_sb"/>
2512            <h3 style="font-size:16px !important; line-height: 20px;">Ihre Kontaktangaben</h3>
2513            <fieldset class="fieldset">
2514                <div class="field form_company">
2515                    <label class="label" for="company"><span>Firma</span></label>
2516                    <div class="control">
2517                        <input name="company"
2518                               id="inquiry-form-company"
2519                               title="Firma"
2520                               value=""
2521                               class="input-text"
2522                               type="text"/>
2523                    </div>
2524                </div>
2525                <div class="field form_name required">
2526                    <label class="label" for="name"><span>Name</span></label>
2527                    <div class="control">
2528                        <input name="name"
2529                               id="inquiry-form-name"
2530                               title="Name"
2531                               value=""
2532                               class="input-text"
2533                               type="text"
2534                               data-validate='{"required":true}'/>
2535                    </div>
2536                </div>
2537                <div class="field form_email required">
2538                    <label class="label" for="email"><span>E-Mail</span></label>
2539                    <div class="control">
2540                        <input name="email"
2541                               id="inquiry-form-email"
2542                               title="E-Mail"
2543                               value=""
2544                               class="input-text"
2545                               type="email"
2546                               data-validate="{required:true, 'validate-email':true}"/>
2547                    </div>
2548                </div>
2549                <div class="field form_telephone">
2550                    <label class="label" for="telephone"><span>Telefon</span></label>
2551                    <div class="control">
2552                        <input name="telephone"
2553                               id="inquiry-form-telephone"
2554                               title="Telefon"
2555                               value=""
2556                               class="input-text"
2557                               type="tel"/>
2558                    </div>
2559                </div>
2560                <h3 style="font-size:16px !important; line-height: 20px;">Ihre Produktangaben</h3>
2561                <div class="field form_product required">
2562                    <label class="label" for="product"><span>Produkt</span></label>
2563                    <div class="control">
2564                        <input name="product"
2565                               id="inquiry-form-product"
2566                               title="Produkt"
2567                               value="Faltschachtel mit Steckboden"
2568                               class="input-text"
2569                               type="text"
2570                               data-validate='{"required":true}'/>
2571                    </div>
2572                </div>
2573            </fieldset>
2574            <div class="small-input-wrapper">
2575                <fieldset class="fieldset">
2576                                            <div class="field form_a small-input">
2577                            <label class="label" for="inquiry-form-a"><span>Länge</span></label>
2578                            <div class="control">
2579                                <input name="form_a"
2580                                       id="inquiry-form-a"
2581                                       title="Länge"
2582                                       value=""
2583                                       class="input-text"
2584                                       type="text"/>
2585                            </div>
2586                        </div>
2587                                            <div class="field form_b small-input">
2588                            <label class="label" for="inquiry-form-b"><span>Breite</span></label>
2589                            <div class="control">
2590                                <input name="form_b"
2591                                       id="inquiry-form-b"
2592                                       title="Breite"
2593                                       value=""
2594                                       class="input-text"
2595                                       type="text"/>
2596                            </div>
2597                        </div>
2598                                            <div class="field form_h small-input">
2599                            <label class="label" for="inquiry-form-h"><span>
2599Höhe</span></label>
2600                            <div class="control">
2601                                <input name="form_h"
2602                                       id="inquiry-form-h"
2603                                       title="Höhe"
2604                                       value=""
2605                                       class="input-text"
2606                                       type="text"/>
2607                            </div>
2608                        </div>
2609                                    </fieldset>
2610            </div>
2611            <fieldset class="fieldset">
2612                <div class="field form_material">
2613                    <label class="label" for="height"><span>Material</span></label>
2614                    <div class="control">
2615                        <input name="form_material"
2616                               id="inquiry-form-material"
2617                               title="Material"
2618                               value=""
2619                               class="input-text"
2620                               type="text"/>
2621                    </div>
2622                </div>
2623                <div class="field form_printing">
2624                    <label class="label" for="height"><span>Bedruckung</span></label>
2625                    <div class="control">
2626                        <input name="form_printing"
2627                               id="inquiry-form-printing"
2628                               title="Bedruckung"
2629                               value=""
2630                               class="input-text"
2631                               type="text"/>
2632                    </div>
2633                </div>
2634            </fieldset>
2635            <fieldset class="fieldset">
2636                <div class="field form_customer_reference">
2637                    <label class="label" for="name"><span>Kundenname / Referenz</span></label>
2638                    <div class="control">
2639                        <input name="customer_reference"
2640                               id="inquiry-form-customer-reference"
2641                               title="Kundenname / Referenz"
2642                               value=""
2643                               class="input-text"
2644                               type="text"/>
2645                    </div>
2646                </div>
2647                <div class="field form_quantity">
2648                    <label class="label" for="quantity"><span>Auflage</span></label>
2649                    <div class="control">
2650                        <input name="quantity"
2651                               id="inquiry-form-quantity"
2652                               title="Auflage"
2653                               value=""
2654                               class="input-text"
2655                               type="text"/>
2656                    </div>
2657                </div>
2658                <div class="field form_quantity">
2659                    <label class="label" for="quantity"><span>Wünsche & Fragen</span></label>
2660                    <div class="control">
2661                        <textarea name="other"
2662                                  id="inquiry-form-other"
2663                                  title="Wünsche & Fragen"
2664                                  rows="5"></textarea>
2665                    </div>
2666                </div>
2667            </fieldset>
2668        </form>
2669        <div class="response"></div>
2670    </div>
2671</div>
2672<script type="text/javascript">
2673    require([
2674        "jquery",
2675        "Magento_Ui/js/modal/modal"
2676    ], function ($, modal) {
2677        const options = {
2678            type: 'popup',
2679            responsive: true,
2680            modalClass: 'inquiry-modal',
2681            buttons: [{
2682                text: $.mage.__('Submit'),
2683                class: '',
2684                click: function () {
2685                    const inquiryForm = $("#calculation-inquiry-form");
2686                    if (inquiryForm.validation('isValid')) {
2687                        $.ajax({
2688                            url: "https://www.boxsys.de/anfrageformular/ajax/post/",
2689                            type: 'POST',
2690                            data: inquiryForm.serialize(),
2691                            showLoader: true,
2692                            cache: false,
2693                            success: function (response) {
2694                                if (response.success === true) {
2695                                    $('.inquiry-modal .response').html('<span id="boxsys-inquiry" style="color:rgba(102, 150, 64, 0.9);">' + response.success_message + '</span>');
2696                                    $('.inquiry-modal form').hide();
2697                                    $('.inquiry-modal .modal-footer').hide();
2698                                } else {
2699                                    $('.inquiry-modal .response').html('<span style="color:#e02b27;">' + response.error_messages + '</span>');
2700                                }
2701                            },
2702                            error: function (response) {
2703                                console.log('An error occurred.');
2704                                console.log(response);
2705                                $('.inquiry-modal .response').html('<span style="color:#e02b27;">' + $.mage.__('An error occurred while processing your form. Please try again later.') + '</span>');
2706                            },
2707                        });
2708                    }
2709                }
2710            }]
2711        };
2712        const $modal = $('#modal-inquiry'), $opener = $('#modal-inquiry-opener');
2713        modal(options, $modal);
2714        $opener.click(function () {
2715            // Reset
2716            $('.inquiry-modal .response').html('');
2717            // Fill form
2718                        $('#inquiry-form-a').val($('#calculation-form-a').val());
2719                        $('#inquiry-form-b').val($('#calculation-form-b').val());
2720                        $('#inquiry-form-h').val($('#calculation-form-h').val());
2721                        // Material
2722            let materialText = '';
2723            $('#boxsys_config_material > p > span').each(function () {
2724                if ($(this).text()) {
2725                    materialText += $(this).text() + ' ';
2726                }
2727            });
2728            $('#inquiry-form-material').val(materialText);
2729            // Farbe
2730            let printingText = '';
2731            $('#boxsys_config_bedruckung > p > span').each(function () {
2732                if ($(this).text()) {
2733                    printingText += $(this).text() + ' ';
2734                }
2735            });
2736            $('#inquiry-form-printing').val(printingText);
2737            // Service
2738                        if ($("#service_1_s2_checkbox").is(':checked')) {
2739                $("#inquiry-form-service-1-s2").prop('checked', true);
2740            } else {
2741                $("#inquiry-form-service-1-s2").prop('checked', false);
2742            }
2743                        if ($("#service_1_s3_checkbox").is(':checked')) {
2744                $("#inquiry-form-service-1-s3").prop('checked', true);
2745            } else {
2746                $("#inquiry-form-service-1-s3").prop('checked', false);
2747            }
2748                                    if ($("#service_2_s5_checkbox").is(':checked')) {
2749                $("#inquiry-form-service-2-s5").prop('checked', true);
2750            } else {
2751                $("#inquiry-form-service-2-s5").prop('checked', false);
2752            }
2753                        if ($("#service_2_s7_checkbox").is(':checked')) {
2754                $("#inquiry-form-service-2-s7").prop('checked', true);
2755            } else {
2756                $("#inquiry-form-service-2-s7").prop('checked', false);
2757            }
2758                                    if ($("#service_3_s12_checkbox").is(':checked')) {
2759                $("#inquiry-form-service-3-s12").prop('checked', true);
2760            } else {
2761                $("#inquiry-form-service-3-s12").prop('checked', false);
2762            }
2763                        if ($("#service_3_s8_checkbox").is(':checked')) {
2764                $("#inquiry-form-service-3-s8").prop('checked', true);
2765            } else {
2766                $("#inquiry-form-service-3-s8").prop('checked', false);
2767            }
2768                                    if ($("#service_4_s11_checkbox").is(':checked')) {
2769                $("#inquiry-form-service-4-s11").prop('checked', true);
2770            } else {
2771                $("#inquiry-form-service-4-s11").prop('checked', false);
2772            }
2773                        if ($("#service_4_s9_checkbox").is(':checked')) {
2774                $("#inquiry-form-service-4-s9").prop('checked', true);
2775            } else {
2776                $("#inquiry-form-service-4-s9").prop('checked', false);
2777            }
2778                        if ($("#service_4_s10_checkbox").is(':checked')) {
2779                $("#inquiry-form-service-4-s10").prop('checked', true);
2780            } else {
2781                $("#inquiry-form-service-4-s10").prop('checked', false);
2782            }
2783                        // Referenz
2784            $('#inquiry-form-customer-reference').val($('#calc_customer_reference').val());
2785            // Auflage
2786            $('#inquiry-form-quantity').val($('#calculation-form-quantity').val());
2787            // Show modal
2788            $('.inquiry-modal form').show();
2789            $('.inquiry-modal .modal-footer').show();
2790            $modal.modal('openModal');
2791        });
2792        $('#calculation-inquiry-form').on("keyup keypress", function (e) {
2793            const code = e.keyCode || e.which;
2794            if (code === 13) {
2795                e.preventDefault();
2796                return false;
2797            }
2798        });
2799        $(document).ready(function () {
2800            $('#modal-inquiry-opener').show(); // Inquiry-Button
2801        });
2802    });
2803</script>
2803
2804<!-- Inquiry-Modal (printed sample)-->
2805<style>
2806    .modal-popup .modal-inner-wrap {width: 50%;}
2807</style>
2808<div id="modal-inquiry-printed-sample" style="display: none;">
2809    <div class="modal-wrapper" style="margin-bottom:-20px;">
2810        <h2 style="margin:-40px 0 20px;">Bedrucktes Muster</h2>
2811        <div style="display: grid; grid-template-columns:1fr 2fr;">
2812            <div><img src="https://www.boxsys.de/media/boxsys/images/boxsys_home_slider_02.webp" alt="Bedruckte Muster von www.boxsys.de"></div>
2813            <div>
2814                <p>
2815                Sie hätten gern Ihr ausgewähltes Produkt als digital bedrucktes Muster, aus dem Originalmaterial? Bei BOXSYS bestellen Sie dafür ein Stück mit der Farbigkeit „4/0c Euroskala“.<br><br>
2816                So geht’s: Bitte wählen Sie bitte:<br>
2817                    1.	Ihr Format<br>
2818                    2.	Ihr Material<br>
2819                    3.	Ihre Farbigkeit: bitte wählen Sie „4/0c Euroskala“.<br>
2820                    4.	Auflage: 1 (oder mehr)<br><br>
2821                    Gehen Sie dann zum Warenkorb und schließen Ihre Bestellung ab.<br><br>
2822                    Laden Sie dann Ihre Druckdatei hoch oder gestalten Sie in unserem Online-Designer.
2823                </p>
2824            </div>         
2825        </div>
2826    </div>
2827</div>
2828<script type="text/javascript">
2829    require([
2830        "jquery",
2831        "Magento_Ui/js/modal/modal"
2832    ], function ($, modal) {
2833        const options = {
2834            type: 'popup',
2835            responsive: true,
2836            modalClass: 'inquiry-printed-sample-modal'
2837        };
2838        const $modal = $('#modal-inquiry-printed-sample'), $opener = $('#modal-inquiry-printed-sample-opener');
2839        modal(options, $modal);
2840        $('.inquiry-printed-sample-modal .modal-footer').hide();
2841        $opener.click(function () {
2842            $modal.modal('openModal');
2843        });
2844        $(document).ready(function () {
2845            $('#modal-inquiry-printed-sample-opener').show(); // Inquiry-Button
2846        });
2847    });
2848</script>
2848
2849<!-- Inquiry-Modal (white sample)-->
2850<div id="modal-inquiry-white-sample" style="display: none;">
2851    <div class="modal-wrapper" style="margin-bottom:-20px;">
2852        <h2 style="margin:-40px 0 20px;">Weißmuster</h2>
2853        <div style="display: grid; grid-template-columns:1fr 2fr;">
2854            <div><img src="https://www.boxsys.de/media/boxsys/images/boxsys_home_slider_03.webp" alt="Weißmuster von www.boxsys.de"></div>
2855            <div>
2856                <p>
2857                Sie hätten gern Ihr ausgewähltes Produkt als Weißmuster, aus dem Originalmaterial? Bei BOXSYS bestellen Sie dafür ein Stück mit der Farbigkeit „unbedruckt“.<br><br>
2858                So geht’s: Bitte wählen Sie bitte bei den Reitern:<br>
2859                    1.	Ihr Format<br>
2860                    2.	Ihr Material<br>
2861                    3.	Ihre Farbigkeit: bitte wählen Sie unbedruckt<br>
2862                    4.	Auflage: 1 (oder mehr)<br><br>
2863                    Gehen Sie dann zum Warenkorb und schließen Ihre Bestellung ab.<br><br>
2864                </p>
2865            </div>         
2866        </div>
2867    </div>
2868</div>
2869<script type="text/javascript">
2870    require([
2871        "jquery",
2872        "Magento_Ui/js/modal/modal"
2873    ], function ($, modal) {
2874        const options = {
2875            type: 'popup',
2876            responsive: true,
2877            modalClass: 'inquiry-white-sample-modal'
2878        };
2879        const $modal = $('#modal-inquiry-white-sample'), $opener = $('#modal-inquiry-white-sample-opener');
2880        modal(options, $modal);
2881        $('.inquiry-white-sample-modal .modal-footer').hide();
2882        $opener.click(function () {
2883            $modal.modal('openModal');
2884        });
2885        $(document).ready(function () {
2886            $('#modal-inquiry-white-sample-opener').show(); // Inquiry-Button
2887        });
2888    });
2889</script>
2889
2890<style>
2891    .layer-wrapper {
2892        position: relative;
2893        z-index: 9999999;
2894    }
2895    #layer-printess {
2896        overflow-y: auto;
2897    }
2898    #layer-printess iframe {
2899        width: 100vw;
2900        height: 100%;
2901        left: -99999px;
2902        border: none;
2903        display: block;
2904        position: fixed;
2905        top: 0;
2906    }
2907</style>
2908<div class="layer-wrapper">
2909    <aside id="layer-printess">
2910        <iframe id="printess" src="https://editor.printess.com/v/nightly/printess-editor/embed.html" onload="loadPrintess()"></iframe>
2911    </aside>
2912</div>
2913<script>
2914    const opener = document.getElementById("layer-printess-opener");
2915    const layer = document.getElementById("layer-printess");
2916    const iframe = document.getElementById("printess");
2917
2918    opener.onclick = function () {
2919        if (document.getElementById("calculation-is-valid").value === "1") {
2920            if (document.getElementById("has-upload").value === '0' || confirm('Hinweis: Wenn Sie Ihre Gestaltung im Online Designer speichern, werden bisherige Design Upload(s) gelöscht.')) {
2921                iframe.contentWindow.postMessage({
2922                    cmd: "showOverlay",
2923                    parameters: ["Wird generiert..."]
2924                }, "*");
2925                const printessToken = document.getElementById("printess-token");
2926                if (printessToken.value) {
2927                    iframe.contentWindow.postMessage({
2928                        cmd: "load",
2929                        parameters: [printessToken.value]
2930                    }, "*");
2931                }
2932                // Assign current PDF
2933                const sourceFile = "https://www.boxsys.de//media/vkalk/144813/single.svg";
2934                iframe.contentWindow.postMessage({
2935                    cmd: "importImageFromUrl",
2936                    parameters: [sourceFile, false]
2937                }, "*");
2938                // (zweiseitig) Innenseite
2939                if (!printessToken.value) { // If design is loaded, this has to be fired at loaded event. Without token this event does not occur.
2940                    insideVisible();
2941                }
2942                document.body.style.overflow = 'hidden'; // No scrollbar
2943                iframe.style.left = "0"; // Show layer
2944            }
2945        }
2946    }
2947
2948    function hideLayer() {
2949        iframe.style.left = "-99999px";
2950        document.body.style.overflow = 'inherit'; // Scrollbar
2951    }
2952
2953    // Printess
2954    function loadPrintess() {
2955        const printessToken = document.getElementById("printess-token");
2956        const printingPrint = document.getElementById("printing_print");
2957        const toggleCalculationUpdate = document.getElementById("toggle-update");
2958        window.addEventListener("message", () => {
2959            switch (event.data.cmd) {
2960                case "back":
2961                    hideLayer();
2962                    break;
2963                case "basket":
2964                    if (document.getElementById("has-upload").value === '0' || confirm('Hiermit werden bisherige Design Upload(s) endgültig gelöscht!')) {
2965                        printessToken.value = event.data.token; // Set token in calculation-form
2966                        gen("out"); // Generate outside first
2967                    }
2968                    break;
2969                case "renderFirstPageImage": // Event from gen()
2970                    let result = event.data.result;
2971                    if (result.indexOf("outside.png") >= 0) {
2972                        document.getElementById("printess-png-out").value = result;
2973                        if (printingPrint.value === "2") {
2974                            gen("in"); // Generate inside, if needed
2975                            break;
2976                        }
2977                    } else if (result.indexOf("inside.png") >= 0) {
2978                        // (zweiseitig) Innenseite
2979                        document.getElementById("printess-png-in").value = result;
2980                    }
2981                    // Bridge to update on form
2982                    toggleCalculationUpdate.value = 1;
2983                    if ("createEvent" in document) {
2984                        const evt = document.createEvent("HTMLEvents");
2985                        evt.initEvent("change", false, true);
2986                        toggleCalculationUpdate.dispatchEvent(evt);
2987                    } else {
2988                        toggleCalculationUpdate.fireEvent("onchange");
2989                    }
2990                    hideLayer();
2991                    break;
2992                case "importImageFromUrl":
2993                    const importedImage = event.data.result;
2994                    setTimeout(() => {
2995                        iframe.contentWindow.postMessage({cmd: "setFormFieldValue", parameters: ["background", importedImage.id]}, "*");
2996                        iframe.contentWindow.postMessage({cmd: "setFormFieldValue", parameters: ["backgroundInside", importedImage.id]}, "*");
2997                    }, 0);
2998                    iframe.contentWindow.postMessage({
2999                        cmd: "hideOverlay"
3000                    }, "*");
3001                    const xe = parseFloat(document.getElementById("xe").value) + 40;
3002                    const ye = parseFloat(document.getElementById("ye").value) + 40;
3003                    iframe.contentWindow.postMessage({
3004                        cmd: "setDocumentSize",
3005                        parameters: ["Outside", xe, ye]
3006                    }, "*");
3007                    if (printingPrint.value === "2") {
3008                        // (zweiseitig) Innenseite
3009                        iframe.contentWindow.postMessage({
3010                            cmd: "setDocumentSize",
3011                            parameters: ["Inside", xe, ye]
3012                        }, "*");
3013                    }
3014                    break;
3015                case "loaded":
3016                    // (zweiseitig) Innenseite
3017                    insideVisible();
3018                    break;
3019            }
3020        });
3021
3022        iframe.contentWindow.postMessage({
3023            cmd: "attach", properties: {
3024                templateName: "Flexible",
3025                templateVersion: "draft",
3026                token: "eyJhbGciOiJSUzI1NiIsImtpZCI6InByaW50ZXNzLXNhYXMtYWxwaGEiLCJ0eXAiOiJKV1QifQ.eyJzdWIiOiI4OUJkOXd2bWEwVFEwTWJkUnBUOW4wY1hERDQzIiwianRpIjoiVVEyODBDbHE4VWRZX0M4NC1sQkRwTkM5Q1E0S0ZNeFIiLCJyb2xlIjoic2hvcCIsIm5iZiI6MTY4MTIxMzMwNCwiZXhwIjoxOTk2NTczMzA0LCJpYXQiOjE2ODEyMTMzMDQsImlzcyI6IlByaW50ZXNzIEdtYkggJiBDby5LRyIsImF1ZCI6InByaW50ZXNzLXNhYXMifQ.GhqZRZV0144SwkltNIHfoUXy0TH6uMcZYd4DiB5RyJZmddBTUwMusA5n6PMudK7H6r6cDV7geeQqBDsogwJydvmLusFsrHX6Rv9iDIwVGnsGgAuNaJpMLLYldrGO9cRs6e5NJ5c25BcKGEHCF0U6NZTfMihkS6FdaeYSCwaQ0Cw3nF1Xw36bkTx2WDCE_LeQtFyKokRWpLZemI-6fqzh7rkQ3J22d7P9lwJ9m_SwazpvyqLPunvUXUI-V4_x_cDIRPqteVhzvBih-UKVSARQ9l3jiwxWjHNA25k5bijHLf5j5_RLL8ZELxHCYLmAZ3LWRioBKy8iZDR3c7QmB5LdPcgoLTlAWccHM_KHzJICEWNFb2NuaakN4yeqxslTCwQzrDri14iOZmlxEm3WpLWjiR9cVklNszLKK-1-QblkF1gtuhwyBP4J4Zv4vhQo3a0IvHo9k9lqL3p5MOyMVj382Ao2KX06Tx7Pqvij_zqKZvrlK3GyAvkIwv6p0FPkxBUev4cjwaf-gxRWhbwcjtVtC-AvgVGRkgVJd8LF-TMDLDuUV0jbzFGX5FVBQJ2BaO-zr2KVuR2s3-ihjTPLWpMJu8twRhMsXSrkoxuQm1BncR1Geh3L0m9lkpfWrfy1wH_c0qKa_4DlOT6q5Vg_bpUvsrJUafve84Wmu_vqWKtemss",
3027                translations: { // @see: https://github.com/PrintessEditor/getting-started/blob/nightly/translations.json
3028                    "ui": {
3029                        "buttonBasket": "Speichern"
3030                    }
3031                },
3032            }
3033        }, "*");
3034        opener.style.display = "block"; // Online-Designer-Button
3035    }
3036
3037    if (window.visualViewport) {
3038        window.visualViewport.addEventListener("scroll", () => {
3039            // unfortunately an iframe on iOS is not able to receive the correct visual-viewport, so we forward it.
3040            iframe.contentWindow.postMessage({cmd: "viewportScroll", height: window.visualViewport.height, offsetTop: window.visualViewport.offsetTop}, "*");
3041        })
3042    }
3043
3044    function insideVisible() {
3045        let innenseiteSichtbar = "nein";
3046        if (document.getElementById("printing_print").value === "2") {
3047            innenseiteSichtbar = "ja";
3048        }
3049        iframe.contentWindow.postMessage({
3050            cmd: "setFormFieldValue",
3051            parameters: ["innenseiteSichtbar", innenseiteSichtbar]
3052        }, "*");
3053    }
3054
3055    function gen(side) {
3056        iframe.contentWindow.postMessage({
3057                cmd: "renderFirstPageImage",
3058                parameters: [
3059                    side + "side.png",
3060                    side.charAt(0).toUpperCase() + side.slice(1).toLowerCase() + "side",
3061                    600,
3062                    600,
3063                    "url",
3064                    "production"
3065                ]
3066            },
3067            "*");
3068    }
3069</script>
3069
3070
3071<!--suppress JSUnresolvedReference -->
3072<script>
3073    require([
3074        'jquery',
3075        'jquery/ui',
3076        'mage/mage',
3077        'mage/validation',
3078        'mage/translate'
3079    ], function ($) {
3080        'use strict';
3081        $(document).ready(function () {
3082            const cfq = $("#calculation-form-quantity"); // @todo: unused?
3083            cfq.val(cfq.prop("defaultValue"));
3084
3085            // Initialisieren
3086            updateFormatRanges();
3087            $("#3d-frame").attr('src', "/media/vkalk/144813/3d.html");
3088
3089            const boxcon = document.getElementsByClassName("boxsys-config-container");
3090            const boxbut = document.getElementsByClassName("boxsys_button");
3091            const boxconli = document.getElementsByClassName("boxsys_config-list");
3092
3093            // Infos (i)
3094            $(".calculation-index-index").prepend("<div class=pu-reset></div><div class=extra-info-prepend></div>");
3095            $(".calculation-index-index .info").on("click", function () {
3096                $(this).find(".extra-info").clone().prependTo(".extra-info-prepend");
3097            });
3098            const closeInfoLightboxTarget = ".calculation-index-index .extra-info-prepend .extra-info";
3099            $(document).on("click", closeInfoLightboxTarget, function (e) {
3100                if ($(e.target)[0] === $(closeInfoLightboxTarget)[0]) {
3101                    $(".calculation-index-index .extra-info-prepend").empty();
3102                }
3103            });
3104            $(document).on("click", ".calculation-index-index .extra-info-prepend .extra-info .info-cross", function () {
3105                $(".calculation-index-index .extra-info-prepend").empty();
3106            });
3107
3108            let heightLc = $(".calculation-index-index .boxsys_config_left .boxsys_config_left_button").height();
3109            $(".calculation-index-index .boxsys_config_left .boxsys-config-container").css("min-height", heightLc);
3110
3111            // (+)-Buttons
3112            $('.calculation-index-index #boxsys_format_container .add').click(function () {
3113                const $input = $(this).parent().parent().find('input');
3114                $input.val(parseInt($input.val()) + 1);
3115                $input.change();
3116                return false;
3117            });
3118
3119            // (-)-Buttons
3120            $('.calculation-index-index #boxsys_format_container .sub').click(function () {
3121                const $input = $(this).parent().parent().find('input');
3122                let count = parseInt($input.val()) - 1;
3123                count = count < 1 ? 0 : count;
3124                $input.val(count);
3125                $input.change();
3126                return false;
3127            });
3128
3129            // Farbigkeit
3130            $(".calculation-index-index .boxsys_bedruckung_selection").click(function () {
3131                $(".calculation-index-index .boxsys_bedruckung_selection").removeClass("active");
3132                $(this).toggleClass("active");
3133            });
3134            $(".calculation-index-index #calculation-form-printing #printing_value_hidden").val($(".calculation-index-index #calculation-form-printing .boxsys_bedruckung_selection.active").find("p").data("value"));
3135
3136            // Service Select (Produktionskontrolle)
3137            $(".calculation-index-index .boxsys_service_sec-1 .boxsys_service_selection").click(function (e) {
3138                $(".calculation-index-index .boxsys_service_sec-1 .boxsys_service_selection").removeClass("active");
3139                if ($(this).hasClass("active")) {
3140                    $(this).removeClass("active");
3141                } else {
3142                    $(this).addClass("active");
3143                }
3144                const value = $(e.target).closest(".boxsys_service_selection").find("p").data("value");
3145                $("#service_1_value_hidden").val(value);
3146                update();
3147            });
3148
3149            $(".calculation-index-index #service_1_value_hidden").val($(".calculation-index-index .boxsys_service_sec-1 .boxsys_service_selection.active").find("p").data("value"));
3150
3151            // Service Checkboxen
3152            $('.boxsys_service_checkbox').click(function () {
3153                update();
3154            });
3155
3156
3157            $(".calculation-index-index #boxsys_reset_button").on("click", function () {
3158                $(".calculation-index-index .reset-con").clone().prependTo(".pu-reset");
3159            });
3160
3161            // Reset @todo: unused
3162            $(document).on("click", ".calculation-index-index .pu-reset .cancel", function () {
3163                $(".calculation-index-index .pu-reset").empty();
3164            });
3165            $(document).on("click", ".calculation-index-index .pu-reset .confirm", function () {
3166                location.reload();
3167            });
3168
3169            // Online-Designer verwerfen
3170            $("#printess-dismiss a").click(function () {
3171                if (confirm($(this).data('confirm'))) {
3172                    $('#printess-token').val(''); // Reset token
3173                    $.each(['out', 'in'], function (n, side) {
3174                        $("#printess-png-" + side).val(''); // Remove urls for png
3175                    });
3176                    // Reset online designer
3177                    document.getElementById("printess").contentWindow.postMessage({
3178                        cmd: "load",
3179                        parameters: ["Flexible"]
3180                    }, "*");
3181                    update();
3182                }
3183            })
3184
3185            // Tabbing
3186
3187            let requiredTabsVisited = {
3188                'format': true, // Default
3189                'material': false,
3190                'bedruckung': false,
3191                'auflage': false
3192            };
3193
3194            function switch_tab(tab) {
3195                calculationForm.validation('clearError'); // Prevent duplicate errors from previous validation (onchange)
3196                if (calculationForm.validation() && calculationForm.validation('isValid')) {
3197                    document.getElementById("calculation-is-valid").value = "1";
3198
3199                    // Tabbing
3200                    for (let i = 0; i < boxcon.length; i++) {
3201                        boxcon[i].classList.remove("active");
3202                    }
3203                    document.getElementById("boxsys_" + tab + "_container").classList.add("active");
3204                    for (let i = 0; i < boxbut.length; i++) {
3205                        boxbut[i].classList.remove("active");
3206                    }
3207                    document.getElementById("boxsys_" + tab + "_button").classList.add("active");
3208
3209                    // Qualified for cart
3210                    requiredTabsVisited[tab] = true;
3211                    let qualifiedForCart = true;
3212                    for (const index in requiredTabsVisited) {
3213                        if (!requiredTabsVisited[index]) {
3214                            qualifiedForCart = false;
3215                        }
3216                    }
3217
3218                    // Zusammenfassung
3219                    if (qualifiedForCart) {
3220                        for (let i = 0; i < boxconli.length; i++) {
3221                            boxconli[i].classList.add("active");
3222                        }
3223                    } else if (tab === 'produktion') {
3224                        document.getElementById("boxsys_config_produktionszeit").classList.add("active"); // @todo: refactor produktionszeit to optionen
3225                    } else {
3226                        document.getElementById("boxsys_config_" + tab).classList.add("active");
3227                    }
3228
3229                    // Cart-Button-Handling
3230                    if (!qualifiedForCart) {
3231                        $('.cart.none').css('display', 'inline-flex');
3232                        $('#cart-final').hide();
3233                        $('.add-to-cart-clone').hide();
3234                        $('.boxsys_config_bottom_container_rechts_auflage').css('display', 'block');
3235                    } else {
3236                        $('.cart.none').hide();
3237                        $('#cart-final').css('display', 'inline-flex');
3238                        $('.add-to-cart-clone').show();
3239                        $('.boxsys_config_bottom_container_rechts_auflage').hide();
3240                    }
3241
3242                    // Update
3243                    update();
3244                } else {
3245                    document.getElementById("calculation-is-valid").value = "0";
3246                }
3247            }
3248
3249            $('.switch-tab').on('click', function () {
3250                const target = $(this).data("target");
3251                if (target === 'add-to-cart') {
3252                    $('#add-to-cart-button').click();
3253                } else {
3254                    switch_tab(target);
3255                }
3256            });
3257
3258            if($('#item_id').val() || $('#saved').val()){
3259                // Set everything active from start on update of cart item
3260                for (const index in requiredTabsVisited) {
3261                    requiredTabsVisited[index] = true;
3262                }
3263                for (let i = 0; i < boxconli.length; i++) {
3264                    boxconli[i].classList.add("active");
3265                }
3266                $('.cart.none').hide();
3267                $('#cart-final').css('display', 'inline-flex');
3268                $('.add-to-cart-clone').show();
3269                $('.boxsys_config_bottom_container_rechts_auflage').hide();
3270            }
3271        });
3272
3273        // 2D/3D Button
3274        const btn3d = document.getElementById("boxsys_3d_button");
3275        const btn2d = document.getElementById("boxsys_2d_button");
3276        btn2d.onclick = function () {
3277            btn2d.style.display = "none";
3278            btn3d.style.display = "block";
3279            document.getElementById("3d-frame").src = "/media/vkalk/144813/single.svg";
3280        };
3281        btn3d.onclick = function () {
3282            btn3d.style.display = "none";
3283            btn2d.style.display = "block";
3284            document.getElementById("3d-frame").src = "/media/vkalk/144813/3d.html";
3285        };
3286
3287        // Formular
3288        const calculationForm = $('#calculation-form');
3289                const formatFixData = {"14":{"product_format_fix_id":"14","product_id":"boxsys_fs_sb","a_fix":"50","b_fix":"20","h_fix":"60","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"50x20x60mm","sort_fix":"10"},"15":{"product_format_fix_id":"15","product_id":"boxsys_fs_sb","a_fix":"50","b_fix":"30","h_fix":"80","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"50x30x80mm","sort_fix":"20"},"16":{"product_format_fix_id":"16","product_id":"boxsys_fs_sb","a_fix":"60","b_fix":"40","h_fix":"100","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"60x40x100mm","sort_fix":"30"},"17":{"product_format_fix_id":"17","product_id":"boxsys_fs_sb","a_fix":"70","b_fix":"30","h_fix":"120","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"70x30x120mm","sort_fix":"40"}
3289,"18":{"product_format_fix_id":"18","product_id":"boxsys_fs_sb","a_fix":"90","b_fix":"40","h_fix":"130","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"90x40x130mm","sort_fix":"50"},"19":{"product_format_fix_id":"19","product_id":"boxsys_fs_sb","a_fix":"100","b_fix":"50","h_fix":"150","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"100x50x150mm","sort_fix":"60"},"20":{"product_format_fix_id":"20","product_id":"boxsys_fs_sb","a_fix":"120","b_fix":"60","h_fix":"200","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"120x60x200mm","sort_fix":"70"},"21":{"product_format_fix_id":"21","product_id":"boxsys_fs_sb","a_fix":"150","b_fix":"80","h_fix":"150","a_2_fix":null,"b_2_fix":null,"h_2_fix":null,"fen_li_fix":null,"fen_re_fix":null,"fen_ob_fix":null,"fen_un_fix":null,"fen_ra_fix":null,"name_fix":"150x80x150mm","sort_fix":"80"}};
3290
3291        // Validierung: Nachrichten
3292        calculationForm.mage('validation', {
3293            messages: {
3294                                'form_a': {
3295                    'validate-number-range': 'Der eingegebene Wert ist zu klein',
3296                },
3297                                'form_b': {
3298                    'validate-number-range': 'Der eingegebene Wert ist zu klein',
3299                },
3300                                'form_h': {
3301                    'validate-number-range': 'Der eingegebene Wert ist zu klein',
3302                },
3303                                'form_quantity': {
3304                    'validate-number-range': 'Diese Auflage kalkulieren wir Ihnen individuell, bitte nutzen Sie den Kasten "Anfrage stellen" unten rechts.',
3305                },
3306                            }
3307        });
3308
3309        // Berechnung für Validierung
3310        function calculate(formula) {
3311            let addArray = formula.split("+");
3312            let result = 0;
3313            for (let i = 0; i < addArray.length; i++) {
3314                // Addition
3315                if ($.isNumeric(addArray[i])) {
3316                    result += parseFloat(addArray[i]);
3317                } else {
3318                    let value = 0;
3319                    if (addArray[i].indexOf('*') !== -1) {
3320                        // Multiplication
3321                        let multiplyArray = addArray[i].split("*");
3322                        for (let i = 0; i < multiplyArray.length; i++) {
3323                            if ($.isNumeric(multiplyArray[i])) {
3324                                if (value) {
3325                                    value *= parseFloat(multiplyArray[i]);
3326                                } else {
3327                                    value = parseFloat(multiplyArray[i]);
3328                                }
3329                            } else {
3330                                if (value) {
3331                                    value *= parseFloat($('#calculation-form-' + multiplyArray[i]).val());
3332                                } else {
3333                                    value = parseFloat($('#calculation-form-' + multiplyArray[i]).val());
3334                                }
3335                            }
3336                        }
3337                    } else {
3338                        value = parseFloat($('#calculation-form-' + addArray[i]).val());
3339                    }
3340                    result += value;
3341                }
3342            }
3343            return result;
3344        }
3345
3346        // Validierung: Format
3347                $.validator.addMethod(
3348            'rule_f_1', function () {
3349                let a = calculate('15+2*a+2*b');
3350                let b = calculate('30+h+1.75*b');
3351                let high = a > b ? a : b;
3352                let low = a < b ? a : b;
3353                return !(high >= 980 || low >= 680); // der größere Wert von rule_f_1_a und rule_f_1_b muss kleiner sein als rule_f_1_max_a, der kleinere Wert von rule_f_1_a und rule_f_1_b muss kleiner sein als rule_f_1_max_b
3354            }, $.mage.__('Ihre eingegebenen Maße überschreiten das Bogenformat'));
3355                                $.validator.addMethod(
3356            'rule_f_3', function () {
3357                let value = calculate('a+b');
3358                return !(value < 60 || value > 500); // rule_f_3_min < rule_f_3 < rule_f_3_max
3359            }, $.mage.__('Länge + Breite muss zwischen 60 und 500 mm liegen'));
3360                        $.validator.addMethod(
3361            'rule_f_4', function () {
3362                let a = calculate('7*a');
3363                let b = calculate('h');
3364                return a >= b; // rule_f_4_a >= rule_f_4_b
3365            }, $.mage.__('Die Höhe darf nicht größer als 7 mal die Länge sein'));
3366        
3367        // Validierung: Fenster
3368                                
3369        // Validierung: Format-Bereich
3370                                $.validator.addMethod(
3371            'a_max_calc', function (value) {
3372                const validator = this;
3373                let max = calculate('480+b*-1');
3374                if (value > max) {
3375                    validator.aMaxCalcMessage = $.mage.__('Wählen Sie einen Wert von maximal %1%2').replace('%1', max.toFixed()).replace('%2', ' mm');
3376                    return false;
3377                }
3378                return true;
3379            }, function () {
3380                return this.aMaxCalcMessage;
3381            });
3382                                        $.validator.addMethod(
3383            'b_max_calc', function (value) {
3384                const validator = this;
3385                let max = calculate('480+a*-1');
3386                if (value > max) {
3387                    validator.aMaxCalcMessage = $.mage.__('Wählen Sie einen Wert von maximal %1%2').replace('%1', max.toFixed()).replace('%2', ' mm');
3388                    return false;
3389                }
3390                return true;
3391            }, function () {
3392                return this.aMaxCalcMessage;
3393            });
3394                                        $.validator.addMethod(
3395            'h_max_calc', function (value) {
3396                const validator = this;
3397                let max = calculate('640+1.5*b*-1');
3398                if (value > max) {
3399                    validator.aMaxCalcMessage = $.mage.__('Wählen Sie einen Wert von maximal %1%2').replace('%1', max.toFixed()).replace('%2', ' mm');
3400                    return false;
3401                }
3402                return true;
3403            }, function () {
3404                return this.aMaxCalcMessage;
3405            });
3406                                                                                                                                                                
3407        // Neu berechnen mit Ajax-Request
3408        function update(nextAction = '') {
3409            if (calculationForm.validation() && calculationForm.validation('isValid')) {
3410                $('#updated').val('1');
3411                document.getElementById("calculation-is-valid").value = "1";
3412                const formData = new FormData(calculationForm[0]);
3413                $.ajax({
3414                    url: "https://www.boxsys.de/calculation/ajax/update/",
3415                    type: "POST",
3416                    processData: false,
3417                    contentType: false,
3418                    data: formData,
3419                    showLoader: true,
3420                    cache: false,
3421                    success: function (response) {
3422                        if (response.success === true) {
3423                            // Redirect on first saving
3424                            if (response['callbacks']['redirect']) {
3425                                window.location.replace(response['callbacks']['redirect']);
3426                            }
3427
3428                            // Remove message from page load
3429                            $(".page.messages .messages").remove();
3430
3431                            // Auflage Preise
3432                            const quantityOptionsSelect = $("#calculation-form-quantity-options tbody");
3433                            const quantityOptionSelected = quantityOptionsSelect.filter(".active").data("value");
3434                            quantityOptionsSelect.empty();
3435                            quantityOptionsSelect.append($('<tr><th><b>Stückzahl</b></th><th><b>Gesamtpreis €*</b></th></tr>'));
3436                            $.each(response['quantity_options'], function (key, value) {
3437                                const rebuild = '<tr class="table-tr' +
3438                                    '"><td><a data-value="' + key + '" class="auflage-defined-value quantity">' + key + '</a></td><td class="auflage-defined-value"><a class="auflage-defined-value auflage-price">' + value.split('|')[1] + '</a></td></tr>';
3439                                quantityOptionsSelect.append(rebuild);
3440                            });
3441                            quantityOptionsSelect.val(quantityOptionSelected);
3442
3443                            // Material
3444                            const prodMaterialOptions = $("#calculation-form-material .material-options");
3445                            prodMaterialOptions.empty();
3446                            $.each(response['material_options'], function (i) {
3447                                let active = '';
3448                                if (response['material_options'][i].default) {
3449                                    active = ' active';
3450                                    $("#calculation-form-material #material_value_hidden").val(i);
3451                                }
3452                                let status = ' enabled';
3453                                let title = '';
3454                                if (response['material_options'][i].active === false) {
3455                                    status = ' disabled';
3456                                    title = 'Material kann bei diesem Format nicht verwendet werden.'
3457                                }
3458                                const img = '/media/boxsys/icon/produktkonfigurator/' + response['material_options'][i].icon + '.png';
3459                                const html =
3460                                    '<div class="boxsys_material_selection' + active + status + '" title="' + title + '">' +
3461                                    '<div class="boxsys_material_background" style="background-image: url(' + img + ');"></div>' +
3462                                    '<p data-value="' + i + '">' +
3463                                    response['material_options'][i].label + '<br>' +
3464                                    '<span style="font-size:11px;">' + response['material_options'][i].subname + '</span>' +
3465                                    '</p>' +
3466                                    '</div>'
3467                                prodMaterialOptions.append(html);
3468                            });
3469
3470                            // Farbigkeit
3471                            const prodPrintingOptions = $("#calculation-form-printing .printing-options");
3472                            prodPrintingOptions.empty();
3473                            $.each(response['printing_options'], function (i) {
3474                                let active = '';
3475                                if (response['printing_options'][i].default) {
3476                                    active = ' active';
3477                                    $("#calculation-form-printing #printing_value_hidden").val(i);
3478                                }
3479                                let status = ' enabled';
3480                                let title = '';
3481                                if (response['printing_options'][i].active === false) {
3482                                    status = ' disabled';
3483                                    title = 'Sonderfarbe kann bei Digitaldruck nicht verwendet werden.'
3484                                }
3485                                const img = '/media/boxsys/icon/produktkonfigurator/' + response['printing_options'][i].icon + '.svg';
3486                                const html =
3487                                    '<div class="boxsys_bedruckung_selection' + active + status + '" title="' + title + '">' +
3488                                    '<div class="boxsys_bedruckung_background" style="background-image: url(' + img + ');"></div>' +
3489                                    '<p data-value="' + i + '">' +
3490                                    response['printing_options'][i].label +
3491                                    '</p>' +
3492                                    '</div>'
3493                                prodPrintingOptions.append(html);
3494                            });
3495
3496                            // Uploads
3497                            if (response['callbacks']['fileModified']) {
3498                                $.each(['out', 'in'], function (n, side) {
3499                                    $("#calculation-form-upload-" + side).val(''); // Prevent re-upload since uploads are physical present on server and referenced in calculation
3500                                    $("#upload-delete-" + side).val('0');
3501                                });
3502                            }
3503                            if (response['printing_print']) {
3504                                $("#upload-noprint").hide();
3505                                $("#download-noprint").hide();
3506                                // Online-Designer (Printess)
3507                                $("#printess-noprint").hide();
3508                                $("#printess-opener").show();
3509                                // Service
3510                                $('.boxsys_service_checkbox.hide-noprint input:checkbox').prop("disabled", false);
3511                                $('#service_1_s2_checkbox').prop("checked", true); // default
3512                                // Informationen / Vorlagen
3513                                $(".boxsys_vorlagen_menu li.hide-noprint").show();
3514                                // Druckmotive
3515                                $("#form_calc_select_motifs, #form_calc_select_motifs_2").prop("disabled", false);
3516                            } else {
3517                                $("#upload-noprint").show();
3518                                $("#download-noprint").show();
3519                                // Online-Designer (Printess)
3520                                $("#printess-noprint").show();
3521                                $("#printess-opener").hide();
3522                                // Service
3523                                $('.boxsys_service_checkbox.hide-noprint input:checkbox').prop("checked", false).prop("disabled", true); // uncheck is oneway, except default
3524                                // Infos / Vorlagen
3525                                $(".boxsys_vorlagen_menu li.hide-noprint").hide();
3526                                // Druckmotive
3527                                $("#form_calc_select_motifs, #form_calc_select_motifs_2").prop("disabled", true);
3528                            }
3529
3530                            // Zusammenfassung Info bei Digitaldruck
3531                            if((response['overview_elements']['summary-printing-process'] === "Offsetdruck") || (response['overview_elements']['summary-printing-name'] === "unbedruckt")) {
3532                                $("#info_digital_farbe").hide();
3533                            } else {
3534                                $("#info_digital_farbe").show();
3535                            }
3536
3537                            // Optionen Offsethaken
3538                            if((response['printing_print']) && (response['only_digital'] === 0)) {
3539                                    $('#calculation-form-best-quality input:checkbox').prop("disabled", false);
3540                                if(response['print_format'] === response['print_offset_lj']) {
3541                                    $('#calculation-form-best-quality-fix').show();
3542                                    $('#calculation-form-best-quality').hide();
3543                                } else {
3544                                    $('#calculation-form-best-quality-fix').hide();
3545                                    $('#calculation-form-best-quality').show();
3546                                }
3547                            } else {
3548                                $('#calculation-form-best-quality input:checkbox').prop("checked", false).prop("disabled", true);
3549                                $('#calculation-form-best-quality-fix').hide();
3550                                $('#calculation-form-best-quality').show();
3551                            }
3552
3553                            // Optionen Stanzformhaken
3554                            if(response['only_digital'] === 0) {
3555                                $('#calculation-form-best-quality-cut input:checkbox').prop("disabled", false);
3556                                if(response['diecut_hand_price'] <= response['diecut_plotter']) {
3557                                    $('#calculation-form-best-quality-cut-fix').show();
3558                                    $('#calculation-form-best-quality-cut').hide();
3559                                } else {
3560                                    $('#calculation-form-best-quality-cut-fix').hide();
3561                                    $('#calculation-form-best-quality-cut').show();
3562                                }
3563                            } else {
3564                                $('#calculation-form-best-quality-cut input:checkbox').prop("checked", false).prop("disabled", true);
3565                                $('#calculation-form-best-quality-cut-fix').hide();
3566                                $('#calculation-form-best-quality-cut').show();
3567                            }
3568
3569                            // Online-Designer (Printess)
3570                            $("#printing_print").val(response['printing_print']);
3571
3572                            let hasUpload = '0';
3573                            $.each(['out', 'in'], function (n, side) {
3574                                if (n + 1 <= response['printing_print']) {
3575                                    $(".download-" + side).show();
3576                                    $("#upload-" + side).show();
3577                                    let uploadInfo = $("#upload-info-" + side);
3578                                    if (response['params']['upload_' + side]) {
3579                                        hasUpload = '1';
3580                                        $("#upload-link-" + side).attr("href", response['upload_folder'] + response['params']['upload_' + side]);
3581                                        uploadInfo.show();
3582                                    } else {
3583                                        uploadInfo.hide();
3584                                    }
3585                                } else {
3586                                    $(".download-" + side).hide();
3587                                    $("#upload-" + side).hide();
3588                                }
3589                            });
3590                            $("#has-upload").val(hasUpload);
3591
3592                            // 2D and 3D
3593                            if (response['callbacks']['erpaRequested'] === true || response['callbacks']['fileModified'] === true) {
3594                                $(".calculation-index-index #3d-frame").attr('src', response['files']['3d_html']);
3595                                $(".calculation-index-index #single-svg").attr('src', response['files']['single_svg']);
3596                            }
3597
3598                            // Online-Designer (Printess)
3599                            if (response['params']['printess_token']) {
3600                                $("#printess-dismiss").show();
3601                            } else {
3602                                $("#printess-dismiss").hide();
3603                            }
3604
3605                            // Auflage
3606                            const inpAuflageX = $(".calculation-index-index #calculation-form-quantity").val();
3607                            const inpAuflageY = $(".calculation-index-index #calculation-form-quantity-options .auflageselection").find("tr > td:first-child a");
3608                            inpAuflageY.each(function () {
3609                                if ($(this).data("value") === inpAuflageX) {
3610                                    $(this).closest("tr").addClass("active");
3611                                }
3612                            });
3613
3614                            // Lieferzeit
3615                            const prodTimeSelectParP = $("#prod_time_ins label");
3616                            prodTimeSelectParP.empty();
3617                            let iterator = 0;
3618                            $.each(response['prod_time_options'], function (i) {
3619                                $(prodTimeSelectParP[iterator]).text(response['prod_time_options'][i]);
3620                                iterator++;
3621                            });
3622
3623                            // Service
3624                            $("#sample_u").html(response['sample_u']);
3625
3626                            // Zusammenfassung
3627                            $.each(response['overview_elements'], function (key, value) {
3628                                $("." + key).html(value);
3629                            });
3630
3631                            // Daten für Online-Designer (Printess)
3632                            const spacing = 0;
3633                            $('#xe').val(response['erpa']['xe'] + spacing);
3634                            $('#ye').val(response['erpa']['ye']);
3635
3636                            if (nextAction === 'print-offer') {
3637                                openWindowWithPost("https://www.boxsys.de/calculation/offer/index/", {
3638                                    form_key: "e1pawflSdLlOCitA",
3639                                    calculation_id: "144813",
3640                                });
3641                            }
3642                        } else {
3643                            // Fehlerbehandlung
3644                            const errorMessages = response['error_messages'];
3645                            let errorHtml = '';
3646                            for (let i = 0; i < errorMessages.length; i++) {
3647                                errorHtml += errorMessages[i];
3648                                if (i !== errorMessages.length - 1) {
3649                                    errorHtml += '<br>';
3650                                }
3651                            }
3652                            $('#modal-messages .error-messages').html(errorHtml);
3653                            const $modal = $('#modal-messages');
3654                            $modal.on('modalclosed', function () {
3655                                update();
3656                            });
3657                            $modal.modal('openModal');
3658                        }
3659                    }
3660                });
3661            } else {
3662                document.getElementById("calculation-is-valid").value = "0";
3663            }
3664            btn3d.style.display = "none";
3665            btn2d.style.display = "block";
3666        }
3667
3668        // Auflage
3669        $(".calculation-index-index .boxsys_auflage_container_static .auflageselection").on('click', '.table-tr', function () {
3670            const quantity = $(this).find(".quantity").text();
3671            const quantityX = parseInt(quantity);
3672            $(".calculation-index-index #boxsys_auflage_container #calculation-form-quantity").val(quantityX);
3673            update();
3674        });
3675
3676        $("#submit_auflage").on('click', function () {
3677            update();
3678        });
3679
3680        // Format-Ranges
3681        function updateFormatRanges() {
3682                                                $('#format-range-to-a').html(Math.floor(calculate('480+b*-1')));
3683                                                            $('#format-range-to-b').html(Math.floor(calculate('480+a*-1')));
3684                                                            $('#format-range-to-h').html(Math.floor(calculate('640+1.5*b*-1')));
3685                                                                                                                                                                                                                                                        }
3686
3687        // Format Inputs
3688        $('.boxsys-format-input input').on('change', function () {
3689            calculationForm.validation('clearError'); // Prevent duplicate errors from previous validation (onchange)
3690            if (calculationForm.validation() && calculationForm.validation('isValid')) { // update Format-Ranges only if valid
3691                document.getElementById("calculation-is-valid").value = "1";
3692                updateFormatRanges();
3693            } else {
3694                document.getElementById("calculation-is-valid").value = "0";
3695            }
3696        });
3697
3698        $(".calculation-index-index #update").click(function () {
3699            update();
3700        });
3701
3702        // Format Select
3703        $('#boxsys_format_select').on('change', function () {
3704            const selectedFormatFixData = formatFixData[this.value];
3705            $.each(selectedFormatFixData, function (i, fixValue) {
3706                const input = $("#calculation-form-" + i.replace("_fix", ""));
3707                if (
3708                    i !== "product_format_fix_id"
3709                    &&
3710                    i !== "product_id"
3711                    &&
3712                    i !== "name_fix"
3713                    &&
3714                    i !== "sort_fix"
3715                    &&
3716                    fixValue
3717                    &&
3718                    input !== "undefined"
3719                ) {
3720                    input.val(fixValue);
3721                }
3722            });
3723            updateFormatRanges();
3724            update();
3725        });
3726
3727        // Magazinschlitz Select
3728        $(".calculation-index-index #boxsys_ms_select").on('change', function () {
3729            update();
3730        });
3731
3732        // Material Select
3733        $(".calculation-index-index #calculation-form-material").on('click', ".boxsys_material_selection.enabled", function (e) {
3734            const value = $(e.target).closest(".boxsys_material_selection").find("p").data("value");
3735            $("#calculation-form-material #material_value_hidden").val(value);
3736            update();
3737        });
3738
3739        $(".calculation-index-index #calculation-form-material #material_value_hidden").val($(".calculation-index-index #calculation-form-material .boxsys_material_selection.active").find("p").data("value"));
3740
3741        $(".calculation-index-index .boxsys_material_selection.enabled").click(function () {
3742            $(".calculation-index-index .boxsys_material_selection").removeClass("active");
3743            $(this).toggleClass("active");
3744        });
3745
3746        // Farbigkeit Select
3747        $(".calculation-index-index #calculation-form-printing").on('click', ".boxsys_bedruckung_selection.enabled", function (e) {
3748            const valuePri = $(e.target).closest(".boxsys_bedruckung_selection").find("p").data("value");
3749            $("#calculation-form-printing #printing_value_hidden").val(valuePri);
3750            update();
3751        });
3752
3753        // Lieferzeit Select
3754        $(".calculation-index-index .boxsys_produktion_selection").on('change', function () {
3755            update();
3756        });
3757
3758        // Beste Qualität
3759        $('.calculation-index-index #calc_select_offset').change(function () {
3760            update();
3761        });
3762        $('.calculation-index-index #calc_select_cut').change(function () {
3763            update();
3764        });
3765
3766        // Aufgebaut geliefert
3767        $('.calculation-index-index #calc_select_confection').change(function () {
3768            update();
3769        });
3770
3771        // Anzahl der Druckmotive (Optionen + Auflagen, refs #0004917)
3772        $('.calculation-index-index #form_calc_select_motifs, .calculation-index-index #form_calc_select_motifs_2').change(function () {
3773            update();
3774        });
3775
3776        // Kundenname / Referenz
3777        $(".calculation-index-index #update-customer-reference").click(function () {
3778            update();
3779        });
3780
3781        // In den Warenkorb
3782        $(".calculation-index-index #cart-final").click(function () {
3783            update();
3784        });
3785
3786        // Uploads
3787        const printessToken = $("#printess-token");
3788        const uploadInput = $(".form-upload-input");
3789
3790        uploadInput.click(function () {
3791            if (printessToken.val() && !confirm($.mage.__('Wenn Sie ein eigenes Design hochladen, wird Ihre bisherige Gestaltung mit dem Online Designer verworfen!'))) {
3792                return false;
3793            }
3794        });
3795
3796        uploadInput.change(function () {
3797            // Dismiss Printess  on uploaded file
3798            printessToken.val(''); // Remove token
3799            $.each(['out', 'in'], function (n, side) {
3800                $("#printess-png-" + side).val(''); // Remove urls for png
3801            });
3802            update();
3803        });
3804
3805        $(".calculation-index-index .calc-download").click(function () {
3806            $(".calculation-index-index .calc-download > div").toggleClass("active");
3807        });
3808
3809        function deleteUpload(side) {
3810            $('#upload-delete-' + side).val(1);
3811            update();
3812        }
3813
3814        $("#upload-delete-link-out").click(function () {
3815            if (confirm($(this).data('confirm'))) {
3816                deleteUpload('out');
3817            }
3818        });
3819
3820        $("#upload-delete-link-in").click(function () {
3821            if (confirm($(this).data('confirm'))) {
3822                deleteUpload('in');
3823            }
3824        });
3825
3826        // Update nach Online-Designer (Printess)
3827        $(".calculation-index-index #toggle-update").change(function () {
3828            update();
3829            $(this).val(0);
3830        });
3831
3832        // Angebot drucken
3833        const printOfferButton = $("#print-offer");
3834        printOfferButton.click(function () {
3835            update('print-offer');
3836        });
3837        printOfferButton.show();
3838
3839        function openWindowWithPost(url, data) {
3840            const form = document.createElement("form");
3841            form.target = "_blank";
3842            form.method = "POST";
3843            form.action = url;
3844            form.style.display = "none";
3845
3846            for (const key in data) {
3847                const input = document.createElement("input");
3848                input.type = "hidden";
3849                input.name = key;
3850                input.value = data[key];
3851                form.appendChild(input);
3852            }
3853            document.body.appendChild(form);
3854            form.submit();
3855            document.body.removeChild(form);
3856        }
3857
3858        // Schutz vor ungewolltem Verlassen der Seite
3859        $("#calculation-form").submit(function() {
3860            $('#submitting').val('1');
3861        });
3862        $(window).bind('beforeunload', function() {
3863            if($('#updated').val() === '1' && $('#submitting').val() !== '1') {
3864                return 'Ihre Konfiguration geht verloren: Wollen Sie die Seite wirklich verlassen?';
3865            }
3866        });
3867        /*$(window).bind('beforeunload', function(event) {
3868            if($('#updated').val() === '1' && $('#submitting').val() !== '1') {
3869                setTimeout(function () {
3870                    var retVal = confirm("Sie verlassen den Konfigurator und alle Ihre Eingaben gehen verloren.\n\nMöchten Sie Ihre Daten speichern?");
3871                    if (retVal === true) {
3872                        $('#save-calculation').click();
3873                        return true;
3874                    } else {
3875                        return false;
3876                    }
3877                });
3878            }
3879        });*/
3880    });
3881</script>
3881
3882</div></div></main><footer class="page-footer"><div class="footer content"><small class="bugs">
3883    &nbsp;
3884</small>
3885<style>#html-body [data-pb-style=PGXJWRF]{justify-content:flex-start;display:flex;flex-direction:column;background-position:left top;background-size:cover;background-repeat:no-repeat;background-attachment:scroll}</style><div data-content-type="row" data-appearance="full-width" data-enable-parallax="0" data-parallax-speed="0.5" data-background-images="{}" data-background-type="image" data-video-loop="true" data-video-play-only-visible="true" data-video-lazy-load="true" data-video-fallback-src="" data-element="main" data-pb-style="PGXJWRF"><div class="row-full-width-inner" data-element="inner"><div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><div class="boxsys-footer-grid">
3886<div class="boxsys-footer-logo">
3887<img src="https://www.boxsys.de/media/logo/stores/1/boxsys_logo_400px.png" loading="lazy" alt="BOXSYS Logo" />
3888</div>
3889<div class="boxsys-footer-info">
3890<h4>HILFE &amp; INFORMATIONEN</h4>
3891<p><a href="/service/boxsys-wiki.html">BOXSYS WIKI</a></p>
3892<p><a href="/zahlung_versand">Zahlung & Versand</a></p>
3893<p><a href="/media/boxsys/boxsys_druckdaten_erstellung.pdf" target="_blank">Druckdatenanleitung (PDF)</a></p>
3894<p><a href="/datenschutz">Datenschutz</a></p>
3895<p><a href="/agb">AGB</a></p>
3896<p><a href="/impressum">Impressum</a></p>
3897</div>
3898<div class="boxsys-footer-kunden">
3899<h4>KUNDENBEREICH</h4>
3900<p><a href="https://www.boxsys.de/customer/account/">Mein Account</a></p>
3901<p><a href="/kontakt.html">Allgemeine Anfrage</a></p>
3902</div>
3903<div class="boxsys-footer-contact">
3904<h4>KONTAKT</h4>
3905<p style="font-size: 16px;">Persönliche Fachberatung:</p>
3906<p><a href="tel:+494088919149"><b>+49 40 88 91 91 49</b></a></p>
3907<p style="font-size: 16px;">Mo. - Fr.: 8:00 - 16:00 Uhr</p>
3908<p><a href="mailto:[email protected]">Email: [email protected]</a></p>
3909</div>
3910<div class="boxsys-footer-pay">
3911<h4>SICHERE BEZAHLUNGSMÖGLICHKEITEN</h4>
3912<img src="https://www.boxsys.de/media/boxsys/icon/icons/unzer.svg" loading="lazy" alt="Unzer Payment">
3913<img src="https://www.boxsys.de/media/boxsys/icon/icons/mastercard.svg" loading="lazy" alt="Mastercard">
3914<img src="https://www.boxsys.de/media/boxsys/icon/icons/visa.svg" loading="lazy" alt="Visa">
3915<img src="https://www.boxsys.de/media/boxsys/icon/icons/sofort.svg" loading="lazy" alt="Sofortüberweisung">
3916<img src="https://www.boxsys.de/media/boxsys/icon/icons/paypal.svg" loading="lazy" alt="PayPal">
3917</div>
3918<div class="boxsys-footer-social">
3919<h4>SOCIAL MEDIA</h4>
3920<a href="https://www.instagram.com/boxsys/" target="_blank" rel="noopener noreferrer">
3921  <img src="https://www.boxsys.de/media/boxsys/icon/icons/instagram.svg" loading="lazy" alt="Instagram Logo">
3922</a>
3923<a href="https://www.linkedin.com/company/onlinedruckerei-boxsys/" target="_blank" rel="noopener noreferrer">
3924  <img style="padding-left: 25px;" src="https://www.boxsys.de/media/boxsys/icon/icons/linkedin.svg" loading="lazy" alt="Linkedin Logo">
3925</a>
3926<a href="https://www.facebook.com/profile.php?id=100089975120858" target="_blank" rel="noopener noreferrer">
3927  <img style="padding-left: 25px;" src="https://www.boxsys.de/media/boxsys/icon/icons/facebook.svg" loading="lazy" alt="Facebook Logo">
3928</a>
3929<a href="https://www.xing.com/pages/onlinedruckerei-boxsys" target="_blank" rel="noopener noreferrer">
3930  <img style="padding-left: 25px;" src="https://www.boxsys.de/media/boxsys/icon/icons/xing.svg" loading="lazy" alt="Xing Logo">
3931</a>
3932</div>
3933<div class="boxsys-footer-125">
3934<img src="https://www.boxsys.de/media/boxsys/icon/icons/125-jahre.svg" loading="lazy" alt="125 Jahre Logo">
3935</div>
3936<div class="boxsys-footer-certificate">
3937<h4>Zertifizierte Qualität und Nachhaltigkeit</h4>
3938<div class="boxsys-footer-certificate-icons">
3939<img src="https://www.boxsys.de/media/boxsys/icon/icons/blauer-engel.svg" loading="lazy" alt="Blauer Engel Logo">
3940<img src="https://www.boxsys.de/media/boxsys/icon/icons/fsc.svg" loading="lazy" alt="FSC Logo">
3941<img src="https://www.boxsys.de/media/boxsys/icon/icons/climatepartner.svg" loading="lazy" alt="ClimatePartner Logo">
3942<img src="https://www.boxsys.de/media/boxsys/icon/icons/iso9001.svg" loading="lazy" alt="ISO 9001 Logo">
3943<img src="https://www.boxsys.de/media/boxsys/icon/icons/pso.svg" loading="lazy" alt="PSO Logo">
3944</div>
3945</div>
3946<div class="boxsys-footer-copyright">
3947Copyright © BOXSYS® 2023 - Alle Rechte vorbehalten | BOXSYS® ist ein Service der Langebartels+Jürgens Hamburg GmbH, Wördemanns Weg 58, 22527 Hamburg<br>
3948Alle Rechte vorbehalten: Alle auf dieser Internetpräsenz verwendeten Texte, Fotos und grafischen Gestaltungen sind urheberrechtlich geschützt.
3949</div>
3950</div></div></div></div><div data-content-type="block" data-appearance="default" data-element="main"><div class="widget block block-static-block">
3951    <style>#html-body [data-pb-style=WD5OA91]{display:none}</style><div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><style>
3952#boxsys-side-button-3:hover{width:635px;}
3953#boxsys-side-button-1 {top: calc(50vh - 93px);}
3954#boxsys-side-button-2 {top: calc(50vh - 28px);}
3955#boxsys-side-button-3 {top: calc(50vh - 158px);}
3956.boxsys-side-button i{font-style: normal;}
3957.boxsys-side-button img{margin: 0 20px 0 13px;}
3958@media (max-width: 768px){
3959	.boxsys-side-button{display:flex;}
3960}
3961@media (max-width: 500px){
3962	.boxsys-side-button i{display:none;}
3963        .boxsys-side-button img{margin: 0 auto;}
3964        .boxsys-side-button {border-radius: 6px 6px 0 0; width: 30%;
3964 right: unset; bottom: 0;}
3965        #boxsys-side-button-3{top: unset; left: 2.5%;background-color: #1374bbdd;}
3966        #boxsys-side-button-1{display:none !important;}
3967        #boxsys-side-button-2{top: unset; left: 35%;background-color: #1374bbdd;}
3968#boxsys-side-button-1:hover{width:30%;}
3969#boxsys-side-button-2:hover{width:30%;}
3970#boxsys-side-button-3:hover{width:30%;}
3971#boxsys-side-button-4:hover{width:30%;}
3972.boxsys-oeko-content{width:100%; top: unset; bottom: 55px;}
3973}
3974</style>
3975<a id="boxsys-oeko-open">
3976<div class="boxsys-side-button" id="boxsys-side-button-1">
3977<img src="https://www.boxsys.de/media/boxsys/icon/icons/oeko.svg" loading="lazy" alt="&Ouml;ko Button Icon">
3978<i>Umweltfreundlichste Verpackungsdruckerei</i>
3979<div id="boxsys-side-oeko" class="boxsys-oeko-content">
3980<span>X</span>
3981Boxsys ist die umweltfreundlichste Verpackungsdruckerei in Deutschland.<br><br>
3982Wir unterst&uuml;tzen kein Greenwashing und bieten anerkannte &Ouml;kozertifikate.<br><br>
3983<b>100% &Ouml;ko</b><br>
3984<b>100% nachhaltig</b><br>
3985<b>100% CO&sup2; neutral</b><br><br>
3986Erkl&auml;rungen auf der Seite Nachhaltigkeit<br><br>
3987<div class="boxsys-oeko-icons">
3988<img src="https://www.boxsys.de/media/boxsys/icon/icons/blauer-engel-w.svg" loading="lazy" alt="Blauer Engel Logo wei&szlig;">
3989<img src="https://www.boxsys.de/media/boxsys/icon/icons/fsc-w.svg" loading="lazy" alt="FSC Logo wei&szlig;">
3990<img src="https://www.boxsys.de/media/boxsys/icon/icons/climatepartner-w.svg" loading="lazy" alt="ClimatePartner Logo wei&szlig;">
3991</div>
3992</div>
3993</div> <!--boxsys-side-button-1--></a>
3994
3995<a href="/service/online-beratung.html">
3996<div class="boxsys-side-button" id="boxsys-side-button-2">
3997<img src="https://www.boxsys.de/media/boxsys/icon/icons/beratung.svg" loading="lazy" alt="Beratung Button Icon">
3998<i>Online - Beratung</i>
3999</div></a>
4000
4001<a href="tel:+494088919149">
4002<div class="boxsys-side-button" id="boxsys-side-button-3">
4003<img src="https://www.boxsys.de/media/boxsys/icon/icons/kontakt.svg" loading="lazy" alt="Kontakt Button Icon">
4004<i>040 - 88 91 91 49</i>
4005</div></a>
4006
4007<script>
4008document.getElementById("boxsys-oeko-open").onclick = function() {myFunction()};
4009function myFunction() {
4010  document.getElementById("boxsys-side-oeko").classList.toggle("boxsys-oeko-show");
4011  document.getElementById("boxsys-side-button-2").classList.toggle("boxsys-oeko-hidden");
4012  document.getElementById("boxsys-side-button-3").classList.toggle("boxsys-oeko-hidden");
4013  document.getElementById("boxsys-side-button-4").classList.toggle("boxsys-oeko-hidden");
4014  document.getElementById("boxsys-side-button-1").classList.toggle("boxsys-oeko-fix");
4015}
4016</script>
4016
4017<a href="#html-body" id="totop">&#9650;</a></div><div data-content-type="html" data-appearance="default" data-element="main" data-pb-style="WD5OA91" data-decoded="true"><style>
4018/********* HEADER *********/
4019  .boxsys_top_sticky{z-index:9999; position: fixed; left: 0; top:0; width: 100%;background-color: #f3f3f3;height:25px;}
4020  .boxsys_top_shortcut, .boxsys_top_shortcut a{color:#707070;text-decoration: none;display: flex;font-weight:100;font-family:"Nexa Book";font-size:12px;align-items: center;justify-content: space-between;}
4021  .boxsys_top_shortcut svg{padding: 3px 10px 3px 0px;height: 25px;}
4022  .boxsys_top_shortcut div{display: flex;align-items: center;}
4023  .sticky_icon_bg{fill:#707070;}
4024  .sticky_icon_txt{fill:#ffffff;}
4025  @media (max-width: 1200px) {.boxsys_top_sticky{font-size:10px;}} 
4026  @media (max-width: 990px) {.boxsys_top_sticky{display:none;}} 
4027.flex-icons>div{position:relative;width:53px;height:53px;}
4028.flex-icons>div img{margin-top:0;height:53px;}
4029</style>
4030
4031<div class="boxsys_top_sticky">
4032<div class="container">
4033<div class="boxsys_top_shortcut">
4034<div>
4035<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 80 80">
4036<path class="sticky_icon_bg" d="M71,80H9c-5,0-9-4-9-9V9c0-5,4-9,9-9h62c5,0,9,4,9,9v62C80,76,76,80,71,80z"></path>
4037<path class="sticky_icon_txt" d="M40,6.4L12.5,18.6v18.3c0,17,11.7,32.8,27.5,36.7c15.8-3.9,27.5-19.7,27.5-36.7V18.6L40,6.4z
4038	 M40,40h21.4c-1.6,12.6-10,23.8-21.4,27.3V40l-21.4,0V22.6L40,13.1V40z"></path>
4039</svg>
4040&Uuml;ber 125 Jahre Erfahrung
4041</div>
4042<div>
4043<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 80 80">
4044<path class="sticky_icon_bg" d="M71,80H9c-5,0-9-4-9-9V9c0-5,4-9,9-9h62c5,0,9,4,9,9v62C80,76,76,80,71,80z"></path>
4045<path class="sticky_icon_txt" d="M28.4,46.9c-5.8,0-11,3.8-12.6,9.4c-0.3,0.8-1.1,1.3-1.9,1.3c-1.4,0-5.9-3.6-7.2-4.5
4046	c0,10.7,4.9,20.1,16.6,20.1c9.9,0,16.6-5.7,16.6-15.6c0-0.4-0.1-0.8-0.1-1.2L28.4,46.9z M66.2,6.7c-1.9,0-3.8,0.8-5.2,2.1
4047	C34.4,32.6,31.7,33.2,31.7,40.1c0,1.7,0.4,3.5,1.1,5l8.3,6.9c1,0.3,1.9,0.4,2.9,0.4c8.1,0,12.8-5.9,27.5-33.3c1.1-1.8,1.7-3.9,1.8-6
4048	C73.1,9.4,70,6.6,66.2,6.7z"></path>
4049</svg>
4050Designvorlagen frei verf&uuml;gbar
4051</div>
4052<div>
4053<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 80 80">
4054<path class="sticky_icon_bg" d="M71,80H9c-5,0-9-4-9-9V9c0-5,4-9,9-9h62c5,0,9,4,9,9v62C80,76,76,80,71,80z"></path>
4055<path class="sticky_icon_txt" d="M61.3,17.8l-29,29L18.7,33.3c-1.2-1.2-3.2-1.2-4.4,0L10,37.7c-1.2,1.2-1.2,3.2,0,4.4l20.1,20.1
4056	c1.2,1.2,3.2,1.2,4.4,0c0,0,0,0,0,0l23.3-23.3L70,26.6c1.2-1.2,1.2-3.2,0-4.4l-4.4-4.4C64.4,16.6,62.5,16.6,61.3,17.8z"></path>
4057</svg>
4058Datencheck inklusive
4059</div>
4060<a href="tel:+494088919149">
4061<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 80 80">
4062<path class="sticky_icon_bg" d="M71,80H9c-5,0-9-4-9-9V9c0-5,4-9,9-9h62c5,0,9,4,9,9v62C80,76,76,80,71,80z"></path>
4063<path class="sticky_icon_txt" d="M68.2,12.5L55.8,9.7c-1.3-0.3-2.7,0.4-3.3,1.7l-5.7,13.3c-0.5,1.2-0.2,2.5,0.8,3.3l7.2,5.9
4064	c-4.4,9.2-11.8,16.7-21,21L28,47.7c-0.8-1-2.2-1.3-3.3-0.8l-13.3,5.7c-1.3,0.6-2,1.9-1.7,3.3l2.8,12.3c0.3,1.3,1.4,2.2,2.8,2.2
4065	c30.4,0,55.1-24.6,55.1-55c0,0,0,0,0,0C70.4,14,69.5,12.8,68.2,12.5z"></path>
4066</svg>
4067040 889191 49
4068</a>
4069<a href="mailto:[email protected]">
4070<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 80 80">
4071<path class="sticky_icon_bg" d="M71,80H9c-5,0-9-4-9-9V9c0-5,4-9,9-9h62c5,0,9,4,9,9v62C80,76,76,80,71,80z"></path>
4072<path class="sticky_icon_txt" d="M15.6,17.5c-3.1,0-5.6,2.5-5.6,5.6c0,1.8,0.8,3.4,2.2,4.5l25.5,19.1c1.3,1,3.2,1,4.5,0l25.5-19.1
4073	c1.4-1.1,2.2-2.7,2.2-4.5c0-3.1-2.5-5.6-5.6-5.6C64.4,17.5,15.6,17.5,15.6,17.5z M10,30.6V55c0,4.1,3.4,7.5,7.5,7.5h45
4074	c4.1,0,7.5-3.4,7.5-7.5V30.6L44.5,49.8c-2.7,2-6.3,2-9,0L10,30.6z"></path>
4075</svg>
4076[email protected]
4077</a>
4078</div>
4079</div>
4080</div>
4081
4082
4083<style>
4084.page-header.boxsys-sticky-ph{top:0px;border-bottom: solid 1px #e5e5e5;box-shadow: 2px 2px 5px #777;}
4085.boxsys-sticky-li{position: absolute;clip: rect(0px 88px 52px 55px);left: -55px;top: 4px;}
4086.boxsys-sticky-hc{padding-top: 5px !important;height:55px !important;}
4087.boxsys-sticky-pw{top: 3px !important;}
4088.boxsys-sticky-um{padding-left: 55px !important;}
4089@media (max-width: 1200px){
4090    .boxsys-sticky-hi div{margin: 0 5px;}
4091}
4092@media (max-width: 991px){
4093    .page-header{top:0px;}
4094    .boxsys-sticky-um{padding-left: 25px !important;}
4095    .boxsys-sticky-li{left: -70px;}
4096}
4097@media (max-width: 890px){
4098    .boxsys-sticky-um li a{padding: 0 5px !important;}
4099}
4100@media(max-width: 768px){
4101    .boxsys-sticky-li{position: relative;clip: unset;left: 0px;}
4102}
4103
4104</style>
4105<script>
4106const pageheader = document.querySelector(".page-header");
4107const boxsyssph = "boxsys-sticky-ph";
4108const logoimg = document.querySelector(".logo img");
4109const boxsyssli = "boxsys-sticky-li";
4110const pagewrapperhc = document.querySelector(".header.content");
4111const boxsysshc = "boxsys-sticky-hc";
4112const pageheaderpw = document.querySelector(".page-header .panel.wrapper");
4113const boxsysspw = "boxsys-sticky-pw";
4114const navui = document.querySelector(".navigation ul");
4115const boxsyssum = "boxsys-sticky-um";
4116const headericons = document.querySelector(".boxsys-header-icons");
4117const boxsysshi = "boxsys-sticky-hi";
4118
4119window.addEventListener("scroll", () => {
4120  const currentScroll = window.pageYOffset;
4121  if (currentScroll > 250) {
4122    pageheader.classList.add(boxsyssph);
4123    logoimg.classList.add(boxsyssli);
4124    pagewrapperhc.classList.add(boxsysshc);
4125    pageheaderpw.classList.add(boxsysspw);
4126    navui.classList.add(boxsyssum);
4127  } else {
4128    pageheader.classList.remove(boxsyssph);
4129    logoimg.classList.remove(boxsyssli);
4130    pagewrapperhc.classList.remove(boxsysshc);
4131    pageheaderpw.classList.remove(boxsysspw);
4132    navui.classList.remove(boxsyssum);
4133  }
4134});
4135</script>
4135</div><div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><style>
4136/********* COOKIEBOT *********/
4137#CookiebotWidget {font-size: 14px !important;left: unset !important;right: -400px;bottom: unset !important;top: calc(50vh + 37px);width: 455px;background-image: url("https://www.boxsys.de/media/boxsys/icon/icons/fingerprint_icon.png")!important;
4138    background-repeat: no-repeat !important;background-color: #1174bb !important;border-radius: 6px 0 0 6px !important;box-shadow: none !important;min-height: 55px !important;
4139    min-width: 55px !important;transition: width 1s !important;content: "Cookie - Einstellungen";padding-left: 55px;z-index:99998 !important;}
4140#CookiebotWidget .CookiebotWidget-logo::after {font-family: "Nexa Book"; font-size: 16px; sans-serif !important; content: "Cookie - Einstellungen";height: 16px;position: absolute;align-items: center;display: flex; left: 65px; top: 19.5px;color: #fff !important;}
4141#CookiebotWidget:not(.CookiebotWidget-open) .CookiebotWidget-logo {width:100%;}
4142#CookiebotWidget:hover {width:670px;}
4143#CookiebotWidget.CookiebotWidget-open #CookiebotWidget-widgetContent {position:fixed; right:0; border-radius: 6px 0 0 6px !important; border:solid 1px #777;}
4144#CookiebotWidget .CookiebotWidget-logo svg circle {display: none;}
4145#CookiebotWidget .CookiebotWidget-logo svg path {display: none;}
4146@media (max-width: 500px){
4147    #CookiebotWidget {width:30%; right: 2.5%; top: unset; bottom: 0 !important; background-position: center !important; background-color: #1174bbdd !important; border-radius: 6px 6px 0 0 !important;    z-index: 9999999 !important;}
4148    #CookiebotWidget .CookiebotWidget-logo::after {content: "";}
4149    #CookiebotWidget:hover {width:30%;}
4150    #CookiebotWidget.CookiebotWidget-open #CookiebotWidget-widgetContent{width: 100%; top: 0; border-radius: 6px !important; margin: 40px 0; max-height: calc(100vh - 110px);}
4151    #CookiebotWidget.CookiebotWidget-open #CookiebotWidget-widgetContent .CookiebotWidget-contents{margin: 0 auto;}
4152{
4153</style></div><div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><style>
4154/********* &#196;NDERUNGEN *********/
4155
4156/*mobile Fehler-04.06.2025*/
4157.category-cms{width:100%;}
4158
4159@media (max-width: 854px){
4160.category-cms iframe{width: 100% !important; height: calc(100vw * 0.5281) !important;}
4161}
4162
4163/*** Checkout Hinweis an uns ***/
4164.gift-item-block .title{background: #1979c3; border: 1px solid #1979c3; color: #fff;}
4165.gift-item-block .title:hover {background: #006bb4; border: 1px solid #006bb4; color: #fff;}
4166.cart-gift-item .action-update{background: #A0D941; border: solid 1px #A0D941; color: #fff;}
4167.cart-gift-item .action-update:hover{background:#85c026; border: solid 1px #85c026;}
4168
4169
4170
4171.checkleiste .check, .checkleiste .white, .checkleiste .white-blue-half, .checkleiste .white-blue{width:25%; text-align:center;}
4172
4173/*Kundenbereich*/
4174.block-collapsible-nav .content {background: #fff;}
4175.block-collapsible-nav .item.current a, .block-collapsible-nav .item.current>strong {border-color: #1174bb;}
4176
4177.calculation-index-index #maincontent{margin-top:0px;}
4178
4179.boxsys-faq-container-title svg {margin: 0 20px 0 0;}
4180
4181/*custom.css1944*/
4182.boxsys-faq-container-title {text-align: left;max-width: 1100px;width: calc(100% - 40px);margin: 15px auto;display: block;}
4183@media (max-width: 768px){
4184    .boxsys-faq-container-title {width:100%;margin:15px 0px;}
4185}
4186
4187.category-description .pagebuilder-column:nth-child(1){z-index:20}
4188.category-description .pagebuilder-column:nth-child(2){z-index:10}
4189
4190.boxsys-category-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:30px;padding-bottom:60px;}
4191.boxsys-category-box{background-color:#fff;width:100%;position:relative;}
4192.boxsys-category-box:hover{box-shadow:0px 0px 10px #333;}
4193.boxsys-category-box img{width:100%;height:auto; padding-bottom: 120px;}
4194.boxsys-category-grid a{text-decoration: none;}
4195.boxsys-category-box button{height:40px;color:#fff;background-color:#1174bb;font-size:16px;border:none;border-radius:4px;margin-top: 10px;cursor:pointer;position: absolute;bottom: 20px;left: 20px;right: 20px;}
4196.boxsys-category-box-text{font-size:18px;color:#333;line-height: 18px;position:absolute;bottom:60px;left:20px;right:20px;min-height:74px;}
4197.boxsys-category-box-text span{font-size:14px;}
4198.boxsys-category-grid-title{font-size:20px;color:#fff;text-align:center;padding:100px 0 20px 0;}
4199@media (max-width: 1400px){
4200	.boxsys-category-box-text{font-size:16px;}
4201	.boxsys-category-box-text span{font-size:12px;}
4202}
4203@media (max-width: 1280px){
4204	.boxsys-category-grid{grid-template-columns:repeat(3, 1fr)}
4205}
4206@media (max-width: 992px){
4207	.boxsys-category-grid{grid-template-columns:repeat(2, 1fr)}
4208}
4209@media (max-width: 630px){
4210	.boxsys-category-grid{grid-template-columns:repeat(1, 1fr)}
4211}
4212
4213/****reCaptcha****/
4214.grecaptcha-badge{margin-left:25.8%;margin-bottom: 30px;}
4215
4216/****Kategoriebilder besser platzieren****/
4217.boxsys-category-image{margin: -25% -100px -170px -100px;}
4218.category-koffer-trageverpackung-verpackung-mit-griff .boxsys-category-image{margin: -25% -100px -170px -10px;}
4219.category-sortiment .boxsys-category-image{margin: -25% -50px -170px -50px;}
4220.category-werbeschilder .boxsys-category-image {margin: -20% 0 -20px 0;}
4221.category-nachhaltige-verpackung .boxsys-category-image {margin: -40% -100px -190px -180p
4221x;}
4222.category-aufsteller-bedrucken .boxsys-category-image {margin: -40% -100px -200px -10px;}
4223.category-schiebeschachtel .boxsys-category-image {margin: -45% -100px -50px -10px;}
4224.category-pos-displays .boxsys-category-image {margin: -15% -50px -100px -50px;}
4225.category-geschenkverpackung .boxsys-category-image {margin: -30% -100px -130px -100px;}
4226.category-faltschachtel-nach-mass .boxsys-category-image {margin: -30% -100px -140px -100px;}
4227.category-versandkartons-bedrucken .boxsys-category-image {margin: -25% -100px -140px -10px;}
4228.category-klappdeckelkartons .boxsys-category-image {margin: -40% -100px -140px -100px;}
4229.category-banderolen .boxsys-category-image {margin: -25% 0px -170px 0px;}
4230.category-prospektstaender .boxsys-category-image {margin: -35% -100px -100px 0;}
4231.category-stulpdeckelkartons .boxsys-category-image{margin: -25% -100px -50px -100px;}
4232.category-faltschachteln-mit-steckboden .boxsys-category-image {margin: -35% -100px -100px 0;}
4233.category-automatikboden-karton .boxsys-category-image {margin: -25% -100px -100px 0;}
4234.category-faltschachtel-mit-einstecklaschen .boxsys-category-image {margin: -30% -100px -50px 0;}
4235.category-versetzten-einstecklaschen .boxsys-category-image {margin: -30% -100px -50px 0;}
4236.category-schuber .boxsys-category-image { margin: -25% -100px -120px -100px;}
4237.category-eurolochaufhaenger .boxsys-category-image {margin: -20% -100px -80px 0;}
4238.category-eurolochaufhaenger-karton .boxsys-category-image {margin: -20% -100px -80px 0;}
4239.category-faltschachteln-mit-einstecklaschen-und-eurolochaufhangung .boxsys-category-image {margin: -20% -100px -80px 0;}
4240.category-eurolochaufhaenger-pappe .boxsys-category-image {margin: -20% -100px -80px 0;}
4241.category-thekendisplays-und-schutten .boxsys-category-image {margin: -40% -100px -60px 0;}
4242.category-faltschachteln-mit-tragegriff .boxsys-category-image {margin: -30% -100px -120px -100px;}
4243.category-losboxen-bedrucken .boxsys-category-image {margin: -20% -20px -60px 0;}
4244.category-karton-individuell-gestalten .boxsys-category-image {margin: -10% 0 -50px 200px;}
4245.category-karton-individuell-gestalten .boxsys-category-image img{max-height:600px !important;}
4246.category-fefco .boxsys-category-image {margin: -5% 0 -130px 200px;}
4247.category-fefco .boxsys-category-image img{max-height:600px !important;}
4248.category-ecma-faltschachtel .boxsys-category-image {margin: -20% 0 -30px 150px;}
4249.category-ecma-faltschachtel .boxsys-category-image img{max-height:700px !important;}
4250@media (max-width: 768px){
4251    .boxsys-category-image{margin: 0 !important;}
4252    .boxsys-category-image img{max-height:unset !important;}
4253}
4254
4255
4256.premium-products img{border:solid 1px #c8c8c8;}
4257.catalog-product-view h3{color:#1174bb;}
4258.boxsys-home-news-text-box:hover {background-color:#1174bb;color:#fff;box-shadow:0 0 10px #777;border:solid 1px #fff;}
4259.category-druckdaten .category-description li{list-style:disc;font-size:14px;}
4260.category-druckdaten h2, .category-druckdaten h3{color:#1174bb;}
4261
4262@media (max-width: 992px){
4263	.category-druckdaten .category-description{margin:50px 0;}
4264}
4265.boxsys-details-h3 h3{color:#1174bb;}
4266.category-online-beratung .control{width:74.2% !important;}
4267.category-online-beratung h2, .category-online-beratung h3{color:#1174bb;}
4268.category-online-beratung .actions-toolbar .primary {float: right; background-color:#1174bb !important;margin:0;}
4269
4270
4271.calculation-customer-saved #maincontent {margin-top: 160px; max-width: 1600px; padding: 0 40px 0 !important;}
4272
4273/********** boxsys nachhaltigkeit seite **********/
4274
4275@media (max-width: 992px){
4276	.boxsys-flip-box-grid{grid-template-columns: repeat(2, 1fr); width:580px !important;}
4277}
4278@media (max-width: 768px){
4279	.boxsys-flip-box-grid{padding-top: 40px;}
4280}
4281@media (max-width: 680px){
4282	.boxsys-flip-box-grid{grid-template-columns: repeat(1, 1fr); width:270px !important;}
4283}
4284
4285/********** boxsys druckdaten seite **********/
4286.boxsys-druckdaten h2{position:relative;}
4287.boxsys-druckdaten-tab {position: absolute !important;top: -100px;}
4288.boxsys-druckdaten-menu{display: flex; justify-content: space-between;border-bottom:solid 1px #c8c8c8;padding:30px 0;margin-bottom:60px;}
4289.boxsys-druckdaten-menu a{color:#777; font-size:20px; font-weight:700; text-decoration: none;padding:0 15px;}
4290.boxsys-druckdaten-menu a:hover{color:#1174bb;}
4291@media (max-width: 1200px){
4292    .boxsys-druckdaten-menu{display: block;}
4293    .boxsys-druckdaten-menu a{display:inline-block;}
4294}
4295@media (max-width: 768px){
4296    .boxsys-druckdaten-menu a{display:block;}
4297}
4298
4299/*custom.css1078*/
4300.sortiment-faltschachteln {padding: 0 20px !important;}
4301
4302/*custom.css1945*/
4303.boxsys-faq-container {float: unset;margin: 15px auto;}
4304
4305/*custom.css1961*/
4306.boxsys-faq-weitere {color: #1174bb;}
4307
4308/*custom.css1996*/
4309.boxsys-umwelt-pic picture>div {width: 100% !important; position: absolute !important;}
4310
4311/*custom.css1361*/
4312.page-products.catalog-category-view #maincontent .products .product-items .item .product-item-info .product-image-container .product-image-wrapper img {padding-bottom: 100px;}
4313@media (max-width: 768px){
4314.page-products.catalog-category-view #maincontent .products .product-items .item .product-item-info .product-image-container .product-image-wrapper img {padding-bottom: 0px;}
4315.page-products.catalog-category-view #maincontent .products .product-items .item .product-item-info .product-item-details {position: relative;}
4316}
4317
4318/*custom.css1834*/
4319.boxsys-produkt-band img {padding-top: 20px;}
4320
4321/*custom.css671*/
4322#banner-slider-demo-1 .boxsys_produkt_waehlen:hover {color: #fff;background: #1174bb;box-shadow: 0px 0px 10px #777;border:solid 1px #fff;}
4323
4324/*custom.css2254*/
4325/*.catalog-product-view .product.media {top: 50px;}*/
4326
4327/*product-config.css1417*/
4328.calculation-index-index div.mage-error {margin-left: 0;text-align: left;}
4329.catalog-product-view .product.media {
4330width:50% !important;
4331    top: -50px;
4332    right: 0;
4333}
4334.catalog-product-view .page-main {position: relative;}
4335
4336@media only screen and (max-width: 768px){
4337    .block-collapsible-nav {top: -45px;}
4338    #totop{display:none !important;}
4339    .category-sortiment .pagebuilder-column img {width: 50%; margin-left: 25%;}
4340    .category-sortiment .pagebuilder-column {padding: 0 !important;}
4341}
4342@media only screen and (max-width: 500px){
4343    h2 {font-size: 22px; line-height: 32px;}
4344    h3 {font-size: 18px; line-height: 28px;}
4345    h4 {font-size: 14px; line-height: 24px;}
4346}
4347.checkout-onepage-success #maincontent{margin-top:150px;}
4348.cart-container li{list-style:none;}
4349
4350.navigation .level0.nav-5 .submenu li {text-align: center;}
4351.navigation .level0.nav-5 .submenu li a{text-align: center !important;}
4352.navigation .level0.nav-5 .submenu {padding: 15px 15px 15px !important; max-width:1200px !important;}
4353
4354
4355@media (max-width: 768px){
4356.catalog-product-view .columns .column.main .product.media {margin: 0;
4357}
4358}
4359
4360/*custom.css1670*/
4361.boxsys-oeko-content {height: unset;}
4362
4363.calculation-index-index .page-header .header.panel{padding-bottom:0; height:55px;}
4364.calculation-index-index .page-header .panel.wrapper {height: 55px;}
4365}
4366
4367/*custom.css610*/
4368#banner-slider-demo-1 .boxsys_produkt_waehlen {background: #fff;}
4369
4370.boxsys-footer-info p,.boxsys-footer-kunden p{padding-top:10px;}
4371
4372@media (max-width: 768px){
4373.page-wrapper li.level0 ul li.level1.category-item.ui-menu-item {width: 100%;clear: both;}
4374.premium-products {display: none;}
4375.boxsys-features {display: none;}
4376}
4377
4378/*****sortiment *****/
4379
4380.sortimentsuebersicht .sort-box:hover h3 {
4381    background-color: #1374bb;
4382}
4383.sortiment.sortimentsuebersicht .sort-box h3 {
4384    padding: 0 0 15px;
4385}
4386.sortimentsuebersicht .sort-box h3 {
4387    font-size:1.4rem !important;
4388    text-align: center;
4389    border: solid 1px #fff;
4390    color: #fff;
4391    padding: 10px;
4392    width: 200px;
4393    margin: 0 auto 30px;
4394    line-height:1.1;
4395}
4396@media (max-width: 991px) {
4397    .sortimentsuebersicht h3.container {
4398        padding: 0 0 10px 0;
4399        text-align: center;
4400    }
4401}
4402
4403.boxsys-produkt-band div {
4404    max-width: 300px;
4405    margin-left: auto;
4406    margin-right: auto;
4407}
4408.cms-home #maincontent {margin-top: 0px;}
4409
4410@media (max-width: 991px){
4411.page-header {margin-bottom: 0px;}
4412#banner-slider-demo-1 {margin: 0px;}
4413}
4414@media only screen and (max-width: 768px){
4415.page-wrapper > div.page-main {margin-top: 0px;}
4416.catalog-product-view .page-main {padding: 0 15px;}
4417.calculation-index-index .logo img {top: 22px;}
4418.minicart-wrapper{top: -13px; left: -46px;}
4419.minicart-wrapper .showcart{position:relative; top: 0px; left: 0px;}
4420.minicart-wrapper .block-minicart {right: -50px;}
4421.minicart-wrapper .action.showcart::before, .minicart-wrapper .action.showcart.active::before {top: 0px; left: 0px;}
4422.minicart-wrapper .block-minicart:before {right: 60px;}
4423.minicart-wrapper .block-minicart:after {right: 59px;}
4424.minicart-wrapper .action.showcart .counter.qty {top: -10px;left: -15px;}
4425.calculation-index-index .minicart-wrapper{top: 10px;}
4426.sortiment-faltschachteln {display: none;}
4427.navigation .level1 {text-transform: uppercase;}
4428.navigation .level2 {text-transform: none;}
4429}
4430@media only screen and (max-width: 639px){
4431.minicart-wrapper { margin-top: 0px;}
4432}
4433.boxcalcinfo {top: 0px; left: calc(50% - 130px);}
4434
4435/**** custom.css 2660 ****/
4436[data-content-type="row"][data-appearance="contained"] {display: flex;}
4437
4438/**** custom.css ab 1223 ****/
4439.page-products.catalog-category-view #maincontent .products .product-items .product-item {
4440    background: white !important;
4441    display: inline-block;
4442    width: calc((100% - 4.5%) / 4);
4443    margin: 0 1.5% 3.2% 0;
4444    position: relative;
4445    padding-bottom: 0;
4446}
4447
4448@media (max-width: 1400px) {
4449    .page-products.catalog-category-view #maincontent .products .product-items .product-item {
4450        margin: 0 1.5% 3.5% 0;
4451    }
4452}
4453
4454@media (max-width: 991px) {
4455    .page-products.catalog-category-view #maincontent .products .product-items .product-item {
4456        width: calc((100% - 3%) / 2);
4457        margin: 0 1.5% 3.2% 0;
4458    }
4459}
4460@media (max-width: 500px) {
4461    .page-products.catalog-category-view #maincontent .products .product-items .product-item {
4462        width: 100%;
4463        padding-bottom: 20px;
4464        margin: 0 0 25px;
4465    }
4466}
4467.customer-account-login .page-wrapper .page-main, .checkout-cart-index .page-wrapper .page-main {margin-top: 0px;}
4468.page-wrapper .nav-sections {
4469    margin: 0;
4470    padding: 0;
4471    z-index: 999999;
4472    background-color: #fff;
4473}
4474/**** custom.css:1179 ****/
4475.page-products.catalog-category-view #maincontent .products.products-grid {padding: 100px 0 20px;}
4476
4477/**** Service Men&#252; ****/
4478.boxsys-service-menu{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 20px;}
4479.boxsys-service-menu .service-menu{background: #fff; padding: 20px 0px 20px 68px; color: #1374bb; font-weight: 700; text-align: center; background-repeat: no-repeat; background-size: contain; border: solid 1px #ddd;}
4480.boxsys-service-menu .service-menu:hover{background-color: #dfeaf2;}
4481.boxsys-service-menu .service-menu.blog{background-image: url("https://www.boxsys.de/media/boxsys/topmenu/boxsys-blog-2.webp");}
4482.boxsys-service-menu .service-menu.wiki{background-image: url("https://www.boxsys.de/media/boxsys/topmenu/boxsys-wiki-2.webp");}
4483.boxsys-service-menu .service-menu.faq{background-image: url("https://www.boxsys.de/media/boxsys/topmenu/boxsys-faq-2.webp");}
4484.boxsys-service-menu .service-menu.druckdaten{background-image: url("https://www.boxsys.de/media/boxsys/topmenu/boxsys-druck-2.webp");background-origin: padding-box;}
4485.boxsys-service-menu .service-menu.beratung{background-image: url("https://www.boxsys.de/media/boxsys/topmenu/boxsys-beratung-2.webp");}
4486@media (max-width: 1024px) {
4487    .boxsys-service-menu{display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px;}
4488}
4489@media (max-width: 700px) {
4490    .boxsys-service-menu{display: grid; grid-template-columns: 1fr; gap: 2px;}
4491    .boxsys-service-menu .service-menu{padding: 10px 0px 10px 68px;}
4492}
4493
4494.wordpress-post-view #maincontent, .wordpress-posttype-view #maincontent {margin-top: 0px !important;}
4495@media (min-width: 769px), print {
4496    .page-layout-2columns-left .column.main {width: 100%;padding-left:0; float: left !important; margin: 0;}
4497}
4498/*#print-offer{display:none !important;}*/
4499input#et-toggle-opt-out:checked + .et-slider {
4500    background-color: #1174bb;
4501}
4502/**** custom.css:1271 ****/
4503.page-products.catalog-category-view #maincontent .products .product-items .item .product-item-info .product-image-container .product-image-wrapper {height: auto;}
4504
4505/**** product-config.css:2076 ****/
4506.boxsys_vorlagen_menu {background-color: #A0D941;}
4507/**** product-config.css:2110 ****/
4508.boxsys_vorlagen_menu ul li a, .boxsys_vorlagen_menu ul li.noprint {color: #fff;}
4509
4510/**** Versandkartongs Text vor dem Bild ****/
4511.boxsys_vk_text{z-index: 100;}
4512
4513/*** modal Nachricht (zb. Ihre Nachricht wurde versand) ***/
4514.modal-wrapper .response span{font-size: 24px; display: block; line-height: 34px; background-color: #A0D941; width: 100%; color: white !important; text-align: center; margin: 30px 0; padding: 10px;} 
4515
4516/*** info Nachricht (zb. Banderole) product-config:2593 ***/
4517#boxsys_format_container .product_info {margin-top: 55px;}
4518.bw2 >
4518 summary {position: relative;}
4519.product_info > .bw2 summary::after, .product_info > .bw2 > summary::marker {position: absolute; right: 5px;font-size:medium;}
4520.product_info > .bw2[open] summary{list-style: none;}
4521.product_info > .bw2[open] summary::after {content: "x";}
4522
4523/*** info BOX h&#246;her product-config:497 ***/
4524.calculation-index-index .extra-info-prepend .extra-info, .calculation-index-index .pu-reset .reset-con {z-index: 99999999;}
4525</style></div></div>
4526</div></div></footer>
4526<script type="text/x-magento-init">
4527        {
4528            "*": {
4529                "Magento_Ui/js/core/app": {
4530                    "components": {
4531                        "storage-manager": {
4532                            "component": "Magento_Catalog/js/storage-manager",
4533                            "appendTo": "",
4534                            "storagesConfiguration" : {"recently_viewed_product":{"requestConfig":{"syncUrl":"https:\/\/www.boxsys.de\/catalog\/product\/frontend_action_synchronize\/"},"lifetime":"1000","allowToSendRequest":null},"recently_compared_product":{"requestConfig":{"syncUrl":"https:\/\/www.boxsys.de\/catalog\/product\/frontend_action_synchronize\/"},"lifetime":"1000","allowToSendRequest":null},"product_data_storage":{"updateRequestConfig":{"url":"https:\/\/www.boxsys.de\/rest\/default\/V1\/products-render-info"},"requestConfig":{"syncUrl":"https:\/\/www.boxsys.de\/catalog\/product\/frontend_action_synchronize\/"},"allowToSendRequest":null}}                        }
4535                    }
4536                }
4537            }
4538        }
4539</script>
4539
4540    <div class="boxsys-b2b-notice"
4541         id="boxsys-b2b-notice"
4542         role="dialog"
4543         aria-modal="true"
4544         aria-labelledby="boxsys-b2b-notice-title"
4545         data-mage-init='&#x7B;&quot;Boxsys_Customer&#x5C;&#x2F;js&#x5C;&#x2F;b2b-notice&quot;&#x3A;&#x7B;&quot;cookieName&quot;&#x3A;&quot;boxsys_b2b_notice&quot;,&quot;cookieLifetime&quot;&#x3A;2592000&#x7D;&#x7D;'>
4546        <div class="boxsys-b2b-notice-box">
4547            <h2 class="boxsys-b2b-notice-title" id="boxsys-b2b-notice-title">
4548                Willkommen bei BOXSYS            </h2>
4549            <p class="boxsys-b2b-notice-text">
4550                Unser Angebot richtet sich ausschließlich an gewerbliche Kunden und Unternehmen.            </p>
4551            <button type="button" class="action primary boxsys-b2b-notice-accept" data-role="accept">
4552                <span>Weiter zum B2B-Shop</span>
4553            </button>
4554        </div>
4555    </div>
4556<script>    // add product to cart
4557    (() => {
4558        if(!window.hyva)
4559            return;
4560
4561        window.addEventListener('private-content-loaded', function(event) {
4562            const sectionData = event.detail.data;
4563            if(!sectionData || !sectionData["etracker-custom-section"])
4564                return;
4565
4566            const added_products = sectionData["etracker-custom-section"].added_products;
4567            if(!added_products)
4568                return;
4569
4570            for (const [key, added_product] of Object.entries(added_products)) {
4571                function _etrackerSendInsertToBasketEvent() {
4572                    const et_Commerce_product = {
4573                        id: added_product.id,
4574                        name: added_product.name,
4575                        category: added_product.category,
4576                        price: added_product.price,
4577                        currency: added_product.currency,
4578                        variants: {}
4579                    };
4580                    etCommerce.sendEvent('insertToBasket', et_Commerce_product, parseFloat(added_product.qty));
4581                }
4582
4583                if(typeof _etracker !== 'undefined') {
4584                    _etrackerSendInsertToBasketEvent();
4585                } else {
4586                    window._etrackerOnReady = typeof window._etrackerOnReady === 'object' ?
4587                        window._etrackerOnReady :
4588                        [];
4589                    window._etrackerOnReady.push(_etrackerSendInsertToBasketEvent);
4590                }
4591            }
4592
4593            // force reload customer section data, otherwise event would be triggered more than once
4594            window.dispatchEvent(new Event('reload-customer-section-data'));
4595        }, { once: true });
4596    })();
4597
4598    // remove product from cart via sidebar
4599    (() => {
4600        if(!window.hyva || typeof(initCartDrawer) === 'undefined')
4601            return;
4602
4603        const origInitCartDrawer = initCartDrawer;
4604        window.initCartDrawer = function () {
4605            const instance = origInitCartDrawer.apply(null, arguments);
4606            const origDeleteItemFromCart = instance.deleteItemFromCart;
4607            instance.deleteItemFromCart = function (itemId) {
4608                origDeleteItemFromCart.apply(instance, arguments);
4609                window.setTimeout(function() {
4610                    const postUrl = BASE_URL + 'checkout/sidebar/removeItem/';
4611                    fetch(postUrl, {
4612                        method: "POST",
4613                        headers: {
4614                            "X-Requested-With": "XMLHttpRequest",
4615                        },
4616                    })
4617                    .then(response => {
4618                        if (response.ok) {
4619                            return response.json();
4620                        }
4621                    })
4622                    .then(data => {
4623                        if (data && data.etracker && data.etracker.removed_product) {
4624                            const product = data.etracker.removed_product;
4625                            const et_Commerce_product = {
4626                                id: product.id,
4627                                name: product.name,
4628                                category: product.category,
4629                                price: product.price,
4630                                currency: product.currency,
4631                                variants: {}
4632                            };
4633                            etCommerce.sendEvent('removeFromBasket', et_Commerce_product, parseFloat(product.qty));
4634                        }
4635                    });
4636                }, 100);
4637            }
4638            return instance;
4639        }
4640    })();</script>
4640
4641</div>    
4641<script>
4642        require(['jquery','weltpixel_ga4_persistentLayer','weltpixel_ga4_gtm', 'Magento_Customer/js/customer-data'],
4643            function ($, wpGa4PersDl ,wpGa4gtm, customerData) {
4644                $( document ).ajaxComplete(function( event, xhr, settings ) {
4645                    if (settings.url.search('/customer\/section\/load/') > 0) {
4646                        var response = xhr.responseJSON;
4647                        if (response.wp_ga4) {
4648                            var dataLayerData = $.parseJSON(response.wp_ga4.datalayer);
4649                            for (index in dataLayerData) {
4650                                window.dataLayer.push({ecommerce: null});
4651                                window.dataLayer.push(dataLayerData[index]);
4652                            }
4653                        }
4654                    }
4655                });
4656                var wpPersDlOptions = {'storageExpiryTime' : 30 };
4657                var wpGtmOptions = {
4658                    'enabled' : 0,
4659                    'persDataLayer' : wpGa4PersDl
4660                };
4661                wpGa4PersDl.init(wpPersDlOptions);
4662                wpGa4gtm.trackPromotion(wpGtmOptions);
4663            });
4664    </script>
4664
4665    </body>
4666</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.