@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Electrolize&family=Inter:wght@300;400;500;600;700;800&display=swap');

*,
h1,
h2,
h3,
h4,
h5,
h6,
a {
    margin: 0;
    padding: 0;
    text-decoration: none;
}

sup {
    vertical-align: super;
    font-size: 12px;
}

h1 sup {
    vertical-align: super;
    font-size: 32px;
}

h2 sup {
    vertical-align: super;
    font-size: 28px;
}

h3 sup {
    vertical-align: super;
    font-size: 26px;
}

h4 sup {
    vertical-align: super;
    font-size: 24px;
}

h5 sup {
    vertical-align: super;
    font-size: 20px;
}

*,
::after,
::before {
    box-sizing: border-box
}

:root {
    --padding-horizontal: 32px;
}

:root {
    --accent-color: #54af3a !important;
    --webshop-accent: #54af3a !important;
}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialicons/v118/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2) format('woff2');
}



icon {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    cursor: default;
}



body {
    margin: 0;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    width: 100%;
    display: block;
    position: relative;
}

html {
    background: #000000;
}



input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

textarea {
    resize: none;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 14px;
    font-weight: 400;
    line-height: 1.25;
}

a,
lnk {
    margin: 0;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    color: var(--accent-color);
    text-decoration: none;
    cursor: pointer;
}

a:active,
lnk:active {
    opacity: .6;
    text-decoration: none;
}

select {
    display: block;
    height: 40px;
    padding: .375rem 42px .375rem .75rem;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    color: #222222;
    background-color: #f9f9f9;
    background-clip: padding-box;
    border: 1px solid #cecece;
    border-radius: 6px;
    transition: border-color .1s, box-shadow .1s;

    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: url(/images/sc-select-arrow.png) !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
}

select:focus {
    box-shadow: 0px 0px 8px var(--accent-color);
    outline: unset;
}

.m-b-10 {
    margin-bottom: 10px !important;
}

.m-b-20 {
    margin-bottom: 20px !important;
}

.m-b-30 {
    margin-bottom: 30px !important;
}

.m-b-40 {
    margin-bottom: 40px !important;
}

.m-b-50 {
    margin-bottom: 50px !important;
}

.m-b-60 {
    margin-bottom: 60px !important;
}

.title {
    margin-bottom: 20px;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: "Inter", sans-serif;
    margin: 0;
    letter-spacing: 0.4px;
    line-height: 1.18;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: .5rem
}

h6 {
    font-size: 22px;
    font-weight: 600;
}

h5 {
    font-size: 24px;
}

h4 {
    font-size: 30px;
    font-weight: 600;
}

.sc-app h4 {
    font-weight: 700;
}

h3 {
    font-size: 32px;
    font-weight: 600;
}

h2 {
    font-weight: 800;
    font-size: 40px;
}

h1 {
    font-weight: 700;
    font-size: 48px;
}

p {
    margin-top: 0;
    margin-bottom: .5rem;
    font-size: 16px;
}




@media(max-width: 900px) {
    h6 {
        font-size: 16px;
        font-weight: 600;
    }

    h5 {
        font-size: 18px;
    }

    h4 {
        font-size: 20px;
        font-weight: 600;
    }

    .sc-app h4 {
        font-weight: 700;
    }

    h3 {
        font-size: 22px;
        font-weight: 600;
    }

    h2 {
        font-weight: 800;
        font-size: 28px;
    }

    h1 {
        font-weight: 700;
        font-size: 30px;
    }

    p {
        margin-top: 0;
        margin-bottom: .5rem;
        font-size: 14px;
        cursor: default;
    }

}

button,
a.button {
    position: relative;
    display: inline-block;
    padding: 16px 20px;
    background: transparent;
    outline: none;
    border: 5px solid var(--accent-color);
    font-family: "Inter", sans-serif;
    color: #ffffff;
    font-size: 16px;
    font-size: 600;
    transition: background .12s linear, transform .2s cubic-bezier(0.215, 0.610, 0.355, 1), box-shadow .2s cubic-bezier(0.215, 0.610, 0.355, 1);
    box-shadow: 0px 4px 10px rgba(0, 0, 0, .2);
    line-height: 1.2;
    cursor: pointer;
}




hero.bg-green button,
hero.bg-green a,
section.bg-green button,
section.bg-green a {
    color: #ffffff;
}

section.bg-green cardwrap button,
section.bg-green cardwrap a {
    color: #317729;
}

hero.bg-green button.icon,
hero.bg-green a.icon,
section.bg-green button.icon,
section.bg-green a.button {
    background: #f0f0f0;
    color: #317729;
    margin: 0 0 32px 0;
}

button.icon,
a.button.icon {
    color: #317729;
    padding: 10px 32px;
    display: inline-flex;
    align-items: center;
}

a.button.icon > icon {
    font-size: 20px;
    margin: 0 8px 0 0;
}

button.outline,
a.button.outline {
    background: transparent;
    border: 2px solid var(--accent-color);
}

button.transparent-dark,
a.button.transparent-dark {
    background: rgba(0, 0, 0, .5);
    border: 2px solid var(--accent-color);
}

button.transparent-light,
a.button.transparent-light {
    background: rgba(255, 255, 255, .2);
    border: 2px solid var(--accent-color);
}

button:hover,
a.button:hover {
    background: var(--accent-color);
    transform: scale(1.04);
    box-shadow: 0px 8px 14px rgba(0, 0, 0, .1);
}

button:active,
a.button:active {
    opacity: .9;
    background: var(--accent-color);
    transform: scale(.98);
    box-shadow: 0px 1px 4px rgba(0, 0, 0, .1);
}

a.bg-red {
    border-color: #ad0600;
}

a.bg-red:hover {
    background: #ad0600;
}

a.bg-red:active {
    background: #ad0600;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    color: #ffffff;
}

body p,
deftxt,
.listEntry i,
.listEntry p {
    color: #999999;
}

.sc-hdr .cont .txt p,
toptitle {
    color: #0a0a0a;
}

.card .tile,
.card.bg {
    background-color: #f8f8f8;
    border: 1px solid #ececec;
}



footer {
    position: relative;
    width: 100%;
    display: block;
    background: #000000;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    border-top: 1px solid #111111;
}

footer > p {
    position: relative;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    border-top: 1px solid #111111;
    font-size: 14px;
    color: #666666;
    padding: 32px 22px;
}

footer > p > a {
    color: #777777;
    font-size: 14px;
}

footer > content {
    position: relative;
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
    padding: 32px 22px;
}

footer > content > info {
    position: relative;
    display: block;
    flex: 1 1 100%;
}

footer > content > info > h6 {
    color: var(--accent-color);
}

footer > content > links {
    position: relative;
    display: flex;
    flex: 1 1;
}

footer > content > links > div {
    position: relative;
    display: block;
    flex: 1 1;
}

footer > content > links > div:not(:last-of-type) {
    margin: 0 16px 0;
}

footer > content > links > div > a {
    position: relative;
    display: block;
    width: 100%;
    white-space: nowrap;
    padding: 4px 0;
}


footer > content h6 {
    position: relative;
    display: block;
    text-transform: uppercase;
    font-size: 16px;
    color: #ffffff;
}

footer > content p {
    font-size: 14px;
    color: #777777;
}


@media(max-width: 700px) {
    footer {
        position: relative;
        width: 100%;
        display: block;
    }

    footer > p {
        position: relative;
        width: 100%;
        max-width: 1400px;
        margin: 0 auto;
        text-align: center;
        padding: 32px 0;
        font-size: 14px;
    }

    footer > p > a {
        font-size: 14px;
    }

    footer > content {
        position: relative;
        display: block;
        max-width: 1400px;
        margin: 0 auto;
        padding: 32px 22px;
    }

    footer > content > info {
        position: relative;
        display: block;
        flex: 1 1 100%;
        margin: 0 0 22px 0;
    }

    footer > content > links {
        position: relative;
        display: block;
        flex: 1 1;
    }

    footer > content > links > div {
        position: relative;
        display: block;
        flex: 1 1;
    }

    footer > content > links > div:not(:last-of-type) {
        margin: 0 0 22px 0;
    }

    footer > content > links > div > a {
        position: relative;
        display: block;
        width: 100%;
        white-space: nowrap;
        padding: 4px 0;
    }


    footer > content h6 {
        position: relative;
        display: block;
        text-transform: uppercase;
        font-size: 16px;
    }

    footer > content p {
        font-size: 14px;
    }
}


code {
    position: relative;
    font-family: 'Source Code Pro', monospace;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
    color: #0a0a0a;
    font-size: 14px;
    max-width: 100%;
    -moz-user-select: unset;
    -webkit-user-select: unset;
    user-select: unset;
    -webkit-tap-highlight-color: unset;
}

code::-moz-selection {
    color: var(--accent-color);
    background: rgba(0, 0, 0, .1);
}

code::selection {
    color: var(--accent-color);
    background: rgba(0, 0, 0, .1);
}

@media(prefers-color-scheme:dark) {
    code {
        position: relative;
        font-family: 'Source Code Pro', monospace;
        white-space: normal;
        color: #f0f0f0;
    }

    code::-moz-selection {
        background: rgba(255, 255, 255, .1);
    }

    code::selection {
        background: rgba(255, 255, 255, .1);
    }
}



input:not(.no-style),
textarea:not(.no-style) {
    color: #090909;
}

label {
    display: inline-block;
    color: #090909;
    margin-bottom: 6px;
}

input:not([type="checkbox"]):not([type="radio"]):not(.no-style),
textarea {
    background-color: #f8f8f8;
    border: 1.4px solid #e0e0e0;
    z-index: 1;
}

input:not([type="checkbox"]):not([type="radio"]):not(.no-style),
textarea {
    display: block;
    width: calc(100% - 2px);
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    background-color: transparent;
    transition: border-color .2s ease-in-out;
    outline: none;
    border-radius: 6px;
}

input:not([type="checkbox"]):not([type="radio"]):not(.no-style) {
    height: 38px;
}




body > menu {
    position: sticky;
    left: 0;
    top: 0;
    width: 100%;
    height: 100px;
    display: block;
    z-index: 500;
    background-color: #0a0a0aee;
    -webkit-backdrop-filter: blur(12px) saturate(150%);
    backdrop-filter: blur(12px) saturate(150%);
    padding: 0 32px;
}

body > menu > content,
body > menu > content > content {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
    align-items: center;
    justify-content: space-between;
}

body > menu > content > content > div {
    flex-shrink: 0;
}

body > menu > content > logo,
body > menu > content > pad {
    position: relative;
    display: block;
    flex: 0 0 161px;
}

body > menu > content > logo > a {
    position: relative;
    display: block;
    font-size: 38px;
    height: 42px;
    color: var(--accent-color);
}

body > menu > content > logo > a > svg {
    position: relative;
    height: 100%;
    width: auto;
    fill: #ffffff;
}

body > menu > content > content > items {
    position: relative;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}

body > menu > content > content > items > a:not(:last-child) {
    margin: 0 16px 0 0;
}

body > menu > content > mobilemenu {
    display: none;
}

body > menu > content > mobilemenu > icon {
    position: relative;
    color: #ffffff;
}


@media(max-width:1060px) {
    body > menu {
        height: 64px;
        transition: height .4s cubic-bezier(0.215, 0.610, 0.355, 1);
    }

    body > menu > content > pad {
        display: none;
    }

    body > menu > content > logo {
        height: 64px;
        display: flex;
        align-items: center;
        flex: 1 1;
    }

    body > menu > content > content {
        position: absolute;
        left: 0;
        top: 0;
        pointer-events: none;
        display: block;
        flex: 0 0 100%;
        padding: 100px 0 0 0;
    }

    body > menu.ex > content > content {
        pointer-events: all;
    }

    body > menu > content {
        display: block;
        flex-wrap: wrap;
        overflow: hidden;
    }

    body > menu.ex {
        height: 100vh;
    }

    body > menu > content > mobilemenu {
        position: absolute;
        right: 0;
        top: 0;
        height: 64px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
        flex: 1 1;
    }

    body > menu > content > content > items {
        display: block;
        margin: 0 0 32px 0;
    }

    body > menu > content > content > items > a {
        position: relative;
        display: block;
        width: 100%;
        font-size: 24px;
        padding: 8px 0;
    }

    body > menu > content > content > div {
        position: relative;
        width: 100%;
    }
}



#servconnectstore-cart-widget,
menu accountwidget {
    position: relative;
    display: inline-block;
    border-radius: 50000px;
    margin: 0 0 0 12px;
    cursor: pointer;
    overflow: hidden;
    z-index: 2;
}

menu accountwidget {
    width: 48px;
    flex: 0 0 48px;
    height: 48px;
}

#servconnectstore-cart-widget:active,
menu accountwidget:active {
    opacity: .9;
}

#servconnectstore-cart-widget > content,
menu accountwidget > a {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 10px 10px 10px 18px;
    border-radius: 50000px;
    background: #111111;
    cursor: pointer;
    z-index: 1;
}

menu accountwidget > a {
    width: 48px;
    flex: 0 0 48px;
    height: 48px;
    padding: 10px;
}

#servconnectstore-cart-widget > content::after,
menu accountwidget > a::after {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 28px;
    height: 28px;
    border-radius: 50000px;
    overflow: hidden;
    background: var(--accent-color);
    transform: scale(.99);
    transition: transform .2s cubic-bezier(0.215, 0.610, 0.355, 1);
    content: '';
    z-index: 0;
}

menu accountwidget > a::after {
    transition: transform .4s cubic-bezier(0.215, 0.610, 0.355, 1);
    transform: scale(0);
}

#servconnectstore-cart-widget:hover > content::after,
menu accountwidget:hover > a::after {
    transform: scale(5);
}

#servconnectstore-cart-widget > content > icon,
menu accountwidget > a > icon {
    position: relative;
    color: #ffffff;
    margin: 0 10px 0 0;
    cursor: pointer;
    z-index: 1;
    width: 100%;
    display: block;
}

menu accountwidget > a > icon {
    margin: 0;
    text-align: center;
}

#servconnectstore-cart-widget > content > icon,
menu accountwidget > a > icon {
    font-size: 18px;
}

#servconnectstore-cart-widget > content > #servconnectstore-cart-widget-count {
    position: relative;
    background: var(--accent-color);
    border-radius: 50%;
    padding: 6px 9px;
    display: block;
    margin: 0;
    line-height: 1;
    color: #ffffff;
    text-align: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    cursor: pointer;
    z-index: 2;
}

#servconnectstore-cart-widget > content > #servconnectstore-cart-widget-count::after {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 50000px;
    overflow: hidden;
    background: #00000044;
    transform: scale(0);
    transition: transform .2s cubic-bezier(0.215, 0.610, 0.355, 1);
    content: '';
    z-index: -1;
}

#servconnectstore-cart-widget:hover > content > #servconnectstore-cart-widget-count::after {
    transform: scale(1);
}




/* Main content wrap */

body > content {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    z-index: 5;
    transition: transform .25s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    overflow: hidden;
}

@media(max-width: 900px) {
    body > content {
        padding: 0;
    }
}


body > content > hero {
    position: relative;
    width: 100%;
    display: block;
    padding: 200px 32px;
    background: linear-gradient(0deg, #111111, #000000);
    height: auto;
}

body > content > hero.bg-green {
    background: var(--accent-color);
}


body > content > hero > imagewrap {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 60%;
    display: block;
    overflow: hidden;
}

body > content > hero > imagewrap > img {
    position: relative;
    height: 100%;
    width: 100%;
    object-position: left center;
    object-fit: cover;
}

body > content > hero > imagewrap::after {
    position: absolute;
    left: -25px;
    top: 0;
    width: 50px;
    height: 100%;
    content: '';
    transform: rotate(-2deg);
    background: #f0f0f0;
}


body > content > hero > content {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
    align-items: center;
}

body > content > hero > content > textwrap {
    position: relative;
    display: block;
    width: 30%;
    padding: 0 0 0 0;
}

body > content > hero > content > textwrap > p:first-of-type:not(:last-of-type) {
    position: relative;
    width: 100%;
    display: block;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
    opacity: .75;
}


body > content > hero > content > textwrap > h2 {
    position: relative;
    width: 100%;
    font-size: 62px;
    color: var(--accent-color);
    font-family: "Electrolize", serif;
}

@media(max-width: 800px) {
    body > content > hero > content > textwrap > h2 {
        font-size: 40px;
    }
}

@media(max-width: 600px) {
    body > content > hero > content > textwrap > h2 {
        font-size: 30px;
    }
}

body > content > hero.bg-green > content > textwrap > h2 {
    color: #ffffff;
}

body > content > hero.bg-green > content > textwrap > p {
    color: #ffffff;
    opacity: .8;
}

body > content > hero > content > textwrap > a {
    position: relative;
    display: inline-block;
    margin: 32px 0 0 0;
}



@media(max-width: 900px) {
    body > content > hero {
        padding: 0;
        height: auto;
        padding-top: 150px;
        padding-bottom: 120px;
    }

    body > content > hero > imagewrap::after {
        position: absolute;
        left: -5%;
        top: unset;
        bottom: -25px;
        width: 110%;
        height: 100px;
        content: '';
        transform: rotate(2deg);
        background: #f0f0f0;
    }

    body > content > hero > imagewrap {
        position: relative;
        width: 100%;
        height: 400px;
    }

    body > content > hero > content {
        padding: 0 32px;
    }

    body > content > hero > content,
    body > content > hero > content > textwrap {
        height: auto;
        width: 100%;
    }
}


/*
body > content > hero-nekton {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    background: #ffffff;
    height: 60vh;
    max-height: 600px;
    padding: 0 0 42px 0;
}

@media(max-width: 800px) {
    body > content > hero-nekton {
        max-height: 400px;
    }
}

body > content > hero-nekton > img {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    margin: 0;
    object-position: center center;
    object-fit: cover;
}

*/

body > content > hero-nekton {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    background: linear-gradient(to right, var(--accent-color) 0%, #286122 100%);
    height: 60vh;
    max-height: 700px;
    overflow: hidden;
    padding: 0 42px;
}


body > content > hero-nekton > content {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

body > content > hero-nekton > content > textwrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    flex: 0 0 50%;
}

body > content > hero-nekton > content > textwrap > img {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    max-width: 300px;
    padding-bottom: 64px;
    -webkit-filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .5));
    filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .5));
}


body > content > hero-nekton > content > productlines {
    position: relative;
    flex: 1 1 50%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    transform: rotate(4deg);
    -webkit-filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, .25));
    filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, .25));
}

body > content > hero-nekton > content > productlines > line {
    position: relative;
    flex: 0 0 40%;
    max-width: 500px;
    display: block;
}

body > content > hero-nekton > content > productlines > line > content {
    position: relative;
    display: block;
    width: 100%;
}

body > content > hero-nekton > content > productlines > line > content > img {
    position: relative;
    display: block;
    width: calc(100% + 40px);
    height: auto;
}

body > content > hero-nekton > content > productlines > line > content > img:last-child {
    margin: 42px 0 0 0;
}

body > content > hero-nekton > content > productlines > line:first-of-type > content {
    animation: slideNektonProdA 70s linear infinite reverse;
}

body > content > hero-nekton > content > productlines > line:last-of-type > content {
    animation: slideNektonProdB 45s linear infinite reverse;
}

@keyframes slideNektonProdA {
    from {
        transform: translate3d(0, -50%, 0);
    }

    to {
        transform: translate3d(0, 0%, 0);
    }
}

@keyframes slideNektonProdB {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(0, -50%, 0);
    }
}







body > content > hero-kress {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    background: #000000;
    height: 60vh;
    max-height: 700px;
    padding: 0 0 42px 0;
    overflow: hidden;
}

body > content > hero-kress > video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    opacity: 0;
    animation: animateInKressHeroVideo .4s cubic-bezier(0.215, 0.610, 0.355, 1) .7s forwards;
}

@keyframes animateInKressHeroVideo {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


body > content > hero-kress > content {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #000000 0%, #00000000 100%);
}

body > content > hero-kress > content > textwrap {
    position: relative;
    display: block;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    flex: 0 0 100%;
    padding: 0 42px;
}

body > content > hero-kress > content > textwrap h6 {
    position: relative;
    margin: 12px 0 0 0;
    color: #ffffff;
}

body > content > hero-kress > content > textwrap > img {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    max-width: 300px;
    padding-top: 64px;
}



servconnectstore-product-details > servconnectstore-gallery > content > thumbs {
    display: none;
}




/* Main content wrap */

section {
    position: relative;
    width: 100%;
    display: block;
    padding: 0 32px;
}



section.bg-grey {
    background: #f7f7f7;
}



section > content {
    position: relative;
    width: 100%;
    padding: 82px 0 202px;
    max-width: 1400px;
    display: block;
    margin: 0 auto;
}

@media(max-width: 800px) {
    section > content {
        padding: 32px 0 202px;
    }
}



section > content > titlewrap {
    position: relative;
    width: 100%;
    display: block;
}

section > content > titlewrap:not(:last-child) {
    margin: 0 0 42px 0;
}

section > content > titlewrap h1,
section > content > titlewrap h2,
section > content > titlewrap h3,
section > content > titlewrap h4,
section > content > titlewrap h5,
section > content > titlewrap h6 {
    position: relative;
    width: 100%;
    display: block;
    color: var(--accent-color);
}






/* nekton section */

section.bg-green::before {
    background: var(--accent-color);
}

section.bg-green {
    background: var(--accent-color);
}

section.bg-green > content > titlewrap h1,
section.bg-green > content > titlewrap h2,
section.bg-green > content > titlewrap h3,
section.bg-green > content > titlewrap h4,
section.bg-green > content > titlewrap h5,
section.bg-green > content > titlewrap h6 {
    color: #ffffff;
}

section.bg-green > content > titlewrap p {
    color: #ffffff;
    opacity: .8;
}

section.bg-green > content p {
    color: #ffffff;
    opacity: .8;
}






/* store */

store {
    position: relative;
    width: 100%;
    display: block;
}

store > products {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 22px;
}

store > products > entry {
    position: relative;
    width: 100%;
    height: 100%;
    background: #f0f0f0;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
}

store > products > entry > imagewrap {
    position: relative;
    width: 100%;
    display: block;
    height: 200px;
    overflow: hidden;
}

store > products > entry > imagewrap > img {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
    margin: 0;
}

store > products > entry > content {
    position: relative;
    display: block;
    width: 100%;
    padding: 32px;
}

store > products > entry > content > p {
    position: relative;
    width: 100%;
    margin: 0 0 22px 0;
    cursor: pointer;
}

store > products > entry > content > a {
    position: relative;
    display: block;
    width: 100%;
    text-align: center;
    cursor: pointer;
}





products {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
    gap: 16px;
}

products > entry {
    position: relative;
    display: block;
    padding: 0;
    overflow: hidden;
}


products > entry > a {
    position: relative;
    width: 100%;
    min-height: 100%;
    display: block;
    background: #f0f0f0;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #dedede;
}


products > entry > a:active {
    opacity: .9;
}


/* ribbon */


products > entry > a imgwrap {
    position: relative;
    width: 100%;
    display: block;
    overflow: hidden;
    height: 270px;
    background: #f9f9f9;
    z-index: 2;
}

products > entry > a imgwrap > img {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    margin: 0;
    object-fit: contain;
    object-position: center center;
}

products > entry > a imgwrap > ribbonwrap {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    display: block;
    z-index: 1;
}

products > entry > a imgwrap > ribbonwrap ribbon {
    position: relative;
    width: 100%;
    display: block;
    background: linear-gradient(to right, var(--accent-color) 0%, #317729 100%);
    padding: 8px 0;
}

products > entry > a imgwrap > ribbonwrap ribbon > p {
    position: relative;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin: 0;
    font-weight: 500;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
}


products > entry > a > ribbon {
    position: relative;
    width: 100%;
    display: block;
    background: linear-gradient(to right, var(--accent-color) 0%, #317729 100%);
    padding: 8px 0;
}

products > entry > a > ribbon > p {
    position: relative;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin: 0;
    font-weight: 500;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
}




products > entry > a textwrap {
    position: relative;
    display: block;
    width: 100%;
    padding: 32px;
}


products > entry > a textwrap > h1,
products > entry > a textwrap > h2,
products > entry > a textwrap > h3,
products > entry > a textwrap > h4,
products > entry > a textwrap > h5,
products > entry > a textwrap > h6,
products > entry > a textwrap > p {
    cursor: pointer;
}

products > entry > a textwrap > h6 {
    position: relative;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 12px;
    font-size: 20px;
    cursor: pointer;
}

products > entry > a textwrap > p:first-of-type {
    position: relative;
    margin: 0;
    color: #888888;
    margin: 0 0 4px 0;
}

products > entry > a textwrap > p:not(:first-of-type):not(:last-of-type) {
    position: relative;
    color: #444444;
}

products > entry > a textwrap > p:last-of-type {
    position: relative;
    width: 100%;
    color: var(--accent-color);
    margin: 22px 0 0 0;
}



@media(max-width: 1400px) {
    products {
        grid-template-columns: 1fr 1fr;
    }

    products > entry > a > imgwrap {
        height: 270px;
    }

}

@media(max-width: 900px) {
    products > entry > a > imgwrap {
        height: 200px;
    }

    products > entry > a textwrap {
        padding: 24px;
    }
}

@media(max-width: 600px) {
    products {
        grid-template-columns: 1fr;
    }

    products > entry > a textwrap {
        padding: 24px;
    }
}

@media(max-width: 400px) {
    products > entry > a > imgwrap {
        height: 150px;
    }

    products > entry > a textwrap {
        padding: 20px 18px;
    }
}





cardwrap {
    position: relative;
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 24px;
}

cardwrap:not(:last-child),
card:not(:last-child) {
    margin: 0 0 24px 0;
}

@media(max-width: 1400px) {
    cardwrap {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media(max-width: 1000px) {
    cardwrap {
        grid-template-columns: 1fr 1fr;
    }
}

@media(max-width: 800px) {
    cardwrap {
        grid-template-columns: 1fr;
    }
}


cardwrap > entry,
card {
    position: relative;
    display: block;
    width: 100%;
    flex: 0 0 33.333%;
    border-radius: 16px;
    border: 2px solid transparent;
    background: linear-gradient(to top, #080808, #121212) padding-box, linear-gradient(to top, #0a0a0a, #222222) border-box;
    overflow: hidden;
}

cardwrap > entry::before,
card::before {
    position: absolute;
    left: 0;
    top: -100px;
    width: 100%;
    height: 250px;
    display: block;
    content: '';
    background: radial-gradient(ellipse at top, rgba(255, 255, 255, .05) 0%, transparent 65%);

}


section.bg-grey cardwrap > entry,
section.bg-grey card,
section.bg-green cardwrap > entry,
section.bg-green card {
    background: #ffffff;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, .2);
}


cardwrap > entry > content,
card > content {
    position: relative;
    display: block;
    padding: 32px;
}

cardwrap > entry > content > textwrap,
card > content > textwrap {
    position: relative;
    display: block;
    width: 100%;
}

card > content > textwrap:not(:last-child) {
    margin: 0 0 24px 0;
}

cardwrap > entry > content > textwrap > p,
section.bg-green card > content > textwrap > p,
card > content > textwrap > p {
    margin: 0;
    color: #666666;
}

cardwrap > entry.contact > content > icon {
    position: relative;
    width: 100%;
    text-align: center;
    color: var(--accent-color);
    font-size: 50px;
    margin: 0 0 20px 0;
}

cardwrap > entry.contact > content > textwrap > h6 {
    position: relative;
    display: block;
    width: 100%;
    text-align: center;
}

cardwrap > entry.contact > content > textwrap > *:not(:last-child) {
    margin: 0 0 8px 0;
}

cardwrap > entry.contact > content > textwrap > a {
    position: relative;
    display: block;
    width: 100%;
    text-align: center;
}

cardwrap > entry.contact > content > textwrap > p {
    position: relative;
    display: block;
    width: 100%;
    text-align: center;
    color: var(--accent-color);
}

cardwrap > entry.contact > content > textwrap > p.closed {
    color: #c92c2c;
}




paymentmethods {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

paymentmethods > img {
    position: relative;
    display: block;
    width: 64px;
    height: auto;
    flex: 0 0 20px;
}

paymentmethods > img:not(:last-child) {
    margin: 0 12px 0 0;
}








.home-brand.nekton {
    position: relative;
    background: linear-gradient(to top, var(--accent-color) 0%, #286122 40%);
    z-index: 4;
}

.home-brand.nekton::before {
    background: #286122;
}


.home-brand > content > titlewrap {
    position: relative;
    width: 100%;
    text-align: center;
}

.home-brand > content > titlewrap > img {
    position: relative;
    width: 100%;
    max-width: 400px;
    height: auto;
    margin: 0 auto;
    display: block;
    color: #ffffff;
    text-align: center;
}

.home-brand > content > titlewrap > h5 {
    position: relative;
    width: 100%;
    display: block;
    color: #ffffff;
    text-align: center;
    margin: 32px 0;
    font-family: "Inter", sans-serif;
}

.home-brand > content > titlewrap > a {
    position: relative;
    background: #ffffff;
    color: #317729;
}


.home-brand.nekton > content > imagewrap {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}


.home-brand.nekton > content > imagewrap > img {
    position: relative;
    width: 100%;
    height: auto;
}





.home-brand.kress {
    position: relative;
    background: #000000;
    height: 90vh;
}

.home-brand.kress > content > titlewrap > a {
    position: relative;
    color: #a81414;
}

.home-brand.kress::before {
    background: #000000;
}

.home-brand.kress > video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
}


.home-brand.kress > overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, #000000 0%, #00000000 100%);
}




.home-brand.kress-rtkn {
    position: relative;
    background: #000000;
    height: 90vh;
}

.home-brand.kress-rtkn > content > titlewrap > a {
    position: relative;
    color: #a81414;
}

.home-brand.kress-rtkn::before {
    background: #000000;
}

.home-brand.kress-rtkn > img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    opacity: 1;
}


.home-brand.kress-rtkn > overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, #000000 0%, #00000000 50%);
}

.home-brand.kress-rtkn content h5,
.home-brand.kress-rtkn content img {
    filter: drop-shadow(0px 0px 12px #000000);
    -webkit-filter: drop-shadow(0px 0px 12px #000000);
}






.home-brand.nekton-winter-2022 {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    background: #286122;
    height: 90vh;
    min-height: 900px;
    overflow: hidden;
    padding: 0 42px;
}

.home-brand.nekton-winter-2022 > img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 40%;
    display: block;
    z-index: 1;
}

@media(max-width: 800px) {
    .home-brand.nekton-winter-2022 {
        min-height: 800px;
    }

    .home-brand.nekton-winter-2022 > img {
        height: 20%;
    }
}


.home-brand.nekton-winter-2022 > content {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    max-width: 1400px;
    margin: 0 auto;
    z-index: 2;
}

.home-brand.nekton-winter-2022 > content > titlewrap {
    width: unset;
    overflow: visible;
}

.home-brand.nekton-winter-2022 > content > titlewrap > bg {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #286122;
    -webkit-filter: blur(35px);
    filter: blur(35px);
    transform: translate3d(0, 0, 0);
    z-index: -1;
}



.home-brand.nekton-winter-2022 > bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.home-brand.nekton-winter-2022 > bg > content {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 1600px;
    margin: 0 auto;
}

.home-brand.nekton-winter-2022 > bg > content > productlines {
    position: relative;
    height: 100%;
    width: 100%;
    display: flex;
    transform: rotate(4deg);
    -webkit-filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, .25));
    filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, .25));
}

.home-brand.nekton-winter-2022 > bg > content > productlines > line {
    position: relative;
    flex: 0 0 20%;
    max-width: 500px;
    display: block;
}

@media(max-width: 800px) {
    .home-brand.nekton-winter-2022 > bg > content > productlines > line {
        flex: 0 0 33.3333333%;
    }

    .home-brand.nekton-winter-2022 > bg > content > productlines > line:nth-child(4),
    .home-brand.nekton-winter-2022 > bg > content > productlines > line:nth-child(5) {
        display: none;
    }
}

.home-brand.nekton-winter-2022 > bg > content > productlines > line > content {
    position: relative;
    display: block;
    width: 100%;
}

.home-brand.nekton-winter-2022 > bg > content > productlines > line > content > img {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}

.home-brand.nekton-winter-2022 > bg > content > productlines > line > content > img:last-child {
    margin: 42px 0 0 0;
}

.home-brand.nekton-winter-2022 > bg > content > productlines > line:nth-child(even) > content {
    animation: slideNektonProdA 130s linear infinite reverse;
}

.home-brand.nekton-winter-2022 > bg > content > productlines > line:nth-child(odd) > content {
    animation: slideNektonProdB 95s linear infinite reverse;
}

@keyframes slideNektonProdA {
    from {
        transform: translate3d(0, -50%, 0);
    }

    to {
        transform: translate3d(0, 0%, 0);
    }
}

@keyframes slideNektonProdB {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(0, -50%, 0);
    }
}



productselect {
    position: relative;
    display: block;
    width: 100%;
    padding: 16px 0;
    background: linear-gradient(to top, #101010, #0a0a0aee);
    z-index: 50;
    overflow: hidden;
}


productselect > content {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 0 auto;
    z-index: 1;
}


productselect > content > a {
    position: relative;
    display: block;
    width: 190px;
    flex: 0 0 190px;
    padding: 0px 16px;
}



productselect > content > a > img {
    position: relative;
    display: block;
    width: 100px;
    height: 100px;
    margin: 0 auto 8px;
}


productselect > content > a > p {
    position: relative;
    display: block;
    text-align: center;
    color: #ffffff;
    font-size: 14px;
}

@media(max-width: 1120px) {
    productselect > content > a {
        width: 150px;
        flex: 0 0 150px;
    }
}

@media(max-width: 800px) {
    productselect > content > a {
        width: 50%;
        flex: 0 0 50%;
    }
}

@media(max-width: 460px) {
    productselect > content > a {
        display: flex;
        align-items: center;
        width: 100%;
        flex: 0 0 100%;
        padding: 8px 16px;
    }

    productselect > content > a > img {
        width: 64px;
        height: 64px;
        flex-grow: 0;
        margin: 0 24px 0 0;
    }

    productselect > content > a > p {
        margin: 0;
        text-align: left;
    }
}

.home-rtkn-hero {
    background: url('/images/eyepilot_home_hero.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right center;
}

.home-rtkn-hero::before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 50%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, .75), rgba(0, 0, 0, 0));
    content: '';
}

.home-mission-hero {
    min-height: 1200px;
    height: 75vh;
}


.home-rtkn-hero > video,
.home-mission-hero > video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    margin: 0;
    padding: 0;
    z-index: 0;
}

.home-rtkn-hero > content,
.home-mission-hero > content {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 150px 0;
}

@media(max-width: 1500px) {

    .home-rtkn-hero > content,
    .home-mission-hero > content {
        max-width: 1200px;
    }
}

@media(max-width: 1200px) {
    .home-rtkn-hero {
        background-position: 75% center;
    }

    .home-rtkn-hero > content {
        padding-top: 102px;
        padding-bottom: 400px;
    }
}

.home-mission-hero::before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 50%;
    display: block;
    background: linear-gradient(to bottom, rgba(0, 0, 0, .75), transparent);
    content: '';
    z-index: 1;
}

.home-mission-hero > content {
    display: block;
}

.home-rtkn-hero > content > img,
.home-mission-hero > content > img {
    position: relative;
    right: -250px;
    display: block;
    width: 75%;
    height: auto;
}

.home-rtkn-hero > content > titlewrap,
.home-mission-hero > content > titlewrap {
    position: relative;
    display: block;
    flex-shrink: 0;
    width: unset;
    z-index: 1;
    -webkit-filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .75));
    filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, .75));
    transform: translate3d(0, 0, 0);
}

.home-mission-hero > content > titlewrap {
    max-width: 500px;
    margin: 0 auto;
    text-align: center;
}

.home-rtkn-hero > content > titlewrap > newtag,
.home-mission-hero > content > titlewrap > newtag {
    position: relative;
    display: block;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 2px;
    margin: 0 0 32px 0;
}

.home-rtkn-hero > content > titlewrap > img,
.home-mission-hero > content > titlewrap > img {
    position: relative;
    display: block;
    height: 75px;
    width: auto;
    margin: 0 0 32px 0;
}

.home-mission-hero > content > titlewrap > img {
    position: relative;
    display: block;
    width: 300px;
    height: auto;
    margin: 0 auto 32px;
}

.home-rtkn-hero > content > titlewrap > h2,
.home-mission-hero > content > titlewrap > h2 {
    position: relative;
    display: block;
    color: #ffffff;
    margin: 0 0 32px 0;
}




@media(max-width: 1930px) {

    .home-mission-hero {
        min-height: 1000px;
        height: 75vh;
    }

    .home-rtkn-hero > content > img,
    .home-mission-hero > content > img {
        position: relative;
        right: -250px;
        display: block;
        width: 50%;
        height: auto;
    }

    .home-rtkn-hero > content > titlewrap > h1,
    .home-mission-hero > content > titlewrap > h1 {
        font-size: 58px;
    }
}


@media(max-width: 500px) {
    .home-rtkn-hero > content > titlewrap > newtag {
        margin-bottom: 10px;
    }

    .home-rtkn-hero > content > titlewrap > img {
        height: 60px;
    }

    .home-mission-hero {
        min-height: 1000px;
        height: 60vh;
    }

    .home-rtkn-hero > content > img,
    .home-mission-hero > content > img {
        position: absolute;
        right: unset;
        left: 0;
        bottom: -100px;
        display: block;
        width: 200%;
        object-fit: cover;
        object-position: center center;
        height: auto;
    }

    .home-rtkn-hero > content > titlewrap > h1,
    .home-mission-hero > content > titlewrap > h1 {
        font-size: 28px;
    }
}




.home-hdg-kress-hero {
    position: relative;
    display: block;
    width: 100%;
    padding: 150px 32px;
    background: #000000;
}


.home-hdg-kress-hero > content {
    display: block;
    align-items: center;
    height: 100%;
    padding: 150px 0;
}

.home-hdg-kress-hero > content > titlewrap {
    position: relative;
    display: block;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    width: unset;
}

.home-hdg-kress-hero > content > titlewrap > video {
    position: relative;
    display: block;
    width: 400px;
    height: auto;
    margin: 0 auto 32px;
    padding: 0;
    z-index: 0;
}

@media(max-width: 600px) {
    .home-hdg-kress-hero > content > titlewrap > video {
        width: 300px;
        height: auto;
    }
}

@media(max-width: 400px) {
    .home-hdg-kress-hero > content > titlewrap > video {
        width: 250px;
        height: auto;
    }
}

.home-hdg-kress-hero > content > titlewrap > img {
    position: relative;
    display: block;
    height: 75px;
    width: auto;
    margin: 0 0 32px 0;

}



.home-hdg-kress-hero > content > titlewrap > h2 {
    position: relative;
    display: block;
    color: #ffffff;
    margin: 0 0 16px 0;
}


.home-hdg-kress-hero > content > titlewrap > p {
    position: relative;
    display: block;
    color: #e0e0e0;
    margin: 0 0 32px 0;
}



@media(max-width: 500px) {
    .home-mission-hero > content > titlewrap > img {
        height: 40px;
        width: auto;
    }
}


.home-hdg-kress-hero > cardcarrusel {
    position: relative;
    display: block;
    width: 100%;
    position: relative;
    max-width: 1400px;
    display: block;
    margin: 0 auto;
}

.home-hdg-kress-hero > cardcarrusel > content > row {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}


@media(max-width: 950px) {
    .home-hdg-kress-hero > cardcarrusel > content > row {
        position: relative;
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .home-hdg-kress-hero > cardcarrusel > content > row *:nth-child(4),
    .home-hdg-kress-hero > cardcarrusel > content > row *:nth-child(5),
    .home-hdg-kress-hero > cardcarrusel > content > row *:nth-child(6) {
        display: none;
    }
}


section.new-cards-carrusel,
section.products-cards-carrusel,
section.product-details-cards-carrusel {
    position: relative;
    display: block;
    width: 100%;
    padding: 150px 32px;
}

section.new-cards-carrusel > titlewrap,
section.products-cards-carrusel > titlewrap {
    position: relative;
    display: block;
    width: 100%;
    max-width: 1400px;
    padding: 0 0 52px 0;
    margin: 0 auto;
    color: #ffffff;
}

section.new-cards-carrusel > titlewrap > h1,
section.new-cards-carrusel > titlewrap > h2,
section.new-cards-carrusel > titlewrap > h3,
section.new-cards-carrusel > titlewrap > h4,
section.new-cards-carrusel > titlewrap > h5,
section.new-cards-carrusel > titlewrap > h6,
section.products-cards-carrusel > titlewrap > h1,
section.products-cards-carrusel > titlewrap > h2,
section.products-cards-carrusel > titlewrap > h3,
section.products-cards-carrusel > titlewrap > h4,
section.products-cards-carrusel > titlewrap > h5,
section.products-cards-carrusel > titlewrap > h6 {
    position: relative;
    display: block;
    width: 100%;
    color: #ffffff;
}


cardcarrusel {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
}

cardcarrusel > content {
    position: relative;
    display: block;
    padding: 0;
    overflow: visible;
    max-width: 1400px;
    margin: 0 auto;
}

cardcarrusel > content > row {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
    width: auto;
    margin: 0;
    padding: 0;
}

@media(max-width: 780px) {
    cardcarrusel > content > row {
        grid-template-columns: 1fr;
    }
}


cardcarrusel > content > row > * {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 16px;
    border: 2px solid transparent;
    background: linear-gradient(to top, #080808, #121212) padding-box, linear-gradient(to top, #0a0a0a, #222222) border-box;
    overflow: hidden;
}

section.product-details-cards-carrusel cardcarrusel > content > row > * {
    flex: 0 0 100%;
}


section.products-cards-carrusel cardcarrusel > content {
    position: relative;
    display: block;
}

section.products-cards-carrusel cardcarrusel > content > row {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

@media(max-width: 1100px) {
    section.products-cards-carrusel cardcarrusel > content > row {
        grid-template-columns: 1fr 1fr;
    }
}


@media(max-width: 850px) {
    section.products-cards-carrusel cardcarrusel > content > row {
        grid-template-columns: 1fr;
    }
}

section.products-cards-carrusel cardcarrusel > content > row > * {
    margin: 0;
}

cardcarrusel > content > row > *::before {
    position: absolute;
    left: 0;
    top: -100px;
    width: 100%;
    height: 250px;
    display: block;
    content: '';
    background: radial-gradient(ellipse at top, rgba(255, 255, 255, .05) 0%, transparent 65%);

}

cardcarrusel > content > row > *:not(:last-child) {
    margin-right: 16px;
}

cardcarrusel > content > row > * > imagewrap {
    position: relative;
    display: block;
    width: 100%;
    height: 250px;
    overflow: hidden;
    margin: 0;
}

cardcarrusel > content > row > * > imagewrap > img {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

section.products-cards-carrusel cardcarrusel > content > row > * > imagewrap > img {
    object-fit: contain;
}

cardcarrusel > content > row > * > textwrap,
cardcarrusel > content > row > * > p.price,
cardcarrusel > content > row > * > specs,
cardcarrusel > content > row > * > pricing {
    position: relative;
    display: block;
    width: 100%;
    padding: 32px;
    color: #aaaaaa;
}

@media(max-width: 500px) {

    cardcarrusel > content > row > * > textwrap,
    cardcarrusel > content > row > * > p.price,
    cardcarrusel > content > row > * > specs,
    cardcarrusel > content > row > * > pricing {
        padding: 16px;
    }
}

cardcarrusel > content > row > * > textwrap {
    flex-grow: 1;
}

cardcarrusel > content > row > * > specs {
    padding-top: 0;
    padding-bottom: 0;
}

cardcarrusel > content > row > * > specs > entry {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 8px 0;
    border-bottom: 1px solid #2f2f2f;
}

cardcarrusel > content > row > * > specs > entry:first-of-type {
    border-top: 1px solid #2f2f2f;
}

cardcarrusel > content > row > * > specs > entry > p {
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
}

cardcarrusel > content > row > * > specs > entry > p:first-of-type {
    margin: 0 8px 0 0;
    overflow: hidden;
}

cardcarrusel > content > row > * > textwrap > h1,
cardcarrusel > content > row > * > textwrap > h2,
cardcarrusel > content > row > * > textwrap > h3,
cardcarrusel > content > row > * > textwrap > h4,
cardcarrusel > content > row > * > textwrap > h5,
cardcarrusel > content > row > * > textwrap > h6 {
    position: relative;
    display: block;
    width: 100%;
    color: #ffffff;
    margin: 0 0 16px;
}

cardcarrusel > content > row > * > textwrap > p {
    position: relative;
    display: block;
    width: 100%;
    color: #aaaaaa;
    margin: 0;
}

cardcarrusel > content > row > * > textwrap > p.productid {
    margin: 0 0 8px 0;
    font-weight: 600;
    font-size: 13px;
}


section.product-details-cards-carrusel cardcarrusel > content > row > * {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

section.product-details-cards-carrusel cardcarrusel > content > row > * > textwrap {
    width: unset;
}

section.product-details-cards-carrusel cardcarrusel > content > row > * > pricing {
    position: relative;
    display: block;
    flex: 1 1;
}

section.product-details-cards-carrusel cardcarrusel > content > row > * > pricing > h5 {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    text-align: right;
}