body, html, #app{
	width: 100%;
	height: 100%;
	margin: 0;
	font-size: 16px;
}

div, input, span, p, h1, input, textarea, button{
	box-sizing: border-box;
}

a{
	cursor: pointer;
}

.centered{
	width: 100%;
	padding-left: 5%;
	padding-right: 5%;
	padding-top: 10px;
	padding-bottom: 40px;
}

.centered-narrow{
	max-width: 860px;
	margin: auto;
	padding: 10px 10px 40px 10px;
	line-height: 1.8em;
}

div[class*="cols-"] {
	display: inline-block;
	vertical-align: top;
}

.cols-1{
	width: 27%;
}

.cols-2{
	width: 69%;
	margin-right: 3%;
	padding-right: 5%;
}

.full-width{
	width: 100%;
}

.full-height{
	height: 100%;
}

.table{
	display: table;
}

.fixed-table{
	table-layout: fixed;
}

.row{
	display: table-row;
}

.cell{
	display: table-cell;
	vertical-align: middle;
}

.clearfix::after {
	content: "";
	clear: both;
	display: table;
}

a{
	text-decoration: none;
}

.display-none{
	display: none;
}

.disabled{
	opacity: .5;
	pointer-events: none;
}

.faded{
	visibility: hidden;
	opacity: 0;
}

.absolute{
	position: absolute;
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.capitalize-first:first-letter{
	text-transform: uppercase;
}

.cursor-pointer{
	cursor: pointer;
}

.block{
	display: block;
}

.inline-block{
	display: inline-block;
}

.top{
	vertical-align: top;
}

.middle{
	vertical-align: middle;
}

.text-center{
	text-align: center;
}

.text-left{
	text-align: left;
}

.text-right{
	text-align: right;
}

.bold{
	font-weight: bold;
}

.capitalize{
	text-transform: capitalize;
}

.button{
	display: inline-block;
	cursor: pointer;
	padding: 12px 20px;
	border-radius: 3px;
	margin: 0 10px;
	transition: backgorund, border .1s linear;
}

@media only screen and (max-width: 880px) {
	.centered{
		width: 100%;
		padding: 0 10px;
	}
	div[class*="cols-"] {
		width: 100%;
		margin: 0;
		padding-right: 0;
	}
}

@media only screen and (max-width: 560px) {

}