@charset "UTF-8";
/* CSS Document */

/*Font Definitions*/
@font-face {font-family: Tinker; src: url("../typefaces/Tinker Font/Tinker.otf");}
@font-face {font-family: TinkerLight; src: url("../typefaces/Tinker Font/Tinker-Light.otf");}
@font-face {font-family: TinkerBold; src: url("../typefaces/Tinker Font/Tinker-Bold.otf");}
@font-face {font-family: TinkerOutline; src: url("../typefaces/Tinker Font/Tinker-Outline.otf");}
@font-face {font-family: ArcherBook; src: url("../typefaces/Archer Font/Archer-Book-Pro.otf");}
@font-face {font-family: ArcherSemibold; src: url("../typefaces/Archer Font/Archer-Semibold-Pro.otf");}
@font-face {font-family: ArcherBookItal; src: url("../typefaces/Archer Font/Archer-BookItal-Pro.otf");}

/*Keyanimations*/

@keyframes breathe {0%   { transform: scale(1)} 50%  { transform: scale(1.1)} 100% { transform: scale(1)} }

/*Text Styling*/
h1 { font-family: Tinker; color: #696262;}
h2 { font-family: ArcherSemibold;  color: #696262;}
p { font-family: ArcherBook;  color: #696262;}
.butnav {margin-bottom: 2pt;box-shadow: -1pt 1pt #696262;border: -10pt #ffffff;}
a.more { font-family: ArcherBookItal; color: #4FBEBF;transition: all .15s ease-in;}
/*figcaption { font-family: ArcherBookItal; color: #696262;}*/

	
/* Structure */
* {margin: 0;padding-top: 0;}
body {margin: 0;padding: 0;}
.flexybox {display: flex; flex-wrap: wrap;}
.column {display: flex; flex-wrap: wrap;}

#socialMediaLinks {display: flex;flex-direction: row;align-content: space-around;justify-content: space-around;margin-left: auto;margin-right: auto;margin-top: 15%;max-width: 300px;}
	#socialMediaLinks img {display: block; margin-left: auto; margin-right: auto; width: 35pt;transition: all .5s ease-in;}
    #socialMediaLinks img:hover {transform: scale(1.1,1.3);}

.foodicon {height: 13px;padding-left: 4px;padding-right: 4px;}

/* HomePage */
#homeLeft {flex: 70vw; display: block; margin-left: auto; margin-right: auto;}
#homeLeftContent{width: 90%;}
#homeRight{flex: 30vw;}
#aboutSection {margin: 2vw 2.6vw 2vw -3vw;line-height: 1.3;}
#logo img{display: flex;width: 10vw;margin-left: 7vw;margin-right: auto;}
#logo {display: block;justify-content: center;align-content: center;margin-top: 3vw;margin-bottom: 3vw;margin-left: auto;margin-right: auto}

/*Contact Page*/
.orderFormWrap {width: 50vw; display: block;margin-left: auto;margin-right: auto;}
.contactFormWrap {width: 50vw; display: block;margin-left: auto;margin-right: auto;margin-top: 5%;}
form {box-shadow: -2px 2px 6px 2px rgba(0,0,0,.1);padding-bottom: 40px;padding-top: 40px;}
input {display: block; margin-left: auto;margin-right: auto;width: 65%;height: 30px;box-shadow: 1,1,2,2,#999;margin-bottom: -10pt;}
label {margin-left: auto;margin-right: auto;display: block;width: 65%;font-family: ArcherSemibold;}
.specialDirections {height: 100px;}
select {display: block; margin-left: auto;margin-right: auto;width: 65%;height: 30px;box-shadow: 1,1,2,2,#999;margin-bottom: -10pt;}
#submitForm {font-family: Archer;font-size: 15pt;color: #fff;background:rgba(225,143,103,1.00);}
#commentForm {color: #fff;background:rgba(225,143,103,.70);}
#commentFormSubmit {font-family: Archer;font-size: 15pt;color: #fff;background:rgba(225,143,103,1.00);}
.customerOrder {font-family: Archer;text-align: left;width: 65%; height: 50vh;margin-left: auto;margin-right: auto;display: block;}
legend {font-family: ArcherSemibold;font-size: 25pt;text-align: center;}

/*Locations*/
.slideshow-container {width: 65vw;position: relative; margin: auto;}
.mySlides {display: none;}
.prev, .next {cursor: pointer;position: absolute;top: 50%;width: auto;margin-top: -22px;padding: 16px;color: white;font-weight: bold;font-size: 18px;transition: 0.6s ease;border-radius: 0 3px 3px 0;user-select: none;}
.next {right: 0;border-radius: 3px 0 0 3px;}
.prev:hover, .next:hover {background-color: rgba(226,143,103,0.67);}
.text {color: #fff;font-family: ArcherSemibold;font-size: 5vw;padding: 8px 12px;position: absolute;bottom: 8px;width: 100%;text-align: center;}
.numbertext {color: #f2f2f2;font-family: Archer;font-size: 3vw;padding: 8px 12px;position: absolute;top: 0;}
.dot {cursor: pointer;height: 2vw;width: 2vw;margin: 0 2px;background-color: rgba(226,143,103,0.9);border-radius: 50%;display: inline-block;transition: background-color 0.6s ease;}
.active, .dot:hover {background-color: rgba(226,143,103,0.47);}
.fade {-webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1s;}
@-webkit-keyframes fade {from {opacity: .4} to {opacity: 1}}
@keyframes fade {from {opacity: .4} to {opacity: 1}}
.locationDetails {font-size: 2vw;line-height: .5;}
.text span {line-height: 50%;}

/*Menu Shiz*/
.animated {-webkit-animation-duration: 2.5s;animation-duration: 2.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
} 

@-webkit-keyframes bounce {
  0%, 20%, 40%, 60%, 80%, 100% {-webkit-transform: translateY(0);}
  50% {-webkit-transform: translateY(-5px);}
} 

@keyframes bounce { 
  0%, 20%, 40%, 60%, 80%, 100% {transform: translateY(0);}
  50% {transform: translateY(-5px);}
} 

.bounce { 
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

.animatedA {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
} 

@-webkit-keyframes bounceA {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
  }
} 

@keyframes bounceA { 
 0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
  }
} 

.bounceA { 
  -webkit-animation-name: bounceA;
  animation-name: bounceA;
}

.animatedB {
  -webkit-animation-duration: 1.0s;
  animation-duration: 1.0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
} 

@-webkit-keyframes bounceB {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-15px);
  }
} 

@keyframes bounceB { 
 0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-15px);
  }
} 

.bounceB { 
  -webkit-animation-name: bounceB;
  animation-name: bounceB;
}

/*Mobile (below 768)*/
@media only screen and (max-width: 767px) {
	img.mobileBan {display: flex; width: 100vw;}
	img.desktopBan {display: none;}
	img.tabletBan {display: none;}
	#logo {display: block;width:20vw;}
	#desktopNav {display: none;}
	#homeRight {display: block;width: 80%;margin-left: auto;margin-right: auto;}
	#aboutSection {display: block;width: 70%;margin: auto;}
	.navIndex {float: left;position: absolute;}
	.openbtn {background: rgba(226,143,102,1.00);float: left;position: fixed;color: #fff;top: 0;}
	#hamburder {padding-left: 8px;padding-right: 8px; font-size: 15px;color: #fff;}
	.sidebar {height: 100%;width: 0;position: fixed;z-index: 1;top: 0;left: 0;background-color: rgba(226,143,102,1.00);overflow-x: hidden;transition: 0.5s;}
	.sidebar a {padding: 8px 8px 8px 32px;font-family: Archer; text-decoration: none;font-size: 25px;color: #FFFFFF;display: block;transition: 0.3s;}
	.sidebar a:hover {color: #f1f1f1;font-size: 22px;}
	.sidebar .closebtn {position: absolute;top: 0;right: 25px;font-size: 22px;margin-left: 50px;color: #fff;}
	.openbtn:hover {background-color: rgba(225,143,102,0.79);}
	#main {transition: margin-left .5s;padding: 16px;}
	.menuFilterContainer {display: none;}
	.scroll {flex:70%; padding-left: 10vw; display:block;}
	#locationComp{ width: 55vw;}
	.menuOptions {display: block;}
	.menuAbout {margin-top: 5vw;margin-bottom: 3vw; display: flex;width: 85vw;margin-left: auto;margin-right: auto;}
	.menuAbout p {display: block; justify-content: center;align-content: center; text-align: center; margin-left: auto;margin-right: auto;width: 41vw;}
	.lineBreak hr {display: block;align-content: center;justify-content: center;margin-left: auto;margin-right: auto;margin-bottom: 2vw; width: 60%;}
	.menuOptions img {display: flex;flex-direction: row;margin-left: auto;margin-right: auto;margin-top: 0;max-width: 25vw;float: left;}
	.grubhub {top: 0; position: sticky;width: 10vw; margin-top: 25vh;animation: breathe 3.5s infinite;}
	#grubhubButtonMobile {margin-top: 90%; background:rgba(246,0,4,1.00);padding: 4pt;}
	.grubhub a {color: #fff;text-decoration: none;font-size: 14pt;font-family: ArcherSemibold;line-height: 1.1;}
	.navHome {display: none;}
	#socialMediaLinksPages {display: flex;position: sticky;top: 0; flex-direction: column;align-content: space-around;justify-content: space-around;margin-left: auto;margin-right: auto;margin-top: 45%;max-width: 50px;}
	#socialMediaLinksPages img {display: block; margin-left: auto; margin-right: auto; width: 25pt;transition: all .5s ease-in;}
    #socialMediaLinksPages img:hover {transform: scale(1.1,1.3);}
}
	
/*Tablet (768)*/
@media only screen and (min-width: 768px) and (max-width: 1023px) {
	img.tabletBan {display: block;width: 100%;height: auto;}
	img.mobileBan {display: none;}
	img.desktopBan {display: none;}
	#desktopNav {display: none;}
	.navIndex {float: left;position: absolute;}
	.openbtn {background: rgba(226,143,102,1.00);float: left;position: fixed;color: #fff;top: 0;}
	#hamburder {padding-left: 8px;padding-right: 8px; font-size: 15px;color: #fff;}
	.sidebar {height: 100%;width: 0;position: fixed;z-index: 1;top: 0;left: 0;background-color: rgba(226,143,102,1.00);overflow-x: hidden;transition: 0.5s;}
	.sidebar a {padding: 8px 8px 8px 32px;text-decoration: none;font-family: Archer; font-size: 25px;color: #FFFFFF;display: block;transition: 0.3s;}
	.sidebar a:hover {color: #f1f1f1;font-size: 22px;}
	.sidebar .closebtn {position: absolute;top: 0;right: 25px;font-size: 22px;margin-left: 50px;color: #fff;}
	.openbtn:hover {background-color: rgba(225,143,102,0.79);}
	#main {transition: margin-left .5s;padding: 16px;}
	.menuFilterContainer {display: none;}
	.scroll {flex:90%; padding-left: 10%; display: block;margin-left: auto;margin-right: auto;margin-top: 1%;}
	#locationComp {display: block;width: 55vw;}
	.menuOptions {display: block;}
	.menuAbout {margin-top: 5vw;margin-bottom: 3vw; display: flex;width: 90vw;margin-left: auto;margin-right: auto;}
	.menuAbout p {display: block; justify-content: center;align-content: center; text-align: center; margin-left: auto;margin-right: auto;width: 41vw;}
	.lineBreak hr {display: block;align-content: center;justify-content: center;margin-left: auto;margin-right: auto;margin-bottom: 2vw; width: 60%;}
	.menuOptions img {display: flex;flex-direction: row;margin-left: auto;margin-right: auto;margin-top: 0;max-width: 25vw;float: left;}
	.grubhub {top: 0; position: sticky;width: 0vw; margin-top: 25vh;animation: breathe 3.5s infinite;}
	#grubhubButtonMobile {margin-top: 90%; background:rgba(246,0,4,1.00);padding: 4pt;}
	.grubhub a {color: #fff;text-decoration: none;font-size: 14pt;font-family: ArcherSemibold;line-height: 1.1;}
	.navHome {display: none;}
	#socialMediaLinksPages {display: flex;flex-direction: column;position: sticky;top:0;align-content: space-around;justify-content: space-around;margin-left: auto;margin-right: auto;margin-top: 45%;max-width: 140px;}
	#socialMediaLinksPages img {display: block; margin-left: auto; margin-right: auto; width: 25pt;transition: all .5s ease-in;}
    #socialMediaLinksPages img:hover {transform: scale(1.1,1.3);}
}
	
/*Desktop (1024)*/
@media only screen and (min-width: 1024px) {
	#reducedNav {display: none}
	a.more:hover {letter-spacing: 1px;}
	a.nav button {font-family: ArcherBook; color: #fff;font-size: 20px;text-shadow: -1pt 1pt #696262;text-decoration: none;letter-spacing: 1px;transition: all .3s ease-in;}
	a.nav button:hover {letter-spacing: 2.5px;}
	#headimgHome {  width: auto;height: 100vh;background-size: cover;background-image: url("../img/banner/Splash.png");}
	img.desktopBan {display: flex;width: 80%;float: right;margin-top: 20vh;margin-right: -5vw;}
	img.mobileBan {display: none;}
	img.tabletBan {display: none;}
	.column {display: flex;flex-wrap: wrap;}
	.navPages {flex: 10%;margin-top: 2%;}
	.navPagesButtons {top: 0;position: sticky;}
	.navPages button {width: 10vw;background-color: #CC6633;opacity: .74; box-shadow: -1pt 1pt #696262;border: -10pt #ffffff;}
	.scroll {flex:70%; padding-left: 3%; display: block;}
	.menuOptions {display: block;}
	.menuAbout {margin-top: 5vw;margin-bottom: 3vw; display: flex;width: 60vw;margin-left: auto;margin-right: auto;}
	.menuAbout p {display: block; justify-content: center;align-content: center; text-align: center; margin-left: auto;margin-right: auto;width: 41vw;}
	.lineBreak hr {display: block;align-content: center;justify-content: center;margin-left: auto;margin-right: auto;margin-bottom: 2vw; width: 60%;}
	#locationComp{ width: 1450px;}
	.menuOptions img {display: flex;flex-direction: row;margin-left: auto;margin-right: auto;margin-top: 0;max-width: 22vw;float: left;}
	.menuFilters {padding: 2.5%;margin-top: 2.5%;flex: 12%;}
	.menuFilterContainer {top: 0;position: sticky;}
	.unclicked {width: 12vw;height: 4vw; padding: 10px;margin-bottom: 4%;background: #CC9966;font-family: TinkerOutline;font-size: 24px; color: #ffffff;letter-spacing: 2px; opacity: .42; transition: all .25s ease-in;}
	.clicked {width: 12vw;height: 4vw; padding: 10px;margin-bottom: 4%;background: #CC6633;font-family: Tinker;font-size: 24px; color: #ffffff;letter-spacing: 2px; opacity: .74; transition: all .25s ease-in;}
	.menuFilters button:hover {transform: scale(1.1)}
	.navHome {flex: 10%;margin-top: 2%; clear: both;position: fixed;}
	.navHomeButtons {top: 0;position: sticky;}
	.navHome button {width: 10vw;background-color: #CC6633;opacity: .74;}
	.grubhub {top: 0; position: sticky;margin-top: 44vh;animation: breathe 3.5s infinite;}
	#grubhubButton {margin-top: 140%; background:rgba(246,0,4,1.00);padding: 4pt;}
	.grubhub a {color: #fff;text-decoration: none;font-size: 14pt;font-family: Archer;line-height: 1.1;}
	.contactOptions {display: block;margin-left: auto;margin-right: auto;max-width: 80vw;margin-bottom: 20%;}
	#socialMediaLinksPages {display: flex;flex-direction: row;align-content: space-around;justify-content: space-around;margin-left: auto;margin-right: auto;margin-top: 45%;max-width: 140px;}
	#socialMediaLinksPages img {display: block; margin-left: auto; margin-right: auto; width: 25pt;transition: all .5s ease-in;}
    #socialMediaLinksPages img:hover {transform: scale(1.1,1.3);}
}