body {
	text-align: center;
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

body a.circle {
	text-decoration: none;
}

body .front {
	text-align: center;
	margin: 0 auto;
	width: 500px;
}

body h1.special {
	color: #000;
	margin-top: 10px;
	margin-bottom: 30px;
	font: italic normal normal 26px/34px Georgia;
}

body h1 {
	color: #000;
	margin-top: 18px;
	margin-bottom: 28px;
	font: normal bold normal 24px/34px Georgia;
}

body h2 {
	color: #656565;
	margin-top: 0px;
	margin-bottom: -10px;
	font: italic normal normal 24px/34px Georgia;
}

body .main-circle {
	text-align: center;
	width: 350px;
	height: 350px;
	background: #000;
	border-radius: 500px;
	border: 8px solid #fff;
	box-shadow: 0px 0px 0px 3px #bababa;
	margin: 40px auto 25px auto;
	display: inline-block;
}

body .main-circle .h2-wrapper {
	display: inline-block;
	width: 150px;
	height: 1px;
	background: #fff;
	margin-top: 70px;
	text-align: center;
}

body .main-circle .h2-wrapper h2 {
	font: italic normal normal 20px Georgia;
	display: inline-block;
	background: #000;
	color: #fff;
	padding: 0 12px;
	margin-top: -20px;
	vertical-align: 6px;
	height: 30px;
}

body .main-circle h1 {
	color: #fff;
	margin-top: 20px;
	font: italic normal normal 65px Georgia;
}

body .main-circle h3 {
	color: #fff;
	margin-top: -10px;
	font: bold small-caps normal 17px "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body .readme {
	font: italic normal normal 16px/24px Georgia;
}

body .readme p {
	color: #656565;
}

body .readme em {
	font-size: 22px;
	line-height: 30px;
	color: #000;
}

body .begin {
	display: inline-block;
	width: 100px;
	height: 65px;
	border-radius: 200px;
	border: 3px solid #000;
	padding-top: 35px;
	color: #000;
	font: italic normal normal 24px Georgia;
	text-decoration: none;
	margin: 25px 0 45px 0;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .begin:hover {
	color: #fff;
	background: #000;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .havecode {
	font: italic normal normal 16px/25px Georgia;
}

body .havecode input[type=text] {
	font: italic normal normal 20px/20px Georgia;
	border: 0;
	border-bottom: 1px solid #000;
	padding: 10px 0 2px 0;
	text-align: center;
	outline: none;
}

body .havecode input[type=submit] {
	background: #fff;
	display: inline-block;
	width: 65px;
	height: 65px;
	border-radius: 100px;
	border: 2px solid #000;
	padding-top: 5px;
	color: #000;
	font: italic normal normal 18px Georgia;
	text-decoration: none;
	margin: 20px 0 45px 0;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .havecode input[type=submit]:hover {
	cursor: pointer;
	color: #fff;
	background: #000;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .secondary-circle {
	text-align: center;
	width: 200px;
	height: 200px;
	background: #000;
	border-radius: 250px;
	border: 8px solid #fff;
	box-shadow: 0px 0px 0px 3px #bababa;
	margin: 60px auto 35px auto;
	display: inline-block;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .secondary-circle:hover {
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	box-shadow: 0px 0px 0px 4px #000;
}

body .secondary-circle .h2-wrapper {
	display: inline-block;
	width: 100px;
	height: 1px;
	background: #fff;
	margin-top: 45px;
	text-align: center;
}

body .secondary-circle .h2-wrapper h2 {
	font: italic normal normal 14px Georgia;
	display: inline-block;
	background: #000;
	color: #fff;
	padding: 0 12px;
	margin-top: -20px;
	vertical-align: 8px;
	height: 30px;
}

body .secondary-circle h1 {
	color: #fff;
	margin-top: 15px;
	font: italic normal normal 38px/48px Georgia;
}

body .h4-wrapper {
	display: inline-block;
	width: 480px;
	height: 1px;
	background: #000;
	margin-top: 20px;
	margin-bottom: 40px;
	text-align: center;
}

body .h4-wrapper h4 {
	font: italic normal normal 20px Georgia;
	display: inline-block;
	background: #fff;
	color: #000;
	padding: 0 12px;
	margin-top: -20px;
	vertical-align: 7px;
	height: 30px;
}

body #save {
	background: #fff;
	display: inline-block;
	width: 75px;
	height: 75px;
	border-radius: 100px;
	border: 2px solid #000;
	padding-top: 2px;
	color: #000;
	font: italic normal normal 18px Georgia;
	text-decoration: none;
	margin: 20px auto 45px auto;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	text-align: center;
}

body #save:hover {
	cursor: pointer;
	color: #fff;
	background: #000;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .finished-drawing {
	display: block;
	margin-bottom: 100px;
}

body .image-wrapper {
	height: 50px;
	width: 500px;
	overflow: hidden;
	margin: 0 auto -20px auto;
	border-left: 1px #676767 solid;
	border-right: 1px #676767 solid;
	border-top: 1px #676767 solid;
	border-radius: 6px 6px 0 0;
}

body .image-wrapper img {
	margin-top: -150px;
}

body .image-wrapper.full {
	height: 200px;
	border-bottom: 1px #b8b8b8 dashed;
	margin-top: 20px;
	border-top: none;
	border-radius: 0;
}

body .image-wrapper.full:first-child {
	border-radius: 6px 6px 0 0;
	border-top: 1px #676767 solid;
}

body .image-wrapper.full:last-child {
	border-radius: 0 0 6px 6px;
	border-bottom: 1px #676767 solid;
}

body .image-wrapper.full:only-child {
	border-radius: 6px;
}

body .image-wrapper.full img {
	margin-top: 0;
}

body #canvas_wrapper {
	border-bottom: 1px #676767 solid;
	border-left: 1px #676767 solid;
	border-right: 1px #676767 solid;
	border-top: 1px #b8b8b8 dashed;
	border-radius: 0 0 6px 6px;
	width: 500px;
	height: 200px;
	margin: 0 auto;
}

body #canvas_wrapper.single {
	border: 1px #676767 solid;
	border-radius: 6px;
}

body .done h1 {
	margin-top: 10px;
	font: italic normal normal 24px/25px Georgia;
	color: #676767;
}

body .done h2 {
	width: 500px;
	text-align: center;
	margin: 30px auto 0 auto;
	font: italic normal normal 26px/35px Georgia;
	color: #000;
}

body .done h2 a {
	color: #0975ee;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .done h2 a:hover {
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	color: #005dc6;
}

body .done h3 {
	width: 500px;
	text-align: center;
	margin: 50px auto 0 auto;
	font: italic normal normal 18px/26px Georgia;
}

body .done h3 a {
	color: #0975ee;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

body .done h3 a:hover {
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	color: #005dc6;
}

body .done input {
	margin-top: 20px;
	margin-bottom: 30px;
	font: italic normal normal 18px/25px Georgia;
	text-align: center;
	border: 0;
	width: 400px;
}

body a.share {
	font: 15px "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #000;
	font-size: 14px;
	vertical-align: 2px;
	margin-left: 20px;
}

body a.share:hover {
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	color: #444;
}

body #credit {
	margin-top: -70px;
	margin-bottom: 50px;
	display: inline-block;
	font: bold normal small-caps 20px Helvetica;
	text-shadow: #000 0 0 2px;
	color: rgba(0,0,0,0);
	opacity: 0.43;
}

body #credit .madeby {
	opacity: 0.56;
}
