﻿/*
 * Version: 2024-12-17
 * 
 * Collection of standardized ui components.
*/


/*** component: ui-layout-container ***/

.ui-layout-container { }
/* none, default, fluid, text, flex, grid, ...*/


/*** component: block-content-basic (example) ***/

.block--content--basic { }
.block--content--basic .row--vspace--offset { width: 100%; height: 100px; }
.block--content--basic .row--vspace--divide { width: 100%; height: 60px; }
.block--content--basic .row--vspace--line { width: 100%; height: 20px; }
.block--content--basic .row--title { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.block--content--basic .row--title { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
.block--content--basic .row--title.left.aligned { align-items: flex-start; }
.block--content--basic .row--title.centered { align-items: center; }
.block--content--basic .row--title.right.aligned { align-items: flex-end; }
.block--content--basic .row--navigate { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.block--content--basic .row--navigate { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
.block--content--basic .row--content { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.block--content--basic .row--content { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
.block--content--basic .row--items { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.block--content--basic .row--items { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
.block--content--basic .row--columns { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.block--content--basic .row--columns { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
.block--content--basic .row--cta { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.block--content--basic .row--cta { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
.block--content--basic .cols--items { }
.block--content--basic .ui.grid.cols--items { width: 100%; gap: 60px; }
.block--content--basic .ui.grid > .column.col--item { width: auto; flex-grow: 1; flex-shrink: 1; flex-basis: 0%; }
.block--content--basic .item--header { }
.block--content--basic .item--body { display: flex; flex-direction: column; }
.block--content--basic .item--body.centered { justify-content: center; }
.block--content--basic .item--body.centered .ui.header { text-align: center; }

.block--content--basic .list--items { display: flex; flex-direction: column; gap: 10px; }
.block--content--basic .list--item { }

.block--content--basic .row--cards > .ui.cards { }
.block--content--basic .row--cards > .ui.cards > .card { }
.block--content--basic .row--cards > .ui.cards { justify-content: center; }
.block--content--basic .row--cards > .ui.cards .card { margin: 0; padding: .875em .5em; background: none; border: none; border-radius: 0; box-shadow: none; }
.block--content--basic .row--cards > .ui.cards .card img { border-radius: 0 !important; }
.block--content--basic .row--cards > .ui.cards.x5 .card { width: 20%; }

/* resolution: 4K - 2560px */
@media only screen and (max-width: 2560px) {
    .block--content--basic .row--title { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
    .block--content--basic .row--navigate { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
    .block--content--basic .row--content { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
    .block--content--basic .row--items { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
    .block--content--basic .row--columns { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
    .block--content--basic .row--cta { max-width: 1624px; padding-left: 60px; padding-right: 60px; }
    .block--content--basic .ui.grid.cols--items { gap: 60px; }
}
/* resolution: laptop L - 1440px */
@media only screen and (max-width: 1440px) {
}
/* resolution: ... */
@media only screen and (max-width: 1050px) {
}
/* resolution: laptop */
@media only screen and (max-width: 1024px) {
}
/* resolution: Tablet - 768px */
@media only screen and (max-width: 768px) {
    .block--content--basic .row--vspace--offset { height: 60px; }
    .block--content--basic .ui.grid.cols--items { flex-direction: column; gap: 40px; }
}
/* resolution: ... */
@media only screen and (max-width: 550px) {
}
/* resolution: Mobile L - 425px */
@media only screen and (max-width: 425px) {
    .block--content--basic .row--vspace--offset { height: 40px; }
    .block--content--basic .row--title { padding-left: 20px; padding-right: 20px; }
    .block--content--basic .row--navigate { padding-left: 20px; padding-right: 20px; }
    .block--content--basic .row--content { padding-left: 20px; padding-right: 20px; }
    .block--content--basic .row--items { padding-left: 20px; padding-right: 20px; }
    .block--content--basic .ui.grid.cols--items { flex-direction: column; gap: 20px; }
    .block--content--basic .row--columns { padding-left: 20px; padding-right: 20px; }
    .block--content--basic .row--cards > .ui.cards.x5 .card { width: 100%; }
    .block--content--basic .row--cta button { width: 100%; }
}
/* resolution: Mobile M - 375px */
@media only screen and (max-width: 375px) {
}
/* resolution: Mobile S - 320px */
@media only screen and (max-width: 320px) {
}


/*** component: ui-ecommerce-categories-preview ***/

.ui-ecommerce-categories-preview { }
.ui-ecommerce-categories-preview .body--rows { /*max-width: 1624px; padding-left: 60px; padding-right: 60px;*/ }
.ui-ecommerce-categories-preview .row--vspace--offset { width: 100%; height: 100px; }
.ui-ecommerce-categories-preview .row--vspace--divide { width: 100%; height: 60px; }
.ui-ecommerce-categories-preview .row--vspace--line { width: 100%; height: 20px; }
.ui-ecommerce-categories-preview .row--title { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview .row--title.left.aligned { align-items: flex-start; }
.ui-ecommerce-categories-preview .row--title.centered { align-items: center; }
.ui-ecommerce-categories-preview .row--title.right.aligned { align-items: flex-end; }
.ui-ecommerce-categories-preview .row--navigate { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview .row--content { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview .row--items { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview .row--columns { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview .row--cta { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview .cols--items { }
.ui-ecommerce-categories-preview .ui.grid.cols--items { width: 100%; gap: 60px; }
.ui-ecommerce-categories-preview .ui.grid > .column.col--item { width: auto; flex-grow: 1; flex-shrink: 1; flex-basis: 0%; }

.ui-ecommerce-categories-preview .item--header { }
.ui-ecommerce-categories-preview .item--body { display: flex; flex-direction: column; }
.ui-ecommerce-categories-preview .item--body.centered { justify-content: center; }
.ui-ecommerce-categories-preview .item--body.centered .ui.header { text-align: center; }

.ui-ecommerce-categories-preview .list--items { display: flex; flex-direction: column; gap: 10px; }
.ui-ecommerce-categories-preview .list--item { }

.ui-ecommerce-categories-preview .row--cards > .ui.cards { }
.ui-ecommerce-categories-preview .row--cards > .ui.cards > .card { }
.ui-ecommerce-categories-preview .row--cards > .ui.cards { justify-content: center; width: 100%; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards .card { margin: 0; padding: .875em .5em; background: none; border: none; border-radius: 0; box-shadow: none; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards .card img { border-radius: 0 !important; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards.one > .card { width: 100%; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards.two > .card { width: 50%; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards.three > .card { width: 33.3%; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards.four > .card { width: 25%; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards.five > .card { width: 20%; }
.ui-ecommerce-categories-preview .row--cards > .ui.cards.six > .card { width: calc(100% / 6); }

/* presets */
.ui-ecommerce-categories-preview.layout-preset-none { }
.ui-ecommerce-categories-preview.layout-preset-none .item--image { width: 100%; display: flex; flex-direction: column; align-items: center; }
.ui-ecommerce-categories-preview.layout-preset-none .item--image.image-height-default div.ui.image { height: 200px; align-content: space-evenly; display: block; margin-left: auto; margin-right: auto; }
.ui-ecommerce-categories-preview.layout-preset-none .item--image.image-height-default div.ui.image > img { max-height: 100%; }

.ui-ecommerce-categories-preview.layout-preset-1 { }
.ui-ecommerce-categories-preview.layout-preset-2 { }
.ui-ecommerce-categories-preview.layout-preset-3 { }
.ui-ecommerce-categories-preview.layout-preset-4 { }
.ui-ecommerce-categories-preview.layout-preset-5 { }

/* resolution: 4K - 2560px */
@media only screen and (max-width: 2560px) {
    .ui-ecommerce-categories-preview .body--rows { /*max-width: 1624px; padding-left: 60px; padding-right: 60px;*/ }
    .ui-ecommerce-categories-preview .ui.grid.cols--items { gap: 60px; }
}
/* resolution: laptop L - 1440px */
@media only screen and (max-width: 1440px) {
}
/* resolution: ... */
@media only screen and (max-width: 1050px) {
}
/* resolution: laptop */
@media only screen and (max-width: 1024px) {
}
/* resolution: Tablet - 768px */
@media only screen and (max-width: 768px) {
    .ui-ecommerce-categories-preview .row--vspace--offset { height: 60px; }
    .ui-ecommerce-categories-preview .ui.grid.cols--items { flex-direction: column; gap: 40px; }
}
@media only screen and (min-width: 426px) and (max-width: 768px) {
    /*.ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.five > .card { width: 30%; }*/


    /* items: horizontal scroll */
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards { overflow-x: auto; justify-content: normal; width: 100%; flex-direction: row; flex-wrap: nowrap; }
    .ui-ecommerce-categories-preview.layout-preset-none .item--image { min-width: 200px; max-width: 200px; }

    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.one .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.two .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.three .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.four .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.five .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.six .card { width: auto; }
}
/* resolution: ... */
@media only screen and (max-width: 550px) {
}
/* resolution: Mobile L - 425px */
@media only screen and (max-width: 425px) {
    .ui-ecommerce-categories-preview .body--rows { /*padding-left: 20px; padding-right: 20px;*/ }
    .ui-ecommerce-categories-preview .row--vspace--offset { height: 40px; }
    .ui-ecommerce-categories-preview .ui.grid.cols--items { flex-direction: column; gap: 20px; }

    .ui-ecommerce-categories-preview .row--vspace--divide { height: 40px; }

    /* items: vertical full width */
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.one .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.two .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.three .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.four .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.five .card,
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards.six .card { width: auto; /*width: 100%;*/ }

    /* items: horizontal scroll */
    .ui-ecommerce-categories-preview.layout-preset-none .row--cards > .ui.cards { overflow-x: auto; justify-content: normal; width: 100%; flex-direction: row; flex-wrap: nowrap; }
    .ui-ecommerce-categories-preview.layout-preset-none .item--image { min-width: 160px; max-width: 160px; }

    .ui-ecommerce-categories-preview .row--cta button { width: 100%; }
}
/* resolution: Mobile M - 375px */
@media only screen and (max-width: 375px) {
}
/* resolution: Mobile S - 320px */
@media only screen and (max-width: 320px) {
}


/*** component: ui-ecommerce-brands-preview ***/

.ui-ecommerce-brands-preview { }
.ui-ecommerce-brands-preview .body--rows { /*max-width: 1624px; padding-left: 60px; padding-right: 60px;*/ }
.ui-ecommerce-brands-preview .row--vspace--offset { width: 100%; height: 100px; }
.ui-ecommerce-brands-preview .row--vspace--divide { width: 100%; height: 60px; }
.ui-ecommerce-brands-preview .row--vspace--line { width: 100%; height: 20px; }
.ui-ecommerce-brands-preview .row--title { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview .row--title.left.aligned { align-items: flex-start; }
.ui-ecommerce-brands-preview .row--title.centered { align-items: center; }
.ui-ecommerce-brands-preview .row--title.right.aligned { align-items: flex-end; }
.ui-ecommerce-brands-preview .row--navigate { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview .row--content { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview .row--items { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview .row--columns { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview .row--cta { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview .cols--items { }
.ui-ecommerce-brands-preview .ui.grid.cols--items { width: 100%; gap: 60px; }
.ui-ecommerce-brands-preview .ui.grid > .column.col--item { width: auto; flex-grow: 1; flex-shrink: 1; flex-basis: 0%; }

.ui-ecommerce-brands-preview .item--header { }
.ui-ecommerce-brands-preview .item--body { display: flex; flex-direction: column; }
.ui-ecommerce-brands-preview .item--body.centered { justify-content: center; }
.ui-ecommerce-brands-preview .item--body.centered .ui.header { text-align: center; }

.ui-ecommerce-brands-preview .list--items { display: flex; flex-direction: column; gap: 10px; }
.ui-ecommerce-brands-preview .list--item { }

.ui-ecommerce-brands-preview .row--cards > .ui.cards { }
.ui-ecommerce-brands-preview .row--cards > .ui.cards > .card { }
.ui-ecommerce-brands-preview .row--cards > .ui.cards { justify-content: center; width: 100%; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards .card { margin: 0; padding: .875em .5em; background: none; border: none; border-radius: 0; box-shadow: none; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards .card img { border-radius: 0 !important; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards.one > .card { width: 100%; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards.two > .card { width: 50%; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards.three > .card { width: 33.3%; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards.four > .card { width: 25%; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards.five > .card { width: 20%; }
.ui-ecommerce-brands-preview .row--cards > .ui.cards.six > .card { width: calc(100% / 6); }

/* presets */
.ui-ecommerce-brands-preview.layout-preset-none { }
.ui-ecommerce-brands-preview.layout-preset-none .item--image { width: 100%; display: flex; flex-direction: column; align-items: center; }
.ui-ecommerce-brands-preview.layout-preset-none .item--image.image-height-default div.ui.image { height: 200px; align-content: space-evenly; display: block; margin-left: auto; margin-right: auto; }
.ui-ecommerce-brands-preview.layout-preset-none .item--image.image-height-default div.ui.image > img { max-height: 100%; }

.ui-ecommerce-brands-preview.layout-preset-1 { }
.ui-ecommerce-brands-preview.layout-preset-2 { }
.ui-ecommerce-brands-preview.layout-preset-3 { }
.ui-ecommerce-brands-preview.layout-preset-4 { }
.ui-ecommerce-brands-preview.layout-preset-5 { }


/* resolution: 4K - 2560px */
@media only screen and (max-width: 2560px) {
    .ui-ecommerce-brands-preview .body--rows { /*max-width: 1624px; padding-left: 60px; padding-right: 60px;*/ }
    .ui-ecommerce-brands-preview .ui.grid.cols--items { gap: 60px; }
}
/* resolution: laptop L - 1440px */
@media only screen and (max-width: 1440px) {
}
/* resolution: ... */
@media only screen and (max-width: 1050px) {
}
/* resolution: laptop */
@media only screen and (max-width: 1024px) {
}
/* resolution: Tablet - 768px */
@media only screen and (max-width: 768px) {
    .ui-ecommerce-brands-preview .row--vspace--offset { height: 60px; }
    .ui-ecommerce-brands-preview .ui.grid.cols--items { flex-direction: row; gap: 40px; }
}
@media only screen and (min-width: 426px) and (max-width: 768px) {
    .ui-ecommerce-brands-preview .ui.grid > .column.col--item { width: auto; flex-grow: 1; flex-shrink: 1; flex-basis: calc(50% - 2rem); }
    .ui-ecommerce-brands-preview.default .list--item { text-align: center; }
}
/* resolution: ... */
@media only screen and (max-width: 550px) {
}
/* resolution: Mobile L - 425px */
@media only screen and (max-width: 425px) {
    .ui-ecommerce-brands-preview .body--rows { /*padding-left: 20px; padding-right: 20px;*/ }
    .ui-ecommerce-brands-preview .row--vspace--offset { height: 40px; }
    .ui-ecommerce-brands-preview .ui.grid.cols--items { flex-direction: column; gap: 20px; }
    .ui-ecommerce-brands-preview .row--cards > .ui.cards.one .card,
    .ui-ecommerce-brands-preview .row--cards > .ui.cards.two .card,
    .ui-ecommerce-brands-preview .row--cards > .ui.cards.three .card,
    .ui-ecommerce-brands-preview .row--cards > .ui.cards.four .card,
    .ui-ecommerce-brands-preview .row--cards > .ui.cards.five .card,
    .ui-ecommerce-brands-preview .row--cards > .ui.cards.six .card { width: 100%; }
    .ui-ecommerce-brands-preview .row--cta button { width: 100%; }

    .ui-ecommerce-brands-preview.default .list--item { text-align: center; }
}
/* resolution: Mobile M - 375px */
@media only screen and (max-width: 375px) {
}
/* resolution: Mobile S - 320px */
@media only screen and (max-width: 320px) {
}


/*** component: ui-ecommerce-services-preview ***/

.ui-ecommerce-services-preview { }
.ui-ecommerce-services-preview .body--rows { /*max-width: 1624px; padding-left: 60px; padding-right: 60px;*/ }
.ui-ecommerce-services-preview .row--vspace--offset { width: 100%; height: 100px; }
.ui-ecommerce-services-preview .row--vspace--divide { width: 100%; height: 60px; }
.ui-ecommerce-services-preview .row--vspace--line { width: 100%; height: 20px; }
.ui-ecommerce-services-preview .row--title { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.ui-ecommerce-services-preview .row--title.left.aligned { align-items: flex-start; }
.ui-ecommerce-services-preview .row--title.centered { align-items: center; }
.ui-ecommerce-services-preview .row--title.right.aligned { align-items: flex-end; }
.ui-ecommerce-services-preview .row--navigate { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; }
.ui-ecommerce-services-preview .row--content { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-services-preview .row--items { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-services-preview .row--columns { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-services-preview .row--cta { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; }
.ui-ecommerce-services-preview .cols--items { }
.ui-ecommerce-services-preview .ui.grid.cols--items { width: 100%; gap: 60px; }
.ui-ecommerce-services-preview .ui.grid > .column.col--item { width: auto; flex-grow: 1; flex-shrink: 1; flex-basis: 0%; }

.ui-ecommerce-services-preview .item--header { }
.ui-ecommerce-services-preview .item--body { display: flex; flex-direction: column; }
.ui-ecommerce-services-preview .item--body.centered { justify-content: center; }
.ui-ecommerce-services-preview .item--body.centered .ui.header { text-align: center; }
.ui-ecommerce-services-preview .item--cta {  }
.ui-ecommerce-services-preview .item--vspace--offset { width: 100%; height: 100px; }
.ui-ecommerce-services-preview .item--vspace--divide { width: 100%; height: 60px; }
.ui-ecommerce-services-preview .item--vspace--line { width: 100%; height: 20px; }

.ui-ecommerce-services-preview .main--item { display: flex; flex-direction: column; gap: 10px; }

.ui-ecommerce-services-preview .list--items { display: flex; flex-direction: column; gap: 10px; }
.ui-ecommerce-services-preview .list--item { }

.ui-ecommerce-services-preview .row--cards > .ui.cards { }
.ui-ecommerce-services-preview .row--cards > .ui.cards > .card { }
.ui-ecommerce-services-preview .row--cards > .ui.cards { justify-content: center; width: 100%; }
.ui-ecommerce-services-preview .row--cards > .ui.cards .card { margin: 0; padding: .875em .5em; background: none; border: none; border-radius: 0; box-shadow: none; }
.ui-ecommerce-services-preview .row--cards > .ui.cards .card img { border-radius: 0 !important; }
.ui-ecommerce-services-preview .row--cards > .ui.cards.one > .card { width: 100%; }
.ui-ecommerce-services-preview .row--cards > .ui.cards.two > .card { width: 50%; }
.ui-ecommerce-services-preview .row--cards > .ui.cards.three > .card { width: 33.3%; }
.ui-ecommerce-services-preview .row--cards > .ui.cards.four > .card { width: 25%; }
.ui-ecommerce-services-preview .row--cards > .ui.cards.five > .card { width: 20%; }
.ui-ecommerce-services-preview .row--cards > .ui.cards.six > .card { width: calc(100% / 6); }

/* presets */
.ui-ecommerce-services-preview.layout-preset-none { }
.ui-ecommerce-services-preview.layout-preset-1 { }
.ui-ecommerce-services-preview.layout-preset-2 { }
.ui-ecommerce-services-preview.layout-preset-3 { }
.ui-ecommerce-services-preview.layout-preset-4 { }
.ui-ecommerce-services-preview.layout-preset-5 { }

/* preset 1: highlight primary/first item */
.ui-ecommerce-services-preview.layout-preset-1 .list--items { gap:3rem; }
.ui-ecommerce-services-preview.layout-preset-1 .row--columns { max-width: 1127px; }

/* resolution: 4K - 2560px */
@media only screen and (max-width: 2560px) {
    .ui-ecommerce-services-preview .body--rows { /*max-width: 1624px; padding-left: 60px; padding-right: 60px;*/ }
    .ui-ecommerce-services-preview .ui.grid.cols--items { gap: 60px; }
}
/* resolution: laptop L - 1440px */
@media only screen and (max-width: 1440px) {
}
/* resolution: ... */
@media only screen and (max-width: 1050px) {
}
/* resolution: laptop */
@media only screen and (max-width: 1024px) {
}
/* resolution: Tablet - 768px */
@media only screen and (max-width: 768px) {
    .ui-ecommerce-services-preview .row--vspace--offset { height: 60px; }
    .ui-ecommerce-services-preview .ui.grid.cols--items { flex-direction: column; gap: 40px; }

    /* preset 1: highlight primary/first item */
    .ui-ecommerce-services-preview.layout-preset-1 .main--item .button { width:100%; }
}
/* resolution: ... */
@media only screen and (max-width: 550px) {
}
/* resolution: Mobile L - 425px */
@media only screen and (max-width: 425px) {
    .ui-ecommerce-services-preview .body--rows { /*padding-left: 20px; padding-right: 20px;*/ }
    .ui-ecommerce-services-preview .row--vspace--offset { height: 40px; }
    .ui-ecommerce-services-preview .ui.grid.cols--items { flex-direction: column; gap: 20px; }
    .ui-ecommerce-services-preview .row--cards > .ui.cards.one .card,
    .ui-ecommerce-services-preview .row--cards > .ui.cards.two .card,
    .ui-ecommerce-services-preview .row--cards > .ui.cards.three .card,
    .ui-ecommerce-services-preview .row--cards > .ui.cards.four .card,
    .ui-ecommerce-services-preview .row--cards > .ui.cards.five .card,
    .ui-ecommerce-services-preview .row--cards > .ui.cards.six .card { width: 100%; }
    .ui-ecommerce-services-preview .row--cta button { width: 100%; }
}
/* resolution: Mobile M - 375px */
@media only screen and (max-width: 375px) {
}
/* resolution: Mobile S - 320px */
@media only screen and (max-width: 320px) {
}



/*** component: ui-article-section ***/

.ui-article-section { }

/* preset none */
.ui-article-section .section-item.layout-preset-none { }

/* preset 1: Section with image left. */
.ui-article-section .section-item.layout-preset-1 { }

/* preset 2: Section with Image right. */
.ui-article-section .section-item.layout-preset-2 { }

/* preset 3: */
.ui-article-section .section-item.layout-preset-3 { }

/* preset 4: */
.ui-article-section .section-item.layout-preset-4 { }

/* preset 5: */
.ui-article-section .section-item.layout-preset-5 { }


/* resolution: Mobile L - 425px */
@media only screen and (max-width: 425px) {

    /* preset 1: Section with image left. */
    .ui-article-section .section-item.layout-preset-1 > .ui.grid > .column { padding-left: 0; padding-right:0; }

    /* preset 2: Section with Image right. */
    .ui-article-section .section-item.layout-preset-2 > .ui.grid > .column { padding-left: 0; padding-right: 0; }
    .ui-article-section .section-item.layout-preset-2 .column-item-image { order: 1; }
    .ui-article-section .section-item.layout-preset-2 .column-item-content { order: 2; }
}


/*** component: image ***/

/* defaults */
.ui.image.background { background-repeat:no-repeat; }




/*** component: product configurator ***/

.ui-product-configurator { }
.ui-product-configurator > .ui.grid { }
.ui-product-configurator > .ui.grid > .column { flex-grow: 1; }
.ui-product-configurator > .ui.grid > .column.col--steps { max-width: 280px; max-width: min-content; }



/*** component: ui-ecommerce-payment-methods-preview ***/

.ui-ecommerce-payment-methods-preview { }
.ui-ecommerce-payment-methods-preview .row { }
.ui-ecommerce-payment-methods-preview .row.horizontal { display: flex; flex-direction: row; justify-content: center; gap: 1em; align-items: center; padding-top: 1em;padding-bottom: 1em; }
.ui-ecommerce-payment-methods-preview .row .label { }
.ui-ecommerce-payment-methods-preview .row .ui.image { height: 40px; }


/*** component: ui-site-header ***/

.ui-site-header { }
.ui-site-header.variant-responsive { }
.ui-site-header.layout-profile-default { }

.ui-site-header.variant-responsive > .row { display:flex; flex-direction:row; gap:5px; }
.ui-site-header.variant-responsive > .row > .hspace { flex-grow: 1; }
.ui-site-header.variant-responsive > .row > .item { display: flex; flex-direction: column; justify-content: center; }
.ui-site-header.variant-responsive > .row--main { }
.ui-site-header.variant-responsive > .row--main > .item { max-width: 100px; max-height: 80px; padding-left: 5px; padding-right: 5px; }
.ui-site-header.variant-responsive > .row--search { }
.ui-site-header.variant-responsive > .row--search > .item { width:100%; padding: 5px; }


/*** component: ui-site-toc-toggle ***/

.ui-site-toc-toggle { }


/*** component: ui-site-toc-menu ***/

.ui-site-toc-menu { }
.ui-site-toc-menu .toc-menu-header { position: relative; padding: 1em; min-height: 3.5em; }
.ui-site-toc-menu .toc-menu-close { position: absolute; top: 0.5em; right: 0.5em; font-size: 20px; color: inherit; }