/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

DESIGN SYSTEM
Last change 08 March 2023
 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */










/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    FONT DECLARATIONS

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

@font-face { font-family: 'gt-flexa-extended-black'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-extended-black.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-extended-black.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-extended-black.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'gt-flexa-black'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-standard-black.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-standard-black.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-standard-black.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'gt-flexa-compressed-black'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-compressed-black.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-compressed-black.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-compressed-black.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'gt-flexa-bold'; src: url('https://www.timnerland.co.uk/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-standard-bold.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-standard-bold.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/gt-flexa/gt-flexa-standard-bold.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'nt-bau-mono-black'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-black.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-black.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-black.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'nt-bau-mono-bold'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-bold.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-bold.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-bold.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'nt-bau-mono-medium'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-medium.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-medium.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-medium.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'nt-bau-mono-regular'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-regular.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-regular.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau-mono/nt-bau-mono-regular.ttf') format('truetype'); font-weight: normal; font-style: normal; text-transform: uppercase; }
@font-face { font-family: 'nt-bau-regular'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-regular.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-regular.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-regular.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'nt-bau-bold'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-bold.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-bold.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-bold.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'nt-bau-medium'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-medium.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-medium.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-medium.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'nt-bau-black'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-black.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-black.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-black.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'nt-bau-light'; src: url('https://www.timberland.co.uk/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-light.woff2') format('woff2'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-light.woff') format('woff'), url('/ns-eu/timberland-eu/design-system/fonts/nt-bau/nt-bau-light.ttf') format('truetype'); font-weight: normal; font-style: normal; }

body,html{
    overflow-x: hidden;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TYPOGRAPHY

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-module h1,
.tbl-module h2,
.tbl-module h3,
.tbl-module h4,
.tbl-module h5,
.tbl-module h6,
.tbl-module p{
    padding: 0px;
    margin: 0px;
}

a.--no-underline,
a.--no-underline:hover
{
    text-decoration: none;
}

/* Primary title */
.--typography-title1{  
    font-family: 'gt-flexa-black' !important;
    text-transform: uppercase;
    font-size: 40px;
    line-height: 56px;
    letter-spacing: 0px;
    color: inherit;
}

/* Secondary title */
.--typography-title2,
section.product-carousel .component-title .header{
    font-family: 'gt-flexa-black' !important;
    text-transform: uppercase;
    font-size: 32px;
    line-height: 35px;
    letter-spacing: 0px;
    color: inherit;
}

/* Smaller title */
.--typography-title3{
    font-family: 'gt-flexa-black' !important;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    color: inherit;
}

/* Default copy */
.--typography-paragraph1{
    font-family: 'nt-bau-regular' !important;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    color: inherit;
}

/* Default copy */
.--typography-paragraph2{
    font-family: 'nt-bau-regular' !important;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0px;
    text-transform: uppercase;
    color: inherit;
}

/* Aem Carousel */
.--typography-paragraph3{
    font-family: 'nt-bau-mono-regular' !important;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0px;
    color: inherit;
}

/* Price */
.--typography-paragraph4{
    font-family: 'nt-bau-mono-bold' !important;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0px;
    color: inherit;
}

/* Title Paragraph and CTA button group */
.tbl-title-paragraph-buttongroup .--typography-title1,
.tbl-title-paragraph-buttongroup .--typography-title2,
.tbl-title-paragraph-buttongroup .--typography-title3{
    margin: 0px;
}

.tbl-title-paragraph-buttongroup .--typography-paragraph1,
.tbl-title-paragraph-buttongroup .--typography-paragraph2,
.tbl-title-paragraph-buttongroup .--typography-paragraph3,
.tbl-title-paragraph-buttongroup .--typography-paragraph4{
    margin: 0px;
    margin-top: 8px;
}

.tbl-title-paragraph-buttongroup .tbl-button-group{
    margin-top: 18px;
}

/* Mobile & Tablet */
@media screen and (max-width: 1023px){
    .--typography-title1{
        font-size: 32px;
        line-height: 40px;
    }

    .--typography-title2{
        font-size: 28px;
        line-height: 33px;
    }

    .--typography-title3{
        font-size: 14px;
        line-height: 18px;
    }

    .tbl-title-paragraph-buttongroup .--typography-paragraph1,
    .tbl-title-paragraph-buttongroup .--typography-paragraph2,
    .tbl-title-paragraph-buttongroup .--typography-paragraph3,
    .tbl-title-paragraph-buttongroup .--typography-paragraph4{
        margin: 0px;
        margin-top: 8px;
    }

    .tbl-title-paragraph-buttongroup .tbl-button-group{
        margin-top: 16px;
    }
}


@media screen and (max-width: 479px){
    .--typography-paragraph2{
        font-size: 9px;
        line-height: 13px;
    }
}

section.product-carousel .component-title .header{
    margin-bottom: 0px;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    COLOR PALETTE

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.--color-white                          {color: #ffffff;}
.--color-black                          {color: #000;}
.--color-true-wheat                     {color: #cf780f;}
.--color-grey-10                        {color: #2a2a2a;}
.--color-grey-20                        {color: #525252;}
.--color-grey-30                        {color: #757575;}
.--color-grey-80                        {color: #eeeeee;}

@media screen and (max-width: 639px)
{
    .--color-white-for-small            {color: #ffffff;}
    .--color-black-for-small            {color: #000;}
    .--color-true-wheat-for-small       {color: #cf780f;}
    .--color-grey-10-for-small          {color: #2a2a2a;}
    .--color-grey-20-for-small          {color: #525252;}
    .--color-grey-30-for-small          {color: #757575;}
    .--color-grey-80-for-small          {color: #eeeeee;}
}

@media screen and (min-width: 640px) and (max-width:1023px)
{
    .--color-white-for-medium           {color: #ffffff;}
    .--color-black-for-medium           {color: #000;}
    .--color-true-wheat-for-medium      {color: #cf780f;}
    .--color-grey-10-for-medium         {color: #2a2a2a;}
    .--color-grey-20-for-medium         {color: #525252;}
    .--color-grey-30-for-medium         {color: #757575;}
    .--color-grey-80-for-medium         {color: #eeeeee;}
}

@media screen and (min-width: 1024px)
{
    .--color-white-for-large            {color: #ffffff;}
    .--color-black-for-large            {color: #000;}
    .--color-true-wheat-for-large       {color: #cf780f;}
    .--color-grey-10-for-large          {color: #2a2a2a;}
    .--color-grey-20-for-large          {color: #525252;}
    .--color-grey-30-for-large          {color: #757575;}
    .--color-grey-80-for-large          {color: #eeeeee;}
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    BACKGROUND COLOR PALETTE

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.--background-color-white                           {background-color: #ffffff;}
.--background-color-black                           {background-color: #000;}
.--background-color-true-wheat                      {background-color: #cf780f;}
.--background-color-grey-10                         {background-color: #2a2a2a;}
.--background-color-grey-20                         {background-color: #525252;}
.--background-color-grey-30                         {background-color: #757575;}
.--background-color-grey-80                         {background-color: #eeeeee;}

@media screen and (max-width: 639px)
{
    .--background-color-white-for-small            {background-color: #ffffff;}
    .--background-color-black-for-small            {background-color: #000;}
    .--background-color-true-wheat-for-small       {background-color: #cf780f;}
    .--background-color-grey-10-for-small          {background-color: #2a2a2a;}
    .--background-color-grey-20-for-small          {background-color: #525252;}
    .--background-color-grey-30-for-small          {background-color: #757575;}
    .--background-color-grey-80-for-small          {background-color: #eeeeee;}
}

@media screen and (min-width: 640px) and (max-width:1023px)
{
    .--background-color-white-for-medium            {background-color: #ffffff;}
    .--background-color-black-for-medium            {background-color: #000;}
    .--background-color-true-wheat-for-medium       {background-color: #cf780f;}
    .--background-color-grey-10-for-medium          {background-color: #2a2a2a;}
    .--background-color-grey-20-for-medium          {background-color: #525252;}
    .--background-color-grey-30-for-medium          {background-color: #757575;}
    .--background-color-grey-80-for-medium          {background-color: #eeeeee;}
}

@media screen and (min-width: 1024px)
{
    .--background-color-white-for-large             {background-color: #ffffff;}
    .--background-color-black-for-large             {background-color: #000;}
    .--background-color-true-wheat-for-large        {background-color: #cf780f;}
    .--background-color-grey-10-for-large           {background-color: #2a2a2a;}
    .--background-color-grey-20-for-large           {background-color: #525252;}
    .--background-color-grey-30-for-large           {background-color: #757575;}
    .--background-color-grey-80-for-large           {background-color: #eeeeee;}
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    FULL BLEED AND MAX-WIDTH

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.--no-full-bleed
{
    max-width: 1920px;
    width: 100%;
    margin: 0px auto;
}

.--full-bleed
{
    width: 100%;
    max-width: 100%;
    margin: 0px auto;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    SPACING

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.--bottom-spacing
{
    margin-bottom: 70px;
}

.--top-spacing
{
    margin-top: 70px;
}

@media screen and (max-width: 1023px)
{
    .--bottom-spacing
    {
        margin-bottom: 60px;
    }

    .--top-spacing
    {
        margin-top: 60px;
    }
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    PLACEMENTS

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.--placement-left,
.--placement-center,
.--placement-right,
.--placement-left-for-small,
.--placement-center-for-medium,
.--placement-right-for-large
{
    display: flex;
    flex-direction: column;
}

.--placement-left:not(:first-child),
.--placement-center:not(:first-child),
.--placement-right:not(:first-child),
.--placement-left-for-small:not(:first-child),
.--placement-center-for-medium:not(:first-child),
.--placement-right-for-large:not(:first-child),

.tbl-single-element-carousel__content .--placement-left,
.tbl-single-element-carousel__content .--placement-center,
.tbl-single-element-carousel__content .--placement-right,
.tbl-single-element-carousel__content .--placement-left-for-small,
.tbl-single-element-carousel__content .--placement-center-for-medium,
.tbl-single-element-carousel__content .--placement-right-for-large
{
    padding-top:28px;
}

.--placement-left
{
    position: relative;
    align-items: start;
}

.--placement-center
{
    position: relative;
    align-items: center;  
}

.--placement-right
{
    position: relative;
    align-items: end;
    text-align: right;
}

@media screen and (max-width: 639px)
{
    .--placement-left-for-small
    {
        position: relative;
        align-items: start;
        text-align: left;
    }

    .--placement-center-for-small
    {
        position: relative;
        align-items: center;
        text-align: center;
    }

    .--placement-right-for-small
    {
        position: relative;
        align-items: end;
        text-align: right;
    }
}

@media screen and (min-width: 640px) and (max-width: 1023px)
{
    .--placement-left-for-medium
    {
        position: relative;
        align-items: start;
        text-align: left;
    }

    .--placement-center-for-medium
    {
        position: relative;
        align-items: center;
        text-align: center;
    }

    .--placement-right-for-medium
    {
        position: relative;
        align-items: end;
        text-align: right;
    }
}

@media screen and (min-width: 1024px)
{
    .--placement-left-for-large
    {
        position: relative;
        align-items: start;
        text-align: left;
    }

    .--placement-center-for-large
    {
        position: relative;
        align-items: center;
        text-align: center;
    }

    .--placement-right-for-large
    {
        position: relative;
        align-items: end;
        text-align: right;
    }
}


.--placement-overlay-left-top,
.--placement-overlay-left-top-for-small,
.--placement-overlay-left-top-for-medium,
.--placement-overlay-left-top-for-large,

.--placement-overlay-left-center,
.--placement-overlay-left-center-for-small,
.--placement-overlay-left-center-for-medium,
.--placement-overlay-left-center-for-large,

.--placement-overlay-left-bottom,
.--placement-overlay-left-bottom-for-small,
.--placement-overlay-left-bottom-for-medium,
.--placement-overlay-left-bottom-for-large,

.--placement-overlay-center-top,
.--placement-overlay-center-top-for-small,
.--placement-overlay-center-top-for-medium,
.--placement-overlay-center-top-for-large,

.--placement-overlay-center-center,
.--placement-overlay-center-center-for-small,
.--placement-overlay-center-center-for-medium,
.--placement-overlay-center-center-for-large,

.--placement-overlay-center-bottom,
.--placement-overlay-center-bottom-for-small,
.--placement-overlay-center-bottom-for-medium,
.--placement-overlay-center-bottom-for-large,

.--placement-overlay-right-top,
.--placement-overlay-right-top-for-small,
.--placement-overlay-right-top-for-medium,
.--placement-overlay-right-top-for-large,

.--placement-overlay-right-center,
.--placement-overlay-right-center-for-small,
.--placement-overlay-right-center-for-medium,
.--placement-overlay-right-center-for-large,

.--placement-overlay-right-bottom,
.--placement-overlay-right-bottom-for-small,
.--placement-overlay-right-bottom-for-medium,
.--placement-overlay-right-bottom-for-large
{
    display: flex;
    flex-direction: column;
    padding-left: 40px;
    padding-right: 40px;
    width: 100%;
}

.--placement-overlay-left-top{
    position: absolute;
    top: 40px;
    align-items: start;
}

.--placement-overlay-left-center{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    align-items: start;
}

.--placement-overlay-left-bottom{
    position: absolute;
    bottom: 40px;
    align-items: start;
}

.--placement-overlay-center-top{
    position: absolute;
    align-items: center;
    top: 40px;
}

.--placement-overlay-center-center{
    position: absolute;
    align-items: center;
    top: 50%;
    transform: translateY(-50%);
}

.--placement-overlay-center-bottom{
    position: absolute;
    align-items: center;
    bottom: 40px;
}

.--placement-overlay-right-top{
    position: absolute;
    align-items: end;
    top: 40px;
}

.--placement-overlay-right-center{
    position: absolute;
    align-items: end;
    top: 50%;
    transform: translateY(-50%);
}

.--placement-overlay-right-bottom{
    position: absolute;
    align-items: end;
    bottom: 40px;
}

@media screen and (max-width: 1023px)
{
    .--placement-overlay-left-top,
    .--placement-overlay-left-center,
    .--placement-overlay-left-bottom,
    .--placement-overlay-center-top,
    .--placement-overlay-center-center,
    .--placement-overlay-center-bottom,
    .--placement-overlay-right-top,
    .--placement-overlay-right-center,
    .--placement-overlay-right-bottom
    {
        padding-left: 20px;
        padding-right: 20px;
        width: 100%;
    }

    .--placement-overlay-left-top{
        position: absolute;
        top: 20px;
        align-items: start;
    }

    .--placement-overlay-left-center{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        align-items: start;
    }

    .--placement-overlay-left-bottom{
        position: absolute;
        bottom: 20px;
        align-items: start;
    }

    .--placement-overlay-center-top{
        position: absolute;
        align-items: center;
        top: 20px;
    }

    .--placement-overlay-center-center{
        position: absolute;
        align-items: center;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-center-bottom{
        position: absolute;
        align-items: center;
        bottom: 20px;
    }

    .--placement-overlay-right-top{
        position: absolute;
        align-items: end;
        top: 20px;
    }

    .--placement-overlay-right-center{
        position: absolute;
        align-items: end;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-right-bottom{
        position: absolute;
        align-items: end;
        bottom: 20px;
    }

}

@media screen and (max-width: 639px)
{

    .--placement-overlay-left-top-for-small,
    .--placement-overlay-left-center-for-small,
    .--placement-overlay-left-bottom-for-small,
    .--placement-overlay-center-top-for-small,
    .--placement-overlay-center-center-for-small,
    .--placement-overlay-center-bottom-for-small,
    .--placement-overlay-right-top-for-small,
    .--placement-overlay-right-center-for-small,
    .--placement-overlay-right-bottom-for-small,
    .--placement-left-for-small,
    .--placement-center-for-small,
    .--placement-right-for-small
    {
        padding-left: 0px;
        padding-right: 0px;
    }

    .--placement-overlay-left-top-for-small{
        position: absolute;
        top: 20px;
        align-items: start;
    }

    .--placement-overlay-left-center-for-small{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        align-items: start;
    }

    .--placement-overlay-left-bottom-for-small{
        position: absolute;
        bottom: 20px;
        align-items: start;
    }

    .--placement-overlay-center-top-for-small{
        position: absolute;
        align-items: center;
        top: 20px;
    }

    .--placement-overlay-center-center-for-small{
        position: absolute;
        align-items: center;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
    }

    .--placement-overlay-center-bottom-for-small{
        position: absolute;
        align-items: center;
        bottom: 20px;
    }

    .--placement-overlay-right-top-for-small{
        position: absolute;
        align-items: end;
        top: 20px;
    }

    .--placement-overlay-right-center-for-small{
        position: absolute;
        align-items: end;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-right-bottom-for-small{
        position: absolute;
        align-items: end;
        bottom: 20px;
    } 
}

@media screen and (min-width: 640px) and (max-width: 1023px)
{

    .--placement-overlay-left-top-for-medium,
    .--placement-overlay-left-center-for-medium,
    .--placement-overlay-left-bottom-for-medium,
    .--placement-overlay-center-top-for-medium,
    .--placement-overlay-center-center-for-medium,
    .--placement-overlay-center-bottom-for-medium,
    .--placement-overlay-right-top-for-medium,
    .--placement-overlay-right-center-for-medium,
    .--placement-overlay-right-bottom-for-medium
    {
        padding-left: 20px;
        padding-right: 20px;
    }

    .--placement-overlay-left-top-for-medium{
        position: absolute;
        top: 20px;
        align-items: start;
    }

    .--placement-overlay-left-center-for-medium{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        align-items: start;
    }

    .--placement-overlay-left-bottom-for-medium{
        position: absolute;
        bottom: 20px;
        align-items: start;
    }

    .--placement-overlay-center-top-for-medium{
        position: absolute;
        align-items: center;
        top: 20px;
    }

    .--placement-overlay-center-center-for-medium{
        position: absolute;
        align-items: center;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-center-bottom-for-medium{
        position: absolute;
        align-items: center;
        bottom: 20px;
    }

    .--placement-overlay-right-top-for-medium{
        position: absolute;
        align-items: end;
        top: 20px;
    }

    .--placement-overlay-right-center-for-medium{
        position: absolute;
        align-items: end;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-right-bottom-for-medium{
        position: absolute;
        align-items: end;
        bottom: 20px;
    } 
}

@media screen and (min-width: 1024px)
{

    .--placement-overlay-left-top-for-large,
    .--placement-overlay-left-center-for-large,
    .--placement-overlay-left-bottom-for-large,
    .--placement-overlay-center-top-for-large,
    .--placement-overlay-center-center-for-large,
    .--placement-overlay-center-bottom-for-large,
    .--placement-overlay-right-top-for-large,
    .--placement-overlay-right-center-for-large,
    .--placement-overlay-right-bottom-for-large
    {
        padding-left: 40px;
        padding-right: 40px;
    }

    .--placement-overlay-left-top-for-large{
        position: absolute;
        top: 40px;
        align-items: start;
    }

    .--placement-overlay-left-center-for-large{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        align-items: start;
    }

    .--placement-overlay-left-bottom-for-large{
        position: absolute;
        bottom: 40px;
        align-items: start;
    }

    .--placement-overlay-center-top-for-large{
        position: absolute;
        align-items: center;
        top: 40px;
    }

    .--placement-overlay-center-center-for-large{
        position: absolute;
        align-items: center;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-center-bottom-for-large{
        position: absolute;
        align-items: center;
        bottom: 40px;
    }

    .--placement-overlay-right-top-for-large{
        position: absolute;
        align-items: end;
        top: 40px;
    }

    .--placement-overlay-right-center-for-large{
        position: absolute;
        align-items: end;
        top: 50%;
        transform: translateY(-50%);
    }

    .--placement-overlay-right-bottom-for-large{
        position: absolute;
        align-items: end;
        bottom: 40px;
    } 
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    BUTTON GROUPS

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-button-group{
    display: flex;
    width: fit-content;
    align-items: inherit;
}

.tbl-button-group.--full-width,
.tbl-button-group.--full-width .tbl-button{
    width: 100% !important;
}


/* Horizontal */


.tbl-button-group.--horizontal{
    flex-direction: row;
    flex-wrap: wrap;
    align-items: unset;

}

.tbl-button-group.--horizontal .tbl-button{
    margin-right: 8px; 
    display: flex;
    justify-content: center;
    align-items: center;  
    flex:1
}

.tbl-button-group.--horizontal .tbl-button:last-child{
    margin-right: 0px;
}

.tbl-button-group.--horizontal .tbl-button.--chip
{
    margin-right: 20px;
}

.tbl-button-group.--horizontal .tbl-button.--chip:last-child
{
    margin-right: 0px;
}

/* Vertical */

.tbl-button-group.--vertical{
    flex-direction: column;
}

.tbl-button-group.--vertical .tbl-button{
    margin-bottom: 8px;   
    width:fit-content;
}

.tbl-button-group.--vertical .tbl-button:last-child{
    margin-bottom: 0px;   
}


/* Media queries */


@media screen and (max-width: 639px){

    .tbl-button-group.--horizontal-for-small{
        flex-direction: row;
        flex-wrap: wrap;
        align-items: unset;

    }

    .tbl-button-group.--horizontal-for-small .tbl-button{
        margin-right: 8px; 
        display: flex;
        justify-content: center;
        align-items: center;  
        flex:1
    }

    .tbl-button-group.--vertical-for-small{
        flex-direction: column;
    }

    .tbl-button-group.--vertical-for-small .tbl-button{
        margin-bottom: 8px;   
        width:fit-content;
    }

    /* --------------------------------------------------------------------------------
    /* Vertical alignment */

    .tbl-button-group.--full-width-for-small,
    .tbl-button-group.--full-width-for-small .tbl-button{
        width: 100% !important;
    }

    .tbl-button-group.--vertical.--equal-width-for-small .tbl-button{
        width: 100%;
    }

    /* --------------------------------------------------------------------------------
    /* Horizontal alignment */

}

@media screen and (min-width: 640px) and (max-width: 1023px){

    .tbl-button-group.--horizontal-for-medium{
        flex-direction: row;
        flex-wrap: wrap;
        align-items: unset;

    }

    .tbl-button-group.--horizontal-for-medium .tbl-button{
        margin-right: 8px; 
        display: flex;
        justify-content: center;
        align-items: center;  
        flex:1
    }

    .tbl-button-group.--vertical-for-medium{
        flex-direction: column;
    }

    .tbl-button-group.--vertical-for-medium .tbl-button{
        margin-bottom: 8px;   
        width:fit-content;
    }

    /* --------------------------------------------------------------------------------
     /* Vertical alignment */

    .tbl-button-group.--full-width-for-medium,
    .tbl-button-group.--full-width-for-medium .tbl-button,{
        width: 100% !important;
    }

    .tbl-button-group.--vertical.--equal-width-for-medium .tbl-button{
        width: 100%;
    }

    /* --------------------------------------------------------------------------------
    /* Horizontal alignment */
}

@media screen and (min-width: 1024px)
{

    .tbl-button-group.--horizontal-for-large{
        flex-direction: row;
        flex-wrap: wrap;
        align-items: unset;

    }

    .tbl-button-group.--horizontal-for-large .tbl-button{
        margin-right: 8px; 
        display: flex;
        justify-content: center;
        align-items: center;  
        flex:1
    }

    .tbl-button-group.--vertical-for-large{
        flex-direction: column;
    }

    .tbl-button-group.--vertical-for-large .tbl-button{
        margin-bottom: 8px;   
        width:fit-content;
    }

    .tbl-button-group.--full-width-for-large,
    .tbl-button-group.--full-width-for-large .tbl-button{
        width: 100% !important;
    }

    .tbl-button-group.--vertical.--equal-width-for-large .tbl-button{
        width: 100%;
    }
}

.tbl-button-group.--vertical.--equal-width .tbl-button{
    width: 100%;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    BUTTONS

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-button
{
    font-family: "nt-bau-mono-regular";
    margin: 0px;
    cursor: pointer;
    min-width: 128px;
    text-decoration: none;
    display: inline-block;
    text-align: center;
}

.tbl-button.--medium
{
    min-width: 210px;
    font-size: 18px;
    line-height: 24px;
    padding: 16px 32px;
}

.tbl-button.--small
{
    min-width: 182px;
    padding: 12px 24px;
    font-size: 18px;
    line-height: 24px;
}

.tbl-button.--extra-small
{
    min-width: 128px;
    padding: 12px 16px;
    font-size: 14px;
    line-height: 16px;
}

.tbl-button.--tiny
{
    min-width: 102px;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 16px;
}


.tbl-button.--primary
{
    background-color: #000;
    color: #fff;
    border: 1px solid #000;
}

.tbl-button.--primary:hover
{
    background-color: #525252;
    color: #fff;
    border: 1px solid #525252;
}

.tbl-button.--primary:active
{
    background-color: #2a2a2a;
    color: #fff;
    border: 1px solid #2a2a2a;
}

.tbl-button.--secondary
{
    background-color: #fff;
    color: #525252;
    border: 1px solid #525252;
}

.tbl-button.--secondary:hover
{
    background-color: #525252;
    color: #fff;
    border: 1px solid #000;
}

.tbl-button.--secondary:active
{
    background-color: #000;
    color: #fff;
    border: 1px solid #2a2a2a;
}

.tbl-button.--primary-inverse
{
    background-color: #fff;
    color: #000;
    border: 1px solid #fff;
}

.tbl-button.--primary-inverse:hover
{
    background-color: #eee;
    color: #525252;
    border: 1px solid #eee;
}

.tbl-button.--primary-inverse:active
{
    background-color: #e1e1e1;
    color: #525252;
    border: 1px solid #e1e1e1;
}

.tbl-button.--secondary-inverse
{
    background-color: #000;
    color: #fff;
    border: 1px solid #000;
}

.tbl-button.--secondary-inverse:hover
{
    background-color: #525252;
    color: #fff;
    border: 1px solid #525252;
}

.tbl-button.--secondary-inverse:active
{
    background-color: #2A2A2A;
    color: #fff;
    border: 1px solid #2A2A2A;
}

.tbl-button.--chip
{
    position: relative;
    width: auto;
    min-width: auto;
    margin: 0px;
    border: 1px solid black;
    padding: 10px 25px;
    border-radius: 10px;
    margin-right: 20px;
    /*white-space: nowrap;*/
    font-size: 16px;
    line-height: 14px;
    font-family: 'nt-bau-medium';
    letter-spacing: 0px;
    text-decoration: none;
    padding-right: calc(25px + 20px + 15px);
}

.tbl-button.--chip:before{
    content:'';
    background-image:url('https://images.timberland.com/is/content/TimberlandBrand/S23-DESIGN-SYSTEM-ICONS-ARROW-RIGHT');
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px;
    height: 11px;
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
}

.tbl-button.--chip:last-child:before{
    right: 25px;
}

@media screen and (max-width: 639px)
{
    .tbl-button.--medium-for-small
    {
        min-width: 210px;
        font-size: 18px;
        line-height: 24px;
        padding: 16px 32px;
    }

    .tbl-button.--small-for-small
    {
        min-width: 182px;
        padding: 12px 24px;
        font-size: 18px;
        line-height: 24px;
    }

    .tbl-button.--extra-small-for-small
    {
        min-width: 128px;
        padding: 12px 16px;
        font-size: 14px;
        line-height: 16px;
    }

    .tbl-button.--tiny-for-small
    {
        min-width: 102px;
        padding: 8px 16px;
        font-size: 14px;
        line-height: 16px;
    }

    .tbl-button.--primary-for-small
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--primary-for-small:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #525252;
    }

    .tbl-button.--primary-for-small:active
    {
        background-color: #2a2a2a;
        color: #fff;
        border: 1px solid #2a2a2a;
    }

    .tbl-button.--secondary-for-small
    {
        background-color: #fff;
        color: #525252;
        border: 1px solid #525252;
    }

    .tbl-button.--secondary-for-small:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--secondary-for-small:active
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #2a2a2a;
    }

    .tbl-button.--primary-inverse-for-small
    {
        background-color: #fff;
        color: #000;
        border: 1px solid #fff;
    }

    .tbl-button.--primary-inverse-for-small:hover
    {
        background-color: #eee;
        color: #525252;
        border: 1px solid #eee;
    }

    .tbl-button.--primary-inverse-for-small:active
    {
        background-color: #e1e1e1;
        color: #525252;
        border: 1px solid #e1e1e1;
    }

    .tbl-button.--secondary-inverse-for-small
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--secondary-inverse-for-small:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #525252;
    }

    .tbl-button.--secondary-inverse-for-small:active
    {
        background-color: #2A2A2A;
        color: #fff;
        border: 1px solid #2A2A2A;
    }
}

@media screen and (min-width: 640px) and (max-width: 1023px)
{
    .tbl-button.--medium-for-medium
    {
        min-width: 210px;
        font-size: 18px;
        line-height: 24px;
        padding: 16px 32px;
    }

    .tbl-button.--small-for-medium
    {
        min-width: 182px;
        padding: 12px 24px;
        font-size: 18px;
        line-height: 24px;
    }

    .tbl-button.--extra-small-for-medium
    {
        min-width: 128px;
        padding: 12px 16px;
        font-size: 14px;
        line-height: 16px;
    }

    .tbl-button.--tiny-for-medium
    {
        min-width: 102px;
        padding: 8px 16px;
        font-size: 14px;
        line-height: 16px;
    }

    .tbl-button.--primary-for-medium
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--primary-for-medium:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #525252;
    }

    .tbl-button.--primary-for-medium:active
    {
        background-color: #2a2a2a;
        color: #fff;
        border: 1px solid #2a2a2a;
    }

    .tbl-button.--secondary-for-medium
    {
        background-color: #fff;
        color: #525252;
        border: 1px solid #525252;
    }

    .tbl-button.--secondary-for-medium:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--secondary-for-medium:active
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #2a2a2a;
    }

    .tbl-button.--primary-inverse-for-medium
    {
        background-color: #fff;
        color: #000;
        border: 1px solid #fff;
    }

    .tbl-button.--primary-inverse-for-medium:hover
    {
        background-color: #eee;
        color: #525252;
        border: 1px solid #eee;
    }

    .tbl-button.--primary-inverse-for-medium:active
    {
        background-color: #e1e1e1;
        color: #525252;
        border: 1px solid #e1e1e1;
    }

    .tbl-button.--secondary-inverse-for-medium
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--secondary-inverse-for-medium:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #525252;
    }

    .tbl-button.--secondary-inverse-for-medium:active
    {
        background-color: #2A2A2A;
        color: #fff;
        border: 1px solid #2A2A2A;
    }
}

@media screen and (min-width: 1024px)
{
    .tbl-button.--medium-for-large
    {
        min-width: 210px;
        font-size: 18px;
        line-height: 24px;
        padding: 16px 32px;
    }

    .tbl-button.--small-for-large
    {
        min-width: 182px;
        padding: 12px 24px;
        font-size: 18px;
        line-height: 24px;
    }

    .tbl-button.--extra-small-for-large
    {
        min-width: 128px;
        padding: 12px 16px;
        font-size: 14px;
        line-height: 16px;
    }

    .tbl-button.--tiny-for-large
    {
        min-width: 102px;
        padding: 8px 16px;
        font-size: 14px;
        line-height: 16px;
    }

    .tbl-button.--primary-for-large
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--primary-for-large:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #525252;
    }

    .tbl-button.--primary-for-large:active
    {
        background-color: #2a2a2a;
        color: #fff;
        border: 1px solid #2a2a2a;
    }

    .tbl-button.--secondary-for-large
    {
        background-color: #fff;
        color: #525252;
        border: 1px solid #525252;
    }

    .tbl-button.--secondary-for-large:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--secondary-for-large:active
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #2a2a2a;
    }

    .tbl-button.--primary-inverse-for-large
    {
        background-color: #fff;
        color: #000;
        border: 1px solid #fff;
    }

    .tbl-button.--primary-inverse-for-large:hover
    {
        background-color: #eee;
        color: #525252;
        border: 1px solid #eee;
    }

    .tbl-button.--primary-inverse-for-large:active
    {
        background-color: #e1e1e1;
        color: #525252;
        border: 1px solid #e1e1e1;
    }

    .tbl-button.--secondary-inverse-for-large
    {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }

    .tbl-button.--secondary-inverse-for-large:hover
    {
        background-color: #525252;
        color: #fff;
        border: 1px solid #525252;
    }

    .tbl-button.--secondary-inverse-for-large:active
    {
        background-color: #2A2A2A;
        color: #fff;
        border: 1px solid #2A2A2A;
    }

    .tbl-button.tbl-chips:hover{
        border: 1px solid #525252;
        color: #525252;
    }

    .tbl-button.tbl-chips:hover:before{
        filter: invert(31%) sepia(0%) saturate(0%) hue-rotate(149deg) brightness(97%) contrast(90%);
    }
}






.tbl-button.tbl-button--black:hover,
.tbl-button.tbl-button--black:active
{
    background-color: #2a2a2a;
}

.tbl-button.tbl-button--white
{
    background-color: #fff;
    color: #000;
}

.tbl-button.tbl-button--black
{
    background-color: #000;
    color: #fff;
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    GENERIC MODULE

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.core-component-injector-wrapper .tbl-module.--no-full-bleed
{
    max-width: 1920px !important;
    margin: 0px auto !important;
}

.tbl-module
{
    padding-left: 40px;
    padding-right: 40px;
}

.tbl-module__content
{
    display: flex;
    flex-direction: column;
}

.tbl-module > .columns 
{
    position: relative;
    padding: 4px;
}

.tbl-module > .columns:first-child
{
    padding-left: 0px;
}

.tbl-module > .columns:last-child
{
    padding-right: 0px;
}

@media screen and (max-width: 1023px)
{
    .tbl-module > .columns
    {
        padding: 0px;
    } 
}

@media screen and (max-width: 1023px)
{
    .tbl-module
    {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TBL STORIES

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-stories
{
    width: 100%;
    overflow: hidden;
}

.tbl-stories .swiper
{
    overflow: visible;
}

.tbl-stories ul
{
    margin: 0px;
    padding: 0px;
}

.tbl-stories ul li
{
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.tbl-stories ul li img{
    margin-bottom: 16px;
}

.tbl-stories .--typography-title1,
.tbl-stories .--typography-title2,
.tbl-stories .--typography-title3{
    margin-bottom: 24px;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TBL GRID HIGHLIGHT BAR FOR MOBILE

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


.tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid{
    display: grid;
    grid-template-columns: calc(100%/6) calc(100%/6) calc(100%/6) calc(100%/6) calc(100%/6) calc(100%/6);
    margin-left: -8px;
    margin-right: -8px;
}

.tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid > div{
    margin-right: 8px;
    margin-left: 8px;
}

.tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid > div img{
    width: 100%;
    display: block;
    margin: 0px auto;
    margin-bottom: 16px;
    border: 1px solid #eee;
    border-radius: 10px;
}

.tbl-grid-highlight-bar a{
    display: inline-block;
    width: 100%;
}

.tbl-grid-highlight-bar  .--typography-title1,
.tbl-grid-highlight-bar  .--typography-title2,
.tbl-grid-highlight-bar  .--typography-title3{
    margin-bottom: 24px;
}

@media screen and (max-width: 639px){
    
    .tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid{
        display: grid;
        grid-template-columns: calc(100%/3) calc(100%/3) calc(100%/3);
        margin-bottom: -24px;
    }

    .tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid > div{
        margin-right: 12px;
        margin-left: 12px;

         margin-bottom: 24px;
    }

    .tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid{
        margin-left: -12px;
        margin-right: -12px;
    }

}

@media screen and (max-width: 480px){
    .tbl-grid-highlight-bar .tbl-grid-highlight-bar__grid > div {
        margin-right: 5px;
        margin-left: 5px;
        margin-bottom: 10px;
    }
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TBL CHIPS

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-chips{
    width: 100%;
    overflow: hidden;
}

.tbl-chips .--chip
{
    white-space: nowrap;
}

.tbl-chips .swiper{
    overflow: visible;
    max-width: 1840px;
}

.tbl-chips .--typography-title1,
.tbl-chips .--typography-title2,
.tbl-chips .--typography-title3{
    margin-bottom: 24px;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    SWIPER

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-module .swiper,
.tbl-module.swiper
{
    visibility: hidden;
    padding-left: 0px;
    padding-right: 0px;
}

.tbl-module .swiper.--swiper-initialized,
.tbl-module.swiper.--swiper-initialized
{
    visibility: visible;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    AEM PRODUCT CAROUSEL

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


section.product-carousel
{
    padding-left: 40px;
    padding-right: 40px;
    max-width: 1920px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
}


.productcarousel.section
{
    max-width: 1920px;
    margin: 0px auto;
}


.productcarousel.section .component-title .header{
    max-width: calc(100% - 120px);
    text-align: left;
}

section.product-carousel .product.teaser
{
    padding: 0px 0px 0px 0px;
}

section.product-carousel button.cycle-next.icon-arrow-right-indicator-open
{
    top: -18px !important;
    right: 0px;
    left: auto;
    border-radius: 50%;
    margin: 0px !important;
    transform: translateY(-100%);
    background-color: #d8d8d8;
}

section.product-carousel button.cycle-prev.icon-arrow-left-indicator-open
{
    top: -18px !important;
    right: 0px;
    left: auto;
    border-radius: 50%;
    transform: translateY(-100%);
    margin: 0px;
    margin-right: 65px;
    background-color: #d8d8d8;
}

section.product-carousel button.cycle-next.icon-arrow-right-indicator-open:before,
section.product-carousel button.cycle-prev.icon-arrow-left-indicator-open:before
{
    color: white;
    font-size: 19px !important;
    line-height: 19px;
    top: 1px;
    position: relative;
    font-weight: bold;
    /*font-family: swiper-icons;*/
    text-transform: none!important;
    letter-spacing: 0;
    font-variant: initial;
}

section.product-carousel button.cycle-prev.icon-arrow-left-indicator-open:before
{
    /*content: 'prev' !important;*/
}

section.product-carousel button.cycle-next.icon-arrow-right-indicator-open:before
{
    /*content: 'next' !important;*/
}

section.product-carousel > div > div > div
{
    max-width: 1920px !important;
    width: 100% !important;
}

section.product-carousel > div > div
{
    padding: 0px !important;
}

section.product-carousel .slide .product-wrapper
{
    padding: 0px;
    padding-left: 4px;
    padding-right: 4px;
}

section.product-carousel{
    margin-left: -4px;
    margin-right: -4px;
}

/*section.product-carousel .slide:not([aria-hidden="false"]) + [aria-hidden="false"] .product-wrapper
{
    padding-left: 0px;
}
*/

section.product-carousel .button.quickview-button.open-dialog-js
{
    display: none !important;
}

section.product-carousel  .product.teaser .view
{
    margin-bottom: 20px;
}

section.product-carousel .product.teaser .info
{
    text-align: left;
}

section.product-carousel .product.teaser .title
{
    font-family: 'nt-bau-mono-regular' !important;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0px;
    color:#2a2a2a;
}

section.product-carousel .product.teaser .price
{
    font-family: 'nt-bau-mono-bold' !important;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0px;
    color:#2a2a2a;
}

section.product-carousel .component-title .header:after
{
    display: none;
}

section.product-carousel  .row.component-title
{
    width: 100%;
    max-width: 100%;
    margin-bottom: 24px;
    font-size: 32px;
    line-height: 40px;
    font-family: :
}

section.product-carousel  .row.component-title > .columns
{
    margin: 0px;
    padding: 0px;
    text-align: left;
}

@media screen and (max-width:1023px)
{
    section.product-carousel
    {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TBL SINGLE ELEMENT CAROUSEL
    *JS LIBRARY TBL-SINGLE-ELEMENT-CAROUSEL IS REQUIRED

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-single-element-carousel{
    width: 100%;
    height: auto;
}

.tbl-single-element-carousel .swiper-pagination{
    display: flex;
    position: absolute;
    width: 100%;
    max-width:50%;
    height: 5px;
    top: 15px;
    left: 50% !important;
    transform: translateX(-50%);
}

.tbl-single-element-carousel .swiper-pagination-bullet{
    width: 100%;
    border-radius: 2.5px;
    height: 4px;
    background: rgba(255,255,255, 0.5);
    position: relative;
    opacity: 1;
}


.tbl-single-element-carousel .tbl-single-element-carousel__content{
    max-width: 1920px;
    margin: 0px auto;
}

.tbl-single-element-carousel .swiper-pagination-bullet.swiper-pagination-bullet-active{
    background: rgba(255,255,255, 1);
}

.tbl-single-element-carousel .swiper-slide video,
.tbl-single-element-carousel .swiper-slide img{
    width: 100%;
    height: auto;
}

.tbl-single-element-carousel .swiper-button-next:after,
.tbl-single-element-carousel .swiper-button-prev:after{
    color: white;
    font-size: 22px;
    font-weight: bold;
}

.tbl-single-element-carousel .swiper-button-prev,
.tbl-single-element-carousel .swiper-button-next{
    background-color: rgba(255,255,255,0.3);
    width: 40px;
    height: 40px;
    transform: translateY(-50%);
    margin-top: 0px;
    border-radius: 50%;
}

.tbl-single-element-carousel__swiper-pagination-bullet-progress{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 1px;
    height: 100%;
    background-color: white;
    opacity: 0;
    transition: opacity 250ms ease-in-out;
}

.tbl-single-element-carousel .swiper-pagination-bullet.swiper-pagination-bullet-active .tbl-single-element-carousel__swiper-pagination-bullet-progress{
    opacity: 1;
}

.tbl-single-element-carousel .swiper-pagination-bullet.tbl-single-element-carousel__swiper-pagination-bullet-video{
    background: rgba(255,255,255, 0.5);
}

@media screen and (max-width: 1023px){
    .tbl-single-element-carousel .swiper-pagination{
        max-width: calc(100% - 15px);
    }
}

@media screen and (max-width: 639px){
.tbl-single-element-carousel .tbl-single-element-carousel__content > .tbl-module{
        box-sizing: border-box;
    }
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TBL MULTIPLE ELEMENT CAROUSEL
    *JS LIBRARY TBL-MULTIPLE-ELEMENT-CAROUSEL IS REQUIRED

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-multiple-element-carousel .swiper .swiper-button-next:after,
.tbl-multiple-element-carousel .swiper .swiper-button-prev:after{
    color: white;
    font-size: 22px;
    font-weight: bold;
}

.tbl-multiple-element-carousel .swiper .swiper-button-prev,
.tbl-multiple-element-carousel .swiper .swiper-button-next{
    background-color: #d8d8d8;
    width: 40px;
    height: 40px;
    transform: translateY(-50%);
    margin-top: 0px;
    border-radius: 50%;
    transition: background-color 125ms ease-in-out;
}

.tbl-multiple-element-carousel .swiper .swiper-button-prev:hover,
.tbl-multiple-element-carousel .swiper .swiper-button-next:hover{
    background-color: #362d2e;
}

.tbl-multiple-element-carousel{
    padding-bottom: 85px;
    padding-top: 42.5px;
    width: 100%;
    overflow: hidden;
}

.tbl-multiple-element-carousel .swiper{
    max-width: 1840px;
    overflow: visible;
}

.tbl-multiple-element-carousel .swiper-wrapper{
    margin-top: 42.5px;
}

.tbl-multiple-element-carousel .tbl-multiple-element-carousel--secondary-title{
    margin-top: 25px;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TBL CHIP
    *JS LIBRARY TBL-CHIPS IS REQUIRED

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.tbl-chips ul{
    margin: 0px;
    padding: 0px;
}

.tbl-chips ul li{
    list-style-type: none;
    width: auto;
    display: flex;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    CUSTOM PRODUCT CAROUSEL 1

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.product-carousel-with-image-and-text-1
{
    width: calc(70%);
    margin: 0px;
    padding: 0px;
    position: relative;
    left: 30%;
    top: -12vw;
    margin-bottom: -12%;
}

.--product-carousel-with-image-and-text-1
{
    position: relative;
}

.--product-carousel-with-image-and-text-1 .columns:last-child
{
    position: unset;
}

.--product-carousel-with-image-and-text-1 .columns:last-child > div
{
    position: absolute;
    height: 49%;
    width: calc(58.3% - 48px);
}

@media screen and (max-width: 1023px)
{
    .--product-carousel-with-image-and-text-1 .columns:last-child > div
    {
         width: calc(58.3% - 20px);
    }
}

@media screen and (max-width: 768px)
{

    .--product-carousel-with-image-and-text-1 .tbl-title-paragraph-buttongroup
    {
        position: relative;
        align-items: start;
        text-align: left;
        top: unset;
        transform: unset;
        padding: 0px;
    }

    .--product-carousel-with-image-and-text-1 > div
    {
        width: 100%;
    }

    .--product-carousel-with-image-and-text-1
    {
        display: flex;
        flex-direction: column-reverse;
    }

    
    .--product-carousel-with-image-and-text-1 .columns:last-child
    {
        /*
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
        */
    }
    
    .--product-carousel-with-image-and-text-1 .columns:first-child
    {
        margin-top: 28px;
    }
    
    .--product-carousel-with-image-and-text-1 .columns:last-child > div
    {
        position: relative;
        width: 100%;
        /*
        height: 78%;
        width: 100%;
        left: 20px;
        width: calc(100% - 40px);*/
    }
    

    .product-carousel-with-image-and-text-1
    {
        width: calc(100% - 40px);
        left: 20px;
    }

    section.product-carousel .product-carousel-with-image-and-text-1 button.cycle-prev.icon-arrow-left-indicator-open
    {
        top: 50% !important;
        left: 15px !important;
    }

    section.product-carousel .product-carousel-with-image-and-text-1 button.cycle-next.icon-arrow-right-indicator-open
    {
        top: 50% !important;
        right: 15px !important;
    }
}


