// lessc -x elements.less > elements.css

.list {
	position: relative;
	margin: 1.5em 0;

	> i {
		position: absolute;
		left: -3px;
		top: 7px;
		font-size: 1.7em;
		line-height: 1;
	}

	> h2, > h3 {
		margin: 0 0 0 50px;
	}

	> p {
		margin: 5px 0 0 50px
	}
}

.quote {
	position: relative;
	margin: 1.5em 0;

	> i {
		position: absolute;
		top: -10px;
		left: -7px;
		font-size: 2em;
		color: rgba(51, 51, 51, 0.44);
	}

	> small {
		margin-left: 50px;
		opacity: 0.7;
		font-size: 1em;
	}

	> p {
		margin-left: 50px;
		font-size: 1.5em;
	}
}

.is-social {
	line-height: 1;
	margin-bottom: 1.5em;

	a > i {
		text-decoration: none;
		color: #333;
		font-size: 1.2em;
		margin: 0 15px 0 0;
		-webkit-transition: all 0.1s ease-in-out;
		transition: all 0.1s ease-in-out;
	}

	a:hover > i {
		color: #08c9b9;
	}
}

.is-rounded-button-big {
	display: inline-block;

	a {
		display: table;
		float: left;
		text-align: center;
		margin: 0 20px;
		border-radius: 50%;
		width: 100px;
		height: 100px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 40px
		}

		&:first-child {
			margin: 0 20px 0 0;
		}

		&:last-child {
			margin: 0 0 0 20px;
		}
	}
}


.is-rounded-button-medium {
	display: inline-block;

	a {
		display: table;
		float: left;
		text-align: center;
		margin: 0 20px;
		border-radius: 50%;
		width: 70px;
		height: 70px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 30px
		}
	}
}

.is-boxed-button-big {
	display: inline-block;

	a {
		display: table;
		float: left;
		text-align: center;
		margin: 0 30px 0 0;
		width: 110px;
		height: 110px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 40px
		}
	}
}

.is-boxed-button-big2 {
	display: inline-block;

	a {
		display: table;
		text-align: center;
		width: 150px;
		height: 70px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 35px
		}
	}
}

.is-boxed-button-medium {
	display: inline-block;

	a {
		display: table;
		float: left;
		text-align: center;
		margin: 0 30px 0 0;
		width: 70px;
		height: 70px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 30px
		}
	}
}

.is-boxed-button-medium2 {
	display: inline-block;

	a {
		display: table;
		float: left;
		text-align: center;
		margin: 0 30px 0 0;
		width: 100px;
		height: 50px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 25px
		}
	}
}

.is-boxed-button-small {
	display: inline-block;

	a {
		display: table;
		float: left;
		text-align: center;
		margin: 0 20px 0 0;
		width: 50px;
		height: 50px;
		background-color: #aaa;

		i {
			display: table-cell;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			color: #ffffff;
			font-size: 20px
		}
	}
}

figure img + figcaption {
	margin-top: 1rem;
}

.size-12 { font-size: .75rem; }
.size-14 { font-size: .875rem; }
.size-16 { font-size: 1rem; }
.size-18 { font-size: 1.125rem; }
.size-21 { font-size: 1.3125rem; }
.size-24 { font-size: 1.5rem; }
.size-32 { font-size: 2rem; }
.size-48 { font-size: 3rem; }
.size-64 { font-size: 4rem; }
.size-80 { font-size: 5rem; }
.size-96 { font-size: 6rem; }