article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
    display: block
}

audio,canvas,progress,video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],template {
    display: none
}

a {
    background-color: transparent
}

a:active,a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: none;
    text-decoration: dotted
}

b,optgroup,strong {
    font-weight: 700
}

sub,sup {
    line-height: 0;
    position: relative
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

hr {
    box-sizing: content-box;
    height: 0;
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee
}

button,input,optgroup,select,textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,select {
    text-transform: none
}

button,html input[type=button],input[type=reset],input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],html input[disabled] {
    cursor: default
}

button::-moz-focus-inner,input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox],input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

textarea {
    overflow: auto
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

*,::after,::before {
    box-sizing: border-box
}

html {
    -webkit-tap-highlight-color: transparent;
    scroll-behavior: smooth;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

button,input,select,textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

figure {
    margin: 0
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto
}

[role=button] {
    cursor: pointer
}

.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px
}

.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9 {
    float: left
}

.col-xs-12 {
    width: 100%
}

.col-xs-11 {
    width: 91.66666667%
}

.col-xs-10 {
    width: 83.33333333%
}

.col-xs-9 {
    width: 75%
}

.col-xs-8 {
    width: 66.66666667%
}

.col-xs-7 {
    width: 58.33333333%
}

.col-xs-6 {
    width: 50%
}

.col-xs-5 {
    width: 41.66666667%
}

.col-xs-4 {
    width: 33.33333333%
}

.col-xs-3 {
    width: 25%
}

.col-xs-2 {
    width: 16.66666667%
}

.col-xs-1 {
    width: 8.33333333%
}

.col-xs-pull-12 {
    right: 100%
}

.col-xs-pull-11 {
    right: 91.66666667%
}

.col-xs-pull-10 {
    right: 83.33333333%
}

.col-xs-pull-9 {
    right: 75%
}

.col-xs-pull-8 {
    right: 66.66666667%
}

.col-xs-pull-7 {
    right: 58.33333333%
}

.col-xs-pull-6 {
    right: 50%
}

.col-xs-pull-5 {
    right: 41.66666667%
}

.col-xs-pull-4 {
    right: 33.33333333%
}

.col-xs-pull-3 {
    right: 25%
}

.col-xs-pull-2 {
    right: 16.66666667%
}

.col-xs-pull-1 {
    right: 8.33333333%
}

.col-xs-pull-0 {
    right: auto
}

.col-xs-push-12 {
    left: 100%
}

.col-xs-push-11 {
    left: 91.66666667%
}

.col-xs-push-10 {
    left: 83.33333333%
}

.col-xs-push-9 {
    left: 75%
}

.col-xs-push-8 {
    left: 66.66666667%
}

.col-xs-push-7 {
    left: 58.33333333%
}

.col-xs-push-6 {
    left: 50%
}

.col-xs-push-5 {
    left: 41.66666667%
}

.col-xs-push-4 {
    left: 33.33333333%
}

.col-xs-push-3 {
    left: 25%
}

.col-xs-push-2 {
    left: 16.66666667%
}

.col-xs-push-1 {
    left: 8.33333333%
}

.col-xs-push-0 {
    left: auto
}

.col-xs-offset-12 {
    margin-left: 100%
}

.col-xs-offset-11 {
    margin-left: 91.66666667%
}

.col-xs-offset-10 {
    margin-left: 83.33333333%
}

.col-xs-offset-9 {
    margin-left: 75%
}

.col-xs-offset-8 {
    margin-left: 66.66666667%
}

.col-xs-offset-7 {
    margin-left: 58.33333333%
}

.col-xs-offset-6 {
    margin-left: 50%
}

.col-xs-offset-5 {
    margin-left: 41.66666667%
}

.col-xs-offset-4 {
    margin-left: 33.33333333%
}

.col-xs-offset-3 {
    margin-left: 25%
}

.col-xs-offset-2 {
    margin-left: 16.66666667%
}

.col-xs-offset-1 {
    margin-left: 8.33333333%
}

.col-xs-offset-0 {
    margin-left: 0
}

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 276px;
    padding: 1px;
    font-style: normal;
    line-break: auto;
    text-align: left;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    white-space: normal;
    font-size: 14px;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 6px;
    box-shadow: 0 5px 10px rgba(0,0,0,.2)
}

.popover.top {
    margin-top: -10px
}

.popover.right {
    margin-left: 10px
}

.popover.bottom {
    margin-top: 10px
}

.popover.left {
    margin-left: -10px
}

.popover>.arrow {
    border-width: 11px
}

.popover>.arrow,.popover>.arrow::after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.popover>.arrow::after {
    content: "";
    border-width: 10px
}

.popover.top>.arrow {
    bottom: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-color: rgba(0,0,0,.25);
    border-bottom-width: 0
}

.popover.top>.arrow::after {
    bottom: 1px;
    margin-left: -10px;
    content: " ";
    border-top-color: #fff;
    border-bottom-width: 0
}

.popover.right>.arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-right-color: rgba(0,0,0,.25);
    border-left-width: 0
}

.popover.right>.arrow::after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: #fff;
    border-left-width: 0
}

.popover.bottom>.arrow {
    top: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-width: 0;
    border-bottom-color: rgba(0,0,0,.25)
}

.popover.bottom>.arrow::after {
    top: 1px;
    margin-left: -10px;
    content: " ";
    border-top-width: 0;
    border-bottom-color: #fff
}

.popover.left>.arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-right-width: 0;
    border-left-color: rgba(0,0,0,.25)
}

.popover.left>.arrow::after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-right-width: 0;
    border-left-color: #fff
}

.popover-title {
    padding: 8px 14px;
    margin: 0;
    font-size: 14px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-radius: 5px 5px 0 0
}

.popover-content {
    padding: 9px 14px
}

.clearfix::after,.clearfix::before,.container-fluid::after,.container-fluid::before,.container::after,.container::before,.row::after,.row::before {
    display: table;
    content: " "
}

.clearfix::after,.container-fluid::after,.container::after,.row::after {
    clear: both
}

.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto
}

.pull-right {
    float: right!important
}

.pull-left {
    float: left!important
}

.hide {
    display: none!important
}

.show {
    display: block!important
}

.invisible {
    visibility: hidden
}

.text-hide {
    font-size: 0;
    line-height: 0;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0
}

.hidden {
    display: none!important
}

a,abbr,acronym,address,applet,big,blockquote,body,caption,cite,code,dd,del,dfn,div,dl,dt,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,iframe,img,input,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,small,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,ul,var {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline
}

#wrapper {
    overflow: hidden
}

main .container-fluid {
    padding: 0 18px;
    max-width: 1440px;
    margin: auto
}

main .container-fluid .row {
    margin: 0 -6px
}

header {
    margin-bottom: 12px
}

[class^=col-] {
    padding-left: 0;
    padding-right: 0
}

body {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    position: relative;
    overflow: auto;
    background: #f2f3f5;
    width: 100%
}

body .anchor {
    display: block;
    padding-top: 170px;
    margin-top: -170px
}

body.on-page-editor {
    background: #f2f3f5!important
}

body.on-page-editor span {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

body.on-page-editor .anchor {
    padding-top: 0;
    margin-top: 0
}

.xa-variable {
    border: 0;
    padding: 1px;
    margin: 0;
    background-color: #ebebe4;
    color: #545454;
    user-select: none;
    pointer-events: none
}

#breadcrumbMenuSubcontrol_context_menu * {
    box-sizing: initial
}

.component .h1,.component h1 {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 2rem;
    line-height: 1.29;
    color: #002d72;
    text-transform: uppercase
}

.component .h2,.component h2 {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.625rem;
    line-height: 1.29;
    color: #002d72;
    text-transform: uppercase
}

.component .h3,.component h3 {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.25rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit
}

.component .h4,.component .h5,.component h4,.component h5 {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit
}

.component .copy,.component ol li,.component p,.component ul li {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.component .strong,.component ol li strong,.component strong,.component ul li strong {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.component .link,.component a {
    font-family: Lato,sans-serif;
    /* font-weight: 700; */
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: none
}

.component .link:active,.component .link:hover,.component a:active,.component a:hover {
    color: #0059e4;
    cursor: pointer
}

.component .link:focus-visible,.component a:focus-visible {
    outline: #000 auto 1px
}

.component .small,.component small {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.component .btn-primary {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    display: inline-block;
    background-color: #0059e4;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #0059e4;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms
}

.component .btn-primary:hover {
    color: #fff;
    background-color: #0047b6;
    border-color: #0047b6
}

.component .btn-primary span {
    color: inherit;
    font-weight: inherit
}

.component .btn-white {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #0059e4;
    text-transform: inherit;
    display: inline-block;
    background-color: #fff;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #fff;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms
}

.component .btn-white:hover {
    color: #0059e4;
    background-color: #e6f0ff;
    border-color: #e6f0ff
}

.component .btn-link,.component .view-all-link {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: underline;
    display: inline-block;
    padding: 10px 0
}

.component .btn-link:active,.component .btn-link:hover,.component .view-all-link:active,.component .view-all-link:hover {
    color: #0059e4;
    cursor: pointer
}

.component .bold-link {
    font-weight: 700
}

.component .btn-link-small {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: underline;
    display: inline-block;
    padding: 10px 0
}

.component .btn-link-small:active,.component .btn-link-small:hover {
    color: #0059e4;
    cursor: pointer
}

.component .btn-secondary {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #0059e4;
    text-transform: inherit;
    display: inline-block;
    background-color: #e6f0ff;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #e6f0ff;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms
}

.component .btn-secondary:hover {
    color: #0059e4;
    background-color: #b3d1ff;
    border-color: #b3d1ff
}

.component .btn-outline {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #0059e4;
    text-transform: inherit;
    display: inline-block;
    background-color: #fff;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #0059e4;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms
}

.component .btn-outline:hover {
    color: #fff;
    background-color: #0059e4;
    border-color: #0059e4
}

.component .btn-full {
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center
}

.component .btn-sm {
    padding: 0 8px;
    line-height: 28px
}

.component .stretched-link::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.component .badge {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    text-transform: uppercase;
    box-sizing: border-box;
    line-height: 1.5;
    padding: 0 5px;
    font-size: .781rem;
    height: auto;
    background: #fff;
    color: #002d72;
    border-radius: 2px;
    text-align: center;
    display: inline-block
}

.component .badge-primary {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    text-transform: uppercase;
    box-sizing: border-box;
    line-height: 1.5;
    padding: 0 5px;
    font-size: .781rem;
    height: auto;
    background: #002d72;
    color: #fff;
    border-radius: 2px;
    text-align: center;
    display: inline-block
}

.component .badge-promo {
    background: #af3375;
    color: #fff
}

.component .comp-box {
    background: #fff;
    border-radius: 2px;
    margin-bottom: 12px;
    overflow: hidden
}

.component .comp-box.hover-shadow {
    overflow: visible
}

.component .text-center {
    text-align: center
}

.component .ratio {
    position: relative;
    width: 100%
}

.component .ratio>* {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.component .ratio-1x1 {
    display: block;
    padding-top: 100%;
    content: ""
}

.component .ratio-16x9 {
    display: block;
    padding-top: 56.25%;
    content: ""
}

.component .no-wrap {
    white-space: nowrap
}

.comp-box {
    background: #fff;
    border-radius: 2px;
    margin-bottom: 12px;
    overflow: hidden
}

.comp-box.hover-shadow {
    overflow: visible
}

.plus-minus-icon {
    position: relative;
    width: 18px;
    height: 18px;
    margin-right: 15px;
    display: inline-block
}

.plus-minus-icon::after,.plus-minus-icon::before {
    content: "";
    position: absolute;
    background: #0059e4;
    border-radius: 2px
}

.plus-minus-icon::before {
    width: 2px;
    height: 100%;
    left: 50%;
    margin-left: -1px
}

.plus-minus-icon::after {
    top: 50%;
    width: 100%;
    height: 2px;
    margin-top: -1px
}

.plus-minus-icon.minus::before {
    display: none
}

.swipable {
    transition: .25s;
    justify-content: flex-start;
    scrollbar-width: none;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    overscroll-behavior: auto;
    overflow-y: hidden;
    overflow-x: scroll
}

.swipable::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0
}

.swipable-arrows {
    position: relative
}

.swipable-arrows .btn-left,.swipable-arrows .btn-right {
    position: absolute;
    top: 0;
    width: 60px;
    height: 100%;
    z-index: 2;
    cursor: pointer;
    opacity: 0;
    transition: opacity 150ms
}

.swipable-arrows .btn-left.small,.swipable-arrows .btn-right.small {
    width: 48px
}

.swipable-arrows .btn-left:after,.swipable-arrows .btn-right:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 36px;
    height: 36px;
    margin: -18px 0 0 -18px;
    background-image: url(https://cdn.metro-online.com/nextcms/svgs/right_hover.svg)
}

.swipable-arrows .btn-left:before,.swipable-arrows .btn-right:before {
    content: "";
    position: absolute;
    transition: 150ms ease-in-out;
    opacity: 1;
    top: 5%;
    height: 90%;
    border-radius: 100%;
    box-shadow: 0 0 12px rgba(0,0,0,.5);
    width: 24px
}

.swipable-arrows .btn-left {
    left: 0;
    background: linear-gradient(90deg,#f2f3f5 0,rgba(242,245,248,.8) 100%)
}

.swipable-arrows .btn-left.white {
    background: linear-gradient(180deg,#fff 0,rgba(242,245,248,.8) 100%)
}

.swipable-arrows .btn-left:after {
    transform: rotate(180deg)
}

.swipable-arrows .btn-left:before {
    right: 0;
    clip: rect(auto 36px auto 24px)
}

.swipable-arrows .btn-right {
    right: 0;
    background: linear-gradient(-90deg,#f2f3f5 0,rgba(242,245,248,.8) 100%)
}

.swipable-arrows .btn-right.white {
    background: linear-gradient(-180deg,#fff 0,rgba(242,245,248,.8) 100%)
}

.swipable-arrows .btn-right:before {
    left: 0;
    clip: rect(auto 0 auto -12px)
}

.swipable-arrows:focus-within .btn-left,.swipable-arrows:focus-within .btn-right,.swipable-arrows:hover .btn-left,.swipable-arrows:hover .btn-right {
    opacity: 1
}

.hover-shadow {
    position: relative
}

.hover-shadow::after,.hover-shadow::before,.hover-shadow:focus-within::after,.hover-shadow:focus-within::before {
    content: "";
    position: absolute;
    transition: 150ms ease-in-out;
    opacity: 0;
    left: 0;
    top: 5%;
    height: 90%;
    border-radius: 100%;
    box-shadow: 0 0 12px rgba(0,0,0,.5);
    width: 24px;
    clip: rect(auto 0 auto -12px)
}

.hover-shadow::after,.hover-shadow:focus-within::after {
    left: auto;
    right: 0;
    clip: rect(auto 36px auto 24px)
}

.hover-shadow:focus-within,.hover-shadow:hover {
    z-index: 1
}

.hover-shadow:focus-within::after,.hover-shadow:focus-within::before,.hover-shadow:hover::after,.hover-shadow:hover::before {
    opacity: 1
}

.hover-shadow[data-label=""]::after,.hover-shadow[data-label=""]::before {
    display: none
}

.form-hover-shadow::after,.form-hover-shadow::before {
    content: "";
    opacity: 0;
    box-shadow: 0 0 12px rgba(0,0,0,.5);
    clip-path: inset(-20px 0 20px 0)
}

.form-hover-shadow::after {
    top: auto;
    clip-path: inset(20px 0 -20px 0)
}

.form-hover-shadow:focus-within::before,.form-hover-shadow:hover::before {
    opacity: 1
}

.form-hover-shadow:focus-within::after,.form-hover-shadow:hover::after {
    opacity: 1
}

.ncms-webcomp {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.ncms-webcomp button {
    font: inherit
}

.content-component h4.accordion-item-label {
    margin: 0
}

.content-component.accordion-component {
    text-align: unset
}

.accordion-item {
    width: 100%;
    border-bottom: 1px solid #ccd5e2
}

.accordion-item:last-child {
    border: none
}

.accordion-item-label {
    display: flex;
    justify-content: space-between;
    padding: 16px 0;
    cursor: pointer;
    border: 2px
}

.accordion-item-label-button {
    border: 0;
    background: 0 0;
    text-align: left;
    padding: 0 24px 0 0;
    width: 100%;
    display: block;
    position: relative;
    color: inherit;
    text-transform: inherit;
    text-rendering: inherit;
    cursor: inherit
}

.accordion-item-label-button:focus-visible {
    outline: #000 solid 2px;
    border-radius: 2px
}

.accordion-item-label-button::after {
    content: "";
    background: url(//cdn.metro-group.com/nextcms/svgs/down.svg) center no-repeat;
    position: absolute;
    right: 0;
    top: 6px;
    width: 20px;
    height: 20px;
    transition: transform .35s ease-in-out;
    transform: rotate(0)
}

.accordion-item-label-button[aria-expanded=true]::after {
    transform: rotate(180deg)
}

.accordion-item-content {
    max-height: 0;
    transition: .25s ease-in-out;
    overflow: hidden;
    text-align: left
}

.accordion-item-content.expanded {
    max-height: 500vh;
    padding-bottom: 24px
}

.accordion-item .accordion-description h5 {
    margin-bottom: 16px
}

.accordion-item .accordion-description p {
    margin: 0
}

.action-teaser {
    position: relative;
    margin-bottom: 12px
}

.action-teaser .action-panel-body {
    display: block;
    border-radius: 2px;
    background: #002d72;
    overflow: hidden
}

.action-teaser .action-main {
    height: 100%;
    position: relative;
    overflow: hidden
}

.action-teaser .action-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    vertical-align: middle;
    padding-top: 129px;
    min-height: 180px
}

.action-teaser .action-content {
    position: absolute;
    padding: 36px 0;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center
}

.action-teaser .action-content .h2 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: rgba(255,255,255,.7);
    padding: 0 24px;
    margin-bottom: 10px
}

.action-teaser .badge {
    margin: 0 10% 12px
}

.action-teaser .inner-title {
    color: #fff;
    margin-left: 7px
}

.action-teaser .action-teaser-body {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #fff;
    padding: 0 24px
}

.action-teaser .inner-body:not(:empty) {
    margin-left: 5px
}

.action-teaser .btn-primary,.action-teaser .btn-white {
    display: block;
    margin: 18px 12px 0
}

.action-teaser .sec-btn>div {
    margin-top: 12px
}

.action-teaser.full-width .action-panel-body {
    height: auto
}

.action-teaser.full-width .action-content {
    position: relative
}

.action-teaser.full-width .action-main img {
    opacity: .4;
    padding: 12px
}

.action-teaser.dark-blue .action-content,.action-teaser.light-blue .action-content,.action-teaser.white .action-content {
    position: relative
}

.action-teaser.light-blue .action-panel-body {
    background: #0059e4
}

.action-teaser.white .action-panel-body {
    background: #fff
}

.action-teaser.white .action-teaser-body,.action-teaser.white .h2,.action-teaser.white .inner-body,.action-teaser.white .inner-title {
    color: #002d72
}

.action-teaser.dark-blue .inner-title {
    margin: 0;
    color: #fff
}

.action-teaser.dark-blue .action-teaser-body {
    color: #fff
}

.action-teaser.dark-blue .inner-body {
    margin-left: 0;
    display: block;
    color: #fff;
    line-height: 1.5
}

.action-teaser-row.action-teaser-multiple-column {
    margin-bottom: 12px
}

.action-teaser-row.action-teaser-multiple-column .column-splitter {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.action-teaser-row.action-teaser-multiple-column .column-splitter>div {
    padding: 0
}

.action-teaser-row.action-teaser-multiple-column .column-splitter .teaser-wrapper {
    flex: 1 1 50%
}

.action-teaser-row.action-teaser-multiple-column .column-splitter .action-teaser-title {
    padding: 0
}

.action-teaser-row.action-teaser-multiple-column .column-splitter .action-teaser {
    height: 100%;
    margin: 0
}

.action-teaser-row.action-teaser-multiple-column .column-splitter .action-teaser.full-width,.action-teaser-row.action-teaser-multiple-column .column-splitter .action-teaser.light-blue,.action-teaser-row.action-teaser-multiple-column .column-splitter .action-teaser.white {
    flex-grow: 1;
    box-sizing: border-box;
    max-width: 100%
}

.action-teaser-row.action-teaser-multiple-column .column-splitter .action-teaser-body,.action-teaser-row.action-teaser-multiple-column .column-splitter .h2 {
    margin-left: 0;
    margin-right: 0
}

.icon-action-teasers .icon-action-teaser {
    background: #cce0ff;
    transition: background-color 150ms ease-in-out
}

.icon-action-teasers .icon-action-teaser img {
    width: 30px;
    height: 30px;
    margin-right: 12px
}

.icon-action-teasers .icon-action-teaser h5 {
    font-size: 13px
}

.icon-action-teasers .icon-action-teaser a {
    display: block;
    height: 100%
}

.icon-action-teasers .icon-action-teaser .action-panel-body {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 15px 24px
}

.icon-action-teasers .action-teaser-body,.icon-action-teasers .btn-primary {
    display: none
}

.alc-consent {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 12px;
    backdrop-filter: blur(8px);
    height: 100%;
    display: flex;
    flex-direction: column
}

.alc-consent.alc-init {
    background: rgba(0,45,114,.5)
}

.alc-consent.alc-init .content>div.decline,.alc-consent.alc-init .content>h4.decline {
    display: none
}

.alc-consent.alc-decline {
    background: rgba(222,53,27,.8)
}

.alc-consent.alc-accept,.alc-consent.alc-decline .buttons,.alc-consent.alc-decline .content>div:not(.decline),.alc-consent.alc-decline .content>h4:not(.decline) {
    display: none
}

.alc-consent .content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: auto
}

.alc-consent .content>h4 {
    color: #fff;
    display: block
}

.alc-consent .content>div {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: inherit;
    color: #fff;
    display: none
}

.alc-consent .buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px
}

.alc-consent .buttons>button {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    display: inline-block;
    background-color: rgba(0,0,0,0);
    border-radius: 2px;
    text-align: center;
    padding: 8px 16px;
    border: 2px solid #fff;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms;
    width: 100%;
    height: 100%;
    font-size: 1rem
}

.alc-consent .buttons>button:hover {
    color: #fff;
    background-color: rgba(255,255,255,.2);
    border-color: #fff
}

.become-a-customer {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: #fff;
    border-radius: 2px;
    padding: 0 12px 36px;
    margin-bottom: 12px
}

.become-a-customer a {
    display: block;
    text-decoration: none;
    color: #0059e4
}

.become-a-customer .headline {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.625rem;
    line-height: 1.29;
    color: #002d72;
    text-transform: uppercase;
    margin-top: 28.72px;
    margin-bottom: 4.72px;
    padding: 0 12px
}

.become-a-customer .subheadline {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    padding: 0 12px
}

.become-a-customer .desc {
    padding: 0 12px
}

.become-a-customer .desc .documents {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit
}

.become-a-customer .cta {
    display: inline-flex;
    width: 100%;
    justify-content: center;
    flex-direction: column
}

.become-a-customer .cta .sec-link {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #0059e4;
    text-transform: inherit;
    display: inline-block;
    background-color: #e6f0ff;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #e6f0ff;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms;
    display: flex;
    width: 100%;
    margin: 12px 0 0;
    justify-content: center
}

.become-a-customer .cta .sec-link:hover {
    color: #0059e4;
    background-color: #b3d1ff;
    border-color: #b3d1ff
}

.become-a-customer .cta .sec-link img {
    height: 24px;
    width: 24px;
    margin-right: 8px
}

.become-a-customer .sec-label {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit
}

.become-a-customer .signup-link {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    background-color: #0059e4;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #0059e4;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms;
    margin-top: 42px;
    display: inline-block;
    width: 100%
}

.become-a-customer .signup-link:hover {
    color: #fff;
    background-color: #0047b6;
    border-color: #0047b6
}

.become-a-customer .login-text {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin-top: 12.995px;
    padding: 0 12px
}

.become-a-customer .login-link {
    padding: 0 12px
}

.become-a-customer .step-container {
    display: flex;
    flex-direction: column;
    margin-top: 31px;
    justify-content: space-around;
    width: 100%
}

.become-a-customer .step-container .step {
    text-align: center;
    display: flex;
    flex-direction: column;
    padding: 0 6px;
    margin-bottom: 32px
}

.become-a-customer .step-container .step .icon-cont {
    margin-bottom: 12px
}

.become-a-customer .step-container .step .icon-cont.fsd-icon img {
    height: 60px;
    width: auto
}

.become-a-customer .step-container .step .icon-cont img {
    height: 128px;
    width: auto
}

.become-a-customer .step-container .step .step-title {
    font-weight: 700
}

.blog-header.content {
    background: #fff
}

.blog-header.content .author-date-section {
    padding-top: 12px;
    padding-bottom: 12px
}

.blog-header.content .author-date-section .field-by-label {
    padding: 0 4px
}

.blog-header.content .timetoread-section {
    padding-bottom: 12px
}

.blog-footer {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    max-width: 1440px;
    text-align: center;
    padding: 24px 12px;
    background: #fff;
    margin-bottom: 12px;
    border-radius: 2px
}

.blog-footer span {
    font-style: normal
}

.blog-footer span.field-last-updated-label::after,.blog-footer span.field-opening-bracket::before,.blog-footer span.field-published-in-label::after,.blog-footer span.field-release-date-label::after {
    content: " "
}

.blog-footer .category {
    margin-bottom: 12px
}

.blog-footer .category .facet-list {
    display: inline-block
}

.blog-footer .category .facet-list .field-title a {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    background: 0 0;
    padding: 0
}

.blog-footer .last-updated {
    margin-bottom: 12px
}

.blog-footer .tags span.tag-links.field-title {
    margin: 0 8px 8px 0;
    display: inline-block
}

.blog-footer .tags .facet-list .field-title a {
    background: #f2f3f5;
    color: #33435b;
    font-size: .8125rem;
    line-height: 1.25rem;
    min-width: 1.25rem;
    padding: .25rem .75rem;
    border-radius: 14px;
    display: inline-block
}

.related-blogs.content {
    margin-bottom: 12px;
    box-sizing: border-box;
    background: #fff;
    padding-top: 12px;
    position: relative;
    border-radius: 2px
}

.related-blogs.content h2 {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.625rem;
    line-height: 1.29;
    color: #002d72;
    text-transform: uppercase;
    margin-top: 10.72px;
    margin-bottom: 24.72px;
    text-align: center;
    padding-left: calc(4.2% + 12px);
    padding-right: calc(4.2% + 12px)
}

.related-blogs.content .field-headline {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    bottom: 19px;
    left: 12px;
    right: 12px;
    text-shadow: 0 0 30px rgba(0,0,0,.5);
    position: absolute;
    z-index: 1
}

.related-blogs.content .blog {
    background: #fff;
    margin-left: 12px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    flex: 0 0 calc(100% - 70px);
    align-items: flex-start;
    position: relative
}

.related-blogs.content .blog a {
    display: block;
    width: 100%
}

.related-blogs.content .blog .field-image {
    font-size: 0
}

.related-blogs.content .blog .field-image img {
    object-fit: cover;
    width: 100%;
    aspect-ratio: 2/1
}

.related-blogs.content .slide a:nth-last-child(1) {
    background: linear-gradient(-180deg,rgba(0,0,0,0) 0,rgba(0,0,0,.68) 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0
}

.blog-carousel-light .slides {
    position: relative;
    width: 100%;
    overflow: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    display: flex
}

.blog-carousel-light .slides::-webkit-scrollbar {
    display: none
}

.blog-carousel-light .slide {
    scroll-snap-align: start;
    margin-bottom: 12px;
    border-radius: 2px;
    overflow: hidden
}

.blog-carousel-light .left,.blog-carousel-light .left-layer,.blog-carousel-light .right,.blog-carousel-light .right-layer {
    background: #f2f5f8;
    flex: 0 0 60px;
    display: flex;
    position: absolute;
    width: 72px;
    z-index: 2;
    opacity: 0;
    border-radius: 0;
    height: auto;
    bottom: 12px;
    top: 88px
}

.blog-carousel-light .left .shadow,.blog-carousel-light .left-layer .shadow,.blog-carousel-light .right .shadow,.blog-carousel-light .right-layer .shadow {
    position: relative;
    flex: 0 0 12px;
    background: radial-gradient(at right 50%,rgba(0,0,0,.2),rgba(0,0,0,.1) 35%,rgba(255,255,255,0) 75%)
}

.blog-carousel-light .left div,.blog-carousel-light .left-layer div,.blog-carousel-light .right div,.blog-carousel-light .right-layer div {
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
    flex: 0 0 60px;
    margin: 0
}

.blog-carousel-light .left svg,.blog-carousel-light .left-layer svg,.blog-carousel-light .right svg,.blog-carousel-light .right-layer svg {
    width: 48px;
    height: 48px
}

.blog-carousel-light .left,.blog-carousel-light .left-layer {
    left: -1px
}

.blog-carousel-light .left .shadow,.blog-carousel-light .left-layer .shadow {
    transform: rotate(180deg)
}

.blog-carousel-light .left div,.blog-carousel-light .left-layer div {
    justify-content: flex-end
}

.blog-carousel-light .right,.blog-carousel-light .right-layer {
    right: -1px
}

.blog-carousel-light .right div,.blog-carousel-light .right-layer div {
    justify-content: flex-start
}

.blog-carousel-light .left,.blog-carousel-light .right {
    background: 0 0
}

.blog-carousel-light .left-layer,.blog-carousel-light .right-layer {
    display: none
}

.blog-carousel-light.interactive .slides {
    padding-right: 12px;
    width: calc(100% + 24px)
}

.blog-carousel-light.interactive .slides::after {
    content: ""
}

.loaded-blogs .search-result-list {
    font-size: 0;
    margin-right: -12px;
    display: flex;
    flex-wrap: wrap
}

.loaded-blogs .search-result-list li {
    display: inline-block;
    margin: 0 12px 12px 0;
    width: calc(100% - 12px)
}

.blog-container-text {
    padding-right: 12px
}

.blog-section-wrapper {
    height: 100%;
    background: #fff;
    padding: 12px;
    display: flex;
    flex-direction: column;
    border-radius: 2px
}

.blog-section-wrapper span {
    font-style: normal
}

.blog-section-wrapper .viewcount-section {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    box-sizing: border-box;
    line-height: 1.5;
    padding: 4px 5px 3px;
    font-size: .781rem;
    height: auto;
    background: rgba(255,255,255,.8);
    color: #33435b;
    border-radius: 2px;
    text-align: center;
    display: inline-block;
    position: absolute;
    right: 12px;
    top: 10px;
    display: flex;
    align-items: center
}

.blog-section-wrapper .viewcount-section::before {
    content: "";
    background-image: url(//cdn.metro-online.com/nextcms/svgs/eye.svg);
    height: 12px;
    width: 12px;
    background-size: 12px;
    margin: -2px 5px 0
}

.blog-section-wrapper .blog-container-image {
    margin-bottom: 12px;
    position: relative
}

.blog-section-wrapper .blog-container-image img {
    width: 100%;
    height: auto;
    aspect-ratio: 2/1;
    object-fit: cover;
    border-radius: 2px;
    overflow: hidden
}

.blog-section-wrapper .date-author-text {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin-bottom: 6px
}

.blog-section-wrapper .field-by-label::after,.blog-section-wrapper .field-by-label::before {
    content: "Â "
}

.blog-section-wrapper .field-headline a {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    margin-bottom: 5.84px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.blog-section-wrapper .field-description {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin-bottom: 6.995px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.blog-section-wrapper .blog-tags .tag-links {
    margin: 0 8px 8px 0;
    display: inline-block
}

.blog-section-wrapper .blog-tags .tag-links>a {
    background: #f2f3f5;
    color: #33435b;
    font-size: .8125rem;
    line-height: 1.25rem;
    min-width: 1.25rem;
    padding: .25rem .75rem;
    border-radius: 14px;
    display: inline-block
}

.blog-section-wrapper .text-blue {
    color: #0059e4
}

.blog-section-wrapper .blog-category {
    margin-bottom: 12px
}

.blog-section-wrapper .blog-category .facet-list {
    display: inline-block
}

.blog-section-wrapper .blog-category .facet-list .component-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.blog-section-wrapper .blog-category .facet-list a {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    background: 0 0;
    padding: 0
}

.blog-section-wrapper .read-overview-section {
    margin-bottom: 12px
}

.blog-section-wrapper .timetoread-section {
    margin-left: 12px
}

.blog-section-wrapper .blog-tags {
    margin-bottom: 12px
}

.blog-section-wrapper .blog-tags .facet-list .component-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.timetoread-section .time-icon {
    display: inline-block;
    width: 18px;
    height: 19px;
    margin-right: 5px;
    background: url(https://cdn.metro-online.com/nextcms/svgs/clock_black.svg) 0 2px/16px no-repeat
}

.timetoread-section .field-by-label::after,.timetoread-section .field-by-label::before,.timetoread-section .field-time-to-read::after,.timetoread-section .field-time-to-read::before,.timetoread-section .time-icon::after,.timetoread-section .time-icon::before {
    content: "Â "
}

.load-more {
    width: 100%;
    background: #fff;
    margin-bottom: 12px;
    position: relative
}

.load-more:after {
    content: "";
    position: absolute;
    width: 19px;
    border-bottom: 2px solid #0059e4;
    top: 30px;
    left: 26px;
    padding-right: 16px
}

.load-more:before {
    content: "";
    position: absolute;
    height: 19px;
    border-right: 2px solid #0059e4;
    top: 22px;
    left: 35px
}

.load-more .button,.load-more input[type=button] {
    font-family: Lato,sans-serif;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    color: #0059e4;
    text-transform: inherit;
    background: 0 0!important;
    position: relative;
    z-index: 1;
    padding: 0 0 0 66px!important;
    border: none!important;
    width: 100%;
    line-height: 64px;
    font-weight: 400;
    text-align: left
}

.load-more .button:hover,.load-more input[type=button]:hover {
    color: #0047b6
}

.custom-tabfilter {
    position: relative;
    margin-bottom: 12px
}

.custom-tabfilter .facet-dropdown-tab {
    display: none;
    background-color: #fff;
    height: 60px;
    scrollbar-width: none;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    border-radius: 2px;
    padding: 0 12px
}

.custom-tabfilter .facet-dropdown-tab::-webkit-scrollbar {
    display: none
}

.custom-tabfilter .paddles {
    display: none
}

.custom-tabfilter .facet-dropdown-select-item {
    padding: 0 12px;
    color: #002d72;
    line-height: 60px;
    font-weight: 900;
    display: inline-block;
    position: relative;
    text-decoration: none
}

.custom-tabfilter .facet-dropdown-select-item:hover {
    color: inherit
}

.custom-tabfilter .facet-dropdown-select-item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px
}

.custom-tabfilter .facet-dropdown-select-item:last-child {
    margin-right: 30px
}

.custom-tabfilter .facet-dropdown-select-item:hover::after {
    border-bottom: 4px solid #e5effe
}

.custom-tabfilter .facet-dropdown-select-item.selected-facet::after,.custom-tabfilter .facet-dropdown-select-item.selected-facet:hover::after {
    border-bottom: 4px solid #0059e4
}

.custom-tabfilter .paddle {
    position: absolute;
    top: 0;
    border: none;
    cursor: pointer;
    height: 60px
}

.custom-tabfilter .paddle::after {
    content: "";
    background-image: url(https://cdn.metro-online.com/nextcms/svgs/arrow-navigation.svg);
    width: 32px;
    height: 33px;
    background-repeat: no-repeat;
    display: block
}

.custom-tabfilter .left-paddle {
    left: 0;
    background: linear-gradient(-90deg,rgba(255,255,255,0) 0,#fff 30%,#fff 100%);
    padding-left: 24px
}

.custom-tabfilter .right-paddle {
    right: 0;
    background: linear-gradient(90deg,rgba(255,255,255,0) 0,#fff 30%,#fff 100%);
    padding-right: 24px
}

.custom-tabfilter .right-paddle::after {
    transform: rotate(180deg)
}

.custom-tabfilter .facet-dropdown-select {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    background: #fff;
    width: 100%;
    display: inline-block;
    outline: 0;
    padding: 5px;
    height: 40px;
    border-radius: 2px
}

.custom-tabfilter+.search-results.loading-in-progress .search-result-overlay::after {
    position: absolute;
    margin: -85% auto 0;
    top: 50%
}

.search-results.loading-in-progress {
    min-height: 50px
}

.search-results.loading-in-progress+.load-more {
    display: none
}

.search-results.loading-in-progress .search-result-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,.1)
}

.search-results.loading-in-progress .search-result-overlay::after {
    content: "";
    background-image: url(https://cdn.metro-online.com/nextcms/svgs/loader.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: fixed;
    width: 50px;
    height: 50px;
    top: 50%;
    left: 0;
    right: 0;
    margin: 60% auto 0
}

.search-results.loading-more-in-progress::after {
    content: "";
    display: block;
    background-image: url(https://cdn.metro-online.com/nextcms/svgs/loader.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 50% 50%;
    height: 100px
}

.search-results.loading-more-in-progress+.load-more {
    display: none!important
}

.search-results .no-results {
    padding: 5px
}

.brand-logo-tiles {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    height: 100%
}

.brand-logo-tiles a,.brand-logo-tiles>div {
    display: flex;
    flex: 1 1 0;
    justify-content: center;
    align-items: center;
    background: #fff;
    padding: 12px;
    height: 90px;
    min-width: calc(33.333% - 10px)
}

.brand-logo-tiles a:nth-child(n+4),.brand-logo-tiles>div:nth-child(n+4) {
    flex: 0 calc(33.333% - 8px)
}

.brand-logo-tiles a>picture,.brand-logo-tiles>div>picture {
    display: block;
    line-height: 0;
    max-width: 66px;
    max-height: 66px
}

.brand-logo-tiles a img,.brand-logo-tiles>div img {
    background-color: rgba(0,0,0,0);
    object-fit: contain;
    max-height: 66px
}

.custom-breadcrumb-component {
    display: none
}

.bucket-header .buckets .site-header-bucket-wrapper.delivery .delivery,.bucket-header .buckets .site-header-bucket-wrapper.externalshop .externalshop,.bucket-header .buckets .site-header-bucket-wrapper.localshop .localshop,.bucket-header .buckets .site-header-bucket-wrapper.marktplatz .marktplatz,.bucket-header .buckets .site-header-bucket-wrapper.mshop .mshop,.bucket-header .buckets .site-header-bucket-wrapper.traders .traders,.bucket-header .buckets .site-header-bucket-wrapper.web .web {
    background-color: #cce0ff;
    border-color: transparent
}

.bucket-header .buckets .site-header-bucket-wrapper.delivery .delivery span,.bucket-header .buckets .site-header-bucket-wrapper.externalshop .externalshop span,.bucket-header .buckets .site-header-bucket-wrapper.localshop .localshop span,.bucket-header .buckets .site-header-bucket-wrapper.marktplatz .marktplatz span,.bucket-header .buckets .site-header-bucket-wrapper.mshop .mshop span,.bucket-header .buckets .site-header-bucket-wrapper.traders .traders span,.bucket-header .buckets .site-header-bucket-wrapper.web .web span {
    color: #002d72
}

.bucket-header .buckets .site-header-bucket-wrapper.delivery .delivery img,.bucket-header .buckets .site-header-bucket-wrapper.externalshop .externalshop img,.bucket-header .buckets .site-header-bucket-wrapper.localshop .localshop img,.bucket-header .buckets .site-header-bucket-wrapper.marktplatz .marktplatz img,.bucket-header .buckets .site-header-bucket-wrapper.mshop .mshop img,.bucket-header .buckets .site-header-bucket-wrapper.traders .traders img,.bucket-header .buckets .site-header-bucket-wrapper.web .web img {
    filter: none
}

img {
    max-width: 100%
}

.ncms-webcomp .bucket-header>.component-content .bucket-header-container .site-header-brand .site-header-bucket-wrapper.is-visible {
    visibility: visible
}

.ncms-webcomp .bucket-header>.component-content .bucket-header-container .site-header-brand .site-header-bucket-wrapper {
    visibility: hidden
}

.ncms-webcomp .site-header-logo img {
    aspect-ratio: 129/32;
    max-width: 100%
}

.bucket-header {
    width: 100%;
    top: 0;
    min-height: 106px
}

.bucket-header>.component-content {
    width: 100%;
    background: #002d72;
    position: fixed;
    z-index: 5
}

.bucket-header .bucket-header-container {
    max-width: 1440px;
    margin: auto;
    display: block!important
}

.bucket-header .site-header-brand {
    flex-wrap: wrap;
    display: flex;
    flex: 0 1
}

.bucket-header .site-header-login,.bucket-header .slots {
    order: 2;
    margin: 0 0 10px auto
}

.bucket-header .mobile-header {
    display: inline-block;
    position: relative;
    overflow-x: auto;
    scroll-behavior: auto;
    overflow-y: hidden;
    white-space: nowrap;
    scrollbar-width: none;
    width: 100%;
    order: 3
}

.bucket-header .mobile-header::-webkit-scrollbar {
    display: none
}

.bucket-header .site-header-bucket-wrapper {
    display: inline-flex;
    height: 48px
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket {
    margin: 0 12px 12px 0;
    padding: 0 12px;
    border: 2px solid #fff;
    border-radius: 30px;
    cursor: pointer;
    text-decoration: none;
    flex-shrink: 0;
    display: inline-block
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket:first-of-type {
    margin-left: 12px
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket:hover {
    background-color: rgba(255,255,255,.3);
    border-color: transparent
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket svg {
    height: 24px;
    width: 24px;
    margin: -2px 12px 0 0;
    vertical-align: middle
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket span {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    color: #fff;
    text-transform: inherit;
    line-height: 32px
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket.active {
    background-color: #cce0ff;
    border-color: transparent
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket.active span {
    color: #002d72
}

.bucket-header .site-header-bucket-wrapper .site-header-bucket.active svg circle,.bucket-header .site-header-bucket-wrapper .site-header-bucket.active svg path {
    stroke: #002d72
}

.bucket-header .scroll-action-container-left,.bucket-header .scroll-action-container-right {
    display: none
}

.bucket-header .site-header-logo {
    width: 96px;
    height: 48px;
    margin: 0 12px;
    display: flex;
    align-items: center;
    order: 1
}

.bucket-header .site-header-logo a {
    display: block;
    line-height: 0
}

.bucket-header .site-header-logo img {
    max-height: 24px;
    margin-top: -4px
}

.bucket-header .site-header-logo .component-content>a>div {
    display: flex;
    align-items: center
}

.bucket-header .buckets {
    flex: auto;
    display: flex;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    order: 3
}

.bucket-header .buckets .component-content,.bucket-header .buckets .mobile-header .component-content {
    display: flex
}

.bucket-header .buckets img {
    height: 24px;
    width: 24px;
    margin: -2px 8px 0 0;
    vertical-align: middle;
    filter: invert(1) contrast(10)
}

.bucket-header .buckets .active img {
    filter: none
}

.bucket-header .buckets .site-header-bucket-wrapper {
    padding-left: 12px
}

.bucket-header .buckets .site-header-bucket-wrapper .site-header-bucket {
    width: max-content;
    margin: 0 12px 12px 0!important
}

.bucket-header .buckets .scroll-action-container-left,.bucket-header .buckets .scroll-action-container-right {
    display: none;
    align-self: center
}

.bucket-header.desktop,.bucket-header.desktop>.component-content {
    height: 64px
}

.bucket-header.desktop .site-header-brand {
    height: 64px;
    flex-wrap: nowrap
}

.bucket-header.desktop .mobile-header {
    display: inline-flex;
    flex: 1
}

.bucket-header.desktop .site-header-bucket-wrapper {
    height: 64px
}

.bucket-header.desktop .site-header-bucket {
    margin: 12px 12px 12px 0;
    padding: 0 24px;
    overflow: unset
}

.bucket-header.desktop .scroll-action-container-left,.bucket-header.desktop .scroll-action-container-left .scroll-action,.bucket-header.desktop .scroll-action-container-right,.bucket-header.desktop .scroll-action-container-right .scroll-action {
    display: block
}

.bucket-header.desktop .site-header-logo {
    height: 64px
}

.bucket-header.desktop .site-header-logo .image {
    width: 129px;
    margin: 20px 48px 0 24px
}

.carousel-light .slides {
    position: relative;
    width: 100%;
    overflow: auto;
    scroll-behavior: smooth;
    scrollbar-width: none
}

.carousel-light .slides::-webkit-scrollbar {
    display: none
}

.carousel-light .slide {
    scroll-snap-align: start
}

.carousel-light .left,.carousel-light .left-layer,.carousel-light .right,.carousel-light .right-layer {
    transition: opacity 250ms ease-in-out,background 250ms ease-in-out;
    background: #f2f5f8;
    flex: 0 0 60px;
    display: flex;
    position: absolute;
    width: 72px;
    height: 100%;
    z-index: 2;
    bottom: 0;
    opacity: 0;
    border-radius: 0
}

.carousel-light .left .shadow,.carousel-light .left-layer .shadow,.carousel-light .right .shadow,.carousel-light .right-layer .shadow {
    position: relative;
    flex: 0 0 12px;
    background: radial-gradient(at right 50%,rgba(0,0,0,.2),rgba(0,0,0,.1) 35%,rgba(255,255,255,0) 75%)
}

.carousel-light .left div,.carousel-light .left-layer div,.carousel-light .right div,.carousel-light .right-layer div {
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
    flex: 0 0 60px;
    margin: 0
}

.carousel-light .left svg,.carousel-light .left-layer svg,.carousel-light .right svg,.carousel-light .right-layer svg {
    width: 48px;
    height: 48px;
    margin: 0
}

.carousel-light .left,.carousel-light .left-layer {
    left: -1px;
    margin-left: -12px
}

.carousel-light .left .shadow,.carousel-light .left-layer .shadow {
    transform: rotate(180deg)
}

.carousel-light .left div,.carousel-light .left-layer div {
    justify-content: flex-end
}

.carousel-light .right,.carousel-light .right-layer {
    right: -1px;
    margin-right: -12px
}

.carousel-light .right div,.carousel-light .right-layer div {
    justify-content: flex-start
}

.carousel-light .left,.carousel-light .right {
    background: rgba(255,255,255,0)
}

.carousel-light .left-layer,.carousel-light .right-layer {
    mix-blend-mode: normal;
    z-index: 1;
    width: 60px;
    height: 140px
}

.carousel-light .right-layer {
    -webkit-mask-image: -webkit-gradient(linear,left top,right top,from(rgba(242,245,248,.8)),to(#f2f3f5))
}

.carousel-light .left-layer {
    -webkit-mask-image: -webkit-gradient(linear,left top,right top,from(#f2f3f5),to(rgba(242,245,248,.8)))
}

.carousel-light.interactive .slides {
    left: -12px;
    right: -12px;
    padding-left: 12px;
    padding-right: 24px;
    width: calc(100% + 24px)
}

.carousel-light.interactive .slides::after {
    content: "";
    padding-right: 12px
}

.catalog-viewer.col-xs-12.initialized {
    padding-left: 0;
    padding-right: 0
}

.catalog-viewer {
    width: 100%;
    display: inline-block;
    border-top: none
}

.catalog-viewer .catalog-overview-title {
    background: #fff;
    padding: 21px
}

.catalog-viewer .catalog-overview-title h2 {
    text-align: center
}

.nav-category {
    background-color: #fff
}

.nav-category .sel-category {
    width: calc(100% - 24px);
    height: 40px;
    border-radius: 2px;
    background-color: #fff;
    border: 1px solid #b2b9c2;
    margin: 12px;
    padding-left: 6px
}

.nav-category .nav-tabs {
    display: none;
    padding-left: 24px;
    background-color: #fff;
    margin-left: -5px;
    margin-right: -6px;
    border-bottom: none
}

.nav-category .nav-item {
    margin-right: 12px;
    float: left;
    position: relative;
    display: block
}

.nav-category .nav-item .nav-link {
    font-weight: 700;
    font-size: 11px;
    color: #0059e4;
    background-color: #fff;
    padding: 0;
    display: block;
    line-height: 3.4rem;
    text-decoration: none
}

.nav-category .nav-item .nav-link:focus,.nav-category .nav-item .nav-link:hover {
    color: #0059e4;
    border-bottom: 4px solid #e5effe;
    background-color: #fff;
    text-decoration: none
}

.nav-category .nav-item .nav-link:focus-visible {
    outline: #000 auto 1px;
    outline-offset: 1px
}

.nav-category .nav-item.active .nav-link,.nav-category .nav-item.active .nav-link:focus,.nav-category .nav-item.active .nav-link:hover {
    color: #002d72;
    border-bottom: 4px solid #002d72;
    cursor: pointer;
    text-decoration: none
}

.tab-content {
    background-color: #f3f4f8;
    padding-bottom: 12px;
    margin-right: -6px
}

.tab-content .tab-pane {
    display: none;
    min-height: 384px
}

.tab-content .tab-pane.active {
    display: block
}

.catalog,.catalogs-search-results li,.upcoming-catalog {
    width: calc(50% - 12px);
    display: inline-grid;
    margin-top: 12px;
    margin-right: 12px
}

.catalogs-container,.catalogs-search-results {
    font-size: 0;
    margin-right: -6px;
    display: flex;
    flex-wrap: wrap
}

.catalogs-container .with-alc-consent,.catalogs-container a,.catalogs-search-results .with-alc-consent,.catalogs-search-results a {
    position: relative;
    display: block;
    min-height: 40px;
    text-decoration: none;
    text-align: left;
    width: 100%;
    height: 100%;
    padding: 12px 12px 28px;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: #002d72;
    background-color: #fff
}

.catalogs-container .with-alc-consent:has(.alc-consent.alc-init,.alc-consent.alc-decline),.catalogs-container a:has(.alc-consent.alc-init,.alc-consent.alc-decline),.catalogs-search-results .with-alc-consent:has(.alc-consent.alc-init,.alc-consent.alc-decline),.catalogs-search-results a:has(.alc-consent.alc-init,.alc-consent.alc-decline) {
    cursor: default
}

.catalogs-container .with-alc-consent:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):active,.catalogs-container .with-alc-consent:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):focus,.catalogs-container .with-alc-consent:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):hover,.catalogs-container a:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):active,.catalogs-container a:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):focus,.catalogs-container a:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):hover,.catalogs-search-results .with-alc-consent:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):active,.catalogs-search-results .with-alc-consent:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):focus,.catalogs-search-results .with-alc-consent:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):hover,.catalogs-search-results a:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):active,.catalogs-search-results a:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):focus,.catalogs-search-results a:not(:has(.alc-consent.alc-init,.alc-consent.alc-decline)):hover {
    background-color: #cce0ff
}

.catalogs-container .catalog-image,.catalogs-search-results .catalog-image {
    position: relative;
    display: flex;
    margin-bottom: 18px;
    justify-content: center;
    padding-top: 140%
}

.catalogs-container .catalog-image img,.catalogs-search-results .catalog-image img {
    position: absolute;
    bottom: 0;
    max-width: 100%;
    max-height: 100%;
    margin-top: auto;
    margin-bottom: 0;
    box-shadow: 0 5px 5px 0 rgba(0,0,0,.1)
}

.catalogs-container .catalog-content,.catalogs-search-results .catalog-content {
    height: auto
}

.catalogs-container span,.catalogs-search-results span {
    color: #002d72;
    font-size: 13px;
    padding-top: 2px;
    font-family: inherit;
    font-style: inherit;
    line-height: 1.5
}

.catalogs-container .upcoming-catalog .upcoming-text,.catalogs-search-results .upcoming-catalog .upcoming-text {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    display: inline-block;
    color: #f2f4f8;
    font-size: 13px;
    line-height: 15px;
    margin-bottom: 6px;
    background-color: #de351a;
    border-radius: 2px;
    padding: 3px 6px 2px;
    text-transform: uppercase
}

.catalogs-container .upcoming-catalog strong,.catalogs-search-results .upcoming-catalog strong {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: inherit;
    color: #002d72;
    display: block;
    overflow: hidden
}

.catalogs-container .catalog strong,.catalogs-search-results li strong {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: inherit;
    color: #002d72;
    overflow: hidden;
    display: block
}

.see-more {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    color: #002d72;
    text-transform: inherit;
    text-decoration: none;
    height: 64px;
    line-height: 64px;
    background: #fff;
    padding-left: 24px;
    margin: 12px 6px 0 0;
    cursor: pointer;
    font-size: 18px;
    display: flex
}

.see-more:active,.see-more:hover {
    color: #0059e4;
    cursor: pointer
}

.see-more .plus-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/plus.svg);
    width: 32px;
    height: 32px;
    margin-right: 12px;
    margin-top: 12px
}

.component.catalogs-search-results.highlighted .no-results {
    height: 64px;
    width: 100%;
    display: inline-block;
    background-color: #fff;
    padding: 24px;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: normal;
    color: #33435b;
    margin-bottom: 12px
}

.catalogs-search-results .search-result-list {
    margin-bottom: 12px;
    padding-top: 0;
    margin-top: -12px
}

.catalogue-teaser {
    width: 100%;
    margin-bottom: 12px
}

.catalogue-teaser .teaser-cont {
    display: flex;
    flex-wrap: wrap;
    flex: 0 0 auto;
    padding: 32px 12px
}

.catalogue-teaser .teaser-cont>a {
    margin: 0 6px;
    width: calc(50% - 12px)
}

.catalogue-teaser .teaser-cont>a:not([href]) {
    display: none
}

.catalogue-teaser .catalogue-image {
    text-align: center
}

.catalogue-teaser .catalogue-image img {
    display: block;
    max-width: 100%;
    height: auto
}

.catalogue-teaser .h5 {
    margin: 17px 0 11px;
    display: block
}

.category-teaser {
    position: relative;
    border-radius: 2px
}

.category-teaser a {
    text-decoration: none
}

.category-teaser a:empty,.category-teaser a:not([href]),.category-teaser a[href=""] {
    cursor: default
}

.category-teaser a:empty .hover-shadow::after,.category-teaser a:empty .hover-shadow::before,.category-teaser a:not([href]) .hover-shadow::after,.category-teaser a:not([href]) .hover-shadow::before,.category-teaser a[href=""] .hover-shadow::after,.category-teaser a[href=""] .hover-shadow::before {
    display: none
}

.category-teaser .plus-icon {
    margin-right: 12px;
    width: 20px;
    height: 2px;
    border-radius: 1px;
    position: relative;
    background: #002d72
}

.category-teaser .plus-icon:after {
    content: "";
    background: #002d72;
    border-radius: 1px;
    position: absolute;
    top: -9px;
    left: 9px;
    width: 2px;
    height: 20px
}

.category-teaser-more.category-teaser .component-content {
    background: #cce0ff;
    color: #002d72
}

.category-teaser-more .title {
    font-weight: 700
}

.category-teaser .component-content {
    background-color: #fff;
    position: relative;
    border-radius: 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 48px
}

.category-teaser .teaser-target {
    height: 100%;
    width: 100%;
    display: block
}

.category-teaser .title {
    padding: 6px 12px;
    display: block;
    color: #002d72
}

.category-teaser .title-bottom {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

.category-teaser .title-top {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    font-weight: 700
}

.category-teaser .teaser-image {
    line-height: 0
}

.category-teaser img {
    width: 30px;
    height: 30px;
    margin-right: 12px
}

.category-teaser.blue .component-content {
    background: #0059e4
}

.category-teaser.blue .component-content .title,.category-teaser.blue .component-content .title-bottom,.category-teaser.blue .component-content .title-top {
    color: #fff
}

.component-category-teaser-row {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    padding: 0;
    width: calc(100% + 11px)
}

.component-category-teaser-row .category-teaser-set {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    flex: 0 1 100%
}

.component-category-teaser-row .content-section-title {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    margin-top: 25.84px;
    margin-bottom: 11.84px;
    padding-left: 12px;
    padding-right: 12px;
    flex: 1 0;
    display: block
}

.component-category-teaser-row .category-teasers {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%
}

.component-category-teaser-row .category-teaser {
    flex: 0 1 50%;
    padding: 0 12px 12px 0
}

.category-icon-carousel .category-teaser {
    display: none
}

.category-icon-carousel .category-teaser-more,.category-icon-carousel .category-teaser:nth-child(1),.category-icon-carousel .category-teaser:nth-child(2),.category-icon-carousel .category-teaser:nth-child(3),.category-icon-carousel.show-all .category-teaser {
    display: block
}

.category-icon-carousel.show-all .category-teaser-more {
    display: none
}

.category-teaser-carousel {
    margin: 0 -12px 12px;
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + 24px);
    gap: 12px;
    padding-left: 12px
}

.category-teaser-carousel .component-content {
    width: 100%;
    padding: 0;
    min-height: 48px;
    height: 100%
}

.category-teaser-carousel .category-teaser-wrapper {
    display: flex
}

.category-teaser-carousel .section-title {
    padding-right: 18px
}

.category-teaser-carousel .category-teaser {
    flex: 0 0 calc(50% - 12px)
}

.category-teaser-carousel .category-teaser::after {
    right: 12px
}

.column-splitter {
    max-width: none
}

.column-splitter>div {
    padding-left: 6px;
    padding-right: 6px
}

.component.container {
    padding: 12px;
    background: #fff;
    margin: 0 0 12px;
    width: auto;
    border-radius: 2px
}

.component.container .component-content::after {
    content: "";
    display: table;
    clear: both
}

.component.container .component-content .component:not(.anchor) {
    padding: 0
}

.component.container .component-content .component:not(.anchor) .component-content {
    padding: 0;
    margin: 0
}

.content-component {
    padding: 0
}

.content-component .main-cont {
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 0 12px
}

.content-component .btn-outline,.content-component .btn-primary {
    width: 100%;
    margin: 10px auto 0
}

.content-component .btn-outline {
    margin-top: 24px
}

.content-component .h2 {
    margin-top: 28.72px;
    margin-bottom: 12.72px
}

.content-component .h3 {
    margin-bottom: 13.3px
}

.content-component .field-body,.content-component .h2 {
    padding: 0 12px
}

.content-component .image-wrapper {
    line-height: 0;
    margin-bottom: 16px;
    display: block
}

.content-component .image-wrapper img {
    width: 100%;
    border-radius: 2px;
    height: 209px;
    object-fit: cover
}

.content-component .teaser-cont {
    text-align: left;
    display: flex;
    margin: 29px 0 0
}

.content-component .teaser-cont:empty {
    margin-top: 20px
}

.content-component .teaser-cont.full-width {
    flex-wrap: wrap;
    margin: 30px 0 0
}

.content-component .teaser-cont.full-width>div {
    width: 100%;
    flex: 0 1 100%;
    margin: 0 0 26px
}

.content-component .teaser-cont.image-left,.content-component .teaser-cont.image-left-right,.content-component .teaser-cont.image-right {
    flex-direction: column;
    margin: 0;
    padding-top: 41px
}

.content-component .teaser-cont.image-left .image-wrapper,.content-component .teaser-cont.image-left-right .image-wrapper,.content-component .teaser-cont.image-right .image-wrapper {
    width: 100%;
    margin: 0 0 36px
}

.content-component .teaser-cont.image-left img,.content-component .teaser-cont.image-left-right img,.content-component .teaser-cont.image-right img {
    max-height: 500px;
    height: auto;
    object-fit: contain
}

.content-component .teaser-cont.image-left .details-wrapper,.content-component .teaser-cont.image-left-right .details-wrapper,.content-component .teaser-cont.image-right .details-wrapper {
    width: 100%;
    padding-bottom: 41px
}

.content-component .teaser-cont h4 {
    margin-top: 16px;
    margin-bottom: 10px
}

.content-component .teaser-cont ol,.content-component .teaser-cont ul {
    margin-left: 0
}

.content-component .teaser-cont li+li,.content-component .teaser-cont p+p {
    margin-top: 12px
}

.content-component .default-column .full-width>div:first-child:last-child .image-wrapper img,.content-component .one-column .full-width>div .image-wrapper img {
    height: auto;
    object-fit: cover;
    max-height: 500px
}

.content-teaser {
    width: 100%;
    padding: 0;
    text-align: center
}

.content-teaser .content-section {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 0 12px 12px;
    margin-bottom: 12px;
    border-radius: 2px
}

.content-teaser .teaser-tile {
    height: 100%;
    padding: 12px;
    margin: 0;
    text-align: left
}

.content-teaser .teaser-tile .btn-link::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.content-teaser .teaser-tile[data-label=""]::after,.content-teaser .teaser-tile[data-label=""]::before {
    display: none
}

.content-teaser .component-content {
    height: 100%
}

.content-teaser h2 {
    margin-top: 28.72px;
    margin-bottom: 12.72px
}

.content-teaser .field-section-description {
    margin-bottom: 6.995px
}

.content-teaser .teasers {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -6px
}

.content-teaser .teasers>div {
    padding: 12px 12px 0;
    margin: 0 6px 12px;
    width: 100%;
    max-width: 100%
}

.content-teaser .teasers img {
    width: 100%;
    height: 186px;
    object-fit: cover;
    border-radius: 2px
}

.content-teaser .teasers .h4 {
    margin-top: 11.84px;
    margin-bottom: 11.84px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    width: calc(100% - 12px)
}

.content-teaser .teasers .content-teaser-description {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    width: calc(100% - 12px);
    margin-bottom: 24px;
    position: relative
}

.content-teaser .teasers .content-teaser-description:empty {
    display: none
}

.content-teaser .teasers .content-teaser-read-more {
    width: calc(100% - 12px);
    margin-bottom: 12px
}

.content-teaser .teasers a {
    display: block
}

.content-teaser .teasers a:hover {
    color: #0047b6
}

.content-teaser .teasers a:empty {
    display: none
}

.content-teaser .content-section>a,.content-teaser .content-section>h2,.content-teaser .content-section>p {
    padding: 0 12px;
    text-align: center
}

.content-teaser .content-section>a~.teasers,.content-teaser .content-section>h2~.teasers,.content-teaser .content-section>p~.teasers {
    margin-top: 22px
}

.content-teaser .content-section .teasers .teaser-tile {
    padding: 0
}

.content-teaser .content-section .teasers .hover-shadow::after,.content-teaser .content-section .teasers .hover-shadow::before {
    display: none
}

.content-teaser .content-section .teasers .hover-shadow picture {
    display: block;
    position: relative
}

.content-teaser .content-section .teasers .hover-shadow picture::after,.content-teaser .content-section .teasers .hover-shadow picture::before {
    content: "";
    position: absolute;
    transition: 150ms ease-in-out;
    opacity: 0;
    left: 0;
    top: 5%;
    height: 90%;
    border-radius: 100%;
    box-shadow: 0 0 12px rgba(0,0,0,.5);
    width: 24px;
    clip: rect(auto 0 auto -12px)
}

.content-teaser .content-section .teasers .hover-shadow picture::after {
    left: auto;
    right: 0;
    clip: rect(auto 36px auto 24px)
}

.content-teaser .content-section .teasers .hover-shadow:focus-within picture::after,.content-teaser .content-section .teasers .hover-shadow:focus-within picture::before,.content-teaser .content-section .teasers .hover-shadow:hover picture::after,.content-teaser .content-section .teasers .hover-shadow:hover picture::before {
    opacity: 1
}

.content-teaser .content-section .teasers .hover-shadow:focus-within[data-label=""] picture::after,.content-teaser .content-section .teasers .hover-shadow:focus-within[data-label=""] picture::before,.content-teaser .content-section .teasers .hover-shadow:hover[data-label=""] picture::after,.content-teaser .content-section .teasers .hover-shadow:hover[data-label=""] picture::before {
    display: none
}

.cookie-management {
    text-align: center
}

.cookie-management .m-toggleButton-option {
    display: flex;
    align-items: center;
    position: relative
}

.cookie-management .m-toggleButton-option svg {
    height: 1.5rem;
    stroke-width: 1.5px;
    width: 1.5rem
}

.cookie-management .m-toggleButton-option-isTrue {
    justify-content: flex-start;
    opacity: 0;
    padding: 0 0 0 .25em;
    text-align: left
}

.cookie-management .m-toggleButton-option-isTrue svg {
    fill: #fff
}

.cookie-management .m-toggleButton-option-isFalse {
    justify-content: flex-end;
    opacity: 1;
    padding: 0 .25rem 0 0;
    text-align: right;
    margin-left: auto
}

.cookie-management .m-toggleButton-option-isFalse svg {
    fill: #33435b
}

.cookie-management .header {
    width: 100%;
    display: flex
}

.cookie-management .accept-all-cookies {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 12px
}

.cookie-management .h5 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-right: 24px
}

.cookie-management .m-toggleButton-input {
    display: flex;
    width: 64px;
    cursor: pointer;
    height: 32px;
    position: relative;
    flex-shrink: 0;
    background: #e6e8eb;
    box-shadow: rgba(0,20,50,.2) 0 1px 3px 0 inset;
    transition: background-color .18s ease-out;
    will-change: background-color;
    appearance: none;
    padding: .25rem;
    border-width: initial;
    border-style: none;
    border-color: initial;
    border-image: initial;
    border-radius: 8rem
}

.cookie-management .m-toggleButton-switch {
    width: 24px;
    height: 24px;
    margin: 0 1px;
    align-items: center;
    padding: 0 .5rem;
    user-select: none;
    -webkit-font-smoothing: antialiased;
    white-space: nowrap;
    position: absolute;
    top: .25em;
    right: 0;
    left: .25em;
    line-height: 2rem;
    text-align: center;
    box-sizing: border-box;
    pointer-events: none;
    overflow: hidden;
    background: #fff;
    box-shadow: rgba(0,20,50,.2) 0 1px 3px 0;
    transition-property: transform,width;
    transition-duration: inherit;
    transition-timing-function: inherit;
    will-change: transform;
    border-radius: 8rem
}

.cookie-management .m-toggleButton-isActive .m-toggleButton-input {
    background: #0059e4
}

.cookie-management .m-toggleButton-isActive .m-toggleButton-switch {
    margin: 0;
    transform: translateX(2rem)
}

.cookie-management .m-toggleButton-isActive .m-toggleButton-option-isFalse {
    opacity: 0
}

.cookie-management .m-toggleButton-isActive .m-toggleButton-option-isTrue {
    opacity: 1
}

.cookie-management .categories {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -6px;
    padding-top: 6px
}

.cookie-management .categories~.back {
    margin-top: 20px
}

.cookie-management .categories~.back a {
    text-decoration: none
}

.cookie-management .accept-cookies {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin: auto 0 0
}

.cookie-management .m-toggleButton-Blocked.m-toggleButton-isActive .m-toggleButton-input {
    background-color: #cce1ff
}

.cookie-management .m-toggleButton-Blocked.m-toggleButton-isActive .m-toggleButton-input:focus {
    outline: 0;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.25)
}

.cookie-management .m-toggleButton-Blocked.m-toggleButton-isActive .title {
    opacity: .3
}

.cookie-management .category {
    flex: 0 1 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    text-align: left
}

.cookie-management .category-wrapper {
    margin: 6px;
    padding: 18px 11px 24px;
    border-radius: 2px;
    border: 1px solid #99a1ad;
    height: 100%;
    display: flex;
    flex-direction: column
}

.cookie-management .category .description {
    margin-top: 14px;
    margin-bottom: 18px
}

.cookie-management .category .description,.cookie-management .category .description * {
    font-size: 13px
}

.cookie-management .category .name {
    display: none
}

.cookie-management .field-footer-text {
    margin: 26px 30px 20px;
    text-align: center
}

.cookie-management .m-button {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    display: inline-block;
    background-color: #0059e4;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #0059e4;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms;
    margin-top: 12px;
    margin-bottom: 24px
}

.cookie-management .m-button:hover {
    color: #fff;
    background-color: #0047b6;
    border-color: #0047b6
}

.cookie-description {
    overflow-x: auto
}

.cookie-description table {
    table-layout: fixed
}

.cookie-description table td {
    word-break: break-word;
    padding: 12px
}

.cms.consent-disclaimer.intrusive,.cms.consent-disclaimer.reject {
    background-color: rgba(0,45,114,.4);
    z-index: 2001;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: auto
}

.cms.consent-disclaimer.click-only {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 400
}

.cms.consent-disclaimer .component-content {
    position: fixed;
    display: block;
    bottom: 0;
    left: 0;
    width: 100%
}

.cms.consent-disclaimer .main-white-container {
    box-shadow: 0 8px 32px 0 rgba(0,45,114,.2);
    background: #fff
}

.cms.consent-disclaimer .tab-trap-root {
    max-width: 1440px;
    margin: 0 auto
}

.cms.consent-disclaimer .consent {
    max-height: calc(100vh - 170px);
    display: flex;
    flex-direction: column;
    padding: 24px 24px 12px;
    margin: 0;
    overflow-y: auto;
    gap: 12px
}

.cms.consent-disclaimer .consent p.consent-header,.cms.consent-disclaimer .consent p.consent-header p,.cms.consent-disclaimer .consent strong {
    font-weight: 900
}

.cms.consent-disclaimer .consent .consent-link {
    margin-top: 16px
}

.cms.consent-disclaimer .consent div.field-text {
    overflow-y: auto;
    overflow-x: hidden
}

.cms.consent-disclaimer .consent div.field-text::-webkit-scrollbar {
    width: 15px
}

.cms.consent-disclaimer .consent div.field-text a {
    color: #0059e4;
    text-decoration: none
}

.cms.consent-disclaimer .consent div.field-text .long-description p,.cms.consent-disclaimer .consent div.field-text p:not(:first-child) {
    margin-top: 12px
}

.cms.consent-disclaimer .consent .buttons {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.cms.consent-disclaimer .consent span[scwatermark=true] {
    min-width: 120px
}

.cms.consent-disclaimer .consent .show-toggle {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: underline;
    width: 100%;
    display: block
}

.cms.consent-disclaimer .consent .show-toggle:active,.cms.consent-disclaimer .consent .show-toggle:hover {
    color: #0059e4;
    cursor: pointer
}

.cms.consent-disclaimer .btn-link,.cms.consent-disclaimer .btn-primary,.cms.consent-disclaimer .btn-secondary {
    margin-bottom: 12px;
    box-sizing: border-box
}

.cms.consent-disclaimer .btn-primary,.cms.consent-disclaimer .btn-secondary {
    width: 100%
}

.cms.consent-disclaimer .btn-link {
    font-size: 1.125rem;
    padding: 12px 16px
}

.ncms-webcomp .consent h5 {
    margin: 0
}

.ncms-webcomp .consent .field-text,.ncms-webcomp .consent .field-text p,.ncms-webcomp .consent .field-text p:first-child {
    font-size: 13px;
    margin: 0
}

.ncms-webcomp .consent .field-text p:last-child {
    margin: 0
}

.ncms-webcomp .consent .hidden {
    display: none
}

.component-error-page svg,.rich-text .component-error-page svg {
    display: block;
    margin: 15% auto 24px
}

.component-error-page h1,.rich-text .component-error-page h1 {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 2rem;
    line-height: 1.29;
    color: #002d72;
    text-transform: uppercase;
    margin-bottom: 3.04px;
    text-align: center
}

.component-error-page p,.rich-text .component-error-page p {
    text-align: center
}

.component-error-page>div.action-content,.rich-text .component-error-page>div.action-content {
    margin: 30px auto 15%;
    text-align: center
}

.component-error-page>div.action-content a,.rich-text .component-error-page>div.action-content a {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    display: inline-block;
    background-color: #0059e4;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #0059e4;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms
}

.component-error-page>div.action-content a:hover,.rich-text .component-error-page>div.action-content a:hover {
    color: #fff;
    background-color: #0047b6;
    border-color: #0047b6
}

.facet-list span.field-title>a {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    background: #33435b;
    padding: 0 15px 0 23px;
    border-radius: 10px
}

.has-advanced-upload {
    font-size: 1.25rem;
    background-color: #f2f7ff;
    position: relative;
    padding: 72px 0;
    margin: 0 12px 32px;
    border-radius: 8px;
    border: 2px dashed #66a2fe;
    height: auto;
    width: auto;
    transition: background-color 150ms
}

.has-advanced-upload:hover {
    background-color: #e6f0ff
}

.has-advanced-upload:hover .box__input .box__div label {
    color: #0059e4
}

.has-advanced-upload::after,.has-advanced-upload::before,.has-advanced-upload:focus-within::after,.has-advanced-upload:focus-within::before {
    content: "";
    position: absolute;
    transition: 150ms ease-in-out;
    opacity: 0;
    left: 0;
    top: 5%;
    height: 90%;
    border-radius: 100%;
    box-shadow: 0 0 12px rgba(0,0,0,.5);
    width: 24px;
    clip: rect(auto 0 auto -12px)
}

.has-advanced-upload::after,.has-advanced-upload:focus-within::after {
    left: auto;
    right: 0;
    clip: rect(auto 36px auto 24px)
}

.has-advanced-upload:focus-within,.has-advanced-upload:hover {
    z-index: 1
}

.has-advanced-upload:focus-within::after,.has-advanced-upload:focus-within::before,.has-advanced-upload:hover::after,.has-advanced-upload:hover::before {
    opacity: 1
}

.has-advanced-upload[data-label=""]::after,.has-advanced-upload[data-label=""]::before {
    display: none
}

.has-advanced-upload .box__dragndrop {
    display: inline
}

.has-advanced-upload .box__icon {
    width: 32px;
    height: 32px;
    fill: #0059e4;
    display: block;
    margin: auto auto 16px
}

.has-advanced-upload .box__input {
    text-align: center;
    height: auto;
    position: unset;
    margin: 0;
    background-color: inherit
}

.box.is-dragover {
    outline-offset: -20px;
    outline-color: #c8dadf;
    background-color: #fff
}

.box__dragndrop,.box__icon {
    display: none
}

.box__file {
    overflow: hidden;
    position: absolute;
    top: 0
}

.box__file.file-selected {
    z-index: -1
}

.box__input .box__file+.box__div {
    display: inline-flex;
    max-width: calc(100% - 48px);
    margin: 0 24px;
    padding: 4px 16px;
    background-color: inherit;
    height: inherit;
    position: inherit
}

.box__input .box__file+.box__div .remove-file {
    display: none
}

.box__input .box__file+.box__div.file-selected:hover .remove-file,.box__input .box__file+.box__div.file-selected:hover label {
    color: #fff;
    fill: #fff
}

.box__input .box__file+.box__div.file-selected label {
    color: #33435b
}

.box__input .box__file+.box__div.file-selected .remove-file {
    display: block!important;
    cursor: pointer;
    fill: #33435b;
    width: 12px;
    height: 12px;
    margin: 6px 0 0 12px
}

.box .box__input .box__div label {
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    overflow: hidden;
    padding: 0;
    width: 100%;
    cursor: pointer;
    font-size: 16px;
    color: #002d72;
    text-decoration: underline
}

.box .box__input .upload-text {
    margin: auto;
    padding: 0;
    display: none
}

.box__input .file-selected {
    border-radius: 24px;
    background-color: #cce0ff!important;
    padding: 4px 16px
}

.box__input .file-selected:hover,.file-selected:focus {
    background-color: #0059e4!important;
    color: #fff;
    fill: #fff
}

.site-footer .footer-contact .btn-outline .callback-button-label,.site-footer .footer-contact .link>span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.site-footer .footer-contact {
    border-bottom: 1px solid #e6e8eb
}

.site-footer .footer-contact input[type=checkbox]:checked+.h5 {
    padding-bottom: 14px
}

.site-footer .footer-contact input[type=checkbox]:checked+.h5+.footer-contact-content {
    display: block
}

.site-footer .footer-contact input[type=checkbox]:checked+.h5 .plus-minus-icon:before {
    display: none
}

.site-footer .footer-contact .footer-contact-content {
    display: none;
    padding: 0 12px 0 48px
}

.site-footer .footer-contact .footer-contact-content>* {
    display: block;
    margin-bottom: 12px;
    text-decoration: none
}

.site-footer .footer-contact .footer-contact-content>:last-child {
    margin-bottom: 24px
}

.site-footer .footer-contact .btn-outline,.site-footer .footer-contact .btn-outline>* {
    display: inline-block;
    vertical-align: middle
}

.site-footer .footer-contact .btn-outline .callback-button-label {
    max-width: calc(100% - 36px);
    width: 100%;
    max-height: 1.5rem
}

.site-footer .footer-contact .btn-outline .callback-service {
    width: 24px;
    height: 24px;
    margin-right: 12px;
    transform: scale(.8)
}

.site-footer .footer-contact .btn-outline .callback-service * {
    fill: #0059e4!important
}

.site-footer .footer-contact .btn-outline:hover {
    background-color: #0059e4;
    color: #fff
}

.site-footer .footer-contact .btn-outline:hover .callback-service * {
    fill: #fff!important
}

.site-footer .footer-contact .link {
    /* display: flex;
    align-items: center;
    font-size: 1rem */
    font-size: .90rem !important; display: inline !important; margin-right: 10px;
}

.site-footer .footer-contact .link .email,.site-footer .footer-contact .link .phone {
    display: inline-block;
    margin-right: 5px;
    width: 16px;
    min-width: 16px;
    height: 16px
}

.site-footer .footer-contact .link .email *,.site-footer .footer-contact .link .phone * {
    fill: #0059e4!important
}

.site-footer .footer-contact .link>span {
    flex-grow: 1
}

.site-footer .footer-contact .footer-contact-additional-text {
    font-size: 11px;
    width: 60%
}

.event-registration-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.5);
    opacity: 0;
    visibility: hidden;
    transform: scale(1.1);
    transition: visibility linear .25s,opacity .25s,transform .25s
}

.modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: #fff;
    padding: 32px 12px;
    width: 24rem;
    max-width: 320px;
    border-radius: 2px;
    max-height: 90%;
    overflow-y: auto;
    overflow-x: hidden
}

.modal-content .sitecore-form form {
    display: flex;
    flex-direction: column;
    margin: 0
}

.modal-content .sitecore-form form input {
    margin-left: 0;
    width: 100%;
    margin-bottom: 28px
}

.modal-content .sitecore-form form label {
    padding-left: 0
}

.modal-content .sitecore-form form .checkbox-container {
    padding-left: 30px
}

.modal-content .sitecore-form form .checkbox-container:focus-within .forms-checkbox-span {
    box-shadow: 0 0 1px 5px #cce0ff;
    border: 2px solid #66a2fe;
    transition: .25s linear
}

.modal-content .sitecore-form form .forms-checkbox-span {
    left: 0
}

.modal-content .sitecore-form form input[type=submit] {
    margin: 24px auto 0;
    width: 100%
}

.modal-content .sitecore-form form,.modal-content .sitecore-form form .checkbox-container {
    margin-bottom: 0
}

.modal-header {
    text-align: center;
    margin-bottom: 36px
}

span.btn-primary.disabled,span.btn-primary.disabled:hover {
    cursor: default;
    background-color: rgba(183,187,192,.3803921569);
    border: 2px solid rgba(183,187,192,.3803921569);
    color: rgba(128,128,128,.7803921569)
}

.close-event-registration-modal {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    text-align: center;
    cursor: pointer;
    background: url(/nextcms/svgs/close-black.svg) 12px 12px;
    border: none
}

.show-modal {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    z-index: 1001;
    transition: visibility linear,opacity .25s,transform .25s
}

.event-notification {
    background-color: #fff;
    height: 100%;
    max-width: 1416px;
    position: relative
}

.event-notification .component-content {
    width: 100%
}

.event-notification.red-alert {
    border: 2px solid #de351b
}

.event-notification.red-alert .icon-alert {
    background-color: #de351b
}

.event-notification.success {
    border: 2px solid #24865b
}

.event-notification.success .icon-success {
    background-color: #24865b
}

.event-notification .notification-section {
    display: inline-flex;
    width: 100%;
    height: 100%;
    vertical-align: middle
}

.event-notification .notification-section .icon-success {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/check.svg)
}

.event-notification .notification-section .icon-alert {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/notification-alert.svg)
}

.event-notification .notification-section .icon-alert,.event-notification .notification-section .icon-close,.event-notification .notification-section .icon-success {
    display: block;
    flex: unset;
    width: 46px;
    background-repeat: no-repeat;
    background-size: 16px;
    background-position-x: center;
    background-position-y: center
}

.event-notification .notification-section .icon-close {
    background-image: url(/nextcms/svgs/close-black.svg);
    width: 16px;
    margin: 10px
}

.event-notification .notification-section .fields-container {
    flex: 1;
    display: inline-flex;
    text-align: center;
    vertical-align: middle;
    line-height: 1.5;
    color: #001432;
    font-size: 16px;
    padding: 6px 0
}

.event-notification .notification-section .fields-container .info {
    font-weight: 900;
    margin: auto 0 auto 12px
}

.sitecore-form form .checkbox-container~.field-validation-error,.sitecore-form form .radio-container~.field-validation-error {
    margin-top: 0
}

.form {
    margin: 10px 0;
    font-size: 14px;
    overflow: hidden
}

.form table {
    width: 100%
}

.form .scfSectionContent>div~div {
    margin: 0
}

.form .scfSectionContent>div>div,.form .scfSectionContent>div>label {
    width: 100%;
    display: block;
    padding: 0
}

.form .has-feedback::after {
    content: "";
    display: table;
    clear: both
}

.form .scfRequired {
    display: none!important
}

.form fieldset {
    padding: 15px;
    margin: 10px 0;
    position: relative;
    border: 1px solid #d2d2d2
}

.form fieldset legend {
    font-weight: 700;
    padding: 0 5px;
    font-size: 16px;
    position: absolute;
    top: -33px;
    background: #fff;
    left: 0
}

.form .scfSectionContent>div {
    box-sizing: border-box;
    margin: 15px 0;
    border: 1px dashed #808080;
    padding: 10px;
    position: relative
}

.form .scfSectionContent>div:after {
    clear: both;
    content: "";
    display: block
}

.form .scfSectionContent>div:hover [class$=GeneralPanel]>[class$=UsefulInfo] {
    opacity: 1
}

.form .scfSectionContent>div input,.form .scfSectionContent>div select {
    margin-left: 5px
}

.form .scfSectionContent [class$=UsefulInfo] {
    transition: opacity .75s;
    box-sizing: border-box;
    opacity: 0;
    font-size: 12px;
    margin-left: 5px;
    position: absolute;
    left: 0;
    top: -15px;
    padding: 4px 8px;
    max-width: 98%;
    width: auto;
    background-color: #f5f5f5;
    color: #808080;
    border: 1px solid #d2d2d2
}

.form input,.form select,.form textarea {
    padding: 2px 4px;
    max-width: 98%;
    border: 1px solid #d2d2d2
}

.form .scfCaptcha input[type=text] {
    margin: 0
}

.form .scfCaptchStrongTextPanel,.form .scfCaptchaLimitGeneralPanel {
    max-width: 100%;
    width: auto
}

.form .scfCaptchaLabel {
    display: none
}

.form .scfSectionContent .scfCaptchaGeneralPanel embed {
    max-width: 180px
}

.form input[type=image] {
    border: none
}

.form button,.form input[type=submit] {
    cursor: pointer;
    margin-left: 0;
    background: #fff;
    border: 1px solid #d2d2d2
}

.form input[type=file],.form input[type=password],.form input[type=text],.form textarea {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    width: 95%;
    padding: 2px;
    border-bottom: 1px solid #d2d2d2
}

.form input[type=file]+span,.form input[type=password]+span,.form input[type=text]+span,.form textarea+span {
    display: inline-block;
    vertical-align: middle
}

.form input[type=file] {
    appearance: none
}

.form input[type=radio] {
    position: absolute
}

.form input[type=radio]+label:before {
    content: "";
    position: absolute;
    top: 2px;
    display: block;
    width: 16px;
    height: 16px;
    background-color: #fff
}

.form input[type=radio]+label:after {
    content: "";
    position: absolute;
    top: 2px;
    display: block;
    width: 16px;
    height: 15px;
    background: image-url("radiobox.png")
}

.form input[type=radio]:checked+label:after {
    background-position: -16px 0
}

.form input[type=radio]+label {
    user-select: none;
    padding-left: 20px;
    margin-left: 5px;
    position: relative
}

.form select {
    max-height: 30px;
    position: relative;
    text-indent: 2px;
    border: 1px solid #d2d2d2
}

.form .scfListBox {
    background: 0 0;
    max-height: none
}

.form .scfDateSelectorDay,.form .scfDateSelectorMonth,.form .scfDateSelectorYear {
    width: 30%
}

.form.hints-below .scfSectionContent [class$=UsefulInfo] {
    position: static;
    opacity: 1;
    max-width: 100%;
    width: 100%;
    margin: 5px 0 0 5px
}

.form.labels-above label {
    box-sizing: border-box;
    display: block;
    width: 100%;
    margin: 0
}

.form.labels-above .scfCaptchaGeneralPanel,.form.labels-above .scfCheckBoxListGeneralPanel,.form.labels-above .scfConfirmPasswordGeneralPanel,.form.labels-above .scfCreditCardGeneralPanel,.form.labels-above .scfDateGeneralPanel,.form.labels-above .scfDatePickerGeneralPanel,.form.labels-above .scfDateSelectorGeneralPanel,.form.labels-above .scfDropListGeneralPanel,.form.labels-above .scfEmailGeneralPanel,.form.labels-above .scfFileUploadGeneralPanel,.form.labels-above .scfListBoxGeneralPanel,.form.labels-above .scfMultipleLineGeneralPanel,.form.labels-above .scfNumberGeneralPanel,.form.labels-above .scfPasswordGeneralPanel,.form.labels-above .scfRadioButtonListGeneralPanel,.form.labels-above .scfSingleLineGeneralPanel,.form.labels-above .scfSmsTelephoneGeneralPanel,.form.labels-above .scfTelephoneGeneralPanel {
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    width: 93%
}

.form.labels-above .scfSectionContent .scfRequired {
    margin: 0 5px
}

.form.labels-above .scfMultipleLineGeneralPanel {
    width: 95%
}

.form.labels-above .scfMultipleLineTextBox {
    margin: 0 0 0 5px
}

.chef-quote {
    text-align: center
}

.chef-quote .comp-box {
    padding: 0 24px
}

.chef-quote .h2 {
    margin-top: 28.72px;
    margin-bottom: 16.72px
}

.chef-quote-signature {
    margin-bottom: 30.995px
}

.chef-quote img {
    width: 279px;
    height: 279px;
    object-fit: cover;
    border-radius: 50%;
    margin: 36px auto 0;
    max-width: 100%
}

.generic-detail .alternating-rows>div:nth-child(odd) {
    background: #f2f5f8
}

.generic-detail .alternating-rows svg {
    margin: 0 12px
}

.generic-detail .alternating-rows .details-row {
    padding: 6px 0;
    display: flex
}

.generic-detail .alternating-rows .details-row>span {
    color: #002d72;
    position: relative
}

.generic-detail .alternating-rows .details-row>span::before {
    content: "";
    background-repeat: no-repeat;
    padding: 10px 10px 25px 25px;
    margin-left: 4px
}

.generic-detail .alternating-rows .details-row .field-time {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    flex: 0 0 fit-content;
    margin-left: 12px
}

.generic-detail .alternating-rows .details-row .field-agenda {
    padding-left: 24px;
    margin-bottom: 0
}

.generic-detail .alternating-rows .details-row .date-row::before {
    background-image: url(/nextcms/svgs/date.svg)
}

.generic-detail .alternating-rows .details-row .time-row::before {
    background-image: url(/nextcms/svgs/time.svg)
}

.generic-detail .alternating-rows .details-row .location-row::before {
    background-image: url(/nextcms/svgs/location-sm.svg)
}

.generic-detail .alternating-rows .details-row .trainer-row::before {
    background-image: url(/nextcms/svgs/speaker.svg)
}

.generic-detail .alternating-rows .details-row .contact-row::before {
    background-image: url(/nextcms/svgs/mail.svg)
}

.generic-detail .alternating-rows .details-row .cost-row::before {
    background-image: url(/nextcms/svgs/costs.svg)
}

.generic-detail .alternating-rows .details-row .seats-row::before {
    background-image: url(/nextcms/svgs/seats.svg)
}

.generic-detail .alternating-rows .field-colon {
    padding-left: 5px;
    padding-right: 5px
}

.generic-detail .component.container.intro-default .comp-box {
    padding-top: 24px;
    margin-bottom: 0;
    max-width: 100%
}

.generic-detail .component.container.intro-default .badge-primary:empty {
    display: none
}

.generic-detail .component.container.intro-default .field-headline {
    margin-top: 14px
}

.generic-detail .component.container.intro-default .intro-description {
    padding: 0;
    margin-top: 10px
}

.generic-detail .component.container.intro-default .register-button-group {
    margin-top: 18px;
    padding: 0
}

.generic-detail .content-component .h2 {
    padding: 0;
    margin-top: 0
}

.generic-detail .accordion-description .component:not(:first-of-type) .h5 {
    margin-top: 16px
}

.generic-detail .accordion-description .h5 {
    display: flex
}

.generic-detail .accordion-description .h5 .field-date {
    margin-left: 4px
}

.generic-detail .accordion-description .comp-box.trainer {
    margin-bottom: 0
}

.generic-detail .trainer-text {
    margin-bottom: 16px
}

.generic-detail .trainer-image img {
    max-width: 100%;
    height: auto
}

.generic-detail .trainer-details {
    margin-bottom: 18px
}

.intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 12px
}

.intro .component-content {
    width: 100%
}

.intro .component-content>h1:first-child {
    padding-top: 14px
}

.intro .component-content>h1:last-child {
    padding-bottom: 14px
}

.intro .component-content>:first-child.intro-description,.intro .component-content>:first-child.login-group {
    padding-top: 20px
}

.intro .component-content>:first-child.register-button-group {
    padding-top: 23px
}

.intro .component-content>:first-child.intro-image {
    padding-top: 0
}

.intro .component-content>:last-child.intro-description,.intro .component-content>:last-child.login-group {
    padding-bottom: 18px
}

.intro .component-content>:last-child.register-button-group {
    padding-bottom: 23px
}

.intro .intro-description,.intro .intro-footnote,.intro .login-group,.intro h1 {
    padding-left: 12px;
    padding-right: 12px
}

.intro h1+.register-button-group {
    padding-top: 15px
}

.intro h1+.intro-image {
    padding-top: 27px
}

.intro h1+.intro-footnote {
    padding-top: 10px
}

.intro .intro-description,.intro .login-group,.intro .register-button-group {
    padding-top: 12px;
    padding-bottom: 12px
}

.intro .intro-description+.register-button-group {
    padding-top: 6px
}

.intro .intro-description+.login-group {
    padding-top: 2px
}

.intro .intro-description+.intro-image {
    padding-top: 18px
}

.intro .register-button-group {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    align-items: center;
    gap: 12px
}

.intro .register-button-group a {
    display: flex;
    text-decoration: none
}

.intro .register-button-group:empty {
    display: none
}

.intro .register-button-group+.login-group {
    padding-top: 8px
}

.intro .register-button-group+.intro-image {
    padding-top: 24px
}

.intro .register-button-group+.intro-footnote {
    padding-top: 9px
}

.intro .login-group .login-text {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin: auto
}

.intro .login-group+.intro-image {
    padding-top: 17px
}

.intro .login-group+.intro-footnote {
    padding-top: 2px
}

.intro .intro-image {
    text-align: center;
    line-height: 0;
    max-width: 100%;
    flex: 0 0 auto;
    padding-top: 12px
}

.intro .intro-image img {
    border-radius: 2px;
    max-width: 100%;
    height: auto;
    object-fit: cover
}

.intro .intro-image+.intro-footnote {
    padding-top: 32px
}

.intro .intro-footnote {
    padding-bottom: 18px
}

.intro .btn-secondary img {
    margin-right: 8px
}

.intro .intro-header-text {
    font-size: 1rem;
    color: #002d72;
    font-weight: 900
}

.intro .intro-header-name {
    margin-left: 5px
}

.intro .intro-info-text {
    font-weight: 400
}

.intro .intro-teasers-header {
    margin-top: 6px
}

.intro .intro-teasers {
    display: flex;
    margin: 0 -12px -12px 0;
    padding: 18px 0 12px;
    gap: 12px;
    flex-wrap: wrap
}

.intro .intro-teasers a {
    text-decoration: none
}

.intro .intro-teasers>div {
    flex: 0 1 calc(50% - 12px);
    height: auto
}

.intro .intro-teasers .hover-shadow {
    height: 100%
}

.intro .intro-teaser {
    background: #cce0ff;
    transition: background-color 150ms ease-in-out;
    height: 100%;
    margin-bottom: 0
}

.intro .intro-teaser .h5 {
    margin-right: 5px;
    order: 1;
    font-size: 13px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.intro .intro-teaser img {
    width: 30px;
    height: 30px;
    order: 2
}

.intro .intro-teaser a {
    display: block;
    height: 100%
}

.intro .intro-teaser .teaser-body {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 0 12px;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    min-height: 60px
}

#footer .global-footer-component {
    margin: 0 -9px
}

.global-footer-component {
    background-color: #002d72;
    padding: 20px 24px
}

.global-footer-component .links {
    max-width: 1392px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box
}

.global-footer-component a,.global-footer-component a:active,.global-footer-component a:hover {
    font-family: Lato,sans-serif;
    font-weight: 400;
    text-rendering: optimizeLegibility;
    text-transform: inherit;
    font-size: 16px;
    text-decoration: underline;
    text-align: left;
    line-height: 24px;
    padding-right: 24px;
    box-sizing: border-box
}

.global-footer-component a,.global-footer-component a span,.global-footer-component a:active,.global-footer-component a:active span,.global-footer-component a:hover,.global-footer-component a:hover span {
    background-color: transparent;
    color: #fff;
    font-style: normal
}

.hero-carousel {
    border-radius: 2px;
    padding: 0;
    margin: 0 -12px 12px;
    overflow: hidden;
    position: relative
}

.hero-carousel .carousel-next,.hero-carousel .carousel-prev,.hero-carousel::after,.hero-carousel::before {
    display: none
}

.hero-carousel .carousel-prev,.hero-carousel::before {
    left: 0
}

.hero-carousel .carousel-next,.hero-carousel::after {
    right: 0
}

.hero-carousel::after,.hero-carousel::before {
    content: "";
    pointer-events: none;
    background: url(//cdn.metro-online.com/nextcms/svgs/carousel-left.svg) center no-repeat
}

.hero-carousel::after {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/carousel-right.svg)
}

.hero-carousel .carousel-container {
    display: flex;
    flex: 0 0 100%;
    max-width: 100%;
    transition: .25s;
    justify-content: flex-start;
    scrollbar-width: none;
    scroll-behavior: smooth;
    overscroll-behavior: auto;
    overflow-y: hidden;
    overflow-x: scroll;
    padding-left: 12px;
    scroll-snap-type: x mandatory
}

.hero-carousel .carousel-container::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0
}

.hero-carousel .carousel-container>.hero-teaser {
    position: relative;
    flex: 0 0 100%;
    max-width: calc(100% - 72px);
    margin-right: 12px
}

.hero-carousel .carousel-container .component-content,.hero-carousel .carousel-container .teaser-branded {
    height: 100%
}

.hero-carousel .hero-teaser {
    margin-bottom: 0
}

.hero-carousel .hero-teaser .hero-teaser-content {
    height: auto;
    padding-left: 24px
}

.hero-carousel .hero-teaser .image-wrapper {
    display: block
}

.hero-carousel .carousel-navigation,.hero-carousel .field-autoslide,.hero-carousel .field-color-selected,.hero-carousel .field-show-angle-of-success,.hero-carousel .logo-wrapper,.hero-carousel .short-id {
    display: none
}

.hero-category-teaser .component-content .metro-store,.hero-category-teaser .component-content .online-shop {
    max-width: 100%
}

.hero-category-teaser .component-content .category-teaser-carousel .static-container .category-teaser {
    flex: 0 0 33.333333%;
    max-width: 33.333333%
}

.hero-category-teaser .component-content .hero-teaser-new .content-container a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.hero-category-teaser .component-content .hero-teaser-new .content-container a .field-button-label {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis
}

.hero-teaser-new {
    display: block;
    position: relative;
    margin-bottom: 12px;
    height: 243px
}

.hero-teaser-new a {
    text-decoration: none
}

.hero-teaser-new .image-container {
    width: 100%;
    height: 100%;
    line-height: 0;
    border-radius: 2px;
    overflow: hidden
}

.hero-teaser-new .image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.hero-teaser-new .content-container {
    position: absolute;
    top: 0;
    padding: 0 24px;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start
}

.hero-teaser-new .content-container .h1 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #fff;
    text-shadow: 0 0 10px #000;
    padding: 0 20px;
    margin-left: -20px
}

.hero-teaser-new .content-container .field-sub-headline {
    font-size: 13px;
    display: none
}

.hero-teaser-new .btn-primary {
    display: none
}

.hero-teaser-new:focus-within .btn-primary,.hero-teaser-new:hover .btn-primary {
    background-color: #0047b6;
    border-color: #0047b6
}

.hero-teaser {
    padding: 0;
    margin-bottom: 12px
}

.hero-teaser .badge {
    margin-bottom: 16px
}

.hero-teaser .h1 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: 26px
}

.hero-teaser .panel-body {
    border-radius: 2px;
    overflow: hidden;
    height: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
    position: relative
}

.hero-teaser .panel-body .h4 {
    font-weight: 400;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    font-size: 13px;
    margin-top: 12.38px;
    margin-bottom: 0;
    max-width: 100%
}

.hero-teaser .hero-teaser-content {
    position: relative;
    top: 0;
    text-align: left;
    height: 100%;
    width: 100%;
    flex-shrink: 0;
    padding: 24px 24px 19px
}

.hero-teaser .hero-teaser-content::after {
    width: 72px;
    display: none
}

.hero-teaser .field-color-selected,.hero-teaser .hero-teaser-content .btn-primary {
    display: none
}

.hero-teaser .image-wrapper {
    height: 100%
}

.hero-teaser img {
    aspect-ratio: 955/460;
    object-fit: cover;
    width: 100%;
    height: 100%
}

.hero-teaser .teaser-branded {
    background-color: #f2f5f8;
    height: 100%
}

.hero-teaser .teaser-branded>a {
    font-size: 0;
    text-decoration: none
}

.hero-teaser .angle-of-success-area {
    position: relative;
    flex-grow: 1;
    line-height: 0
}

.hero-teaser .angle-of-success-area::after {
    display: none
}

.hero-teaser .angle-of-success-area .logo-wrapper {
    display: none;
    position: absolute;
    z-index: 1;
    bottom: 0;
    right: 0;
    height: 55px;
    width: 193px
}

.hero-teaser [data-angle-of-success="1"] .angle-of-success-area .logo-wrapper {
    display: block
}

.hero-teaser [data-color=blue] {
    background: #002d72
}

.hero-teaser [data-color=blue] .hero-teaser-content {
    background-color: #002d72
}

.hero-teaser [data-color=blue] .hero-teaser-content::after {
    background: linear-gradient(to top right,#002d72 0,#002d72 50%,rgba(0,0,0,0) 50%,rgba(0,0,0,0) 100%)
}

.hero-teaser [data-color=blue] .h1,.hero-teaser [data-color=blue] .h4 {
    color: #fff
}

.hero-teaser [data-color=yellow] {
    background: #ffed00
}

.hero-teaser [data-color=yellow] .hero-teaser-content {
    background-color: #ffed00
}

.hero-teaser [data-color=yellow] .hero-teaser-content::after {
    background: linear-gradient(to top right,#ffed00 0,#ffed00 50%,rgba(0,0,0,0) 50%,rgba(0,0,0,0) 100%)
}

.hero-teaser [data-color=yellow] .hero-teaser-content .badge {
    background-color: #002d72;
    color: #fff
}

.hero-tiles {
    margin: 0 -12px;
    color: #002b74;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.hero-tiles a {
    display: flex;
    flex: 1 1 100%;
    width: 100%;
    height: 100%;
    text-decoration: none
}

.hero-tiles a:hover {
    color: inherit
}

.hero-tiles .hover-shadow:focus-within .btn-primary,.hero-tiles .hover-shadow:hover .btn-primary {
    background: #0047b6;
    border-color: #0047b6
}

.hero-transactional {
    margin: 0 12px 12px
}

.hero-small-wrapper {
    display: flex;
    flex-wrap: nowrap;
    transition: .25s;
    justify-content: flex-start;
    margin: 0 -12px;
    scrollbar-width: none;
    scroll-behavior: smooth;
    overscroll-behavior: auto;
    overflow-y: hidden;
    overflow-x: scroll;
    padding-left: 12px;
    gap: 12px
}

.hero-small-wrapper>div {
    max-width: 80%;
    min-width: calc(100% - 72px)
}

.hero-small-wrapper>div:last-child {
    margin-right: 12px
}

.hero-small-wrapper::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0
}

.hero-small-wrapper::-webkit-scrollbar-track {
    background: 0 0
}

.hero-small-wrapper::-webkit-scrollbar-thumb {
    background: 0 0;
    border: none
}

.hero-tile {
    position: relative;
    overflow: hidden;
    width: 100%;
    display: block
}

.hero-tile p {
    color: #002d72
}

.hero-tile.comp-box {
    margin-bottom: 0
}

.hero-tile .btn-primary {
    margin: 0;
    width: 100%;
    max-width: inherit;
    display: block
}

.hero-tile picture {
    width: 100%
}

.hero-tile-image {
    display: none
}

.hero-tile .product-image {
    font-size: 0;
    line-height: 0;
    margin-right: 12px;
    min-width: 152px
}

.hero-tile-content {
    padding: 24px;
    display: block;
    width: 100%
}

.hero-tile .badge {
    background: #002d72;
    color: #fff;
    margin: 0 auto 10px 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 250px
}

.hero-tile span.h1 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: clamp(26px,4vw,50px);
    padding-bottom: 6px
}

.hero-tile span.h1.field-price {
    font-size: clamp(26px,4vw,40px)
}

.hero-tile.hero-tile-small {
    position: relative
}

.hero-tile.hero-tile-small img {
    aspect-ratio: 296/127;
    width: 100%;
    height: 100%;
    display: block
}

.hero-tile.hero-tile-small .hero-tile-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding-right: 24px;
    padding-bottom: 0
}

.hero-tile.hero-tile-small .btn-text {
    display: none
}

.hero-tile span.h2 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: clamp(20px,3vw,32px);
    color: #fff;
    margin: -10px 0 0 -24px;
    text-shadow: 0 0 8px rgba(0,0,0,.5);
    padding: 4px 24px 2px;
    width: 80%
}

.hero-tile .btn-primary.btn-sm {
    display: none
}

.hero-tile .product-info {
    display: flex;
    align-items: flex-end;
    margin: 12px 0 24px
}

.hero-tile .product-info .no-wrap {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 190px
}

.hero-tile .product-info img {
    aspect-ratio: 1/1;
    object-fit: contain;
    width: 152px;
    height: 152px
}

.header-login-button a,.header-login-button a:hover {
    text-decoration: none
}

.header-login-button .component-content {
    display: inline-flex
}

.header-login-button .field-button-text {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    height: 48px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    overflow: visible
}

.header-login-button .idam-svg,.header-login-button .spinner {
    width: 24px;
    height: auto;
    fill: #fff;
    margin-right: 8px
}

.header-login-button .spinner {
    display: none;
    stroke-width: 2px;
    animation: 2s linear infinite account-user-rotate360
}

.header-login-button .spinner circle {
    stroke-dasharray: 89,200;
    stroke: currentcolor;
    animation: 1.5s ease-in-out infinite account-user-sb-glow
}

.header-login-button .loading .spinner {
    display: block
}

.header-login-button .loading .idam-svg {
    display: none
}

.component.iframe {
    padding: 0 6px;
    margin: 0 0 12px
}

.component.iframe iframe {
    width: 100%
}

.image-teaser-component {
    padding: 12px 12px 0;
    text-align: center
}

.image-teaser-component .h2,.image-teaser-component .section-body,.image-teaser-component>a {
    padding: 0 12px
}

.image-teaser-component .h2 {
    margin-top: 16.72px;
    margin-bottom: 12.72px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.image-teaser-component .section-body {
    margin-bottom: 14.995px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.image-teaser-component>a {
    display: block
}

.image-teaser-component picture {
    line-height: 0;
    display: block
}

.image-teaser-component .teasers {
    margin: 0 -6px
}

.image-teaser-component .teasers>.component {
    margin: 0 6px;
    flex: 0 1 calc(25% - 12px)
}

.image-teaser-component .teasers>.component:nth-child(n+4):last-child {
    margin-right: auto
}

.image-teaser-component .teasers .h2 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #fff;
    text-shadow: 0 0 10px #000;
    position: absolute;
    width: 100%;
    margin: 0;
    padding: 0 12px;
    top: 50%;
    left: 0;
    transform: translateY(-50%)
}

.image-teaser-component .teasers~.section-body {
    margin-top: 18px
}

.image-teaser-component .image-box.hover-shadow {
    overflow: visible
}

.image-teaser-component .image-box.hover-shadow[data-label=""]::after,.image-teaser-component .image-box.hover-shadow[data-label=""]::before {
    display: none
}

.image-teaser-component .image-box>a {
    line-height: 0;
    display: block
}

.image-teaser-component .image-box>a:not([href]):hover {
    cursor: default
}

.image-teaser-component .image-link {
    position: relative;
    display: block
}

.image-teaser-component img {
    /* object-fit: cover;
    height: 100%; */
    width: 100%;
    /* aspect-ratio: 1/1 */
}

.image-teaser-component .h2~.teasers,.image-teaser-component .image-teaser-component>a~.teasers {
    margin-top: 30px
}

.image {
    padding: 0
}

.image img {
    width: 100%;
    height: auto
}

.image a {
    display: inline-block;
    max-width: 100%
}

.image .image-caption {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    display: block
}

.image-default-size img {
    max-width: none;
    width: auto!important
}

.image-full-size img {
    width: 100%!important;
    height: auto!important
}

.image-left .component-content>div>img {
    float: left
}

.image-right .component-content>div>img {
    float: right
}

.link-list>.component-content li,.link-list>.component-content li a {
    display: block
}

.link {
    background: 0 0
}

.link a {
    background-color: transparent;
    text-decoration: none;
    font-size: 1em;
    color: #747474;
    border-bottom: 1px solid #89c6cc
}

.link a:hover {
    color: #878787;
    text-decoration: none
}

.login-notification.component {
    display: none
}

.login-notification.component.show {
    display: none!important
}

.management-details-wrapper {
    padding: 0 12px
}

.management-details-wrapper.expanded {
    padding: 12px
}

.management-details-wrapper img {
    width: 158px;
    height: 158px;
    object-fit: contain;
    display: block
}

.management-details-wrapper .note-from-management {
    margin-bottom: 24px
}

.management-details-wrapper .h5,.management-details-wrapper p {
    margin-bottom: 12px
}

.map {
    max-width: 100%;
    overflow: hidden;
    position: relative;
    background: 0 0;
    border: 1px solid
}

.map .map-canvas {
    position: relative
}

.map img {
    max-width: none
}

.map .MicrosoftMap .infobox-close {
    position: static;
    float: right
}

.map .MicrosoftMap .Infobox .infobox-body {
    height: 100%
}

.map .MicrosoftMap .Infobox .infobox-info {
    height: 100%;
    box-sizing: border-box
}

.media-link {
    background: 0 0;
    border-bottom: 1px solid #89c6cc
}

.media-link a {
    color: #747474
}

.media-link a:hover {
    color: #878787;
    text-decoration: none
}

.media-link .component-content .scEmptyPlaceholder {
    width: 100%;
    margin-left: 0
}

.media-link .component-content>* {
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px
}

.media-link.position-right .field-filetypeicon,.media-link.position-right .field-linktext {
    float: right
}

.media-link .field-filetypeicon,.media-link .field-linktext {
    display: inline-block
}

.media-link .field-filetypeicon>a {
    height: 24px!important;
    display: block
}

.media-link .field-filetypeicon span {
    display: block;
    height: 24px!important
}

.media-link .field-filetypeicon span:before {
    font-size: 18px
}

.media-link .field-linktext a {
    font-size: 1em
}

.file-list-files>.component-content {
    display: flex;
    flex-wrap: wrap
}

.file-list-files .file-description {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    margin-left: 0
}

.file-list-files .file-description .field-title {
    display: inline-block;
    vertical-align: middle;
    font-weight: 600
}

.file-list-files .file-description .field-filetypeicon {
    height: 24px;
    order: 1;
    padding-right: 10px;
    width: 100%;
    text-align: center;
    vertical-align: middle
}

.file-list-files .file-description .field-filetypeicon span {
    margin: 0 auto
}

.file-list-files .file-description .field-filetypeicon span:before {
    font-size: 24px!important
}

.file-list-files .file-description .info-wrapper {
    width: 100%;
    text-align: center;
    padding: 5px 0
}

.file-list-files .file-description .info-wrapper .field-size,.file-list-files .file-description .info-wrapper .field-updated {
    display: inline-block;
    font-size: 12px
}

.file-list-files .field-linktext {
    display: inline-flex;
    width: 100%;
    padding: 10px 13px;
    text-align: center;
    justify-content: center;
    border-radius: 3px;
    margin: 0 auto
}

.file-list-files .field-linktext a {
    line-height: 22px
}

.media-link-horizontal div .field-filetypeicon span {
    height: 25px;
    width: 100%
}

.media-link-horizontal div .field-filetypeicon span:before {
    font-size: 24px!important;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%)
}

.media-link-horizontal .component-content>* {
    display: block;
    text-align: center
}

.sitecore-form {
    background: #fff;
    padding: 24px 12px 36px;
    margin-bottom: 12px
}

.sitecore-form h1,.sitecore-form h2,.sitecore-form h3,.sitecore-form p {
    margin-bottom: 20px
}

.sitecore-form span:not(.field-validation-valid) {
    width: 100%;
    padding-bottom: 24px;
    line-height: 1.5;
    display: block
}

.sitecore-form label {
    padding-bottom: 6px;
    width: 100%;
    font-size: 13px;
    display: flex;
    align-items: flex-end;
    cursor: pointer
}

.sitecore-form label.checkbox-container {
    display: block
}

.sitecore-form label.checkbox-container a {
    margin: 0;
    padding: 0
}

.sitecore-form input,.sitecore-form select,.sitecore-form textarea {
    padding-left: 8px;
    height: 40px;
    border-radius: 2px;
    border: 1px solid #ccd5e2;
    background: #fff;
    transition: border-color 150ms ease-in-out;
    display: block;
    width: 100%
}

.sitecore-form input ::-moz-placeholder,.sitecore-form input ::-webkit-input-placeholder,.sitecore-form select ::-moz-placeholder,.sitecore-form select ::-webkit-input-placeholder,.sitecore-form textarea ::-moz-placeholder,.sitecore-form textarea ::-webkit-input-placeholder {
    color: #667284
}

.sitecore-form input:hover:not(.input-validation-error),.sitecore-form select:hover:not(.input-validation-error),.sitecore-form textarea:hover:not(.input-validation-error) {
    border-color: #ccd5e2
}

.sitecore-form input:active:not(.input-validation-error),.sitecore-form input:focus:not(.input-validation-error),.sitecore-form select:active:not(.input-validation-error),.sitecore-form select:focus:not(.input-validation-error),.sitecore-form textarea:active:not(.input-validation-error),.sitecore-form textarea:focus:not(.input-validation-error) {
    border-color: #66a2fe;
    outline: 0
}

.sitecore-form select[multiple],.sitecore-form select[size] {
    height: auto;
    padding: 0;
    overflow: hidden
}

.sitecore-form select[multiple] option,.sitecore-form select[size] option {
    padding-left: 12px;
    padding-top: 12px;
    height: 28px;
    border-bottom: 1px solid #ccd5e2
}

.sitecore-form select[multiple] option:last-of-type,.sitecore-form select[size] option:last-of-type {
    border-bottom: none
}

.sitecore-form textarea {
    height: 135px
}

.sitecore-form input[type=date] {
    width: auto;
    margin-bottom: 30px
}

.sitecore-form input[type=date]::-webkit-inner-spin-button {
    display: none
}

.sitecore-form input[type=date]::-webkit-calendar-picker-indicator {
    background-color: #fff
}

.sitecore-form input[type=number] {
    overflow: hidden
}

.sitecore-form input[type=number]::-webkit-inner-spin-button,.sitecore-form input[type=number]::-webkit-outer-spin-button {
    appearance: none;
    margin: 0
}

.sitecore-form input[type=submit] {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #fff;
    text-transform: inherit;
    display: inline-block;
    background-color: #0059e4;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #0059e4;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms;
    width: 100%!important;
    margin: 0 0 32px;
    box-shadow: none
}

.sitecore-form input[type=submit]:hover {
    color: #fff
}

.sitecore-form input[type=submit]:focus,.sitecore-form input[type=submit]:hover {
    background-color: #0045b1;
    border-color: #0045b1
}

.sitecore-form input[type=submit]:disabled {
    background-color: #98c0ff;
    border-color: #98c0ff
}

.sitecore-form input[type=radio] {
    position: absolute;
    opacity: 0
}

.sitecore-form .radio-container {
    position: relative;
    padding-left: 32px;
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 20px
}

.sitecore-form .forms-radio-span {
    padding-bottom: 12px!important;
    display: block;
    position: absolute;
    border: 2px solid #aaa;
    border-radius: 100%;
    height: 20px;
    width: 20px!important;
    top: 0;
    left: 0;
    transition: border .25s linear;
    box-sizing: border-box
}

.sitecore-form .radio-container:hover .forms-radio-span {
    border: 2px solid #66a2fe;
    transition: .25s linear
}

.sitecore-form .radio-container:focus-within .forms-radio-span {
    box-shadow: 0 0 1px 5px #98c0ff;
    border: 2px solid #66a2fe;
    transition: .25s linear
}

.sitecore-form .radio-container input[type=radio]:checked~.forms-radio-span {
    border: 2px solid #0059e4
}

.sitecore-form .radio-container input[type=radio]:checked~.forms-radio-span::before {
    background: #0059e4
}

.sitecore-form .radio-container input[type=radio]:checked~label {
    color: #0059e4
}

.sitecore-form .radio-container .forms-radio-span::before {
    display: block;
    position: absolute;
    content: "";
    border-radius: 100%;
    height: 10px;
    width: 10px;
    top: 3px;
    left: 3px;
    margin: auto;
    transition: .25s linear
}

.sitecore-form input[type=checkbox] {
    position: absolute;
    left: -111111px
}

.sitecore-form .checkbox-container {
    position: relative;
    padding-left: 32px;
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 20px
}

.sitecore-form .forms-checkbox-span {
    padding-bottom: 12px!important;
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px!important;
    background-color: #fff;
    border-radius: 2px;
    border: 2px solid #ccd0d6;
    transition: .25s linear;
    margin-left: 0;
    box-sizing: border-box
}

.sitecore-form .checkbox-container:focus-within input[type=checkbox]~.forms-checkbox-span,.sitecore-form .checkbox-container:hover input[type=checkbox]~.forms-checkbox-span {
    border-color: #0059e4;
    transition: .25s linear
}

.sitecore-form .checkbox-container:focus-within input[type=checkbox]~.forms-checkbox-span {
    box-shadow: 0 0 1px 5px #98c0ff
}

.sitecore-form .checkbox-container input[type=checkbox]:checked~.forms-checkbox-span {
    background: #0059e4;
    border: none
}

.sitecore-form .checkbox-container input[disabled]~.forms-checkbox-span,.sitecore-form .checkbox-container:focus-within input[disabled]~.forms-checkbox-span,.sitecore-form .checkbox-container:hover input[disabled]~.forms-checkbox-span {
    background: #f2f3f5;
    border-color: #ccd0d6
}

.sitecore-form .checkbox-container input[disabled]:checked~.forms-checkbox-span {
    background: #99a1ad
}

.sitecore-form .forms-checkbox-span:after {
    content: "";
    position: absolute;
    display: none
}

.sitecore-form .checkbox-container input[type=checkbox]:checked~.forms-checkbox-span:after {
    display: block
}

.sitecore-form .checkbox-container .forms-checkbox-span:after {
    left: 7px;
    top: 3px;
    width: 6px;
    height: 12px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    transition: .25s linear
}

.sitecore-form input[type=checkbox]:checked {
    background-color: #005fff
}

.sitecore-form div {
    position: relative
}

.sitecore-form .field-validation-error {
    margin-top: -28px;
    letter-spacing: normal
}

.sitecore-form .field-validation-error,.sitecore-form .field-validation-error a,.sitecore-form .field-validation-error span {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 13px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #e03305;
    padding-left: 0;
    width: calc(100% - 12px);
    padding-bottom: 0
}

.sitecore-form .validation-summary-errors {
    background-color: #fff;
    margin: 0 0 12px 12px;
    padding: 0;
    height: auto
}

.sitecore-form .validation-summary-errors li {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 13px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #e03305
}

.sitecore-form .field-validation-valid {
    line-height: 0;
    display: none
}

.sitecore-form .input-validation-error {
    border: 2px solid #eb8676
}

.sitecore-form .valid {
    border: 2px solid #85d9b4
}

.sitecore-form .recaptcha {
    background: 0 0;
    margin: 0 0 32px 4px
}

.sitecore-form .recaptcha div {
    background: 0 0;
    margin-left: 4px
}

.sitecore-form .box.has-advanced-upload {
    margin: 0 0 24px;
    max-width: none
}

.col-xs-12.col-sm-6 .sitecore-form {
    padding: 24px 12px 36px!important
}

.col-xs-12.col-sm-6 .sitecore-form .field-validation-error {
    width: 100%
}

.sitecore-form form h2 {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.625rem;
    line-height: 1.29;
    color: #002d72;
    text-transform: uppercase
}

.comp-box+.sitecore-form {
    margin-top: -12px
}

.form-hover-shadow {
    margin-bottom: 30px;
    position: relative
}

.form-hover-shadow::after,.form-hover-shadow::before {
    content: "";
    position: absolute;
    left: 0;
    transition: 150ms ease-in-out;
    opacity: 0;
    height: 20px;
    width: 100%;
    border-radius: 100%;
    box-shadow: 0 0 12px rgba(0,0,0,.5)
}

.form-hover-shadow::before {
    top: 0;
    clip-path: inset(-20px 0 20px 0)
}

.form-hover-shadow::after {
    bottom: 0;
    clip-path: inset(20px 0 -20px 0)
}

.form-hover-shadow:focus-within,.form-hover-shadow:hover {
    z-index: 1
}

.form-hover-shadow:focus-within::before,.form-hover-shadow:focus-within:after,.form-hover-shadow:hover::before,.form-hover-shadow:hover:after {
    opacity: 1
}

.form-hover-shadow input {
    margin: 0
}

.navigation {
    background: rgba(0,0,0,0);
    padding: 2px 25px 0
}

.navigation .level0>.navigation-title>a,.navigation .level1>.navigation-title>a {
    font-size: 18px;
    border-color: #e6e8eb;
    border-style: solid;
    border-width: 0 0 2px;
    padding-right: 3px;
    margin-right: 5px
}

.navigation .level0>.navigation-title>a:hover,.navigation .level1>.navigation-title>a:hover {
    text-decoration: none
}

.navigation a {
    color: #0059e4
}

.navigation a:focus,.navigation a:hover {
    color: #e6f0ff
}

.navigation li.submenu {
    margin-bottom: 0
}

.navigation li>.navigation-title>a {
    padding: 3px 5px 3px 0;
    display: block;
    color: #0059e4;
    text-decoration: none
}

.navigation li>ul a {
    font-size: 14px
}

.navigation .submenu>ul {
    padding-left: 10px
}

.new-store-locator .header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #fff;
    padding: 26px 12px 18px
}

.new-store-locator .header h1 {
    width: calc(100% - 24px);
    margin-bottom: 28px;
    text-align: center
}

.new-store-locator .component-content {
    margin-bottom: 12px
}

.new-store-locator .your-store-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/yourstore.svg);
    background-repeat: no-repeat;
    width: 12px;
    height: 12px;
    margin-left: 5px;
    display: inline-block;
    vertical-align: text-top
}

.new-store-locator .icons {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    margin-left: 16px
}

.new-store-locator .chevron-icon {
    display: block;
    width: 24px;
    height: 24px;
    background-image: url(//cdn.metro-online.com/nextcms/svgs/down.svg);
    transform: rotate(0);
    transition: transform .25s ease-out
}

.new-store-locator .distance-icon {
    display: block;
    width: 11px;
    height: 8px;
    margin-right: 4px;
    background-repeat: no-repeat;
    background-image: url(//cdn.metro-online.com/nextcms/svgs/distance.svg)
}

.new-store-locator .distance-section {
    display: flex;
    align-items: center;
    position: relative;
    top: -3px
}

.new-store-locator .distance,.new-store-locator .unit {
    font-size: .8125rem;
    color: #99a1ad
}

.new-store-locator .unit {
    margin-left: 4px
}

.new-store-locator .distance-section:has(.distance:empty) {
    display: none
}

.new-store-locator .sl-store-name {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    transition: font-size .25s ease-out
}

.new-store-locator summary {
    list-style: none
}

.new-store-locator .summary-store-item {
    padding: 8px 0;
    cursor: pointer
}

.new-store-locator .store-name-section {
    display: flex;
    padding-top: 2px;
    transition: padding .25s ease-out
}

.new-store-locator .sl-section {
    display: flex;
    justify-content: space-between
}

.new-store-locator .sl-address {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem
}

.new-store-locator .m-button-block {
    width: 72px;
    height: 32px;
    position: absolute;
    top: 6px;
    right: 12px;
    margin: 0;
    background: unset;
    color: #0059e4
}

.new-store-locator .m-button-block svg {
    width: 22px;
    height: auto;
    margin: 0
}

.new-store-locator .m-button-block span {
    display: block;
    width: 24px;
    height: 24px
}

.new-store-locator .store-filter-area {
    width: 100%;
    max-width: 916px;
    position: relative;
    margin: 0 auto 18px
}

.new-store-locator .store-filter-area input {
    width: 100%;
    padding: 8px 12px;
    font-size: 1rem;
    line-height: 1.5;
    color: #33435b;
    border: 1px solid #ccd5e2;
    border-radius: 2px
}

.new-store-locator .magn-glass-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/icon_search.svg);
    float: right
}

.new-store-locator .magn-location-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/locate.svg)
}

.new-store-locator .magn-location-icon-disabled {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/locate_disabled.svg)
}

.new-store-locator .magn-clear-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/close-24x.svg)
}

.new-store-locator .store-section-label {
    display: flex;
    flex-direction: column;
    color: #002d72
}

.new-store-locator .alternating-rows>div:nth-of-type(odd) {
    background-color: #f2f5f8
}

.new-store-locator .details-opening-hours {
    color: #002d72
}

.new-store-locator .time-row {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    text-decoration: underline
}

.new-store-locator .details-opening-hours[open] .hours-details {
    display: flex
}

.new-store-locator .summary-opening-hours {
    color: #002d72;
    cursor: pointer
}

.new-store-locator .details-row {
    display: flex;
    align-items: center;
    padding: 6px
}

.new-store-locator .details-row a {
    font-size: .8125rem;
    color: #002d72
}

.new-store-locator .details-row .icon {
    display: block;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-left: 4px;
    margin-right: 10px;
    background-repeat: no-repeat;
    background-position: center
}

.new-store-locator .details-row .location-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/location.svg);
    align-self: flex-start
}

.new-store-locator .details-row .phone-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/phone.svg)
}

.new-store-locator .details-row .email-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/email.svg)
}

.new-store-locator .details-row .clock-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/clock.svg)
}

.new-store-locator .hours-details {
    display: none;
    flex-direction: column;
    padding: 0 12px 8px 40px;
    font-size: .8125rem
}

.new-store-locator .day {
    display: flex;
    justify-content: space-between
}

.new-store-locator .day-hours {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility
}

.new-store-locator .sl-action-buttons {
    display: flex;
    flex-direction: column
}

.new-store-locator .sl-action-buttons a,.new-store-locator .sl-action-buttons button {
    margin-top: 12px
}

.new-store-locator .sl-action-buttons a:disabled,.new-store-locator .sl-action-buttons button:disabled {
    background-color: #f2f5f8;
    border-color: #f2f5f8;
    color: rgba(0,0,0,.5);
    cursor: not-allowed
}

.new-store-locator .details-store-item {
    border-bottom: 1px solid #ccd5e2
}

.new-store-locator .details-store-item[open] {
    padding-bottom: 12px
}

.new-store-locator .details-store-item[open] .chevron-icon {
    transform: rotate(180deg)
}

.new-store-locator .details-store-item[open] .store-name-section {
    padding: 6px 0
}

.new-store-locator .details-store-item[open] .sl-store-name {
    font-size: 1.125rem
}

.new-store-locator .details-store-item[open] .sl-address,.new-store-locator .details-store-item[open] .your-store-icon {
    display: none
}

.new-store-locator .store-locator-results:empty {
    width: 100%;
    height: 360px;
    display: flex;
    justify-content: center;
    align-items: center
}

.new-store-locator .store-locator-results:empty::before {
    background-image: url(//cdn.metro-group.com/nextcms/svgs/loader.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    content: ""
}

.new-store-locator .store-locator-results>div:first-of-type {
    border-top: 1px solid #ccd5e2
}

.new-store-locator .no-results {
    width: 100%;
    height: 360px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff
}

.new-store-locator .more-stores {
    background-image: url(//cdn.metro-group.com/nextcms/svgs/loader.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 100%;
    margin: 24px 0;
    border-top-width: 0;
    padding: 0;
    display: none
}

.new-store-locator .show-more {
    display: flex;
    align-items: center;
    padding: 12px 0
}

.new-store-locator .show-more input {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    color: #002d72;
    text-decoration: underline;
    background: 0 0
}

.new-store-locator .plus-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/plus.svg);
    width: 36px;
    height: 36px;
    margin-right: 12px
}

.new-store-locator .store-locator-tabs-wrapper {
    padding: 0 12px;
    display: flex;
    flex-wrap: wrap;
    background-color: #fff;
    position: relative
}

.new-store-locator .store-locator-tabs-wrapper .store-locator-tab {
    flex-basis: 50%
}

.new-store-locator .store-locator-tabs-wrapper .store-locator-tab:first-of-type {
    border-radius: 2px 0 0 2px
}

.new-store-locator .store-locator-tabs-wrapper .store-locator-tab:last-of-type {
    border-radius: 0 2px 2px 0
}

.new-store-locator .listview {
    flex: 0 1 100%
}

.new-store-locator .mapview {
    flex: 1 1 100%;
    margin: 0 -12px
}

.new-store-locator .listview,.new-store-locator .mapview {
    opacity: 0;
    pointer-events: none;
    width: 100%;
    padding-top: 12px;
    position: absolute;
    top: 44px
}

.new-store-locator .map-content {
    width: 100%;
    height: 344px
}

.new-store-locator .tab-switch {
    display: none
}

.new-store-locator .tab-switch+label {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    padding: 6px 8px;
    border: 1px solid #0059e4;
    background-color: #fff
}

.new-store-locator .tab-switch+label:hover {
    text-decoration: underline;
    background-color: inherit;
    border: 1px solid #0059e4
}

.new-store-locator .tab-switch:checked+label {
    font-weight: 700;
    border-width: 2px;
    color: #0047b6;
    background-color: #e6f0ff
}

.new-store-locator .tab-switch:checked+label:hover {
    border-color: inherit;
    text-decoration: unset
}

.new-store-locator .tab-switch:checked#list-view-tab~#listview {
    opacity: 1;
    pointer-events: unset;
    position: relative;
    top: 0
}

.new-store-locator .tab-switch:checked#map-view-tab~#mapview {
    opacity: 1;
    pointer-events: unset;
    position: relative;
    top: 0
}

.new-store-locator .store-info-modal {
    background-color: rgba(0,45,114,.4);
    box-shadow: 0 1px 8px rgba(0,20,50,.2);
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    max-height: 344px;
    min-height: calc(100% - 12px);
    padding: 12px;
    margin-top: 12px
}

.new-store-locator .store-info-modal-content {
    position: relative;
    padding: 16px 12px 12px;
    background-color: #fff;
    box-shadow: 0 1px 8px 0 rgba(0,20,50,.2)
}

.new-store-locator .store-info-modal.visible {
    display: block
}

.new-store-locator .close-icon {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/close-24x.svg);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 20px;
    right: 12px
}

.new-store-locator .store-locator-details {
    width: 100%;
    height: 100%
}

.new-store-locator .store-locator-details .sl-store-name {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    color: #002d72
}

.new-store-locator .store-poi-header {
    padding-top: 4px;
    padding-bottom: 16px
}

.new-store-locator details ::marker {
    display: none
}

.newsletter .row .row .row.column-splitter {
    display: block
}

.newsletter .row .row .row.column-splitter .col-xs-12.col-sm-6 {
    margin-bottom: 0;
    padding: 0
}

.newsletter .row .row .row.column-splitter .col-xs-12.col-sm-6 .component {
    height: 100%
}

.newsletter .row .row .row.column-splitter .col-xs-12.col-sm-6 .rich-text {
    padding: 12px
}

.newsletter .row .row .row.column-splitter .col-xs-12.col-sm-6 .rich-text h2 {
    margin: 0 0 8px;
    font-size: 1.25rem;
    line-height: 1.5
}

.newsletter .row .row .row.column-splitter .col-xs-12.col-sm-6 .rich-text li {
    margin-left: 0
}

.newsletter .row .row .row.column-splitter .col-xs-12.col-sm-6 .sitecore-form form h2 {
    margin: 10px 0 24px;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 1.25rem;
    line-height: 1.5
}

.notification {
    background-color: #fff;
    height: 100%;
    max-width: 1416px;
    margin: 12px 12px 0;
    display: none;
    position: relative
}

.notification .component-content {
    width: 100%
}

.notification.red-alert {
    border: 2px solid #de351b
}

.notification.red-alert .icon {
    background-color: #de351b
}

.notification.information {
    border: 2px solid #0059e4
}

.notification.information .icon {
    background-color: #0059e4
}

.notification.success {
    border: 2px solid #24865b
}

.notification.success .icon {
    background-color: #24865b
}

.notification .notification-section {
    display: inline-flex;
    width: 100%;
    height: 100%
}

.notification .notification-section .close,.notification .notification-section .icon {
    display: inline-flex;
    flex: 0
}

.notification .notification-section .close svg,.notification .notification-section .icon svg {
    vertical-align: middle
}

.notification .notification-section .icon {
    fill: #fff;
    padding: 8px 16px 8px 14px
}

.notification .notification-section .icon svg {
    height: 16px;
    width: 16px
}

.notification .notification-section .icon-information {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/notification-info.svg)
}

.notification .notification-section .icon-alert {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/notification-alert.svg)
}

.notification .notification-section .icon-alert,.notification .notification-section .icon-information {
    display: block;
    flex: unset;
    width: 46px;
    background-repeat: no-repeat;
    background-size: 16px;
    background-position-x: center;
    background-position-y: 4px
}

.notification .notification-section .close {
    fill: #001432;
    padding: 8px
}

.notification .notification-section .close svg {
    height: 16px;
    width: 16px
}

.notification .notification-section .fields-container {
    flex: 1;
    display: block;
    text-align: left;
    line-height: 1.5;
    color: #001432;
    font-size: 13px;
    padding: 6px 0 6px 12px
}

.notification .notification-section .fields-container .info {
    font-weight: 900;
    margin: 0
}

.notification .notification-section .fields-container .desc {
    margin: 0
}

.notification .notification-section .fields-container>a {
    text-decoration: underline;
    margin: auto 8px auto 0;
    color: #001432;
    font-size: 13px;
    line-height: 1.5;
    display: inline-flex
}

body main .notification {
    margin: 0 0 12px
}

body main .notification::after {
    position: absolute;
    display: flex;
    content: " ";
    bottom: -8px;
    left: calc(50% - 3px);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent
}

body main .notification.red-alert::after {
    border-top: 6px solid #de351b
}

body main .notification.information::after {
    border-top: 6px solid #0059e4
}

body main .notification.success::after {
    border-top: 6px solid #24865b
}

body main .notification .notification-section .icon {
    padding: 6px 16px 6px 14px
}

body main .notification .notification-section .fields-container {
    padding: 4px 12px
}

body main .notification .notification-section .fields-container .info:empty {
    display: none
}

.brand-teaser picture {
    display: block;
    line-height: 0
}

.brand-teaser-item {
    text-align: center;
    padding: 24px;
    position: relative
}

.brand-teaser-item .btn-link::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.brand-teaser-row {
    display: flex;
    flex-wrap: wrap
}

.brand-teaser-row>div {
    flex: 1 1 0;
    min-width: 100%
}

.brand-teaser-row>div:first-child:nth-last-child(2) {
    flex: 0 1 calc(50% - 12px)
}

.brand-teaser-row>div:first-child:nth-last-child(3),.brand-teaser-row>div:nth-child(n+4) {
    flex: 0 calc(50% - 12px)
}

.brand-teaser img {
    margin: 0 auto 10px;
    height: 140px;
    width: 140px;
    object-fit: contain
}

.brand-teaser .h2 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    width: 100%;
    margin-bottom: 8px
}

.brand-teaser .field-description {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.brand-teaser.comp-box {
    padding: 24px 0
}

.brand-teaser .obt-section {
    margin: 0 8.3333333333%;
    text-align: center
}

.list-pagination {
    background: 0 0
}

.list-pagination nav {
    font-size: 13px
}

.list-pagination nav>a,.list-pagination nav>span {
    display: inline-block;
    margin: 2px 1px 2px 0;
    padding: 4px 8px;
    font-size: 1em;
    font-weight: 700;
    border: 1px solid #d2d2d2
}

.list-pagination nav>a:hover,.list-pagination nav>span:hover {
    color: #89c6cc;
    background: #f6f6f6;
    text-decoration: none;
    border: 1px solid #15909c
}

.list-pagination nav>a:focus,.list-pagination nav>span:focus {
    text-decoration: none;
    color: #89c6cc
}

.list-pagination nav>span.active {
    background: #f6f6f6;
    color: #89c6cc;
    border: 1px solid #d2d2d2
}

.list-pagination nav>span.inactive {
    color: #aaa
}

.list-pagination nav>span.inactive:hover {
    background: 0 0;
    border: 1px solid #d2d2d2
}

.plain-html {
    padding: 0 6px 12px
}

.plain-html .component-content {
    background-color: #fff;
    padding: 12px
}

.product-teaser {
    max-width: 1440px;
    margin-bottom: 12px
}

.product-teaser .products-div {
    position: relative
}

.product-teaser .products-div .btn-left {
    left: -12px
}

.product-teaser .products-div .btn-right {
    right: -12px
}

.product-teaser .products-div:hover .btn-left,.product-teaser .products-div:hover .btn-right {
    opacity: 1
}

.product-teaser .swipable {
    max-height: 554px;
    display: flex;
    margin: 0 -12px;
    padding: 0 12px;
    gap: 12px
}

.product-teaser .product-teaser-container {
    background: #fff;
    display: flex;
    flex-direction: column;
    position: relative;
    vertical-align: top;
    min-width: 140px;
    width: 140px
}

.product-teaser .product-teaser-container a {
    text-decoration: none
}

.product-teaser .product-teaser-container a .badge {
    width: fit-content
}

.product-teaser .product-teaser-container .product-teaser-link {
    text-decoration: none;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 12px
}

.product-teaser .product-teaser-container .product-teaser-link:hover {
    color: inherit
}

.product-teaser .product-teaser-container .field-image {
    text-align: center;
    display: block;
    line-height: 0
}

.product-teaser .product-teaser-container img {
    width: 108px;
    height: 108px;
    object-fit: contain;
    margin-bottom: 12px
}

.product-teaser .product-teaser-container .h4 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: 13px
}

.product-teaser .product-teaser-container .h4.favorite {
    height: auto
}

.product-teaser .product-teaser-container .login-button-container {
    padding: 0 12px 12px
}

.product-teaser .product-teaser-container .stock-container .stock-status,.product-teaser .product-teaser-container .stock-container .stock-status p {
    display: flex;
    font-size: 11px;
    align-items: flex-start;
    line-height: 16px
}

.product-teaser .product-teaser-container .stock-container .stock-status::before {
    min-width: 16px;
    min-height: 16px;
    margin-right: 5px;
    background-repeat: no-repeat;
    background-position: center center;
    display: inline-block;
    content: " "
}

.product-teaser .product-teaser-container .stock-container .stock-status.store.available::before {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/store_available.svg)
}

.product-teaser .product-teaser-container .stock-container .stock-status.store.limited::before {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/store_limited.svg)
}

.product-teaser .product-teaser-container .stock-container .stock-status.store.unavailable::before {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/store_unavailable.svg)
}

.product-teaser .product-teaser-container .stock-container .stock-status.delivery.available::before {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/delivery_available.svg)
}

.product-teaser .product-teaser-container .stock-container .stock-status.delivery.limited::before {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/delivery_limited.svg)
}

.product-teaser .product-teaser-container .stock-container .stock-status.delivery.unavailable::before {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/delivery_unavailable.svg)
}

.product-teaser .product-teaser-container .pack-article-container {
    display: inline-flex;
    margin-bottom: 6px
}

.product-teaser .product-teaser-container .field-pack-size {
    margin: 12px 0;
    font-weight: 700;
    border-radius: 10px;
    color: #33435b;
    background: #e5e7ea;
    position: relative;
    box-sizing: border-box;
    line-height: 1;
    padding: 4px 5px 3px;
    font-size: .781rem;
    height: auto;
    border: 1px solid #b2b9c2;
    width: fit-content
}

.product-teaser .product-teaser-container .field-article-number {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin-left: 13px
}

.product-teaser .product-teaser-container .buy-more-pay-less {
    color: #fff;
    font-size: .781rem;
    background: #33578e;
    border-radius: 2px;
    display: inline-flex;
    vertical-align: baseline;
    padding: 0 5px;
    box-sizing: border-box;
    font-weight: 700;
    align-self: flex-start;
    margin: 4px 0 10px
}

.product-teaser .product-teaser-container .product-login {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    background-color: #e6f0ff;
    border-radius: 2px;
    text-align: center;
    padding: 9px 22px;
    border: 2px solid #e6f0ff;
    height: auto;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-decoration: none;
    transition: background-color 150ms;
    display: block;
    margin-top: auto
}

.product-teaser .product-teaser-container .product-login:hover {
    color: #fff;
    background-color: #0047b6;
    border-color: #0047b6
}

.product-teaser .product-teaser-container .product-login * {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: inherit;
    text-transform: inherit;
    display: inline;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.product-teaser .product-teaser-container .field-price-primary {
    display: inline-flex;
    margin-top: auto;
    order: 1;
    font-size: 1.125rem
}

.product-teaser .product-teaser-container .field-price-primary p {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    display: block
}

.product-teaser .product-teaser-container .price-position {
    margin-top: auto;
    padding-top: 15px
}

.product-teaser .product-teaser-container .price-wrapper {
    display: flex;
    align-content: center
}

.product-teaser .product-teaser-container .price-wrapper.has-discount .h4 {
    color: #af3375
}

.product-teaser .product-teaser-container .discount {
    margin: auto 0 auto 6px;
    border-radius: 10px;
    padding: 1px 5px 0;
    order: 2;
    color: #fff!important;
    font-size: 11px;
    line-height: 13px
}

.product-teaser .product-teaser-container .strikethrough,.product-teaser .product-teaser-container .strikethrough span {
    font-size: 11px;
    color: #33435b;
    text-decoration: line-through
}

.product-teaser .product-teaser-container .field-price-before {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    text-decoration: line-through
}

.product-teaser .product-teaser-container .field-price-secondary {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 11px;
    color: #33435b;
    position: relative
}

.product-teaser .product-teaser-container .add-to-cart {
    display: inline-flex;
    height: 40px;
    text-align: center;
    margin: 12px 0
}

.product-teaser .product-teaser-container .add-to-cart button,.product-teaser .product-teaser-container .add-to-cart>input {
    width: 50%;
    align-items: center;
    border: 0;
    border-radius: 2px
}

.product-teaser .product-teaser-container .add-to-cart input {
    border: 1px solid #b2b9c2;
    margin-right: 12px;
    text-align: center;
    border-radius: 2px;
    background-color: #fff
}

.product-teaser .product-teaser-container .add-to-cart button {
    background-color: #0059e4;
    color: #fff
}

.product-teaser .product-teaser-container .add-to-cart input:disabled {
    background-color: #fff
}

.product-teaser .product-teaser-container .add-to-cart button:disabled {
    color: #667284;
    background-color: #f2f5f8;
    background-image: repeating-linear-gradient(40deg,rgba(230,232,235,.5) 0,rgba(230,232,235,.5) 2px,rgba(230,232,235,0) 2px,rgba(230,232,235,0) 10px)
}

.product-teaser .product-teaser-container .product-dropdown {
    height: 40px;
    display: flex;
    border-radius: 2px;
    border: 1px solid #b2b9c2
}

.product-teaser .product-teaser-container .product-dropdown>span {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: inherit;
    margin: auto auto auto 0;
    padding: 8px 12px;
    color: #7f8a99
}

.product-teaser .products-div.owl-loaded {
    max-height: none
}

.product-teaser .product-teaser-container:last-of-type {
    margin-right: 0
}

.product-teaser-tabbed .custom-tabfilter .facet-dropdown-tab {
    display: block
}

.product-teaser-tabbed .product-teaser-wrapper {
    transition: .25s;
    justify-content: flex-start;
    scrollbar-width: none;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    overscroll-behavior: auto;
    overflow-y: hidden;
    overflow-x: scroll;
    flex-wrap: nowrap;
    margin: 0 -12px 12px;
    padding: 0 12px;
    display: flex;
    gap: 12px
}

.product-teaser-tabbed .product-teaser-wrapper::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0
}

.product-teaser-tabbed .products-div.product-teaser {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    max-width: none;
    margin-bottom: 0
}

.product-teaser-tabbed .load-more {
    display: flex;
    justify-content: center;
    min-width: 140px;
    align-items: stretch;
    flex-wrap: wrap;
    margin-bottom: 0
}

.product-teaser-tabbed .load-more .button-content {
    font-size: .8125rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #0059e4
}

.product-teaser-tabbed .load-more .button-content svg {
    width: 32px;
    height: auto;
    fill: #0059e4
}

.product-teaser-tabbed .load-more .button-content span {
    margin-top: 18px
}

.product-teaser-tabbed .load-more:after,.product-teaser-tabbed .load-more:before {
    display: none
}

.promotion-teaser-v2 {
    margin: 0 -12px;
    display: flex;
    flex: 0 0 100%;
    padding-left: 12px
}

.promotion-teaser-v2 .component-content {
    height: 100%
}

.promotion-teaser-v2 .promotion-teaser {
    position: relative;
    flex: 0 0 100%;
    max-width: calc(100% - 72px);
    margin-right: 12px
}

.promotion-teaser-v2 .promotion-teaser a,.promotion-teaser-v2 .promotion-teaser a:active,.promotion-teaser-v2 .promotion-teaser a:focus {
    text-decoration: none
}

.promotion-teaser-v2 .promotion-teaser a:not([href]):hover {
    cursor: default
}

.promotion-teaser-v2 .promotion-teaser .image {
    font-size: 0;
    line-height: 0
}

.promotion-teaser-v2 .promotion-teaser img {
    object-fit: cover;
    aspect-ratio: 2/1
}

.promotion-teaser-v2 .promotion-teaser .content {
    padding: 24px 12px 31px;
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center
}

.promotion-teaser-v2 .promotion-teaser .content .h2 {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin: 16px 0
}

.promotion-teaser-v2 .promotion-teaser .content .text {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.promotion-teaser-v2 .promotion-teaser a.scEnabledChrome {
    width: 100%;
    display: block
}

.recipe.icon-teaser-row {
    padding: 0 0 48px
}

.recipe.icon-teaser-row .teasers>div {
    padding: 0
}

.recipe .ingredient-container {
    padding-bottom: 24px
}

.recipe .ingredient-container .h5 {
    display: flex;
    padding: 0 18px 12px
}

.recipe .ingredient-container .field-amount-label,.recipe .ingredient-container .field-ingredient-label {
    flex: 1 0 50%;
    width: 50%
}

.recipe .ingredient-row {
    display: flex;
    padding: 0 18px 12px
}

.recipe .ingredient-row .field-amount {
    padding-right: 6px
}

.recipe .ingredient-row .field-ingredient,.recipe .ingredient-row .inner-ingredient-container {
    flex: 1 0 50%
}

.recipe .steps-container .recipe-steps {
    margin: 24px 18px
}

.recipe .steps-container .recipe-steps:first-of-type {
    margin-top: 0
}

.row .recipe-parent-container .row.column-splitter {
    display: block;
    margin: 0 -6px
}

.row .recipe-parent-container .row.column-splitter>div {
    background: #fff;
    border-radius: 2px;
    margin-bottom: 12px
}

.row .recipe-parent-container .h2 {
    padding: 24px 0;
    text-align: center
}

.recipe-overview .featured-recipe,.recipe-overview .time-to-cook {
    text-align: center;
    margin: -12px -12px 12px;
    padding: 12px
}

.recipe-overview .featured-recipe .hero-image-wrapper,.recipe-overview .time-to-cook .hero-image-wrapper {
    font-size: 0;
    line-height: 0;
    margin-top: 24px
}

.recipe-overview .featured-recipe .h1,.recipe-overview .featured-recipe .h2,.recipe-overview .featured-recipe p,.recipe-overview .time-to-cook .h1,.recipe-overview .time-to-cook .h2,.recipe-overview .time-to-cook p {
    margin: 12px
}

.recipe-overview .featured-recipe img,.recipe-overview .time-to-cook img {
    width: 100%;
    object-fit: cover;
    height: auto
}

.all-recipes {
    display: flex;
    flex-wrap: wrap;
    padding: 12px 6px
}

.all-recipes .field-teaser-image {
    font-size: 0;
    line-height: 0
}

.all-recipes img {
    width: 100%;
    height: 125px;
    object-fit: cover;
    border-radius: 2px
}

.all-recipes .h5 {
    margin: 12px 0 4px
}

.all-recipes dl {
    display: inline-flex;
    width: 100%
}

.all-recipes dl dt {
    flex: 1 0 50%;
    font-weight: 700
}

.all-recipes dl dd {
    flex: 1 0 50%
}

.all-recipes .recipe-teaser-container {
    width: calc(50% - 12px);
    margin: 0 6px;
    padding-bottom: 24px
}

.component .component-content .documentation-content-block .component-content,.component .component-content .rich-text .component-content {
    margin: 12px
}

.content-component,.documentation-content-block .description-text,.rich-text,html:not([class]) body {
    max-width: 100%
}

.content-component h1,.documentation-content-block .description-text h1,.rich-text h1,html:not([class]) body h1 {
    margin-bottom: 3.04px
}

.content-component h2,.documentation-content-block .description-text h2,.rich-text h2,html:not([class]) body h2 {
    margin-bottom: 4.72px
}

.content-component h3,.documentation-content-block .description-text h3,.rich-text h3,html:not([class]) body h3 {
    margin-bottom: 4.3px
}

.content-component h4,.documentation-content-block .description-text h4,.rich-text h4,html:not([class]) body h4 {
    margin-bottom: 5.84px
}

.content-component h5,.documentation-content-block .description-text h5,.rich-text h5,html:not([class]) body h5 {
    margin-bottom: -.16px
}

.content-component a,.content-component b,.content-component em,.content-component ol li,.content-component p,.content-component small,.content-component span,.content-component strong,.content-component ul li,.documentation-content-block .description-text a,.documentation-content-block .description-text b,.documentation-content-block .description-text em,.documentation-content-block .description-text ol li,.documentation-content-block .description-text p,.documentation-content-block .description-text small,.documentation-content-block .description-text span,.documentation-content-block .description-text strong,.documentation-content-block .description-text ul li,.rich-text a,.rich-text b,.rich-text em,.rich-text ol li,.rich-text p,.rich-text small,.rich-text span,.rich-text strong,.rich-text ul li,html:not([class]) body a,html:not([class]) body b,html:not([class]) body em,html:not([class]) body ol li,html:not([class]) body p,html:not([class]) body small,html:not([class]) body span,html:not([class]) body strong,html:not([class]) body ul li {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.content-component span,.documentation-content-block .description-text span,.rich-text span,html:not([class]) body span {
    font-style: inherit
}

.content-component b,.content-component strong,.documentation-content-block .description-text b,.documentation-content-block .description-text strong,.rich-text b,.rich-text strong,html:not([class]) body b,html:not([class]) body strong {
    font-weight: 700
}

.content-component a,.documentation-content-block .description-text a,.rich-text a,html:not([class]) body a {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: underline
}

.content-component a:active,.content-component a:hover,.documentation-content-block .description-text a:active,.documentation-content-block .description-text a:hover,.rich-text a:active,.rich-text a:hover,html:not([class]) body a:active,html:not([class]) body a:hover {
    color: #0059e4;
    cursor: pointer
}

.content-component small,.documentation-content-block .description-text small,.rich-text small,html:not([class]) body small {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.content-component p,.documentation-content-block .description-text p,.rich-text p,html:not([class]) body p {
    margin-top: 0;
    margin-bottom: 9.75px
}

.content-component em,.documentation-content-block .description-text em,.rich-text em,html:not([class]) body em {
    font-style: italic
}

.content-component ol,.content-component ul,.documentation-content-block .description-text ol,.documentation-content-block .description-text ul,.rich-text ol,.rich-text ul,html:not([class]) body ol,html:not([class]) body ul {
    padding: 0;
    position: relative;
    margin: 0 0 12px;
    text-align: left
}

.content-component ol>li,.content-component ul>li,.documentation-content-block .description-text ol>li,.documentation-content-block .description-text ul>li,.rich-text ol>li,.rich-text ul>li,html:not([class]) body ol>li,html:not([class]) body ul>li {
    padding: 0 0 0 20px;
    list-style-type: none;
    position: relative;
    display: flow-root
}

.content-component ol>li::before,.content-component ul>li::before,.documentation-content-block .description-text ol>li::before,.documentation-content-block .description-text ul>li::before,.rich-text ol>li::before,.rich-text ul>li::before,html:not([class]) body ol>li::before,html:not([class]) body ul>li::before {
    content: "\2022";
    position: absolute;
    left: 0px;
    font-size: 13px;
    top: 0
}

.content-component ol li b:-moz-only-whitespace,.content-component ol li b:blank,.content-component ol li b:empty,.content-component ol li strong:-moz-only-whitespace,.content-component ol li strong:blank,.content-component ol li strong:empty,.content-component ul li b:-moz-only-whitespace,.content-component ul li b:blank,.content-component ul li b:empty,.content-component ul li strong:-moz-only-whitespace,.content-component ul li strong:blank,.content-component ul li strong:empty,.documentation-content-block .description-text ol li b:-moz-only-whitespace,.documentation-content-block .description-text ol li b:blank,.documentation-content-block .description-text ol li b:empty,.documentation-content-block .description-text ol li strong:-moz-only-whitespace,.documentation-content-block .description-text ol li strong:blank,.documentation-content-block .description-text ol li strong:empty,.documentation-content-block .description-text ul li b:-moz-only-whitespace,.documentation-content-block .description-text ul li b:blank,.documentation-content-block .description-text ul li b:empty,.documentation-content-block .description-text ul li strong:-moz-only-whitespace,.documentation-content-block .description-text ul li strong:blank,.documentation-content-block .description-text ul li strong:empty,.rich-text ol li b:-moz-only-whitespace,.rich-text ol li b:blank,.rich-text ol li b:empty,.rich-text ol li strong:-moz-only-whitespace,.rich-text ol li strong:blank,.rich-text ol li strong:empty,.rich-text ul li b:-moz-only-whitespace,.rich-text ul li b:blank,.rich-text ul li b:empty,.rich-text ul li strong:-moz-only-whitespace,.rich-text ul li strong:blank,.rich-text ul li strong:empty,html:not([class]) body ol li b:-moz-only-whitespace,html:not([class]) body ol li b:blank,html:not([class]) body ol li b:empty,html:not([class]) body ol li strong:-moz-only-whitespace,html:not([class]) body ol li strong:blank,html:not([class]) body ol li strong:empty,html:not([class]) body ul li b:-moz-only-whitespace,html:not([class]) body ul li b:blank,html:not([class]) body ul li b:empty,html:not([class]) body ul li strong:-moz-only-whitespace,html:not([class]) body ul li strong:blank,html:not([class]) body ul li strong:empty {
    display: none
}

.content-component ol,.documentation-content-block .description-text ol,.rich-text ol,html:not([class]) body ol {
    counter-reset: item
}

.content-component ol>li::before,.documentation-content-block .description-text ol>li::before,.rich-text ol>li::before,html:not([class]) body ol>li::before {
    content: counters(item,".") ".";
    counter-increment: item;
    position: absolute;
    margin-right: 100%;
    font-size: inherit
}

html:not([class]) body .documents {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-align: center
}

.row-splitter {
    margin-left: 0;
    margin-right: 0
}

.row-splitter .container-fluid {
    padding-left: 0;
    padding-right: 0
}

.row-splitter .container-fluid .row {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0
}

.load-more label {
    background: 0 0;
    color: #747474
}

.load-more button,.load-more input {
    display: inline-block;
    box-sizing: border-box;
    background: #fff!important;
    border: 1px solid #d2d2d2;
    border-radius: 0!important;
    color: #747474;
    font-weight: 400;
    padding: 8px 2%;
    clear: both;
    height: auto;
    font-size: 13px
}

.load-more input:focus {
    border: 1px solid #d2d2d2
}

.load-more button,.load-more input[type=button],.load-more input[type=reset],.load-more input[type=submit] {
    border: 1px solid #89c6cc;
    padding: 5px 20px
}

.load-more button:hover,.load-more input[type=button]:hover,.load-more input[type=reset]:hover,.load-more input[type=submit]:hover {
    background: #f7f7f7!important
}

.load-more button::-moz-focus-inner,.load-more input::-moz-focus-inner {
    border: 0;
    padding: 0
}

.load-more input[type=text] {
    font-size: 13px
}

.load-more input[type=email],.load-more input[type=password],.load-more input[type=text],.load-more select,.load-more textarea {
    box-shadow: inset 0 1px 5px rgba(0,0,0,.1);
    color: #747474;
    width: 100%;
    background: #fff;
    border: 1px solid #d2d2d2
}

.load-more select {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    outline: 0;
    cursor: pointer;
    padding: 5px
}

.page-selector {
    text-align: center;
    padding: 12px;
    margin-bottom: 12px;
    background: #fff;
    height: 56px;
    width: calc(100% + 24px);
    margin-left: -12px
}

.page-selector .page-selector-list li.inactive a {
    color: #aaa;
    cursor: default
}

.page-selector a {
    text-decoration: none;
    font-weight: 700;
    font-size: 1em
}

.page-selector .page-selector-item-link {
    display: block;
    text-decoration: none;
    font-weight: 400;
    height: 28px;
    line-height: 22px;
    padding: 2px 9px;
    margin-left: 5px;
    border: 1px solid #d2d2d2
}

.page-selector .page-selector-item-link.active {
    font-weight: 700;
    color: #89c6cc;
    border: 1px solid #15909c;
    background: #f6f6f6
}

.page-selector .page-selector-item-link:hover {
    color: #89c6cc;
    border: 1px solid #15909c;
    background: #f6f6f6
}

.page-selector .page-selector-item-link.inactive {
    color: #aaa
}

.search-results-count .progress,.search-results-count .results-count {
    display: none
}

.variant-selector.component {
    margin: 30px 0 0
}

.variant-selector .component-content>div {
    height: 30px;
    display: inline-block;
    width: 30px;
    margin: 2px;
    cursor: Pointer
}

.variant-selector .variant-option:before {
    display: block;
    height: 100%;
    font-size: 30px;
    width: 100%;
    text-align: center
}

.variant-selector .variant-option.active-variant,.variant-selector .variant-option.horizontal.active-variant,.variant-selector .variant-option.vertical.active-variant {
    color: #15909c
}

#content-search-count {
    background: #fff;
    position: relative;
    padding: 12px 24px;
    width: calc(100% + 24px);
    margin-left: -12px;
    margin-top: -12px
}

#content-search-count .results-count {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.25rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit
}

#content-search-count .tab {
    overflow: hidden
}

.location-filter input {
    background: #fff!important
}

.site-header-search .m-button .m-icon {
    margin-bottom: 1px
}

.page-selector .page-selector-list {
    overflow-y: scroll;
    display: flex;
    width: calc(100% - 24px);
    margin-left: 12px
}

.page-selector .page-selector-list li:first-of-type {
    margin-left: 0
}

.page-selector .page-selector-list li:last-of-type {
    margin-right: 0
}

.page-selector .page-selector-list .page-selector-item-first,.page-selector .page-selector-list .page-selector-item-last,.page-selector .page-selector-list .page-selector-item-next,.page-selector .page-selector-list .page-selector-item-previous {
    border-radius: 2px;
    background: #e6f0ff;
    height: 32px;
    margin: 0 6px;
    padding: 5px 6px
}

.page-selector .page-selector-list .page-selector-item-first a,.page-selector .page-selector-list .page-selector-item-last a,.page-selector .page-selector-list .page-selector-item-next a,.page-selector .page-selector-list .page-selector-item-previous a {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: lineheight(lato);
    color: #002d72;
    text-transform: inherit
}

.page-selector .page-selector-list .page-selector-item-first .page-selector-item-link.active,.page-selector .page-selector-list .page-selector-item-last .page-selector-item-link.active,.page-selector .page-selector-list .page-selector-item-next .page-selector-item-link.active,.page-selector .page-selector-list .page-selector-item-previous .page-selector-item-link.active {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: lineheight(lato);
    color: #002d72;
    text-transform: inherit;
    border: none;
    background: #fff
}

.page-selector .page-selector-list li {
    display: inline-block;
    vertical-align: middle;
    margin: 0
}

.page-selector .page-selector-list li .page-selector-item-link {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: lineheight(lato);
    color: #0059e4;
    text-transform: inherit;
    border: none;
    background: 0 0;
    margin: auto;
    height: 32px;
    padding: 5px 12px
}

.page-selector .page-selector-list li .page-selector-item-link.active {
    color: #002d72;
    font-weight: 700
}

.page-selector .page-selector-list li:nth-child(3) {
    margin-left: 6px;
    margin-right: 0
}

.page-selector .page-selector-list li:nth-last-child(3) {
    margin-right: 6px;
    margin-left: 0
}

.page-selector-empty {
    display: none
}

.component.search-results.highlighted {
    background-color: #f2f5f8
}

.component.search-results.highlighted .search-result-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    list-style: none
}

.component.search-results.highlighted li {
    flex: 100%
}

.component.search-results.highlighted.catalogs-search-results {
    margin: 0 0 -12px
}

.component.search-results.highlighted.catalogs-search-results li {
    flex: inherit
}

.component.search-results.highlighted .container-image img {
    display: table-cell;
    width: 110px;
    height: 110px;
    text-align: center;
    position: absolute;
    float: left;
    object-fit: cover
}

.component.search-results.highlighted .content-container {
    padding: 12px;
    border-radius: 2px;
    height: 134px;
    background-color: #fff;
    display: table;
    width: 100%;
    margin-bottom: 12px
}

.component.search-results.highlighted .content-container div {
    float: left
}

.component.search-results.highlighted .container-text {
    display: table-cell;
    vertical-align: top;
    padding-left: 122px;
    width: 100%
}

.component.search-results.highlighted .container-text .field-metadescription,.component.search-results.highlighted .container-text .field-opengraphdescription {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: inherit;
    color: #33435b
}

.component.search-results.highlighted .container-text .field-title {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 16px;
    line-height: 1.33;
    color: #002d72
}

.component.search-results.highlighted .no-results {
    height: 64px;
    width: calc(100% - 12px);
    display: inline-block;
    background-color: #fff;
    padding: 24px;
    color: #33435b;
    margin-bottom: 12px
}

.load-more input[type=button]:hover {
    background: 0 0!important
}

.seasonal-wrapper .promotion-teaser-v2 {
    margin: 0 auto;
    padding: 0
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser {
    max-width: 100%;
    margin-bottom: 0
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser .content {
    align-items: flex-start;
    text-align: left;
    padding: 16px 24px 24px
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser .content .text {
    margin-bottom: 18px
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser .content h2 {
    margin: 0 0 12px;
    word-break: break-word
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser .image {
    position: relative;
    display: block
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser .btn-full {
    max-width: calc(100vw - 72px);
    text-overflow: ellipsis;
    overflow: hidden;
    display: block
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser .badge {
    margin: 24px 0 0 24px;
    max-width: calc(100% - 48px);
    word-break: break-word
}

.seasonal-wrapper .promotion-teaser-v2 .promotion-teaser img {
    display: none
}

.seasonal-wrapper .products-div .swipable {
    height: 100%;
    margin: 0;
    padding: 0;
    background: linear-gradient(-180deg,#fff 0,#f2f5f8 100%)
}

.default-section-div,.section-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.section-title {
    padding: 0 12px
}

.section-title>a {
    margin: 17px 0 5px
}

.section-title>a:empty,.section-title>a:not([href]),.section-title>a[href=""] {
    display: none
}

.section-title .h4 {
    margin: 24px 0 12px
}

.section-title .h4:empty {
    display: none
}

.section-title a {
    margin-left: auto
}

.section-title .default-section-text {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    padding: 7px 0
}

.section-title .view-all-link {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: underline;
    display: inline-block;
    padding: 10px 0
}

.section-title .view-all-link:active,.section-title .view-all-link:hover {
    color: #0059e4;
    cursor: pointer
}

.section-title.accordion-header .accordion-item-label-button {
    padding-right: 0;
    display: flex;
    justify-content: space-between
}

.section-title.accordion-header .accordion-item-label-button:after {
    display: none
}

.section-title.accordion-header .accordion-item-label-button[aria-expanded=true] .component-hide {
    display: flex
}

.section-title.accordion-header .accordion-item-label-button[aria-expanded=true] .component-show {
    display: none
}

.section-title.accordion-header~.accordion-item-content:not(.expanded) {
    border-top: 1px solid #99a1ad
}

.section-title .component-hide,.section-title .component-show {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: underline;
    align-items: center;
    margin-top: 12px
}

.section-title .component-hide:active,.section-title .component-hide:hover,.section-title .component-show:active,.section-title .component-show:hover {
    color: #0059e4;
    cursor: pointer
}

.section-title .component-hide svg,.section-title .component-show svg {
    margin-left: 7px;
    transform: rotate(180deg)
}

.section-title .component-hide,.section-title .component-hide div,.section-title .component-show div {
    display: none
}

.section-title .component-show {
    display: flex
}

.default-section-div {
    flex-grow: 1
}

.default-section-div>.default-section-text {
    margin: 17px 0 5px;
    min-height: 40px
}

.default-section-div>.default-section-text:empty {
    display: none
}

.default-section-div>a>* {
    margin: 17px 0 5px;
    min-height: 40px
}

.default-section-div>a:empty,.default-section-div>a>:empty,.default-section-div>a[href=""] {
    display: none
}

.icon-teaser-row {
    text-align: center
}

/* .icon-teaser-row img {
    width: auto;
    width: 50px;
    height: 40px;
    transition: filter 150ms ease-in-out;
} */

.icon-teaser-row .btn-link::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.icon-teaser-row h2 {
    margin-top: 28.72px
}

.icon-teaser-row .field-description {
    margin-top: 14.995px
}

.icon-teaser-row .field-description,.icon-teaser-row h2 {
    padding: 0 24px
}

.icon-teaser-row .teasers {
    display: block;
    padding-top: 24px
}

.icon-teaser-row .teasers>div {
    padding: 0 20% 24px
}

.icon-teaser-row .teasers>.component:first-child:nth-last-child(2),.icon-teaser-row .teasers>.component:first-child:nth-last-child(2)~.component {
    flex: 0 1 33%
}

.icon-teaser-row .teasers>.component:first-child:nth-last-child(3),.icon-teaser-row .teasers>.component:first-child:nth-last-child(3)~.component {
    flex: 0 1 25%
}

.icon-teaser-row .teasers>.component:first-child:nth-last-child(4),.icon-teaser-row .teasers>.component:first-child:nth-last-child(4)~.component {
    flex: 0 1 19%
}

.icon-teaser-row .h5 {
    margin-top: 5.84px;
    margin-bottom: 5.84px;
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.icon-teaser-row .element-position {
    position: relative;
    overflow: hidden
}

.icon-teaser-row .element-position:focus-within img,.icon-teaser-row .element-position:not([data-label=""]):hover img {
    filter: grayscale(30%)
}

#footer .icon-teaser-row {
    max-width: 1440px;
    margin: auto
}

#footer .row>div {
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box
}

#footer .row>.column-splitter {
    max-width: 1440px;
    margin: auto
}

.site-footer {
    display: block!important;
    background: #fff
}

.site-footer .component-row {
    max-width: 100%
}

.site-footer .component-content {
    max-width: 1440px
}

.site-footer ul {
    margin: 0;
    padding: 0
}

.site-footer .col-xs-12.col-sm-4.col-md-3>.component-footer {
    max-width: 100%
}

.site-footer .component.column-splitter {
    display: block;
    padding: 0 12px;
    margin: 0
}

.site-footer .component.column-splitter>div {
    box-sizing: border-box
}

.site-footer .component-footer.link-list {
    display: grid;
    border-bottom: 1px solid #e6e8eb
}

.site-footer .component-footer.link-list .component-content {
    padding: 0 12px
}

.site-footer .component-footer.link-list ul {
    overflow: hidden;
    height: 0;
    transition: height .5s
}

.site-footer .component-footer.link-list ul li {
    padding-left: 36px
}

.site-footer .component-footer.link-list>input[type=checkbox] {
    display: none
}

.site-footer .component-footer.link-list>input[type=checkbox]:checked~.h5 {
    padding-bottom: 6px
}

.site-footer .component-footer.link-list>input[type=checkbox]:checked~.h5 .plus-minus-icon::before {
    display: none
}

.site-footer .component-footer.link-list>input[type=checkbox]:checked~div {
    display: block
}

.site-footer .component-footer.link-list>input[type=checkbox]:checked~div ul {
    height: auto;
    overflow: visible;
    margin-bottom: 22px
}

.site-footer .h5 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 20px 12px
}

.site-footer .h5 .text-content {
    padding-top: 3px
}

.site-footer .h5 .plus-minus-icon {
    margin-top: 1px
}

.site-footer .footer-navigation-data .field-link a {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    text-decoration: none;
    font-size: 1rem;
    padding: 6px 0
}

.site-footer .footer-navigation-data .field-link a:active,.site-footer .footer-navigation-data .field-link a:hover {
    color: #0059e4;
    cursor: pointer
}

.site-footer .footer-bottom-text {
    background: #e5effe;
    text-align: center;
    padding: 10px 20px;
    margin: 12px 12px 0
}

.site-footer #footer-copyright {
    color: #002d72;
    line-height: 64px
}

.site-footer .footer-links-data {
    padding: 0 24px;
    order: 2;
    text-align: center;
    border-top: 1px solid #e6e8eb
}

.site-footer-minimal .component.column-splitter .contact-minimal .component-content>div:nth-child(2),.site-footer-minimal .component.column-splitter>div:nth-of-type(3)>div:nth-child(2) {
    display: none
}

.site-footer-minimal .component.column-splitter>div:last-child .footer-contact {
    border-bottom: none
}

.site-footer-minimal .component.column-splitter .footer-contact-minimal {
    width: 100%
}

.site-footer-minimal .component.column-splitter .footer-contact-minimal .footer-minimal-additional-text {
    display: none
}

.site-footer-minimal .footer-links-data {
    margin-top: 0
}

.footer-toggle-height {
    height: 64px
}

.footer-last-row {
    display: flex;
    flex-direction: column;
    margin-top: 12px;
    padding: 0 12px
}

.footer-last-row .footer-language-show {
    order: 1
}

.footer-last-row .footer-language-cms {
    display: none
}

.footer-last-row .footer-language-cms.footer-language-show {
    display: block
}

.footer-last-row .footer-language-slot {
    margin-top: 12px;
    line-height: 40px;
    height: 40px;
    display: none;
    text-align: center
}

.footer-last-row .footer-language-slot.footer-language-show {
    display: block
}

.footer-language {
    position: relative
}

.footer-language .language,.footer-language-suggestions {
    display: none
}

.footer-language .language label {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #0059e4;
    font-size: 16px;
    width: 100%;
    line-height: 40px;
    margin-top: 12px;
    cursor: pointer
}

.site-footer-language.fr-be~.site-footer .footer-language-show .footer-language-suggestions .language.fr-be {
    display: block
}

.site-footer-language.fr-be~.site-footer .footer-language-show .footer-language-suggestions .language.fr-be label {
    color: #002d72
}

.site-footer-language.fr-be~.site-footer .footer-language-show .footer-language-suggestions .language.fr-be label:hover {
    color: #0059e4
}

.site-footer-language.fr-be~.site-footer .footer-language-show .footer-language-suggestions .language.fr-be:hover {
    background: #f2f7ff
}

.site-footer-language.fr-be.active-fr-be~.site-footer .footer-language-show>.fr-be {
    display: flex
}

.site-footer-language.fr-be.active-fr-be~.site-footer .footer-language-show .footer-language-suggestions .language label img {
    display: none
}

.site-footer-language.fr-be.active-fr-be~.site-footer .footer-language-show .footer-language-suggestions .fr-be {
    background: #e5effe
}

.site-footer-language.fr-be.active-fr-be~.site-footer .footer-language-show .footer-language-suggestions .fr-be label.fr-be img {
    display: inline-block
}

.site-footer-language.nl-be~.site-footer .footer-language-show .footer-language-suggestions .language.nl-be {
    display: block
}

.site-footer-language.nl-be~.site-footer .footer-language-show .footer-language-suggestions .language.nl-be label {
    color: #002d72
}

.site-footer-language.nl-be~.site-footer .footer-language-show .footer-language-suggestions .language.nl-be label:hover {
    color: #0059e4
}

.site-footer-language.nl-be~.site-footer .footer-language-show .footer-language-suggestions .language.nl-be:hover {
    background: #f2f7ff
}

.site-footer-language.nl-be.active-nl-be~.site-footer .footer-language-show>.nl-be {
    display: flex
}

.site-footer-language.nl-be.active-nl-be~.site-footer .footer-language-show .footer-language-suggestions .language label img {
    display: none
}

.site-footer-language.nl-be.active-nl-be~.site-footer .footer-language-show .footer-language-suggestions .nl-be {
    background: #e5effe
}

.site-footer-language.nl-be.active-nl-be~.site-footer .footer-language-show .footer-language-suggestions .nl-be label.nl-be img {
    display: inline-block
}

.site-footer-language.kk-kz~.site-footer .footer-language-show .footer-language-suggestions .language.kk-kz {
    display: block
}

.site-footer-language.kk-kz~.site-footer .footer-language-show .footer-language-suggestions .language.kk-kz label {
    color: #002d72
}

.site-footer-language.kk-kz~.site-footer .footer-language-show .footer-language-suggestions .language.kk-kz label:hover {
    color: #0059e4
}

.site-footer-language.kk-kz~.site-footer .footer-language-show .footer-language-suggestions .language.kk-kz:hover {
    background: #f2f7ff
}

.site-footer-language.kk-kz.active-kk-kz~.site-footer .footer-language-show>.kk-kz {
    display: flex
}

.site-footer-language.kk-kz.active-kk-kz~.site-footer .footer-language-show .footer-language-suggestions .language label img {
    display: none
}

.site-footer-language.kk-kz.active-kk-kz~.site-footer .footer-language-show .footer-language-suggestions .kk-kz {
    background: #e5effe
}

.site-footer-language.kk-kz.active-kk-kz~.site-footer .footer-language-show .footer-language-suggestions .kk-kz label.kk-kz img {
    display: inline-block
}

.site-footer-language.ru-kz~.site-footer .footer-language-show .footer-language-suggestions .language.ru-kz {
    display: block
}

.site-footer-language.ru-kz~.site-footer .footer-language-show .footer-language-suggestions .language.ru-kz label {
    color: #002d72
}

.site-footer-language.ru-kz~.site-footer .footer-language-show .footer-language-suggestions .language.ru-kz label:hover {
    color: #0059e4
}

.site-footer-language.ru-kz~.site-footer .footer-language-show .footer-language-suggestions .language.ru-kz:hover {
    background: #f2f7ff
}

.site-footer-language.ru-kz.active-ru-kz~.site-footer .footer-language-show>.ru-kz {
    display: flex
}

.site-footer-language.ru-kz.active-ru-kz~.site-footer .footer-language-show .footer-language-suggestions .language label img {
    display: none
}

.site-footer-language.ru-kz.active-ru-kz~.site-footer .footer-language-show .footer-language-suggestions .ru-kz {
    background: #e5effe
}

.site-footer-language.ru-kz.active-ru-kz~.site-footer .footer-language-show .footer-language-suggestions .ru-kz label.ru-kz img {
    display: inline-block
}

#footer-language-input {
    display: none
}

#footer-language-input:checked~.footer-language-suggestions {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 1px 3px 0 rgba(0,20,50,.2);
    padding: 12px 0
}

#footer-language-input:checked~.footer-language-suggestions label {
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 0 12px;
    line-height: 40px;
    margin: 0
}

.ncms-webcomp .component.site-footer {
    margin: 0
}

.market-selector label {
    background: 0 0;
    color: #747474
}

.market-selector button,.market-selector input {
    display: inline-block;
    box-sizing: border-box;
    background: #fff!important;
    border: 1px solid #d2d2d2;
    border-radius: 0!important;
    color: #747474;
    font-weight: 400;
    padding: 8px 2%;
    clear: both;
    height: auto;
    font-size: 13px
}

.market-selector input:focus {
    border: 1px solid #d2d2d2
}

.market-selector button,.market-selector input[type=button],.market-selector input[type=reset],.market-selector input[type=submit] {
    border: 1px solid #89c6cc;
    padding: 5px 20px
}

.market-selector button:hover,.market-selector input[type=button]:hover,.market-selector input[type=reset]:hover,.market-selector input[type=submit]:hover {
    background: #f7f7f7!important
}

.market-selector button::-moz-focus-inner,.market-selector input::-moz-focus-inner {
    border: 0;
    padding: 0
}

.market-selector input[type=text] {
    font-size: 13px
}

.market-selector input[type=email],.market-selector input[type=password],.market-selector input[type=text],.market-selector select,.market-selector textarea {
    box-shadow: inset 0 1px 5px rgba(0,0,0,.1);
    color: #747474;
    width: 100%;
    background: #fff;
    border: 1px solid #d2d2d2
}

.market-selector select {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    outline: 0;
    cursor: pointer;
    padding: 5px 15px 5px 5px;
    height: auto;
    font-size: 13px;
    color: #747474
}

.sub-header-search-suggestion {
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 3px 10px rgba(0,0,0,.2);
    display: none;
    left: 0;
    position: absolute;
    top: 40px;
    width: 100%
}

.sub-header-search-suggestion .suggestion-section-title {
    color: #7f8a99;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 13px;
    font-style: normal;
    height: 40px;
    line-height: 1.62;
    letter-spacing: normal;
    padding: 10px 15px
}

.sub-header-search-suggestion li {
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom: #fff;
    color: #33435b;
    cursor: pointer;
    position: relative;
    height: 40px;
    overflow: hidden;
    padding: 8px 14px
}

.sub-header-search-suggestion li:first-child {
    border-radius: 2px 2px 0 0
}

.sub-header-search-suggestion li:last-child {
    border-radius: 0 0 2px 2px;
    border-bottom: #ddd
}

.sub-header-search-suggestion li.selected,.sub-header-search-suggestion li:hover {
    background-color: #e6f0ff
}

.sub-header-search-suggestion li>a {
    display: flex;
    flex: 0 1
}

.sub-header-search-suggestion li svg {
    color: #667284;
    display: inline-block;
    height: 14px;
    left: 0;
    margin-right: 14px;
    position: relative;
    top: 6px;
    width: 14px
}

.sub-header-search-suggestion li svg path {
    fill: #858fa0
}

.sub-header-search-suggestion li .suggestion-type {
    font-size: 13px;
    font-weight: 700;
    line-height: 2
}

.sub-header-search-suggestion li.active {
    background-color: #e6f0ff
}

.sub-header-search-suggestion .text-suggestions-content {
    z-index: 65
}

.sub-header-search-suggestion .text-suggestions-content li a {
    padding-left: 28px
}

.sub-header-search-suggestion .text-suggestions-content li a:before {
    background-image: url(//cdn.metro-online.com/nextcms/images/magglass_icon_12x12.svg);
    background-size: 12px 12px;
    color: #858fa0;
    content: "";
    display: block;
    height: 12px;
    left: 14px;
    position: absolute;
    top: 14px;
    width: 12px
}

.sub-header-search-suggestion .text-suggestions-content li.item-category a:before {
    background-image: url(//cdn.metro-online.com/nextcms/images/anchor_icon_13x13.svg);
    background-size: 13px 13px;
    left: 15px;
    top: 13px
}

.sub-header-search-suggestion .article-suggestion-description,.sub-header-search-suggestion .list-item-autosuggestion-text {
    flex: 1;
    overflow: hidden;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap
}

.sub-header-search-suggestion .article-suggestion-title,.sub-header-search-suggestion .list-item-autosuggestion-text,.sub-header-search-suggestion .suggestion-type {
    color: #33435b;
    cursor: pointer;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-style: normal;
    line-height: 1.72;
    text-align: left
}

.sub-header-search-suggestion .article-suggestion-title span,.sub-header-search-suggestion .list-item-autosuggestion-text span,.sub-header-search-suggestion .suggestion-type span {
    font-style: normal
}

.sub-header-search-suggestion .article-suggestions-content li {
    height: 68px
}

.sub-header-search-suggestion .article-suggestions-content li img,.sub-header-search-suggestion .article-suggestions-content li picture {
    margin-right: 12px;
    min-width: 50px
}

.sub-header-search-suggestion .article-suggestions-content li .suggestion-section-promotion {
    background-color: #9b0053;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 11px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.27;
    left: 0;
    letter-spacing: normal;
    padding: 1px 8px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 6px
}

.sub-header-search-suggestion .article-suggestions-content li .article-suggestion-title {
    display: inline-block;
    line-height: 1.25;
    margin-top: 18px
}

.sub-header-search-suggestion .article-suggestions-content li .suggestion-section-promotion+.article-suggestion-title {
    margin-top: 26px
}

header .sub-header-store .store-div .store-selector-toggle {
    cursor: pointer;
    position: relative;
    height: 32px;
    margin-left: 24px;
    width: 100%
}

header .sub-header-store .store-div .store-selector-toggle>i {
    float: left;
    color: #fff;
    padding: 12px 0 4px
}

header .sub-header-store .store-div .store-selector-toggle i:before {
    font-family: metro-mf-icons;
    content: "ï„…"
}

header .sub-header-store .store-div .store-selector-toggle>div {
    height: 32px
}

header .sub-header-store .store-div .store-selector-toggle>div .store-selector-default-store {
    padding-top: 10px
}

header .sub-header-store .store-div .store-selector-toggle>div .store-selector-data-selected-store {
    font-size: 13px;
    font-weight: 400;
    text-align: left
}

header .sub-header-store .store-div .store-selector-toggle>div p {
    font-size: 16px;
    color: #002d72;
    font-weight: 900;
    height: 16px;
    font-family: inherit;
    line-height: inherit
}

header .sub-header-store .store-div .store-selector-toggle>div p span {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

header .sub-header-store .store-div .store-selector-toggle .new-arrow {
    border-bottom-color: #fff;
    display: none;
    width: 0;
    height: 0;
    border-style: solid;
    color: transparent;
    border-width: 0 11px 11px;
    position: absolute;
    bottom: -16px;
    left: 2px;
    z-index: 1061
}

header .sub-header-store .store-div .generic-store-font {
    font-family: Lato;
    line-height: 1.4;
    float: right;
    display: inline-flex
}

header .sub-header-store .store-div .brandbar-popover-store-big {
    max-width: 100vw;
    margin-left: 12px;
    border-radius: 0;
    top: 60px;
    left: 0;
    display: none;
    right: 0;
    padding: 0;
    border: none
}

header .sub-header-store .store-div .popover.bottom>.arrow {
    display: none
}

header .sub-header-store .store-div .popover-content {
    line-height: 1.5em;
    margin-bottom: 0;
    z-index: 1029;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px!important;
    color: #333;
    left: 2px;
    position: relative;
    padding: 24px 24px 0
}

header .sub-header-store .store-div .popover-content .store-name-flyout {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 32px;
    font-weight: 900;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: normal;
    color: #002d72;
    width: 50%
}

header .sub-header-store .store-div .popover-content .store-name-flyout span {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

header .sub-header-store .store-div .popover-content .margin-grid-bottom {
    margin-bottom: 12px;
    margin-right: 0;
    margin-left: 0
}

header .sub-header-store .store-div .popover-content strong {
    font-weight: 700
}

header .sub-header-store .store-div .popover-content .btn-primary {
    height: 40px;
    background-color: #0059e4;
    border-color: #0059e4;
    border-radius: 4px;
    color: #fff;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    font-weight: 900;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: center
}

header .sub-header-store .store-div .popover-content .btn-primary span {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

header .sub-header-store .store-div .ss-plan-trip {
    width: 327px;
    height: 48px;
    background-color: #e6f0ff;
    text-align: center;
    position: absolute;
    top: 24px;
    right: 24px
}

header .sub-header-store .store-div .ss-plan-trip a {
    padding-top: 15px;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 18px;
    font-weight: 900;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.33;
    letter-spacing: normal;
    color: #002d72;
    display: inline-block;
    width: 100%;
    height: 100%
}

header .sub-header-store .store-div .brandbar-popover-store-address {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #34435a;
    padding-left: 2px;
    padding-top: 8px
}

header .sub-header-store .store-div .find-out-more {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    padding-left: 2px;
    padding-top: 8px
}

header .sub-header-store .store-div .store-locator-labels-row {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 13px;
    font-weight: 900;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #99a1ad;
    border-bottom: 1px solid #ccd0d6;
    margin-top: 30px;
    margin-right: 0;
    margin-left: -26px;
    text-transform: uppercase;
    padding-left: 26px;
    padding-right: 22px
}

header .sub-header-store .store-div .store-locator-labels-row div:first-of-type {
    margin-left: -12px;
    margin-right: 12px
}

header .sub-header-store .store-div .brandbar-popover-store-contact {
    margin-top: 9px
}

header .sub-header-store .store-div .brandbar-popover-store-contact a {
    opacity: .9;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.88;
    letter-spacing: normal;
    color: #0059e4
}

header .sub-header-store .store-div .brandbar-popover-store-contact svg {
    width: 15px;
    height: 15px;
    margin-right: 9px
}

header .sub-header-store .store-div .brandbar-popover-store-timings {
    padding-left: 12px;
    padding-right: 12px
}

header .sub-header-store .store-div .brandbar-popover-store-timings:last-of-type {
    padding-right: 0
}

header .sub-header-store .store-div .popover-well.row {
    background-color: #cce0ff;
    padding-top: 12px;
    padding-bottom: 12px;
    margin: 24px 0
}

header .sub-header-store .store-div .popover-well.row .form-group {
    margin-bottom: 0
}

header .sub-header-store .store-div .popover-well.row .ex-address-search-header {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 18px;
    font-weight: 900;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: normal;
    color: #002d72
}

header .sub-header-store .store-div .popover-well.row .ex-address-search-header span {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

header .sub-header-store .store-div .popover-well.row>div {
    height: 40px;
    padding-left: 12px;
    padding-right: 12px
}

header .sub-header-store .store-div .popover-well.row>div:last-child {
    padding-right: 12px
}

header .sub-header-store .store-div .popover-well.row .m-input {
    width: 100%
}

header .sub-header-store .store-div .store-locator-url .text-center {
    margin-bottom: 24px
}

header .sub-header-store .store-div table {
    border: 1px solid #ccd0d6;
    border-collapse: collapse;
    margin-top: 24px;
    width: 100%
}

header .sub-header-store .store-div table tr:first-child {
    background-color: #e6e8eb
}

header .sub-header-store .store-div table td {
    width: auto;
    border: 1px solid #ccd0d6;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    text-align: center;
    color: #34435a;
    vertical-align: middle;
    padding: 13px 0
}

header .sub-header-store .store-div table td span {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

header .sub-header-store .store-div .m-select-option {
    color: #33435b
}

header .sub-header-store .store-div .Select-control .m-select-option:hover {
    background-color: #f2f7ff
}

header .store-div .poi-store-icon {
    height: 32px;
    width: 25px;
    margin-right: 10px
}

header .store-div .poi-store-icon>svg path {
    fill: #002d72
}

header .site-sub-header {
    width: 100%;
    height: auto;
    position: relative;
    min-height: 64px
}

header .site-sub-header>.component-content {
    width: 100%;
    margin: 0 auto
}

header .site-sub-header>.component-content .sub-header-area {
    background-color: #cce0ff
}

header .site-sub-header>.component-content .sub-header-area.right {
    position: relative;
    height: 100%
}

header .site-sub-header>.component-content .sub-header-area:not(.right) {
    position: fixed;
    z-index: 3;
    flex-basis: 100%;
    width: 100%;
    height: 64px;
    max-height: 64px
}

header .site-sub-header>.component-content .sub-header-container {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    margin: 0 auto;
    max-width: 1440px;
    height: inherit;
    width: 100%;
    background-color: #cce0ff;
    padding: 12px 0 12px 12px
}

header .site-sub-header>.component-content .sub-header-container .sub-header-nav,header .site-sub-header>.component-content .sub-header-container .sub-header-search {
    border: none
}

header .site-sub-header>.component-content .sub-header-container>div:not(.sub-header-search) {
    flex: none;
    height: 100%
}

header .site-sub-header>.component-content .sub-header-container>div:not(.sub-header-search):not(:first-child) {
    padding: 0 12px
}

header .site-sub-header>.component-content .sub-header-container>div:not(.sub-header-search)+div {
    padding-left: 0
}

header .site-sub-header>.component-content .sub-header-container>div:not(.sub-header-search):last-child {
    position: relative
}

header .site-sub-header>.component-content .sub-header-container>div:not(.sub-header-search):last-child::after {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    height: 40px
}

header .site-sub-header>.component-content .sub-header-container .sub-header-nav {
    display: none;
    width: 24px;
    margin: 0 15px 0 3px
}

header .site-sub-header>.component-content .sub-header-container .sub-header-nav.is-visible {
    display: inline-block
}

header .site-sub-header>.component-content .sub-header-container .sub-header-nav .nav-icon {
    display: none
}

header .site-sub-header>.component-content .sub-header-container .sub-header-nav .nav-icon.is-visible {
    display: inline-block
}

header .site-sub-header>.component-content .sub-header-container .sub-header-nav .nav-text {
    font-weight: 700;
    font-style: normal;
    font-size: 8px;
    color: #0059e4;
    margin-top: -14px;
    text-align: center;
    line-height: normal
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    flex: 1 0 auto
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search+div {
    border: none
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-title {
    cursor: pointer;
    display: none;
    margin: 0 10px 0 0;
    position: relative;
    align-items: center
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-title .field-search-label {
    color: #002d72;
    font-size: 16px;
    font-style: normal;
    line-height: 1.5;
    text-align: left;
    padding: 0;
    top: 0;
    position: relative;
    background-color: transparent;
    display: inline-flex
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-title svg {
    height: 24px;
    margin-left: 6px;
    width: 24px
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-title svg * {
    fill: #0059e4
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .brand-text,header .site-sub-header>.component-content .sub-header-container .sub-header-search .category-text,header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-placeholder {
    display: none
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-wrapper {
    display: flex;
    flex: 1;
    position: relative
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search input[type=text] {
    background-color: #fff;
    border: none;
    border-radius: 2px;
    box-shadow: none;
    clear: both;
    color: #33435b;
    font-size: 13px;
    height: 40px;
    padding: 8px 14px;
    width: 100%;
    z-index: 1;
    line-height: 1.5
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-title[style*=block]+.search-placeholder+input[type=text],header .site-sub-header>.component-content .sub-header-container .sub-header-search .search-title[style*=block]+input[type=text] {
    width: calc(100% - 97px)
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search button {
    background: #fff;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    font-family: inherit;
    font-size: 1rem;
    line-height: 24px;
    outline: 0;
    padding: 6px 12px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    height: 40px;
    display: flex;
    align-items: center;
    vertical-align: middle;
    z-index: 1
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search button svg:first-child {
    display: none;
    transform: rotate(315deg)
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search input:not(:placeholder-shown)+button svg:first-child,header .site-sub-header>.component-content .sub-header-container .sub-header-search input[value=""]+button svg:first-child,header .site-sub-header>.component-content .sub-header-container .sub-header-search input[value]:not([value=""])+button svg:first-child {
    display: block
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search input:not(:placeholder-shown)+button svg:first-child+svg,header .site-sub-header>.component-content .sub-header-container .sub-header-search input[value=""]+button svg:first-child+svg,header .site-sub-header>.component-content .sub-header-container .sub-header-search input[value]:not([value=""])+button svg:first-child+svg {
    display: none
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 8px rgba(0,0,0,.2);
    display: none;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion a {
    text-decoration: none
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion {
    background-color: #fff;
    color: #33435b;
    cursor: pointer;
    height: 40px;
    line-height: 30px;
    overflow: hidden;
    padding: 6px 14px;
    position: relative
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion .bucket-id {
    display: none
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion:first-child {
    border-radius: 4px 4px 0 0
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion:last-child {
    border-radius: 0 0 4px 4px
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion:hover {
    background-color: #e6f0ff
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion svg {
    display: none;
    position: absolute;
    right: 12px;
    top: 10px;
    transform: scale(.8)
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion.active {
    background-color: #e6f0ff;
    padding-right: 24px
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion.active svg {
    display: block
}

header .site-sub-header>.component-content .sub-header-container .sub-header-search .sub-header-bucket-suggestion .bucket-suggestion span {
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    color: #33435b;
    cursor: pointer;
    text-align: left;
    line-height: 24px;
    font-style: normal
}

header .site-sub-header>.component-content .sub-header-support {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

header .site-sub-header>.component-content .sub-header-support cms-support {
    display: flex;
    align-items: center;
    justify-content: flex-start
}

header .site-sub-header>.component-content .sub-header-support>a {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

header .site-sub-header>.component-content .sub-header-support .support-icon {
    width: 24px;
    height: 24px
}

header .site-sub-header>.component-content .sub-header-support .section-link {
    display: none;
    margin-left: 12px;
    font-weight: 800
}

header .site-sub-header .sub-header-store {
    display: flex;
    max-width: 1440px;
    background-color: #cce0ff;
    justify-content: flex-end
}

header .site-sub-header .sub-header-store .component.store-selector {
    display: none
}

header .site-sub-header .sub-header-store .store-div {
    width: 100%
}

header .site-sub-header .sub-header-store .store-div:empty {
    background: #cce0ff;
    width: 1px;
    height: 45px;
    top: 0;
    right: -1px;
    z-index: 2
}

header .site-sub-header .sub-header-store .generic-store-font {
    height: 1px;
    display: flex;
    float: initial;
    z-index: 1;
    justify-content: flex-end
}

header .site-sub-header .sub-header-store .store-selector-toggle {
    padding-top: 12px;
    padding-right: 12px
}

header .site-sub-header .sub-header-store .store-selector-toggle .new-arrow {
    bottom: -48px
}

.snippet {
    padding-left: 0;
    padding-right: 0
}

.site-footer .social-share-buttons {
    margin-left: auto;
    text-align: center
}

.site-footer .social-share-buttons .component-content {
    padding-top: 4px;
    padding-bottom: 12px
}

.site-footer .social-share-buttons .h5 {
    justify-content: center;
    padding-bottom: 12px
}

.site-footer .social-share-buttons nav {
    padding: 6px 12px
}

.site-footer .social-share-buttons nav,.site-footer .social-share-buttons nav a {
    display: flex;
    justify-content: center;
    align-items: center
}

.site-footer .social-share-buttons nav a,.site-footer .social-share-buttons nav>img {
    margin-right: 10px
}

.site-footer .social-share-buttons nav a {
    width: 24px;
    height: 24px
}

.social-widget-two-column .h2 {
    margin-top: 16.72px;
    margin-bottom: 12.72px
}

.social-widget-two-column .field-description,.social-widget-two-column .h2 {
    text-align: center;
    padding: 0 12px
}

.social-widget-two-column .social-widgets {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 36px
}

.social-widget-two-column .social-widgets .sw-main {
    margin: 0;
    padding: 0;
    width: 100%;
    position: relative;
    display: block;
    content: ""
}

.social-widget-two-column .social-widgets .sw-main>* {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.social-widget-two-column .social-widgets .sw-main.sw-twitter {
    padding: 0
}

.social-widget-two-column .social-widgets .sw-main.sw-twitter>* {
    position: relative
}

.social-widget-two-column .social-widgets>div {
    width: 100%
}

.sw-main {
    padding: 18px 12px;
    margin-bottom: 12px
}

.sw-main .sw-thumbnail {
    padding-right: unset;
    width: 100%;
    height: 100%;
    background: #f2f5f8;
    border-radius: 2px;
    align-items: center;
    justify-content: center;
    display: flex;
    margin-top: 36px;
    overflow: hidden
}

.sw-main .sw-thumbnail img {
    filter: blur(3px);
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    top: -3px
}

.sw-main .sw-thumbnail>div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -56.25%;
    flex-direction: column;
    min-height: 64px
}

.sw-main .sw-thumbnail>div.sw-yt {
    background: url(//cdn.metro-online.com/nextcms/svgs/yt.svg) center no-repeat
}

.sw-main .sw-thumbnail>div.sw-tw {
    background: url(//cdn.metro-online.com/nextcms/svgs/tw.svg) center no-repeat
}

.sw-main .sw-thumbnail>div.sw-yt-filter+div.sw-yt {
    position: relative
}

.sw-main .sw-thumbnail svg {
    width: 64px;
    height: 64px
}

.sw-main .sw-top {
    margin-top: 36px
}

.sw-main .sw-top .sw-content-id {
    display: none
}

.sw-main .sw-top .sw-content-container {
    height: 100%;
    overflow: hidden;
    cursor: pointer
}

.sw-main .sw-top .sw-content-container .overlay,.sw-main .sw-top .sw-content-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.sw-main .sw-top .sw-content-container .overlay embed {
    width: 100%;
    height: 100%
}

.sw-main .sw-top .sw-content-container div {
    height: 100%
}

.sw-main .sw-top .sw-content-container div img {
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    overflow: hidden;
    object-fit: cover;
    top: -3px;
    left: -3px
}

.sw-main .sw-top .sw-content-container div svg {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 68px;
    height: 48px;
    margin-left: -34px;
    margin-top: -24px;
    transition: opacity .25s cubic-bezier(#000 .2,1);
    z-index: 1
}

.sw-main .sw-top .sw-content-container div.sw-yt-filter {
    display: none
}

.sw-main .sw-bottom.row {
    margin: 0;
    padding: 18px 0 0
}

.sw-main .sw-bottom .sw-bottom-column {
    float: none;
    display: inline-block;
    vertical-align: middle;
    width: auto;
    padding: 18px 24px 18px 44px;
    position: relative;
    background: #f2f5f8;
    border-radius: 2px;
    text-align: start
}

.sw-main .sw-bottom .sw-checkbox {
    position: absolute;
    top: 20px;
    left: 24px;
    cursor: pointer;
    height: 20px;
    width: 20px
}

.sw-main .sw-bottom .sw-agreement-label {
    vertical-align: middle
}

.sw-main .sw-bottom .sw-privacy-metro {
    vertical-align: middle;
    margin-left: 5px
}

.sw-main .sw-bottom .sw-privacy-metro a span {
    cursor: pointer
}

.sw-main .preview {
    justify-content: center;
    display: flex;
    align-items: center
}

.sw-main div.sw-yt-filter {
    z-index: 1;
    width: calc(100% + 6px);
    position: absolute;
    height: calc(100% + 6px);
    opacity: .5;
    margin-top: 0;
    background-color: #002d72
}

.sw-main div.sw-yt-filter+div.sw-yt {
    background: url(//cdn.metro-online.com/nextcms/svgs/video.svg) center no-repeat;
    position: absolute;
    z-index: 2;
    width: 77px;
    height: 53px
}

.sw-main .checkbox-container {
    position: relative;
    padding-left: 44px;
    margin-top: 0;
    margin-bottom: 0
}

.sw-main .checkbox-container>[type=checkbox] {
    cursor: pointer;
    height: 100%;
    left: -99999px;
    margin: 0;
    opacity: .00001;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0
}

.sw-main .forms-checkbox-span {
    position: absolute;
    top: 20px;
    left: 12px;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border-radius: 2px;
    border: 2px solid #ccd0d6;
    transition: .25s linear;
    margin-left: 0
}

.sw-main .checkbox-container:focus-within input[type=checkbox]~.forms-checkbox-span,.sw-main .checkbox-container:hover input[type=checkbox]~.forms-checkbox-span {
    box-shadow: 0 0 1px 5px #0059e4;
    border: 2px solid #66a2fe;
    transition: .25s linear
}

.sw-main .checkbox-container input[type=checkbox]:checked~.forms-checkbox-span {
    background-color: #005fff;
    border: none
}

.sw-main .forms-checkbox-span:after {
    content: "";
    position: absolute;
    display: none
}

.sw-main .checkbox-container input[type=checkbox]:checked~.forms-checkbox-span:after {
    display: block
}

.sw-main .checkbox-container .forms-checkbox-span:after {
    left: 7px;
    top: 3px;
    width: 6px;
    height: 12px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    transition: .25s linear
}

.sw-main .sw-content {
    padding: 6px 0 18px
}

.sw-main .sw-content .field-description {
    padding: unset
}

.sw-main .social-widgets {
    margin-top: 36px
}

.sw-main .social-widgets .sw-thumbnail,.sw-main .social-widgets .sw-top {
    margin-top: 0
}

.sw-main .social-widgets .section-title {
    padding: 0 0 3px
}

.sw-main .social-widgets .section-title .h4 {
    margin: 10px 0 12px
}

.sw-main.sw-twitter .sw-content-container {
    padding: 0 6px
}

.sw-main.sw-twitter .twitter-tweet.twitter-tweet-rendered {
    margin: 0 auto!important
}

.store-departments .swipable-arrows {
    margin: 0 -12px
}

.store-departments .departments {
    display: flex;
    flex-wrap: unset;
    width: 100%;
    gap: 12px;
    padding: 0 12px
}

.store-departments .department {
    padding: 12px 24px 24px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    width: calc((100% - 156px)/4);
    align-items: flex-start;
    flex: 1;
    min-width: 248px
}

.store-departments .department svg {
    margin-right: 12px;
    overflow: visible
}

.store-departments .department span {
    display: flex;
    flex-wrap: unset
}

.store-departments .department span span {
    word-break: break-all
}

.store-departments a {
    display: block;
    justify-content: flex-start;
    max-width: 100%;
    overflow: visible
}

.store-departments a:last-child {
    margin-top: 6px
}

.store-departments .h5 {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-bottom: 12px
}

.store-detail-page .notification {
    margin: 0
}

.store-detail-page .h1 {
    padding: 0 12px
}

.store-detail-page .store-info {
    background: #fff;
    padding: 26px 12px 12px;
    text-align: center;
    margin-bottom: 12px
}

.store-detail-page .store-details {
    margin: 10px auto 0;
    text-align: left
}

.store-detail-page .store-details .btn-link {
    display: flex;
    align-items: center;
    padding: 12px 0;
    font-size: 16px
}

.store-detail-page .store-details .btn-link svg {
    margin-right: 10px;
    min-width: 25px
}

.store-detail-page .btn-primary,.store-detail-page .btn-secondary {
    margin-bottom: 12px
}

.store-detail-page .store-buttons {
    margin: 24px 0 0
}

.store-detail-page .store-buttons a:last-of-type {
    margin-bottom: 0
}

.store-detail-page .store-opening-hours {
    width: 100%;
    display: flex;
    flex-wrap: wrap
}

.store-detail-page .store-opening-hours .store-white-box {
    background: #fff;
    width: 100%;
    margin-bottom: 12px;
    padding: 0 12px
}

.store-detail-page .store-opening-hours .store-white-box.expanded {
    padding: 18px 12px
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container {
    display: block
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div {
    margin-bottom: 24px
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div:last-of-type {
    margin-bottom: 0
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .customer-type {
    font-family: Lato,sans-serif;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .781rem;
    font-weight: 700;
    line-height: 21px;
    text-transform: uppercase;
    color: #99a1ad;
    border-bottom: 1px solid #99a1ad;
    margin-bottom: 12px
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time {
    display: flex
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .days-container,.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .time-container {
    display: flex;
    flex: 1 1 50%;
    flex-wrap: wrap
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .days-container>div,.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .time-container>div {
    width: 100%
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .days-container .days,.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .days-container .time,.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .time-container .days,.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .time-container .time {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    flex: 0 0 100%;
    text-align: left
}

.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .days-container .time,.store-detail-page .store-opening-hours .store-white-box .store-opening-container>div .date-time .time-container .time {
    text-align: right;
    font-weight: 900
}

.store-detail-page .store-opening-hours .store-white-box .store-note {
    font-family: Lato,sans-serif;
    font-weight: 400;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin-top: 14px;
    font-style: normal;
    display: block
}

.store-detail-page .store-opening-hours .store-white-box .store-note:empty {
    display: none
}

.store-flyout {
    box-sizing: border-box;
    margin-top: 64px;
    background: #fff;
    border-radius: 0;
    box-shadow: 0 1px 8px 0 rgba(0,20,50,.2);
    width: 100%;
    position: relative
}

.store-flyout * {
    box-sizing: border-box
}

.store-flyout details>summary {
    list-style: none
}

.store-flyout details ::marker,.store-flyout details>summary::-webkit-details-marker {
    display: none
}

.store-flyout .hidden {
    display: none
}

.store-flyout span {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    font-style: normal
}

.store-flyout a,.store-flyout a:active,.store-flyout a:hover {
    text-decoration: none
}

.store-flyout .component-content {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    position: relative
}

.store-flyout .flyout-btn {
    padding: 0;
    margin: 0;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    color: #33435b;
    cursor: pointer
}

.store-flyout .flyout-btn .title {
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 40px;
    margin: 0;
    padding: 5px 12px;
    width: 100%;
    position: relative;
    background: #fff;
    border-radius: 0;
    box-shadow: 0 1px 8px 0 rgba(0,20,50,.2);
    cursor: pointer
}

.store-flyout .flyout-btn .title::before {
    content: "";
    background-size: 20px 20px;
    width: 20px;
    height: 20px;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/location.svg);
    margin-right: 9px
}

.store-flyout .flyout-btn .title::after {
    content: "";
    background-size: 21px 28px;
    width: 21px;
    height: 28px;
    margin-right: 0;
    margin-left: auto;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/right.svg)
}

.store-flyout .flyout-btn[open]>.title {
    background: #e6f0ff
}

.store-flyout .flyout-btn[open]>.title::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/location_hover.svg)
}

.store-flyout .flyout-btn[open]>.title::after {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/right_hover.svg)
}

.store-flyout .field-store-name {
    color: #002d72;
    font-size: 1rem;
    font-weight: 700
}

.store-flyout input {
    display: none
}

.store-flyout .details-area {
    background-color: #fff;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 0;
    bottom: 0;
    margin-top: 0;
    width: 320px;
    display: block
}

.store-flyout .wide {
    height: 100vh
}

.store-flyout .flyout-details {
    display: block;
    z-index: 6;
    top: 0;
    margin-top: 0;
    position: fixed;
    max-height: 100%;
    overflow-y: visible;
    right: 0;
    width: 0;
    transition: width 320ms;
    box-shadow: 0 1px 8px 0 rgba(0,20,50,.2);
    flex-direction: column;
    background: #fff;
    overflow-x: hidden;
    text-align: left;
    justify-content: flex-start
}

.store-flyout .flyout-details .field-store-name {
    color: #33435b;
    font-size: 18px;
    font-weight: 900;
    line-height: 24px;
    margin-bottom: 10px
}

.store-flyout details[open] .flyout-details {
    width: 320px;
    display: block;
    transition: width 320ms
}

.store-flyout .field-offers-may-differ {
    color: #33435b;
    font-size: 11px;
    line-height: 16.5px;
    padding: 5px 0 12px
}

.store-flyout .store-found-label {
    display: flex;
    background: #002d72;
    border-radius: 0;
    width: calc(100% + 24px);
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.5px;
    align-items: center;
    justify-content: left;
    padding: 12px;
    height: 48px
}

.store-flyout .store-found-label .field-store-found-label {
    color: #fff;
    width: 100%
}

.store-flyout .store-found-label .details-close {
    user-select: none;
    padding-right: 16px;
    display: flex
}

.store-flyout .store-found-label .details-close:hover {
    cursor: pointer
}

.store-flyout .store-found-label .details-close::before {
    content: "";
    background-size: 16px 16px;
    width: 16px;
    height: 16px;
    margin-right: 12px;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/close.svg)
}

.store-flyout .field-address {
    margin-top: 9px;
    line-height: 24px;
    font-size: 16px;
    margin-bottom: 9px
}

.store-flyout .details-body a,.store-flyout .hours {
    position: relative;
    display: block
}

.store-flyout .field-find-out-more-label,.store-flyout .field-opening-hours-label,.store-flyout .field-phones,.store-flyout .field-plan-trip-button-label,.store-flyout .field-write-message {
    color: #002d72;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    vertical-align: middle;
    line-height: 24px;
    margin-left: -12px;
    margin-right: -12px;
    width: calc(100% + 24px);
    padding-left: 44px;
    padding-top: 8px;
    padding-bottom: 8px
}

.store-flyout .field-find-out-more-label:hover,.store-flyout .field-opening-hours-label:hover,.store-flyout .field-phones:hover,.store-flyout .field-plan-trip-button-label:hover,.store-flyout .field-write-message:hover {
    background: #f2f7ff;
    color: #0059e4
}

.store-flyout .field-find-out-more-label::before,.store-flyout .field-opening-hours-label::before,.store-flyout .field-phones::before,.store-flyout .field-plan-trip-button-label::before,.store-flyout .field-write-message::before {
    z-index: 6;
    position: absolute;
    margin-left: -32px;
    content: "";
    background-size: 20px 20px;
    width: 20px;
    height: 20px;
    margin-top: 1px
}

.store-flyout .field-plan-trip-button-label::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/location.svg)
}

.store-flyout .field-plan-trip-button-label:hover::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/location_hover.svg)
}

.store-flyout .field-write-message::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/email.svg)
}

.store-flyout .field-write-message:hover::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/email_hover.svg)
}

.store-flyout .field-phones::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/phone.svg)
}

.store-flyout .field-phones:hover::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/phone_hover.svg)
}

.store-flyout .field-opening-hours-label::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/clock.svg)
}

.store-flyout .field-opening-hours-label:hover::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/clock_hover.svg)
}

.store-flyout .field-find-out-more-label::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/store.svg)
}

.store-flyout .field-find-out-more-label:hover::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/store_hover.svg)
}

.store-flyout .field-find-out-more-label {
    padding-bottom: 8px;
    margin-bottom: 5px
}

.store-flyout .details-area::after {
    content: url(https://cdn.metro-group.com/nextcms/svgs/back-blue_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/up_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/down_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/location_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/phone_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/email_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/clock_hover.svg) url(https://cdn.metro-group.com/nextcms/svgs/store_hover.svg);
    display: block;
    position: absolute;
    z-index: -100;
    width: 0;
    height: 0;
    overflow: hidden
}

.store-flyout .field-opening-hours-label::after {
    content: " ";
    background-size: 24px 24px;
    width: 24px;
    height: 24px;
    margin-left: auto;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/down.svg);
    position: absolute;
    z-index: 6;
    right: 0;
    margin-right: -2px
}

.store-flyout .field-opening-hours-label:hover::after {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/down_hover.svg)
}

.store-flyout .hours-details {
    display: none;
    flex-direction: column;
    padding-left: 33px;
    margin-bottom: 10px;
    height: auto
}

.store-flyout .hours-details>div {
    display: flex;
    flex-direction: column-reverse
}

.store-flyout .hours-details>div>div {
    padding-bottom: 8px
}

.store-flyout .details-body {
    width: 100%;
    height: calc(100% - 48px);
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 19px 12px 0
}

.store-flyout .hours-title {
    color: #99a1ad;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 21px;
    text-transform: uppercase;
    margin: 11px 0 13px;
    border-bottom: 1px solid #ccd5e2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.store-flyout .hours-title:first-child {
    margin-top: 0
}

.store-flyout .day {
    display: flex;
    flex-direction: row
}

.store-flyout .day-title {
    color: #33435b;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 20px;
    max-width: 50%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.store-flyout .day-hours {
    color: #33435b;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 20px;
    text-align: right;
    margin-left: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.store-flyout .field-select-another-store-label {
    color: #33435b;
    font-size: 11px;
    font-weight: 400;
    line-height: 16.5px;
    padding-top: 8px
}

.store-flyout .field-select-this-store-label {
    background-color: #0059e4;
    color: #fff;
    border-radius: 2px;
    height: 48px;
    min-height: 48px;
    margin-top: 8px;
    justify-content: center;
    font-size: 18px;
    font-weight: 900;
    width: 100%;
    margin-bottom: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    text-align: center
}

.store-flyout .field-select-this-store-label:hover {
    cursor: pointer
}

.store-flyout div.field-general-opening-hours-description {
    color: #33435b;
    font-size: 11px;
    font-weight: 400;
    line-height: 16.5px;
    display: block;
    width: 100%;
    height: 100%;
    padding-top: 11px;
    padding-bottom: 0
}

.store-flyout .field-general-opening-hours-description:empty {
    display: none
}

.store-flyout details[open] .arrow,.store-flyout details[open]>.flyout-details,.store-flyout details[open]>.hours-details {
    display: flex
}

.store-flyout details[open]>summary>.field-opening-hours-label::after {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/up.svg)
}

.store-flyout details[open]>summary>.field-opening-hours-label:hover::after {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/up_hover.svg)
}

.store-flyout details[open]>summary>.field-opening-hours-label {
    margin-bottom: 0;
    background: #e6f0ff;
    color: #002d72
}

.store-flyout details[open]>summary>.field-opening-hours-label:hover {
    background: #f2f7ff;
    color: #0059e4
}

.store-flyout details[open] .overlay-flyout {
    opacity: .4;
    visibility: visible;
    transition: opacity 320ms
}

.store-flyout .store-search {
    display: none;
    opacity: 0;
    top: 0;
    bottom: 0;
    position: relative;
    background-color: #fff;
    z-index: 6;
    width: 100%;
    max-height: 100%;
    height: 100%
}

.store-flyout .store-search.active {
    display: block;
    opacity: 1
}

.store-flyout .store-search .field-select-this-store-label {
    margin-bottom: 11px
}

.store-flyout .store-search .store-found-label {
    display: flex;
    border-radius: 0;
    padding: 8px 12px;
    margin-top: 0;
    cursor: pointer;
    background: #002d72;
    width: 100%
}

.store-flyout .store-search .field-back {
    color: #fff
}

.store-flyout .store-search .details-body {
    position: absolute;
    top: 48px;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    height: auto
}

.store-flyout .store-search .details-close::before {
    margin-right: -12px
}

.store-flyout .back {
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    width: 80%;
    padding-left: 32px;
    color: #33435b
}

.store-flyout .back::before {
    content: "";
    background-size: 20px 23px;
    width: 20px;
    height: 23px;
    margin-right: 12px;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/back.svg);
    position: absolute;
    margin-left: -32px;
    margin-top: -2px
}

.store-flyout .back:not(.field-store-found-label):hover::before {
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/back-blue_hover.svg)
}

.store-flyout .field-change-store-label {
    color: #33435b;
    font-size: 18px;
    font-weight: 900;
    line-height: 24px;
    margin-bottom: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.store-flyout .find-area {
    display: flex;
    position: relative;
    border-bottom: 1px solid #ccd0d6;
    left: -12px;
    width: calc(100% + 24px);
    padding: 2px 12px 12px
}

.store-flyout .find-area::after {
    content: " ";
    background-size: 22px 22px;
    width: 22px;
    height: 22px;
    margin-right: 12px;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/search.svg);
    position: absolute;
    right: 12px;
    top: 12px
}

.store-flyout .find-store {
    display: flex;
    font-size: 16px;
    line-height: 24px;
    width: 100%;
    height: 40px;
    color: #667284;
    padding: 9px 40px 9px 12px;
    box-shadow: none;
    border-radius: 2px;
    background-color: #fff;
    border: 1px solid #ccd5e2;
    margin-left: 0;
    margin-right: 0
}

.store-flyout .store-results {
    display: block;
    margin-left: -12px;
    width: calc(100% + 24px);
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 94px)
}

.store-flyout .store-results>div:not(:empty) {
    border-top: 1px solid #ccd0d6;
    padding: 18px 12px 0
}

.store-flyout .store-results>div:not(:empty):first-child {
    border-top-width: 0
}

.store-flyout .store-results:empty {
    height: calc(100% - 94px);
    display: flex;
    justify-content: center;
    align-items: center
}

.store-flyout .store-results:empty::before {
    background-image: url(//cdn.metro-group.com/nextcms/svgs/loader.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 100%;
    margin: 24px 0;
    border-top-width: 0;
    padding: 0;
    content: ""
}

.store-flyout .store-load-more {
    background-image: url(//cdn.metro-group.com/nextcms/svgs/loader.svg);
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 100%;
    margin: 24px 0;
    border-top-width: 0;
    padding: 0
}

.store-flyout .store-item details[open] .field-opening-hours-label {
    margin-bottom: 12px
}

.store-flyout .message {
    display: none
}

.store-flyout .overlay-flyout {
    height: 100%;
    width: 100%;
    content: " ";
    background: #002d72;
    right: 0;
    top: 0;
    opacity: 0;
    position: fixed;
    display: flex;
    visibility: hidden;
    transition: opacity 320ms,visibility 320ms
}

.store-flyout-notification {
    display: none;
    width: 100%;
    position: relative
}

.store-flyout-notification .row {
    width: 100%
}

.store-flyout-notification.active {
    display: flex
}

.store-flyout-notification .notification {
    box-sizing: content-box;
    display: flex;
    width: calc(100% - 24px);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    height: auto;
    margin-top: 12px
}

.store-flyout-notification .notification::before {
    content: "";
    border: 8px solid transparent;
    border-bottom-color: #24865b;
    color: transparent;
    top: -8px;
    margin-top: -10px;
    position: absolute;
    left: auto;
    right: calc(50% - 4px)
}

.store-flyout-notification .notification .icon {
    margin-top: -1px;
    margin-left: -1px;
    margin-bottom: -1px
}

.store-flyout-notification .notification .icon::before {
    content: "";
    background-size: 16px 16px;
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/check.svg);
    width: 16px;
    height: 16px
}

.ncms-webcomp .store-flyout {
    display: block!important;
    background-color: #cce0ff;
    position: relative
}

.ncms-webcomp .store-flyout-notification {
    position: absolute;
    top: 100%;
    right: 0;
    margin: 0
}

.ncms-webcomp .store-flyout .component-content {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    position: relative
}

.ncms-webcomp.p-theme-default .store-flyout .flyout-btn {
    top: 0;
    position: relative
}

.ncms-webcomp.p-theme-default .store-flyout .flyout-details {
    position: absolute;
    top: 62px;
    z-index: 50;
    height: 100vh;
    right: 0;
    max-height: calc(65vh + 60px)
}

.ncms-webcomp.p-theme-default .store-flyout .arrow {
    z-index: 50;
    left: 0;
    right: 0;
    position: absolute;
    top: 62px
}

.ncms-webcomp.p-metrox .store-flyout {
    display: block!important;
    margin-top: 9px;
    background-color: transparent
}

.ncms-webcomp.p-metrox .store-flyout .component-content {
    z-index: initial
}

.ncms-webcomp.p-metrox .store-flyout .flyout-btn {
    padding-top: 0;
    position: relative;
    top: 0;
    right: 0
}

.ncms-webcomp.p-metrox .store-flyout .arrow {
    left: 0;
    position: absolute;
    top: 70px;
    margin-top: 1px
}

.ncms-webcomp.p-metrox .store-flyout .arrow::after {
    bottom: 0
}

.ncms-webcomp.p-metrox .store-flyout .flyout-details {
    top: 0;
    margin-top: 7px;
    z-index: 1040
}

.ncms-webcomp.p-metrox .store-flyout .flyout-details.wide {
    height: auto
}

.ncms-webcomp.p-metrox .store-flyout .store-flyout-notification {
    margin-top: -25px
}

.fuel-prices {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit;
    margin-bottom: 12px;
    box-sizing: border-box
}

.fuel-prices .component-content {
    position: relative
}

.fuel-prices .prices.slides {
    display: flex;
    flex-wrap: nowrap;
    padding: 0;
    left: -12px;
    right: -12px;
    width: calc(100% + 24px)
}

.fuel-prices .prices.slides::after {
    content: "";
    padding-right: 12px
}

.fuel-prices .price {
    background: #002d72;
    border-radius: 2px;
    padding: 12px 24px;
    margin-left: 12px;
    display: flex;
    width: calc((100% - 156px)/4);
    align-items: center;
    flex: 1;
    min-width: 270px;
    align-content: space-between
}

.fuel-prices .price>div {
    max-width: 50%
}

.fuel-prices .price>.field-price {
    max-width: none;
    margin-left: auto;
    white-space: nowrap
}

.fuel-prices .field-name {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    text-transform: inherit
}

.fuel-prices .field-measure {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: inherit
}

.fuel-prices .field-measure,.fuel-prices .field-name {
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%
}

.fuel-prices .field-price {
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 2.5rem;
    line-height: 50px;
    color: #b3c0d5;
    text-transform: inherit;
    justify-content: center;
    text-align: right;
    margin-top: -5px
}

.fuel-prices .left,.fuel-prices .left-layer,.fuel-prices .right,.fuel-prices .right-layer {
    height: 72px
}

.tables .component-content .comp-box .img,.tables .component-content .comp-box .img picture {
    display: flex;
    justify-content: center;
    align-items: center
}

.tables {
    margin-bottom: 12px;
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #33435b;
    text-transform: inherit
}

.tables .component-content .comp-box .headline {
    font-weight: 700;
    color: #fff;
    background: #002d72;
    padding: 12px
}

.tables .component-content .comp-box .inside-container {
    padding: 12px 0;
    margin: auto 12px
}

.tables .component-content .comp-box .inside-container>.table-head-parent {
    max-height: 49px;
    overflow-y: hidden;
    border-bottom: 1px solid #e6e8eb
}

.tables .component-content .comp-box .table-head,.tables .component-content .comp-box .table-highlight {
    width: 100%
}

.tables .component-content .comp-box .table-head .category,.tables .component-content .comp-box .table-head .desc,.tables .component-content .comp-box .table-highlight .category,.tables .component-content .comp-box .table-highlight .desc {
    flex: 0 0 auto;
    overflow: hidden;
    max-width: fit-content
}

.tables .component-content .comp-box .table-head .desc,.tables .component-content .comp-box .table-highlight .desc {
    display: none
}

.tables .component-content .comp-box .table-head .category,.tables .component-content .comp-box .table-highlight .category {
    text-align: center
}

.tables .component-content .comp-box .table-head {
    display: flex;
    overflow-x: auto;
    scroll-behavior: auto;
    overflow-y: hidden;
    scroll-behavior: smooth
}

.tables .component-content .comp-box .table-head .category {
    display: inline-block;
    max-width: 75%;
    color: #0059e4;
    font-weight: 400;
    margin-bottom: 12px
}

.tables .component-content .comp-box .table-head .category>div {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%
}

.tables .component-content .comp-box .table-head .category.active {
    color: #002d72;
    font-weight: 700;
    position: relative
}

.tables .component-content .comp-box .table-head .category.active::after {
    content: "";
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    height: 4px;
    width: calc(100% - 24px);
    background: #002d72
}

.tables .component-content .comp-box .table-highlight {
    display: flex;
    flex-direction: column;
    align-items: center
}

.tables .component-content .comp-box .table-highlight .desc {
    display: flex;
    width: 100%;
    max-width: 100%
}

.tables .component-content .comp-box .table-highlight .category {
    display: none;
    width: 100%;
    max-width: 100%;
    padding-top: 0;
    font-size: 18px;
    line-height: 27px
}

.tables .component-content .comp-box .table-highlight .category.active {
    display: flex
}

.tables .component-content .comp-box .table-highlight .category,.tables .component-content .comp-box .table-highlight .desc {
    justify-content: center;
    align-items: center;
    background-color: #9bc2fd
}

.tables .component-content .comp-box .table-head-parent {
    white-space: nowrap
}

.tables .component-content .comp-box .table-rows .table-row {
    display: inline-block;
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #ccd0d6
}

.tables .component-content .comp-box .table-rows .table-row:last-of-type {
    border-bottom: none
}

.tables .component-content .comp-box .table-rows .table-row>:nth-child(odd) {
    background-color: #fff
}

.tables .component-content .comp-box .table-rows .table-row .column {
    display: none;
    flex-direction: column
}

.tables .component-content .comp-box .table-rows .table-row .column.active {
    display: flex
}

.tables .component-content .comp-box .table-rows .table-row .column,.tables .component-content .comp-box .table-rows .table-row .desc {
    overflow: hidden;
    max-width: 100%;
    word-break: break-word
}

.tables .component-content .comp-box .table-rows .table-row .column .text,.tables .component-content .comp-box .table-rows .table-row .desc .text {
    font-weight: 400;
    text-align: center;
    line-height: 19px;
    color: #33435b;
    width: 100%;
    padding: 0 12px 12px
}

.tables .component-content .comp-box .table-rows .table-row .column .text+a,.tables .component-content .comp-box .table-rows .table-row .desc .text+a {
    margin-top: 8px
}

.tables .component-content .comp-box .table-rows .table-row .column>img,.tables .component-content .comp-box .table-rows .table-row .desc>img {
    width: 16px;
    height: 16px
}

.tables .component-content .comp-box .table-rows .table-row .column .btn-primary,.tables .component-content .comp-box .table-rows .table-row .desc .btn-primary {
    margin: 4px 0 18px
}

.tables .component-content .comp-box .table-rows .table-row .column .btn-primary+.img,.tables .component-content .comp-box .table-rows .table-row .desc .btn-primary+.img {
    padding-top: 6px
}

.tables .component-content .comp-box .category,.tables .component-content .comp-box .desc {
    color: #002d72;
    font-weight: 700;
    padding: 12px
}

.tables .component-content .comp-box .category>*,.tables .component-content .comp-box .desc>* {
    line-height: 24px
}

.tables .component-content .comp-box .btn-primary {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    display: block
}

.tables .component-content .comp-box .img {
    padding: 4px 12px 16px
}

.tables .component-content .comp-box .img img,.tables .component-content .comp-box .img picture {
    height: 100%;
    width: 100%
}

.tabs {
    clear: both;
    width: calc(100% + 24px);
    display: inline-block;
    border-top: 0 solid #fff;
    background-color: #fff;
    margin: 0 -12px
}

.tabs .tabs-heading {
    background-color: #fff;
    position: relative;
    min-height: 64px;
    padding-left: 24px;
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.tabs .tabs-heading li {
    float: left;
    margin-bottom: -1px;
    position: relative;
    display: block;
    color: #0059e4;
    background-color: #fff;
    line-height: 3.4rem;
    font-size: 16px;
    font-weight: 900;
    padding: 0;
    margin-right: 24px;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
    height: 100%
}

.tabs .tabs-heading li>div {
    padding-left: 0;
    padding-right: 0
}

.tabs .tabs-heading li .field-heading {
    font-size: 16px
}

.tabs .tabs-heading li .field-heading p,.tabs .tabs-heading li .field-heading span {
    color: #0059e4;
    font-weight: 900;
    font-style: normal
}

.tabs .tabs-heading li .field-heading,.tabs .tabs-heading li .field-heading span {
    padding-top: 10px;
    color: #0059e4
}

.tabs .tabs-heading li:hover {
    color: #0047b6;
    border: 1px solid #fff;
    border-bottom: 4px solid #e6e8eb;
    background-color: #fff
}

.tabs .tabs-heading li.active {
    color: #002d72;
    border: 1px solid #fff;
    border-bottom: 4px solid #002d72;
    cursor: pointer
}

.tabs .tabs-heading li.active .field-heading,.tabs .tabs-heading li.active .field-heading p,.tabs .tabs-heading li.active .field-heading span {
    color: #002d72
}

.tabs .tabs-container {
    background-color: #f3f4f8;
    padding-bottom: 12px;
    border-top: 0 solid #fff;
    margin: 0
}

.tabs .tabs-container>.tab {
    padding: 12px;
    display: none
}

.tabs .tabs-container>.tab.active {
    display: block
}

.tabs .tabs-container .component.content {
    clear: both
}

.generic-category-tabs .nav-category {
    margin-left: 0;
    margin-right: 0
}

.generic-category-tabs .nav-category .sel-category {
    display: none
}

.generic-category-tabs .nav-category .nav-tabs {
    display: flex
}

.generic-category-tabs .nav-category .nav-link {
    white-space: nowrap;
    color: #002d72;
    line-height: normal;
    margin: 0;
    padding: 18px 0
}

.generic-category-tabs .nav-item {
    margin-right: 20px
}

.generic-category-tabs .tab-content {
    margin: 0
}

.teasers-list {
    margin-bottom: 12px
}

.teasers-list .teasers {
    gap: 12px;
    margin: 0
}

.teasers-list .teasers>div {
    width: 100%;
    max-width: 100%;
    font-size: 13px;
    padding: 0
}

.teasers-list .teasers .badge {
    position: absolute;
    top: 24px;
    left: 24px;
    opacity: .8
}

.teasers-list .teasers .badge:empty {
    display: none
}

.teasers-list .teasers picture {
    margin-bottom: 24px;
    display: block;
    line-height: 0
}

.teasers-list .teasers .date,.teasers-list .teasers h5 {
    margin-bottom: 24px
}

.teasers-list .teasers .field-dash {
    padding-left: 5px;
    padding-right: 5px
}

.teasers-list .teasers .field-comma {
    padding-right: 5px
}

.teasers-list .teasers .btn-link,.teasers-list .teasers .btn-outline {
    display: block;
    margin-bottom: 24px
}

.teasers-list .teasers .btn-link:after,.teasers-list .teasers .btn-outline:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.teasers-list .teasers .btn-link:focus-visible:after,.teasers-list .teasers .btn-outline:focus-visible:after {
    outline: #000 auto 1px;
    outline-offset: 1px
}

.teasers-list .teasers .btn-outline:hover {
    color: #fff
}

.teasers-list .teasers .category-teaser-tile {
    text-align: left;
    margin: 0;
    height: 100%;
    padding: 12px
}

.content-teaser.teasers-list .teasers {
    gap: 12px;
    margin: 0
}

.content-teaser.teasers-list .teasers>.category-teaser-tile {
    padding: 12px
}

.tile-image-teaser-row-container {
    text-align: center;
    background-color: #fff;
    display: inline-block;
    width: 100%;
    margin-bottom: 12px;
    padding-left: 6px;
    padding-right: 6px
}

.tile-image-teaser-row-container .main-title {
    object-fit: contain;
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-size: 26px;
    font-weight: 800;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.29;
    letter-spacing: normal;
    text-align: center;
    color: #002d72;
    text-transform: uppercase;
    padding-top: 29px
}

.tile-image-teaser-row-container .main-description {
    padding-top: 15px;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 13px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.54;
    letter-spacing: normal;
    text-align: center;
    color: #34435a
}

.tile-image-teaser-row-container .main-link {
    padding-top: 12px;
    font-size: 13px;
    line-height: 1.54;
    color: #0059e4
}

.tile-image-teaser-row-container .image-section {
    padding-top: 29px;
    padding-bottom: 0;
    box-sizing: border-box
}

.tile-image-teaser-row-container .image-section .image-box {
    padding-left: 6px;
    padding-right: 6px;
    padding-bottom: 12px;
    overflow: hidden;
    position: relative
}

.tile-image-teaser-row-container .image-section .image-box img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.tile-image-teaser-row-container .image-section .image-box .image-link-container {
    position: absolute;
    width: 98%;
    display: table;
    top: 50%;
    height: auto;
    transform: translate(0,-50%)
}

.tile-image-teaser-row-container .image-section .image-box .image-link-container .image-link-label {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    text-transform: uppercase;
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 800;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.29;
    letter-spacing: normal;
    background-repeat: no-repeat;
    color: #fff;
    text-shadow: 0 0 46px rgba(0,0,0,.5);
    font-size: 26px
}

.component.container .component-content .component .tile-image-teaser,.tile-image-teaser {
    padding: 0 0 12px;
    height: 100%
}

.component.container .component-content .component .tile-image-teaser .component-content,.tile-image-teaser .component-content {
    overflow: hidden;
    position: relative
}

.component.container .component-content .component .tile-image-teaser .component-content img,.tile-image-teaser .component-content img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.component.container .component-content .component .tile-image-teaser .tile-content,.tile-image-teaser .tile-content {
    text-transform: uppercase;
    font-family: CAMetro,Impact,Charcoal,sans-serif;
    font-weight: 800;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: normal;
    background-repeat: no-repeat;
    color: #fff;
    text-shadow: 0 0 46px rgba(0,0,0,.5);
    line-height: 1.29;
    font-size: 26px;
    position: absolute;
    display: table;
    height: 100%;
    width: 100%;
    top: 0;
    text-align: center
}

.component.container .component-content .component .tile-image-teaser .tile-content .span-content,.tile-image-teaser .tile-content .span-content {
    display: table-cell;
    vertical-align: middle
}

.component.container .component-content .component .tile-image-teaser .tile-content .span-content span,.tile-image-teaser .tile-content .span-content span {
    color: #fff;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    line-height: inherit;
    font-weight: inherit
}

.unified-search {
    display: flex;
    flex-direction: column
}

.unified-search>.section-header {
    padding: 12px
}

.unified-search .section-count {
    font-weight: initial;
    padding-left: 5px
}

.unified-results {
    background: linear-gradient(-180deg,#fff 0,#f2f5f8 100%);
    display: flex;
    gap: 12px
}

.unified-results a {
    background-color: #fff;
    display: flex;
    flex-shrink: 0;
    flex-direction: column;
    padding: 12px 12px 24px;
    gap: 8px;
    text-decoration: none
}

.unified-results a.last-item {
    background-color: #b3d1ff;
    justify-content: center;
    align-items: center;
    gap: 0
}

.unified-results a.last-item .more-plus {
    background-image: url(//cdn.metro-online.com/nextcms/svgs/more_plus.svg);
    background-repeat: no-repeat;
    width: 50px;
    height: 50px
}

.unified-results a>picture {
    display: flex;
    width: 100%;
    justify-content: center;
    line-height: 0
}

.unified-results a>strong {
    overflow: hidden;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    color: #002d72
}

.unified-results.search-catalog a {
    width: 40%
}

.unified-results.search-catalog a>picture,.unified-results.search-catalog img {
    height: 210px
}

.unified-results.search-metromarket a,.unified-results.search-mshop a {
    justify-content: flex-end;
    width: 25%
}

.unified-results.search-infoservices a {
    width: 40%
}

.unified-search-header {
    padding: 12px
}

.unified-search-header .headline {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: capitalize
}

.unified-search-header .copy {
    color: #002d72
}

body.noscroll {
    overflow-y: hidden
}

.account-user {
    display: block!important;
    font-size: 1rem
}

.account-user * {
    box-sizing: border-box;
    border: 0;
    padding: 0;
    margin: 0
}

.account-user a {
    text-decoration: none;
    font-size: 1rem
}

.account-user a strong {
    color: #002d72;
    font-weight: 400;
    font-size: 1rem
}

.account-user .account-profile {
    position: relative;
    display: flex;
    cursor: pointer;
    background: #0059e4;
    min-height: 48px;
    padding: 0 12px;
    text-align: left;
    align-items: center;
    min-width: 170px;
    max-width: 247px;
    white-space: inherit;
    line-height: 1.5;
    border: none
}

.account-user .account-profile.multiline .user-business {
    display: none
}

.account-user .user-icon {
    line-height: 0;
    margin-right: 8px
}

.account-user .user-icon svg {
    width: 24px;
    height: auto;
    fill: #fff
}

.account-user .user-details {
    flex-direction: column;
    color: #fff;
    font-size: .8125rem;
    display: flex
}

.account-user .username {
    overflow: hidden;
    display: none
}

.account-user .username .email {
    word-break: break-all
}

.account-user .user-business {
    overflow: hidden
}

.account-user .account-flyout {
    width: 320px;
    max-width: calc(100% - 24px);
    position: fixed;
    top: 0;
    bottom: 0;
    right: -320px;
    display: flex;
    height: 100%;
    transition: right 320ms;
    flex-direction: column;
    background: #fff;
    overflow-y: auto;
    z-index: 1
}

.account-user .account-flyout.open {
    right: 0
}

.account-user .account-flyout.open .overlay-flyout {
    opacity: .4;
    visibility: visible;
    transition: opacity 320ms
}

.account-user .account-flyout.open .unavailableUserContainer {
    opacity: 1;
    transition: opacity 640ms
}

.account-user .account-flyout.not-available {
    top: 100%
}

.account-user .account-flyout .account-label {
    color: #002d72;
    min-height: 40px;
    display: flex;
    align-items: center;
    padding: 6px 12px;
    font-size: 1rem;
    align-content: center
}

.account-user .account-flyout .account-label-icon {
    padding-left: 44px;
    position: relative
}

.account-user .account-flyout .account-label svg {
    transform: scale(.7);
    position: absolute;
    left: 7px;
    top: 3px;
    fill: #002d72
}

.account-user .account-flyout .account-label:focus,.account-user .account-flyout .account-label:hover {
    color: #0059e4
}

.account-user .account-flyout .account-label:focus svg,.account-user .account-flyout .account-label:hover svg {
    fill: #0059e4
}

.account-user .account-flyout .idam-logout.emp {
    border-bottom: 1px solid #e6e8eb
}

.account-user .account-flyout .overlay-flyout {
    height: 100%;
    width: 100%;
    visibility: hidden;
    content: "";
    background: #002d72;
    right: 0;
    opacity: 0;
    transition: opacity 320ms,visibility 320ms;
    position: fixed
}

.account-user .unavailableUserContainer {
    text-align: center;
    opacity: 0;
    transition: opacity 320ms;
    width: 320px;
    margin-top: 48px
}

.account-user .unavailableUserContainer .editor-notice {
    padding: 12px;
    margin: 12px 0;
    color: #f00;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000
}

.account-user .unavailableUserContainer .alexUnavailableTitle {
    font-family: Lato,sans-serif;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1.125rem;
    line-height: 1.5;
    color: #002d72
}

.account-user .unavailableUserContainer .alexUnavailableSvg {
    margin: 24px auto 8px
}

.account-user .unavailableUserContainer .alexUnavailableDescription {
    margin: 24px 41px;
    font-weight: 400
}

.account-user .white-section {
    background: #fff;
    bottom: 0;
    top: 0;
    position: absolute;
    width: 100%;
    max-width: 320px;
    overflow-y: auto
}

.account-user .white-section.dont-overflow {
    overflow-y: hidden
}

.account-user .profile-notification-section {
    display: flex;
    min-height: 64px;
    margin: 15px 15px 12px 12px
}

.account-user .profile-notification-section.warning {
    border: 2px solid #ffed00
}

.account-user .profile-notification-section.warning .icon {
    background-color: #ffed00;
    background-image: url(//cdn.metro-online.com/nextcms/svgs/notification-alert-blue.svg)
}

.account-user .profile-notification-section.warning .fields-container {
    font-weight: 700
}

.account-user .profile-notification-section.info {
    border: 2px solid #0059e4
}

.account-user .profile-notification-section.info .icon {
    background-color: #0059e4;
    background-image: url(//cdn.metro-online.com/nextcms/svgs/notification-info.svg)
}

.account-user .profile-notification-section .notification-section {
    display: inline-flex
}

.account-user .profile-notification-section .notification-section .icon {
    width: 48px;
    background-repeat: no-repeat;
    background-size: 26px;
    background-position-x: center;
    background-position-y: 8px
}

.account-user .profile-notification-section .notification-section .icon svg {
    vertical-align: middle;
    height: 24px;
    width: 24px
}

.account-user .profile-notification-section .notification-section .fields-container {
    flex: 1;
    text-align: left;
    padding: 6px 10px 6px 8px
}

.account-user .profile-notification-section .notification-section .fields-container a {
    color: #001432;
    text-decoration: underline
}

.account-user .greet-section {
    position: sticky;
    top: 0;
    background: #002d72;
    color: #fff;
    border-bottom: none;
    left: 0;
    right: 0;
    height: 48px;
    align-items: center;
    padding-left: 12px;
    display: flex;
    flex-direction: row;
    white-space: nowrap;
    font-weight: 700
}

.account-user .greet-section-text {
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 280px
}

.account-user .greet-section.hide-on-desktop {
    display: flex
}

.account-user .greet-section .close-button {
    position: absolute;
    width: 48px;
    height: 48px;
    margin-left: auto;
    background: 0 0;
    top: 0;
    right: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center
}

.account-user .greet-section .close-button svg {
    width: 16px;
    height: auto;
    margin-right: 12px
}

.account-user .switch-section {
    background: #cce0ff;
    display: flex;
    margin-bottom: 12px
}

.account-user .switch-section svg {
    fill: #002d72
}

.account-user .switch-section.business-and-personal {
    background: 0 0;
    align-items: center;
    min-height: 68px;
    margin-bottom: 0
}

.account-user .switch-section.business-and-personal svg {
    width: 32px;
    height: auto
}

.account-user .switch-section .account-details {
    display: flex;
    flex-direction: column;
    text-align: left
}

.account-user .switch-account {
    background: #0059e4;
    padding: 12px 18px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1 0 30%
}

.account-user .switch-account-svg {
    height: 32px;
    width: 32px;
    display: block
}

.account-user .switch-account-label {
    color: #fff;
    font-size: .8125rem;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    margin-top: 12px;
    max-width: 93px
}

.account-user .switch-account-details {
    padding: 16px 12px;
    line-height: 24px;
    display: flex;
    align-items: center
}

.account-user .switch-account-details svg {
    margin-right: 12px;
    overflow: visible
}

.account-user .personal-info {
    color: #33435b;
    line-height: 24px;
    text-align: left
}

.account-user .personal-info .personal-info-name {
    font-weight: 700;
    word-break: break-all;
    word-wrap: break-word;
    color: #002d72
}

.account-user .business-name {
    font-weight: 700;
    font-style: normal;
    color: #002d72;
    word-break: break-word
}

.account-user .online-only,.account-user .pending-store-access,.account-user .personal-info-label {
    color: #33435b;
    font-weight: 400
}

.account-user .request-store-access-link a {
    color: #002d72;
    text-decoration: underline
}

.account-user .blue-section {
    background: #f2f3f5;
    margin-bottom: 12px
}

.account-user .blue-section a {
    color: #002d72;
    font-weight: 700;
    white-space: nowrap
}

.account-user .blue-section a:focus,.account-user .blue-section a:hover {
    color: #0059e4
}

.account-user .blue-section .register-business-link {
    border-bottom: 1px solid #e6e8eb
}

.account-user .arrow-right {
    padding: 6px 12px 6px 0;
    line-height: 0
}

.account-user .menusection .menuentry-label {
    width: 100%;
    background: #fff;
    display: flex;
    cursor: pointer;
    margin-bottom: 12px
}

.account-user .menusection .menuentry-label svg {
    fill: #002d72
}

.account-user .menusection .menuentry-label:focus,.account-user .menusection .menuentry-label:focus-within,.account-user .menusection .menuentry-label:hover {
    color: #0059e4
}

.account-user .menusection .menuentry-label:focus svg,.account-user .menusection .menuentry-label:focus-within svg,.account-user .menusection .menuentry-label:hover svg {
    fill: #0059e4
}

.account-user .menusection .menuentry {
    width: 100%
}

.account-user .menusection .menuentry-link:focus,.account-user .menusection .menuentry-link:focus-within,.account-user .menusection .menuentry-link:hover {
    background: #f2f7ff;
    color: #0059e4
}

.account-user .menusection .menuentry-link:focus svg,.account-user .menusection .menuentry-link:focus-within svg,.account-user .menusection .menuentry-link:hover svg {
    fill: #0059e4
}

.account-user .idam-logout {
    border-top: 1px solid #e6e8eb
}

.account-user .idam-logout svg {
    transform: scale(.7);
    margin-right: 6px;
    object-fit: contain;
    fill: #002d72
}

.account-user .bottom-link {
    margin-top: 24px
}

.account-user .bottom-link~.bottom-link {
    margin-top: 0
}

.account-user .secondary-flyout,.account-user .submenu {
    top: 48px;
    position: fixed;
    height: calc(100% - 48px);
    display: none;
    background: #fff;
    transition: 320ms;
    text-align: left
}

.account-user .secondary-flyout.open,.account-user .submenu.open {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 320px;
    overflow-y: auto;
    right: 0
}

.account-user .secondary-flyout.sec-top,.account-user .submenu.sec-top {
    top: 48px
}

.account-user .back-svg {
    display: flex;
    fill: #002d72
}

.account-user .back-section {
    font-size: 1rem;
    position: sticky;
    background: #fff;
    top: 0;
    display: flex;
    height: 48px;
    border-bottom: 1px solid #e6e8eb;
    border-radius: 0;
    width: 100%;
    padding: 12px;
    cursor: pointer;
    align-items: center;
    color: #002d72
}

.account-user .back-section svg {
    color: #002d72
}

.account-user .back-section:focus,.account-user .back-section:hover {
    background: #f2f7ff;
    color: #0059e4
}

.account-user .back-section:focus svg,.account-user .back-section:hover svg {
    fill: #0059e4
}

.account-user .back-section .back-label {
    height: 24px;
    line-height: 24px;
    margin-left: 6px;
    white-space: nowrap
}

.account-user .secondary-account-info {
    background: #fff;
    border-radius: 0;
    height: auto;
    width: 100%;
    border-bottom: 1px solid #e6e8eb;
    display: block
}

.account-user .secondary-account-info strong {
    color: #002d72;
    font-weight: 900;
    height: 24px;
    width: 162px
}

.account-user .secondary-account-info span {
    color: #002d72;
    font-style: normal;
    font-weight: 400;
    height: 24px;
    width: 261px
}

.account-user .personal-section {
    border-bottom: 1px solid #e6e8eb;
    border-radius: 0;
    height: 84px;
    width: 100%;
    display: flex;
    align-items: center
}

.account-user .personal-section .personal-info {
    margin-left: 12px
}

.account-user .personal-section .personal-info strong {
    font-weight: 700
}

.account-user .personal-section .personal-info span {
    color: #667284
}

.account-user .submenu-info {
    min-height: 48px;
    display: flex;
    align-items: center
}

.account-user .submenu-info .menu-entry {
    display: block;
    padding: 12px;
    width: 100%
}

.account-user .submenu-info .menu-entry:hover {
    background: #f2f7ff
}

.account-user .activeUser {
    background: #e6f0ff
}

.account-user .activeUser .switchflyoutaccount {
    cursor: unset
}

.account-user .activeUser .switchflyoutaccount:hover {
    background: #e6f0ff
}

.account-user .switchflyoutaccount {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    width: 100%;
    padding: 18px 26px 18px 12px
}

.account-user .switchflyoutaccount:hover {
    background: #f2f7ff
}

.account-user .switchflyoutaccount .account-info {
    height: auto;
    width: 265px;
    line-height: 24px;
    word-wrap: break-word
}

.account-user .switchflyoutaccount .account-info * {
    font-size: 1rem
}

.account-user .switchflyoutaccount .account-info span {
    color: #33435b
}

.account-user .switchflyoutaccount .selectedCheckbox {
    margin-left: 8px
}

.ncms-webcomp ::slotted(a) {
    color: #002d72;
    text-decoration: none
}

:not(:defined) {
    display: none
}

.nav-ncms {
    margin-top: 0
}

.nav-ncms .m-main-navigation {
    display: none
}

.nav-ncms.isUnsticky .m-main-navigation {
    position: relative;
    top: 0
}

.nav-ncms.isExplorerMode .m-main-navigation {
    position: relative;
    top: 0;
    z-index: 9
}

.nav-ncms.isExperienceEditor ul li {
    border: 1px dotted #f00
}

.nav-ncms.isExperienceEditor ul .scEmptyPlaceholder {
    height: auto;
    min-height: 78px
}

.nav-ncms.isExperienceEditor ul .scEmptyPlaceholder:empty {
    width: 100px;
    max-width: 100px;
    min-width: 100px;
    border: 1px dotted #f00
}

.nav-ncms.isExperienceEditor ul .scEmptyPlaceholder.sxa-toolbox-droppable {
    width: 100px!important;
    max-width: 100px!important;
    min-width: 100px!important;
    border: 1px dotted #f00
}

.nav-ncms.isExperienceEditor ul .sxa-toolbox-div {
    display: none
}

.nav-ncms.isExperienceEditor .m-main-navigation::after {
    border-bottom: none
}

.nav-ncms.isExperienceEditor .m-compositeDropdown-container {
    border: 1px dotted #008000;
    top: 85px
}

.nav-ncms.isExperienceEditor .m-compositeDropdown-container .col-md-2,.nav-ncms.isExperienceEditor .m-compositeDropdown-container .col-md-3 {
    border: 1px dotted #f00
}

.nav-ncms.isExperienceEditor .hidden-section {
    font-size: 15px;
    color: #f00;
    font-weight: bolder;
    width: 150px;
    line-height: normal
}

.nav-ncms.isExperienceEditor .hidden-section div {
    font-size: 10px
}

.nav-ncms.isExperienceEditor .selected-section {
    background-color: #f5f5f5
}

.nav-ncms.isExperienceEditor .navigation-section>a {
    line-height: 16px
}

.nav-ncms.isExperienceEditor .m-mainNavigation {
    height: 100%
}

.frmLftNav {
    left: 0!important
}

.frmRgtNav {
    transition: transform .5s ease-in;
    transform: translateX(-200%)!important
}

.toLftNav {
    left: 100%!important
}

.toRgtNav {
    transition: transform .5s ease-in;
    transform: translateX(100%)!important
}

.nav-ncms-mob {
    left: -100%;
    display: block!important;
    position: fixed;
    width: 100%;
    height: calc(100% - 160px);
    background: #fff;
    z-index: 2;
    overflow-y: auto;
    overflow-x: hidden
}

.nav-ncms-mob.with-store {
    margin-top: -40px
}

.nav-ncms-mob.disableScroll {
    overflow: hidden
}

.nav-ncms-mob.offsetOldNav {
    height: calc(100% - 64px)
}

.nav-ncms-mob.offsetOldNav .lvl0lbl~.colddCnt.lvl1Cnt,.nav-ncms-mob.offsetOldNav .lvl0lbl~.colddCnt.lvl2Cnt,.nav-ncms-mob.offsetOldNav .lvl0lbl~.colddCnt.lvl3Cnt,.nav-ncms-mob.offsetOldNav .lvl0lbl~.ddCnt .lvl1Cnt,.nav-ncms-mob.offsetOldNav .lvl0lbl~.ddCnt .lvl2Cnt,.nav-ncms-mob.offsetOldNav .lvl0lbl~.ddCnt .lvl3Cnt {
    top: 64px;
    height: calc(100% - 64px)
}

.nav-ncms-mob .store-selector-nav {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: .8125rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit;
    position: relative;
    padding: 23px 36px 0 47px;
    display: block
}

.nav-ncms-mob .store-selector-nav span {
    font-style: normal
}

.nav-ncms-mob .store-selector-nav .m-store-open {
    width: 26px;
    height: 26px;
    position: absolute;
    top: 27px;
    left: 12px;
    bottom: 0
}

.nav-ncms-mob .store-selector-nav .navigation-store-name {
    font-size: 16px;
    font-weight: 900;
    display: block
}

.nav-ncms-mob .store-selector-nav .blue-tint-50 {
    display: none
}

.nav-ncms-mob .slides {
    list-style: none;
    margin: 0;
    padding: 0
}

.nav-ncms-mob .row-nav .submenu.m-row {
    height: 48px
}

.nav-ncms-mob .row-nav .submenu.m-row a {
    line-height: 48px
}

.col-nav,.mega-nav {
    font-family: Lato,sans-serif;
    font-weight: 400;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-size: 1rem;
    line-height: 1.5;
    color: #002d72;
    text-transform: inherit
}

.col-nav>div,.mega-nav>div {
    height: 48px
}

.col-nav .bckBtn,.mega-nav .bckBtn {
    display: block;
    margin-top: 15px
}

.col-nav .bckBtn:hover,.mega-nav .bckBtn:hover {
    color: #002d72;
    background: #e6f0ff
}

.col-nav .navLnk,.mega-nav .navLnk {
    font-size: 16px
}

.col-nav .bckBtnChld,.mega-nav .bckBtnChld {
    line-height: 48px;
    font-size: 16px;
    font-style: normal;
    display: flex;
    align-items: center;
    height: 48px;
    padding-left: 12px
}

.col-nav .bckBtnChld::before,.mega-nav .bckBtnChld::before {
    content: "";
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/nav-back.svg);
    background-size: 24px 24px;
    width: 24px;
    height: 24px;
    margin-right: 12px
}

.col-nav input[type=radio],.mega-nav input[type=radio] {
    display: none
}

.col-nav input[type=radio]:checked+.lvl2Cnt,.col-nav input[type=radio]:checked+.lvl3Cnt,.col-nav input[type=radio]:checked~.ddCnt,.col-nav input[type=radio]:checked~.ddCnt .lvl1Cnt,.mega-nav input[type=radio]:checked+.lvl2Cnt,.mega-nav input[type=radio]:checked+.lvl3Cnt,.mega-nav input[type=radio]:checked~.ddCnt,.mega-nav input[type=radio]:checked~.ddCnt .lvl1Cnt {
    display: flex
}

.col-nav input[type=radio]:checked~.colddCnt.lvl1Cnt,.mega-nav input[type=radio]:checked~.colddCnt.lvl1Cnt {
    display: block
}

.col-nav input[type=radio]:checked+.lvl0lbl::before,.mega-nav input[type=radio]:checked+.lvl0lbl::before {
    border-bottom: none
}

.col-nav .ddCnt,.mega-nav .ddCnt {
    display: block;
    position: fixed;
    z-index: 2;
    right: 0;
    left: 0;
    bottom: auto;
    width: 100%;
    margin-bottom: 65vh;
    background-color: transparent;
    height: 0;
    padding: 0
}

.col-nav .colddCnt.lvl1Cnt,.mega-nav .colddCnt.lvl1Cnt {
    position: absolute;
    margin-left: -24px;
    z-index: 3
}

.col-nav .colddCnt.lvl1Cnt .lvl0Nav,.mega-nav .colddCnt.lvl1Cnt .lvl0Nav {
    width: 100%
}

.col-nav .colddCnt.lvl1Cnt>.lvl1LnCnt,.mega-nav .colddCnt.lvl1Cnt>.lvl1LnCnt {
    display: block;
    height: 48px
}

.col-nav .colddCnt.lvl1Cnt>.lvl1LnCnt .lvl1Lbl,.mega-nav .colddCnt.lvl1Cnt>.lvl1LnCnt .lvl1Lbl {
    width: 100%
}

.col-nav .lvl1Cnt,.col-nav .lvl2Cnt,.col-nav .lvl3Cnt,.mega-nav .lvl1Cnt,.mega-nav .lvl2Cnt,.mega-nav .lvl3Cnt {
    display: block;
    left: 200%
}

.col-nav .lvl0lbl,.col-nav .lvl1Lbl,.col-nav .lvl2Lbl,.col-nav .lvl3lbl,.mega-nav .lvl0lbl,.mega-nav .lvl1Lbl,.mega-nav .lvl2Lbl,.mega-nav .lvl3lbl {
    color: #002d72;
    cursor: pointer;
    margin: 0;
    padding: 12px 24px 12px 12px;
    position: relative;
    width: 100%;
    text-decoration: none;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.col-nav .lvl0lbl,.mega-nav .lvl0lbl {
    height: 48px;
    line-height: 48px;
    font-weight: 900;
    padding: 0 24px 0 12px;
    margin: 0 24px 0 0;
    position: relative
}

.col-nav .lvl0lbl:hover,.mega-nav .lvl0lbl:hover {
    color: #002d72;
    background: #e6f0ff
}

.col-nav .lvl0lbl~.colddCnt.lvl1Cnt,.col-nav .lvl0lbl~.colddCnt.lvl2Cnt,.col-nav .lvl0lbl~.colddCnt.lvl3Cnt,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt,.mega-nav .lvl0lbl~.colddCnt.lvl1Cnt,.mega-nav .lvl0lbl~.colddCnt.lvl2Cnt,.mega-nav .lvl0lbl~.colddCnt.lvl3Cnt,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt {
    height: calc(100% - 160px);
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    position: fixed;
    top: 160px;
    z-index: 2;
    width: 100%!important;
    margin: 0;
    border: 0;
    background: #fff
}

.col-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar,.col-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar,.col-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar,.mega-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar,.mega-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar,.mega-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar {
    background: #fff;
    width: 16px
}

.col-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar-track,.col-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar-track,.col-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar-track,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar-track,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar-track,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar-track,.mega-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar-track,.mega-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar-track,.mega-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar-track,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar-track,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar-track,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar-track {
    background: #fff
}

.col-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar-thumb {
    background: 0 0;
    border-radius: 16px;
    border: 4px solid #fff
}

.col-nav .lvl0lbl~.colddCnt.lvl1Cnt:hover::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.colddCnt.lvl2Cnt:hover::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.colddCnt.lvl3Cnt:hover::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt:hover::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt:hover::-webkit-scrollbar-thumb,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt:hover::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.colddCnt.lvl1Cnt:hover::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.colddCnt.lvl2Cnt:hover::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.colddCnt.lvl3Cnt:hover::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt:hover::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt:hover::-webkit-scrollbar-thumb,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt:hover::-webkit-scrollbar-thumb {
    background: #babac0
}

.col-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar-button,.col-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar-button,.col-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar-button,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar-button,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar-button,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar-button,.mega-nav .lvl0lbl~.colddCnt.lvl1Cnt::-webkit-scrollbar-button,.mega-nav .lvl0lbl~.colddCnt.lvl2Cnt::-webkit-scrollbar-button,.mega-nav .lvl0lbl~.colddCnt.lvl3Cnt::-webkit-scrollbar-button,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt::-webkit-scrollbar-button,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt::-webkit-scrollbar-button,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt::-webkit-scrollbar-button {
    display: none
}

.col-nav .lvl0lbl~.ddCnt .lvl1Cnt,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt {
    flex-direction: column
}

.col-nav .lvl0lbl~.ddCnt .lvl1Cnt>.lvl1Ele,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt>.lvl1Ele {
    display: block
}

.col-nav .lvl0lbl~.ddCnt .lvl1Cnt>.lvl1Ele .lvl1Lbl:hover,.col-nav .lvl0lbl~.ddCnt .lvl1Cnt>.lvl1Ele .navLnk:hover,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt>.lvl1Ele .lvl1Lbl:hover,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt>.lvl1Ele .navLnk:hover {
    color: #002d72;
    background: #f2f7ff
}

.col-nav .lvl0lbl~.ddCnt .lvl1Cnt .lvl0Nav,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt .lvl0Nav {
    display: block
}

.col-nav .lvl0lbl~.ddCnt .lvl1Cnt .lvl1LnCnt,.mega-nav .lvl0lbl~.ddCnt .lvl1Cnt .lvl1LnCnt {
    display: flex;
    width: 100%
}

.col-nav .lvl0lbl~.ddCnt .lvl2Cnt,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt {
    flex-direction: column
}

.col-nav .lvl0lbl~.ddCnt .lvl2Cnt>.lvl2Ele,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt>.lvl2Ele {
    display: block
}

.col-nav .lvl0lbl~.ddCnt .lvl2Cnt>.lvl2Ele .lvl2Lbl:hover,.col-nav .lvl0lbl~.ddCnt .lvl2Cnt>.lvl2Ele .navLnk:hover,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt>.lvl2Ele .lvl2Lbl:hover,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt>.lvl2Ele .navLnk:hover {
    color: #002d72;
    background: #f2f7ff
}

.col-nav .lvl0lbl~.ddCnt .lvl2Cnt .lvl1Nav,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt .lvl1Nav {
    display: block
}

.col-nav .lvl0lbl~.ddCnt .lvl2Cnt .lvl2LnCnt,.mega-nav .lvl0lbl~.ddCnt .lvl2Cnt .lvl2LnCnt {
    display: flex;
    width: 100%
}

.col-nav .lvl0lbl~.ddCnt .lvl3Cnt,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt {
    flex-direction: column
}

.col-nav .lvl0lbl~.ddCnt .lvl3Cnt .lvl2Nav,.col-nav .lvl0lbl~.ddCnt .lvl3Cnt>.lvl3Ele,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt .lvl2Nav,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt>.lvl3Ele {
    display: block
}

.col-nav .lvl0lbl~.ddCnt .lvl3Cnt .lvl3LnCnt,.mega-nav .lvl0lbl~.ddCnt .lvl3Cnt .lvl3LnCnt {
    display: flex;
    width: 100%
}

.col-nav .lvl0lbl .lvl0EdtMd,.mega-nav .lvl0lbl .lvl0EdtMd {
    font-size: 10px;
    color: #f00
}

.col-nav .lvl0lbl>a,.mega-nav .lvl0lbl>a {
    color: #002d72;
    display: block;
    font-size: 16px;
    line-height: 48px;
    background: #fff;
    position: absolute;
    width: 100%;
    z-index: 1;
    left: 0;
    padding-left: 12px;
    font-weight: 900;
    text-decoration: none
}

.col-nav .lvl0lbl::after,.col-nav .lvl1Lbl.chld::after,.col-nav .lvl2Lbl.chld::after,.mega-nav .lvl0lbl::after,.mega-nav .lvl1Lbl.chld::after,.mega-nav .lvl2Lbl.chld::after {
    content: "";
    background-image: url(https://cdn.metro-group.com/nextcms/svgs/nav-arrow.svg);
    background-size: 7px 13px;
    width: 7px;
    height: 13px;
    margin: auto 0;
    flex: 0 0 20px;
    position: absolute;
    right: 12px;
    top: 17px
}

.col-nav .lvl0Nav,.col-nav .lvl1Nav,.col-nav .lvl2Nav,.col-nav .lvl3Nav,.mega-nav .lvl0Nav,.mega-nav .lvl1Nav,.mega-nav .lvl2Nav,.mega-nav .lvl3Nav {
    font-weight: 900;
    color: #0059e4;
    padding: 12px 24px 12px 12px;
    margin: 0;
    text-decoration: none;
    line-height: 24px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.col-nav .lvl2Cnt,.col-nav .lvl3Cnt,.mega-nav .lvl2Cnt,.mega-nav .lvl3Cnt {
    height: 100%;
    position: fixed;
    width: 100%;
    margin: 0;
    border: 0;
    overflow-y: auto
}

.col-nav .lvl2Cnt,.mega-nav .lvl2Cnt {
    z-index: 3
}

.col-nav .lvl2Cnt .lvl2Ele,.col-nav .lvl2Cnt>.lvl1Nav,.mega-nav .lvl2Cnt .lvl2Ele,.mega-nav .lvl2Cnt>.lvl1Nav {
    display: block
}

.col-nav .lvl2Cnt .lvl2Ele .lvl2LnCnt,.col-nav .lvl2Cnt>.lvl1Nav .lvl2LnCnt,.mega-nav .lvl2Cnt .lvl2Ele .lvl2LnCnt,.mega-nav .lvl2Cnt>.lvl1Nav .lvl2LnCnt {
    display: flex;
    width: 100%
}

.col-nav .lvl3Cnt,.mega-nav .lvl3Cnt {
    z-index: 4
}

.col-nav .lvl1Cnt .childCount,.col-nav .lvl2Cnt .childCount,.col-nav .lvl3Cnt .childCount,.mega-nav .lvl1Cnt .childCount,.mega-nav .lvl2Cnt .childCount,.mega-nav .lvl3Cnt .childCount {
    color: #99a1ad
}

.col-nav>div {
    position: relative
}

.mega-nav-warning {
    display: none
}

.ncms-webcomp .nav-ncms .m-main-navigation .c-mainNavigation .m-mainNavigation {
    z-index: 4
}

.ncms-webcomp .nav-ncms .m-main-navigation .c-mainNavigation .m-mainNavigation a {
    text-decoration: none
}

.ncms-webcomp .nav-ncms .m-main-navigation .c-mainNavigation .slots {
    z-index: 4
}

.ncms-webcomp .nav-ncms .m-main-navigation .c-mainNavigation .nav-modal {
    z-index: 3
}

.ncms-webcomp .nav-ncms .slots ::slotted(div) {
    display: block!important
}

.ncms-webcomp .nav-ncms .nav-ncms-mob .mob-ncms-cnt .col-nav .lvl0lbl,.ncms-webcomp .nav-ncms .nav-ncms-mob .mob-ncms-cnt .mega-nav .lvl0lbl {
    width: calc(100% - 36px)
}

.ncms-webcomp .nav-ncms .slot-store ::slotted(div) {
    display: block!important
}

html:not([class]) body {
    max-width: 100%;
    margin: 12px;
    background-color: #fff;
    color: #33435b;
    font-family: Lato,"Lucida Sans Unicode","Lucida Grande",sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400
}

svg:not(:root) {
    overflow: hidden
}

.popover {
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px 0 rgba(128,128,128,.2)
}

.m-icon {
    width: 1.5em;
    height: 1.5em
}

.m-icon * {
    fill: #667284;
    fill: currentColor!important;
    stroke-width: 1.5px!important
}

.m-select-chevron {
    position: absolute;
    right: .5rem;
    top: 0;
    height: 2.5rem;
    font-size: .8125rem;
    color: #001432;
    pointer-events: none
}

.btn-block {
    display: block;
    width: 100%
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    user-select: none;
    background-image: none;
    border: 1px solid #000;
    border-radius: 4px
}

a.m-button {
    display: inline-flex;
    align-items: center
}

.m-button {
    position: relative;
    height: 2.5rem;
    padding: 0 1rem;
    vertical-align: middle;
    border: 0;
    border-radius: 4px;
    color: #fff;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.5;
    outline: 0;
    cursor: pointer;
    user-select: none;
    transition: background-color 125ms,box-shadow 125ms
}

.m-button .m-icon {
    margin: 0 .5rem;
    vertical-align: bottom;
    font-size: 1.25rem;
    width: 1em;
    height: 1em;
    transform: translateY(-.125rem)
}

.m-button-primary,.m-button-primaryRaised {
    background-color: #0059e4;
    border-color: #0059e4;
    color: #fff
}

.m-button-block {
    display: block;
    width: 100%;
    margin: 1rem 0;
    padding: 0
}

.m-input {
    margin-bottom: 1.5rem
}

.m-input-element {
    appearance: none;
    width: 100%;
    border: 1px solid #fff;
    box-shadow: 0 0 0 1px #ccd0d6;
    font-size: 1rem;
    font-family: inherit;
    padding: 0 .75rem;
    height: 2.5rem;
    color: #001432;
    border-radius: .125rem;
    transition: border-color 125ms ease-in-out
}

.m-input-elementWrapper {
    position: relative
}

.m-select-input {
    background: #fff;
    cursor: pointer
}

.m-select-option {
    display: block;
    padding: 8px 8px 9px;
    width: 100%;
    font-size: 1rem;
    text-decoration: none;
    color: #666;
    background-color: #fff;
    appearance: none;
    border: none;
    text-align: left;
    cursor: pointer
}

.m-select-options {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: 0;
    margin: 2px 0 0;
    max-height: 19.2rem;
    overflow-y: auto;
    background: #fff;
    list-style: none;
    z-index: 1;
    border-radius: 3px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.24)
}

.QSISlider {
    z-index: 200!important
}

#content .row .component.row-splitter:last-child .container-fluid:last-child .row:last-child .QSI__EmbeddedFeedbackContainer {
    margin-top: 30px
}

#content .row .component.row-splitter:last-child .container-fluid:last-child .row:last-child .QSI__EmbeddedFeedbackContainer fieldset {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

#content .row .component.row-splitter:last-child .container-fluid:last-child .row:last-child .QSI__EmbeddedFeedbackContainer fieldset .QSI__EmbeddedFeedbackContainer_QuestionText {
    color: #33435b;
    font-family: Lato!important;
    font-size: 13px!important;
    font-weight: 900!important;
    line-height: 20px!important;
    text-align: center!important;
    margin: 0
}

#content .row .component.row-splitter:last-child .container-fluid:last-child .row:last-child .QSI__EmbeddedFeedbackContainer fieldset .QSI__EmbeddedFeedbackContainer_Thumbs {
    margin: 12px 0 0
}

.documentation-content-block .whitespace-wrapper {
    padding: 12px;
    margin: 0 0 12px;
    background: #fff;
    width: auto;
    text-align: center
}

.documentation-content-block .whitespace-wrapper .text-box,.documentation-content-block .whitespace-wrapper .text-box h2 {
    margin-bottom: 12px
}

.documentation-content-block .whitespace-wrapper .text-box .description-text {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-count: 1;
    flex-direction: column
}

.documentation-content-block .whitespace-wrapper .grey-box {
    background: #e6e8eb
}

.documentation-content-block .whitespace-wrapper .grey-box .grey-box-wrapper {
    display: inline-block;
    padding: 12px
}

.documentation-content-block .whitespace-wrapper .grey-box .grey-box-wrapper img {
    width: 100%
}

.documentation-content-block .whitespace-wrapper .white-box .white-box-wrapper {
    display: inline-block;
    padding: 12px
}

.documentation-content-block .whitespace-wrapper .white-box .white-box-wrapper img {
    width: 100%
}

@media(hover: hover) and (pointer:fine) {
    .blog-carousel-light.interactive:hover .left.interactive,.blog-carousel-light.interactive:hover .left.interactive+.left-layer,.blog-carousel-light.interactive:hover .right.interactive,.blog-carousel-light.interactive:hover .right.interactive+.right-layer {
        display:flex;
        cursor: pointer
    }

    .blog-carousel-light.interactive:hover .left.interactive,.blog-carousel-light.interactive:hover .right.interactive {
        transition: opacity 250ms,background 250ms;
        background-color: transparent;
        opacity: 1;
        z-index: 2
    }

    .blog-carousel-light.interactive:hover .left.interactive+.left-layer,.blog-carousel-light.interactive:hover .right.interactive+.right-layer {
        opacity: 1
    }

    .carousel-light.interactive:hover .left.interactive,.carousel-light.interactive:hover .left.interactive+.left-layer,.carousel-light.interactive:hover .right.interactive,.carousel-light.interactive:hover .right.interactive+.right-layer {
        display: flex;
        cursor: pointer
    }

    .carousel-light.interactive:hover .left.interactive,.carousel-light.interactive:hover .right.interactive {
        transition: opacity 250ms ease-in-out,background 250ms ease-in-out;
        background-color: rgba(255,255,255,0);
        opacity: 1
    }

    .carousel-light.interactive:hover .left.interactive+.left-layer,.carousel-light.interactive:hover .right.interactive+.right-layer {
        opacity: 1;
        transition: opacity 250ms
    }
}

@keyframes account-user-rotate360 {
    100% {
        transform: rotate(360deg)
    }
}

@keyframes account-user-sb-glow {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px
    }

    100% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px
    }
}

.homepage .bucket-header {
    min-height: 46px;
}

.homepage .bucket-header {
    min-height: 46px;
}

