@font-face {
	font-family: 'marvin';
	src: url('marvin.woff2') format('woff2'),
		 url('marvin.woff') format('woff'),
		 url('marvin.ttf') format('truetype');
  }

body{
	text-align: center;
}

#select-color{
	border-radius: 10px;
}

label{
	font-family: 'marvin';
	color: white;
	font-size: 24px;
	text-shadow: 0px 0px 10px rgba(0,0,0,0.3);
}

svg {
	fill: #fff;
	width: 100%;
	height: 100vh;
	stroke-linecap : round;
	stroke-linejoin : round;
}

#drawing{
	width: 100%;
	display: in-line block;
}

.palette {
	position: relative;
	top: 10px;
    margin-bottom: -190px;
}

.button {
	min-width: 200px;
	min-height: 50px;
	position: relative;
	color: #fff;
	font-family: 'marvin';
	font-size: 20px;
	text-transform: uppercase;
	padding: 5px 20px;
	cursor: pointer;
	transition: background 300ms;
	border-top: 2px solid #dae4f5;
	border-left: 4px solid #dae4f5;
	border-right: 4px solid #dae4f5;
	border-bottom: 6px solid #a9bae1;
	box-shadow: 0 2px #7385c1;
	border-radius: 30px 20px 25px 20px;
	transform: perspective(1em) rotateX(1deg) rotateY(-1deg);
	background-image: linear-gradient(0deg, #fdc519 10%, #f49a19 90%);
}