﻿html {font-size: 10px;}
body {margin: 0; padding: 0; font-family: "Open Sans", Arial, sans-serif; font-size: 1.6rem; color: #2e2d2d; line-height: 1.2em; overflow-x: hidden; max-width: 100%;}

img {border: none;}

a {
    color: #ffffff;
}

a,
a::before,
a::after {transition: opacity ease 0.25s, color ease 0.25s, background-color ease 0.25s, border-color ease 0.25s; text-decoration: none;}

.container {position: relative;}

.home-icon.container {z-index: 1001;}
.home-icon.container .home-icon {position: absolute; top: 0; left: 0;}
.home-icon.container .home-icon a {display: block; border: 2px solid #252525; border-top: none; background: #000000; color: #ffffff; width: 66px; font-family: "Fenix", serif; font-size: 1.8rem; padding: 13.2px 24px; overflow: hidden; white-space: nowrap; text-indent: 450%; height: 48px;}
.home-icon.container .home-icon a::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: url(../images/icon_home.png) no-repeat center center;
}
.home-icon.container .home-icon a:hover {background: #252525;}

.container.bg-repeat .column .button,
.content.container .content .button {display: inline-block;}

.container.bg-repeat .column .button a,
.content.container .content .button a,
.content.container .content a.button {display: inline-block; text-transform: uppercase; border: 1px solid; font-family: "Fenix", serif; font-size: 1.6rem; line-height: 1.2em; padding: 8.9px 29px; text-decoration: none;}

.container.bg-repeat .column .button a:hover,
.content.container .content .button a:hover,
.content.container .content a.button:hover{
	border-color: #2e2d2d;
	color: #2e2d2d;
}

.content.container .content *:first-child {margin-top: 0;}

.container.footer {background: #000000; color: #909090; padding: 28px 0;}
.container.footer a {color: #ffffff;}
.container.footer a:hover {color: #909090;}
.footer-left {font-family: "Open Sans", Arial, sans-serif; font-size: 1.3rem;}
.footer-left p {margin: 0 0 6px 0;}
.footer-left table {width: 100%;}
.footer-left td {vertical-align: top; width: 50%;}

.footer-center {font-family: "Open Sans", Arial, sans-serif; font-size: 1.8rem;}
.footer-center p {margin: 0 0 6px 0;}
.footer-center p:first-child {margin: 0 0 16px 0;}
.footer-center .contact {color:#ffffff; font-size:1.3rem;}
.footer-center .copyright {color:#555454; font-size:1.1rem;}

.container.footer .footer .footer-right {padding: 0 1% 0 4%;}
.container.footer .footer .footer-right {font-family: "Fenix", serif; font-size: 1.3rem;}
.container.footer .footer .footer-right p {margin: 0 0 6px 0;}

.map .labels {color: #2e2d2d;}

.map.container .get-directions {position: absolute; right: 8%; top: 24px; display: inline-block; text-transform: uppercase; color: #000000; border: 2px solid #000000; z-index: 1000; padding: 8px 19px;}
.map.container .get-directions:hover {color: #ff1515; border-color: #ff1515;}

.social-media .icon {white-space: nowrap; text-indent: 150%; overflow: hidden; display: inline-block; position: relative; margin-right: 17px; }
.social-media .icon::before {position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: "";}
.social-media .icon:hover::before {opacity: 0;}
.social-media .icon::after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; content: "";}
.social-media .icon:hover::after {opacity: 1;}
.social-media .instagram { width: 18px; height: 18px;}
.social-media .instagram::before { background: url(../images/icon_instagram.png) no-repeat top left;}
.social-media .instagram::after {background: url(../images/icon_instagram_hover.png) no-repeat top left;}
.social-media .facebook { width: 9px; height: 18px;}
.social-media .facebook::before {background: url(../images/icon_facebook.png) no-repeat top left;}
.social-media .facebook::after {background: url(../images/icon_facebook_hover.png) no-repeat top left;}
.social-media .twitter { width: 20px; height: 17px;}
.social-media .twitter::before { background: url(../images/icon_twitter.png) no-repeat top left;}
.social-media .twitter::after {background: url(../images/icon_twitter_hover.png) no-repeat top left;}

.footer .social-media .icon {
    margin: 0 5px;
}

.footer .social-media{
    margin-top: 20px;
    margin-bottom: 30px;
}

.footer a.social-media:hover .icon::before,
.footer a.social-media:hover .icon::after{
    transition: opacity ease 0.25s;
}

.footer a.social-media:hover .icon::before {
    opacity: 0;
}

.footer a.social-media:hover .icon::after {
    opacity: 1;
}

.footer-right{
    text-align: right;
}

.footer-right .as-seen,
.footer-right .certificate{
    display: inline-block;
}

.footer-right .as-seen,
.footer-right > .TA_certificateOfExcellence {
    font-family: 'Open Sans', Arial, sans-serif;
    margin-right: 5px;
    text-transform: uppercase;
    text-align: center;
}

.footer-right .as-seen img{
    margin-left: 10px;
}

.footer-right > .TA_certificateOfExcellence {/*width: 40%;*/ display: inline-block; max-width: 80px; /*float: left;*/}

.footer-right > .TA_certificateOfExcellence.margin {
    margin-right: 5px; 
}

.TA_certificateOfExcellence ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.other-links{
	border: 2px solid #252525;
	border-top: none;
	position: absolute;
	top: 0;
	left: 67px;
	height: 48px;
	padding: 10px 15px;
	background: rgba(0, 0, 0, 0.7);
}

.other-links a{
	color: #ffffff;
	font-size: 14px;
	text-transform: uppercase;
	position: relative;
	top: 3px;
}

.other-links a:not(:last-child){
	margin-right: 5px;
	padding-right: 11px;
}

.other-links a:not(:last-child):before,
.other-links a:not(:last-child)::before{
	background: #ffffff;
	content: "";
	display: block;
	position: absolute;
	top: 53%;
	right: 0;
	height: 14px;
	width: 1px;
	transform: translateY(-50%);
}

.bg-repeat a{
	color: #6f6f6f;
	text-decoration: underline;
}

.body h1{
	line-height: 1.3em;
}

.order-online-block .button{
	color: #f6cc4b;
	display: inline-block;
	text-transform: uppercase;
	font-size: 1.2rem;
	line-height: 1em;
	border: 1px solid #f6cc4b;
	padding: 8.8px 13px;
}

.notification-button{
	background: #f6cc4b;
	position: fixed;
	color: #ffffff;
	padding: 12px 20px;
	cursor: pointer;
	top: 50%;
	left: -100px;
	min-width: 200px;
	text-align: center;
	transform: rotate(90deg) translateY(-50%);
	transition: background 0.25s ease;
}

.notification-button:hover{
	background: #0c8040;
}

.notification-button .tablet-up{
	display: none;
}

.mfp-content{
	background-color: #f6ee55;
	border: 1px solid #ffffff;
	font-family: 'Fenix', serif;
	font-size: 18px;
	line-height: 1.4em;
	margin: 0 auto;
	max-width: 800px;
	text-align: center;
}

.popup-notification{
	padding: 50px;
	position: relative;
	text-align: center;
}

.popup-notification:before,
.popup-notification::before{
	border: 5px solid #ffffff;
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 40px);
	height: calc(100% - 40px);
	z-index: -1;
}

.popup-notification .popup-bottom{
	padding: 30px 0 0 0;
}

/*.popup-notification .popup-top{
	display: block;
	height: 0;
	overflow: hidden;
	padding-top: calc((320 / 684) * 100%);
	position: relative;
}*/

.popup-notification .popup-top img{
	max-height: 25vh;
	object-fit: contain;
	width: 100%;
}

.popup-notification .popup-top h3{
	color: #736f27;
	font: bold 22px "Open Sans", Arial, sans-serif;
	margin: 20px 0 0 0;
	/*position: absolute;
	bottom: 0;
	width: 100%;*/
	text-transform: uppercase;
	text-align: center;
}

.popup-notification .popup-top .number{
	color: #d99c3b;
	display: inline-block;
	font: bold 50px/1em "Open Sans", Arial, sans-serif;
	margin-top: 20px;
	text-transform: uppercase;
}

/*.popup-notification .popup-top .popup-bg{
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}*/

.popup-notification .intro{
	color: #736f27;
	/*font-size: 24px;*/
	font: bold 48px/1em "Open Sans", Arial, sans-serif;
	margin-top: 0;
	margin-bottom: 20px;
	text-transform: uppercase;
}

.popup-notification .services{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	text-align: center;
}

.popup-notification .service{
	color: #736f27;
	font: bold 34px/1.2em "Open Sans", Arial, sans-serif;
	margin: 0 10px 20px 10px;
}

.popup-notification .service a{
	color: #736f27;
}

.popup-notification .service img{
	border-radius: 50%;
	display: block;
	margin: 0 auto 10px auto;
	max-width: 200px;
}

.popup-notification a{
	color: #2e2d2d;
	text-decoration: none;
}

.popup-notification a img{
	transition: opacity 0.25s ease;
}

.popup-notification a:hover{
	color: #8e8d8d;
}

.popup-notification a:hover img{
	opacity: 0.5;
}

.popup-notification .shopify-logo{
	max-width: 80px;
}

.popup-notification .doordash-logo{
	max-width: 100px;
}

.mfp-content .popup-notification .mfp-close{
	color: #000000;
	right: 20px;
	top: 20px;
}

/** Popup Extent **/
.before-you-go{
	background-color: #ffffff;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.65);
	-webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.65);
	-moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.65);
	max-width: 600px;
	width: 100%;
	position: fixed;
	top: 50%;
	right: 0;
	text-align: center;
	transform: translate(110%, -50%);
	transition: transform 0.55s ease;
	z-index: 100;
}

.before-you-go.show-popup{
	transform: translate(0, -50%);
}

.before-you-go .inner-wrap{
	padding: 35px 25px 25px 25px;
	position: relative;
}

.before-you-go .logo-wrap{
	padding: 10px 0;
}

.before-you-go h3{
	font-size: 30px;
}

.before-you-go .logo-wrap img{
	height: 9vh;
	max-width: 100%;
	max-height: 130px;
	width: auto;
}

.before-you-go .close-popup-text{
	color: #0A8040;
	display: inline-block;
	font-size: 12px;
	margin: 20px 0 0 0;
}

.before-you-go .close-popup-text:hover{
	color: #f6cc4b;
}

.before-you-go .close-popup{
	cursor: pointer;
	font-size: 25px;
	position: absolute;
	top: 20px;
	right: 20px;
}

@media only screen and (min-height: 690px){
	.before-you-go .logo-wrap img{
		height: auto;
	}
}

@media all and (min-width: 668px){
	.before-you-go{
		top: auto;
		bottom: 30px;
		transform: translateX(110%);
	}
	
	.before-you-go.show-popup{
		transform: translateX(0);
	}
	
	.popup-notification .popup-top h3{
		font-size: 25px;
		bottom: 30px;
	}
	
	.popup-notification .popup-top .number{
		font-size: 70px;
	}
	
	/*.notification-button{
		left: -158px;
	}*/
	
	.notification-button .tablet-up{
		display: inline;
	}
}

/*@media all and (min-width: 769px){
	.popup-notification .services{
		justify-content: space-between;
	}
}*/

@media all and (min-width: 990px){
	.notification-button{
		font-size: 21px;
		padding: 20px;
		left: -115px;
		min-width: 230px;
	}
}

@media all and (max-width: 768px) {
    .container.footer {text-align: center;}
    .container.footer .footer-left,
    .container.footer .footer-center,
    .container.footer .footer-right {margin-bottom: 32px;}
    .container.footer .footer .footer-right {padding: 0 4%;}
}

@media all and (max-width: 668px) {
	.home-icon.container .home-icon{
		top: -42px;
	}
	
	.home-icon.container .home-icon a{
		background: transparent;
		border-color: transparent;
		padding: 11px 24px;
	}
	
	.other-links{
		background: transparent;
		border-color: transparent;
		padding-left: 0;
		padding-right: 0;
		top: -43px;
	}
	
    .footer-right {
        text-align: center;
    }
}

.learn-more-head{
	border: 3px solid #FFF;
	font: bold 24px "Fenix", serif;
	display: block;
	padding: 20px;
	width: 200px;
	height: 112px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}