.ss_title { font-size: 36px; line-height: 48px; }
.cms_padding_ss { padding: 16px 52px; }
.ss_padding_correction_top { margin: -36px 0 0; }
hr.ss_light { background: #D7D9D9; }

.ss_button { display: inline-block; min-width: 220px; padding: 12px 20px; text-align: center; background: #000000; color: #ffffff; font-weight: bold; text-decoration: none; line-height: 26px; font-size: 18px; border: none !important; cursor: pointer; }
.ss_button i { line-height: 26px; font-size: 26px; }
.ss_button:hover { background: #F74039; }
.ss_button.ss_button_grey { background: #D7D9D9; color: #000000; }
.ss_button.ss_button_grey:hover { background: #000000; color: #ffffff; }
.ss_button.ss_button_white { background: #ffffff; color: #000000; }
.ss_button.ss_button_white:hover { background: #000000; color: #ffffff; }
.ss_button.ss_button_dynamic { min-width: 0; }

#cmsShadowBox .button { display: inline-block; padding: 12px 20px; text-align: center; background: #000000; color: #ffffff; font-weight: bold; text-decoration: none; line-height: 26px; font-size: 18px; border: none !important; cursor: pointer; }
#cmsShadowBox .button i { line-height: 26px; font-size: 26px; }
#cmsShadowBox .button:hover { background: #F74039; }

.ss_navi > div > ul { display: flex; flex-wrap: wrap; justify-content: center; width: 100%; }
.ss_navi > div > ul > li { padding: 0 16px; list-style: none; }
.ss_navi > div > ul > li > a { display: block; color: #000000; text-decoration: none; font-weight: bold; text-transform: uppercase; }
.ss_navi > div > ul > li > a i { display: block; line-height: 200px; font-size: 128px; text-align: center; }
.ss_navi > div > ul > li > a span { display: block; padding: 10px 30px 8px 30px; line-height: 35px; font-size: 21px; text-align: center; background: #D7D9D9; }
.ss_navi > div > ul > li.current > a { color: #F74039; }
.ss_navi > div > ul > li > a:hover { color: #F74039; }
.ss_navi > div > ul > li.current > a span { background: #F74039; color: #ffffff; }
.ss_navi > div > ul > li > a:hover span { background: #F74039; color: #ffffff; }

.ss_box > div { position: relative; height: 100%; }
.ss_box > div > a { position: relative; z-index: 1; display: block; height: 100%; border: 1px solid #D7D9D9; text-decoration: none; color: #000000; }
.ss_box > div:hover > a { border: 1px solid #F74039; color: #F74039; }
.ss_box > div > a > .ssb_image { position: relative;  padding: 37.5%; }
.ss_box > div > a > .ssb_image picture { position: absolute; z-index: 1; left: 0; top: 0; right: 0; bottom: 0; }
.ss_box > div > a > .ssb_image picture img { width: 100%; height: 100%; object-fit: cover; }
.ss_box > div > a > .ssb_text { padding: 20px; font-size: 21px; line-height: 28px; }
.ss_box > div > a > .ssb_text .ssb_title { min-height: 84px; font-weight: bold; }
.ss_box > div > a > .ssb_text .ssb_price { padding: 16px 0 0 0; color: #F74039; }
.ss_box > div > .ssb_buttons { display: none; position: absolute; z-index: 2; left: 1px; top: 1px; right: 1px; }
.ss_box > div:hover > .ssb_buttons { display: block; }
.ss_box > div > .ssb_buttons > div { position: relative; padding: 37.5%; }
.ss_box > div > .ssb_buttons > div .ssb_buttons_box { position: absolute; left: 0; top: 0; right: 0; bottom: 0; padding: 36px; }
.ss_box > div > .ssb_buttons > div .ssb_buttons_box > div,
.ss_box > div > .ssb_buttons > div .ssb_buttons_box > div a { width: 100%; min-width: 0; text-align: center; }
.ss_box > div > .ssb_buttons > div .ssb_buttons_box > div a i { float: none; }
@media screen and (max-width: 1047px){
.ss_box > div > .ssb_buttons > div div.ssb_buttons_box { align-content: flex-end; align-items: flex-end; }
.ss_box > div > .ssb_buttons > div div.ssb_buttons_box > div:nth-of-type(1),
.ss_box > div > .ssb_buttons > div div.ssb_buttons_box > div:nth-of-type(3) { display: none;}
.ss_box > div > .ssb_buttons > div .ssb_buttons_box > div a span { display: none; }
}

.ssd_spacer hr { margin-right: -104px; }
.ssd_attributes { width: 100%; }
.ssd_attributes > tbody > tr > td { font-size: 21px; }
.ssd_attributes > tbody > tr > td:nth-of-type(1) { padding: 0 36px 36px 0; white-space: nowrap; }
.ssd_attributes > tbody > tr > td:nth-of-type(2) { width: 100%; padding: 0 0 36px 0; font-weight: bold; }
.ssd_attributes .ssd_price { color: #F74039; }
.ssd_attributes .ssd_vat { font-size: 18px; font-weight: normal; }

.ssd_gallery { margin: -10px; }
.ssd_gallery .flex_container { padding: 5px; }
.ssd_gallery .flex_box { padding: 5px; }
.ssd_gallery .ssd_img > div { position: relative; padding: 50%; border: 1px solid #D7D9D9; cursor: pointer; }
.ssd_gallery .ssd_img > div.ssd_yt:before { display: block; content: "\f167"; position: absolute; z-index: 10; left: 50%; top: 50%; width: 40px; height: 20px; margin: -10px 0 0 -20px; font-family: 'Font Awesome 5 Brands'; text-align: center; line-height: 20px; font-size: 20px; color: #F74039; }
.ssd_gallery .ssd_img#ssd_img_large > div.ssd_yt:before { width: 80px; height: 60px; margin: -30px 0 0 -40px; line-height: 60px; font-size: 60px; }
.ssd_gallery .ssd_img.current > div { border: 1px solid #000000; }
.ssd_gallery .ssd_img > div picture { position: absolute; z-index: 1; left: 5px; top: 5px; right: 5px; bottom: 5px; }
.ssd_gallery .ssd_img#ssd_img_large > div picture { position: absolute; z-index: 1; left: 15px; top: 15px; right: 15px; bottom: 15px; }
.ssd_gallery .ssd_img > div picture img { width: 100%; height: 100%; object-fit: cover; }
.ssd_gallery .ssd_img#ssd_img_large > div:after { display: block; content: "\f002"; position: absolute; z-index: 2; right: 15px; bottom: 15px; width: 40px; height: 40px; border-radius: 4px; text-align: center; line-height: 40px; font-size: 20px; color: #ffffff; background: #878988; font-family: 'Font Awesome 5 Free'; font-weight: 900; }

.ss_toggler_block { width: 100%; }
.ss_toggler_block td:nth-of-type(2) { width: 100%; }
.ss_toggler_block td:nth-of-type(2) input { width: 100%; height: 52px; padding: 10px 16px; line-height: 32px; background: #ffffff; color: #000000; font-weight: bold; text-align: center; border: none; }
.ss_toggler_block td:nth-of-type(2) input::-webkit-outer-spin-button,
.ss_toggler_block td:nth-of-type(2) input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ss_toggler_block td:nth-of-type(2) input[type=number] { -moz-appearance: textfield; }
.ss_toggler_block .ss_toggler { width: 52px; height: 52px; background: #ffffff; border: 1px solid #E8E7E8; cursor: pointer; text-align: center; line-height: 50px; font-size: 18px; color: #7A7E82; }
.ss_toggler_block .ss_toggler:hover { border: 1px solid #F74039; background: #F74039; color: #ffffff; }
.ss_toggler_block.ss_toggler_block_border td:nth-of-type(2) input { padding: 9px 16px; border-top: 1px solid #E8E7E8; border-bottom: 1px solid #E8E7E8; }

#ss_basket { width: 100%; }
#ss_basket > thead > tr > td { padding: 20px 0 20px 20px; font-size: 21px; line-height: 28px; text-align: right; font-weight: bold; border-bottom: 1px solid #000000; }
#ss_basket > thead > tr > td:last-of-type { padding: 20px; }
#ss_basket > tbody > tr > td { padding: 20px 0 20px 20px; border-bottom: 1px solid #E8E7E8; }
#ss_basket > tbody > tr > td:last-of-type { padding: 20px; }
#ss_basket > tbody > tr:last-of-type > td { border-bottom: 2px solid #000000; }
#ss_basket > tbody > tr:nth-of-type(2N-1) > td { /*background: #F2F2F2;*/ background: #E5E5E5; }
#ss_basket tbody .ssb_image { line-height: 1px; }
#ss_basket tbody .ssb_image > a,
#ss_basket tbody .ssb_image > div { position: relative; display: block; width: 180px; height: 180px; border: 1px solid #D7D9D9; background: #ffffff; }
#ss_basket tbody .ssb_image picture { position: absolute; z-index: 1; left: 10px; top: 10px; right: 10px; bottom: 10px; }
#ss_basket tbody .ssb_image picture img { width: 100%; height: 100%; object-fit: cover; }

#ss_basket tbody .ssb_nr { display: block; font-size: 21px; line-height: 52px; font-weight: bold; color: #000000; }
#ss_basket tbody .ssb_name { font-size: 21px; line-height: 32px; }
#ss_basket tbody .ssb_quantity_noedit > div { isplay: block; font-size: 21px; line-height: 52px; text-align: right; }
#ss_basket tbody .ssb_quantity_edit > div { min-width: 192px; }
#ss_basket tbody .ssb_price { font-size: 21px; line-height: 52px; text-align: right; white-space: nowrap; }
#ss_basket tbody .ssb_price_total { font-size: 21px; line-height: 52px; text-align: right; font-weight: bold; white-space: nowrap; }
#ss_basket tbody .ssb_delete { width: 53px; min-width: 53px; padding: 12px 0; cursor: pointer; }

#ss_basket > tfoot > tr > td { padding: 20px 0 20px 20px; font-size: 18px; line-height: 24px; text-align: right; font-weight: bold; }
#ss_basket > tfoot > tr:last-of-type > td { font-size: 26px; line-height: 32px; }
#ss_basket > tfoot > tr > td:last-of-type { padding: 20px; }

#ss_basket tfoot .ssb_grandtotal_label,
#ss_basket tfoot .ssb_grandtotal_value { border-bottom: 6px double #000000; border-top: 2px solid #000000; white-space: nowrap; }
@media screen and (min-width: 769px) and (max-width: 1229px){
#ss_basket { border-top: 1px solid #000000; }
#ss_basket > thead { display: none; }
#ss_basket > tbody > tr { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; border-bottom: 1px solid #E8E7E8; }
#ss_basket > tbody > tr:last-of-type { border-bottom: 2px solid #000000; }
#ss_basket > tbody > tr > td { border: none !important; }
#ss_basket > tbody > tr > td:nth-of-type(1) { display: block; width: 30%; }
#ss_basket > tbody > tr > td:nth-of-type(1).ssb_image > a  { width: 100%; }
#ss_basket > tbody > tr > td:nth-of-type(2) { display: block; width: 70%; padding: 20px; }
#ss_basket > tbody > tr > td:nth-of-type(3) { display: block; width: 50%; }
#ss_basket > tbody > tr > td:nth-of-type(4) { display: block; width: 25%; }
#ss_basket > tbody > tr > td:nth-of-type(5) { display: block; width: 25%; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-of-type(3) { order: 4; display: block; width: 35%; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-of-type(3) > div { min-width: 0; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-of-type(4) { order: 5; display: block; width: 25%; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-of-type(5) { order: 6; display: block; width: 25%; padding: 20px; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-of-type(6) { order: 3; display: block; width: 15%; padding: 20px 0 20px 20px; }
#ss_basket > tbody > tr > td.ssb_quantity_edit:after { display: block; content: ""; clear: both; }
#ss_basket > tbody > tr > td.ssb_quantity_edit > div { float: right; max-width: 200px; }
#ss_basket > tfoot tr { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; }
#ss_basket > tfoot tr td { display: block; }
#ss_basket > tfoot tr td:nth-of-type(1) { width: 40%; }
#ss_basket > tfoot tr td:nth-last-of-type(2) { width: 30%; }
#ss_basket > tfoot tr td:nth-last-of-type(1) { width: 30%; }
}
@media screen and (max-width: 768px){
#ss_basket { border-top: 1px solid #000000; }
#ss_basket > thead { display: none; }
#ss_basket > tbody > tr { position: relative; display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; border-bottom: 1px solid #E8E7E8; }
#ss_basket > tbody > tr:last-of-type { border-bottom: 2px solid #000000; }
#ss_basket > tbody > tr > td { width: 100%; padding: 0 20px 20px 20px; border: none !important; }
#ss_basket > tbody > tr > td:first-of-type { padding: 20px !important; }
#ss_basket > tbody > tr > td:nth-last-of-type(1) { padding: 0 20px 40px 20px !important; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-last-of-type(2) { padding: 0 20px 40px 20px !important; }
#ss_basket.ss_basket_edit > tbody > tr > td:nth-last-of-type(1) { position: absolute; left: 0; bottom: 20px; width: auto; padding: 20px !important; }
#ss_basket > tbody > tr > td.ssb_image > a  { width: 100%; }
#ss_basket > tbody > tr > td > div { line-height: 28px !important; }
#ss_basket > tbody > tr > td.ssb_quantity_edit:after { display: block; content: ""; clear: both; }
#ss_basket > tbody > tr > td.ssb_quantity_edit > div { float: right; max-width: 200px; }
#ss_basket > tfoot > tr { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; }
#ss_basket > tfoot > tr > td { display: block; }
#ss_basket > tfoot > tr > td:nth-of-type(1) { display: none; }
#ss_basket > tfoot > tr > td:nth-last-of-type(2) { width: 50%; }
#ss_basket > tfoot > tr > td:nth-last-of-type(1) { width: 50%; }
}

#sso_progress { padding: 32px 32px 8px 32px; }
#sso_progress ul { padding: 0; }
#sso_progress ul li { padding: 0; list-style: none; flex-grow: 1; }
#sso_progress ul li > * { position: relative; display: block; padding: 4px 10px 4px 22px; color: #ffffff; text-align: center; font-size: 14px; line-height: 24px; font-weight: bold; color: #000000; background: #D7D9D9; }
#sso_progress ul li > *:before { display: block; content: ""; position: absolute; z-index: 1; right: -12px; top: 5px; width: 16px; height: 16px; border: 3px solid; border-color: #ffffff #ffffff transparent transparent; transform: rotate(45deg); background: #D7D9D9; }
#sso_progress ul li > *:after { display: block; content: ""; position: absolute; z-index: 1; right: -10px; top: 1px; width: 24px; height: 24px; border: 3px solid; border-color: #ffffff #ffffff transparent transparent; transform: rotate(45deg); }
#sso_progress ul li:last-of-type > *:before,
#sso_progress ul li:last-of-type > *:after { display: none; }
#sso_progress ul li.current + li > *,
#sso_progress ul li.current + li + li > *,
#sso_progress ul li.current + li + li + li > * { color: #979999; /*background: #F2F2F2;*/ background: #E5E5E5; }
#sso_progress ul li.current + li > *:before,
#sso_progress ul li.current + li + li > *:before,
#sso_progress ul li.current + li + li + li > *:before { /*background: #F2F2F2;*/ background: #E5E5E5; }
#sso_progress ul li.current > * { color: #ffffff; background: #F74039; }
#sso_progress ul li.current > *:before { background: #F74039; }
#sso_progress ul li > a:hover { color: #ffffff; background: #000000; }
#sso_progress ul li > a:hover:before { background: #000000; }
@media screen and (max-width: 768px){
#sso_progress ul li > * { padding: 4px 5px 4px 12px; font-size: 13px; font-weight: normal; }
#sso_progress ul li > *:first-of-type { padding: 4px 5px 4px 5px; }
}

#ss_order .sso_form_box  { width: 60%; min-width: 300px; max-width: 100%; }
.ss_form .sso_form_line.hidden { display: none; }
.ss_form label { display: block !important; position: relative; height: 57px; /*background: #E3F1FD;*/ /*background: #F2F2F2;*/ background: #E5E5E5; }
.ss_form label input[type='email'],
.ss_form label input[type='text'] { position: relative; z-index: 2; /*height: 57px; background: none !important; color: #297FCA !important;*/ }
.ss_form label [type='email'] + span,
.ss_form label [type='text'] + span { display: block; position: absolute; z-index: 4; left: 16px; top: 2px; line-height: 14px; font-size: 12px; color: #a7a9a9; cursor: text; }
.ss_form label input[type='email']:focus + span,
.ss_form label input[type='email']:placeholder-shown + span,
.ss_form label input[type='text']:focus + span,
.ss_form label input[type='text']:placeholder-shown + span { top: 20px; line-height: 17px; font-size: 16px; }
.ss_form label input[type='email']:focus + span,
.ss_form label input[type='text']:focus + span { top: 2px; line-height: 14px; font-size: 12px; }
.ss_form label select { position: relative; /*z-index: 2; background: none;*/ }
.ss_form label select + span { display: block; position: absolute; z-index: 4; left: 16px; top: 2px; line-height: 14px; font-size: 12px; color: #a7a9a9; cursor: text; }
.ss_form label select:invalid + span { top: 20px; line-height: 17px; font-size: 16px; z-index: 1; }
.ss_form label select option { line-height: 40px; padding: 5px; }
.ss_form label select option.hidden { display: none; }
.ss_form label input[type='checkbox'] { display: none; }
.ss_form label [type='checkbox'] + span { position: relative; display: block; height: 57px; padding: 10px 20px 10px 57px; line-height: 37px; color: #a7a9a9; cursor: pointer; }
.ss_form label [type='checkbox'] + span:before { display: block; content: ""; position: absolute; left: 15px; top: 15px; width: 27px; height: 27px; border-radius: 4px; border: 2px solid #c8c8c8; box-sizing: border-box; }
.ss_form label [type='checkbox']:checked + span { color: #297FCA; }
.ss_form label [type='checkbox']:checked + span:after { display: block; content: "\f00c"; position: absolute; left: 15px; top: 15px; width: 27px; height: 27px; line-height: 27px; text-align: center; font-family: "Font Awesome 5 Free"; font-weight: 900; }
.ss_form label input:-webkit-autofill,
.ss_form label input:-webkit-autofill:hover,
.ss_form label input:-webkit-autofill:focus,
.ss_form label input:-webkit-autofill:active {
    transition: all 5000s ease-in-out 0s;
}
@media screen and (max-width: 768px){
#ss_order .sso_form_box  { width: 100%; min-width: 100%; }

}

#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer { position: relative; width: 80vW; max-width: 1100px; height: 80vH; max-height: 1000px; padding: 0 30px; background: #ffffff; }
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer:before { display: block; content: ""; position: absolute; left: 0; top: 0; right: 0; height: 140px; background: #f4f2ee; }
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer #cmsShadowBox { height: 100%; }
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer #cmsShadowBox iframe { width: 100%; height: 100%; border: none; }
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer #cmsShadowClose { position: absolute; }
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer #cmsShadowClose:after { color: #000000; }
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer #cmsShadowClose:hover:after { color: #ffffff; }
@media screen and (max-width: 965px){
#cmsShadow.simplepay_payment_saferpay #cmsShadowContainer { position: absolute; left: 20px; top: 110px; right: 20px; bottom: 20px; width: auto; height: auto; max-height: none; max-width: none; }
}
/************************************ Ende: Kontaktformular ************************************/
.ss_form input, form select, form textarea {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	/*background: #F2F2F2;*/
	background: #E5E5E5;
	color: #000000;
	font-size: 16px;
	line-height: 25px;
	height: auto;
	padding: 16px;
	border: none;
}
.ss_form textarea { height: 250px; }
.ss_form select { cursor: pointer; -moz-appearance:none; -webkit-appearance:none; appearance:none; }
.ss_form label.select:after {
    display: block;
    content: "\f078";
    position: absolute;
    z-index: 10;
    right: 15px;
    top: 10px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-family: "FontAwesome";
    font-size: 21px;
    color: #000000;
    background: transparent;
	pointer-events: none;
}
.ss_form ::placeholder {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #000000;
	font-size: 16px;
	line-height: 25px;
}

.ss_form :-ms-input-placeholder {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #000000;
	font-size: 16px;
	line-height: 25px;
}
.ss_form ::-ms-input-placeholder {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #000000;
	font-size: 16px;
	line-height: 25px;
}
/************************************ Ende: Kontaktformular ************************************/
/************************************ Start: 3er Grid Fix ************************************/
@media screen and (max-width: 1366px) { #ss_list > .flex_container > .flex_box_33 { width: 50%; } }
@media screen and (max-width: 959px) { #ss_list > .flex_container > .flex_box_33 { width: 100%; } }
/************************************ Ende: 3er Grid Fix ************************************/