/* CSS Document */

@font-face {
    font-family: felix;
    src: url(../fonts/FELIXTI_0.TTF);
}
@font-face {
    font-family: AlexBrush;
    src: url(../fonts/AlexBrush-Regular.ttf);
}
@font-face {
    font-family: NexaLight;
    src: url(../fonts/NexaLight.otf);
}
@font-face {
    font-family: KelsonSansLight;
    src: url(../fonts/KelsonSansLight.otf);
}

body{}
.banner{width:100%; height:auto; background:url(../images/banner.jpg) center no-repeat; background-size: 100% 100%; padding:125px 0 100px 0;}
.social{width:100%; text-align:center; padding-bottom:10px;}
.social a{padding:0 15px;}
.social a:hover{ opacity:.6;}
.navbar-dark .navbar-nav .nav-link{color:#fff; padding:0 25px; text-transform:uppercase; font-family:felix; font-size:13px;}
.nav-item .active{color:#8f6349 !important;}
.bg-dark{background:none !important;}
.navbar-expand-md .navbar-collapse{ padding:10px 0;}
.sticky {
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 100;
  border-top: 0; background:#000!important;
}

.logo{width:90%; text-align:center; margin:0 5%; margin-top:130px;}
.logoanimation{animation: revolve 2s linear infinite;}
@keyframes revolve {
  25% {
    transform: rotate(10deg);
  }
  50% {
    transform: rotate(0deg);
  }
  75% {
    transform: rotate(-10deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

.weserve{font-size:45px; color:#fff; margin-top:60px; text-transform:uppercase; font-family:felix;}
.ingredients{font-size:62px; line-height:50px; color:#8f6349; margin-top:0px; text-transform:uppercase; font-family:felix;}
.dish{width:100%; height:auto; margin-top:125px; margin-bottom:-400px; }
.store{width:100%; height:auto; margin-top:300px;}
.discover{color:#8f6349; font-size:120px; text-align:center; font-family: AlexBrush; line-height:100px; width:100%;}
.title{color:#231f20; font-size:60px; text-align:center; font-family: felix; line-height:50px; width:100%;}
.fork{ width:100%; text-align:center; margin-top:15px; width:100%;}
.storetext{font-family: NexaLight; font-size:20px; color:#6d6e71; margin-top:60px; text-align:center;}

.footer{width:100%; height:auto; background:url(../images/footer.jpg) center no-repeat; background-size: 100% 100%; padding:500px 0 80px 0;}
.footerlogo{width:100%; text-align:center;}
.footer .social{margin-top:60px;}
.footermenu{width:100%; margin-top:30px; text-align:center; text-transform:uppercase;}
.footermenu a{color:#fff; padding:0 25px; text-transform:uppercase; font-family:felix; font-size:13px;}
.footermenu a:hover{ text-decoration:none;}
.footermenu .active{color:#8f6349 !important;}
.copyright{font-family: KelsonSansLight; font-size:16px; color:#717171; text-align:center; width:100%; padding-bottom:20px;}
.copyright a{color:#8f6349;}
#viewport {
  position: relative;
 
}
#viewport .smoke {
  position: absolute;
  width: 550px;
  height: 550px;
  background: url(../images/smoke-texture.png) no-repeat center;
  bottom: 250px; 
  left:0;
  right:0;
  margin:auto;
  
 
}
.download{background:#8f6349; color:#000;}
.download:hover{color:#fff;}
.download:focus{ box-shadow:none;}
.dropdown-menu{background:#8f6349 !important; margin-left:-10px; }
.dropdown-item{color:#fff !important; border-bottom:1px solid #fff;}
.dropdown-item:hover{ background:none !important; color:#000 !important;}


.location{color:#8f6349; 	font-size:36px; position:relative; z-index:1;
}
.location:hover{color:#8f6349;}
.bounce{ animation-name: bounce;animation-duration: 1s;
  animation-fill-mode: both;
  animation-timing-function: linear;
  animation-iteration-count: infinite;}
@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
	color:red;
  }
}
.phone{color:#8f6349; 	font-size:26px; vertical-align:-0.125em !important;
}
.phone:hover{color:#8f6349;}
.locationbounce{ animation-name: locationbounce;animation-duration: 2s;
  animation-fill-mode: both;
  animation-timing-function: linear;
  animation-iteration-count: infinite;}
@keyframes locationbounce {
  0%, 100% {
	  transform: translateY(0);
  }
  50% {
	color:#fff;
	transform: translateY(-5px);
  }
}
.locationdiv{width:100%; text-align:center; margin-top:30px;}

#preloader  {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background-color: #170a01;
     z-index: 9999;
    height: 100%;
 }

#status  {
     width: 200px;
     height: 200px;
     position: absolute;
     left: 50%;
     top: 50%;
     margin: -100px 0 0 -100px;
	 animation: revolve 2s linear infinite;
	 text-align:center;
 }
.ourmenu{width:100%; margin-top:40px; margin-bottom:150px; background:url(../images/menubg.jpg) center no-repeat; background-size: 100% 100%; padding-top:250px; padding-bottom:400px;} 
@media screen and (max-width:768px)
{
	
	.navbar{position:fixed; width:100%; top:0;}
	.bg-dark{background:#000!important;}
	.banner{padding-top:10px;}
	.navbar-nav li{padding:10px 0;}
	.logo{width:50%; margin:0 25%; margin-top:20px;}
	.sarhead{width:56px;}
	.sarbottom{width:154px;}
	.weserve{font-size:22px;margin-top:40px;}
    .ingredients{font-size:32px; line-height:30px;}
	.dish{margin-top:65px; margin-bottom:-300px;}
	.store{margin-top:150px;}
	.discover{font-size:60px; line-height:50px;}
    .title{font-size:30px; line-height:25px;}
	.footerlogo img{width:35%;}
	.footermenu a{padding:0 10px; font-size:12px;}
	.copyright{font-size:13px;padding:10px;}
	.footer{width:100%; height:auto; background:url(../images/footer.jpg) center no-repeat;  padding:400px 0 30px 0;}
	#viewport .smoke {
	  bottom: 150px; 
	  right:auto;
	  margin:0;
	  width: 250px;
      height: 250px;
	  background: url(../images/smoke-texture-small.png) no-repeat center;
	}
	.social{text-align:right; padding-top:3px;}
	.social a{position:relative; z-index:12;}
	.navbar-toggler{position:relative; z-index:123;}
	.footer .social{ text-align:center;}
	
	.ourmenu{background:#170a01;padding-top:150px; padding-bottom:150px;} 
}

.ourmenu .fork{margin-bottom:125px;}
.filter-button{
    font-size: 18px;
    border: 2px solid #8f6349;
	padding:5px 10px;
    text-align: center;
    color: #8f6349;
    margin-bottom: 45px;
	background:transparent;
	
}
.gallery_product .filter-button{ padding:0; border:0; margin:0;}
.gallery_product .filter-button1{ padding:0; border:0; margin:0;}
.filter-button:hover,
.filter-button:focus,
.filter-button.active{
    color: #ffffff;
    background-color:#8f6349;
	outline:none;
}
.gallery_product{
    margin: 0px;
	padding:0;
	position:relative;
}
.gallery_product .img-info{
	position: absolute;
    background: rgba(0,0,0,0.5);
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
	overflow:hidden;
	color:#fff;
	top:0;
	   -webkit-transition: 2s;
    transition: 2s;
	text-transform:uppercase;
}

.gallery_product:hover .img-info{
	display:block;
   -webkit-transition: 2s;
    transition: 2s;
}


.menu-p-ttl{color:#fff; text-align:center; text-transform:uppercase; font-size:18px;}
.gallery_product p{color:#fff; text-align:center;}
.img-info-prod{position:absolute; top:0; left:0; right:0; bottom:0; opacity:0;}
.img-info-prod:hover{ background:rgba(0,0,0,.7); opacity:1;}
.prod-ttl{position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; height:25px; text-transform:uppercase; color:#fff;}
.img-info-cat{position:absolute; top:0; left:0; right:0; bottom:0;  text-align:left; margin:auto; display:table; width:100%; height:100%; }
.img-info-cat:hover{ background:rgba(0,0,0,.7); opacity:1;}
.img-info-cat-wrap{  background:rgba(0,0,0,.7); padding:30px;  position:absolute; bottom:0; left:0; width:100%;}

.sub-cat-ttl{ color:#8f6349; text-transform:uppercase; font-weight:bold;}
.img-info-cat-wrap p{display:none;}
.img-info-cat p{text-align:left; color:#fff; }
.menu-p-ttl ~ .row {
	margin-top:45px;
}
.menu-p-ttl ~ p {
	margin-top:20px;
}
.menu-back{text-align:center; margin-top:45px;}
.menu-back .filter-button:hover{ background:none;}
.filter-button:hover{ cursor:pointer;}