/* style guide styles --- YOU CAN IGNORE THESE  */

body {
	background: #252525;
	max-width: 1000px;
	margin: 0 auto;
	color: #fff;
	font-family: 'Lato', sans-serif;
}
element {
	display: block;
	position: relative;
	margin: 20px 0 80px 0;
	padding: 40px;
}
element .style-descriptor {
	position: absolute;
	top: -34px;
	left: 0;
	color: #999 !important;
	font-size: 12px !important;
	line-height: 12px !important;
	letter-spacing: 0 !important;
	font-family: Arial !important;
	opacity: 1 !important;
	text-transform: none !important;
}
section {
	border-bottom: 1px solid #333;
	padding-bottom: 40px;
	margin: 100px 0;
}
section.intro {
	color: #777;
	font-size: 15px;
}
.inputs input {
	min-width: 700px;
}
/* solve styles  */



@font-face {
	font-family: 'geometria_lightlight';
	src: url('../assets/fonts/Geometria-Light-webfont.eot');
	src: url('../assets/fonts/Geometria-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../assets/fonts/Geometria-Light-webfont.woff') format('woff'), url('../assets/fonts/Geometria-Light-webfont.ttf') format('truetype'), url('../assets/fonts/Geometria-Light-webfont.svg#geometria_lightlight') format('svg');
	font-weight: normal;
	font-style: normal;
}
.colors .yellow {
	background: #dab539;
}
.colors .blue {
	background: #39afda;
}
.colors .red {
	background: #de4e6f;
}

.math .equation-lg {
	font-family: 'geometria_lightlight';
	font-size: 68px;
	line-height: 72px;
	letter-spacing: 7px;
	font-weight: normal;
}
.math .equation-sm {
	font-family: 'geometria_lightlight';
	font-size: 18px;
	letter-spacing: 1px;
	font-weight: normal;
	color: #777;
}
.math .equation-sm:hover {
	color: #fff;
	cursor: pointer;
}
.math .equation-sm-selected {
	font-family: 'geometria_lightlight';
	font-size: 18px;
	letter-spacing: 1px;
	font-weight: normal;
	color: #fff;
	background: rgba(255,255,255,.02);
}
.links .button {
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 16px;
	letter-spacing: 5px;
	padding: 30px 60px;
	background: #dab539;
	display: inline-block;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}
.links .button:hover {
	background: #cdaa42;
	cursor: pointer;
}
.links .button:active {
	background: rgba(0,0,0,.1);
	cursor: pointer;
	-moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);
}
.links .nav-sm {
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 3px;
	color: #dab539;
}
.links .nav-sm:hover {
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	color: #fff;
}
.links .nav-lg {
	font-family: 'Lato', sans-serif;
	text-transform: uppercase;
	font-size: 16px;
	letter-spacing: 4px;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	color: #dab539;
}
.links .nav-lg:hover {
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	color: #fff;
}
.headers .h3 {
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	color: #fff;
}
.headers .h4 {
	font-family: 'Lato', sans-serif;
	font-size: 13px;
	color: #fff;
}
.handwriting .hw-lg {
	text-transform: lowercase;
	font-size: 28px;
	color: #fff;
	letter-spacing: 1px;
	font-family: 'Nothing You Could Do', cursive;
}
.handwriting .hw-sm {
	text-transform: lowercase;
	font-size: 20px;
	color: #fff;
	letter-spacing: 1px;
	font-family: 'Nothing You Could Do', cursive;
}
.inputs .editable input {
	padding: 40px 20px;
	font-family: 'geometria_lightlight';
	font-size: 28px;
	letter-spacing: 1px;
	color: #000;
	min-width: 700px;
}
.inputs .not-editable input {
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	padding: 40px 20px;
	color: #999;
}