.alert-bar {
	background-color: #384773;
	background-image: radial-gradient(50% 145%,#435790 50%,#384772 100%);
	color: #fff;
	font-family: "PT Serif", serif;
	transform: translateY(-80px);
	transition: transform .3s linear;
	height: 0;
	overflow: hidden;
}

.alert-bar-open .alert-bar {
	transform: translateY(0);
	padding: 15px;
	height: auto;
}

.alert-bar .container {
	max-width: 1100px;
	position: relative;
}

.alert-bar p {
	margin-bottom: 0;
	font-size: 12px;
	padding-right: 35px;
}

.alert-bar .close-alert {
	position: absolute;
	right: -10px;
	top: 50%;
	transform: translateY(-50%);
	display: block;
	padding: 15px;
	color: inherit;
	font-size: 16px;
}

.alert-bar p a {
	color: inherit;
	font-style: italic;
	text-decoration: underline;
	display: inline-block;
}

@media screen and (max-width: 767px) {
	body.alert-bar-open {
		margin-top: 0 !important;
	}
}

@media screen and (min-width: 768px) {
	.alert-bar-open .alert-bar {
		transform: translateY(-100%);
	}
	
	body.alert-bar-open {
		transition: margin .2s linear;
	}
	
	body.alert-bar-closed {
		margin-top: 0 !important;
	}
	
	.alert-bar {
		position: fixed;
		z-index: 9;
		width: 100%;
	}
	
	.alert-bar p {
		font-size: 15px;
	}
}