/*
Theme Name: WP_Easy22
Theme URI: http://www.pico.fi
Author: Tommi Honkanen
Author URI: http://www.pico.fi
Description: Theme for autokoulu Easy Driver 2023
Text Domain: easy-driver
Version: 2.2.40


*/
/* =Theme customization starts here
-------------------------------------------------------------- */

@font-face {
	font-family: 'Montserrat';
	src: url('fonts/Montserrat-VariableFont_wght.ttf') format('truetype-variations');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* @font-face {
	font-family: 'Montserrat';
	src: url('fonts/Montserrat-Italic-VariableFont_wght.ttf') format('truetype-variations');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
} */
:root {
	--vw:1vw;
	--navSize:85px;
	--contrastColor: rgba(255,255,0,1);
	--contrastColorDim: rgba(44,44,0,1);
	--primaryColor: #000000;
	--primaryTextColor: #0f0808;
	--accentColor: #3257b5;
	scroll-padding-top: 6rem;

}
body {
	font-family: 'Montserrat', sans-serif;
	font-optical-sizing: auto;
}

#content-page,
#content-page-news {
	--easy-content-size: var(--wp--style--global--content-size, 1140px);
	--easy-wide-size: var(--wp--style--global--wide-size, 1320px);
}

#content-page > .alignwide,
#content-page-news > .alignwide {
	max-width: var(--easy-wide-size);
	margin-left: auto;
	margin-right: auto;
}

#content-page > .alignfull,
#content-page-news > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.wp-block-button__link {
	width: 98% !important;
}
.navbar-default .navbar-nav > li > a {
	font-family: "Montserrat", sans-serif;
	font-weight: 200;
	font-size: 1.6rem;
	letter-spacing: 0.2rem;
}

.socialtags {
	position: relative;
	margin-right: 1vw;
/*	color: #fff;*/
/*	top: 2rem;*/
}
.socialtags .wp-social-link.wp-social-link-tiktok {
	border: 1px solid rgba(255,255,255,0.3);
}
.header-cityname {
	font-size: 1.75rem;
	font-weight: bold;
	padding-bottom: 0px !important;
	margin-bottom: 0px !important;
	line-height: 1em;
	text-transform: uppercase;
}
#vapaa {
	padding-top: 0em !important;
}
header {
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	display: block;
	z-index: 101;
}
#navibar {
	/*position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999;*/
	/*background-color: #1c1c1c !important;*/
	background-color: #000 !important;
	padding: .5em 0 0em 0;
	border-bottom: 2px solid rgb(255,255,0);
	text-align: center;
	box-shadow: 0px 4px 10px rgba(0,0,0,0.85);

	& .navirow {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}
#main {
	position: inherit;
	/* margin-top: 1rem; */
	/* margin-top: var(--navSize); */
}

.logo-header {
	position: relative;
	left: 0;
	width: 90%;
	height: auto;
	margin-top: .75em;
	z-index: 999;
}
.logo-menu {
	position: relative;
	left: 0;
	height: 1em;
	margin-top: .2em;
	z-index: 999;
}
.navbar-default .navbar-toggle {
	margin-left: auto;
}
img.flag {
	max-height: 1rem;
	padding-left: 1rem;
}

.is-style-full-width-button {
	display: inline-block;
	flex-grow: 1;
/*	width: 98%;*/
	font-size: clamp(14px, 0.8vw, 1.05rem);
	font-weight: 600;
	letter-spacing: 0.2rem;
/*	margin-bottom: .6rem;*/
	font-variant: all-small-caps;
}
.is-style-button-padding {
	margin-bottom: 0.6rem;
}
@media (min-width: 991px) {
	ul.navbar-nav {
		align-items: self-end;
	}
	@keyframes giftcardbg {
	 	0% {
	  	background-position: 0% 0%;
	  }
	  50% {
	  	background-position: 400% 15%;
		}	
		100% {
	  	background-position: 0% 0%;
	  	
		}
	}
}
/* response upper */

/* response downer */
[class*="frostblur-"]::before {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	filter: blur(15px);
	content: '';
	z-index: -1;
	scale: 1.35;
	background-size: cover;
	background-position: left center;
}
[class*="frostblur-"] > .wp-block-column > h2 {
	font-size: 1.65em;
	letter-spacing: 0.05em;
	font-variant: small-caps;
	font-variant: all-small-caps;
	margin-bottom: 1em;
}
[class*="frostblur-"] > .wp-block-column > p {
	font-size: 1.05em;
}
.wp-block-columns.front-frost {
	position: relative;
	top: 0;
	background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
	padding: 3rem 2rem 2rem 3rem;
	border-radius: 14px;
	z-index: 2;
	overflow: hidden;
}
.wp-block-gosign-gosign-background-container.front-frost {
	& .outer-container {
		border-radius: 16px;
		overflow: hidden;
		
			& .inner-container {
				padding: 3rem 2rem;
				backdrop-filter: blur(16px);
			}
		}
}
/* .wp-block-gosign-gosign-background-container {
	z-index: 201;
} */
.gosign-color-section.btn-full {
	width: 100vw;
	width: 100dvw;
	width: calc(var(--vw)*100);
	
	margin-left: -50vw !important;
	margin-left: -50dvw !important;
	margin-left: calc(-1*(var(--vw)*50)) !important;
	
	margin-right: -50vw !important;
	margin-right: -50dvw !important;
	margin-right: calc(-1*(var(--vw)*50)) !important;
}
.offcanvas-menu-bg {
	color: #fff !important;
	background: url('./images/menu_bg_top_by2.png') right bottom / contain no-repeat, linear-gradient(to right, rgba(0,0,0,0.55), rgba(0,0,0,0.65), rgba(0,0,0,0.75), rgba(0,0,0,0.90), rgba(0,0,0,1)),url('./images/menu_bg_bottom.jpg') right top / cover no-repeat;
	
}
@media (min-width: 992px) {
	.offcanvas-menu-bg {
		background-color: inherit;
		background-image: none;
	}
}
.tags-container {
	display: flex;
	justify-content: center;
}
@media (max-width: 575.98px) {
	#left-footer .socialtags .tags-container {
		padding-bottom: 2rem;
		border-bottom: 1px solid #ffff00;
		margin-bottom: 2rem;
	}
}
#navibar .navbar.nav-align {
	padding-bottom: 0px;
	align-self: self-end;
}
#navibar .navbar.nav-align .nav-link {
	font-variant: all-small-caps;
	padding-bottom: 0;
}
#navibar .navbar.nav-align .nav-link .nav-link-icon {
	margin-right: 1.2rem;
	padding-top: 0.15rem;
	font-size: 1.4rem;
}
#navibar .offcanvas-body .navbar-nav.navbar-first-move li:first-child {
	margin-right: auto;
}

@media (max-width: 991.98px) {
	#navibar .navbar-nav {
		padding-bottom: 0px;
		align-self: self-end;
		width: 80%;
		width: min(84%, 100% - 8vw);
		margin-left: auto;
		margin-right: auto;
	}

	#navibar .navbar.nav-align .nav-link {
		font-size: 1.4rem;
		margin-bottom: 0.15em;
		padding-bottom: 0px;
		display: flex;
		flex-grow: 1 !important;
		justify-content: flex-start !important;
		align-items: center;
		letter-spacing: 0.1rem;
		font-weight: 300;
		font-variant: all-small-caps;
	}		
}
#navibar .offcanvas-body .nav-soita {
	text-decoration: none;
	color: #000;
}

.page-404-box, .page-410-box {
	text-align: center;
	border: 1px solid #000;
	border-radius: 16px;
	background-color: rgba(255, 255, 0, 1.0);
	margin-bottom: 4em;

	& i {
		font-size: 4rem;
		padding: 1.6rem;
	}
	& h4 {
		background: #000;
		color: #ffff00;
		padding: 0.6rem;
		margin-bottom: 1rem;
		text-transform: uppercase;
	}
}

#footer-top {
	background-color: #FFFF00;
    border-top: 1px solid rgba(0,0,0,0.8);
}
#footer {
	background-color: #1a1a1a;
    color: #ffff00;
    padding-top: 4rem;
    padding-bottom: 2rem;
    height: 100%;
    min-height: 100%;
    background-image: url(./images/footer-wide-bg.jpg);
    background-repeat: repeat-x;
    background-position: bottom left;
}
#left-footer .socialtags h4.tags-footer, #mid-footer h4.tags-footer {
	font-size: 1.2rem;
	color: var(--bs-primary);
	padding-bottom: 1.6rem;
}
span.footer-hours-note {
	& a {
		color: var(--contrastColor);
		text-decoration: none;
		font-weight: 500;
		letter-spacing: 0.05rem;
	}
}

/* front page button grid */
.wp-block-buttons.is-style-button-fp-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - (0 * 0.6rem)) / 1)));
/*	align-content: start;*/
	gap: 0.6rem;
	justify-content: center;
/*	grid-auto-rows: min-content;*/
}
.wp-block-buttons .is-style-button-kaupungit {
	color: #FFFF00;
	text-transform: uppercase;
	display: flex;
	flex-grow: 1;
}
.wp-block-buttons.is-style-button-generic-grid {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-top: 2rem;
}
.wp-block-buttons .is-style-button-kaupungit .wp-block-button__link {
	background-color: #000000 !important;
	color: #FFFF00;
	border-radius: 16px;
	font-size: 0.85rem;
	flex-grow: 1;
	flex: 1 1 0;
	min-width: 0;
	font-weight: 600;
	letter-spacing: 0.1rem;
/*	word-wrap: unset !important;*/
/*	white-space: nowrap;*/
	margin-right: auto;
	margin-left: auto;
	padding: calc(0.467em + 2px) calc(1.333rem + 2px);
}
.gosign-color-section.main-header-secondary {
	border-bottom: 1px solid rgba(255, 255, 0, 1);
	border-top: 2px solid rgba(255, 255, 0, 1);
	box-shadow: 0px -4px 10px rgba(0,0,0,0.85),0px 4px 10px rgba(0,0,0,0.85);
	z-index: 3;
}
.gosign-color-section.main-header-secondary h3 {
	margin-bottom: 0rem;
	color: #ffff00 !important;
	z-index: 4;
	text-transform: uppercase;
}
.gosign-color-section.main-header-secondary.courseSection h1 {
	margin-bottom: 1rem;
	font-weight: 400;
	font-variant: all-small-caps;
}
.gosign-color-section.main-header-secondary.courseSection h1 + p {
	margin-bottom: 2.6rem;
	font-size: 1.35rem;
	& strong {
		font-weight: 450;
		margin-bottom: 0rem;
	}
}
.gosign-color-section.main-header-secondary.courseSection {
	& p:not(:first-of-type) {
		text-wrap: pretty;
		line-height: 1.9em;
		font-size: 1.05rem;
		font-weight: 300;
	}
	& p:last-of-type {
		margin-bottom: 3rem;
		
	}
	& p:nth-last-child(2) {
		margin-top: 2rem;
	}
}

.inner-container .contentBlock h1, .inner-container .contentBlock h2 {
	margin-bottom: 0.8em;
}
.inner-container .contentBlock p {
	line-height: 1.6em;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {
	.wp-block-buttons.is-style-button-fp-grid {
		grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - (1 * 1rem)) / 2)));
		gap: 1rem;
		justify-content: center;
	}
	.wp-block-buttons .is-style-button-kaupungit .wp-block-button__link {
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0.1rem;
		font-size: clamp(1rem, 1.3429rem - 0.7143vw, 0.9rem);
	}	
}
@media (min-width: 992px) {
	.wp-block-buttons.is-style-button-fp-grid {
		grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - (2 * 1rem)) / 3)));
		gap: 1rem;
		justify-content: center;
	}
	.wp-block-buttons .is-style-button-kaupungit .wp-block-button__link {
		font-weight: 600;
		letter-spacing: 0.1rem;
		font-size: clamp(0.9rem, 0.6415rem + 0.3846vw, 1.05rem);
	}
}
@media (min-width: 1200px) {
	.wp-block-buttons.is-style-button-fp-grid {
		grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - (3 * 1rem)) / 4)));
		gap: 1rem;
		justify-content: center;
	}
	.wp-block-buttons .is-style-button-kaupungit .wp-block-button__link {
		font-weight: 600;
		letter-spacing: 0.1rem;
		font-size: clamp(0.7rem, 0.5415rem + 0.3346vw, 1rem);
	}
}
@media (min-width: 1300px) {

	.wp-block-buttons .is-style-button-kaupungit .wp-block-button__link {
		font-size: clamp(0.7rem, 0.5415rem + 0.3346vw, 1rem);
	}
}
@media (min-width: 1400px) {
	.wp-block-buttons.is-style-button-fp-grid {
		grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - (4 * 1rem)) / 5)));
		gap: 1rem;
		justify-content: center;
	}
	.wp-block-buttons .is-style-button-kaupungit .wp-block-button__link {
		font-weight: 600;
		letter-spacing: 0.11rem;
		font-size: clamp(0.7rem, 0.4415rem + 0.2546vw, 1rem);
	}
	
}
h3:has(~ .is-style-button-fp-grid) {
	margin-top: 1rem;
	text-shadow: 
		1px 1px 0px rgb(0 0 0 / 0.9),
		-1px -1px 0px rgb(0 0 0 / 0.9),
		-1px 1px 0px rgb(0 0 0 / 0.9),
		1px -1px 0px rgb(0 0 0 / 0.9),
		1px 4px 5px rgb(0 0 0 / 0.65),
		-1px -1px 5px rgb(0 0 0 / 0.65),
		-1px 4px 5px rgb(0 0 0 / 0.65),
		1px -1px 5px rgb(0 0 0 / 0.65);
		letter-spacing: 0.02rem;
}
@media (min-width: 1800px) {
	.wp-block-buttons.is-style-button-fp-grid {
		grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - (5 * 1.5rem)) / 6)));
		gap: 1.5rem;
		justify-content: center;

	}
	
}
#ilmoitusbannerit {
	position: relative;
	height: inherit;
	max-height: 190px;
	overflow: hidden;
}
#banner-container {
	--banner-easeTime: 500; /* in ms */

	position: relative;
	/* top: 50px; */
	/* top: var(--navSize); */
	padding-left: 0;
	padding-right: 0;
	height: 190px;
	max-height: 190px;
	background-color: #000;
	

	& .banner__close {
		--closeSizeH: 2rem;
		--closeSizeW: 2rem;
		--closeBorder: 2px;
		display: flex;
		position: absolute;
		right: 5%;
		bottom: calc( (var(--closeSizeH) + (var(--closeBorder) * 2)) *-0.88);
		z-index: 100;
		width: max-content;
		min-width: var(--closeSizeW);
		height: var(--closeSizeH);
		background-color: #000;
		color: var(--bs-primary);
		padding: 0.3rem 1rem 1rem 1rem;
		cursor: pointer;
		border-width: var(--closeBorder);
		border-style: solid;
		border-color: var(--bs-primary);
		border-top-color: #000;
		border-radius: 0px 0px 6px 6px;
		align-items: center;
	}
}
.carousel-indicators {
	z-index: 10;
}
.carousel-control-prev, .carousel-control-next {
	z-index: 11;
}
.carousel,
.carousel-inner,
.carousel-item {
	height: 100%;
}
.slide-content-wrapper {
	font-size: 1rem;

	& .wp-block-gosign-gosign-background-container {
	font-size: 1em;
		& .inner-container .contentBlock {
			font-size: 0.9em;


			& .has-large-font-size {
				font-size: 1.4em !important;

				h3& {
					font-size: 1.6em !important;
				}

			}

			& .has-medium-font-size {
				font-size: 1em !important;
			}

			& .has-small-font-size {
				font-size: 0.7em !important;
			}

			& .special-head {
				font-size: 1.6em !important;
				margin-bottom: 0em !important;
				padding-bottom: 0em !important;
			}
		}
	}

	
}

.wp-block-buttons {

	&.is-style-button-keltainen {
		color: #FFFF00;
		text-transform: uppercase;
		display: flex;
		flex-grow: 0;
		font-size: 0.8em;
		width: min(100%, max(100%, max-content));
		margin-top: 3em;

		& .wp-block-button__link {
			background-color: #FFFF00 !important;
			display: inline-block;
			width: max-content !important;
			color: #000000;
			border-radius: 16px;
			font-size: 0.85rem;
			font-weight: normal;
			min-width: max-content;			
			letter-spacing: 0.1rem;
			margin-right: auto;
			margin-left: auto;
			padding: calc(0.467em + 4px) calc(1.4em + 2px);
		}
	}

}

.wp-block-social-link {
	border-radius: 100vw;
	width: 4em;
	height: auto;
	aspect-ratio: 4/3;
	display: flex;
	justify-content: center;
}
.wp-block-social-links {
	background: none;
	box-sizing: border-box;
	margin-left: 0;
	padding-left: 0;
	padding-right: 0;
	text-indent: 0;
	& .wp-social-link {
		color: white;
		fill: white;

		& a {
			align-items: center;
			display: flex;
			line-height: 0;
			text-decoration: none;
			border-bottom: 0;
		}

		&.wp-social-link-instagram {
			background-color: #f00075;
			color: white;
		}
		&.wp-social-link-tiktok {
			background-color: #000000;
			color: white;
		}
		&.wp-social-link-facebook {
			background-color: #0866ff;
			color: white;
		}
	}

	&.edsocial {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		list-style-type: none;
	}

	& svg {
		width: fit-content;
		height: fit-content;
		vertical-align: middle;
	
	}
}

.container-product__grid {

	margin-top: 2em;
	margin-bottom: 4em;

	& .page-breadcrumbs {
		grid-column: full-start / full-end;
		grid-row: 1;
		margin-bottom: 1rem;
	}
	display: grid;
	grid-template-columns: 
    [full-start] minmax(1rem, 0.4fr) 
    [main-start] minmax(0, 6fr) 
    [inner-split] minmax(0, 4fr) [main-end] 
    minmax(1rem, 0.4fr) [full-end];
	column-gap: 1rem;

	& .product-row__basic {
		grid-column: main-start / main-end;

		& .product-cta {
			display: grid;
			grid-template-columns: max-content max-content auto;
			gap: 1em;

			& button {
				z-index: 99;
			}
			& button.altbutton {
				z-index: 100;
			}

			& button, & button.altbutton {
				display: inline-grid;
				grid-template-columns: 1.6em auto;
				grid-template-rows: 1fr;
				grid-auto-flow: column;
				grid-row: 1;
				column-gap: 1em;
				align-items: center;
				margin-top: 2rem;
				margin-bottom: 2rem;
				background-color: var(--contrastColor);
				color: var(--primaryTextColor);
				font-size: 0.8em;
				font-variant: petite-caps;
				font-weight: 475;
				letter-spacing: 0.6px;
				border: 0px;
				border-radius: 1rem;
				padding: 0.75rem 1.5rem;
				box-shadow: inset 0 1px 2px #000030, 0 1px 2px rgb(0 0 30 / 1), 0 4px 2px rgb(0 0 30 / 1), 2px 4px 8px 2px rgb(0 0 30 / 0.3);
				transform: translateY(0) translateX(0) scale(1);
				transition: all 0.16s ease-in-out;

				&:hover, &:focus {
					
					background-color: var(--contrastColor);
					color: var(--primaryTextColor);
					box-shadow: inset 0 1px 2px rgb(0 0 30 / 0.5), 0 1px 2px rgb(0 0 15 / 0.5), 0 4px 2px rgb(0 0 30 / 0.5), 2px 4px 8px 2px rgb(0 0 30 / 0.3);
					transform: translateY(-2px) translateX(0) scale(1.02);
					transition: all 0.16s ease-in-out;
					
				}

				&.altbutton:hover i, &.altbutton:focus i {
					transform: scale(3) translateX(-0.5em);
					background-color: var(--contrastColor);
					border-radius: 100vw;
					/* border: 0.25px solid var(--primaryTextColor); */
					box-shadow: 1px 0px 0px 0.6px rgb(255 255 0 / 1), -0.5px 0px 0px 0.5px rgb(0 0 30 / 0.6), 0 1px 0px 0.25px rgb(0 0 30 / 0.6), 0 -1px 0 rgb(0 0 30 / 0.6);
				}

				& i {
					/* padding-left: 0.5em; */
					color: var(--primaryTextColor);
					/* padding-right: 1em; */
					display: inline-flex;
					align-items: center;
					justify-content: center;
					align-self: center;
					width: 1.2em;
					height: 1.2em;
					line-height: 1;
					box-sizing: border-box;
					transform: scale(1);
					transform-origin: center;
					transition: transform 0.22s ease-in-out;
				}
			}
		}
	}

	& .product-image {
			grid-column: inner-split / main-end;
			margin-top: 2rem;
			margin-bottom: 2rem;
			display: flex;
			justify-content: flex-end;
			grid-row: 2;

			& img {
				max-width: 100%;
				height: auto;
				border-radius: 16px;
				box-shadow: 0px 4px 10px rgba(0,0,0,0.85);
			}
		}
	& .product-section {
		display: grid;
		grid-column: main-start / inner-split;
		font-size: 1rem;

		& > h1:first-of-type {
			margin-bottom: 0.5rem;
			padding-top: 2rem;
			text-transform: uppercase;
			font-size: 2rem;
		}

		& > h2:first-of-type {
			margin-bottom: 1rem;
			font-size: 1.5rem;
		}

		& .product-price-info {
			margin-top: 1em;
			margin-bottom: 1em;
			display: grid;
			grid-template-columns: [price-start] auto [detail] 1fr [price-end];
			grid-template-rows: auto;
			column-gap: 1em;

			& > p:nth-of-type(1) {
				grid-column: price-start / detail;
				grid-row: 1 / span 2;
				font-variant: normal;
				color: transparent;
				font-size: 2.4rem;
				font-weight: 800;
				/* line-height: 1rem; */
				background-image: linear-gradient(180deg, rgb(255 255 0 / 0.8) 0%, rgb(255 255 0 / 0.9) 50%, rgb(118 118 0 / 1) 100%);
				background-clip: text;
				position: relative;
				vertical-align: text-bottom;
				& span {
					padding-left: 0.4em;
					color: inherit;
					position: relative;
					background-clip: text;
					font-size: inherit;
					line-height: inherit;
					font-weight: inherit;
					background-image: linear-gradient(180deg, rgb(255 255 0 / 0.8) 0%, rgb(255 255 0 / 0.9) 50%, rgb(118 118 0 / 1) 100%);

					&::after {
					display: block;
					content: attr(data-textcontent);
					color: #ffffff;
					position: absolute;
					inset: 0;
					text-shadow: 0.6px 0.6px 0px rgb(255 255 0 / 0.9), -1px -1px 0px rgb(84, 84, 0), 0px -1px 0px rgb(84, 84, 0), 0 2px 0 rgb(66, 61, 0), 0 1px 0 rgb(86, 88, 0), 0 2px 0 rgb(66, 61, 0), 0 3px 0 rgb(39, 36, 0), 0 4px 0 rgb(0 0 0 / 1), 0 5px 0 rgb(0 0 0 / 1), 0 6px 1px rgb(0 0 0 / 0.4), 0 0 5px rgb(0 0 0 / 0.5), 0 1px 3px rgb(0 0 0 / 0.3), 0 3px 5px rgb(0 0 0 / 0.2), 0px 3px 10px rgb(0 0 15 / 0.85);
					z-index: -1;
					padding: inherit;
					text-box: auto;
					
				}
				}

				&::after {
					display: block;
					content: attr(data-textcontent);
					color: #ffffff;
					position: absolute;
					inset: 0;
					text-shadow: 0.6px 0.6px 0px rgb(255 255 0 / 0.9), -1px -1px 0px rgb(84, 84, 0), 0px -1px 0px rgb(84, 84, 0), 0 2px 0 rgb(66, 61, 0), 0 1px 0 rgb(86, 88, 0), 0 2px 0 rgb(66, 61, 0), 0 3px 0 rgb(39, 36, 0), 0 4px 0 rgb(0 0 0 / 1), 0 5px 0 rgb(0 0 0 / 1), 0 6px 1px rgb(0 0 0 / 0.4), 0 0 5px rgb(0 0 0 / 0.5), 0 1px 3px rgb(0 0 0 / 0.3), 0 3px 5px rgb(0 0 0 / 0.2), 0px 3px 10px rgb(0 0 15 / 0.85);
					z-index: -1;
					padding: inherit;
					
				}
				
			}
			
			& > p:nth-of-type(2) {
				font-variant: normal;
				font-size: 0.75em;
				color: var(--primaryTextColor);
				margin-bottom: 0px;
				align-content: flex-end;
				& span {
					padding-left: 1em;
					font-weight: 300;
					color: var(--primaryTextColor);
				}
			}

			& .product-promo {
				grid-column: detail / price-end;
				font-size: 0.75em;
				font-weight: normal;
				color: var(--primaryTextColor);
				align-content: space-evenly;
				padding-bottom: 0.2em;

				& > p  {				
					font-size: 1em;
					font-variant: normal;
					font-weight: 300;
					line-height: 1em;
						& span {
						padding-left: 1em;
						font-weight: 300;
						color: var(--primaryTextColor);
						}
				}
			}

		}

		& ul {
			padding-left: 1.5rem;
			margin-bottom: 2rem;
			list-style-type: square;

			li {
				margin-bottom: 0.5rem;
				line-height: 1.4em;
				font-size: 1em;

				& ul {
					list-style-type: disc;
					padding-left: 1.5rem;
				}
			}
		}

		& .product-other {
			padding-top: 3rem;

			& > h5:first-of-type {
				margin-bottom: 4rem;
				text-transform: uppercase;
				font-size: 1.2em;
				padding-left: 1em;
			}
		}
	}
}
.breadcrumbs {
	margin: 0;
	& ol {
		padding-left: 0;
		list-style: none;
		font-size: 0.9rem;
		& li {
			display: inline;
			&+li:before {
				padding: 0 0.5rem;
				color: #000;
				content: "/\00a0";
			}
		}
	}
}
.varjo {
	text-shadow: 0px 4px 6px rgba(0,0,0,0.45);
}