// studio - elements - modal windows
// ====================

.modal-cover {
	@extend %ui-depth3;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
}

.modal {
	@extend %ui-depth4;
	display: none;
	position: fixed;
	top: 60px;
	left: 50%;
	width: 930px;
	height: 540px;
	margin-left: -465px;
	background: $white;

	.modal-body {
		height: 400px;
		padding: 40px;
		overflow-y: scroll;
	}

	.modal-actions {
		height: 60px;
		@include linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
		background-color: #d1dae3;
	}

	h2 {
		@extend %t-title5;
		@extend %t-light;
		margin: 0 ($baseline/2) ($baseline*1.5);
		color: #646464;
		letter-spacing: 1px;
		text-transform: uppercase;
	}

	p {
		margin: $baseline;
	}

	.revert-button {
		@include blue-button;
		margin: 13px 6px 0 13px;
	}

	.close-button {
		@include white-button;
		margin-top: 13px;
	}
}

// lean modal alternative
#lean_overlay {
	@extend %ui-depth4;
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	height: 100%;
	width: 100%;
	background: $black;
}