@containerWidth : 1000px;

html, body{
	position         : relative;
	height           : 100%;
	min-height       : 100%;
	background-color : #eee;
	font-family      : 'Lato', sans-serif;
	color            : @copyGrey;
}
.container{
	position      : relative;
	max-width     : @containerWidth;
	margin        : 0 auto;
	padding-right : 20px;
	padding-left  : 20px;
}
h1{
	margin-top    : 10px;
	margin-bottom : 15px;
	font-size     : 2em;
}
h2{
	margin-top    : 10px;
	margin-bottom : 15px;
	font-size     : 1.5em;
	font-weight   : 900;
}
h3{
	margin-top    : 5px;
	margin-bottom : 7px;
	font-size     : 1em;
	font-weight   : 900;
}
p{
	margin-bottom : 1em;
	font-size     : 16px;
	color         : @copyGrey;
	line-height   : 1.5em;
}
code{
	background-color : #F8F8F8;
	font-family      : 'Courier', mono;
	color            : black;
	white-space      : pre;
}
a{
	color : inherit;
}
strong{
	font-weight : bold;
}
button{
	.button();
}
.button(@backgroundColor : @green){
	.animate(background-color);
	display          : inline-block;
	padding          : 0.6em 1.2em;
	cursor           : pointer;
	background-color : @backgroundColor;
	font-family      : "Lato", Helvetica, Arial, sans-serif;
	font-size        : 15px;
	color            : white;
	text-decoration  : none;
	border           : none;
	outline          : none;
	&:hover{
		background-color : darken(@backgroundColor, 5%);
	}
	&:active{
		background-color : darken(@backgroundColor, 10%);
	}
	&:disabled{
		background-color : @silver !important;
	}
}
.iconButton(@backgroundColor : @green){
	padding          : 0.6em;
	cursor           : pointer;
	background-color : @backgroundColor;
	font-size        : 14px;
	color            : white;
	text-align       : center;
}