/*** variables ***/

$red-text: #b94a48;
$red-bg: #f2dede;
$red-border: #ebccd1;

$green-text: #468847;
$green-bg: #dff0d8;
$green-border: #d6e9c6;

$yellow-text: #c09853;
$yellow-bg: #fcf8e3;
$yellow-border: #faebcc;

$blue-text: #3a87ad;
$blue-bg: #d9edf7;
$blue-border: #bce8f1;

.wdAlert {
	padding: 15px 15px 10px 15px;
	margin-bottom: 20px;
	border: 1px solid transparent;
	border-radius: 4px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	position: fixed;
	width: 900px;
	top: 20px;
	z-index: 99999;

	a {
		text-decoration: none;
		font-weight: bold;

		&:hover {
			text-decoration: underline;
		}
	}

	&.info {
		color: $blue-text;
		background-color: $blue-bg;
		border-color: $blue-border;

		a {
			color: darken($blue-text, 10%);
		}
	}

	&.success {
		color: $green-text;
		background-color: $green-bg;
		border-color: $green-border;

		a {
			color: darken($green-text, 10%);
		}
	}

	&.warning {
		color: $yellow-text;
		background-color: $yellow-bg;
		border-color: $yellow-border;

		a {
			color: darken($yellow-text, 10%);
		}
	}

	&.error {
		color: $red-text;
		background-color: $red-bg;
		border-color: $red-border;

		a {
			color: darken($red-text, 10%);
		}
	}

	.close {
		position: absolute;
		right: 15px;
		top: 17px;
		width: 10px;
		height: 10px;
		line-height: 10px;
		font-weight: bold;
		font-size: 18px;
		color: #000000;
		opacity: 0.2;
		filter: alpha(opacity=20);
		text-decoration: none;
		cursor: pointer;

		&:hover, &:focus {
			opacity: 0.4;
			filter: alpha(opacity=40);
			text-decoration: none !important;
		}
	}

	.title {
		font-weight: bold;
		margin-bottom: 5px;
	}

	p {
		margin: 0 0 5px 0;
	}

	ul {
		margin: 0 0 5px 0;
		padding: 0;
	}

	li {
		margin: 0 0 0 19px;
		padding: 0;
	}
}