.tax-product_brand .brand-description{overflow:hidden;zoom:1}.tax-product_brand .brand-description img.brand-thumbnail{width:25%;float:right}.tax-product_brand .brand-description .text{width:72%;float:left}.widget_brand_description img{box-sizing:border-box;width:100%;max-width:none;height:auto;margin:0 0 1em}ul.brand-thumbnails{margin-left:0;margin-bottom:0;clear:both;list-style:none}ul.brand-thumbnails:before{clear:both;content:"";display:table}ul.brand-thumbnails:after{clear:both;content:"";display:table}ul.brand-thumbnails li{float:left;margin:0 3.8% 1em 0;padding:0;position:relative;width:22.05%}ul.brand-thumbnails.fluid-columns li{width:auto}ul.brand-thumbnails:not(.fluid-columns) li.first{clear:both}ul.brand-thumbnails:not(.fluid-columns) li.last{margin-right:0}ul.brand-thumbnails.columns-1 li{width:100%;margin-right:0}ul.brand-thumbnails.columns-2 li{width:48%}ul.brand-thumbnails.columns-3 li{width:30.75%}ul.brand-thumbnails.columns-5 li{width:16.95%}ul.brand-thumbnails.columns-6 li{width:13.5%}.brand-thumbnails li img{box-sizing:border-box;width:100%;max-width:none;height:auto;margin:0}@media screen and (max-width:768px){ul.brand-thumbnails:not(.fluid-columns) li{width:48%!important}ul.brand-thumbnails:not(.fluid-columns) li.first{clear:none}ul.brand-thumbnails:not(.fluid-columns) li.last{margin-right:3.8%}ul.brand-thumbnails:not(.fluid-columns) li:nth-of-type(odd){clear:both}ul.brand-thumbnails:not(.fluid-columns) li:nth-of-type(even){margin-right:0}}.brand-thumbnails-description li{text-align:center}.brand-thumbnails-description li .term-thumbnail img{display:inline}.brand-thumbnails-description li .term-description{margin-top:1em;text-align:left}#brands_a_z h3:target{text-decoration:underline}ul.brands_index{list-style:none outside;overflow:hidden;zoom:1}ul.brands_index li{float:left;margin:0 2px 2px 0}ul.brands_index li a,ul.brands_index li span{border:1px solid #ccc;padding:6px;line-height:1em;float:left;text-decoration:none}ul.brands_index li span{border-color:#eee;color:#ddd}ul.brands_index li a:hover{border-width:2px;padding:5px;text-decoration:none}ul.brands_index li a.active{border-width:2px;padding:5px}div#brands_a_z a.top{border:1px solid #ccc;padding:4px;line-height:1em;float:right;text-decoration:none;font-size:.8em}:root {
--bg: #F4F4F4;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
} body {
background-color: var(--bg);
max-width: 100vw !important;
overflow-x: hidden;
}
.sof_page {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-top: 30px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
}
.sof_page_inner {
width: calc(100% - 20px);
max-width: 1080px;
}
.sof_product_page_head {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
width: 100%;
}
.product_page_head_content > * {
font-family: var(--font);
font-size: 32px;
font-weight: 600;
color: var(--primary);
line-height: 37px;
}
.product_page_head_content { display: flex;
flex-direction: column;
gap: 10px;
}
.sof_product_page_img {
border-radius: 8px !important;
overflow: hidden;
}
.sof_product_page_img > img {
max-width: 50%; }
.sof_product_page_img {
display: flex;
flex-direction: column;
align-content: center;
justify-content: center;
align-items: center;
background-color: white;
border-radius: 10px;
position: relative;
}
.product_page_content {
background-color: white;
border-radius: 6px;
margin-top: 30px;
max-width: 1080px;
width: 80%;
}
.product_page_desc {
display: flex;
flex-direction: column;
gap: 10px;
}
.product_page_desc > h6 {
font-size: 18px;
font-weight: 600;
font-family: var(--font);
color: var(--secondary);
}
.product_page_desc {
font-family: var(--font);
line-height: 20px;
font-weight: 500;
line-height: 24px;
}
.product_page_desc > ul {
}
.product_page_desc > ul > li {
padding-left: 30px;
margin-bottom: 5px;
position: relative;
}
.product_page_desc > ul > li::after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 30px;
height: 100%;
background-image: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3C!--%20Generator%3A%20Sketch%2052.3%20(67297)%20-%20http%3A%2F%2Fwww.bohemiancoding.com%2Fsketch%20--%3E%0A%20%20%20%20%3Ctitle%3Ejollycons-%5Bcategory%5D%2Ficons%2Fsvg%2Ficon-ui-1-checkmark%3C%2Ftitle%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%0A%20%20%20%20%3Cg%20id%3D%22icons%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icons---export%22%20transform%3D%22translate(-188.000000%2C%20-58.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22row-1%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%20fill%3D%22%23000000%22%20fill-rule%3D%22nonzero%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icon---3%22%20transform%3D%22translate(128.000000%2C%200.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%2391b7de%22%20d%3D%22M20.2623934%2C4.35694064%20C20.620373%2C3.92524672%2021.2454187%2C3.87858578%2021.6584721%2C4.25272051%20C22.0715254%2C4.62685523%2022.1161716%2C5.28010841%2021.758192%2C5.71180233%20L10.5017717%2C19.2861187%20C9.78581249%2C20.1495066%208.53572108%2C20.2428284%207.70961435%2C19.494559%20C7.64084239%2C19.4322668%207.57626278%2C19.365092%207.51633515%2C19.2935124%20L2.24488637%2C12.9971213%20C1.88495323%2C12.5672054%201.92663658%2C11.9137384%202.33798875%2C11.537562%20C2.74934091%2C11.1613855%203.37459118%2C11.20495%203.73452432%2C11.6348659%20L9.0059731%2C17.931257%20L20.2623934%2C4.35694064%20Z%22%20id%3D%22checkmark%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22slices%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%3E%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E');
background-size: 15px;
background-repeat: no-repeat;
background-position: center;
}
.product_page_desc > ul > li > a {
color: var(--secondary);
}
.product_page_desc { padding: 20px;
border-top: 2px solid #e4e4e4;
margin-top: 0px;
}
.product_tabs { display: flex;
padding: 0px 10px;
margin-top: 3px;
float: left;
box-sizing: border-box;
width: 100%;
gap: 20px;
align-items: stretch;
flex-direction: row;
}
.product_tab {
padding: 20px 10px;
cursor: pointer; font-size: 17px;
font-family: var(--font);
color: var(--primary);
position: relative;
}
.product_gallery_slider {
width: 100%;
height: 400px;
margin-bottom: 20px;
}
.product_gallery_slider .product_gallery_img_slide {
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
}
.product_gallery_thumbs {
width: 100%;
height: 100px;
position: relative;
display: grid;
grid-template-columns: repeat(5, 1fr);
);
}
.product_gallery_thumbs .product_gallery_img_thumb_slide {
width: 100px;
height: 100%;
background-size: cover;
background-position: center;
opacity: 0.6;
}
div.product_gallery_img_slide {
background-size: contain !important;
background-position: center;
}
.slick-list, .slick-track {
overflow: hidden;
width: 100%;
height: 100%;
}
.product_gallery_thumbs::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgb(255, 255, 255);
background: linear-gradient(-90deg, rgba(255, 255, 255, 1) 5%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 1) 95%);
pointer-events: none;
} .sof_product_specs {
display: flex;
flex-direction: column;
}
.sof_product_spec {
background-color: #ffffff;
padding: 10px;
}
.sof_product_spec:nth-child(odd) {
background-color: #f9f9f9;
}
.sof_product_spec > a, .sof_product_spec > strong {
font-weight: 600;
color: var(--primary);
text-decoration: none;
}
.sof_product_varcontroll > label {
font-size: 16px;
font-weight: 400;
}
.sof_product_varcontroll {
display: flex;
grid-template-columns: 1fr auto;
grid-gap: 30px;
flex-direction: row;
justify-content: space-between;
}
div#sof_variable_controlls {
display: flex;
flex-direction: column;
gap: 10px;
}
.sof_product_varcontroll > select {
border-radius: 7px;
padding: 5px;
background-color: #e6e6e6;
border: 0px solid red;
color: #484848;
font-size: 16px;
font-family: var(--font);
font-weight: 500;
width: 300px;
padding-top: 7px;
}
.product_gallery_img_slide {
background-size: contain !important;
background-position: center;
background-repeat: no-repeat !important;
} .sof_head > .sof_col > *, .sof_head > * {
color: white;
font-family: var(--font);
font-size: 16px;
font-weight: 500;
}
.sof_head > .sof_col > h1, .sof_head > h1 {
font-size: 17px;
font-weight: 200;
color: var(--secondary);
}
.sof_head > .sof_col > h3, .sof_head > h3 {
font-size: 33px;
font-weight: 600;
color: var(--primary);
}
.sof_head, .sof_head > .sof_col {
display: flex;
flex-direction: column;
gap: 15px;
}
.sof_listed_productscatalogus > p, .sof_head > .sof_col > p {
color: grey;
font-family: var(--font);
font-size: 17px;
font-weight: 500;
line-height: 1.4rem;
}
.sof_products {
display: grid;
grid-template-columns: 200px 1fr;
grid-gap: 20px;
width: 100%;
margin-top: 20px;
}
.sof_sidebar_option, .sof_product_cat_sidebar {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
}
.sof_sidebar_option > h4 {
font-size: 18px;
font-weight: 600;
font-family: var(--font);
color: white;
}
.sof_sidebar_option > strong > span, .sof_sidebar_option > a {
font-size: 16px;
font-weight: 500;
font-family: var(--font);
text-decoration: none;
color: white;
cursor: pointer;
}
.sof_sidebar_option {
margin-bottom: 15px;
}
.sof_product_grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 250px));
grid-gap: 15px;
}
.sof_product_item {
padding: 10px;
background-color: white;
border-radius: 5px;
}
.sof_product_item {
width: 100%;
margin: 0;
padding: 20px;
box-sizing: border-box; border-radius: 5px;
display: grid;
flex-direction: column;
align-items: center;
overflow: hidden;
grid-template-columns: 1fr;
grid-template-rows: 200px 1fr;
grid-gap: 10px;
cursor: pointer;
}
.sof_image {
width: 100%;
height: 100%;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.sof_description > h3 {
font-family: var(--font);
color: var(--primary);
line-height: 20px;
}
.sof_cat_breadcrumbs {
grid-column: 1 / span 2;
display: flex;
gap: 25px;
}
.sof_cat_breadcrumbs > strong > a, .sof_cat_breadcrumbs > strong > span {
font-family: var(--font);
color: grey;
);
text-decoration: none;
cursor: pointer;
font-weight: 500;
}
.sof_cat_breadcrumbs > strong {
position: relative;
cursor: pointer;
}
.sof_cat_breadcrumbs > strong::after {
content: "";
position: absolute;
left: -20px;
top: 1px;
width: 17px;
height: 14px;
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M15.5857864%2C12%20L7.29289322%2C20.2928932%20C6.90236893%2C20.6834175%206.90236893%2C21.3165825%207.29289322%2C21.7071068%20C7.68341751%2C22.0976311%208.31658249%2C22.0976311%208.70710678%2C21.7071068%20L17.7071068%2C12.7071068%20C18.0976311%2C12.3165825%2018.0976311%2C11.6834175%2017.7071068%2C11.2928932%20L8.70710678%2C2.29289322%20C8.31658249%2C1.90236893%207.68341751%2C1.90236893%207.29289322%2C2.29289322%20C6.90236893%2C2.68341751%206.90236893%2C3.31658249%207.29289322%2C3.70710678%20L15.5857864%2C12%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
transition: all 400ms cubic-bezier(1.000, -0.015, 0.000, 1.005); transition-timing-function: cubic-bezier(1.000, -0.015, 0.000, 1.005); }
.sof_cat_breadcrumbs > strong:first-child::after {
display: none;
}
.sof_cat_hover:after, .sof_cat_breadcrumbs > strong:hover:after {
transform: rotate(180DEG);
}
.sof_cat_hover > span, .sof_cat_breadcrumbs > strong:hover > span {
opacity: 0.5;
}
.product_tab_selected {
color: var(--secondary) !important;
}
.product_tab_selected::after {
content: "";
position: absolute;
bottom: -2px;
left: 0;
width: 100%;
height: 2px;
background-color: var(--secondary);
}
.sof_other_products {
margin-top: 30px;
margin-bottom: 20px;
padding: 30px 20px;
border-radius: 6px;
position: relative;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
align-items: center;
width: 100% !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
}
.sof_other_products:before {
content: "";
width: calc(100%);
height: calc(100% - 100px);
position: absolute;
top: 0px;
left: 0px;
background-color: #f5f5f5;
border-radius: 6px;
z-index: -1;
}
.sof_other_products > h2 {
color: var(--secondary) !important;
font-family: var(--font);
font-size: 16px;
font-weight: 500;
text-align: center;
margin-bottom: 7px;
}
.sof_products_inline {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
grid-gap: 15px;
margin-top: 30px;
width: calc(100% - 30px);
max-width: 1080px;
}
.sof_product_inline > a {
display: grid;
grid-template-rows: 200px 1fr;
background-color: white;
text-decoration: none;
border-radius: 5px;
padding: 20px;
height: 100%;
width: 100%;
box-sizing: border-box;
position: relative;
}
.sof_product_img {
background-size: contain;
background-position: center;
background-repeat: no-repeat; }
.sof_product_inline > a > h3 {
padding: 16px;
text-align: center;
font-family: var(--font);
text-decoration: none !important;
color: var(--primary);
transform: translateY(3px);
font-size: 19px;
text-align: left;
}
.sof_other_products > h4 {
width: 100%;
text-align: center;
font-size: 25px;
font-weight: 500;
font-family: var(--font);
color: var(--primary);
margin-bottom: 12px;
}
.sof_product_inline {
float: left;
min-height: 200px !important;
position: relative;
}
.sof_slider_accessoires { display: block;
position: relative;
width: 100%;
height: 300px !important;
}
.sof_slider_accessoires > div {
background-color: rgba(0, 0, 0, 0);
box-sizing: border-box;
}
.sof_slider_accessoires > div > a {
background-color: white;
}
.slick-track > .sof_product_inline {
box-sizing: border-box;
width: 100%;
margin: 0px 7.5px;
}
.sof_other_products.sof_accessoires::before {
background-color: Var(--secondary);
}
.sof_other_products.sof_accessoires > h2 {
color: white !important;
}
.sof_other_products.sof_accessoires > h4 {
color: white !important;
}
.sof_nav_slider_btn {
width: 50px;
height: 50px;
background-color: white !important;
position: absolute;
top: calc(50% - 25px);
right: -10px;
z-index: 99999999999999999999;
opacity: 1;
border: 2px solid var(--secondary);
border-radius: 5px;
box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
cursor: pointer;
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%2391b7df%22%20d%3D%22M15.5857864%2C12%20L7.29289322%2C20.2928932%20C6.90236893%2C20.6834175%206.90236893%2C21.3165825%207.29289322%2C21.7071068%20C7.68341751%2C22.0976311%208.31658249%2C22.0976311%208.70710678%2C21.7071068%20L17.7071068%2C12.7071068%20C18.0976311%2C12.3165825%2018.0976311%2C11.6834175%2017.7071068%2C11.2928932%20L8.70710678%2C2.29289322%20C8.31658249%2C1.90236893%207.68341751%2C1.90236893%207.29289322%2C2.29289322%20C6.90236893%2C2.68341751%206.90236893%2C3.31658249%207.29289322%2C3.70710678%20L15.5857864%2C12%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
background-size: 20px;
background-repeat: no-repeat;
background-position: center;
}
.sof_nav_slider_btn.sof_nav_slbtn_prev {
right: unset !important;
left: -10px;
transform: rotate(180deg);
} @media screen and (max-width: 760px) {
.sof_product_page_head {
display: flex;
flex-direction: column-reverse;
align-items: stretch;
}
.product_page_head_content {
padding: 0px;
margin-top: 20px;
margin-bottom: 30px;
}
}
.sof_login_form {
display: grid;
grid-template-columns: 1fr;
grid-gap: 10px;
background-color: #eaeaea;
padding: 20px;
border-radius: 5px;
border-radius: 7px; }
.sof_login_form label {
color: white;
font-size: 17px;
font-weight: 500;
}
.sof_login_form input[type="text"], .sof_login_form input[type="password"] {
background-color: white;
color: var(--primary);
padding: 10px;
border: none;
border-radius: 5px;
}
.sof_login_form input[type="submit"] {
background-color: var(--secondary);
color: var(--primary);
padding: 10px;
border: none;
border-radius: 5px;
cursor: pointer;
}
.sof_login_form input[type="submit"]:hover {
background-color: var(--primary);
color: var(--secondary);
}
.login-username > label, .login-password > label {
color: var(--primary);
}
form#loginform > p {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: stretch;
}
form#loginform > p > input {
background-color: #ffffff;
padding: 16px !important;
box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
}
form#loginform > p > label {
color: var(--primary);
}
input#wp-submit {
background-color: var(--secondary) !important;
box-shadow: none !important;
font-size: 17px !important;
font-family: var(--font);
color: white;
font-weight: 600;
}
p.login-remember {
margin: 10px 0px;
}
.sof_2col {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}
.sof_square {
width: 100%;
position: relative;
padding-bottom: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.sof_align_middle {
display: flex;
align-items: stretch;
flex-direction: column;
justify-content: center;
}
.sof_other_products.sof_accessoires.sof_listed_productscatalogus::before {
background-color: #F5F5F5;
}
.sof_other_products.sof_accessoires.sof_listed_productscatalogus > h4 {
color: var(--primary) !important;
}
.sof_other_products.sof_accessoires.sof_listed_productscatalogus > h2 {
color: var(--secondary) !important;
}
.sof_listed_productscatalogus > p {
color: var(--primary);
}
button.sof_btn, a.sof_btn {
font-weight: 400;
padding: 21px 42px 15px 20px;
}
.sof_align_center {
display: flex;
justify-content: center;
align-items: center;
}
.sof_description > p {
display: none;
}
@media only screen and (min-width: 650px) {
.sof_product_grid.sof_product_list > .sof_product_item > .sof_description > p {
display: block;
}
.sof_product_grid.sof_product_list {
display: grid;
grid-template-columns: 1fr;
}
.sof_product_grid.sof_product_list > .sof_product_item {
display: grid;
grid-template-columns: 200px 1fr;
grid-template-rows: 1fr;
height: 200px;
padding: 20px;
}
.sof_product_grid.sof_product_list > .sof_product_item > .sof_image {
background-color: #f7f7f7;
border-radius: 3px;
}
.sof_product_grid.sof_product_list > .sof_product_item > .sof_description {
padding: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: stretch;
gap: 10px;
}
.sof_product_grid.sof_product_list > .sof_product_item > .sof_description > h3 {
font-size: 19px;
font-weight: 600;
}
.sof_product_grid.sof_product_list > .sof_product_item > .sof_description > p {
font-family: var(--font);
font-weight: 500;
}
}
.sof_other_products.sof_alternatives, .product_page_content {
grid-column: 1 / span 2;
width: calc(100% - 30px) !important;
}
.sof_product_nav {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
}
.sof_product_nav {
display: flex;
justify-content: center;
align-items: center;
gap: 5px;
flex-direction: row;
grid-column: 2 / span 1;
}
.sof_product_nav > a {
padding: 10px 15px;
}
.sof_product_nav > a::after {
display: none !important;
}
.sof_product_nav > a {
padding: 15px 18px;
}
.sof_grid_loader {
--color: var();
--color: var(--secondary);
width: var(--size);
height: var(--size);
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 15px;
}
.sof_grid_loader span {
width: 100%;
height: 100%;
background-color: var(--color);
animation: keyframes-blink 0.6s alternate infinite linear;
}
.sof_grid_loader span:nth-child(1) {
animation-delay: 0ms;
}
.sof_grid_loader span:nth-child(2) {
animation-delay: 200ms;
}
.sof_grid_loader span:nth-child(3) {
animation-delay: 300ms;
}
.sof_grid_loader span:nth-child(4) {
animation-delay: 400ms;
}
.sof_grid_loader span:nth-child(5) {
animation-delay: 500ms;
}
.sof_grid_loader span:nth-child(6) {
animation-delay: 600ms;
}
@keyframes keyframes-blink {
0% {
opacity: 0.3;
transform: scale(0.5) rotate(5deg);
}
50% {
opacity: 1;
transform: scale(1);
}
}
.card__skeleton {
background: linear-gradient(-45deg, #eee 40%, #fafafa 50%, #eee 60%);
background-size: 300%;
background-position-x: 100%;
animation: shimmer 1s infinite linear;
border-radius: 7px;
}
h3.card__skeleton {
width: 50%;
height: 40px;
margin-bottom: 10px;
}
@keyframes shimmer {
to {
background-position-x: 0%
}
}
.product_page_desc.sof_desc_page_photos > .product_gallery_grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 300px));
grid-gap: 15px;
}
.product_gallery_grid > div {
width: 100%;
padding: 0;
background-color: #eff2f7;
border-radius: 5px;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 200px 1fr;
grid-gap: 10px;
cursor: pointer;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.sof_product_downloads {
display: flex;
flex-direction: column;
gap: 0;
}
.sof_product_download {
padding: 7px 11px;
background-color: #fafafa;
}
.sof_product_download:nth-child(even) {
background-color: white;
}
.sof_product_download > a {
color: var(--primary);
text-decoration: none;
font-size: 15px;
font-weight: 500;
padding: 0px;
}
.sof_cat_breadcrumbs > strong::after {
filter: invert(1) !important;
} .sofc_img > img {
width: auto;
max-height: 220px;
max-width: 240px;
}
div.sofc_items {
margin-top: 20px;
}
.sofc_item {
background-color: white;
border-radius: 5px;
display: flex;
flex-direction: row;
overflow: hidden;
transition: all 0.3s ease 0s;
cursor: pointer;
}
div.sofc_item:hover {
transform: scale(1.03);
box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
}
.sofc_content {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
padding: 10px;
box-sizing: border-box;
}
div.sofc_text > h2 {
font-size: 20px;
font-family: var(--font);
font-weight: 500;
color: var(--primary);
}
div.sofc_text > h2 {
font-size: 20px;
font-family: var(--font);
font-weight: 500;
color: var(--primary);
}
.sofc_img_sfeer {
width: calc(200% + 40px);
height: 100%;
background-size: cover;
background-position: center;
padding: 10px;
box-sizing: border-box;
border-radius: 5px;
}
.sofc_text > * {
text-align: center;
line-height: 26px;
font-family: var(--font);
color: #676767;
font-weight: 500;
}
.sofc_img { width: 100%;
display: flex;
flex-direction: column;
align-items: center;
height: 250px;
align-content: center;
justify-content: center;
}
div.sofc_item[data-bento="2x1"]:nth-child(even) {
flex-direction: row-reverse;
}
div.bento-filler {
width: 100%;
height: 100%;
background-color: #ededed;
border-radius: 6px;
}
.sofp_products_content {
width: 100%;
float: left;
}
.sofp_products_content {
}
#sofp_products {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
grid-gap: 15px;
}
.sofp_product_item {
padding: 0px;
background-color: white;
border-radius: 5px;
cursor: pointer;
float: left;
height: 100%;
box-sizing: border-box;
overflow: hidden;
}
.sofp_product_item > a {
display: flex;
grid-template-columns: 1fr;
grid-template-columns: 200px 1fr;
background-color: white;
text-decoration: none;
border-radius: 5px;
padding: 20px; width: 100%;
box-sizing: border-box;
position: relative;
flex-direction: column;
align-items: center;
}
.sofp_product_item > a > div.sofp_productcontent > h3, .sofp_product_item > a > div.sofp_productcontent > p {
padding: 16px;
font-weight: 600;
text-align: center;
font-family: var(--font);
text-decoration: none !important;
color: var(--primary);
width: 100%;
box-sizing: border-box;
}
.sofp_product_item > a > div.sofp_productcontent > p {
font-weight: 500;
color: black !important;
font-size: 16px;
text-align: left;
display: none;
}
div.sofp_productimg {
width: 100%;
height: 250px;
display: flex;
overflow: hidden;
flex-direction: column;
justify-content: center;
align-content: center;
flex-wrap: nowrap;
align-items: center;
}
div.sofp_productimg > img {
width: auto !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
height: auto !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
max-height: 180px;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.sofp_products_content {
display: grid;
grid-template-columns: 240px 1fr;
grid-gap: 15px;
align-items: stretch;
}
.sofp_products_cat {
width: 100%;
}
div.sofp_items_list {
display: grid;
grid-template-columns: 1fr !important;
grid-gap: 15px;
}
div.sofp_items_list > div.sofp_product_item > a {
display: grid;
grid-template-columns: 200px 1fr;
grid-gap: 15px;
box-sizing: border-box; }
div.sofp_items_list > div.sofp_product_item > a > div.sofp_productcontent {
box-sizing: border-box;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: stretch;
gap: 10px;
}
div.sofp_items_list > div.sofp_product_item > a > div.sofp_productcontent > * {
text-align: left;
box-sizing: border-box;
padding: 0px;
!;
}
div.sofp_items_list > div.sofp_product_item > a > div.sofp_productcontent > p {
display: block;
line-height: 24px;
}
.sof_view_toggle > button {
background-color: white;
border: 0px solid red;
padding: 5px 12px;
padding-top: 9px;
border-radius: 5px;
}
.sof_view_toggle {
display: flex;
flex-direction: row;
gap: 5px;
cursor: pointer;
}
button.active {
background-color: var(--primary);
}
button.active > svg {
filter: invert(1);
}
div.sofp_product_item > a > div.sofp_productcontent > button {
width: 100px;
margin-top: 10px;
padding: 10px 15px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
border: 0px solid red;
background-color: var(--secondary);
font-size: 16px;
font-weight: 500;
color: white;
font-family: var(--font);
padding-top: 14px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
border-radius: 5px;
background-color: #f2f6ff;
color: var(--primary);
}
div.sofp_product_item > a > div.sofp_productcontent:hover > button {
background-color: var(--primary);
color: white;
}
.sofp_breadcrumb_cats > * {
text-decoration: none;
color: var(--secondary);
font-size: 17px;
font-size: 16px;
font-weight: 400;
position: relative;
float: left; display: flex;
flex-direction: row;
align-items: center;
}
.sofp_breadcrumb_cats {
cursor: pointer;
display: flex;
flex-direction: row;
align-content: center;
align-items: center;
gap: 18px;
}
.sofp_breadcrumb_cats > * :hover {
filter: brightness(0.4);
}
.sofp_breadcrumb_cats > * :after {
position: absolute;
right: -17px;
top: -2px;
width: 18px;
height: 100%;
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%235c5c5c%22%20d%3D%22M15.5857864%2C12%20L7.29289322%2C20.2928932%20C6.90236893%2C20.6834175%206.90236893%2C21.3165825%207.29289322%2C21.7071068%20C7.68341751%2C22.0976311%208.31658249%2C22.0976311%208.70710678%2C21.7071068%20L17.7071068%2C12.7071068%20C18.0976311%2C12.3165825%2018.0976311%2C11.6834175%2017.7071068%2C11.2928932%20L8.70710678%2C2.29289322%20C8.31658249%2C1.90236893%207.68341751%2C1.90236893%207.29289322%2C2.29289322%20C6.90236893%2C2.68341751%206.90236893%2C3.31658249%207.29289322%2C3.70710678%20L15.5857864%2C12%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
background-size: 12px;
background-repeat: no-repeat;
background-position: center;
content: "";
} .sofp_breadcrumb_cats > * :last-child:after {
display: none;
}
.sofp_categorie_productcontent {
padding: 10px;
}
.sofp_categorie_card {
background-color: white;
border-radius: 5px;
box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}
.sofp_categorie_productcontent > h3 {
font-family: var(--font);
font-size: 18px;
font-weight: 500;
color: var(--primary);
margin-bottom: 10px;
text-align: Center;
}
.sofp_categorie_productcontent > p {
font-size: 16px;
font-family: var(--font);
line-height: 20px;
font-weight: 500 !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
color: #4e4e4e;
}
.sofp_categorie_productimg {
overflow: hidden;
border-radius: 4px;
}
a.sofp_child_cat {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: flex-start;
align-items: center;
gap: 10px;
background-color: white;
margin-top: 20px;
border-radius: 4px;
text-decoration: none;
min-height: 42px;
padding: 3px;
}
a.sofp_child_cat:hover {
transform: scale(1.05);
}
.sofp_child_catimg > img {
width: 39px;
}
a.sofp_child_cat > h4 {
font-weight: 500;
font-size: 15px;
font-family: var(--font);
padding-top: 4px;
color: grey;
}
.sofp_categorie_productimg.sofp_img_product {
padding: 20px;
}
div.sofp_product_item, button {
transition: all 500ms cubic-bezier(0.250, 0.250, 0.000, 0.985); transition-timing-function: cubic-bezier(0.250, 0.250, 0.000, 0.985); }
div.sofp_product_item:hover, button:hover {
transform: scale(1.05);
cursor: pointer;
}
div.sofp_product_item:active;
button:active {
transform: scale(0.95);
cursor: pointer;
}
@media screen and (max-width: 760px) {
.footer_meta_links, .footer_meta_links > div {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
gap: 20px;
}
div.sofc_img_sfeer {
display: none;
}
.sofc_item {
margin-bottom: 20px;
}
}
.sofc_item.even-bento {
display: flex;
flex-direction: row-reverse;
}
.sof_product_gallery_img {
width: 100%;
max-width: 300px;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
border: 1px solid #a1a1a1;
height: 100%;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
object-fit: contain;
}
.lightboxOverlay {
z-index: 999999999990 !important;
}
#lightbox {
z-index: 999999999999 !important;
}
.sof_product_ean, .sof_product_price_purchase, .sof_product_price_gross {
font-size: 18px;
font-weight: 300;
}
.sof_product_ean > strong, .sof_product_price_gross > strong, .sof_product_price_purchase > strong {
font-weight: 500;
color: black !important;
}
.sof_product_price {
background-color: #eaeaea;
border-radius: 6px;
padding: 16px;
}
ul.sof_offertes_inline {
display: flex;
flex-direction: row;
gap: 10px;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
ul.sof_offertes_inline > li {
display: flex;
flex-direction: column;
gap: 10px;
align-items: center;
justify-content: center;
text-align: center;
}
ul.sof_offertes_inline > li > a {
text-decoration: none;
color: white !important;
}
.sof_inspiratie_popup {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
z-index: 99999999999999999999;
background-color: #363636ab;
display: flex;
flex-direction: column;
align-content: center;
align-items: center;
justify-content: center;
height: 100%; }
.sof_inspiratie_popup .sof_inspiratie_popup_content {
display: flex;
background-color: white;
padding: 10px;
border-radius: 10px;
width: 100%;
max-width: 580px;
flex-direction: column;
position: relative;
}
.sof_inspiratie_popup .sof_inspiratie_popup_content .sof_inspiratie_popup_close {
position: absolute;
right: 20px;
top: 20px;
background-color: #e9e9e9;
padding: 8px 10px;
border-radius: 50%;
color: white;
cursor: pointer;
font-family: var(--font);
color: red;
font-weight: 700;
line-height: 19px;
padding-bottom: 6px;
}
.sof_inspiratie_popup .sof_inspiratie_popup_content h2 {
font-family: var(--font);
font-size: 21px;
padding: 10px;
}
.sof_inspiratie_popup .sof_inspiratie_popup_content img {
width: 100%;
border-radius: 10px;
margin-top: 10px;
}
.sof_inspiratie_popup .sof_inspiratie_popup_content .sof_inspiratie_popup_products {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 10px;
}
.sof_inspiratie_popup .sof_inspiratie_popup_content .sof_inspiratie_popup_products .sof_inspiratie_popup_product {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
}
.sof_inspiratie_popup .sof_inspiratie_popup_content .sof_inspiratie_popup_products img {
}
.sof_inspiratie_popup .sof_inspiratie_popup_content .sof_inspiratie_popup_products h3 {
font-family: var(--font);
}
.sof_inspiratie_popup .sof_inspiratie_popup_content .sof_inspiratie_popup_products button {
background-color: var(--primary);
color: white;
padding: 10px;
border-radius: 4px;
border: 0px solid red; }
.sofi_image_wrapper {
position: relative;
}
.sofi_savebtn {
width: 50px;
height: 50px;
background-color: #0000009e;
position: absolute;
right: 20px;
bottom: 20px;
border-radius: 4px;
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M16.05%2C4%20C14.7733664%2C4%2013.5884993%2C4.69856876%2012.8446485%2C5.87224224%20C12.4519764%2C6.49181374%2011.5480236%2C6.49181374%2011.1553515%2C5.87224224%20C10.4115007%2C4.69856876%209.22663356%2C4%207.95%2C4%20C5.79334036%2C4%204%2C5.9926004%204%2C8.5%20C4%2C11.0108005%206.64584886%2C14.7903531%2011.9999984%2C19.6555961%20C17.3541451%2C14.7903616%2020%2C11.0108034%2020%2C8.5%20C20%2C5.9926004%2018.2066596%2C4%2016.05%2C4%20Z%20M16.05%2C2%20C19.3609594%2C2%2022%2C4.93226735%2022%2C8.5%20C22%2C11.7606809%2019.094183%2C15.9115905%2013.3449691%2C21.1358199%20C12.5822165%2C21.8288625%2011.4177061%2C21.8288525%2010.6549807%2C21.1357742%20C4.90581085%2C15.9115817%202%2C11.7606775%202%2C8.5%20C2%2C4.93226735%204.63904062%2C2%207.95%2C2%20C9.48829456%2C2%2010.9212941%2C2.64062711%2012%2C3.7359287%20C13.0787059%2C2.64062711%2014.5117054%2C2%2016.05%2C2%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
background-size: 20px;
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
.sof_inspiratie_popup_product {
position: relative;
}
.sof_menu_logo.sof_logo_reseller {
display: grid;
grid-template-columns: 1fr 30px 1fr;
!;
!f;
!fr;
!fr;
!fr 3;
!fr;
!fr;
!f;
!;
grid-gap: 10px;
align-items: center;
background-image: none !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
}
.sof_inline_reseller_logo {
background-size: contain;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
}
.sof_menu_logo.sof_logo_reseller {
}
.sof_inline_soflogo {
width: 100%;
height: 100%;
background-color: #ffffff00;
background-image: url(//portal.schaffenburg.nl/de//wp-content/uploads/2025/01/Schaffenburg-logo-grijs.webp);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.sof_som {
visibility: hidden !important;
display: none !important;
}
div#sofp_products.sofp_items_list {
display: block !important;
}
div#sofp_products.sofp_items_list > div {
margin-bottom: 10px;
}
.sofp_categories_modal {
display: block;
position: fixed;
z-index: 999999999999999;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.4);
display: flex;
justify-content: center;
align-items: center;
}
.sofp_categories_modal_content {
background-color: #fbfbfb;
padding: 20px;
border: 1px solid #888;
width: 80%;
max-width: 800px;
border-radius: 5px;
position: relative;
}
.sofp_categories_modal_header {
display: flex;
justify-content: space-between;
align-items: center;
}
.sofp_categories_modal_header h2 {
margin: 0;
font-family: var(--font);
font-size: 19px;
font-weight: 500;
color: Var(--primary);
}
.sofp_categories_modal_close {
cursor: pointer;
width: 30px;
height: 30px;
background-color: var(--primary);
color: #fff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
background-image: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3C!--%20Generator%3A%20Sketch%2052.3%20(67297)%20-%20http%3A%2F%2Fwww.bohemiancoding.com%2Fsketch%20--%3E%0A%20%20%20%20%3Ctitle%3Ejollycons-%5Bcategory%5D%2Ficons%2Fsvg%2Ficon-ui-1-close%3C%2Ftitle%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%0A%20%20%20%20%3Cg%20id%3D%22icons%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icons---export%22%20transform%3D%22translate(-124.000000%2C%20-58.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22row-1%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%20fill%3D%22%23000000%22%20fill-rule%3D%22nonzero%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icon---2%22%20transform%3D%22translate(64.000000%2C%200.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M12%2C13.4142136%20L4.70710678%2C20.7071068%20C4.31658249%2C21.0976311%203.68341751%2C21.0976311%203.29289322%2C20.7071068%20C2.90236893%2C20.3165825%202.90236893%2C19.6834175%203.29289322%2C19.2928932%20L10.5857864%2C12%20L3.29289322%2C4.70710678%20C2.90236893%2C4.31658249%202.90236893%2C3.68341751%203.29289322%2C3.29289322%20C3.68341751%2C2.90236893%204.31658249%2C2.90236893%204.70710678%2C3.29289322%20L12%2C10.5857864%20L19.2928932%2C3.29289322%20C19.6834175%2C2.90236893%2020.3165825%2C2.90236893%2020.7071068%2C3.29289322%20C21.0976311%2C3.68341751%2021.0976311%2C4.31658249%2020.7071068%2C4.70710678%20L13.4142136%2C12%20L20.7071068%2C19.2928932%20C21.0976311%2C19.6834175%2021.0976311%2C20.3165825%2020.7071068%2C20.7071068%20C20.3165825%2C21.0976311%2019.6834175%2C21.0976311%2019.2928932%2C20.7071068%20L12%2C13.4142136%20Z%22%20id%3D%22close%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22slices%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%3E%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E');
background-size: 15px;
background-repeat: no-repeat;
background-position: center;
}
.sofp_categories_breadcrumbs {
display: flex;
flex-direction: row;
font-family: Var(--font);
gap: 23px;
font-size: 16px;
border-bottom: 2px solid #e4e4e4;
padding: 10px 0px;
}
div.sofp_categorie_breadcrumb {
position: relative;
}
div.sofp_categorie_breadcrumb::after {
content: "";
position: absolute;
right: -22px;
top: -5px;
width: 23px;
height: 24px;
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%23c2c2c2%22%20d%3D%22M15.5857864%2C12%20L7.29289322%2C20.2928932%20C6.90236893%2C20.6834175%206.90236893%2C21.3165825%207.29289322%2C21.7071068%20C7.68341751%2C22.0976311%208.31658249%2C22.0976311%208.70710678%2C21.7071068%20L17.7071068%2C12.7071068%20C18.0976311%2C12.3165825%2018.0976311%2C11.6834175%2017.7071068%2C11.2928932%20L8.70710678%2C2.29289322%20C8.31658249%2C1.90236893%207.68341751%2C1.90236893%207.29289322%2C2.29289322%20C6.90236893%2C2.68341751%206.90236893%2C3.31658249%207.29289322%2C3.70710678%20L15.5857864%2C12%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
background-size: 16px;
background-repeat: no-repeat;
background-position: center;
}
div.sofp_categorie_breadcrumb:last-child::after {
display: none;
}
@media screen and (max-width: 900px) {
.sofp_products_content {
display: flex;
flex-direction: column;
}
div.sofp_child_cats {
display: none !important;
}
}
.sofp_categorie {
padding: 10px;
background-color: white;
margin-top: 10px;
border-radius: 4px;
box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
cursor: pointer;
}
.sofp_categorie_title {
font-family: var(--font);
padding-top: 5px;
}
.product_gallery_thumbnav.sof_prev, .product_gallery_thumbnav.sof_next {
position: absolute;
width: 60px;
height: 100px;
background-color: red;
bottom: 0px;
left: 0px;
cursor: pointer;
background: rgb(255, 255, 255);
background: linear-gradient(284deg, rgba(255, 255, 255, 0) 00%, rgba(255, 255, 255, 1) 100%);
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%23333333%22%20d%3D%22M15.5857864%2C12%20L7.29289322%2C20.2928932%20C6.90236893%2C20.6834175%206.90236893%2C21.3165825%207.29289322%2C21.7071068%20C7.68341751%2C22.0976311%208.31658249%2C22.0976311%208.70710678%2C21.7071068%20L17.7071068%2C12.7071068%20C18.0976311%2C12.3165825%2018.0976311%2C11.6834175%2017.7071068%2C11.2928932%20L8.70710678%2C2.29289322%20C8.31658249%2C1.90236893%207.68341751%2C1.90236893%207.29289322%2C2.29289322%20C6.90236893%2C2.68341751%206.90236893%2C3.31658249%207.29289322%2C3.70710678%20L15.5857864%2C12%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
background-size: 25px;
background-repeat: no-repeat;
background-position: center;
}
.product_gallery_thumbnav.sof_next {
left: auto;
right: 0px;
transform: rotate(0deg);
}
.product_gallery_thumbnav.sof_prev {
transform: rotate(180deg);
}
.sof_btn_categories {
width: 100% !important;
margin-bottom: 20px;
}
.sof_btn_categories::after {
background-image: url(https://portal.schaffenburg.nl/wp-content/themes/1-1-0-schaffenburg-portal/icons/categories.svg) !important;
}
@media screen and (max-width: 700px) {
.login-as-user.login-as-user-bottom {
display: none !important;
}
.product_page_desc {
padding: 13px;
width: 100%;
box-sizing: border-box;
}
.sof_application_tile.sof_company_tile {
display: flex !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
flex-direction: column;
align-items: stretch;
}
.sof_application_tile.sof_company_tile {
display: flex;
flex-direction: column;
align-items: stretch;
}
.sof_tile_title {
display: flex;
flex-direction: column;
align-items: stretch;
text-align: center;
}
.sof_menu_logo.sof_logo_reseller {
padding-right: 20px;
}
.sof_hom {
display: none !important;
}
.sof_som {
display: block !important;
visibility: visible !important;
}
div.sof_company_editbtn {
display: flex !important;
flex-direction: column;
}
.acf-fields {
display: flex;
flex-direction: column;
align-items: stretch;
flex-wrap: nowrap;
align-content: center;
}
div.product_page_desc > form#acf-form > div#acf-form-data > div.acf-fields.acf-form-fields > div.acf-field {
width: 100% !important;
}
main#primary {
padding-top: 0px !important;
overflow-x: hidden !important;
}
.sof_page_inner > div.sof_page_inner {
width: 100% !important;
}
.sof_application_tile.sofp_offerte_tile {
padding: 10px 0px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
}
.sof_application_tile.sofp_offerte_tile > h3 {
font-size: 18px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
}
.sof_application_tile.sofp_offerte_tile > a {
padding: 10px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
font-size: 13px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
padding-bottom: 7px !important;
!importan;
!importa;
!import;
!impor;
!impo;
!imp;
!im;
!i;
!;
}
button.sof_btn::after, div.sof_btn::after, a.sof_btn::after {
display: none !important;
}
div.sofp_items_list > div.sofp_product_item > a {
display: flex
}
.sof_menu_wrapper > div.sof_menu_desktop > div.sof_menu_el > div.sof_menu_logo {
background-size: 100px !important;
}
button.sof_btn.sof_btn_secondary.sof_btn_categories {
width: 100% !important;
text-align: left;
padding-left: 40px;
margin-bottom: 20px;
display: block !important;
}
.sofp_breadcrumb_cats {
display: none;
}
.sof_head.sof_2col {
display: flex;
flex-direction: column-reverse;
}
.sof_product_varcontroll {
display: flex;
flex-direction: column;
gap: 1px;
align-items: stretch;
}
.sof_product_varcontroll > select {
height: 45px;
width: 100%;
}
}
.product_gallery_img_thumb_slide.product_gallery_img_thumb_active {
opacity: 1;
-webkit-box-shadow: inset 0px 0px 0px 3px rgba(0, 0, 0, 0.13);
-moz-box-shadow: inset 0px 0px 0px 3px rgba(0, 0, 0, 0.13);
box-shadow: inset 0px 0px 0px 3px rgba(0, 0, 0, 0.13);
opacity: .6;
}
.sof_lightbox {
position: fixed;
top: 106px;
left: 0px;
width: 100vw;
height: calc(100vh - 106px);
background-color: #191919ca;
z-index: 999999;
display: flex;
justify-content: center;
align-items: center;
}
.sof_lightbox > img {
max-width: calc(100vw - 30px);
max-height: calc(100vh - 190px);
}
.sof_lightbox_close {
background-color: #0000008f;
position: absolute;
top: 50px;
right: 50px;
width: 40px;
height: 40px;
background-image: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3C!--%20Generator%3A%20Sketch%2052.3%20(67297)%20-%20http%3A%2F%2Fwww.bohemiancoding.com%2Fsketch%20--%3E%0A%20%20%20%20%3Ctitle%3Ejollycons-%5Bcategory%5D%2Ficons%2Fsvg%2Ficon-ui-1-close%3C%2Ftitle%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%0A%20%20%20%20%3Cg%20id%3D%22icons%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icons---export%22%20transform%3D%22translate(-124.000000%2C%20-58.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22row-1%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%20fill%3D%22%23000000%22%20fill-rule%3D%22nonzero%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icon---2%22%20transform%3D%22translate(64.000000%2C%200.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M12%2C13.4142136%20L4.70710678%2C20.7071068%20C4.31658249%2C21.0976311%203.68341751%2C21.0976311%203.29289322%2C20.7071068%20C2.90236893%2C20.3165825%202.90236893%2C19.6834175%203.29289322%2C19.2928932%20L10.5857864%2C12%20L3.29289322%2C4.70710678%20C2.90236893%2C4.31658249%202.90236893%2C3.68341751%203.29289322%2C3.29289322%20C3.68341751%2C2.90236893%204.31658249%2C2.90236893%204.70710678%2C3.29289322%20L12%2C10.5857864%20L19.2928932%2C3.29289322%20C19.6834175%2C2.90236893%2020.3165825%2C2.90236893%2020.7071068%2C3.29289322%20C21.0976311%2C3.68341751%2021.0976311%2C4.31658249%2020.7071068%2C4.70710678%20L13.4142136%2C12%20L20.7071068%2C19.2928932%20C21.0976311%2C19.6834175%2021.0976311%2C20.3165825%2020.7071068%2C20.7071068%20C20.3165825%2C21.0976311%2019.6834175%2C21.0976311%2019.2928932%2C20.7071068%20L12%2C13.4142136%20Z%22%20id%3D%22close%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22slices%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%3E%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E');
background-position: center;
background-repeat: no-repeat;
background-size: 20px;
border-radius: 4px;
cursor: pointer;
} .tippy-box[data-theme ~='sof_headermodal'],
.tippy-box[data-theme ~='sof_exportmodal'] {
width: 200px;
height: 160px;
background-color: white;
border: 1px solid #ccc;
border-radius: 4px;
box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;
padding: 10px;
}
.tippy-box[data-theme ~='sof_exportmodal']{
height: 200px;
}
.tippy-box[data-theme ~='sof_headermodal'] .tippy-content,
.tippy-box[data-theme ~='sof_exportmodal'] .tippy-content {
font-family: var(--font);
font-size: 14px;
color: var(--primary, #333);
padding: 10px;
}
button.sof_account_option, button.sof_export_option {
width: 100%;
background-color: #efefef;
height: 45px;
border-radius: 3px;
text-align: left !important;
padding-left: 54px;
color: black !important;
margin-bottom: 8px;
font-size: 15px;
font-family: var(--font);
padding-top: 6px;
position: relative;
border: 0px solid red !important;
}
button.sof_account_option > img, button.sof_export_option > img {
position: absolute;
left: 10px;
top: 50%;
transform: translateY(-50%);
max-width: 30px;
max-height: 30px;
}
div.sof_loader {
grid-column: 1 / span 2;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 15px;
height: 100px;
}
.loader {
display: block;
--height-of-loader: 8px;
--loader-color: #0071e2;
width: 190px;
height: var(--height-of-loader);
border-radius: 30px;
background-color: rgba(0, 0, 0, 0.2);
position: relative;
}
.loader::before {
content: "";
position: absolute;
background: var(--secondary);
top: 0;
left: 0;
width: 0%;
height: 100%;
border-radius: 30px;
animation: moving 1s ease-in-out infinite;
}
@keyframes moving {
50% {
width: 100%;
}
100% {
width: 0;
right: 0;
left: unset;
}
}
.modal_animation-enter-active {
animation: fadeInUp 1s ease-in-out;
}
.modal_animation-leave-active {
animation: zoomOut 1s ease-in-out;
}
.fade-enter-active, .modal_wrapper_animation-enter-active {
animation: fadeIn .4s ease-in-out;
}
.fade-leave-active, .modal_wrapper_animation-leave-active {
animation: fadeOut .4s ease-in-out;
}
.modal_inner_animation-enter-active {
animation: fadeIn .4s ease-in-out;
}
.modal_inner_animation-leave-active {
animation: zoomOut .4s ease-in-out;
}
div.sof_col1 {
grid-column: 1 / span 2 !important;
padding: 10px;
padding-top: 20px;
display: flex;
flex-direction: column;
gap: 10px;
align-items: center;
justify-content: center;
}
div.sof_productmodal_content.sof_col1 > div {
text-align: center;
}
img.sof_p_icon {
width: 80px;
}
.table_animation-enter-active {
animation: fadeInUp .4s ease-in-out;
}
.table_animation-leave-active {
animation: fadeOutRight .4s ease-in-out;
}
.sofp_application_headerspace > div.product_tabs {
display: flex;
justify-content: space-between;
align-items: center;
}
.sofp_application_headerspace > div.product_tabs > input {
height: 40px;
padding-left: 10px;
width: 200px;
background-color: #f5f5f5;
color: var(--primary);
border: none;
border-radius: 5px;
margin-right: 10px;
}
span.highlight {
text-decoration: underline;
font-weight: 600;
color: var(--primary);
}
tr > * :hover, tr > * > * :hover, tr > * > * > * :hover, tr:hover {
cursor: normal;
}
.sofp_fullill {
float: left;
width: 100%;
height: 400px;
overflow: hidden;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
align-items: center;
gap: 20px;
padding: 0px;
}
.sofp_ill {
width: 100%;
height: 100%;
position: relative;
object-fit: contain;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
gap: 20px;
}
.sofp_ill > img {
max-height: 160px;
max-width: 300px;
}
button.sof_btn_cart {
background-color: white !important;
box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px !important;
color: var(--primary) !important;
font-weight: 600;
}
button.sof_btn_cart::after, div.sof_btn_cart, a.sof_btn_cart::after {
background-image: url(//portal.schaffenburg.nl/de//wp-content/themes/1-1-0-schaffenburg-portal/icons/cart.svg);
width: 58px;
background-size: 20px;
}
.sofp_productbtns { min-height: 39px;
display: flex;
flex-direction: row;
align-items: stretch;
gap: 10px;
}
.product_page_desc.sof_desc_page_content {
display: block;
line-height: 1.8em;
float: left;
}
button.sofcc_btn {
height: 43px;
width: 175px !important;
color: var(--primary);
font-weight: 400;
font-size: 16px;
line-height: 34px;
background-color: white;
border: 0px solid red;
border-radius: 3px;
font-family: vaR(--font);
padding-top: 4px;
}
button.sofcc_cart {
text-align: left !important;
background-color: var(--primary);
color: white !important;
font-weight: 500;
padding-left: 15px !important;
}
button.sofcc_btn.sofcc_cart > img {
width: 20px;
transform: translate(4px, 5px);
}
.sofc_cart_close {
position: absolute;
right: 20px;
top: 20px;
width: 20px;
height: 20px;
background-image: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3C!--%20Generator%3A%20Sketch%2052.3%20(67297)%20-%20http%3A%2F%2Fwww.bohemiancoding.com%2Fsketch%20--%3E%0A%20%20%20%20%3Ctitle%3Ejollycons-%5Bcategory%5D%2Ficons%2Fsvg%2Ficon-ui-1-close%3C%2Ftitle%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%0A%20%20%20%20%3Cg%20id%3D%22icons%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icons---export%22%20transform%3D%22translate(-124.000000%2C%20-58.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22row-1%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%20fill%3D%22%23000000%22%20fill-rule%3D%22nonzero%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icon---2%22%20transform%3D%22translate(64.000000%2C%200.000000)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20fill%3D%22%23e66a6a%22%20d%3D%22M12%2C13.4142136%20L4.70710678%2C20.7071068%20C4.31658249%2C21.0976311%203.68341751%2C21.0976311%203.29289322%2C20.7071068%20C2.90236893%2C20.3165825%202.90236893%2C19.6834175%203.29289322%2C19.2928932%20L10.5857864%2C12%20L3.29289322%2C4.70710678%20C2.90236893%2C4.31658249%202.90236893%2C3.68341751%203.29289322%2C3.29289322%20C3.68341751%2C2.90236893%204.31658249%2C2.90236893%204.70710678%2C3.29289322%20L12%2C10.5857864%20L19.2928932%2C3.29289322%20C19.6834175%2C2.90236893%2020.3165825%2C2.90236893%2020.7071068%2C3.29289322%20C21.0976311%2C3.68341751%2021.0976311%2C4.31658249%2020.7071068%2C4.70710678%20L13.4142136%2C12%20L20.7071068%2C19.2928932%20C21.0976311%2C19.6834175%2021.0976311%2C20.3165825%2020.7071068%2C20.7071068%20C20.3165825%2C21.0976311%2019.6834175%2C21.0976311%2019.2928932%2C20.7071068%20L12%2C13.4142136%20Z%22%20id%3D%22close%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22slices%22%20transform%3D%22translate(60.000000%2C%2058.000000)%22%3E%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E');
background-position: center;
background-repeat: no-repeat;
background-size: 20px;
cursor: pointer;
z-index: 999999;
}
a.triggerSearch {
transform: translateY(-4px);
}
.sof_menu_logo, .sof_inline_soflogo {
cursor: pointer !important;
}
.sofp_application_grid:hover > div.sof_application_tile {
transform: scale(0.9);
}
.sofp_application_grid:hover > div.sof_application_tile:hover {
transform: scale(1.05);
}
.sofp_application_grid:hover > div.sof_application_tile:hover {
background-color: var(--primary);
}
.sofp_application_grid:hover > div.sof_application_tile:hover > div > * {
filter: invert(1) hue-rotate(180deg);
}
.sofp_application_grid:hover > div.sof_application_tile:hover > .sof_tile_title {
color: white !important;
}
.form-group.sof_field_invalid > input {
background-color: #fff9f9;
border: 1px solid red;
}
.sofp_breadcrumb_cats > *::after {
content: ">";
margin: 0;
margin-left: 7px;
margin-right: -7px;
}
.sofp_breadcrumb_cats > *:last-child::after {
content: "";
margin: 0;
}