/************************************************************************************
PROMOTION BAR
*************************************************************************************/
.promo-bar-wrap {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 1000;
	height: 0;
	min-height: 0;
	transition: all 0.5s ease-out;
}
.promo-close .promo-bar-wrap {
    display: none;
}
.promo-bar-wrap.open {
	min-height: 67px;
}
.promo-bar-wrap.closed {
	min-height: 0;
}
.promo-bar {
	min-height: 67px;
	text-align: center;
	letter-spacing:-.02em;
	width: 100%;
	background: #ff545a;
	color: #ffcfd0;
	position: absolute;
	transition: all 0.5s ease-out;
}
.promo-bar p {
	font-size: 1.1em;
	padding: 1em 0;
	margin: 0;
}
/* for the promo title */
.promo-bar strong {
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
}
.promo-bar strong a {
	color: #fff;
}
.promo-bar a {
	border-bottom: 1px solid rgba(255,255,255, 0.3);
	text-decoration: none;
	color: #fff;
}
.promo-bar-wrap .close {
	width:30px;
	height:30px;
	position: absolute;
	top: 16px;
	right: 3.5%;
	font-weight: 100;
	cursor: pointer;
	margin: 0;
	padding: 0;
	color: #fff;
	line-height: 1.375em;
	transition: transform .3s linear;
}
.promo-bar-wrap .close:after,
.promo-bar-wrap .close:before {
    content: '';
    height: 100%;
    width: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) rotate(45deg);
    background-color: currentColor;
    transition: transform .25s
}
.promo-bar-wrap .close:after {
    transform: translate(-50%,-50%) rotate(-45deg)
}
.promo-bar-wrap .close:hover:after {
    transform: translate(-50%,-50%) rotate(45deg)
}
.promo-bar-wrap .close:hover:before {
    transform: translate(-50%,-50%) rotate(135deg)
}

/* promo bar */
.mobile-menu-visible .promo-bar-wrap{
	left:-300px
}
body:not(.promo-close).promo-bar-on{
	margin-top:67px
}
.fixed-header-on .promo-bar-wrap{
	top:-67px
}
body:not(.promo-close).promo-bar-on.transparent-header #headerwrap{
	top:67px
}
.promo-bar-on.transparent-header.fixed-header-on #headerwrap{
	top:0 !important
}

/* animate promo_bar */
@-webkit-keyframes animate_promo_bar {
	0% {
		top: -60px;
	}
	50% {
		top: 0;
	}
}
@keyframes animate_promo_bar {
	0% {
		top: -60px;
	}
	50% {
		top: 0;
	}
}

/* animate headerwrap with promo-bar-on */
@-webkit-keyframes animate_headerwrap_promo_bar {
	0% {
		top: -115px;
		opacity: 0;
	}
	50% {
		top: 0;
		opacity: 1;
	}
}
@keyframes animate_headerwrap_promo_bar {
	0% {
		top: -115px;
		opacity: 0;
	}
	50% {
		top: 60px;
		opacity: 1;
	}
}
.promo-bar-on #headerwrap {
	animation: animate_headerwrap_promo_bar .5s;
}

/* if fixed header is on */
.fixed-header-on .promo-bar {
	top: -60px;
}

@media screen and (max-width: 820px) {

	.promo-bar p {
		font-size: .9em;
		line-height: 1.5em;
		text-align: left;
		padding: 10px 35px 10px 10px;
	}
	.promo-bar .close {
		right: 10px;
		top: 20%;
	}

}