@font-face {
  font-family: 'Mountains of Christmas';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./fonts/3y9w6a4zcCnn5X0FDyrKi2ZRUBIy8uxoUo7eDNGsMdFqNpY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Mountains of Christmas';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./fonts/3y9z6a4zcCnn5X0FDyrKi2ZRUBIy8uxoUo7eBGqJJPxIO7yLeEE.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(./fonts/pxiGyp8kv8JHgFVrJJLucHtAOvWDSA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./fonts/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./fonts/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./fonts/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./fonts/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
:focus { outline: 0; }
body { line-height: 1; color: black; background: white; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
div, nav, header, footer, aside, section { display: block; }

body {
	background: #A22222;
	color: #000000;
	font-family: 'Poppins';
	font-size: 16px;
	line-height: 1.5em;
}
	a {
		color: #A22222;
	}
	.button {
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		cursor: pointer;
		border: none;
		border-radius: 10px;
		height: 44px;
		line-height: 44px;
		font-size: 14px;
		font-family: 'Poppins';
		font-weight: normal;
		color: #FFF;
		background: #EE3434;
		position: relative;
		transition: .3s;
		text-align: center;
		padding: 0 22px;
		text-decoration: none;
		display: flex;
		justify-content: center;
	}
	.button:hover,
	.button:focus {
		background: #A22222;
	}

.page-wrapper {
	margin: 0 20px;
}

header {
	border-bottom: 1px solid #FFF;
	padding: 10px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
	header .site-title {
		padding: 6px 0;
		display: block;
		font-family: 'Mountains of Christmas';
		font-size: 20px;
	}
	header .toggle-nav {
		padding: 6px 0;
		display: block;
		margin-left: auto;
	}
	header nav {
		padding: 12px 0 0 0;
		display: none;
		flex: 0 0 100%;
	}
	header nav ul li a {
		display: block;
		padding: 6px 0;
		border-top: 1px solid rgba(255, 255, 255, 0.4);
	}
	header a {
		font-size: 15px;
		line-height: 26px;
		color: #FFF;
		text-decoration: none;
	}
	.nav-active header nav { display: block; }

.home-banner,
.page-banner {
	color: #FFF;
	padding: 20px 0 0 0;
	position: relative;
}
	.home-banner h1,
	.page-banner h1 {
		font-size: 36px;
		line-height: 48px;
		font-family: 'Mountains of Christmas';
		margin: 0 0 10px 0;
	}
	.home-banner h2,
	.page-banner h2 {
		font-size: 18px;
		line-height: 22px;
		margin: 0 40px 6px 0;
		font-weight: bold;
	}
	.home-banner h3,
	.page-banner h3 {
		font-size: 16px;
		line-height: 22px;
		margin: 0 0 10px 0;
	}
	.home-banner p,
	.page-banner p {
		font-size: 13px;
		line-height: 18px;
		margin: 0 0 8px 0;
	}
	.home-banner a,
	.page-banner a {
		color: #FFF;
		text-decoration: underline;
	}

.page-header {
	color: #FFF;
	padding: 20px 0 48px 0;
	position: relative;
}
	.page-header h1 {
		font-size: 36px;
		line-height: 48px;
		font-family: 'Mountains of Christmas';
		margin: 0 0 10px 0;
	}
	.page-header p {
		font-size: 16px;
		line-height: 22px;
		margin: 0 0 10px 0;
	}

.products-intro {
	position: relative;
	z-index: 1;
	padding: 20px 0 0 0;
}
	.products-intro h2 {
		color: #FFF;
		font-size: 16px;
		line-height: 22px;
		margin: 0 0 20px 0;
		font-weight: bold;
	}
	.products-intro:before {
		background: url(./images/mobile-prices.svg) no-repeat;
		content: '';
		width: 141px;
		height: 113px;
		position: absolute;
		top: -21px;
		right: -20px;
	}

.products-list {
	display: grid;
	row-gap: 20px;
}

.product-card {
	background: #FFFFFF;
	box-shadow: 0 20px 40px 0 rgba(0,0,0,0.20);
	border-radius: 4px;
	padding: 24px 20px 20px 20px;
	position: relative;
	overflow: hidden;
}
	.product-card img {
		position: absolute;
		bottom: 80px;
		right: 20px;
		display: block;
		height: 130px;
		border: 1px solid #CCC;
	}
	.product-card h2 {
		font-size: 22px;
		line-height: 30px;
		margin: 0 0 6px 0;
	}
	.product-card p {
		font-size: 13px;
		line-height: 18px;
		margin: 0 110px 16px 0;
	}
	.product-card .product-card-meta {
		display: flex;
		flex-direction: column;
		row-gap: 2px;
		margin: 0 0 16px 0;
	}
		.product-card .product-card-meta span {
			line-height: 18px;
			font-size: 12px;
		}
	.product-card .buttons {
		display: flex;
		column-gap: 8px;
	}
	.product-card .buttons .button{
		width: 100%;
	}
	.product-card .buttons form {
		flex-shrink: 0;
	}
    .quantity-selector {
        margin: 20px 0;
    }
    .quantity-selector label {
        display: block;
        margin-bottom: 5px;
        color: #666;
    }
    .quantity-selector input {
        width: 80px;
        padding: 8px;
        font-size: 16px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
    .message {
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		border: none;
		border-radius: 10px;
		height: 44px;
		line-height: 14px;
		font-size: 14px;
		font-family: 'Poppins';
		color: #000;
		background: #CCC;
		position: relative;
		transition: .3s;
		text-align: center;
		padding: 0 22px;
		text-decoration: none;
        display: none;
        display: none;
    }
    .message.success {
        background: #d4edda;
        color: #155724;
        border: 1px solid #c3e6cb;
    }
    .message.error {
        background: #f8d7da;
        color: #721c24;
        border: 1px solid #f5c6cb;
    }
    .message.show {
        display: flex;
        align-content: center;
        align-items: center;
        flex-direction: column;
        justify-content: center;
    }
    .message a { text-decoration: underline; margin: 0px; }
    .added-to-basket .button { display: none; }
    .view-cart-link {
        display: inline-block;
        margin-top: 10px;
        color: #2c7a3d;
        text-decoration: none;
    }
    .view-cart-link:hover {
        text-decoration: underline;
    }
    @media all and (max-width: 480px) and (min-width: 0px) {
    	.message {
    		width: 100px;
    		font-size: 12px;
    	}
    	.message a { font-size: 14px; }
    }

.terms {
	padding: 60px 0;
	color: #FFF;
}
	.terms h4 {
		font-size: 16px;
		margin: 0 0 4px 0;
		font-weight: bold;
	}
	.terms p {
		font-size: 14px;
		line-height: 20px;
	}

.other-sheets {
	margin: 60px 0 0 0;
	color: #FFF;
	background: #FFFFFF;
	box-shadow: 0 20px 40px 0 rgba(0,0,0,0.20);
	border-radius: 4px;
	padding: 24px 20px 20px 20px;
	position: relative;
	overflow: hidden;
}
	.other-sheets h2 {
		font-size: 20px;
		line-height: 28px;
		margin: 0 0 7px 0;
		font-weight: 500;
		text-align: center;
		color: #222;
	}
	.other-sheets .buttons {
		display: flex;
		flex-direction: column;
		row-gap: 6px;
		text-align: center;
	}

	@media all and (min-width: 800px) {
		.other-sheets .buttons {
			display: flex;
			flex-direction: row;
			column-gap: 8px;
			row-gap: 6px;
			align-items: center;
			justify-content: center;
		}
	}

.page-content {
	background: #FFFFFF;
	box-shadow: 0 20px 40px 0 rgba(0,0,0,0.20);
	border-radius: 4px;
	padding: 24px 20px;
	position: relative;
}

footer {
	padding: 48px 0 48px 0;
	text-align: center;
}
	footer img {
		width: 60px;
		height: auto;
	}
	footer p {
		font-size: 12px;
		line-height: 18px;
		color: #FFF;
		padding: 10px 0 0 0;
	}
		footer p a {
			color: #FFF;
			text-decoration: underline;
		}
		footer p.footer-links {
			padding: 6px 0 0 0;
			font-size: 12px;
		}
		footer p.footer-links a { margin: 0 16px 0 0; }

.modal-back {
	background: #2D1B4F;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 10;
	opacity: 0.8;
	display: none;
}
.modal-window {
	background: #FFF;
	box-shadow: 0 20px 40px 0 rgba(0,0,0,0.50);
	border-radius: 10px;
	width: auto;
	padding: 6px 0;
	position: fixed;
	z-index: 11;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	color: #000;
	display: none;
	font-family: 'Underdog';
	margin-top: 20px;
}
.modal-active .modal-back,
.modal-active .modal-window {
	display: block;
}
	.modal-window .button {
		box-shadow: 0 10px 20px 0 rgba(0,0,0,0.20);
	}
	.modal-window-close {
		line-height: 44px;
		position: absolute;
		top: -54px;
		right: 0px;
		padding: 0px;
		width: 44px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23FFFFFF" class="bi bi-x" viewBox="0 0 16 16"><path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708"/></svg>')!important;
		background-position: center center!important;
		background-repeat: no-repeat!important;
		background-size: 32px 32px!important;
	}
	.modal-window h2 {
		font-size: 24px;
		line-height: 30px;
		margin: 0 30px 20px 0;
	}
	.modal-window p {
		font-size: 18px;
		line-height: 24px;
		margin: 0 20px 20px 0;
	}
	.modal-content { display: none; }
	.modal-content-visible { display: block; }
	.modal-content img {
		max-height: calc(100vh - 64px);
		max-width: calc(100vw - 20px);
	}

@media all and (max-width: 376px) and (min-width: 0px) {
	.home-banner:before {
		background: url(./images/mobile-baubles.svg) no-repeat;
		width: 93px;
		height: 82px;
		content: '';
		display: block;
		position: absolute;
		top: 72px;
		right: -20px;
	}
}

@media all and (min-width: 1024px) {
	.button {
		font-size: 18px;
	}
	.page-wrapper {
		margin: 0 auto;
		max-width: 760px;
		position: relative;
	}
	.page-wrapper:before {
		background: url(./images/desktop-baubles.svg) no-repeat;
		position: absolute;
		top: 0px;
		right: -60px;
		width: 212px;
		height: 418px;
		display: block;
		content: '';
		z-index: 1;
	}
	body.theme-work-christmas-party .page-wrapper:before {
		background-image: url(./images/desktop-baubles-shop.svg);
		height: 212px;
	}
	header {
		max-width: 600px;
		padding: 16px 0 10px 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.4);
	}
	header .site-title  { display: none; }
	header .toggle-nav { display: none; }
	header nav {
		display: block;
		padding: 0px;
	}
		header nav ul {
			display: flex;
			column-gap: 30px;
		}
			header nav ul li a {
				border: none;
			}
			header nav ul li a:hover {
				text-decoration: underline;
			}
	.home-banner,
	.page-banner {
		padding: 24px 0 0 0;
		max-width: 600px;
	}
		.home-banner:before,
		.page-banner:before { display: none; }
		.home-banner h1,
		.page-banner h1 {
			font-weight: bold;
			font-size: 64px;
			line-height: 72px;
		}
		.home-banner h2,
		.page-banner h2 {
			font-size: 24px;
			line-height: 29px;
			margin: 0 0 2px 0;
		}
		.home-banner h3,
		.page-banner h3 {
			font-size: 24px;
			line-height: 29px;
			margin: 0 0 16px 0;
		}
		.home-banner p,
		.page-banner p {
			font-size: 18px;
			line-height: 25px;
			margin: 0 0 10px 0;
		}
	.page-header {
		padding: 64px 0;
	}
		.page-header h1 {
			font-weight: bold;
			font-size: 64px;
			line-height: 72px;
		}
		.page-header p {
			font-size: 24px;
			line-height: 29px;
		}
	.products-list {
		row-gap: 20px;
		padding: 40px 0 0 0;
	}
		.product-card {
			display: flex;
			column-gap: 32px;
			border-radius: 10px;
			padding: 20px 32px 0 32px;
		}
			.product-card .product-card-meta {
				display: flex;
				flex-direction: row;
				column-gap: 8px;
				row-gap: 0px;
				margin: 0 0 16px 0;
			}
				.product-card .product-card-meta span {
					padding: 0 6px;
					line-height: 28px;
					border-radius: 1px;
					background: #EEE;
				}
			.product-card img {
				position: relative;
				bottom: auto;
				right: auto;
				height: auto;
				width: 190px;
				margin: auto 0 -20px 0;
			}
			.product-card h2 {
				font-size: 28px;
				line-height: 36px;
				padding: 6px 0 0 0;
			}
			.product-card p {
				font-size: 16px;
				line-height: 24px;
				margin: 0 0 16px 0;
			}
			.product-card .buttons {
				padding: 0 0 24px 0;
			}
			.product-card .buttons .button { width: auto; }
	.message.show {
        flex-direction: row;
        column-gap: 8px;
    }
	.products-intro {
		display: none;
	}
	.other-sheets {
		border-radius: 10px;
		padding: 20px 32px 20px 32px;
	}
	.page-content {
		border-radius: 10px;
		padding: 24px 32px 24px 32px;
	}
	footer {
		display: flex;
		column-gap: 20px;
		text-align: left;
	}
		footer img {
			width: 60px;
		}
		footer p {
			font-size: 14px;
			line-height: 18px;
			padding: 8px 0 0 0;
		}
	.modal-content img {
		max-height: calc(100vh - 124px);
	}
}

@media all and (max-width: 374px) and (min-width: 0px) {
	.home-banner:before { display: none; }
	.products-intro h2 {
		font-size: 15px;
	}
	.product-card .buttons {
		column-gap: 0px;
		flex-direction: column;
		row-gap: 8px;
		width: calc(100% - 130px);
	}
	.product-card .buttons .button {
		flex-shrink: 0;
	}
	.product-card .buttons form {
		width: 100%;
	}
	.product-card p {
		margin: 0 0 16px 0;
	}
	.product-card img {
		bottom: -30px;
		right: -40px;
	}
}