﻿#pageBlocks { display: flex; justify-content: space-between; flex-wrap: wrap; }

.pageblock { box-sizing: border-box; width: 100%; }
	.pageblock:not(.floating) { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	.pageblock.columns-2 { gap: 32px; }
	.pageblock.columns-3 { gap: 24px; }
	.pageblock.columns-4 { gap: 21px; }
	.pageblock.columns-5 { gap: 20px; }
	.pageblock.useBorder { border-bottom: 1px dashed #00000016; padding: 0 0 60px 0; }
	.pageblock h1 { font-weight: 400; }
	.pageblock a { text-decoration: none; }
	.pageblock img { width: auto; }
	.pageblock.useBorder:last-child { border-bottom: none; }
	.pageblock.useFullBorder { border: 1px solid #0000001F; padding: 12px; }

.subNav { border-top: 1px dashed #00000016; margin: 0 0 30px 0; width: 100%; text-align: center; }
	.subNav.margin-large { margin: 30px 0; }
.subNavInner { background: var(--bg); padding: 10px 10px; margin: auto; position: relative; bottom: 29px; display: inline-flex; justify-content: center; align-items: center; gap: 8px; }
	.subNavInner a { font-size: 1rem; color: var(--main); padding: 8px 16px; text-align:center; }
		.subNavInner a.selected,
		.subNavInner a:hover { border-radius: 100px; background: var(--main); text-decoration: none; color:var(--bg); }

		.subCategories { margin: 0 0 40px 0; }
			.subCategories .subCategoriesInner { display: flex; justify-content: center; gap: 10px;  }
			.subCategories a { font-size: 0.9rem; background: var(--main); color: var(--beige); padding: 5px 15px; border-radius: 100px; white-space:nowrap; }
				.subCategories a:hover,
				.subCategories a.selected { background: var(--beige); color: var(--main); text-decoration: none; }

#searchIcon img { display: block; cursor: pointer; }

.border { border-top: 1px solid #ddd; height: 1px; padding: 0; margin: 25px 0 20px 0; }

.column { box-sizing: border-box; }
	.column .columnInner > div:last-child { margin: 0; }
	.column .columnContentHeader .pageHeader { margin: 0; line-height: 1em; font-weight:500; }
	.column .columnContentHeader { margin: 0 0 4px 0; }
	.column iframe { width: 100% !important; }
	.width-25.column .columnContentHeader {margin: 0 0 10px 0;}
	.column.center {margin: auto;}

.columnInner:hover { text-decoration: none; }
a.columnInner p,
a.columnInner li {}
.columnInner ul,
.columnInner ol {padding: 0 0 0 15px;}
.columnInner li { }
.normal .columnInner ul {padding: 0 0 0 20px;}
.normal .img {margin: 0 0 20px 0;}

.floating .width-50 { width: calc(50% - 16px); margin: 0 16px 16px 0; }
	.floating .width-50:nth-child(2n) { margin: 0 0 16px 0; }

.width-100 { width: 100%; }
.width-66 { width: 66%; }
.width-50 { width: calc(50% - 16px); margin: 0 0 16px 0; }
	.width-50.margin-large { width: calc(50% - 32px); margin: 0 0 32px 0; }
.width-33 { width: calc(33.33% - 16px); }
.width-25 { width: calc(25% - 16px); }
.width-20 { width: calc(20% - 16px); }
.width-25:nth-child(4n) {margin: 0;}
.width-100 h1.pageHeader { font-size: 2.75rem; }
.width-100 .pageHeader { font-size: 2rem; font-weight: 400; }
.width-100 p { font-size: 1.125rem; }
.width-33 .pageHeader { font-size: 1.375rem; }
.width-25 .pageHeader,
.width-50.imageCard .pageHeader { font-size: 1.125rem; }
	.width-25.headerFirst .pageHeader {font-size: 1.25rem;}
	.width-50.headerFirst.imageCard .pageHeader { font-size: 2rem; font-family: "EB Garmond", serif; font-weight: 400; }
.width-33 p { font-size: 1rem; }
.width-50.headerFirst.imageCard p { font-size: 1rem; }
.margin-down-small { margin: 0 0 20px 0; }
.margin-down-medium { margin: 0 0 60px 0; }
.margin-down-large { margin: 0 0 80px 0; }
.margin-small { gap: 20px; }
.margin-medium { gap: 40px; }
.margin-large { gap: 80px; }
.width-100.margin-small { margin: 0 0 20px 0; }
.width-100.margin-medium { margin: 0 0 60px 0; }
.width-100.margin-large { margin: 0 0 80px 0; }
.width-100.margin-small:last-child,
.width-100.margin-medium:last-child,
.width-100.margin-lareg:last-child { margin: 0; }

.centerText { text-align: center; margin: 0 auto; }
	.centerText .columnContentHeader { margin: 0 auto 12px auto !important; max-width: 720px; }
		.centerText .columnContentHeader .pageHeader,
		.centerText .columnTextBlock { text-align: center; }
	.centerText .columnTextBlock { max-width: 580px; margin: auto !important; }
	.centerText p,
	.centerText li { font-size: 1.125rem; }
	.centerText p:last-child {margin: 0;}

.pageblock.hero .column:first-child .columnContentHeader { border-top: 1px solid var(--main); padding: 20px 0 0 0; }
.pageblock.hero .column:first-child .columnTextBlock { border-bottom: 1px solid var(--main); padding: 0 0 20px 0; }

.galleryGrid { height: 480px; }
	.galleryGrid.hasBg { padding: 1rem; }
	.galleryGrid .columnInner { height: 100%; }
	.galleryGrid.odd > columnInner { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: repeat(2, 1fr); gap: 1rem; position: relative; height: 100%; }
	/* Allmän bildstil */
	.galleryGrid.odd .img { width: 100%; height: 100%; overflow: hidden; }
		.galleryGrid.odd .img img,
		.galleryGrid.odd .img video { width: 100%; height: 100%; object-fit: cover; display: block; }
		.galleryGrid.odd .img:nth-child(1) { grid-column: 1 / 2; grid-row: 1 / 3; }
		.galleryGrid.odd .img:nth-child(2) { grid-column: 2; grid-row: 1; }
		.galleryGrid.odd .img:nth-child(3) { grid-column: 3; grid-row: 1; }
		.galleryGrid.odd .img:nth-child(4) { grid-column: 2; grid-row: 2; }
		.galleryGrid.odd .img:nth-child(5) { grid-column: 3; grid-row: 2; }

	.galleryGrid.even > columnInner { display: grid; grid-template-rows: repeat(2, 1fr); gap: 1rem; position: relative; height: 100%; }
	.galleryGrid.even .img { width: 100%; height: 100%; overflow: hidden; }
		.galleryGrid.even .img img,
		.galleryGrid.even .img video { width: 100%; height: 100%; object-fit: cover; display: block; }

	.galleryGrid.odd .img img:hover {cursor:pointer !important;}

	.galleryGrid .linkBtnDiv { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; pointer-events: none; }
	.galleryGrid .linkBtn { font-size: 1rem; padding: 12px 32px; border: 3px solid #fff; }

	.gallery .columnInner {display:flex; justify-content:flex-start;align-items:flex-start; flex-wrap:wrap; gap: 10px 10px;}
	.gallery .img {width: calc(33.33% - 7px); height:320px;}
	.gallery .img img {height:100%; width:100%; object-fit:cover;}

.logos { height: 72px; }
	.logos .columnInner { display: flex; justify-content: space-between; align-items: center; gap: 35px; height: 100%; }
		.logos .columnInner .img { height: 100%; display: block; }
		.logos .columnInner img { height: 100%; width: 100%; object-fit: contain; display: block; }

.imageCard.hasBg { padding: 16px; background: linear-gradient(180deg,var(--bg) 0%, var(--gradient) 90%); }
.imageCard.hasBg.headerFirst {}
.width-20.imageCard.hasBg {padding:10px;}
.width-25.imageCard.hasBg { padding: 12px; }
.width-50.imageCard.hasBg { padding: 24px; }
.width-50.imageCard.headerFirst { padding: 40px; }
.imageCard.headerFirst .columnContentHeader { background: var(--main); color:var(--beige); padding: 10px 0; }
.imageCard .img { height: 252px; overflow: hidden; display: flex; justify-content: center; align-items: center; }
.width-50.imageCard .img { height: 480px; }
.width-33.imageCard .img { height: 352px; }
.width-20.imageCard .img { height: 10vw; }
.pageblock.floating .width-50.imageCard .img { height: auto; }
.imageCard .img img,
.imageCard .img video { height: 100%; width:100%; object-fit: cover; }
.pageblock.floating .width-50.imageCard .img img,
.pageblock.floating .width-50.imageCard .img video { width: 100%; object-fit: contain; }
.imageCard { text-align: center; }

	.imageCard .columnTextBlock p { font-size: 1rem; font-weight: 400; margin: 0; }
	.imageCard .pageHeader { font-family: "Baskerville", serif; }
.slider .imageCard.width-50 .pageHeader { font-size: 1.25rem;  }
.slider .imageCard.width-50 p { font-size: 1rem; font-weight: lighter; }
.imageCard div { margin: 0 0 15px 0; }
	.imageCard div:last-child { margin: 0; }
.imageCard * { color: inherit; }
.imageCard.headerFirst .columnTextBlock { margin: 0 0 30px 0; }

.textBlock.hasBg { padding: 32px; }
.textBlock.width-33 { width: 32%; margin: 0 16px 0 0; }
.textBlock .columnInner { display: flex; justify-content: space-between; flex-direction: column; height: 100%; }
	.textBlock .columnInner div { margin: 0 0 12px 0; }
.textBlock .pageHeader { font-size: 2rem; font-family: "EB Garmond", serif; font-weight: 400; margin: 0; }
.column.normal .columnContentHeader .pageHeader { font-size: 1.675rem; font-family: "EB Garmond", serif; font-weight: 400; margin: 0 0 15px 0; }
.textBlock .columnInner .columnTextBlock { margin-top: auto; }
.textBlock .columnTextBlock p { font-size: 1.125rem;}
.textBlock a .columnTextBlock p {  }

.normal.hasBg { padding: 25px; }
.normal img,
.normal video { width: 100%; display: block; }
.normal h3 { font-size: 1.5rem; margin: 0 0 10px 0;}
.normal p,
.normal li { font-size: 1rem; }
.numberCircle { background: var(--main); color: #fff; width: 32px; font-weight: bold; height: 32px; font-size: 1rem; text-indent: -1px; margin: 0 12px 0 25px; display: inline-flex; justify-content: center; align-items: center; border-radius: 100px; }
.hasBg .numberCircle { margin: 0 12px 0 0; }

.singleImage .columnInner,
.singleImage .columnInner .img {display:block; height: 100%; }
.singleImage .columnInner .img img {height: 100%;object-fit:cover;}

.noPaddingBottom { padding-bottom: 0 !important; }

.instagramFeed { }
	.instagramFeed h2,
	.instagramFeed h2 a,
	.instagramFeed h3,
	.instagramFeed h3 a,
	.instagramFeed h4,
	.instagramFeed h4 a { font-size: 2rem; font-family: "EB Garmond", serif; color: var(--main); font-weight: 400; margin: 0 0 12px 0; }
	.instagramFeed p { font-size: 1.125rem; }
	.instagramFeed .instagram-feed { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 40px 0 0 0; }
	.instagramFeed .instagramPost { width: 100%; aspect-ratio: 1 / 1; }
		.instagramFeed .instagramPost .image { height: 100%; display: flex; justify-content: center; align-items: center; overflow: hidden; }
		.instagramFeed .instagramPost img { width: 100%; height: 100%; object-fit: cover; }

.qnaBlock { border-bottom: 1px solid #ddd; padding: 0 0 20px 0; margin: 0 0 20px 0; cursor: pointer; }
	.qnaBlock .questionHeader { display: flex; justify-content: space-between; align-items: center; }
		.qnaBlock .questionHeader p { margin: 0; font-size:1.125rem; }
		.qnaBlock .questionHeader img {transform:rotate(90deg); width: 40px; height:14px;}
		.qnaBlock .questionHeader.open img {transform:rotate(-90deg);}
	.qnaBlock .answerText { display: none; }
		.qnaBlock .answerText p { font-size: 1rem; }

.pageblock.slider { position: relative; }
.slider .sliderInner { margin: 20px 0 0 0; width: 100000px; position: relative; display: flex; gap: 16px; justify-content: flex-start; position: relative; }

	.slider .sliderInner .width-50 { width: 624px; max-width: none; flex: none; }
.sliderButtons { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin: 0 6px 0px 0; position: absolute; right: 0; top: 10px; }
	.sliderButtons span { width: 40px; height: 40px; cursor: pointer; border: 1px solid #ddd; border-radius: 100px; display: flex; justify-content: center; align-items: center; background: #fff; }
	.sliderButtons .inactive { cursor: default; opacity: 0.5; }
	.sliderButtons span img { width: 8px; }
	.sliderButtons span.inactive img { opacity: 0.2; }
	.sliderButtons span:first-child img { transform: rotate(180deg) }
	.sliderButtons span:hover { background: #ddd; }
	.sliderButtons span.inactive:hover { background: #fff; }

.productinfo .columnInner { display: flex; justify-content: flex-start; align-items: flex-start; gap: 5%; }
	.productinfo .columnInner .leftColumn { width: 51.5%; }
	.productinfo .columnInner .rightColumn { width: 43.5%; box-sizing: border-box; }
		.productinfo .columnInner .rightColumn .priceColumn { background: #fff; padding: 40px; margin: 0 0 40px 0;}
	.productinfo .columnInner .leftColumn .columnTextBlock,
	.productinfo .columnInner .rightColumn .rightColumnText .columnTextBlock { padding: 0 0 40px 0; margin: 0 0 40px 0; border-bottom: 1px dashed #ddd; }
		.productinfo .columnInner .leftColumn .columnTextBlock:last-child { border-bottom: none; padding: 0; margin: 0; }
		.productinfo .columnInner .leftColumn .columnTextBlock p { font-size: 1.25rem; font-weight: 400; }
			.productinfo .columnInner .leftColumn .columnTextBlock p:last-child { margin: 0; }
		.productinfo .columnInner .leftColumn .columnTextBlock:first-child { padding: 0 0 40px 0; margin: 0 0 40px 0; border-bottom: 1px solid #ddd; }
			.productinfo .columnInner .leftColumn .columnTextBlock:first-child p { font-size: 1.575rem; font-weight: 400; }
	.productinfo .columnInner .rightColumn .priceInfo { border-bottom: 1px solid #ddd; padding: 0 0 20px 0; margin: 0 0 20px 0; }
	.productinfo .columnInner .rightColumn p.smallPriceText { font-size: 1.1rem; margin: 0; }
	.productinfo .columnInner .rightColumn p.priceText { font-size: 2.125rem; margin: 0 0 20px 0; }
	.productinfo .columnInner .rightColumn .linkBtn { font-size: 1.125rem; }
	.productinfo .columnInner .rightColumn .steps { }

		.productinfo .columnInner .rightColumn .steps p { display: flex; justify-content: flex-start; align-items: center; gap: 16px; font-size: 1.125rem; margin: 0 0 15px 0; }
			.productinfo .columnInner .rightColumn .steps p:last-child { margin: 0; }
			.productinfo .columnInner .rightColumn .steps p span:first-child { color: var(--main); display: block; font-family: "EB Garmond", serif; font-size: 1.625rem; font-weight: bold; }


.contactPerson .columnInner { display: flex; justify-content: flex-start; gap: 32px; }
.contactPerson .img img { height: 100%; }
.contactPerson p { font-size: 1.125rem; }
	.contactPerson p:last-child { margin: 0; }
.contactPerson .name { font-size: 1.375rem; }
.contactPerson .type { color: var(--mainLight); margin: 0 4px 0 0; display: inline-block; }
.contactPerson .contactInfo { display: flex; justify-content: space-between; flex-direction: column; gap: 24px; }
.contactPerson.width-50 { margin: 0 0 64px 0; }
.contactPerson.width-33,
.contactPerson.width-25 { margin: 0 0 32px 0; }

.contactForm.hasBg { padding: 25px; }
.contactForm .formRow { margin: 0 0 20px 0; }
	.contactForm .formRow.flex { display: flex; gap: 20px; }
	.contactForm .formRow label,
	.contactForm .formRow legend { display: block; font-size: 1rem; margin: 0 0 5px 0; display: flex; justify-content: flex-start; align-items: center; }
	.contactForm .formRow input[type=text],
	.contactForm .formRow input[type=number],
	.contactForm .formRow input[type=email],
	.contactForm .formRow input[type=date],
	.contactForm .formRow textarea { background: var(--bg); padding: 8px 16px; font-size: 1.125rem; border: none; width: 100%; box-sizing: border-box; font-family: "Baskerville", serif; }
		.contactForm .formRow input[type=text]:focus,
		.contactForm .formRow input[type=number]:focus,
		.contactForm .formRow input[type=email]:focus,
		.contactForm .formRow input[type=date]:focus,
		.contactForm .formRow textarea:focus { outline: none; border: 1px solid #000; border: transparent; }
	.contactForm .formRow textarea { height: 120px; }
.contactForm fieldset { border: 1px solid #ddd; }
	.contactForm fieldset input { margin: 0 5px 0 0; display: inline-block; }
.contactForm .consentRow label { font-size: 0.875rem; }
.contactForm .consentRow input[type=checkbox] {margin: 0 10px 0 0;}
.contactForm input[type=checkbox],
.contactForm input[type=radio] { appearance: none; -webkit-appearance: none; background: var(--bg); border: 1px solid var(--main); width: 16px; min-width:16px; height: 16px; cursor: pointer; display: inline-block; vertical-align: middle; position: relative; }
	.contactForm input[type=checkbox]:checked,
	.contactForm input[type=radio]:checked { background: var(--main); border-color: var(--main); }
		.contactForm input[type=checkbox]:checked::after,
		.contactForm input[type=radio]:checked::after { content: ""; position: absolute; left: 4px; top: 1px; width: 4px; height: 8px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.contactForm .formActions button { background-color: var(--main); color: #fff; padding: 8px 16px; font-size: 0.875rem; border: none; cursor: pointer; }
	.contactForm .formActions button:hover { opacity: 0.9; }
.contactForm .formRow.error p { color: #f00; }

.contactForm .formRow select { background: var(--bg); padding: 8px 40px 8px 16px; /* extra högermarginal för större pil */ font-size: 1rem; border: none; width: 100%; box-sizing: border-box; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; background-size: 20px; cursor: pointer; }
	.contactForm .formRow select:focus { outline: none; border: 1px solid #000; }
.contactForm .formRow input[type=file] { padding: 10px; border: 1px solid #ddd; width: 100%; box-sizing: border-box; }
.contactForm .formMessage { margin: 10px 0 0 0; padding: 10px; color: #fff; }
	.contactForm .formMessage.success { background: #058401; border: 1px solid #025300; }
	.contactForm .formMessage.failure { background: #840101; border: 1px solid #530000; }

	.contactPageInfo p {margin: 0 0 32px 0;}
	.contactPageInfo p a {margin: 8px 0 0 0;}

.wecaptcha-wrap { visibility: hidden; position: absolute; left: -9999px; top: -9999px; }
.wecaptcha { line-height: 40px; font-size: 1.25rem; }
.wecaptcha-image { vertical-align: middle; border: 1px solid #ddd !important; }
.wecaptcha input[type='text'].wecaptcha-tbx { height: 40px; width: 45px; padding: 0 10px; border: 1px solid #ddd; text-align: center; font-size: 1.25rem; line-height: 40px; vertical-align: middle; }
.captchaHeader p { margin: 10px 0 0 0; font-size: 0.75rem; color: var(--main); font-style: italic; }
.formErrors { color: #c00; margin: 1em 0 0; }
	.formErrors ul { margin: 0; padding-left: 1.2em; }

#productSearchField { width: 100%; padding: 9px; border-radius: 100px; background: #fff; text-align: center; justify-content: center; align-items: center; box-sizing: border-box; }
#productSearchField { display: flex; transition: opacity .25s ease,transform .25s ease }
	#productSearchField.pre-open { display: flex; opacity: 0; transform: translateY(-6px) scale(.98) }
	#productSearchField.is-open { display: flex; opacity: 1; transform: none }

#productSearchField input {width: auto;}
	#productSearchField input,
	#productSearchField input::placeholder { border: none; font-weight: 500; margin: 0 0 0 15px; width: 100%;}
	#productSearchField input:focus {border:0; outline:0;}
	#productSearchField img {display:inline; width:auto;}
	.productList .searchResultsHeader { font-size: 2rem; text-align: center; font-weight: 400; margin: 0 auto 30px auto; }
#closeSearch {position:absolute; right: 12px; cursor:pointer; width: auto; display:inline;}

.webshopProductList .categories { }
.webshopProductList .productList { display: flex; justify-content: flex-start; gap: 24px 1.8%; flex-wrap: wrap; width: 100%;}
	.webshopProductList .productList .product { width: 32%; background: #fff; padding: 24px; box-sizing: border-box; }
	.webshopProductList .productList.relatedProducts .product {width: 23.6%;}
		.webshopProductList .productList .product:hover a { text-decoration: none; }
		.webshopProductList .productList .product .image { height: 300px; width: 100%; display: block; overflow: hidden; }
			.webshopProductList .productList .product .image .img { height: 100%; }
			.webshopProductList .productList .product .image img { width: 100%; height: 100%; object-fit: contain; }
		.webshopProductList .productList .product .info { margin: 15px 0 0 0; display: block; text-align: center; color: #000; font-size: 1rem; }
			.webshopProductList .productList .product .info .productName { display: block; min-height: 48px; font-size: 1.175rem; }
			.webshopProductList .productList .product .info .productPrice { display: block; font-size: 1.25rem; }
			.webshopProductList .productList .product .info .productSku { display: block; margin: 0 0 10px 0; }

.webshopProduct .columnInner { display: flex; justify-content: space-between; align-items: flex-start; }
.webshopProduct .productImages { width: 53%; }
	.webshopProduct .productImages .large-image-ph { width: 100%; height: 640px; padding: 24px; background: #fff; box-sizing: border-box; cursor: pointer; }
.webshopProduct .large-image-ph img { height: 100%; width: 100%; object-fit: contain; }
.webshopProduct .productImages .productImageThumbs { display: flex; justify-content: center; flex-wrap: wrap; margin: 20px 0 0 0; gap: 5px; }
	.webshopProduct .productImages .productImageThumbs .productImageThumb { width: 88px; padding: 10px; background: #fff; cursor: pointer; }
		.webshopProduct .productImages .productImageThumbs .productImageThumb.on { background: var(--main); }
		.webshopProduct .productImages .productImageThumbs .productImageThumb .img { width: 100%; height: 88px; }
		.webshopProduct .productImages .productImageThumbs .productImageThumb img { width: 100%; height: 100%; object-fit: contain; }
.webshopProduct .productImages .large-image-wrap { position: relative; }

.webshopProduct .pi-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 36px; height: 36px; line-height: 36px; border: 0; border-radius: 9999px; background: rgba(0,0,0,.45); color: #fff; font-size: 22px; text-align: center; cursor: pointer; opacity: 1; transition: opacity .2s ease, background .2s ease, transform .08s ease; display: flex; align-items: center; justify-content: center; }

	.webshopProduct .pi-nav.prev { left: 12px; }
	.webshopProduct .pi-nav.next { right: 12px; }

.webshopProduct .large-image-wrap:hover .pi-nav,
.webshopProduct .large-image-wrap:focus-within .pi-nav { opacity: 1; }

.webshopProduct .pi-nav:hover { background: rgba(0,0,0,.6); }
.webshopProduct .pi-nav:active { transform: translateY(-50%) scale(0.98); }
.webshopProduct .pi-nav:focus-visible { outline: 2px solid var(--main); outline-offset: 2px; }

/* Visa pilarna bara om det finns minst två tumnaglar */
.webshopProduct .productImages:not(:has(.productImageThumbs .productImageThumb:nth-child(2))) .pi-nav { display: none !important; }


.webshopProduct .productInfo { width: 43%; padding: 22px 0; }
.webshopProduct .productName { border-bottom: 1px dashed #00000016; margin: 0 0 20px 0; }
	.webshopProduct .productName .categoryName { color: var(--main); }
	.webshopProduct .productName h1 { font-size: 2.5rem; margin: 0 0 15px 0; }
.webshopProduct .productPrice .priceLabel { font-size: 2rem; line-height: 1em; margin: 0 0 5px 0; }
.webshopProduct .productPrice .taxInfoText { font-size: 0.8rem; }
.webshopProduct .addToCart { border-bottom: 1px dashed #00000016; margin: 0 0 20px 0; padding: 0 0 25px 0; }
.webshopProduct .addToCartInner { display: flex; justify-content: flex-start; gap: 12px; }
.webshopProduct .addToCart p { font-size: 0.8rem;  margin: 0; }
.webshopProduct .addToCart input[type=number] { width: 354px; padding: 12px 16px; background: #fff; color: #000; border: none; font-size: 1rem; }
.webshopProduct #addToCartBtn { width: 174px; text-align: center; box-sizing: border-box; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.webshopProduct .webshopInfo { border-bottom: 1px dashed #00000016; margin: 0 0 20px 0; padding: 0 0 25px 0; }
	.webshopProduct .webshopInfo:last-child { border-bottom: none; margin: 0; padding: 0; }
	.webshopProduct .webshopInfo .headerText {  }
	.webshopProduct .webshopInfo p { font-size: 1.125rem; }
		.webshopProduct .webshopInfo p:last-child { margin: 0; }

.webshopInfo.productDescription { position: relative; border-bottom: none; margin: 0; padding: 0 0 15px 0; }
	.webshopInfo.productDescription.is-collapsed { max-height: 450px; overflow: hidden; border-bottom: none; }
		.webshopInfo.productDescription.is-collapsed::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 96px; background: linear-gradient(to bottom, rgba(246, 244, 241,0), rgba(246, 244, 241,1)); pointer-events: none }
.read-more-btn,
.read-less-btn { color: var(--main); display: block; padding: 0 0 20px 0; border-bottom: 1px dashed #00000016; margin: 0 0 20px 0; padding: 0 0 25px 0; font-size: 1rem; cursor: pointer; }

#cartContainer h2.pageHeader {margin: 0 0 20px 0;}
.cartItems { border-top: 1px dashed #00000016; border-bottom: 1px dashed #00000016; padding: 15px 0; margin: 15px 0 0; }
	.cartItems .cartRow { display: flex; justify-content: space-between; align-items: center; margin: 0 0 20px 0; }
		.cartItems .cartRow:last-child { margin: 0; }
		.cartItems .cartRow .productName { font-size: 1.125rem; }
		.cartItems .cartRow .productPrice { font-size: 1rem; display: flex; justify-content: flex-start; gap: 8px; }
		.cartItems .cartRow .right { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
		.cartItems .cartRow .qtyBtns { background: #fff; display: flex; justify-content: center; align-items: center; padding: 4px; }
			.cartItems .cartRow .qtyBtns span { width: 20px; height: 20px; display: flex; justify-content: center; align-items: center; cursor: pointer; }
			.cartItems .cartRow .qtyBtns span { width: 20px; height: 20px; display: flex; justify-content: center; align-items: center; cursor: pointer; padding: 0 2px; }
				.cartItems .cartRow .qtyBtns span:hover { background: #00000008; }
				.cartItems .cartRow .qtyBtns span:first-child { border-right: 1px solid #00000008; }
		.cartItems .cartRow .productImage { width: 96px; height: 96px; background: #fff; padding: 5px; box-sizing: border-box; }
			.cartItems .cartRow .productImage img { width: 100%; height: 100%; object-fit: cover; }

.cartFooter { margin: 15px 0 0 0 !important; }
	.cartFooter .summaryRow { display: flex; justify-content: space-between; align-items: center; }
		.cartFooter .summaryRow p { font-size: 1rem; }
			.cartFooter .summaryRow p:last-child { }
		.cartFooter .summaryRow.total p { font-size: 1.25rem; }
			.cartFooter .summaryRow.total p:last-child { }

.checkoutField { background: #fff; padding: 32px; margin: 0 0 20px 0; }
#shippingOptions .option { display: flex; justify-content: flex-start; align-items: center; padding: 10px; gap: 10px; background: var(--bg); margin: 0 0 10px 0; }
	#shippingOptions .option label { display: flex; justify-content: space-between; align-items: center; width: 100%; }
	#shippingOptions .option input { margin: 0; }

.checkout h3 { font-size: 1.25rem; }

.input-fields { overflow: hidden; }
	.input-fields .input-field { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 10px 0 5px; margin: 10px 0; }
		.input-fields .input-field .error { font-size: smaller; }
	.input-fields.col-2 .input-field { float: left; width: 50%; }

		.input-fields.col-2 .input-field.full-width { clear: both; float: none; width: 100%; }

	.input-fields .input-field input[type=text],
	.input-fields .input-field select { width: 100%; padding: 12px; margin: 5px 0 0; display: inline-block; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; }
	.input-fields .input-field select { background-image: url('/gfx/arrow-down-16-black.png'); background-size: 12px; background-repeat: no-repeat; background-position: center right 8px; }
	.input-fields .input-field input[type=text].error { background-color: #ffdede; }

	.input-fields .input-field input[type=submit] { width: 100%; background-color: var(--main); color: white; font-weight: 700; padding: 14px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer; text-transform: uppercase; font-size: 18px; }
		.input-fields .input-field input[type=submit]:hover { opacity:0.9; }
.input-field.terms-message p { padding-top: 40px; font-size: 14px; margin: 0; }
.input-field.terms-message p a {text-decoration:underline;}
