*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }


.demo-drawings body {
	background: #fff;
	color: #000;
}

.demo-drawings a {
	text-decoration: none;
	color: rgba(255,255,255,0.7);
	outline: none;
}

.demo-drawings a:hover, a:focus {
	color: #fff;
	outline: none;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
	display: table;
	content: " ";
}

.clearfix:after {
	clear: both;
}



.demo-drawings .codrops-header {
	margin: 0 auto 3em;
}

.demo-drawings .codrops-header {
	background: #F26663;
}

.demo-drawings .related {
	padding: 7em 0;
}

.related a {
	font-weight: 700;
	font-size: 0.9em;
}


.demo-drawings .codrops-demos a {
	border: 2px solid #fff;
	color: #fff;
	background: transparent;
}

.demo-drawings .codrops-demos a:hover,
.demo-drawings .codrops-demos a.current-demo {
	opacity: 0.6;
	background: transparent;
}

.codrops-demos a:hover,
.codrops-demos a.current-demo {
	background: #5ca9d6;
}



@media screen and (max-width: 25em) {

	.demo-drawings .codrops-header {
		font-size: 80%;
	}

	.codrops-top {
		font-size: 120%;
	}

	.codrops-icon span {
		display: none;
	}

}