/* 05.11. Buttons */
.btn {
	font-family: $tertiary-font;
	letter-spacing: $tertiary-font-letter-spacing;
	font-size: ptr(12);
	border-radius: $border-radius;
	border-width: 2px;
	transition: $primary-transition;
	text-transform: uppercase;

	.fa {
		font-size: ptr(19);
		vertical-align: middle;
		margin-right: ptr(7);
	}

	/* Rounded corner */
	&-rounded {
		border-radius: ptr(50);
	}

	&-primary {
		text-shadow: 0 1px rgba(0, 0, 0, .1);
	}

	&-secondary {
		&:focus,
		&:hover {
			color: $gray;
			border-color: #bbbbbb;
		}
	}

	&-light {
		background-color: $gray-lighter;
		color: #999999;

		&:focus,
		&:hover {
			color: #999999;
			background-color: darken($gray-lighter, 5);
		}
	}

	&-dark {
		background-color: $gray-dark;
		color: #ffffff;

		&:focus,
		&:hover {
			color: #ffffff;
			background-color: darken($gray-dark, 5);
		}
	}

	.header__navigation-widgets & {
		padding: ptr(10) ptr(14);
	}
}