/**
 * Tabs
 *
 * Description: Styles for tabs.
 * -----------------------------------------------------------------------------
 */


.tab {
	display: inline-block;
	color: $accent-color;
	background-color: $white;
	padding: em(11px) em(15px) em(7px) em(15px);

	.icon {
		display: inline-block;
		vertical-align: middle;
	}

	&.is-active {
		color: $white;
		background-color: $accent-color;
	}

	&:hover {
		.icon {
			text-decoration: none;
		}
	}
}

.tab-content {
	border-top: em(8px) solid $accent-color;
}