/*********************
    Design Tokens (Universal)
*********************/

:root {
    
    /***** Breakpoints *****/

    --breakpoint_sm: 480px;
    --breakpoint_md: 991px;
    --breakpoint_lg: 1140px;
    --breakpoint_xl: 1280px;
    
    /***** Width *****/

    --w_1-12: 8.333%;
    --w_2-12: 16.666%;
    --w_3-12: 25%;
    --w_4-12: 33.333%;
    --w_5-12: 41.666%;
    --w_6-12: 50%;
    --w_7-12: 58.333%;
    --w_8-12: 66.666%;
    --w_9-12: 75%;
    --w_10-12: 83.333%;
    --w_11-12: 91.666%;
    --w_12-12: 100%;
    
    /***** Spacing *****/
    
    --spacing_xs-5: 12px;
    --spacing_xs-4: 16px;
    --spacing_xs-3: 24px;
    --spacing_xs-2: 30px;
    --spacing_xs-1: 36px;
    --spacing_xs: 48px;
    --spacing_sm: 72px;
    --spacing_md: 96px;
    --spacing_lg: 108px;
    --spacing_xl: 144px;
    
    /***** Type Scale (Absolute) *****/
    
    --type-scale_xs-5: 0.279rem;
    --type-scale_xs-4: 0.335rem;
    --type-scale_xs-3: 0.402rem;
    --type-scale_xs-2: 0.482rem;
    --type-scale_xs-1: 0.579rem;
    --type-scale_xs: 0.694rem;
    --type-scale_sm: 0.833rem;
    --type-scale_md: 1rem;
    --type-scale_lg: 1.2rem;
    --type-scale_xl: 1.44rem;
    --type-scale_xl-1: 1.728rem;
    --type-scale_xl-2: 2.074rem;
    --type-scale_xl-3: 2.488rem;
    --type-scale_xl-4: 2.986rem;
    --type-scale_xl-5: 3.583rem;
    --type-scale_xl-6: 4.3rem;
    
    /***** Type Scale (Relative) *****/
    
    --type-scale-rel_xs-5: 0.279em;
    --type-scale-rel_xs-4: 0.335em;
    --type-scale-rel_xs-3: 0.402em;
    --type-scale-rel_xs-2: 0.482em;
    --type-scale-rel_xs-1: 0.579em;
    --type-scale-rel_xs: 0.694em;
    --type-scale-rel_sm: 0.833em;
    --type-scale-rel_md: 1em;
    --type-scale-rel_lg: 1.2em;
    --type-scale-rel_xl: 1.44em;
    --type-scale-rel_xl-1: 1.728em;
    --type-scale-rel_xl-2: 2.074em;
    --type-scale-rel_xl-3: 2.488em;
    --type-scale-rel_xl-4: 2.986em;
    --type-scale-rel_xl-5: 3.583em;
    --type-scale-rel_xl-6: 4.3em;
    
    --headings_margin: 0.694em;
    
    /***** Font Weight *****/
    
    --font-weight_hairline: 100;
    --font-weight_extra-light: 200;
    --font-weight_light: 300;
    --font-weight_regular: 400;
    --font-weight_book: 500;
    --font-weight_medium: 600;
    --font-weight_bold: 700;
    --font-weight_black: 800;
    --font-weight_heavy: 900;
    
    /***** Letter Spacing *****/
    
    --letter-spacing_dense: -0.06em;
    --letter-spacing_normal: normal;
    --letter-spacing_loose: 0.06em;
    
    /***** Shadows *****/
    
    --shadow_sm: 0 1px 1px rgba(0, 0, 0, 0.02), 0 2px 4px rgba(0, 0, 0, 0.02);
    --shadow_md: 0 1px 4px rgba(0, 0, 0, 0.04), 0 4px 10px rgba(0, 0, 0, 0.08);
    --shadow_lg: 0 2px 20px rgba(0, 0, 0, 0.04), 0 8px 32px rgba(0, 0, 0, 0.08);
    --shadow_xl: 0 8px 20px rgba(0, 0, 0, 0.06), 0 24px 60px rgba(0, 0, 0, 0.12);

}

/****************************
	Layout
****************************/

/***** Container *****/

.yls_container {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--spacing_xs-4);
	padding-right: var(--spacing_xs-4);
}

.yls_container::after {
    content: "";
    display: table;
    clear: both;
}

@media only screen and (max-width: 480px) {
	.yls_container {
		padding-left: var(--spacing_xs-3);
		padding-right: var(--spacing_xs-3);
	}
}

@media only screen and (min-width: 544px) {
	.yls_container {
		max-width: 576px;
	}
	.yls_container.wide {
		max-width: 100%;
		padding: 0 var(--spacing_xs);
	}
}

@media only screen and (min-width: 768px) {
	.yls_container {
		max-width: 720px;
	}
	.yls_container.narrow {
		max-width: 720px;
	}
	.yls_container.wide {
		max-width: 100%;
		padding: 0 var(--spacing_xs);
	}
}

@media only screen and (min-width: 992px) {
	.yls_container {
		max-width: calc( var(--breakpoint_md) - var(--spacing_xs) );
	}
	.yls_container.wide {
		max-width: 100%;
		padding: 0 var(--spacing_sm);
	}
}

@media only screen and (min-width: 1200px) {
	.yls_container {
		max-width: var(--breakpoint_lg);
	}
}

@media only screen and (min-width: 1280px) {
	.yls_container.wide {
		max-width: 1600px;
		padding: 0 var(--spacing_sm);
	}
}

/***** Default Component Spacing *****/

.yls_comp {
    margin-bottom: var(--comp-spacing_outer);
}

.yls_comp-inner {
    padding: var(--comp-spacing_inner) 0;
}

/***** Width *****/

.w_1-12 {
    width: 8.333%;
}

.w_2-12 {
    width: 16.666%;
}

.w_3-12 {
    width: 25%;
}

.w_4-12 {
    width: 33.333%;
}

.w_5-12 {
    width: 41.666%;
}

.w_6-12 {
    width: 50%;
}

.w_7-12 {
    width: 58.333%;
}

.w_8-12 {
    width: 66.666%;
}

.w_9-12 {
    width: 75%;
}

.w_10-12 {
    width: 83.333%;
}

.w_11-12 {
    width: 91.666%;
}

.w_12-12 {
    width: 100%;
}

/***** Margin *****/

.margin__0 {
	margin: 0 !important;
}

/* Horizontal */

.margin-x__0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.margin-l__0 {
  margin-left: 0 !important;
}

.margin-r__0 {
  margin-left: 0 !important;
}

/* Vertical */

.margin-y__0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.margin-t__0 {
  margin-top: 0 !important;
}

.margin-b__0 {
  margin-bottom: 0 !important;
}

/***** Padding *****/

.padding__0 {
	margin: 0 !important;
}

/* Horizontal */

.padding-x__0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.padding-l__0 {
  padding-left: 0 !important;
}

.padding-r__0 {
  padding-left: 0 !important;
}

/* Vertical */

.padding-y__0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.padding-t__0 {
  padding-top: 0 !important;
}

.padding-b__0 {
  padding-bottom: 0 !important;
}

/****************************
	Position
****************************/

.static {
	position: static !important;
}

.fixed {
	position: fixed !important;
}

.absolute {
	position: absolute !important;
}

.relative {
	position: relative !important;
}

.sticky {
    --sticky_offset: 36px;
	position: sticky !important;
	top: calc( var(--sticky_offset) + var(--height_top-bar) );
	left: 0;
}

@media only screen and (max-width: 991px) {
	.md_static {
	  position: static;
	}
	
	.md_fixed {
		position: fixed;
	}
	
	.md_absolute {
	  position: absolute;
	}
	
	.md_relative {
		position: relative;
	}
	
	.md_sticky {
		position: sticky;
		top: calc( var(--sticky_offset) + var(--height_top-bar) );
		left: 0;
	}
}

@media only screen and (max-width: 480px) {
	.sm_static {
    position: static;
	}
	
	.sm_fixed {
		position: fixed;
	}
	
	.sm_absolute {
	  position: absolute;
	}
	
	.sm_relative {
		position: relative;
	}
	
	.sm_sticky {
		position: sticky;
		top: calc( var(--sticky_offset) + var(--height_top-bar) );
		left: 0;
	}
}

/****************************
	Aspect Ratio
****************************/

.aspect__square {
	/*aspect-ratio: 1 / 1;*/
	padding-bottom: 100%;
}

.aspect__minor-third-h {
	/*aspect-ratio: 1.2 / 1;*/
	padding-bottom: 83.3%;
}

.aspect__minor-third-v {
	/*aspect-ratio: 1 / 1.2;*/
	padding-bottom: 120%;
}

.aspect__tv {
	/*aspect-ratio: 4 / 3;*/
	padding-bottom: 75%;
}

.aspect__video {
	/*aspect-ratio: 16 / 9;*/
	padding-bottom: 56.25%;
}

.aspect__golden-h {
	/*aspect-ratio: 16.18 / 10;*/
	padding-bottom: 61.8%;
}

.aspect__golden-v {
	/*aspect-ratio: 10 / 16.18;*/
	padding-bottom: 161.8%;
}

.aspect__profile {
	/*aspect-ratio: 3 / 4;*/
	padding-bottom: 133.3%;
}

@media only screen and (max-width: 991px) {
	.md_aspect__square {
		/*aspect-ratio: 1 / 1;*/
		padding-bottom: 100%;
	}
	
	.md_aspect__minor-third-h {
		/*aspect-ratio: 1.2 / 1;*/
		padding-bottom: 83.3%;
	}
	
	.md_aspect__minor-third-v {
		/*aspect-ratio: 1 / 1.2;*/
		padding-bottom: 120%;
	}
	
	.md_aspect__tv {
		/*aspect-ratio: 4 / 3;*/
		padding-bottom: 75%;
	}
	
	.md_aspect__video {
		/*aspect-ratio: 16 / 9;*/
		padding-bottom: 56.25%;
	}
	
	.md_aspect__golden-h {
		/*aspect-ratio: 16.18 / 10;*/
		padding-bottom: 61.8%;
	}
	
	.md_aspect__golden-v {
		/*aspect-ratio: 10 / 16.18;*/
		padding-bottom: 161.8%;
	}
	
	.md_aspect__profile {
		/*aspect-ratio: 3 / 4;*/
		padding-bottom: 133.3%;
	}
}

@media only screen and (max-width: 480px) {
	.sm_aspect__square {
		/*aspect-ratio: 1 / 1;*/
		padding-bottom: 100%;
	}
	
	.sm_aspect__minor-third-h {
		/*aspect-ratio: 1.2 / 1;*/
		padding-bottom: 83.3%;
	}
	
	.sm_aspect__minor-third-v {
		/*aspect-ratio: 1 / 1.2;*/
		padding-bottom: 120%;
	}
	
	.sm_aspect__tv {
		/*aspect-ratio: 4 / 3;*/
		padding-bottom: 75%;
	}
	
	.sm_aspect__video {
		/*aspect-ratio: 16 / 9;*/
		padding-bottom: 56.25%;
	}
	
	.sm_aspect__golden-h {
		/*aspect-ratio: 16.18 / 10;*/
		padding-bottom: 61.8%;
	}
	
	.sm_aspect__golden-v {
		/*aspect-ratio: 10 / 16.18;*/
		padding-bottom: 161.8%;
	}
	
	.sm_aspect__profile {
		/*aspect-ratio: 3 / 4;*/
		padding-bottom: 133.3%;
	}
}

/****************************
	Flexbox
****************************/

.flex {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

/***** Flex Direction *****/

.flex__row {
	flex-direction: row !important;
}

.flex__row-reverse {
	flex-direction: row-reverse !important;
}

.flex__col {
	flex-direction: column !important;
}

.flex__col-reverse {
	flex-direction: column-reverse !important;
}

@media only screen and (max-width: 991px) {
	.md_flex__row {
		flex-direction: row !important;
	}
	
	.md_flex__row-reverse {
		flex-direction: row-reverse !important;
	}
	
	.md_flex__col {
		flex-direction: column !important;
	}
	
	.md_flex__col-reverse {
		flex-direction: column-reverse !important;
	}
}

@media only screen and (max-width: 480px) {
	.sm_flex__row {
		flex-direction: row !important;
	}
	
	.sm_flex__row-reverse {
		flex-direction: row-reverse !important;
	}
	
	.sm_flex__col {
		flex-direction: column !important;
	}
	
	.sm_flex__col-reverse {
		flex-direction: column-reverse !important;
	}
}

/***** Flex Wrap *****/

.flex__wrap {
	flex-wrap: wrap;
}

.flex__nowrap {
	flex-wrap: nowrap;
}

@media only screen and (max-width: 991px) {
	.md_flex__wrap {
		flex-wrap: wrap;
	}
	
	.md_flex__nowrap {
		flex-wrap: nowrap;
	}
}

@media only screen and (max-width: 480px) {
	.sm_flex__wrap {
		flex-wrap: wrap;
	}
	
	.sm_flex__nowrap {
		flex-wrap: nowrap;
	}
}

/***** Flex Grow *****/

.flex__grow {
	flex-grow: 1;
}

.flex__grow-0 {
	flex-grow: 0;
}

/***** Justify Content *****/

.justify__start {
	justify-content: flex-start;
}

.justify__end {
	justify-content: flex-end;
}

.justify__center {
	justify-content: center;
}

.justify__between {
	justify-content: space-between;
}

.justify__around {
	justify-content: space-around;
}

.justify__evenly {
	justify-content: space-evenly;
}

@media only screen and (max-width: 991px) {
	.md_justify__start {
	  justify-content: flex-start;
	}
	
	.md_justify__end {
	  justify-content: flex-end;
	}
	
	.md_justify__center {
	  justify-content: center;
	}
	
	.md_justify__between {
	  justify-content: space-between;
	}
	
	.md_justify__around {
	  justify-content: space-around;
	}
	
	.md_justify__evenly {
	  justify-content: space-evenly;
	}
}

@media only screen and (max-width: 480px) {
	.sm_justify__start {
	  justify-content: flex-start;
	}
	
	.sm_justify__end {
	  justify-content: flex-end;
	}
	
	.sm_justify__center {
	  justify-content: center;
	}
	
	.sm_justify__between {
	  justify-content: space-between;
	}
	
	.sm_justify__around {
	  justify-content: space-around;
	}
	
	.sm_justify__evenly {
	  justify-content: space-evenly;
	}
}

/***** Align Items *****/

.align-items__start {
	align-items: flex-start;
}

.align-items__end {
	align-items: flex-end;
}

.align-items__center {
	align-items: center;
}

.align-items__stretch {
	align-items: stretch;
}

@media only screen and (max-width: 991px) {
	.md_align-items__start {
		align-items: flex-start;
	}
	
	.md_align-items__end {
		align-items: flex-end;
	}
	
	.md_align-items__center {
		align-items: center;
	}
	
	.md_align-items__stretch {
		align-items: stretch;
	}
}

@media only screen and (max-width: 480px) {
	.sm_align-items__start {
		align-items: flex-start;
	}
	
	.sm_align-items__end {
		align-items: flex-end;
	}
	
	.sm_align-items__center {
		align-items: center;
	}
	
	.sm_align-items__stretch {
		align-items: stretch;
	}
}

/***** Flex Auto *****/

[class*="flex_auto"]:not([class*="item"]) {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

/* Rows */

.flex_auto__rows {
	--gap: 30px;
	flex-direction: column;
	margin-top: calc( var(--gap) / -2 );
	margin-bottom: calc( var(--gap) / -2 );
}

.flex_auto__rows > .flex_auto-item {
	padding-top: calc( var(--gap) / 2 );
	padding-bottom: calc( var(--gap) / 2 );
}

.flex_auto__rows > .flex_auto-item.hide {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.flex_auto__rows > .flex_auto-item.padding-b__0 + div {
	padding-top: 0 !important;
}

/* Columns */

.flex_auto__cols {
	--gap: 30px;
	flex-direction: row;
	margin-left: calc( var(--gap) / -2 );
	margin-right: calc( var(--gap) / -2 );
}

.flex_auto__cols > .flex_auto-item {
	padding-left: calc( var(--gap) / 2 );
	padding-right: calc( var(--gap) / 2 );
}

.flex_auto__cols > .flex_auto-item.hide {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Grid */

.flex_auto__grid {
	--gap: 30px;
	flex-direction: row;
	flex-wrap: wrap;
	margin: calc( var(--gap) / -2 );
}

.flex_auto__grid > .flex_auto-item {
	padding: calc( var(--gap) / 2 );
}

.flex_auto__grid > .flex_auto-item.hide {
    padding: 0 !important;
}

/* Responsive */

@media only screen and (max-width: 991px) {

    .flex_auto__cols.md_flex_auto__rows {
        flex-direction: column;
        margin-top: calc( var(--gap) / -2 );
	    margin-bottom: calc( var(--gap) / -2 );
	    margin-left: 0;
	    margin-right: 0;
    }
    
    .flex_auto__cols.md_flex_auto__rows > .flex_auto-item {
        width: 100% !important;
        padding-top: calc( var(--gap) / 2 );
	    padding-bottom: calc( var(--gap) / 2 );
	    padding-left: 0;
	    padding-right: 0;
    }

}

@media only screen and (max-width: 480px) {

    .flex_auto__cols.sm_flex_auto__rows {
        flex-direction: column;
        margin-top: calc( var(--gap) / -2 );
	    margin-bottom: calc( var(--gap) / -2 );
	    margin-left: 0;
	    margin-right: 0;
    }
    
    .flex_auto__cols.sm_flex_auto__rows > .flex_auto-item {
        width: 100% !important;
        padding-top: calc( var(--gap) / 2 );
	    padding-bottom: calc( var(--gap) / 2 );
	    padding-left: 0;
	    padding-right: 0;
    }

}

/****************************
	CSS Grid
****************************/

.cgrid {
    --gap-x: 30px;
    --gap-y: 30px;
    
    margin-top: calc( var(--gap-y) / -2 );
    margin-bottom: calc( var(--gap-y) / -2 );
    
    -webkit-columns: var(--cols);
	-moz-columns: var(--cols);
	columns: var(--cols);
	column-gap: var(--gap-x);
}

.cgrid__1 {
    --cols: 1;
}

.cgrid__2 {
    --cols: 2;
}

.cgrid__3 {
    --cols: 3;
}

.cgrid__4 {
    --cols: 4;
}

.cgrid-item {
    padding-top: calc( var(--gap-y) / 2 );
    padding-bottom: calc( var(--gap-y) / 2 );
    
    -webkit-column-break-inside: avoid;
	page-break-inside: avoid;
    break-inside: avoid;
}

/****************************
	Color Classes
****************************/

/***** Primary *****/

.bg_primary-300 {
    background: var(--color_primary-300);
}

.bg_primary-400 {
    background: var(--color_primary-400);
}

.bg_primary-500 {
    background: var(--color_primary-500);
}

/***** Secondary *****/

.bg_secondary-300 {
    background: var(--color_secondary-300);
}

.bg_secondary-400 {
    background: var(--color_secondary-400);
}

.bg_secondary-500 {
    background: var(--color_secondary-500);
}

/****************************
    Typography
****************************/

/***** Text Selection *****/

::selection {
    background: var(--color_primary-500) !important;
    color: #fff !important;
}

::-moz-selection {
    background: var(--color_primary-500) !important;
    color: #fff !important;
}

.s-tselect {
    background: var(--color_primary-500) !important;
    color: #fff !important;
}

/***** Line Clamp *****/

[class*="line-clamp"] {
    position: relative;
    
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    padding: 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    
    line-height: var(--type-scale-rel_xl-1);
}

.line-clamp__1 {
    height: var(--type-scale-rel_xl-1);
	-webkit-line-clamp: 1;
}

.line-clamp__2 {
    height: calc( var(--type-scale-rel_xl-1) * 2 );
	-webkit-line-clamp: 2;
}

.line-clamp__3 {
    height: calc( var(--type-scale-rel_xl-1) * 3 );
	-webkit-line-clamp: 3;
}

.line-clamp__4 {
    height: calc( var(--type-scale-rel_xl-1) * 4 );
	-webkit-line-clamp: 4;
}

/****************************
	Images
****************************/

.img__cover {
	position: relative;
}

.img__cover img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	object-fit: cover;
	object-position: center center;
}

/****************************
    Buttons
****************************/

/***** Reset "<a>" styling (eg. tiles) *****/

.a_reset {
    display: inline-block;
    width: 100%;
    text-decoration: none !important;
}

/****************************
	Miscellaneous
****************************/

html,
body {
	scroll-behavior: smooth;
}

body {
	overflow-x: hidden;
}

.hide, .hidden, .s-hidden {
	display: none !important;
}

.no-scroll {
	height: 100%;
	overflow-y: hidden;
}

a,
a *,
a *:before,
a *:after,
[class*="yls_btn"],
button,
button *,
input,
input *,
svg,
form.yls_form .s-radio__label,
.transition-default,
.swiper-button,
.swiper-button *,
.swiper-pagination,
.swiper-pagination * {
	-webkit-transition: all 0.38s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	-moz-transition: all 0.38s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
	transition: all 0.38s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

div[data-anchor="true"] {
    opacity: 0;
    pointer-events: none;
}

div[data-anchor="true"]:before {
	content: "";
	display: block;
	height: 100px;
	margin: -100px 0 0;
}

.blur {
    filter: blur(20px);
}