.grass, .road, .sidewalk, .sidewalk2 {
	transform: rotateX(90deg);
	top: calc(var(--h) * 1px);
	width: calc(var(--h) * 1px + 2px);
	height: calc(var(--h) * 1px + 2px);
}
.grass, .pond {
	background: linear-gradient(45deg, var(--c1) 12%, transparent 0, transparent 88%, var(--c1) 0),
    linear-gradient(135deg, transparent 37%, var(--c2) 0, var(--c2) 63%, transparent 0),
    linear-gradient(45deg, transparent 37%, var(--c1) 0, var(--c1) 63%, transparent 0) var(--c3);
}
.grass {
	border: calc(var(--h) * 0.025px) solid black;
	--c1: #193200;
	--c2: #254c00;
	--c3: #326500;
    background-size: 8px 8px;
	

}

.road {
	pointer-events: none;
	background: transparent;
	border-left: calc(var(--h) * 0.0075px) dashed yellow;
	border-top: calc(var(--h) * 0.0075px) dashed yellow;
}

.sidewalk {
	border-bottom: calc(var(--h) * 0.02px) solid gray;
	border-top: calc(var(--h) * 0.02px) solid gray;
	transform: translateZ(calc(var(--h) * 0.04px)) rotateX(90deg);
	height: calc(var(--h) * 0.92px);
	width: calc(var(--h) * 0.95px);
	left: calc(var(--h) * 0.025px);
	border-image: repeating-linear-gradient(90deg, gray 0%, gray 3%, black 3%, black 3.25%);
}
.sidewalk2 {
	border-left: calc(var(--h) * 0.02px) solid gray;
	border-right: calc(var(--h) * 0.02px) solid gray;
	transform: translateZ(calc(var(--h) * 0.025px)) rotateX(90deg);
	height: calc(var(--h) * 0.95px);
	width: calc(var(--h) * 0.92px);
	left: calc(var(--h) * 0.04px);
	border-image: repeating-linear-gradient(0deg, gray 0%, gray 3%, black 3%, black 3.25%);
}
.sidewalk, .sidewalk2 {
	pointer-events: none;
	background: transparent;
	border-image-slice: calc(var(--h) * 0.1);
}
.wood {
	background: rgb(190,150,100);
}
.brick {
	--bg: silver;
	--c1:#C00;
	--c2:#833;
	--c3:#C33;
	--c4:#800;
}
.stone {
	--bg: black;
	--c1: #C4BCA7;
	--c2: #787366;
	--c3: #9E9886;
	--c4: #6B6450;
}
.brick, .stone {
	background: var(--bg);
	background-size: 40px 20px;
	background-image: linear-gradient(180deg, var(--bg) 0px, var(--bg) 2px, transparent 2px, transparent 10px, var(--bg) 10px, var(--bg) 12px, transparent 12px), linear-gradient(25.35deg, var(--c1) 8.1px, transparent 8.1px), linear-gradient(205.35deg, var(--c1) 8.1px, transparent 8.1px), linear-gradient(25.35deg, var(--c2) 8.1px, transparent 8.1px), linear-gradient(205.35deg, var(--c2) 8.1px, transparent 8.1px), linear-gradient(25.35deg, var(--c3) 8.1px, transparent 8.1px), linear-gradient(205.35deg, var(--c3) 8.1px, transparent 8.1px), linear-gradient(25.35deg, var(--c4) 8.1px, transparent 8.1px), linear-gradient(205.35deg, var(--c4) 8.1px, transparent 8.1px);
	background-position: 0 0, -9px -10.5px, -30px 1.5px, 11px -10.5px, -10px 1.5px, 1px -0.5px, -20px 11.5px, 21px -0.5px, 0px 11.5px;

}
.window, .window-wide {
	background-color: hsl(180,50%,80%);
	background-image: linear-gradient(45deg, transparent, transparent 25%, rgba(255,255,255,.5) 40%, rgba(255,255,255,.5) 60%, transparent 75%);
	background-size: auto 100%;
	display: flex;
	border: 2px solid black;
}
.window-wide > div {
	height: 100%;
	border: 1px solid silver;
	border-left: 2px solid silver;
	border-right: 2px solid silver;
	flex: 1;

}
.window-split {
	display: flex;
	background: transparent;
}
.window-split > div:nth-child(2n-2) {
	background-color: hsl(180,50%,80%);
	background-image: linear-gradient(45deg, transparent, transparent 25%, rgba(255,255,255,.5) 40%, rgba(255,255,255,.5) 60%, transparent 75%);
	background-size: auto 100%;
	flex: 4;
	border: 2px solid black;
}
.window-split > div:nth-child(2n-1) {
	flex: 2;
}
.window-split > div:nth-child(1), .window-split > div:last-child {
	flex: 1;
}
.door {
	background: #843;
	background-image: radial-gradient(circle at 85% 50%, #613, #613 4px, transparent 5px), linear-gradient(90deg, rgb(117, 101, 61) 0px, rgb(117, 101, 61) 20%, transparent 20%, transparent 40%, rgb(117, 101, 61) 40%, rgb(117, 101, 61) 60%, transparent 60%, transparent 80%, rgb(117, 101, 61) 80% ), linear-gradient(0deg, rgb(117, 101, 61) 0px, rgb(117, 101, 61) 10%, transparent 10%, transparent 40%, rgb(117, 101, 61) 40%, rgb(117, 101, 61) 60%, transparent 60%, transparent 90%, rgb(117, 101, 61) 90% );
	background-size: 100% 100%;
	border: 2px solid black;
}
.concrete {
	background: gray;
}
.concrete-color {
	
	background:
	radial-gradient(rgba(0,0,0,.06) 13%, transparent 18%) 0 0,
	radial-gradient(rgba(0,0,0,.12) 13%, transparent 16%) 8px 8px,
	radial-gradient(rgba(255,255,255,.06) 13%, transparent 18%) 4px 4px,
	radial-gradient(rgba(255,255,255,.12) 13%, transparent 16%) 12px 12px;
	background-color: var(--color);
	background-size:16px 16px;
}
.roof {
	background: radial-gradient(circle at 50% 0%, rgba(96, 16, 48, 0) 6px, #613 7px, rgba(96, 16, 48, 0) 8px) 0px 7px,#88878b;
	background-size: 14px 7px;
}
.text {
	
	text-align: center;
	text-shadow: 1px 1px 1px transparent;
	font-weight: bold;
	font-size: var(--fs);
	line-height: var(--fs);
	font-family: sans-serif;
	background: transparent;
	color: var(--fc);
	text-shadow: calc(-2px * var(--tan)) -2px #888, calc(-4px * var(--tan)) -4px #888;
}

.pond {
	--c1: #44B;
	--c2: #66D;
	--c3: #77F;
    background-size: 4px 4px;
	clip-path: path('M73 7c24 1 4 23 14 40 8 14-8 14-20 27S32 91 11 90c-20-1 8-24-2-37s0-29 8-42C28-6 49 7 73 7z');
}
.parking {
	background-color: gray;
	background-image: linear-gradient(180deg, transparent, transparent 28%, gray 28%, gray 72%, transparent 72%), linear-gradient(90deg, transparent, transparent 35px, yellow 35px, yellow 40px);
	background-size: 40px 100%;
}
.fence {
	background-color: #CCC;
	background-image: linear-gradient(90deg, rgb(130, 101, 51) 38%, transparent 38%, transparent 50%, rgb(160, 109, 33) 50%, rgb(160, 109, 33) 88%, transparent);
	background-size: 25px 25px;
}
.plant {
	background: #090;
}
.stump {
	background: #631;
}
.awning {
	background-color: #BBB;
	background-image: linear-gradient(90deg, rgb(125, 101, 51) 38%, transparent 38%, transparent 50%, rgb(150, 109, 33) 50%, rgb(150, 109, 33) 88%, transparent);
	background-size: 25px 25px;
}
.box:nth-child(2n-1) .awning {
	background-color: #888;
	background-image: linear-gradient(90deg, rgb(100, 71, 21) 38%, transparent 38%, transparent 50%, rgb(130, 89, 23) 50%, rgb(130, 89, 23) 88%, transparent);
	
}