
/********************************************************************************************* 

4. Featured Slider -------------------------  wpzoom-slider.php

*********************************************************************************************/   
 
#slider { margin:0; position:relative; height:360px; overflow:hidden; }

#slider #no-slider-posts { width: 980px; margin: 150px auto 0; }
#slider #no-slider-posts p { margin: 0; }

.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

.flexslider {margin: 0; padding: 0;}
.slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
#slider .slides > li { position: relative; background-position: center center; background-repeat: no-repeat; background-size: cover; height: 460px; overflow: hidden; }

.flex-pauseplay span {text-transform: capitalize;}

.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

.no-js .slides > li:first-child {display: block;}

.flexslider {margin: 0 0 15px;   position: relative;   zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}
.carousel li {margin-right: 5px}

#slider .details { position: absolute; top: 0; left: 50%; width: 980px; margin: 0 0 0 -490px; }
#slider .details > div { position: absolute; top: 276px; right: 40px; z-index: 100; text-align: center; background: url('images/75.png') repeat; height: 76px; width: 610px; margin: 0; }
#slider .details .items { position: relative; list-style: none; }
#slider .details .items > li { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
#slider .details .items > li:first-child { display: block; }
#slider .details .items > li a, #slider .details .items > li span { display: inline-block; text-decoration: none; max-width: 590px;   }
#slider .details .items > li span { margin: 10px 0 0; background: url('images/slider-decoration.png') 50% 0 no-repeat; }
#slider .details h3 { display: inline-block; font: 18px Georgia, serif; word-wrap: break-word; line-height: 1.2; color: #fff; max-width: 500px; padding: 15px 0 2px; margin: 0; }
#slider .details .excerpt { display: inline-block; font-size: 13px; line-height: 1.5; color: #D4D1D8; padding: 0; margin: 0; }
#slider .details .excerpt :last-child { margin-bottom: 0; }


/* Directional Nav */
.flex-direction-nav {
	position: absolute;
	right: 9px;
        bottom: 5px;
	z-index: 100;
}

.flex-direction-nav > li {
	float: left;
}

.flex-direction-nav .flex-prev, .flex-direction-nav .flex-next {
	display: block;
	text-indent: -9999em;
	background: url('images/slider-arrows.gif') 0 0 no-repeat;
	height: 23px;
	width: 12px;
	overflow: hidden;
	opacity: 0.5;
}

.flex-direction-nav .flex-prev:hover, .flex-direction-nav .flex-prev:active, .flex-direction-nav .flex-next:hover, .flex-direction-nav .flex-next:active {
	opacity: 1;
}

.flex-direction-nav .flex-prev {
	margin-right: 16px;
}

.flex-direction-nav .flex-next {
	background-position: -62px 0;
}

/* Nav Thumbs */
#slidenav {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;  
         top: 0px;
}

#slidenav ul {
	list-style: none;
	width: 212px;       
	margin: 0 auto;
        background: url(images/slider_bullet_bg.png) no-repeat; 
         height: 51px;
        
}

#slidenav ul li {
	display: inline-block;
	color: #e3d6f7;
	background:url(images/list_bullet.png);
	width: 12px;
        height: 12px;
	cursor: pointer;
        margin: 22px 3px 3px 3px;
}

#slidenav ul li .post-thumb {
	height: 0;
	overflow: hidden;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

#slidenav ul li:hover .post-thumb, #slidenav ul li.flex-active .post-thumb {
	width: 12px;
        height: 12px;
        background: #ff0000 !important;
}

#slidenav ul li .post-thumb img {
	margin: 10px 10px 0;
}

#slidenav ul li h4 {
	font: 13px Georgia, serif;
	font-weight: normal;
	text-align: center;
	line-height: normal;
	padding: 10px;
}


/*********************************************************************************************

12. Media Queries

*********************************************************************************************/

/* Small Displays */
@media screen and (max-width: 980px) {

 	#header { width: 95%; }
 	.home #header { top:50px; margin: 0 0 0 -48%; }
	#header-wrap { padding-top: 50px; }
	.home #header-wrap { min-height: inherit;}
	#header #booknow { position: absolute; top:-41px; margin:0; right: 0; }
	#header #phonenumber { right:150px; top:-35px; }
 
	#slider .details { width: 100%; margin-left:-50%; }
	#slidenav ul { width: 96%; }
	#slidenav ul li {width: 16%; }
	#slidenav ul li .post-thumb img { max-width: 100%; width: 100%; height: auto; margin: 0; display: none; }
	#slidenav ul li:hover .post-thumb, #slidenav ul li.flex-active .post-thumb { height: 28px; }

	#featured-dishes ul li { width: 23%; margin-right: 2%; }
	#featured-dishes ul li img { max-width: 100%; width: 100%; height:auto; }

	#content-wrap { width: 92%;  }

	#home-widgets .widget { width: 47%; margin-right: 3%; }
 	 
	.post .post-thumb img { max-width: 100%; width: 100%; height: auto; }
	.post_content { width: 65%; padding-right: 3%; }
	.side-left .post_content { padding-left: 3%; padding-right: 0; }
	.full-width .post_content { width: 100%; }
	.full-width .entry { width: 100%; }
	.entry { width: 100%; }
	.entry img.alignnone,
	.entry img.aligncenter,
	.entry img.alignleft,
	.entry img.alignright,
	.entry img.attachment-fullsize { margin-bottom: 10px; max-width: 100%; width: auto; height: auto; }
	.full-width .entry img.alignnone,
	.full-width .entry img.aligncenter,
	.full-width .entry img.alignleft,
	.full-width .entry img.alignright,
	.full-width .entry img.attachment-fullsize { margin-bottom: 10px; max-width: 100%; width: auto; height: auto; }
   	
	#sidebar { width: 31%; }

 	#featdishes > div { width: 95%; }
	#featdishes .post { width: 31%; margin-left:3%; }

	#categories .category > div { width: 95%; }
	#categories .category .post { width: 46%; margin-right: 3%; padding:1%; }
	#categories .category .post .post-thumb { width: 20%; }
	#categories .category .post .content { width: 76%; padding: 1% 2%; }

	#footer .wrap { width: 95%; }
  	#footer div.column { width: 47%; margin:0 2% 30px 0; display: inline-block; vertical-align: top; float: none; }


}


/* Tablet Portrait */
@media screen and (max-width: 768px) {

	#header { position: relative; width: 100%; }
	.home #header { position: relative; width: 100%; top: 0; margin: 0; left: 0; }
	#header-wrap { padding-top: 0; }
	#header #booknow { top:12px; right: 85px; }
	#header #phonenumber { top: 16px; right: 205px;  color:#fff; text-shadow:none; }

	.post_content { width: 100%; padding-right: 0; }

	#categories .category .post { width: 97%; margin-right: 0; padding:1%; }
	#categories .category .post:nth-last-child(-n+2) { margin-bottom: 30px; }

	#featured-dishes ul li { width: 47%; margin-right: 3%; margin-bottom: 30px;}

	#slider { height: 500px; }
	#slider .slides > li { height: 500px; }
	#slider .details > div { top:60px; width: 260px; height: 260px;}
	#slider .details .items > li a, #slider .details .items > li span  { max-width: 215px; }
	#slider .details .items > li span { background: none; margin: 25px 0 0; }
	#slider .details h3 { font-size: 24px; }
	.flex-direction-nav { left: 112px;bottom: 24px; }
	.flex-direction-nav .flex-prev, .flex-direction-nav .flex-next { opacity: 1; }

	#sidebar { width: 100%; float: left; }
	 
	.btn_menu { display: block; position: absolute; top: 10px; right: 3%; cursor: pointer; background:url('images/menu.png') no-repeat; padding:0; width:42px; height:38px; }

	#menu { margin-left: 0; width: 90%; padding: 2% 3%;  }
	.mobile-menu { display: none; }
	.dropdown { padding: 0 0 15px 0; }
	.dropdown > li:after { display: none; }
	.dropdown li { line-height: 38px; }
	.dropdown li { display: block; float: none; margin-right: 0; }
	.dropdown a {  }
	.dropdown ul { background: none; border: none; margin-left: 10px; display: block !important; position: relative; visibility: inherit !important; top: 0; width: auto; }
 	.dropdown ul li a { color: #878E91; }
	.dropdown > li > a:hover { margin-top: 0; }
	.dropdown > li > a:after { display: none; }
	.dropdown > li > a:hover:after { border-top-color: #ec5706; }
	.dropdown ul {  -webkit-box-shadow: none; box-shadow: none; padding: 0; }

	.dropdown > li > a:hover { margin-top: 0;  }
	.dropdown > li:hover { margin-top: 0; }
	.dropdown > li:hover > a { margin-top: 0; }
 	.dropdown li:hover  { background:none; }
 
 	.dropdown li:hover ul,
	.dropdown li.sfHover ul { left: 0; top: 0; z-index: 99; }
	ul.dropdown li:hover li ul,
	ul.dropdown li.sfHover li ul { top: 0; }
	ul.dropdown li li:hover ul,
	ul.dropdown li li.sfHover ul { left: 0; top: 0; }
	ul.dropdown li li:hover li ul,
	ul.dropdown li li.sfHover li ul { top: 0; }
	ul.dropdown li li li:hover ul,
	ul.dropdown li li li.sfHover ul { left: 0; top: 0; }

	#home-widgets .widget { width: 100%; margin-right: 0; }

	#btnbox h2:before, #btnbox h2:after { display: none; }
	#btnbox h2 { font-size:26px; }
 
}

/* All Mobile Sizes (devices and browser) */
@media screen and (max-width: 640px) {

	#header #phonenumber { display: none; }

	#slider { height: 200px; }
	#slider .slides > li { height:200px; }
	#slider .details { margin-left:0; left:0; width: 100%; }
	#slider .details .excerpt { display: none; }
	#slider .details .items > li span { margin: 0; padding-left:30px;}
	#slider .details .items > li a, #slider .details .items > li span { width: 100%; }
	#slider .details > div { text-align:left; right:0; bottom:0; width:100%; height:60px; top:140px; -moz-border-radius: 0;-webkit-border-radius: 0;border-radius: 0; }
 	#slidenav { display: none; }
 	#slider .details h3 { font-size: 18px; max-width: 100%; padding-top:18px; }
	.flex-direction-nav { bottom: 17px; right:20px; left:auto; }
	
 	#about .hours { width: 100%; float:left; background-position: center top; margin: 0 0 25px; }
  
	#featured-dishes ul li .content p { display: none; }
	#featdishes .post { width: 100%; margin-left:0; margin-bottom:30px; }
	#featdishes .post:first-child, #featdishes .post:nth-child(4n) { margin-left: 0; }

	#footer div.column { width: 100%; margin:0 0 30px 0; display: inline-block; vertical-align: top; float: none; }

}
