/* GENERAL/MISC  */

section {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-perspective: 1000;
	perspective: 1000;
	position: relative;
	z-index: 1;
}

.parallax {
	transition: .1s;
}

.spacer {
	height: 20vh;
}

/* GENERAL/MISC - END  */

/* PRODUCT CARD */

.product-card {
	max-width: 350px;
	margin: var(--s-15);
}

	.product-card-title::after {
		content: "";
		display: block;
	  position: absolute;
	  top: 0;
	  right: 0;
	  bottom: 0;
	  left: 0;
	  z-index: 1;
	}

	.product-card-image-wrapper {
		height: 300px;
	}

	.product-card-button {
		position: relative;
		z-index: 10;
	}

	.product-card-image {
		will-change: transform;
		transition: opacity .3s, transform .3s;
	}

	.product-card-image-hover {
		opacity: 0;
		transition: opacity .3s, transform .3s;
	}

	.product-card-hover {
		opacity: 0;
		transition: opacity .3s;
		width: auto;
		height: auto;
		margin: var(--s-15) var(--s-30);
		padding: var(--s-30);
	}

	.product-card-hoverable:focus .product-card-image-hover {
		opacity: 1;
	}
	.product-card-hoverable:focus .product-card-image {
		opacity: 0;
	}
	.product-card-hoverable:focus .product-card-hover {
		opacity: 1;
	}
		.product-card-hoverable:focus .whats-inside-variety-item {
			animation: slideIn .8s both;
		}

	.product-card-details {
		width: 100%;
		position: relative;
		z-index: 100;
	}

	.tooltip-product .tooltip-message {
		background-color: var(--cr-green);
		color: var(--cr-white);
		border-radius: 0;
		left: 0; right: 0;
		width: 90%;
		margin: 0 auto;
		padding: var(--s-30);
		max-width: unset;
		min-width: 200px;
		max-height: 300px;
		transform: translate(0, -125%);
		z-index: 100;
	}

	.tooltip-product .btn-x {
		position: absolute;
		top: var(--s-15);
		right: var(--s-15);
		z-index: 10;
	}

	.tooltip-cta {
		position: relative;
		z-index: 10;
		border-bottom: none !important;
		padding-bottom: 0;
	}

		.tooltip-cta svg {
			margin-left: var(--s-10);
			padding-top: 5px;
		}

		.tooltip-cta:hover svg {
			transform: translateX(3px);
		}

	.tooltip.tooltip-product:not(.active) .tooltip-message {
		transform: translate(0, -100%);
	}

	@media (hover: hover) {
		.product-card-hoverable:hover .product-card-image-hover {
			opacity: 1;
		}
		.product-card-hoverable:hover .product-card-hover {
			opacity: 1;
		}
			.product-card-hoverable:hover .whats-inside-variety-item {
				animation: slideIn .8s both;
			}
		.product-card-hoverable:hover .product-card-image {
			opacity: 0;
		}
	}

	@media (max-width: 900px) {
		#collection-grid .product-card {
			margin-bottom: var(--s-45);
		}

		.product-card-title {
			font: var(--t-h3);
			margin: 0;
			width: 100%;
		}

		.product-card-hover {
			margin: var(--s-15);
		}
	}

/* PRODUCT CARD - END */

.article-card {
	display: inline-block;
	width: 350px;
	margin: 0 var(--s-30) var(--s-30) 0;
	position: relative;
}

	.article-card-image-wrapper {
		max-width: 100%;
		height: 350px;
	}

	.article-card-title::after {
		content: "";
		display: block;
	  position: absolute;
	  top: 0;
	  right: 0;
	  bottom: 0;
	  left: 0;
	  z-index: 1;
	}

	.grid-3 .article-card {
		margin: 0;
		width: auto;
	}

	.article-card-empty {
		background: var(--cr-pink-dark);
		color: var(--cr-white);
		border: var(--border);
		height: 350px;
	}

	.article-card-empty:nth-of-type(2n) {
		background: var(--cr-orange);
	}

	.article-card-empty:nth-of-type(3n) {
		background: var(--cr-yellow);
	}

	.article-card-empty:nth-of-type(4n) {
		background: var(--cr-green-light);
	}

	.article-card-empty:nth-of-type(5n) {
		background: var(--cr-teal);
	}

	.article-card-empty:nth-of-type(6n) {
		background: var(--cr-blue);
	}

	@media (max-width: 1200px) {
		.article-card {
			width: 340px;
		}

			.article-card-empty,
			.article-card-image-wrapper {
				height: 340px;
			}
	}

	@media (max-width: 600px) {
		.article-card {
			width: 100%;
			margin: 0 0 var(--s-45) 0;
		}
	}

/* ARTICLE CARD */


/* ARTICLE CARD - END */

/* SLIDER */

.slider-nav-sticky {
	height: 100%;
}

	@media (min-width: 901px) {
		.slider-nav-sticky {
			position: -webkit-sticky;
			position: sticky;
			top: var(--header-height);
			height: calc(100vh - var(--header-height) - 60px);
		}

		body.template-product-bundle .slider-nav-sticky {
			height: calc(100vh - var(--header-height));
		}
	}

	.slider-nav {
		position: absolute;
	  bottom: var(--s-45);
	  left: 50%;
	  transform: translateX(-50%);
		display: flex;
		justify-content: center;
		align-items: center;
	}

		.slider-nav-item {
			height: 40px;
			width: 40px;
			border: var(--border);
			border-radius: 100%;
			z-index: 1;
			margin: 0 10px;
			overflow: hidden;
			cursor: pointer;
			transition: transform .3s;
			-webkit-border-radius: 100%;
	    -webkit-transform: translateZ(0);
	    -webkit-mask-image: -webkit-radial-gradient(circle, white, white);
		}

		.slider-nav-item:hover {
			transform: scale(1.2);
		}

	.slider:focus,
	.flickity-viewport:focus {
		outline: none !important;
	}

/* SLIDER - END */


/* MARQUEE */

.marquee {
	position: relative;
	overflow: hidden;
	height: 50px;
}

	.marquee-inner {
		display: flex;
		align-items: center;
		justify-content: space-evenly;
	  height: 100%;
	  position: absolute;
	  overflow: hidden;
	  -webkit-user-select: none;
		-moz-user-select: none;
		-o-user-select: none;
		user-select: none;
	}

		.marquee-block {
			display: flex;
			align-items: flex-end;
			line-height: 1.5;
			justify-content: space-evenly;
			overflow: hidden;
			white-space: nowrap;
			animation: marquee 60s .3s linear infinite;
		}

		.marquee.reverse .marquee-inner {
			transform: translateX(-50%);
		}

		.marquee.reverse .marquee-block {
			animation: marquee-reverse 60s .3s linear infinite;
		}

/* PACK BUILDER */

/*for a smooth sticky scroll in relation to menu*/

@media (min-width: 901px) {
	html#product-index header {
		position: -webkit-sticky;
		position: sticky;
    top: -115px;
    z-index: 10;
	}

	html#product-index #menu {
		position: relative;
		z-index: 202;
	}

	html#product-index #flyout-menu,
	html#product-index.scrolled #flyout-menu,
	html#product-index.menu_open.scrolled #flyout-menu {
		z-index: 201;
		transform: translateY(-202%) !important;
	}

		html#product-index.menu_open #flyout-menu {
			transform: translateY(0) !important;
		}

	#collection-menu {
		margin-top: 0 !important;
	}

		html.banner_active #collection-menu {
			margin-top: var(--header-offset) !important;
		}

	#collection-menu,
	html#product-index #pack-builder {
		z-index: 200 !important;
    position: relative !important;
    top: unset !important;
	}

}

#pack-builder {
	position: -webkit-sticky;
	position: sticky;
	/*top: var(--header-height);*/
	/*to overlay the nav*/
	top: 0;
	left: 0;
	right: 0;
	background: var(--cr-white);
	color: var(--cr-green);
	border-bottom: var(--border-green);
	padding: var(--s-15) var(--s-30) var(--s-15);
	/*to overlay the nav*/
	z-index: 200;
	transition: max-height .5s;
	max-height: 400px;
}

	html#product-single #pack-builder {
		position: fixed;
		top: unset;
		bottom: 0;
		border-top: var(--border-green);
		border-bottom: none;
	}

	@media (min-width: 901px) {
		html#product-index #pack-controls,
		html#product-single .pack-main {
			top: var(--s-15);    
			display: flex;
    	align-items: center;
    	justify-content: center;
		}

		html#product-single .pack-thumbnails {
			align-items: center;
			transform: translateY(20px);
		}

		.pack-collection-link {
			position: absolute;
			top: 0;
			left: 50%;
			transform: translate(-50%, 0);
		}

		html#product-index .pack-builder-close {
			display: none;
		}

	}

	html#product-single .pack-heading {
		display: none;
	}


	#pack-builder.collapsed {
		max-height: 60px;
	}

		/*short desktops*/
		@media (min-width: 901px) and (max-height: 600px) {
			#pack-builder.collapsed {
				height: 45px;
			}
		}

	#pack-builder .pack-builder-open,
	#pack-builder .pack-builder-close,
	#pack-builder-inner {
		transition: transform .3s, opacity .2s .3s, visibility 0s 0s;
	}

	#pack-builder:not(.collapsed) .pack-builder-open {
		opacity: 0;
		pointer-events: none;
		visibility: hidden;
	}

	#pack-builder:not(.collapsed) .pack-builder-open,
	#pack-builder.collapsed .pack-builder-close,
	#pack-builder.collapsed #pack-builder-inner {
		transition: transform .3s, opacity .3s, visibility 0s 1s;
		opacity: 0;
		pointer-events: none;
		visibility: hidden;
	}

	.pack-builder-close {
		position: absolute;
		top: 15px;
		right: 15px;
		z-index: 1;
	}

	.pack-builder-open {
		text-align: center;
		position: absolute;
		top: 0; left: 0; right: 0; bottom: 0;
		margin: 0;
		width: 100%;
	}

		@media (max-width: 900px) {

			.pack-builder-open {
				background: var(--cr-green);
				color: var(--cr-white);
			}

			.pack-builder-open svg {
				fill: var(--cr-white);
			}
		}

		.pack-builder-open .svg-arrow-down {
			width: 20px;
			height: 20px;
			margin-left: 5px;
			transform: rotate(180deg);
		}


	.pack-main {
		position: absolute;
		left: 50%;
		bottom: var(--s-15);
		transform: translateX(-50%);
		width: 60%;
		max-width: 900px;
	}

	.pack-thumbnail {
		position: relative;
		width: 70px;
		height: 80px;
		margin: 0 var(--s-15);
	}

		.pack-thumbnail .svg-icon {
			/*scale down because the images have annoying whitespace*/
			transform: scale(.9);
			margin-top: 3px;
			fill: var(--cr-green);
		}

			.pack-thumbnail .svg-icon-cup {
				fill: none;
			}

				[data-product-type="bar"] .pack-thumbnail .svg-icon {
					transform: scale(1);
				}

		.pack-thumbnail .btn-x {
			position: absolute;
			top: 0;
			right: -5px;
			z-index: 10;
		}

		.pack-thumbnail-link {
			display: inline-flex;
		}

	.pack-thumbnail.active .svg-icon,
	.pack-thumbnail:not(.active) .pack-thumbnail-image,
	.pack-thumbnail:not(.active) .btn-x {
		display: none;
	}

	.pack-thumbnail .btn-x {
		transition: transform .2s, opacity .2s;
		transform: scale(.5);
		opacity: 0;
	}

	.pack-thumbnail.active:hover .btn-x,
	.pack-thumbnail.active:focus .btn-x,
	.pack-thumbnail.active .btn-x:focus {
		transform: scale(1);
		opacity: 1;
	}

		/*hide past the smaller of the limits*/
		[data-pack-threshold="6"] .pack-thumbnail:nth-of-type(n + 7),
		[data-pack-threshold="2"] .pack-thumbnail:nth-of-type(n + 3) {
			display: none;
		}

		/*activate small button*/
		[data-pack-threshold="6"] [data-pack-small],
		[data-pack-threshold="2"] [data-pack-small] {
			background: var(--cr-green);
			color: var(--cr-white);
		}

		/*activate large button*/
		[data-pack-threshold="9"] [data-pack-large],
		[data-pack-threshold="4"] [data-pack-large] {
			background: var(--cr-green);
			color: var(--cr-white);
		}

	.pack-buy-button {
		border: var(--border-green);
		background-color: var(--cr-white);
		color: var(--cr-green);
		pointer-events: none;
	}

		.pack-buy-button.enabled {
			border-color: var(--cr-pink);
			background-color: var(--cr-pink);
			color: var(--cr-white);
			pointer-events: auto;
		}

			.pack-buy-button.enabled:focus {
				background-color: var(--cr-yellow);
				border-color: var(--cr-yellow);
			}

			@media (hover: hover) {
				.pack-buy-button.enabled:hover {
					background-color: var(--cr-yellow);
					border-color: var(--cr-yellow);
				}
			}

	.pack-buy-discount {
		opacity: .5;
	}

		.loader {
			display: none;
			justify-content: center;
			flex: 1;
		}

			.btn.loading .loader {
				display: flex;
				opacity: 1;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%,-50%);
			}

			.btn.loading > * {
				opacity: 0;
			}

		.loader::after {
		  content: "";
		  display: block;
		  width: 16px;
		  height: 16px;
		  margin-right: 0;
		  border-radius: 50%;
		  border: var(--border);
		  border-color: var(--cr-white) transparent var(--cr-white) transparent;
		  animation: spin 1.2s linear infinite;
		}

		.loader.green::after {
			border-color: var(--cr-green) transparent var(--cr-green) transparent;
		}

		.tooltip-pack {}

		.tooltip-message {
			transition: opacity .2s, transform .2s;
		}

		.tooltip:not(.active) .tooltip-message {
			opacity: 0;
			transform: scale(.9) translateX(100%);
			pointer-events: none;
		}

		.tooltip-message {
			position: absolute;
			top: var(--s-15);
			right: 0;
			max-width: 250px;
			min-width: 200px;
			max-height: 150px;
			border: var(--border-green);
			padding: 5px var(--s-10);
			border-radius: 10px;
			background-color: var(--cr-white);
			z-index: 10;
			overflow: hidden;
			transform: translateX(100%);
			-webkit-mask-image: -webkit-radial-gradient(circle, white, white);
		}

		.tooltip-pack-message .overflow-scroll {
			overflow: scroll;
			-webkit-overflow-scrolling: touch;
		}

		@media (max-width: 900px) {
		
			.tooltip:not(.active) .tooltip-message {
				transform: scale(.9) translateX(0);
			}

			.tooltip-message {
				top: var(--s-15);
				left: var(--s-15);
				right: unset;
				transform: translateX(0);
			}
		}

	.pack-collection-link {
		display: inline-block;
		margin-bottom: var(--s-15);
		padding-bottom: 5px;
		border-bottom: var(--border-green);
	}

	.pack-collection-link svg {
		fill: var(--cr-green);
		width: 25px;
		stroke: var(--cr-green);
		stroke-width: 1;
	}

	html#product-index .pack-collection-link {
		display: none;
	}

	@media (max-width: 1400px) {
		.pack-thumbnail[data-product-type="cup"] {
			width: 60px;
			height: 60px;
			margin: 0 5px;
		}
	}

	@media (max-width: 1280px) {
		.pack-thumbnail,
		.pack-thumbnail[data-product-type="cup"] {
			width: 50px;
			height: 70px;
			margin: 0 5px;
		}
	}

	/*small desktops*/
	@media (max-width: 1100px),
	(max-width: 1280px) and (max-height: 600px){
		.pack-thumbnail,
		.pack-thumbnail[data-product-type="cup"] {
			width: 50px;
			height: 50px;
			margin: 0;
		}

		.pack-collection-link svg {
			width: 20px;
		}
	}

	@media (max-width: 900px) {
		#pack-builder {
			position: fixed;
			top: unset;
			bottom: 0;
			border-top: var(--border-green);
			border-bottom: none;
			max-height: calc(100vh - var(--header-height));
			padding: var(--s-10) var(--s-30);
			z-index: 100;
		}

		#pack-builder-inner {
			flex-direction: column;
			align-items: center;
		}

			.pack-main {
				position: relative;
				left: unset;
				bottom: unset;
				transform: none;
				width: 100%;
				max-width: 300px;
			}

				.pack-thumbnails {
					margin-top: var(--s-15);
					flex-wrap: wrap;
				}

				/*for 2x2 grid*/
				[data-product-type="softserve"] .pack-thumbnails {
					width: 200px;
					margin: var(--s-15) auto 0;
				}

					.pack-thumbnail {
						width: 80px;
						height: 80px;
					}

					.pack-thumbnail[data-product-type="cup"] {
						width: 75px;
						height: 80px;
						margin: 0 5px;
					}

			.pack-thresholds {
				width: 100%;
				max-width: 400px;
				flex-direction: row;
    		justify-content: center;
    		align-items: center;
			}

			.tooltip-pack {
				margin-left: 0;
				position: absolute;
    		left: 0;
			}

			.pack-threshold-buttons {
				margin-top: 0;
			}

			.btn.pack-threshold {
				height: 30px;
				width: 120px;
				padding: 0;
				min-height: auto;
			}

			.pack-buy {
				display: flex;
				flex-direction: column-reverse;
			}

				.pack-buy-button {
					min-height: 40px;
					margin-bottom: var(--s-15)
				}

		.pack-collection-link svg {
			width: 20px;
		}

	}

	@media (max-width: 350px) {
		.btn.pack-threshold {
			width: 100px;
		}
	}


	

/* SVGS & SHAPES */

.circle {
	width: 75px;
	height: 75px;
	border-radius: 50%;
	overflow: hidden;
}

.oval {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	overflow: hidden;
}

.rect {
	width: 60px;
	height: 25px;
	overflow: hidden;
}

.rect-s {
	width: 35px;
	height: 15px;
	overflow: hidden;
}

.sunburst {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 175px;
  width: 175px;
  text-align: center;
  transform: rotate(-4deg);
  cursor: pointer;
}
	.sunburst p {
		width: min-content;
		margin: 0 auto;
		position: relative;
		z-index: 1;
		transform: rotate(-10deg);
	}

	.sunburst svg {
		position: absolute;
	  left: 0;
	  top: 0;
	  left: 0;
	  bottom: 0;
	  width: 100%;
	  height: 100%;
	  z-index: 0;
	  pointer-events: none;
	}

	.sunburst.large {
		height: 225px;
  	width: 225px;
	}

	.sunburst.green svg {
		fill: var(--cr-green-light);
	}

.svg-sunburst-rounded {width: 150px;}
.svg-sun {width: 150px;}
	.svg-sun.pink svg {fill: var(--cr-pink);}

.svg-whats-inside {width: 175px;}
.svg-whats-inside-2 {width: 250px;}
.svg-whats-not-inside {width: 275px;	}

.svg-star {
	pointer-events: none;
	width: 90px;
	fill: var(--cr-white)
}
	.svg-star.yellow svg {fill: var(--cr-yellow);}
	.svg-star.pink svg {fill: var(--cr-pink);}
.svg-cloud {pointer-events: none;width: 300px;}
.svg-planet {width: 100px;}
.svg-cloud-flat {width: 350px; fill: var(--cr-white);}
	.svg-cloud-flat.red-dark svg {fill: var(--cr-red-dark);}
	.svg-cloud-flat.pink svg {fill: var(--cr-pink);}
.svg-moon {width: 100px;}
	.svg-moon.pink svg {fill: var(--cr-pink);}
.svg-bird {width: 120px;}
.svg-lips {width: 120px;}
.svg-star-group {width: 90px;}
.svg-firework {width: 275px;}
.svg-cone {width: 150px;}
.svg-mouth {width: 175px;}
.svg-ball {width: 250px;}
.svg-chip {width: 60px;}
.svg-spoon {width: 350px;}

.svg-social {
	width: 22px;
}

@media (max-width: 900px) {
	.circle {
		width: 50px;
		height: 50px;
	}

	.rect {
		width: 35px;
		height: 15px;
		overflow: hidden;
	}

	.rect-s {
		width: 20px;
		height: 8px;
		overflow: hidden;
	}

	.svg-star {width: 60px;}
}

@media (max-width: 600px) {
	
	.oval {
		width: 10px;
		height: 10px;
	}

	.svg-star {width: 50px;}
	.svg-cloud {width: 150px;}
	.svg-planet {width: 80px;}
	.svg-cloud-flat {width: 200px;}
	.svg-moon {width: 70px;}
	.svg-sunburst-rounded {width: 100px;}
	.svg-sun {width: 70px;}
	.svg-bird {width: 60px;}
	.svg-lips {width: 80px;}
	.svg-star-group {width: 60px;}
	.svg-firework {width: 150px;}
	.svg-cone {width: 100px;}
	.svg-mouth {width: 100px;}
	.svg-ball {width: 140px;}
	.svg-chip {width: 40px;}
	.svg-spoon {width: 225px;}

}
/* SVGS & SHAPES - END */

/* BUTTONS - END */
.cloud {
  display: flex;
  position: relative;
  color: var(--cr-blue);
  align-items: center;
  justify-content: center;
  min-width: 150px;
  min-height: 60px;
  text-align: center;
  cursor: pointer;
  width: max-content;
  -webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	transition: .3s transform;
}

	.cloud p {
		position: relative;
		z-index: 1;
		margin: 55px var(--s-60);
		transform: translateY(5px);
	}

	.cloud svg {
		position: absolute;
	  left: 0;
	  top: 0;
	  left: 0;
	  bottom: 0;
	  width: 100%;
	  height: 100%;
	  z-index: 0;
	  pointer-events: none;
	}

	.cloud:focus,
	.cloud:hover {
		transform: rotate(8deg);
	}


/* BUTTONS - END */


/* SECTIONS */

.f2 > * {
	flex: 50% 0 0;
}

@media (max-width: 900px) {
	.f2 {
		flex-direction: column;
	}
}

/* SECTIONS - END */


/* POPUP */

#popup-mask {
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	width: 100%;
	right: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(61,145,255,.4);
	z-index: 200;
	opacity: 0;
	transition: opacity .3s;
	pointer-events: none;
}

	html.popup_open #popup-mask {
		pointer-events: auto;
		opacity: 1 !important;
	}

	#popup {
		position: fixed;
		width: 40vw;
		height: 45vw;
		max-width: 500px;
    max-height: 600px;
    min-width: 300px;
    min-height: 325px;
		transition: opacity .3s;
		background-color: var(--cr-white);
		transform: scale(0);
		z-index: 201;
    transition: opacity .3s, transform .3s;
	}

		html.popup_open #popup {
			transform: scale(1);
		}

		#popup-content {
			pointer-events: none;
			padding: var(--s-30);
			height: 100%;
			width: 100%;
		}

		#popup .btn-exit {
			position: absolute;
			top: var(--s-15);
			right: var(--s-15);
			z-index: 1;
		}

		@media (max-width: 600px) {
			#popup-content {
				padding: var(--s-30);
			}

			#popup .btn-exit {
				top: 10px;
				right: 10px;
			}
		}

/* POPUP - END */

/* ACCORDION */

.expandable {
  cursor: pointer;
  border-bottom: var(--border);
  height: auto;
}

	.expandable.green {
		border-bottom: var(--border-green);
	}

	/*.expandable:last-of-type {
		border-bottom: var(--border);
	}*/

	.expandable-title-wrapper {
		padding: var(--s-15) 0;
	  display: flex;
	  justify-content: space-between;
	}

		.expandable.popup .expandable-title-wrapper {
			padding-bottom: 15px;
		}

		.expandable-title {
		  display: flex;
		  align-items: center;
		  width: 90%;
		  margin-bottom: 0;
		}

	.plus-icon {
		display: flex;
	  align-items: center;
		margin: 0;
	  transition: transform .5s;
	}

		.expandable.active > .expandable-title-wrapper > .plus-icon {
		  transform: rotate(225deg);
		}

		.expandable.small .expandable-title {
			font: var(--t-body-bold);
		}

		.expandable.small .plus-icon {
			font: var(--t-body-large);
		}

	.dropdown-expandable,
	.expandable-text-wrapper {
	  max-height: 0;
	  overflow: hidden;
	  transition: max-height .6s ease-in-out;
	}

	.dropdown-expandable {
		max-height: 0;
	}

		.dropdown.active > .dropdown-expandable,
		.expandable.active > .expandable-text-wrapper {
		  max-height: 100vh;
		  overflow-y: scroll;
		  -ms-overflow-style: none;
		}

		/*protects against jump when deflating accordion*/
		.expandable.active > .expandable-text-wrapper::-webkit-scrollbar {
		  display: none;
		}

	.expandable-text {
	  padding-bottom: var(--s-15);
	  max-width: 60rem;
	}

		.expandable-text a {
		  text-decoration: underline;
		}

		.expandable-text p {
		  margin: 0;
		}

@media (max-width: 900px){

	.expandable-text {
		font: var(--t-body);
	}

  .expandable.active > .expandable-text-wrapper {
    max-height: 120vh;
  }
}

@media (max-width: 325px){
  .expandable.active > .expandable-text-wrapper {
    max-height: 250vh;
  }
}

@media (min-width: 901px) and (max-height: 660px) {
	.expandable-title-wrapper {
		padding: var(--s-10) 0;
	}
}

/* ACCORDION - END */

/* FIXED IMAGE */
.fixed-image {
	height: 133vh;
	transform: translateY(30vh) scale(1.1);
}

@media (max-width: 900px){
	.fixed-image {
		height: 60vh;
		transform: scale(1.1);
	}

}

/* FIXED IMAGE - END */