.tabs {
	position: relative;
}

.tab-nav ul {
	margin: 0 0 0 -1px;
	padding: 0;

	li {
		float: left;
		list-style-type: none;
		padding: 0;
		background: none;
		margin: 0 0 0 1px;

		a {
			display: block;
			text-decoration: none;
			outline: 0;
			padding: 15px 30px;
			background: $gray;
			color: $black;

			&:hover, &:active, &:hover {
				background: lighten($gray, 10%);
				color: $black;
			}

			&.selected {
				background: $black;
				color: $white;
			}
		}
	}
}

.tab-content {
	.tab {
		float: left;
		width: 100%;
		padding: 1.5rem;
		background: $white;
		display: none;

		&.selected {
			position: static !important;
			display: block;
		}
	}
}