@font-face {
			font-family: 'Roboto';
			font-style: normal;
			font-weight: 400;
			src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v18/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
			unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
			}

			body, html, header {
				background-color: #1d1d1d;
				font-family: 'Roboto', verdana, sans-serif;
				height: 100%;
				margin: 0;
				padding: 0;
			}

			a, body, html {
				color: #fff;
			}
			
			h1, h2 {
				text-align: center;
			}
			
			.box {
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				justify-content: center;
			}

			.si /* sandbox-item*/{
				box-shadow: 0 2px 3px rgba(0, 0, 0, .8);
				height: 150px;
				margin: 15px;
				width: 300px;
			}

			.sibi /* sandbox-item-background-image */{
				background-image: url("../images/sandbox/lego.png");
				background-size: cover;
				filter: brightness(50%);
				height: 150px;
				position: absolute;
				transition: filter .15s;
				transition: filter .15s, -webkit-filter .15s;
				width: 300px;
				z-index: 1;
			}

			.sibi:hover, .sit:hover+.sibi /* sandbox-item-background-image */ /* sandbox-item-title */{
				filter: brightness(70%);
				transition: filter .2s;
				transition: filter .2s, -webkit-filter .2s;
			}

			.sit /* sandbox-item-title */{
				font-size: 24pt;
				padding: 5px;
				position: absolute;
				text-shadow: 0 0 7px #000;
				text-align: center;
				width: 290px;
				height: 140px;
				backface-visibility: hidden;
				-webkit-backface-visibility: hidden;
				z-index: 2;
			}

			.site {
				margin: auto;
				min-height: 100%;
				position: relative;
				width: 90%;
			}
			
			.search input {
				box-shadow: 0px 1px 5px #111;
				border-radius: 5px;
				border: 0px solid #000;
				color: white;
				padding: 10px 10px 10px 45px;
				font-size: 18px;
				
				-webkit-appearance: none;
				-moz-appearance: none;
				appearance: none;
				background-color: #555;
				background: url('../images/search.png') 10px / 8% no-repeat #555;
				
				
			}
			
			.sort select {
				box-shadow: 0px 1px 5px #111;
				border-radius: 5px;
				border: 0px solid #000;
				color: #ddd;
				margin: 30px;
				padding: 5px 35px 5px 5px;
				font-size: 18px;
				
				-webkit-appearance: none;
				-moz-appearance: none;
				appearance: none;
				background-color: #333;
				background: url('../images/downarrow.svg') 96% / 10px no-repeat #555;;
			}

			header {
				padding: 15px;
			}

			footer {
				height: 60px;
				width: 100%;
			}

			footer article {
				padding-left: 10px;
			}