/* moved to styles2-page-setup.css */
.disabled { pointer-events: none; }
.strikethrough { position: relative; }
.strikethrough:before { position: absolute; content: ""; left: 0; top: 50%; right: 0; border-top: 2px solid; border-color: inherit; transform:rotate(-12deg); }
.strikethroughr { position: relative; }
.strikethroughr:after { position: absolute; content: ""; left: 0; top: 50%; right: 0; border-top: 2px solid; border-color: inherit; transform:rotate(+12deg); }
.flag-big { height: 30px; border: 1px solid black; }
.flag-small { height: 14px; border: 1px solid black; }
a.button { display: inline-block; background: rgba(255, 255, 255, 0.3); }
a.button span { display: inline-block; padding: 10px 20px 10px 10px; }
a.button img { float: left; padding-top: 3px; }
a.button:hover { background: rgba(255, 255, 255, 0.5); }
input[readonly], select[readonly], textarea[readonly] { background: rgba(255, 255, 255, 0.25); }
::placeholder { color: #afafaf; opacity: 1; }
:-ms-input-placeholder { color: #585858; }
::-ms-input-placeholder { color: #585858; }
.underline { text-decoration: underline; }
.bold { font-weight: 700; }
/*
 * **************
 * *** Header ***
 * **************
 */
div.headerHolder {
	position: sticky; 
	top: 0; 
	z-index: 1040;
	width: 100%;
}
header.header { background: #585858E0; height: 64px; width: 100%; font-size: 0; position: relative; z-index: 1040; display: flex; }
header.header > * { font-size: initial; }
header.header div.logo { display: flex; }
header.header div.logo a { display: flex; }
header.header div.logo img.logoTxt { max-width: 150px; max-height: 60px; margin: 10px; align-self: center; }
header.header div.info { display: none; height: 100%; justify-content: center; align-items: center; }
header.header div.info a { color: #ffffff; }
header.header div.backbutton { display: none; justify-content: right; align-items: center; }
header.header div.backbutton a { color: #ffffff; font-weight: bold; }
header.header div.mainNavigation { height: 100%; display: inline-block; padding: 0 10px 0 10px; margin-left: auto; }
header.header div.mainNavigation ul { list-style: none; padding: 0; display: flex; justify-content: right; align-items: center; gap: 10px; }
header.header div.mainNavigation ul li { display: inline-block; padding-left: 20px; }
header.header div.mainNavigation ul li a:hover { }
header.header div.mainNavigation ul li a:hover img { opacity: 0.5; }
header.header div.mainNavigation ul li.basket { width: 100px; }
header.header div.mainNavigation ul li.currentLanguage a img { opacity: 0.5; }
header.header div.mainNavigation ul li.currentLanguage a:hover img { opacity: 1; }
header.header div.mainNavigation ul li div.itemCount { height: 1em; width: 1em; background-color: #fff; border-radius: 50%; display: inline-block; text-align: center; }
header.header div.mainNavigation ul li div.itemCount span { display: inline-block; color: #222; font-size: 75%; font-weight: 500; height: 1.5em; vertical-align: middle; }
header.header div.mainNavigation ul li.currentLanguage { cursor: pointer; }
#languageScreen[data-expanded="0"],
#languageScreenFooter[data-expanded="0"] { display: none; }
ul.languages { list-style: none; margin : 0; padding: 0; position: absolute; right: 5%; top: 64px; background: #fff; border: 1px solid #000; }
.language a { padding: 10px 10px; display: block; }
.language a:hover { background: rgba(66, 165, 245, 0.3); cursor: pointer; }
.language span { vertical-align: top; font-size: 14px; } 
.language img { margin-right: 10px; }
div.mainNavigation li.basket span.price { color: #ffffff; font-size: 90%; position: relative; top: -6px; }
header.header div.portraitsNavi { display: inline-block; margin-left: 10px; }
header.header div.portraitsNavi ul { list-style: none; margin: 6px 0px 1px; }
header.header div.portraitsNavi ul li { display: inline-block; }
header.header div.portraitsNavi ul li img { height: 50px; }
header.header div.portraitsNavi ul li button { padding: 0px; width: auto; height: 50px; }
header.header div.portraitsNavi ul li button:hover { }
header.header div.portraitsNavi ul li button:hover img { opacity: 0.5; }
header.header div.portraitsNavi ul li.activePose img,
header.header div.portraitsNavi ul li.active img { height: 44px; } 
header.header div.portraitsNavi ul li.active img { border: 3px solid #bc0000;  }
header.header div.portraitsNavi ul li.activePose img { padding: 3px; background-color: #00cc00; }
header.header div.portraitsNavi ul li.active.activePose img { height: 38px; }
/*
 * **************
 * *** Cookie ***
 * **************
 */
 .cc_banner-wrapper {
	  height: initial !important;
	  animation-name: none !important;
 }
 .cc_container {
	position: initial !important;
 }
.cc_container .cc_message {
  color: white !important;
}
/*
 * ******************
 * *** Navigation ***
 * ******************
 */
div.navigationContainer { z-index: 1000; width: 100%; position: relative; }
div.navigationContainer * { color: #585858; }
div.navigation { background: #d8d8d8E0; text-align: center; user-select: none; }
div.navigation ul { list-style: none; margin: 0; padding: 0; } 
div.navigation ul li { display: inline-block; vertical-align: text-bottom; } 
div.navigation ul li a { display: inline-block; padding: 10px 20px; } 
div.navigation ul li.active { background: #ff8a65; } 
div.navigation ul li.active:hover { background: #ff8a65b0; } 
div.navigation ul li.active a { font-weight: 500; } 
div.navigation ul li:hover { background: rgba(255, 255, 255, 0.2); } 
div.navigation ul li.highlight:hover { background: #ff8a65b0; } 
div.navigation ul li.highlight { background: #ff8a65; }
div.navigation .responsivMenu img { display: none; vertical-align: middle; height: 23px; }
div.navigation .responsivMenu span { vertical-align: middle; }
/*
 * ***************
 * *** Content ***
 * ***************
 */
div.buttons a { padding: 10px 20px; background: #fe642e; color: #ffffff; }
div.pageError { background: rgba(123, 28, 28, 0.75); width: 90%; max-width: 500px; margin: 0 auto; padding: 20px; }
div.pageError * { color: #ffffff; }
div.pageError div.title { font-weight: 500;}
div.pageError div.body { padding: 10px 0px; }
div.pageError div.buttons { text-align: center; }
div.pageError div.buttons a { display: inline-block; padding: 10px; background: rgba(255, 255, 255, 0.25); }
div.floatLeft { float: left; }
div.floatRight { float: right; }
div.textpage { width: calc(100% - 40px); display: inline-block; background: #d8d8d8E0; padding: 10px 20px; }
div.textpage h1 { font-size: 150%; font-weight: 500; }
div.textpage h2 { font-size: 125%; font-weight: 500; }
div.textpage h3 { font-size: 110%; font-weight: 500; }
div.textpage * { }
div.textpage p { margin: auto; padding: 0 0 10px 0; }
div.textpage form input { width: 80%; margin-bottom: 10px; }
div.textpage form input[required] { }
div.textpage form input[type="checkbox"] { width: 20px; margin-bottom: 10px; }
div.textpage form textarea { width: 80%; margin-bottom: 10px; }
div.textpage form button { max-width: 250px; width: 50%; margin: 20px 0 10px 0; background: #fe642e; color: #ffffff; }
div.textpage div.embedded { padding: 10px; }
div.textpage div#faq p { padding: 0; }
div.textpage div#faq a { color: #fff; text-decoration: underline; font-weight: 400; }
div.contact { text-align: center; }
div.impressum { text-align: center; }
div.agb { text-align: left; }
div.privacy { text-align: left; }
div.paymentCondictions { text-align: left; }
div.paymentCondictions p a { text-decoration: underline; font-weight: 500; }
div.welcome { width: 95%; }
div.welcome div.widget { background: #d8d8d8E0; padding: 20px; margin-bottom: 20px; }
div.account { width: 100%; }
div.account h1 { font-size: 120%; font-weight: 500; }
div.account div.orders { background: #d8d8d8E0; padding: 10px 20px; }
div.account div.orders ul { list-style: none; margin: 0; padding: 0; }
div.account div.orders ul li.order { margin: 0; padding: 0; }
div.account div.orders ul li.order label { display: inline-block; width: 120px; }
div.account div.files { background: #d8d8d8E0; padding: 10px 20px; }
div.account div.safety { background: #d8d8d8E0; padding: 10px 20px; }
div.account div.safety div.buttons { padding-bottom: 20px; }
div.account div.safety div.buttons a { display: inline; width: 32px; height: 32px; padding: 10px 20px; background: #fe642e; color: #ffffff; }
div.account div.anonymize { background: #d8d8d8E0; padding: 10px 20px; }
div.account div.anonymize { background: #d8d8d8E0; padding: 10px 20px; }
div.account div.anonymize form { padding: 20px 0 20px; }
div.series { text-align: left; }
div.series div.seriesHead { }
div.series div.seriesHead.desktop { display: flex; align-items: center; flex-wrap: wrap-reverse; gap: 10px; }
div.series div.seriesHead a { display: inline-block; float: left; }
div.series div.seriesHead a.disabled { opacity: 0.2; }
div.series div.seriesHead span { font-size: 120%; font-weight: 500; display: inline; padding: 10px 0px;  color: #585858; }
div.series div.seriesHead .span { color: #fe642e; font-weight: 800; }
div.series div.seriesHead form div.toBasket { float: right; width: 200px; }
div.series div.seriesHead form div.toBasket button { width: 100%; }
div.series div.serie { background: #d8d8d8E0; padding: 20px 40px; position: relative; top: 0; left: 0; right: 0; margin-bottom: 20px; overflow: hidden; }
div.serie * { color: #ffffff; }
div.series div.serie div.view { background: #585858E0; color: #ffffff; }
div.series div.serie div.view * { color: #ffffff; }
div.series div.gotoNext { cursor: pointer; }
div.series div.serie div.nextSeries { position: absolute; bottom: 22px; width: 218px; }
div.series div.serie div.nextSeries a { background: rgba(0, 150, 0, 0.7); padding: 10px 0px; display: inline-block; text-align: center; width: 100%; }
div.series div.serie form.toBaskedBottom { margin-top: 20px; text-align: center; }
div.series div.canvas { position: relative; }
div.series div.canvas div { position: absolute; z-index: 30; }
div.series div.canvas img { position: absolute; z-index: 30; border-radius: 0px; }
div.series div.canvas span { position: absolute; font-size: 12px; z-index: 30; white-space: nowrap; text-decoration: unterline; }
div.series div.canvas img.large { height: 220px; }
div.series div.canvas img.normal { height: 150px; }
div.series div.canvas img.small { height: 100px; }
div.series div.canvas img.verySmall { height: 75px; }
div.series div.canvas img.verySmallDbl { height: 150px; }
div.series div.canvas img.mini { width: 30px; }
div.series div.canvas img.mini2 { width: 40px; }
div.series div.canvas div.vignette { background: #fff; }
div.composing { overflow: hidden; }
div.series div.canvas div.nostalgy { overflow: hidden; }
div.series div.canvas div.nostalgy img.nostalgy { width: 111px; }
div.series div.canvas img.product { width: 200px; border: 1px solid #000; border-radius: 0px; }
div.series div.canvas img.vignette { background: #fff; }
div.series div.canvas img.portrait { height: 120px; border: 1px solid #000; border-radius: 0px; }
div.special { text-align: left; }
div.special div.seriesHead { }
div.special div.seriesHead a { display: inline-block; float: left; }
div.special div.seriesHead a.disabled { opacity: 0.2; }
div.special div.seriesHead span { font-size: 120%; font-weight: 500; float: left; display: inline-block; padding: 10px 0px;  color: #585858; }
div.special div.seriesHead form div.toBasket { float: right; width: 500px; }
div.special div.seriesHead form div.toBasket button { width: 40%; float: right; }
div.special div.serie { background: #d8d8d8E0; padding: 20px 40px; position: relative; top: 0; left: 0; right: 0; margin-bottom: 20px; overflow: hidden; }
div.special * { color: #ffffff; }
div.special div.serie div.view { background: #585858E0; color: #ffffff; }
div.special div.serie div.view * { color: #ffffff; }
div.special div.gotoNext { cursor: pointer; }
div.special div.serie div.nextSeries { position: absolute; bottom: 22px; width: 218px; }
div.special div.serie div.nextSeries a { background: rgba(0, 150, 0, 0.7); padding: 10px 0px; display: inline-block; text-align: center; width: 100%; }
div.special div.serie form.toBaskedBottom { margin-top: 20px; text-align: center; }
div.special div.canvas { position: relative; }
div.special div.canvas div { position: absolute; z-index: 30; }
div.special div.canvas img { position: absolute; z-index: 30; border-radius: 0px; }
div.special div.canvas span { position: absolute; font-size: 12px; z-index: 30; white-space: nowrap; text-decoration: unterline; }
div.special div.canvas img.large { height: 220px; }
div.special div.canvas img.normal { height: 150px; }
div.special div.canvas img.small { height: 100px; }
div.special div.canvas img.verySmall { height: 75px; }
div.special div.canvas img.verySmallDbl { height: 150px; }
div.special div.canvas img.mini { width: 30px; }
div.special div.canvas img.mini2 { width: 40px; }
div.special div.canvas div.vignette { background: #fff; }
div.composing { overflow: hidden; }
div.special div.canvas div.nostalgy { overflow: hidden; }
div.special div.canvas div.nostalgy img.nostalgy { width: 111px; }
div.special div.canvas img.product { width: 200px; border: 1px solid #000; border-radius: 0px; }
div.special div.canvas img.vignette { background: #fff; }
div.special div.canvas img.portrait { height: 120px; border: 1px solid #000; border-radius: 0px; }
div.specialOffers { width: 100%; }
div.specialOffers div.specialProducts { background: #d8d8d8E0; padding: 20px; }
div.specialOffers div.specialProducts h1 { font-weight: 500; font-size: 125%; }
div.specialOffers div.specialProducts ul { text-align: center; list-style: none; margin: 0; padding: 0; }
div.specialOffers div.specialProducts ul li { width: 30%; display: inline-block; background: #585858E0; padding: 10px; min-width: 300px; margin-bottom: 20px; }
div.specialOffers div.specialProducts ul li * { color: #ffffff; }
div.specialOffers div.specialProducts div.dpInfo { padding-top: 0; }
div.singleCanvas > img { width: 216px; height: 240px; }
div.singleCanvas > div { perspective: 50px; perspective-origin: 120px 65px; position: relative; top: -210px; left: 4px; }
div.singleCanvas > div > img { height: 160px; }
div.singleCanvas > img { width: 180px; height: 200px; }
div.singleCanvas > div { perspective: 50px; perspective-origin: 120px 65px; position: relative; top: -181px; left: 4px; }
div.singleCanvas > div > img { height: 139px; }
div.specialOffers div.specialProducts div.view div.magnetic4Images > div { background: #fff; width: 133px; margin: auto; padding: 5px 0px 10px 0px; }
div.specialOffers div.specialProducts div.view div.magnetic4Images > div img  { height: 85px; }
div.specialOffers div.specialProducts div.digitalFile div.dpInfo > img { height: 135px; }
div.specialOffers div.specialProducts div.digitalFile div.description { margin: 0px; }
div.specialOffers div.specialProducts div.digitalFile div.description > p { margin: 0px; }
@media (max-width: 1050px) {
	div.specialOffers div.specialProducts div.digitalFile div.dpIcon { display: none; }
}
div.pillow > div > div { position: relative; top: 0px; left: calc(50% - 85px); }
form.closeOffers { text-align: center; padding: 30px 0 10px 0; }
form.closeOffers button { width: 50%; max-width: 300px; }
div.products { width: 100%; }
div.product { width: 284px; background: #d8d8d8E0; padding: 20px; display: block; float: left; margin-right: 15px; margin-bottom: 15px; text-align: center; }
div.product div.header { padding: 0 0 10px 0; }
div.product div.info { display: inline-block; width: 100%; height: 80px; vertical-align: top; text-align: center; }
div.product a { text-decoration: underline; }
div.product div.info { margin-top: 20px; }
div.product div.info div.price { font-size: 100%; }
div.product div.info div.amount { margin-top: 20px; }
div.product div.info div.amount.delayed { margin-top: 12px; }
div.product div.info div.amount button { display: inline; width: 31px; height: 31px; padding: 0; background: rgba(0, 150, 0, 0.7); }
div.product div.info div.amount button.disabled { background: rgba(255, 165, 0, 0.2); }
div.product div.info div.amount input { background: rgba(255, 255, 255, 0.9); color: #222; display: inline-block; padding: 7px 10px 4px 10px; text-align: center; width: 20%; }
div.product div.info span.priceOld { display: inline-block; }
div.product div.info span.discount { display: inline-block; }
div.product div.info span.price { display: inline-block; }
div.product div.info span.soldOut { font-style: italic; font-size: 70%; position: relative; top: -10px; }
div.specialOffers div.specialProducts ul li div.info { }
div.specialOffers div.specialProducts ul li div.info div.price { font-size: 100%; }
div.specialOffers div.specialProducts ul li div.info div.amount { }
div.specialOffers div.specialProducts ul li div.info div.amount.delayed { margin-top: 12px; }
div.specialOffers div.specialProducts ul li div.info div.amount button { display: inline; width: 31px; height: 31px; padding: 0; background: #fe642e; }
div.specialOffers div.specialProducts ul li div.info div.amount button.disabled { background: rgba(255, 165, 0, 0.2); }
div.specialOffers div.specialProducts ul li div.info div.amount input { background: rgba(255, 255, 255, 0.9); color: #222; display: inline-block; padding: 7px 10px 4px 10px; text-align: center; width: 20%; }
div.specialOffers div.specialProducts ul li div.info span.priceOld { display: inline-block; }
div.specialOffers div.specialProducts ul li div.info span.discount { display: inline-block; }
div.specialOffers div.specialProducts ul li div.info span.price { display: inline-block; }
div.specialOffers div.specialProducts ul li div.info span.soldOut { font-style: italic; font-size: 70%; position: relative; top: -10px; }
div.product div.view { display: block; height: 190px; overflow: hidden; margin: 0 auto; background: #585858E0; padding-top: 20px; }
div.product div.big.view { height: 229px; }
div.product div.view * { color: #ffffff; }
/*
div.product div.view { display: block; height: 190px; overflow: hidden; margin: 0 auto; background: #fff; padding-top: 20px; }
div.product div.view * { color: #585858; }
*/
div.product div.dpInfo div.dpIcon { display: inline-block; padding-right: 20px; }
div.product div.dpInfo { padding-top: 14px; }
div.product div.dpInfo img { height: 64px; }
div.view div.dpInfo div.dpIcon { display: inline-block; padding-right: 20px; }
div.view div.dpInfo { padding-top: 14px; }
div.view div.dpInfo img { height: 64px; }
div.specialProducts div.view div.dpInfo img { height: 110px; }
.priceOld { color: #ff4d4d; }
div.view div.missingTemplate { font-style: italic; }
div.view img.product { width: 200px; border-radius: 0px; }
div.view img.large { height: 220px; }
div.view img.normal { height: 150px; }
div.view img.small { height: 100px; }
div.view img.verySmall { height: 75px; }
div.view img.verySmallDbl { height: 150px; }
div.view img.mini { width: 30px; }
div.view img.mini2 { width: 40px; }
div.view img.vignette { background: #fff; }
div.view img.portrait { height: 170px; border-radius: 0px; }
div.view img.calendar { -webkit-box-shadow: 4px 4px 2px 0px rgba(0,0,0,1); -moz-box-shadow: 4px 4px 2px 0px rgba(0,0,0,1); box-shadow: 4px 4px 2x 0px rgba(0,0,0,1); }
div.view div.canvas div.personal img.large { height: 220px; }
div.view div.magnetic4Images > div { background: #fff; width: 110px; margin: auto; padding: 5px 0px 10px 0px; }
div.view div.magnetic4Images > div img  { height: 70px; }
div.view div.digitalFile div.description  { margin-top: 10px; }
div.view div.cup { padding: 0px 20px; }
div.view div.cup > div { height: 170px; overflow: hidden; }
div.view div.cup > div > div { margin: 0 auto; position: relative; top: 0px; }
div.view div.pillow { padding: 0px 20px; }
div.view div.pillow > div { height: 170px; overflow: hidden; }
div.view div.pillow > div > div { position: relative; top: 0px; }
div.smallBasketContainer { background: #d8d8d8E0; display: inline-block; padding: 10px 20px; width: calc(100% - 40px); margin: 10px 0 0 0; }
div.smallBasket table { width: 100%; }
div.smallBasket table tr th { text-align: left; width: 50%; }
div.smallBasket table tr td { text-align: right; width: 50%; }
div.smallBasket table tr.sum td { font-weight: 500; border-top: 1px solid #585858; }
div.smallBasket table tr.sum th { font-weight: 500; border-top: 1px solid #585858; }
div.smallBasket div.buttons { height: 32px; }
div.smallBasket div.buttons a { display: inline; width: 32px; height: 32px; padding: 10px 20px; background: #fe642e; color: #ffffff; }
div.smallBasket .disabled { opacity: 0.5; } 
div.smallBasket p.emptyBasket { font-style: italic; }
div.smallBasket form.portraits button { background: #444; padding: 0; width: auto; display: inline-flex;}
div.smallBasket form.portraits button img { width: 75px; opacity: 1; }
div.smallBasket form.portraits button.active img { width: 69px; opacity: 1; border: 3px solid #bc0000; }
div.smallBasket form.portraits button.activePose img { width: 69px; opacity: 1; border: 3px solid #00cc00; }
div.smallBasket form.portraits button.Portrait { background-color: #bc0000; }
div.smallBasket form.portraits button.Pose { background-color: #00cc00;  }
div.smallBasket form.portraits button:hover img { opacity: 0.7; }
div.smallBasket form.groups button { background: #444; padding: 0; width: auto; display: inline-flex;}
div.smallBasket form.groups button img { width: 150px; opacity: 1; }
div.smallBasket form.groups button.active img { width: 144px; opacity: 1; border: 3px solid #bc0000; }
div.smallBasket form.groups button.activePose img { width: 144px; opacity: 1; border: 3px solid #00cc00; }
div.smallBasket form.groups button.Portrait { background-color: #bc0000; }
div.smallBasket form.groups button.Pose { background-color: #00cc00;  }
div.smallBasket form.groups button:hover img { opacity: 0.7; }
div.upperContainer { background: #d8d8d8E0; padding: 10px 20px; }
div.upperContainer form.portraits button { padding: 0; width: auto; display: inline-block; height: 75px; }
div.upperContainer form.portraits button img { width: 75px; opacity: 0.75; }
div.upperContainer form.portraits button.active img { width: 75px; opacity: 1; }
div.checkout div.checkoutHeader ul { list-style: none; margin: 0; padding: 10px 0px 10px 10px; text-align: center; border-bottom: 1px solid #585858; }
div.checkout div.checkoutHeader ul li { font-size: 100%; display: inline-block; padding: 0 20px 0 20px; }
div.checkout div.checkoutHeader ul li.active { font-weight: bold; }
div.checkout div.checkoutHeader ul li.inactive { opacity: 0.85; }
div.checkout { background: #d8d8d8E0; padding: 10px 20px; }
div.checkout div.buttons { margin-top: 20px; }
div.checkout div.buttons a.left { float: left; width: auto; max-width: 300px; background: rgba(0, 0, 0, 0.3); padding: 10px 20px; font-size: 120%; text-align: center; }
div.checkout div.buttons button { float: right; width: auto; max-width: 300px; }
div.checkout div.buttons a:hover { background: rgba(0, 0, 0, 0.5); }
div.checkout table { width: 100%; margin-bottom: 50px; }
div.checkout table tr th { padding: 4px 6px 4px 0; }
div.checkout table tr td { padding: 4px 6px 4px 0; }
div.checkout table tr td img.preview { height: 50px; }
div.checkout table tr td img.bullet { height: 16px; }
div.checkout table thead tr th { font-weight: 500; border-bottom: 1px solid #585858; }
div.checkout table thead tr th:first-child { width: 50px; }
div.checkout table tbody tr td:first-child { text-align: center; }
div.checkout table tbody tr th { padding: 4px 6px 4px 0; }
div.checkout table tfoot tr:first-child td { border-top: 1px solid #585858; }
div.checkout table tfoot tr th { font-weight: 500; padding: 2px 6px; }
div.checkout div.voucher { }
div.checkout div.voucher span { padding-right: 20px; }
div.checkout div.buttons { }
div.checkout div.buttons a { margin-bottom: 10px; }
div.checkout div.buttons button { margin-bottom: 10px; }
div.checkout ul { list-style: none; margin: 0; padding: 0;}
div.checkout table.basketTable { margin-top: 20px; }
div.checkout table.basketTable td.previewImage img { height: 30px; }
div.checkout table.basketTable td span.soldOut { font-style: italic; font-size: 70%; display: block; }
div.checkout table.basketTable a.changeItem img { opacity: 0.75; }
div.checkout table.basketTable.mobile td { font-size: 80%; }
div.checkout table.basketTable.mobile td.title { text-align: left; vertical-align: top; display: block; }
div.checkout table.basketTable.mobile td.title div.changeAmount { margin-top: 5px; }
div.checkout table.basketTable.mobile td.title div.changeAmount { margin-top: 5px; }
div.checkout table.basketTable.mobile td.title div.changeAmount a { vertical-align: sub; }
div.basketOffer div.product2.portraitView {
    max-width: calc((80vh / 2) - 10px);
}
div.basketOffer > div {
    background: #fff; 
    overflow-y: scroll; 
    text-align: center; 
    width: 80%; 
    height: calc(100% - 20px); 
    margin: 10px 10%; 
    position: relative;
}
@media (max-width: 767px) {
    div.basketOffer > div { 
        width: calc(100% - 20px); 
        margin: 10px; 
    }
}
div.checkout p.vat { font-size: 80%; }
form.basketView .desktop input { width: 50px; text-align: center; }
form.basketView .mobile input { width: 10px; text-align: center; }
form.basketView input.error { rgba(255, 0, 0, 0.3); }
form.basketView button.changeBasket { width: 100%; font-size: 90%; }
div.confirm {}
div.confirm h4 { font-weight: bold; font-size: 110%; margin: 10px 0; }
div.confirm h4 a { font-weight: bold; font-size: 110%; }
div.confirm div.addresses div.invoiceAddress { display: inline-block; width: 30%; min-width: 300px; }
div.confirm div.addresses div.deliveryAddress { display: inline-block; width: 30%; min-width: 300px; }
div.publicContainer { max-width: 40em; margin: 0 auto; background: #585858E0; margin-top: 50px; }
div.publicContainer div.public { padding: 20px; }
div.publicContainer div.public h1,
div.publicContainer div.public h2,
div.publicContainer div.public h3,
div.publicContainer div.public h4 { text-align: center; font-size: 150%; font-weight: 400; } 
div.publicContainer div.public p { }
div.publicContainer div.public p a { text-decoration: underline; font-weight: 500; }
div.blocker { position: fixed; z-index: 1; width: 100%; height: calc(100% - 153px); top: 103px; left: 0; background-color: rgba(0, 0, 0, 0.7); padding-top: 50px; }
/*
 * *****************
 * *** Formulare ***
 * *****************
 */
div:not(".content.page-layout") {
    form { }
    form button { background: #fe642e; color: #ffffff; opacity: 1; border: none; cursor: pointer; padding: 10px 20px; width: 50%; font-size: 120%; }
    form button.disabled, form button:disabled  { background:rgba(255, 255, 255, 0.65); cursor: none; pointer-events: none; }
    form button.cancel { background:rgba(255, 255, 255, 0.4); }
    form input { border: none; padding: 0.5em 1em; color: #585858; }
    form textarea { border: none; padding: 0.5em 1em; resize: none; }
    form textarea:focus { background: #f3f3f3;  }
    form select { border: none; padding: 0.5em 1em; }
    form select option { color: #000000; }
    form button.submit { background: #fe642e; color: #ffffff; border: none; cursor: pointer; padding: 10px 20px; width: auto; font-size: 120%; }
    form button:focus { }
    form input:focus { background: #f7f7f7; }
    form select:focus { background: #f7f7f7; }
}
form.variants { display: block; padding: 0 0 15px 0; min-width: 200px; height: 24px; }
form.variants button { padding: 4px 8px; width: auto; font-size: 85%; background: rgba(0, 80, 0, 1); }
form.variants button.active { background: rgba(0, 150, 0, 1); }
div.videoContainer { max-width: 35em; margin: 0px 20px; display: inline-block; vertical-align: top; height: 342px; background: #585858E0; padding: 10px 0.5em; width: calc(100% - (40px + 1em)); }
div.holidayContainer { /*display: none;*/ display: inline-block; margin: 0px 20px 30px; text-align: center; max-width: 35em; vertical-align: top; height: 100%; background: #585858E0; }
div.holidayContainer * { color: #ffffff; }
div.holidayContainer h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 10px 0 0 0; padding: 0; }
div.holidayContainer p { font-weight: 500; }
div.holidayContainer p.color { color: #fe642e }
div.loginContainer { max-width: 35em; margin: 0px 20px 30px; display: inline-block; }
div.loginContainer div.slogan { text-align: center; margin-top: 50px; }
div.loginContainer div.slogan p.head { color: #585858; text-transform: uppercase; font-weight: 500;  font-size: 125%; margin: 20px 0 0 0; }
div.loginContainer div.slogan p.content { color: #585858; margin: 5px 0 0 0; }
div.loginContainer p.info3 { display: none; }
form.login { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; font-weight: 500;}
form.login * { color: #ffffff; }
form.login h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 0px 0 0 0; padding: 0; }
form.login h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 10px 0 0 0; padding: 0; }
form.login h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.login h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.login h1 img { float: left; margin: -5px 5px 0 0; }
form.login h2 img { float: left; margin: -5px 5px 0 0; }
form.login h3 img { float: left; margin: -5px 5px 0 0; }
form.login h4 img { float: left; margin: -5px 5px 0 0; }
form.login p { margin-top: 10px; margin-bottom: 10px; } 
form.login div.codes { margin-bottom: 10px; }
form.login div.code-1 { display: inline-block; max-width: calc(40% - 20px); }
form.login div.code-2 { display: inline-block; max-width: calc(40% - 20px); }
form.login div.code-spacer { display: inline-block; padding: 0px 15px; }
form.login input { text-align: center; max-width: calc(90% - 20px); text-transform: uppercase; color: #585858; }
form.login div.loginbutton { margin-top: 0px; }
form.login div.loginbutton button { width: inherit; background: #fe642e; }
form.login div.loginbutton button:hover { background: #f05620; }
form.login div.toFAQButton { margin-top: 10px; }
form.login div.toFAQButton button { width: inherit; font-size: 105%; background:#088a4b; }
form.login div.toFAQButton button:hover { background: #057c44; }
form.login p.addLogin { cursor: pointer; }
form.login p.addLogin img.addCodeIcon { vertical-align: text-top; width: 20px; height: 20px; margin-right: 10px; }
form.login p.moreCodes { font-weight: 500; color: #fe642e }
@media (min-height: 1000px) {
	form.login div.loginbutton { margin-top: 40px; }
	form.login div.loginbutton { margin-top: 40px; }
	form.login p { margin-top: 20px;} 
	form.login h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
}
form.defaultContainer { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
form.defaultContainer p { margin-bottom: 30px; } 
form.defaultContainer h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.defaultContainer h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.defaultContainer h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.defaultContainer h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.defaultContainer h1 img { float: left; margin: -3px 5px 0 0; }
form.defaultContainer h2 img { float: left; margin: -3px 5px 0 0; }
form.defaultContainer h3 img { float: left; margin: -3px 5px 0 0; }
form.defaultContainer h4 img { float: left; margin: -3px 5px 0 0; }
form.defaultContainer input { text-align: center; max-width: calc(90% - 20px); text-transform: uppercase; width: 75%; }
div.activationContainer * { color: #ffffff; }
div.activationContainer input { color: #585858; }
div.activationContainer { max-width: 40em; margin: 20px auto; }
form.activation { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
form.activation h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.activation h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.activation h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.activation h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.activation h1 img { float: left; margin: -3px 5px 0 0; }
form.activation h2 img { float: left; margin: -3px 5px 0 0; }
form.activation h3 img { float: left; margin: -3px 5px 0 0; }
form.activation h4 img { float: left; margin: -3px 5px 0 0; }
form.activation p { margin-bottom: 30px; } 
form.activation p.activationNotice { text-align: left; max-width: calc(75% + 2em); margin: 0 auto 30px;  font-size: .9em; } 
form.activation div.email div { margin-bottom: 10px; }
form.activation input { text-align: center; max-width: calc(90% - 20px); text-transform: uppercase; width: 75%; }
form.activation div.activationbutton { margin: 40px auto 0; text-align: right; max-width: calc(75% + 2em); }
form.activation div.activationbutton button { width: inherit; }
form.activation p.agbNotice { font-size: .75em; width: 50%; margin: 5px 0 30px auto; min-width: 150px; }
form.activation p.agbNotice a { text-decoration: underline; }
div.tryLaterContainer * { color: #ffffff; }
div.tryLaterContainer input { color: #585858; }
div.tryLaterContainer { max-width: 40em; margin: 20px auto; }
div.tryLater { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
div.tryLater p { margin-bottom: 30px; } 
div.tryLater h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.tryLater h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.tryLater h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.tryLater h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.tryLater h1 img { float: left; margin: -3px 5px 0 0; }
div.tryLater h2 img { float: left; margin: -3px 5px 0 0; }
div.tryLater h3 img { float: left; margin: -3px 5px 0 0; }
div.tryLater h4 img { float: left; margin: -3px 5px 0 0; }
div.notFoundContainer * { color: #ffffff; }
div.notFoundContainer input { color: #585858; }
div.notFoundContainer { max-width: 40em; margin: 20px auto; }
div.notFound { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
div.notFound p { margin-bottom: 30px; } 
div.notFound h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.notFound h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.notFound h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.notFound h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.notFound h1 img { float: left; margin: -3px 5px 0 0; }
div.notFound h2 img { float: left; margin: -3px 5px 0 0; }
div.notFound h3 img { float: left; margin: -3px 5px 0 0; }
div.notFound h4 img { float: left; margin: -3px 5px 0 0; }
div.expiredContainer * { color: #ffffff; }
div.expiredContainer input { color: #585858; }
div.expiredContainer { max-width: 40em; margin: 20px auto; }
div.expired { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
div.expired p { margin-bottom: 30px; } 
div.expired h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.expired h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.expired h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.expired h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.expired h1 img { float: left; margin: -3px 5px 0 0; }
div.expired h2 img { float: left; margin: -3px 5px 0 0; }
div.expired h3 img { float: left; margin: -3px 5px 0 0; }
div.expired h4 img { float: left; margin: -3px 5px 0 0; }
div.disabledContainer * { color: #ffffff; }
div.disabledContainer input { color: #585858; }
div.disabledContainer { max-width: 40em; margin: 20px auto; }
div.disabled { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
div.disabled p { margin-bottom: 30px; } 
div.disabled h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.disabled h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.disabled h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.disabled h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
div.disabled h1 img { float: left; margin: -3px 5px 0 0; }
div.disabled h2 img { float: left; margin: -3px 5px 0 0; }
div.disabled h3 img { float: left; margin: -3px 5px 0 0; }
div.disabled h4 img { float: left; margin: -3px 5px 0 0; }
div.sendMailContainer * { color: #ffffff; }
div.sendMailContainer input { color: #585858; }
div.sendMailContainer { max-width: 40em; margin: 20px auto; }
form.sendMail { background: #585858E0; padding: 10px 10px 10px 10px; text-align: center; }
form.sendMail p { margin-bottom: 30px; } 
form.sendMail h1 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.sendMail h2 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.sendMail h3 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.sendMail h4 { font-size: 150%; font-weight: 500; display: inline-block; margin: 20px 0 0 0; padding: 0; }
form.sendMail h1 img { float: left; margin: -3px 5px 0 0; }
form.sendMail h2 img { float: left; margin: -3px 5px 0 0; }
form.sendMail h3 img { float: left; margin: -3px 5px 0 0; }
form.sendMail h4 img { float: left; margin: -3px 5px 0 0; }
form.sendMail input { text-align: center; max-width: calc(90% - 20px); text-transform: uppercase; width: 75%; }
form.sendMail div.codeCheck { margin: 20px 0 30px; }
form.sendMail div.resetActivation button { width: 50%; margin: 0 1%; }
form.sendMail div.resendActivation button { width: 60%; margin: 0 1%; }
form.addPortrait { padding: 10px 10px 10px 10px; text-align: center; margin-top: 20px; }
form.addPortrait div.pageMsg { margin-bottom: 20px; }
form.addPortrait div.addcode { display: inline-block; }
form.addPortrait div.code-spacer { display: inline-block; padding: 0px 15px; }
form.addPortrait input { text-align: center; text-transform: uppercase; }
form.addPortrait div.addcode input { width: 70px; }
form.addPortrait div.loginbutton { margin-top: 40px; }
form.addPortrait div.loginbutton button { width: 40%; margin: 0px 10px; min-width: 120px; margin-top: 5px; }
div.ui-dialog[aria-describedby="addPortrait"] { max-width: 400px !important; width: 90% !important; }
form.basketView input { width: 50px; text-align: center; }
form.basketView input.error { rgba(255, 0, 0, 0.3); }
form.basketView button.changeBasket { width: 100%; font-size: 90%; }
div.specialOffers span.title { font-weight: 300; display: inline-block; padding: 10px 0 10px 0; }
div.specialOffers span.price { font-weight: 300; display: inline-block; padding: 10px 0 10px 0; }
div.specialOffers form.specialOffer { padding: 0 0 10px 0; }
div.specialOffers form.specialOffer button { width: 60px; }
div.specialOffers form.specialOffer button.submit { width: 200px; }
/*
 * *****************
 * *** Sonstiges ***
 * *****************
 */
div.pageMsg { padding: 8px 10px; background-repeat: no-repeat; background-position: 10px center; }
div.pageMsg.error { background-color: rgba(255, 0, 0, 0.7); }
div.pageMsg.warning { background-color: rgba(159, 96, 0, 0.7); }
div.pageMsg.info { background-color: rgba(0, 82, 155, 0.7); }
div.pageMsg.success { background-color: rgba(79, 138, 16, 0.7); }
.hscroll { overflow: auto; white-space: nowrap; scrollbar-width: thin; }
.hscroll:hover { background-color: rgba(255, 255, 255, 0.3); }
.hscroll > * { display: inline-block; }
/*
 * ***************
 * *** Tooltip ***
 * ***************
 */
.tooltip { max-width: 480px; }
.tooltip .tooltipText { font-weight: normal; display: none; padding:14px 20px; margin-top:0px; margin-left:-150px; border-radius:2px; box-shadow: 5px 5px 8px #CCC; width: 300px;} 
.tooltip:hover .tooltipText { display:block; color:#111; background: rgba(255, 255, 255, 1); position: absolute; border:1px solid #DCA; text-align: left; }
.tooltip:hover .tooltipText ul { margin: 0; padding: 0; }
.tooltip table th { background: none; vertical-align: top; }
.tooltip table td { background: none; vertical-align: top; }
.tooltip table td:nth-child(even) { background: none; }
.tooltip table tr { background: none; }
.tooltip table tr:nth-child(even) { background: none; }
/* styles moved to styles2-page-setup-pss */
.img-magnifier-container { position: relative; }
.img-magnifier-glass { display: none; position: absolute; border: 3px solid #000; border-radius: 50%; cursor: none; width: 100px; height: 100px; z-index: 99 !important; }
/*
 * *******************
 * *** Desktop CSS ***
 * *******************
 */
div.navigation ul li.responsivMenu { display: none; padding: 10px 20px; font-weight: 750; width: calc(100% - 40px); cursor: pointer; }
div.leftContainer { width: 100%; display: inline-block; text-align: center; }
/* div.rightContainer { display: none; } */
div.upperContainer { display: inline-block; margin-bottom: 20px; }
header.header div.mainNavigation ul li.responsivMenu { display: none; cursor: pointer; }
header.header div.mainNavigation ul li.responsivMenu img:hover { opacity: 0.5; }
/* rule moved to styles2-page-setup.css */
/* Desktop-Ansicht */
@media (min-width: 768px) {
	/* rules moved to styles2-page-setup.pss */
	div.specialOffers div.specialProducts .title { text-align: center; }
	div.specialOffers div.specialProducts .description { text-align: center; }
	.mobile { display: none; }
	form.address { }
	form.address div.invoiceAddress { display: inline-block; width: 45%; vertical-align: top; }
	form.address div.deliveryAddress { display: inline-block; width: 45%; vertical-align: top; }
	div.row { margin-bottom: 10px; }
	div.row label { display: inline-block; width: 25%; }
	div.row input { width: 60%; }
	div.row select { width: 60%; }
}
@media (min-width: 1000px) {
	header.header div.info { display: flex;  }
	header.header div.portraitsNavi { width: calc(100% - (825px + 20px + 66px)); }
    header.header div.mainNavigation { padding: 0 5% 0 10px; }
}
/* Breite Desktop-Ansicht */
@media (min-width: 1540px) {
	/* rule moved to styles2-page-setup.pss */
	div.leftContainer { width: calc(100% - 420px); display: inline-block;}
	div.rightContainer { display: inline-block; vertical-align: top; width: 380px; position: fixed; overflow-y: auto; height: calc(100% - 250px); scrollbar-width: thin; }
	div.upperContainer { display: none; }
	/* rule moved to styles2-page-setup.pss */
	div.smallBasketContainer { width: calc(100% - 50px); margin: 0 0 0 10px; }
}
/* Breite Desktop-Ansicht */
@media (min-width: 1531px) {
	/* rule moved to styles2-page-setup.pss */
}
/* Mobile-Ansichten */
@media (max-width: 768px) {
	p.loginInfo { font-size: 0.75em; }
	/* rule moved to styles2-page-setup.pss */
	.desktop { display: none; }
    div.series div.seriesHead.desktop { display: none; }
	div.series div.seriesHead.mobile div.span { text-align: center; font-size: 120%; }
    div.specialOffers div.specialProducts h1 { color: #fe642e; font-weight: 800; }
	div.navigationContainer { position: relative; }
	div.navigation ul li { display: block; }
	div.navigation ul li.responsivMenu { display: inline-block; }
    div.navigation ul li.responsivMenu span { font-size: 120%; font-weight: 600; }
	div.navigation ul li a { width: calc(100% - 40px); }
	div.navigation[data-expanded="0"] ul li:not(.responsivMenu) { display: none; }
	div.navigation ul li.responsivMenu img { display: inline-block; }
	div.navigation[data-expanded="1"] ul li.responsivMenu img { transform: rotate(90deg); }
	header.header div.mainNavigation ul li { padding-left: 2px; }
	header.header[data-expanded="0"] div.mainNavigation ul li:not(.basket):not(.currentLanguage) { display: none; }
	header.header[data-expanded="1"] div.mainNavigation ul li.responsivMenu.expanded { display: inline-block; }
	header.header[data-expanded="0"] div.mainNavigation ul li.responsivMenu.closed { display: inline-block; }
    header.header[data-expanded="0"] div.mainNavigation[data-user="1"] ul li.currentLanguage { display: none; }
    body:not(.Index)[data-is-public="1"][data-logged-in="0"] header.header[data-expanded="0"] div.backbutton { display: flex; }
	div.series div.serie { padding: 20px 0px; }
	form.address { }
	form.address div.invoiceAddress { display: block; vertical-align: top; }
	form.address div.deliveryAddress { display: block; vertical-align: top; }
	div.row { margin-bottom: 10px; }
	div.row label { display: block; margin-bottom: 5px; }
	div.row input { width: 85%; }
	div.row select { width: 85%; }
}
/* Kleine Handys */
@media (max-width: 599px) {
	header.header[data-expanded="1"] div.logo { display: none; }
	header.header[data-expanded="1"] div.info { display: none; }
	header.header[data-expanded="1"] div.portraitsNavi { display: none; }
    div.specialOffers div.specialProducts { padding: 20px 0; }
	/* rule moved to styles2-page-setup.pss */
	div.product { float: none; margin: 20px auto; }
}
/* Ganz kleine Handys */
@media (max-width: 399px) {
	header.header[data-expanded="0"] div.portraitsNavi { width: calc(100% - (180px + 20px + 66px)); }
	header.header div.portraitsNavi ul { padding: 0px; }
	header.header div.logo { width: 90px; }
	header.header div.logo img.logoTxt { height: 24px; margin: 20px 18px 0 10px; }
	div.product { float: none; margin: 20px auto; }
}
p.thankYou a { font-weight: bold; }
/* FAQ */
div#faq { }
div#faq { }
div#faq h3 { margin-top: 10px; }
div.toFAQ { margin-top: 20px;  }
div.toFAQ a { text-decoration: underline; font-weight: 400; }
a.backlink { float: right; font-size: 150%; font-weight: 500; margin: 0 10px; }
a.backlink > img { vertical-align: bottom; margin-right: 5px; }
ul.faqDirectory { display: grid; grid-gap: 10px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); list-style: none; margin: 0; padding: 0; }
ul.faqDirectory > li { }
ul.faqDirectory > li > div { width: calc(100% - 20px); padding: 10px; }
ul.faqDirectory > li:nth-child(1) > div { background: rgba(100, 181, 246, 1.0); }
ul.faqDirectory > li:nth-child(2) > div { background: rgba(129, 199, 132, 1.0); }
ul.faqDirectory > li:nth-child(3) > div { background: rgba(239, 154, 154, 1.0); }
ul.faqDirectory > li > div > h2 { text-align: center; font-size: 150%; font-weight: 500; margin: 20px 0 0 0; padding: 0; color: #ffffff; }
ul.faqDirectory > li > div > h2 > img { vertical-align: bottom; margin-right: 5px; }
img.faqIcon { margin: 3px 5px 0 0;  }
ul.faqEntries { list-style: none; margin: 0; padding: 0; }
ul.faqEntries > li { position: relative; margin: 0; padding: 0; vertical-align: top }
div.faqEntry * { color: #ffffff; }
div.faqEntry p { padding: 0; }
div.faqEntry { margin: 7px 0; }
div.faqEntry div.question { padding: 5px; background: rgba(0, 0, 0, 0.3); cursor: pointer; min-height: 38px; }
div.faqEntry div.question:hover { padding: 5px; background: rgba(0, 0, 0, 0.15) }
div.faqEntry div.answer { padding: 5px; background: rgba(0, 0, 0, 0.15); min-height: 38px; display: none; }
div.faqEntry div.question > div, 
div.faqEntry div.answer > div { display: inline; }
/* jquery */
.ui-corner-all { border-radius: 0px; background: #777; }
.ui-corner-top, .ui-corner-bottom { border-radius: 0px; }
.ui-widget { font-size: 100%; font-family: "Roboto",sans-serif; font-weight: 300; }
.ui-widget input { font-size: 100%; font-family: "Roboto",sans-serif; font-weight: 300; }
.ui-widget button { font-size: 100%; font-family: "Roboto",sans-serif; font-weight: 300; }
.ui-widget-content { background: rgba(0, 0, 0, 0.9); }
.ui-widget-content * { color: #fff; }
.ui-widget-content input { color: #585858 }
.ui-widget-overlay { opacity: 0.5; }
.ui-accordion { } 
.ui-accordion .ui-accordion-content { padding: 10px 20px; border: 1px solid #ffffff; border-top: none; } 
.ui-accordion .ui-accordion-header { padding: .5em .5em .5em .5em; border: none; } 
.ui-accordion .ui-accordion-header span { display: none; } 
.ui-accordion .ui-accordion-header-collapsed { color: #222; background: #888; } 
.popupImage { cursor: pointer; transition: 0.3s; }
.popupImage:hover { }
.popupContent { cursor: pointer; transition: 0.3s; }
.popupContent:hover { }
#popupDialog { position: fixed; z-index: 1000; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.9); }
#popupDialogImage { margin: auto; display: block; max-height: 80%; padding-top: 40px; min-width: 400px; }
#popupDialogContent { margin: auto; display: block; max-height: 80%; padding: 150px 0 50px; text-align: center; transform: scale(3); }
#popupDialogClose { position: absolute; top: 115px; right: 35px; color: #f1f1f1; font-size: 40px; font-weight: bold; transition: 0.3s; }
#popupDialogClose:hover,
#popupDialogClose:focus { color: #bbb; text-decoration: none; cursor: pointer; }
@media only screen and (max-width: 700px){ #popupDialogImage { width: 100%; } }
div.contact div.important { margin-top: 20px; margin-bottom: 20px; }
div.contact div.important div.importantContent { margin: auto; background: #fff; padding: 10px; }
div.contact div.important div.importantContent strong { color: #ff0000; font-size: 125%; font-weight: 500; }
div.contact div.important div.importantContent p { color: #ff0000; padding: 0; }
div.view div.canvas div.specialSeries { transform: scale(0.8); transform-origin: 0px 0px 0px; }
div.view div.canvas div.subArticles { padding: 20px; width: calc(100% - 60px); height: calc(100% - 80px); }
div.view div.canvas div.subArticles div.articles { width: 180px; height: 100%; background: #ffffff; position: absolute; right: 0; }
div.view div.canvas div.subArticles div.title { color: #585858; width: 100%; text-align: center; position: initial; font-size: 70%; }
div.view div.canvas div.subArticles div.price { color: #585858; width: 100%; text-align: center; position: relative; font-weight: bold; }
div.view div.canvas div.price.cross { position: relative; display: inline-block; }
div.view div.canvas div.price.cross::before, .cross::after { content: ''; position: absolute; left: 0%; top: 40%; }
div.view div.canvas div.price.cross::before { border-bottom: 2px solid #ff3737; left: 20%; width: 60%; -webkit-transform: skewY(-35deg); transform: skewY(-35deg); }
div.view div.canvas div.price.cross::after { border-bottom: 2px solid #ff3737; left: 20%; width: 60%; -webkit-transform: skewY(35deg); transform: skewY(35deg); }
div.view div.canvas div.price.crossBold { position: relative; display: inline-block; }
div.view div.canvas div.price.crossBold::before, .crossBold::after { content: ''; position: absolute; left: 0%; top: 40%; }
div.view div.canvas div.price.crossBold::before { border-bottom: 2px solid #cdcdcd; left: 10%; width: 60%; -webkit-transform: skewY(-35deg); transform: skewY(-35deg); }
div.view div.canvas div.price.crossBold::after { border-bottom: 2px solid #cdcdcd; left: 10%; width: 60%; -webkit-transform: skewY(35deg); transform: skewY(35deg); }
.fadeIn { animation: fade 0.5s linear; }
@keyframes fade { 
	from { opacity: 0; } 
	to { opacity: 1; } 
}
div.message { background: #d8d8d8; display: inline-block; padding: 20px 40px; }
div.product a.toDigiPicsButton {
	display: inline-block; text-decoration: none; background: rgba(0, 150, 0, 0.7); color: #ffffff; padding: 7px 20px;
}
li.digiFile a.toDigiPicsButton {
	display: inline-block; text-decoration: none; background: #fe642e; color: #ffffff; padding: 7px 20px;
}
div.hline { width: 100%; border-top: 1px solid #343434; margin: 10px 0 7px; }
span.addButton { display: inline-block; width: 20px; }
span.addButton img { width: 20px; position: relative; top: 4px; cursor: pointer; }
div.loginCodes div.lastCode input { }
.productForm button[value='removeFromBasket'], 
.productForm button[value='addToBasket'] {
    transition: background-color 280ms linear;
}
.productForm button[value='removeFromBasket'] {
    background-color: #fe642e;
}
.productForm button[value='removeFromBasket']:hover {
    background-color: #fe8b62;
}
.productForm button[value='addToBasket'] {
    background-color: #4cb54c;
}
.productForm button[value='addToBasket']:hover {
    background-color: #30cf30;
}
/*
 * ****************
 * *** Mockup 1 ***
 * ****************
 */
        div.products2 {
            width: 100%;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            align-items: stretch;
        }
        div.product2 {
            padding: 0;
            position: relative;
            flex-grow: 1;
            overflow: hidden;
            background-color: rgba(224, 224, 224, 0.9);
            margin: 10px;
            box-shadow: 0px 0px 4px 2px rgba(128, 128, 128, 0.5);
            align-content: center;
            display: grid;
        }
            div.product2.portraitView {
                min-width: 15%;
                max-width: calc((100% / 4) - 20px);
            }
            div.product2.landscapeView {
                min-width: 25%;
                max-width: calc((100% / 3) - 20px);
            }
            div.product2 .hover,
            div.product2:not(.noHover) img {
                vertical-align: middle;
                display: inline-block;
                position: relative;
                transform-origin: center center;
                width: 100%;
                transition: 0.7s;
            }
            div.product2:hover .hover,
            div.product2:not(.noHover):hover img,
            div.product2.touched .hover,
            div.product2:not(.noHover).touched img {
                transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
            }
            div.product2 div.title {
                background: rgba(255, 255, 255, 1);
                line-height: 1rem;
                text-align: center;
                vertical-align: middle;
                font-weight: 800;
                width: 100%;
                z-index: 100;
                height: 2rem;
                display: table;
            }
                div.product2 div.title span {
                    display: table-cell;
                    vertical-align: middle;
                    font-weight: 800;
                    padding: 0 5px;
                }
            div .product2 div.price {
                position: absolute;
                bottom: 5rem;
                right: 0;
                line-height: 2rem;
                text-align: center;
                padding: 0 0.5rem;
                max-width: 35%;
                background: rgba(0, 150, 0, 0.7);
                z-index: 75;
            }
                div.product2 div.price span {
                    color: rgba(255, 255, 255, 1);
                    font-weight: 800;
                }
            div.product2 form.versions {
                position: absolute;
                top: 2%;
                right: 0;
                z-index: 100;
            }
                div.product2 form.versions button {
                    padding: 4px 8px;
                    width: auto;
                    font-size: 85%;
                    background: rgba(0, 80, 0, 1);
                    margin: 0 0 3px auto;
                    display: block;
                    font-weight: 800;
                    border: 2px solid #777;
                }
                    div.product2 form.versions button.active {
                        background: rgba(0, 150, 0, 1);
                        border: 2px solid #fff;
                    }
        .productForm {
            z-index: 100;
            position: absolute;
            left: 0;
            bottom: 0;
            height: 2rem;
            width: 100%;
            background: rgba(255, 255, 255, 1);
            line-height: 2rem;
        }
            .productForm button,
            .productForm input {
                position: absolute;
                height: 2rem;
                padding: 0 10px;
                box-sizing: border-box;
                font-weight: 800;
                text-align: center;
            }
            .productForm input {
                width: 30%;
                top: 0;
                left: 35%;
            }
            .productForm button[value="removeFromBasket"] {
                width: 35%;
                top: 0;
                left: 0;
            }
            .productForm button[value="addToBasket"] {
                width: 35%;
                top: 0;
                right: 0;
                background: rgba(0, 150, 0, 0.7);
            }
        .downloadInfo {
            padding: 0 5px;
        }
        .shadow,
        .shadowL,
        .shadowLL {
            position: absolute;
            width: 100%;
            height: 100%;
            box-shadow: inset 0px 0px 8px 4px rgba(64, 64, 64, 0.5);
            top: 0;
            left: 0;
            z-index: 50;
        }
        .shadowL {
            height: calc(100% - 2rem);
        }
        .shadowLL {
            height: calc(100% - 4rem);
        }
        .glow {
            box-shadow: 0 0px 2px 2px rgba(128, 128, 128, 0.7);
        }
        .peel {
            background: linear-gradient(to top right, #000, #777 94%, #FEFEFE 97%, #FEFEFE 100%);
        }
            .peel img {
                clip-path: polygon(0% 0%, 90% 0%, 100% 10%, 100% 100%, 0% 100%);
            }
            .peel:before {
                content: "";
                position: absolute;
                top: 0;
                right: 0;
                width: 10%;
                height: 10%;
                background: linear-gradient(to bottom left, transparent 0%, transparent 50%, #1b5e20 50%, #81c784 100%);
                z-index: 3;
            }
        .rotate90 {
            transform: rotate(90deg);
        }
        .scene {
            position: relative;
            transform-style: preserve-3d;
            transition: all 500ms ease-in;
            transform: rotateY(10deg) rotateX(30deg) rotateZ(-10deg) scale(0.8);
            box-shadow: -40px 80px 80px -10px rgba(0,0,0,0.7), inset 0px 0px 15px rgba(0,0,0,1);
            display: inline-block;
        }
        /* styles moved to styles2-page-setup.pss */
        div.product2:hover .scene,
        div.product2.touched .scene {
            transform: rotateY(0deg) rotateX(0deg) rotateZ(0deg);
            z-index: 5;
        }
        .scene img {
            position: absolute;
            top: 0px;
            left: 0px;
            opacity: 0.85;
        }
        .scene div.left,
        .scene div.front,
        .scene div.bottom {
            position: absolute;
            width: 100%;
            height: 100%;
            display: block;
            transition: all 1s linear;
            overflow: hidden;
            border-radius: 3px;
            outline: 1px solid transparent;
        }
        .faser {
            background-image: url(/img/Faser.jpg);
            box-shadow: inset 0 0 50px rgba(0, 0, 0, 1);
            background-repeat: repeat;
            background-size: 30%;
        }
        .alu {
            background-image: url(/img/alu.jpg);
            box-shadow: inherit;
            background-repeat: repeat;
            background-size: 100%;
        }
        .scene div.left {
            transform: rotateY(270deg) translateX(-1px);
            transform-origin: center left;
            width: 18px;
        }
            .scene div.left img {
                opacity: 0.95;
            }
        .scene div.bottom {
            transform: rotateX(90deg) translateY(18px) translateZ(0px);
            transform-origin: bottom center;
            height: 18px;
            bottom: 0;
        }
            .scene div.bottom img {
                transform: rotateX(180deg);
                opacity: 0.95;
            }
        .scene div.front {
            transform: translateZ(16px);
        }
        .scene.puzzle div.left {
            transform: rotateY(270deg) translateX(-1px);
            transform-origin: center left;
            width: 5px;
        }
        .scene.puzzle div.bottom {
            transform: rotateX(90deg) translateY(5px) translateZ(0px);
            transform-origin: bottom center;
            height: 5px;
            bottom: 0;
        }
        .scene.puzzle div.front {
            transform: translateZ(5px);
        }
        @media (max-width: 767px) {
            div.product2 {
                margin: 5px;
            }
                div.product2.landscapeView {
                    min-width: calc(50% - 10px);
                    max-width: calc(100% - 10px);
                }
                div.product2.portraitView {
                    min-width: 25%;
                    max-width: calc((100% / 2) - 10px);
                }
            div.downloadInfo {
                font-size: 0.7rem;
            }
            div.product2 div.title span {
                font-size: 0.8rem;
            }
            div.product2.aludibond.flag {
                font-size: 70%;
            }
        }
    .book {
        position: relative;
        width: 55%;
        height: 55%;
        perspective: 1000px;
        transform-style: preserve-3d;
        top: 15%;
        left: 15%;
        margin: 0;
        transition-duration: 1s;
        transition-timing-function: ease;
        transform: scale(1.3);
    }
    .product2:hover .book,
    .product2.touched .book {
        left: 25%;
        top: 20%;
        transform: scale(1);
    }
    .bookPage,
    .hardcover_front,
    .hardcover_back,
    .book_spine {
        list-style-type: none;
    }
        .hardcover_front li,
        .hardcover_back li {
            box-shadow: -20px 40px 40px -20px rgba(0, 0, 0, 0.2), 0 0px 2px 2px rgba(128, 128, 128, 0.7);
        }
        .bookPage li {
            box-shadow: -20px 40px 40px -20px rgba(0, 0, 0, 0.2), 0 0px 2px 2px rgba(128, 128, 128, 0.7), inset 0px -1px 2px rgba(50, 50, 50, 0.1), inset -1px 0px 1px rgba(150, 150, 150, 0.2);
        }
        .hardcover_front li:first-child {
            background-color: #eee;
            backface-visibility: hidden;
        }
        .hardcover_front li:last-child {
            background: #fffbec;
        }
        .hardcover_back li:first-child {
            background: #fffbec;
        }
        .hardcover_back li:last-child {
            background: #fffbec;
        }
        .book_spine li:first-child {
            background: #eee;
        }
        .book_spine li:last-child {
            background: #333;
        }
            .hardcover_front li:first-child:after,
            .hardcover_front li:first-child:before,
            .hardcover_front li:last-child:after,
            .hardcover_front li:last-child:before,
            .hardcover_back li:first-child:after,
            .hardcover_back li:first-child:before,
            .hardcover_back li:last-child:after,
            .hardcover_back li:last-child:before,
            .book_spine li:first-child:after,
            .book_spine li:first-child:before,
            .book_spine li:last-child:after,
            .book_spine li:last-child:before {
                background: #999;
            }
        .bookPage > li {
            background: linear-gradient(to right, #e1ddd8 0%, #fffbf6 100%);
            border-radius: 0px 5px 5px 0px;
        }
    .hardcover_front {
        transform: rotateY(-34deg) translateZ(8px);
        z-index: 100;
    }
    .hardcover_back {
        transform: rotateY(-15deg) translateZ(-8px);
    }
    .bookPage li:nth-child(1) {
        transform: rotateY(-28deg);
    }
    .bookPage li:nth-child(2) {
        transform: rotateY(-30deg);
    }
    .bookPage li:nth-child(3) {
        transform: rotateY(-32deg);
    }
    .bookPage li:nth-child(4) {
        transform: rotateY(-34deg);
    }
    .bookPage li:nth-child(5) {
        -webkit-transform: rotateY(-36deg);
        -moz-transform: rotateY(-36deg);
        transform: rotateY(-36deg);
    }
    .hardcover_front,
    .hardcover_back,
    .book_spine,
    .hardcover_front li,
    .hardcover_back li,
    .book_spine li {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        transform-style: preserve-3d;
    }
    .hardcover_front,
    .hardcover_back {
        transform-origin: 0% 100%;
    }
    .hardcover_front {
        transition: all 0.8s ease, z-index 0.6s;
    }
        .hardcover_front li:first-child {
            cursor: default;
            user-select: none;
            transform: translateZ(2px);
        }
        .hardcover_front li:last-child {
            transform: rotateY(180deg) translateZ(2px);
        }
    .hardcover_back li:first-child {
        transform: translateZ(2px);
    }
    .hardcover_back li:last-child {
        transform: translateZ(-2px);
    }
        .hardcover_front li:first-child:after,
        .hardcover_front li:first-child:before,
        .hardcover_front li:last-child:after,
        .hardcover_front li:last-child:before,
        .hardcover_back li:first-child:after,
        .hardcover_back li:first-child:before,
        .hardcover_back li:last-child:after,
        .hardcover_back li:last-child:before,
        .book_spine li:first-child:after,
        .book_spine li:first-child:before,
        .book_spine li:last-child:after,
        .book_spine li:last-child:before {
            position: absolute;
            top: 0;
            left: 0;
        }
    .hardcover_front li:first-child:after,
    .hardcover_front li:first-child:before {
        width: 4px;
        height: 100%;
    }
    .hardcover_front li:first-child:after {
        transform: rotateY(90deg) translateZ(-2px) translateX(2px);
    }
    .hardcover_front li:first-child:before {
        transform: rotateY(90deg) translateZ(158px) translateX(2px);
    }
    .hardcover_front li:last-child:after,
    .hardcover_front li:last-child:before {
        width: 4px;
        height: 160px;
    }
    .hardcover_front li:last-child:after {
        transform: rotateX(90deg) rotateZ(90deg) translateZ(80px) translateX(-2px) translateY(-78px);
    }
    .hardcover_front li:last-child:before {
        box-shadow: 0px 0px 30px 5px #333;
        transform: rotateX(90deg) rotateZ(90deg) translateZ(-140px) translateX(-2px) translateY(-78px);
    }
    .hardcover_back li:first-child:after,
    .hardcover_back li:first-child:before {
        width: 4px;
        height: 100%;
    }
    .hardcover_back li:first-child:after {
        transform: rotateY(90deg) translateZ(-2px) translateX(2px);
    }
    .hardcover_back li:first-child:before {
        transform: rotateY(90deg) translateZ(158px) translateX(2px);
    }
    .hardcover_back li:last-child:after,
    .hardcover_back li:last-child:before {
        width: 4px;
        height: 160px;
    }
    .hardcover_back li:last-child:after {
        transform: rotateX(90deg) rotateZ(90deg) translateZ(80px) translateX(2px) translateY(-78px);
    }
    .hardcover_back li:last-child:before {
        box-shadow: 10px -1px 80px 20px #666;
        transform: rotateX(90deg) rotateZ(90deg) translateZ(-140px) translateX(2px) translateY(-78px);
    }
    .book_spine {
        transform: rotateY(60deg) translateX(-5px) translateZ(-18px);
        width: 2px;
        z-index: 0;
    }
        .book_spine li:first-child {
            transform: translateZ(2px);
        }
        .book_spine li:last-child {
        }
        .book_spine li:first-child:after,
        .book_spine li:first-child:before {
            width: 4px;
            height: 100%;
        }
        .book_spine li:first-child:after {
            transform: rotateY(90deg) translateZ(-2px) translateX(2px);
        }
        .book_spine li:first-child:before {
            transform: rotateY(-90deg) translateZ(-12px);
        }
        .book_spine li:last-child:after,
        .book_spine li:last-child:before {
            width: 4px;
            height: 16px;
        }
        .book_spine li:last-child:after {
            transform: rotateX(90deg) rotateZ(90deg) translateZ(8px) translateX(2px) translateY(-6px);
        }
        .book_spine li:last-child:before {
            box-shadow: 5px -1px 100px 40px rgba(0, 0, 0, 0.2);
            transform: rotateX(90deg) rotateZ(90deg) translateZ(-210px) translateX(2px) translateY(-6px);
        }
    .bookPage,
    .bookPage > li {
        position: absolute;
        top: 0;
        left: 0;
        transform-style: preserve-3d;
    }
    .bookPage {
        width: 100%;
        height: 98%;
        top: 1%;
        left: 3%;
        z-index: 10;
    }
        .bookPage > li {
            width: 100%;
            height: 100%;
            transform-origin: left center;
            transition-property: transform;
            transition-timing-function: ease;
        }
            .bookPage > li:nth-child(1) {
                transition-duration: 0.6s;
            }
            .bookPage > li:nth-child(2) {
                transition-duration: 0.6s;
            }
            .bookPage > li:nth-child(3) {
                transition-duration: 0.4s;
            }
            .bookPage > li:nth-child(4) {
                transition-duration: 0.5s;
            }
            .bookPage > li:nth-child(5) {
                transition-duration: 0.6s;
            }
    .product2:hover .book > .hardcover_front,
    .product2.touched .book > .hardcover_front {
        transform: rotateY(-100deg) translateZ(0);
        z-index: 0;
    }
    .product2:hover .book > .bookPage li:nth-child(1),
    .product2.touched .book > .bookPage li:nth-child(1) {
        transform: rotateY(-30deg);
        transition-duration: 1.5s;
    }
    .product2:hover .book > .bookPage li:nth-child(2),
    .product2.touched .book > .bookPage li:nth-child(2) {
        transform: rotateY(-35deg);
        transition-duration: 1.8s;
    }
    .product2:hover .book > .bookPage li:nth-child(3),
    .product2.touched .book > .bookPage li:nth-child(3) {
        transform: rotateY(-94deg);
        transition-duration: 1.6s;
    }
    .product2:hover .book > .bookPage li:nth-child(4),
    .product2.touched .book > .bookPage li:nth-child(4) {
        transform: rotateY(-96deg);
        transition-duration: 1.4s;
    }
    .product2:hover .book > .bookPage li:nth-child(5),
    .product2.touched .book > .bookPage li:nth-child(5) {
        transform: rotateY(-98deg);
        transition-duration: 1.2s;
    }
    .coverDesign {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        overflow: hidden;
        z-index: 1;
        backface-visibility: hidden;
    }
        .coverDesign::after {
            background-image: linear-gradient( -135deg, rgba(255, 255, 255, 0.45) 0%, transparent 100%);
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
        }
        .coverDesign h1 {
            color: #fff;
            font-size: 2.2em;
            letter-spacing: 0.05em;
            text-align: center;
            margin: 54% 0 0 0;
            text-shadow: -1px -1px 0 rgba(0,0,0,0.1);
        }
        .coverDesign p {
            color: #f8f8f8;
            font-size: 1em;
            text-align: center;
            text-shadow: -1px -1px 0 rgba(0,0,0,0.1);
        }
        div.specialOffers div.product2 span.price {
            padding: 0;   
        }
    .lds-ring { position: relative; width: 120px; height: 120px; margin: 30px auto; }
                    .lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 104px; height: 104px; margin: 8px; border: 8px solid #fff; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #fe642e transparent transparent transparent; }
                        .lds-ring div:nth-child(1) { animation-delay: -0.45s; }
                        .lds-ring div:nth-child(2) { animation-delay: -0.3s; }
                        .lds-ring div:nth-child(3) { animation-delay: -0.15s; }
                @keyframes lds-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
    #db-title {
        margin: 5px;
        font-size: 1.3rem;
        font-weight: 800;
    }
    .dpIcon {
        height: 15%;
        width: 100%;
        margin: 0 0 3%;
    }
	@media (max-width: 768px) {
        #db-title {
            font-size: 1rem;
        }
        .dpIcon {
            height: 10%;
        }
    }
    .tab-buttons {
        position: absolute;
        top: 2%;
        left: 0;
        z-index: 100;
    }
        .tab-buttons button {
            color: #ffffff;
            cursor: pointer;
            padding: 4px 8px;
            width: auto;
            font-size: 85%;
            background: #37474f;
            margin: 0 auto 3px 0;
            display: block;
            font-weight: 800;
            border: 2px solid #777;
        }
        .tab-buttons button.btn-selected {
            border-color: #ffffff;
        }
    .specialNav a { padding: 3px 20px; }
    .specialNav a span { font-size: 70%; }
    .flex {
        margin: 0; 
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: center;
    }
    .source-images, .source-types {
        display: none;
    }
    /* Styles moved to styles2-page-setup.pss */
    .image-select,
    .product-select {
        text-align: center;
        margin: 0 0 10px;
    }
    .image-select button
    .product-select button {
        text-align: center; 
        border: 0; 
        color: #fff; 
        background-color: #bbb; 
        padding: 5px 10px; 
        font-size: 125%; 
        font-weight: bold;
    }
    .image-select button.active,
    .product-select button.active {
        background-color: #fe8b62; 
        cursor: pointer;
    }
    .image-containers,
    .product-containers {
        display: flex;
        margin: 10px;
        width: 100%;
        flex-wrap: wrap;
        gap: 10px;
        width: calc(100% - 20px);
        overflow: scroll;
        align-items: stretch;
        justify-content: center;
        overflow: auto;
    }
    .image-container label,
    .product-container label {
        display: block;
        box-sizing: content-box;
        font-size: 0;
        border: 5px solid #fff;
        cursor: pointer;
        position: relative;
    }
    .image-container img,
    .product-container img {
        max-width: 100%;
        height: auto;
    }
    .image-container input[type="radio"]:checked + label,
    .product-container input[type="radio"]:checked + label { 
        border: 5px solid #42a5f5;
        padding: 0;
    }
    .image-container input[type="radio"]:checked + label:after,
    .product-container input[type="radio"]:checked + label:after {
        content: '';
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: absolute;
        background: rgba(66, 165, 245, 0.3);
        cursor: pointer;
        color: #fff;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        line-height: 100vh;
        text-shadow: 0px 0px 3px #000;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .image-container p,
    .product-container p {
        text-align: center;
        margin: 3px 10px;
        font-size: 150%;
        font-weight: bold;
    }
    .product-container {
        border: 0;
        margin: 0;
        padding: 0;
    }
    .product-container label {
        border: 0;
        margin: 0;
        padding: 5px;
        background-color: #F6F6F6;
        border-radius: 10px;
    }
    /* styles moved to styles2-page-setup.pss */
    .packets { }
    .packets-title { font-size: 3rem; margin-bottom: 3rem; }
    .packets-title .t1-part { }
    .packets-title .t2-part { font-weight: 800; }
    .packets-container { 
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 3rem;
        flex-wrap: wrap;
    }
    .packet {
        border: 3px solid var(--package-color);
        border-radius: 10px;
        overflow: hidden;
        hr {
            border: 1px solid var(--package-color);
            margin: 5px 10px;
        }
    .packet-content {
            border-radius: 8px 8px 0 0;
            padding: 1rem;
            background-color: var(--package-background-color);
            text-align: center;
            position: relative;
        }
        .packet-content .t1-part {
            font-size: 3rem;
            color: var(--package-color);
            font-weight: 800;
            text-transform: uppercase;
        }
        .packet-content .t2-part {
            font-size: 3rem;
            text-transform: uppercase;
            color: #47576A;
        }
        .packet-product-count {
            font-size: 2rem;
            font-weight: 800;
        }
        .packet-articles-title {
            font-weight: 800;
            color: var(--main-orange);
            font-size: 1.5rem;
            margin-top: 20px;
        }
        .packet-articles {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        .packet-article {
            display: flex;
            text-align: start;
            padding: 10px 20px;
        }
        .packet-article svg {
            color: var(--main-orange);
            width: 30px;
            height: 30px;
            margin-right: 10px;
        }
        .packet-article-title {
            font-weight: 400;
            font-size: 1.5rem;
        }
        .packet-article-description {
            font-weight: 200;
            font-size: 1.25rem;
        }
        .packet-footer {
            border-top: 3px solid var(--package-color);
            color: var(--package-color);
            display: flex;
            justify-content: center;
            font-size: 1.5rem;
        }
        .packet-price {
            width: 100%;
        }
        .packet-list-price {
            font-size: 1.25rem;
            font-weight: 400;
            position: relative;
            display: inline-block;
        }
        .packet-list-price::before {
            position: absolute;
            content: "";
            left: -10%;
            top: 55%;
            right: -10%;
            border-top: 2px solid var(--main-orange);
            transform: rotate(-5deg);
        }
        .packet-offer-price {
            font-size: 3rem;
            font-weight: 800;
        }
        .packet-offer-price .d1 {
            font-size: 1.25rem;
            font-weight: 400;
        }
        .packet-footer:hover {
            background-color: var(--package-color);
            color: #FFFFFF;
        }
        .packet-select {
            flex-grow: 1;
            margin: 5px 10px;
            font-size: 1.5rem;
            font-weight: 400;
            overflow: hidden;
        }
        .packet-free-shipping {
            padding: 3px;
            width: 60px;
            font-size: 0;
            position: relative;
        }
        .packet-free-shipping .description {
            color: var(--main-orange);
            font-weight: 800;
            font-size: 1rem;
        }
        .packet-free-shipping span.description {
            position: absolute;
            right: 0;
            top: 105%;
        }
    }
    .packets-container .packet {
        align-self: start;
        max-width: calc((var(--default-page-width) / 3) - 5rem);
    }
    /* animation: tilting 2s linear infinite; */
    @keyframes tilting {
        0% {
            transform: perspective(100px) rotate3D(0, 1, 0, 0deg);
        }
        25% {
            transform: perspective(100px) rotate3D(0, 1, 0, 5deg);
        }
        50% {
            transform: perspective(100px) rotate3D(0, 1, 0, 0deg);
        }
        75% {
            transform: perspective(100px) rotate3D(0, 1, 0, -5deg);
        }
        100% {
            transform: perspective(100px) rotate3D(0, 1, 0, 0deg);
        }
    }
/* Nur noch während redesign */
.product2.landscapeView .onlyPortrait,
.sub.landscape .onlyPortrait,
.article.landscape .onlyPortrait {
    display: none;
}
.product2.portraitView .onlyLandscape,
.sub:not(.landscape) .onlyLandscape,
.article.portrait .onlyLandscape {
    display: none;
}
 .holder .sub {
     width: calc((100% / 10) - 20px);
 }
 .holder .sub.landscape {
     width: calc((100% / 5) - 20px);
 }
 @media (max-width: 2399px) {
     .holder .sub {
         width: calc((100% / 8) - 20px);
     }
     .holder .sub.landscape {
         width: calc((100% / 4) - 20px);
     }
 }
 @media (max-width: 1999px) {
     .holder .sub {
         width: calc((100% / 6) - 20px);
     }
     .holder .sub.landscape {
         width: calc((100% / 3) - 20px);
     }
 }
 @media (max-width: 1399px) {
     .holder .sub {
         width: calc((100% / 5) - 20px);
     }
     .holder .sub.landscape {
         width: calc((100% / 2.5) - 20px);
     }
 }
 @media (max-width: 768px) {
     .holder .sub {
         width: calc((100% / 4) - 20px);
     }
     .holder .sub.landscape {
         width: calc((100% / 2) - 20px);
     }
 }
@media (max-width: 599px) {
    .holder .sub {
        width: calc((100% / 3) - 20px);
    }
    .holder .sub.landscape {
        width: calc((100% / 1.5) - 20px);
    }
}
@media (max-width: 399px) {
    .holder .sub {
        width: calc((100% / 2) - 20px);
    }
    .holder .sub.landscape {
        width: calc((100% / 1) - 20px);
    }
}