/* $white: #fff;
$charcoal: #425266;
$flamingo: #f7bed1;
$moss: #5fbd80;
$raspberry: #c0387d;
$blue: #3a70bb;
$aqua: #4ccdee;
$terracotta: #ce8581;
$peach: #eccaa4;
$mint: #9bd6c3;
$baby_blue: #c6e2f0;
$yellow: #f2e35c; */

.border-raspberry {
	border-top: 2px solid #c0387d !important;
}

.border-charcoal {
	border-top: 2px solid #425266 !important;
}

.border-terracotta {
	border-top: 2px solid #ce8581 !important;
}

.border-mint {
	border-top: 2px solid #9bd6c3 !important;
}

.border-blue {
	border-top: 2px solid #3a70bb !important;
}
.border-moss {
	border-top: 2px solid #5fbd80 !important;
}
.border-aqua {
	border-top: 2px solid #4ccdee !important;
}

.color-raspberry {
	color: #c0387d !important;
}

.color-charcoal {
	color: #425266 !important;
}

.color-terracotta {
	color: #ce8581 !important;
}

.color-mint {
	color: #9bd6c3 !important;
}

.color-blue {
	color: #3a70bb !important;
}
.color-moss {
	color: #5fbd80 !important;
}
.color-aqua {
	color: #4ccdee !important;
}

.color-raspberry svg {
	fill: #c0387d !important;
}

.color-charcoal svg {
	fill: #425266 !important;
}

.color-terracotta svg {
	fill: #ce8581 !important;
}

.color-mint svg {
	fill: #9bd6c3 !important;
}

.color-blue svg {
	fill: #3a70bb !important;
}
.color-moss svg {
	fill: #5fbd80 !important;
}
.color-aqua svg {
	fill: #4ccdee !important;
}

.page-template-order-online .hero header h1 {
    margin-bottom: -60px;
}

.oo-banner {
	padding-top: 75px;
	padding-bottom: 75px;
	background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.primary-btn__list {
	margin-bottom: 15px;
}
.primary-btn__list, .secondary-btn__list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.primary-btn__list li, .secondary-btn__list li{
	padding: 0 20px;
	position: relative;
}

.primary-btn__list .btn:hover, .secondary-btn__list .btn:hover{
	transform: scale(1.05);
	transition: 0.3s;
}

.primary-btn__list .btn--md {
	max-width: 100%;
	width: 420px;
	font-size: 0;
	height: 110px;
	text-align: center;
	position: relative;
	transition: 0.3s;
	padding: 0 20px;
	line-height: 1;
}

.primary-btn__list .btn--md .hover {
	height:0;
	opacity: 0;
/* 	transition: 0.3s; */
	position: absolute;
}
.primary-btn__list .btn--md span {
	position: absolute;
	width: 100%;
	padding: 0 20px;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	line-height: 1;
/* 	right: -1000px;
	transition: 0.3s;
	transition-delay: 0.3s; */
	
}


.primary-btn__list .btn--md:hover span.hover {
	height:auto;
	opacity: 1;
	
	transition: 0.3s;
	transition-delay: 0.3s;
/* 	position: relative; */
}

.primary-btn__list .btn--md:hover span {
/* 	height:0; */
	opacity: 0;
/* 	left: 0; */
	transition: 0.3s;

	
;}

.primary-btn__list .click-here {
	position: absolute;
	top: -35px;
	left: -20px;
 	 width: 145px;
  	z-index: 10;
}

.primary-btn__list  p strong {
	color: #f1e167;
    font-weight: 400;
}

.secondary-btn__list .btn {
	width: 160px;
	text-align: center;
	transition: 0.3s;
	/* transform: scale(1.1); */
}

@media only screen and (max-width: 991px) {
	
	.primary-btn__list li {
		width: 100%;
		text-align: center;
		margin-bottom: 20px;
		padding: 0;
	}
	.primary-btn__list li:last-child {
		margin-bottom: 0px;
	}
	.secondary-btn__list li {
		width: 100%;
		text-align: center;
		margin-bottom: 20px;
	}
	.secondary-btn__list .btn {
		width: 200px;
		max-width: 100%;
		height: 60px;
	}
	
}


/*Footer*/


.footer .partners a {
	width: 80px;
	margin-right: 20px;
}

.footer .partners img {
	width: 70px;
    min-height: 70px;
}

.footer .partners {
	justify-content: flex-end;

}

@media only screen and (min-width: 991px) {
	.footer .partners {
    max-width: 400px;
	}
	.footer .partners {
	justify-content: flex-end;

}
}

@media only screen and (max-width: 450px) {
	.primary-btn__list .click-here {
		width: 100px;
		top: -25px;
		left: -15px;
	}
	.primary-btn__list .btn--md {
		height: 80px;
	}
}



/*order-online*/
.order-online {
	background-position: center;
}
.order-online .container {
	justify-content: center;
}

.order-online__wrap .btn {
	display: flex;
	flex-direction: column;
	margin: 15px 0;
}
.order-online__wrap .btn {
	width: 320px;
	height: 85px;
	max-width: 97%;
	font-size: 0;
}
.order-online__wrap .btn b {
	font-size: 0;
	font-weight: 400;
    color: #f1e167;
		margin-top: 5px;
}




.header__buttons .btn.btn-pink{
	flex-wrap: nowrap;
	display: flex;
	flex-direction: column;
}

.header__buttons .btn.btn-pink b{
	color: #f1e167;
	font-size: 8px;
	font-weight: 400;
}

.header__buttons {
	background-position-y: 0rem;
}

.devider-or {
	text-transform: uppercase;
	margin: 0 45px;
	font-size: 2.5rem;
}

@media only screen and (max-width: 450px) {
	.header__buttons {
		height: 35px;
	}
	.header.is-scrolling .container {
		padding-top: 10px;
		padding-bottom: 45px;
	}
	.header__buttons .btn {
		font-size: 1.5rem;
		white-space: nowrap;
		height: 35px;
	}
	.hero header h1 {
		padding-left: 0;
	}
	.heading--xl, h1 {
		font-size: 3.3rem;
	}
	/* .primary-btn__list .btn--md {
		width: 320px;
		height: 75px;
		font-size: 0;
	} */
	.footer .partners {
		justify-content: center;
	}
	
	.footer .partners img {
		max-width: 100%;
		object-fit: contain;
	}

	.footer .partners a {
		width: 18%;
		margin-right: 15px;
	}
	.primary-btn__list .btn--md {
		font-size: 19px;
	}
	
}




@media only screen and (min-width: 1280px) {
	.header__buttons .btn.btn-pink {
		background-image: url(../img/order-online-button.png);
		width: 140px;
		font-size: 0;
	}
	.header__buttons .btn.btn-pink b{
		font-size: 0;
	}
}

/**/

.oo-banner, .order-online {
	background-image: url(../img/order-online/bg-small.png);
	display: flex;
	flex-direction: column;
	justify-content: center;
}

@media only screen and (min-width: 1200px) {
	.oo-banner, .order-online {
		background-image: url(../img/order-online/bg-large.png);
		min-height: 350px;
	}
}

/* @media only screen and (min-width: 1400px) {
	.oo-banner, .order-online {
		
		min-height: 300px;
	}
}

@media only screen and (min-width: 1500px) {
	.oo-banner, .order-online {
		background-image: url(../img/order-online/bg-732.png);
		min-height: 450px;
	}
}

@media only screen and (min-width: 1620px) {
	.oo-banner, .order-online {
		min-height: 480px;
	}
}

@media only screen and (min-width: 1700px) {
	.oo-banner, .order-online {
		min-height: 480px;
	}
} */