* {
			box-sizing: border-box;
			font-size: 0;
			margin: 0;
			padding: 0;
			border: 0;
			outline: 0;
			text-decoration: none;
		}

		html {
			text-align: center;
			color: #000;
			font-family: "Calibri", sans-serif;
			background-image: url("/img/bg.jpg");
			background-attachment: fixed;
			background-repeat: no-repeat;
			background-size: 100% auto;
			background-color: #d8d7d3;
			line-height: 1.5;
		}

		h1, h2, h3, h4 {
			font-family: "Calibri", sans-serif;
			letter-spacing: 2px;
			margin-bottom: 8px;
			font-weight: normal;
		}

		p { margin-bottom: 32px; }
		p:last-child { margin-bottom: 0; }
		a {
			color: #2db0e6;
			transition: all .2s linear;
		}


		a:hover { opacity: .75; }

		hr {
			margin: 50px auto;
			height: 1px;
			background: #aaa;
		}

		img {
			max-width: 100%;
			max-height: 100%;
		}


		h1 { font-size: 32px; }
		h2 { font-size: 28px; }
		h3 { font-size: 24px; }
		h4 { font-size: 20px; }
		p, a, span, em, strong, li { font-size: 20px; letter-spacing: .5px; }

		ul {
			max-width: 800px;
			text-align: left;
			margin: 10px auto;
		}

		header {
			padding: 10px 0;
		}

		.top-left, .top-right {
			width: calc(50% -  200px);
			display: inline-block;
			height: 110px;
			border-bottom: solid 8px #ff8ad8;
			vertical-align: top;
		}

		.logo {
			display: inline-block;
			width: 400px;
			position: relative;
		}

		.logo img {
			display: inline-block;
			vertical-align: top;
			width: calc(100% - 100px);
		}

		.logo:before, .logo:after {
			content: "";
			height: 25px;
		  width: 25px;
		  background-color: #ff8ad8;
		  border-radius: 50%;
		  position: absolute;
		  top: 93px;
		}

		.logo:before{ left: -5px; }
		.logo:after{ right: -5px; }


		nav {

		}

		nav span {
			cursor: pointer;
			transition: all linear .4s;
			background: url("/img/swoosh.png") center center no-repeat;
			background-size: contain;
			display: inline-block;
			margin: 10px 20px;
			width: 150px;
			color: #333;
			font-weight: bold;
			padding: 20px 0;
		}

		nav li {
			position: relative;
			list-style: none;
			display: inline-block;
		}

		nav li ul {
			visibility: hidden;
			opacity: 0;
			position: absolute;
			transition: all .2s linear;
	    background: #ff8ad8;
	    top: 60px;
	    width: auto;
	    box-shadow: 0 10px 20px #000;
	    left: 50%;
	    transform: translateX(-50%);
	    z-index: 10;
	    min-width: 200px;
	    border-radius: 10px;
		}

		nav li:hover ul {
			visibility: visible;
			opacity: 1;
		}

		nav li ul li {
			display: block;
		}

		nav li ul li a { 
			color: #000; 
			padding: 10px;
			white-space: nowrap;
			cursor: pointer;
			display: block;
		}

		main {
			max-width: 1000px; margin: auto; text-align: center;
		}

		.loader { display: none; height: 200px; margin: auto;}
		.loader:last-child{ display: block; }

		.left, .right {
			display: inline-block;
			vertical-align: top;
			width: 50%;
		}

		.left { padding-right: 10px; }
		.right { padding-left: 10px; }

		.fixed {
			float: left;
			width: 350px;
			max-width: 50%;
			margin: 0 32px 32px 0;
		}

		.fill {
			text-align: left;
		}

		.tile, .shopify-buy__product {
			display: inline-block;
			vertical-align: top;
			padding: 32px;
			width: 25%;
			min-width: 200px;
		}

		.tile img, .shopify-buy__product img { margin-bottom: 16px; }

		.shopify-buy__product h1 { font-size: 24px; }

		footer {
			background: rgba(255, 138, 216, .6);
			color: #fff;
			padding: 20px;
			margin-top: 100px;
		}



		footer .copy { color: #646464; text-align: center; margin: 20px 0 0 10px;}

		footer a { color: #fff; display: block; margin-left: 10px; cursor: pointer; }

		footer h3 { color: #646464; }

		footer .content { max-width: 1200px; margin: auto; }

		.quarter {
			width: calc(33% - 60px);
			display: inline-block;
			padding-right: 20px;
			vertical-align: top;
			text-align: left;
		}

		.quarter.first { width: 180px; }
		.quarter.last { position: relative; }


		.quarter.last:after {
			content: "";
			height: 200px;
		  width: 70px;
		  background: url("/img/brush.png") no-repeat center center;
		  background-size: contain;
		  position: absolute;
		  top: -130px;
		  right: 0;
		
		}

		.framed {
			background: #fddaf0;
			border: solid 4px #ff8ad8; 
			padding: 4px;
			width: 200px;
		}

		/**** Popup ****/
		.overlay {
	    position: fixed;
	    width: 100%;
	    height: 100%;
	    z-index: 1000;
	    background: rgba(100, 100, 100, .5);
	    top: 0;
	    left: 0;
	    display: none;
		}

		.popup {
			max-width: 600px;
			margin: 10% auto 0 auto;
			position: relative;
			max-height: 80%;
			padding: 60px 20px 20px 20px;
			background: #fff;
			border-radius: 20px;
		}

		.popup h2 {
			position: absolute;
			left: 0;
			right: 0;
			width: calc(100% - 100px);
			top: 10px;
			margin: auto;
		}

		.popup .close {
			line-height: 0;
	    position: absolute;
	    top: 20px;
	    right: 20px;
	    cursor: pointer;
	    transition: all .1s linear;
	    color: #000;
	    font-size: 50px;
		}

		.popup .close:hover { opacity: .75; }

		.popup .panel {
			padding: 10px;
			text-align: left;
			border-top: solid 1px #646464;
		}

		[data-name] {
			display: none;
		}

		button { 
				font-size: 20px;
				border-radius: 4px;
				padding: 8px 16px;
				background: #78b657;
				border: none;
				transition: all .2s linear;
				cursor: pointer;
				color: #fff;
				width: 100%;
				margin-top: 10px;
			}

			.shopify-buy__collection > button {display: none;}

			button:hover { background: #5f9d3e; }
			#collection-component-1623858359495 .loader { display: none; height: 200px; margin: auto;}
			#collection-component-1623858359495 .loader:last-child{ display: block; }

		@media screen and (max-width: 600px) {
			h1 { font-size: 28px; }
			h2 { font-size: 24px; }
			h3 { font-size: 20px; }
			h4 { font-size: 16px; }
			p, a, span, em, strong, li { font-size: 16px; }

			footer p, footer a {
				font-size: 12px;
			}

			.tile, .shopify-buy__product {
				min-width: 300px;
			}


			.markers span { margin-right: 8px; }

			.fixed, .fill {
				float: none;
				width: 100%;
				margin: 16px 0;
				max-width: none;
				text-align: center;
			}

			.price li span:first-child { width: 270px; font-size: 14px;}

		}