/*------------------------------------------------*/
/*	Skin: Slate Gray
/*------------------------------------------------*/

$the-slategray: #708090;
$link-color: #708090;

/* general */

a {
	color: $link-color;

	&:hover, &:focus {
		color: darken($link-color, 12%);
	}
}

.top-bar {
	background-color: $the-slategray;

	.top-bar-right {
		.btn-link {
			color: lighten($the-slategray, 40%);

			&:hover {
				color: #fff;
			}
		}
	}

	.notifications {
		.count {
			border-color: $the-slategray;
		}
	}

	.searchbox {
		input[type="search"] {
			background-color: darken($the-slategray, 15%);
			border-color: darken($the-slategray, 15%);
		}

		.btn {
			background-color: lighten($the-slategray, 5%);
			border-color: darken($the-slategray, 15%);

			i {
				color: darken($the-slategray, 15%);
			}

			&:hover {
				border-color: darken($the-slategray, 15%);

				i {
					color: darken($the-slategray, 20%);
				}
			}
		}
	}
	
}

/* widget */
.widget {
	border-color: lighten($the-slategray, 15%);

	.widget-header {
		background-color: $the-slategray;
		border-bottom-color: darken($the-slategray, 5%);
		color: #fff;

		em {
			color: #fff;
		}

		.btn-help {
			color: lighten($the-slategray, 20%);
		}

		.widget-header-toolbar {
			border-left-color: darken($the-slategray, 3%);

			.control-title {
				color: #fff;
			}
		}

		.btn-group > a {
			color: #fff;

			&:hover, &:focus {
				color: #a0b3c6;
			}
		}
	}
}

/* main content */
.main-header {
	h2 {
		color: darken($the-slategray, 8%);
		border-right-color: lighten($the-slategray, 15%);
	}

	em {
		color: lighten($the-slategray, 3%);
	}
}

/* footer */
.footer {
	background-color: $the-slategray;
}