/*
Theme Name:   Sa Bai Thong - restaurateur child
Theme URI: http://wpthemes.co.nz/restaurateur/
Author: Greenleaf Media
Author URI: http://greenleafmedia.com
Description: Restaurateur is a dedicated WordPress restaurant theme. The theme comes bundled with an optional plugin which you can activate for easy menu management. Menus are then displayed on one of two included menu templates which feature your dishes and pricing and have gorgeous transitions between menu categories. The theme also provides a static home page template with a big image slider and dedicated widget area, plus you get great deal of flexibility over colors. It's a flexible and responsive theme which will look great on any device.
Version: 2.0.9
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-menu, sticky-post, microformats, rtl-language-support, translation-ready, full-width-template, post-formats
Template: restaurateur

*/

body {
	background-color: #340E03;
	font-family: Arial,Helvetica,sans-serif;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
	font-family: Arial,Helvetica,sans-serif;
}

p {
  margin-bottom: .75em;
  margin-top: 0.2em;
  padding: 0;
  font-size: 0.8em;
}

.commentlist li.comment article[id*="comment-"] p, .post-content p, .intro-content p {
  margin: 0 0 0.75rem;
}

.commentlist li.comment article[id*="comment-"] img, .post-content img {
	margin-bottom: .75em;
}

.post-content img {
    margin-bottom: 0.75em;
    margin-top: 0;
}

.post-content p img {
    margin-bottom: 0;
    margin-top: 0;
}

ul li {
  font-size: 0.8em;
}

.widget {
/* 	border-bottom: 0; */
}

.post-content ul li::before {
	content: '';	
}

.article-content ul li,
.post-content ul li {
	list-style: disc inside;
}

/* restauranteur widths */

#search-box,
#inner-header,
#content,
#sidebar-home,
footer[role="contentinfo"] {
	max-width: 1028px;
	margin: 0 auto;
}

#site-tag,
#site-generator {
  width: 1000px;
  margin: 0 auto;
}

header[role="banner"] {
	background: transparent;
}

#site-tag {
	background-color: #f4aa00;
	border-radius: 35px 35px 0 0;
	color: #fff;
	font-family: helvetica,sans-serif;
	font-size: 22px;
	height: 40px;
	line-height: 24px;
	padding: 10px 50px;
	text-align: right;
	text-shadow: 1px 1px 2px #000;
	text-transform: uppercase;
	box-shadow: 0 8px 12px #775100 inset;

}

#inner-header {
	background: url('images/header_mid_02.jpg') no-repeat 0 0 scroll #FFF;
	margin: 0 auto;
/*     width: 960px; */
    height: 118px;
    padding: 0 10px;
    position: relative;
}

#site-heading {
	padding-top: 5px;
}

#social-media {
  display: inline-block;
  position: absolute;
  right: 15px;
  text-align: right;
  top: 10px;
  vertical-align: bottom;
  width: 39%;
}

#search-icon {
	display: none;
}

div.menu {
    width: 1062px;
    padding: 0;
    border-top: 1px solid #B4261E;
}


nav[role="navigation"] {
	background: transparent;
}

nav[role="navigation"] div.menu > ul {
   background: #ac0b03;
   background: -webkit-gradient(linear, left top, left bottom, from(#ac0b03), to(#5d0703));
   background: -webkit-linear-gradient(top, #ac0b03, #5d0703);
   background: -moz-linear-gradient(top, #ac0b03, #5d0703);
   background: -ms-linear-gradient(top, #ac0b03, #5d0703);
   background: -o-linear-gradient(top, #ac0b03, #5d0703);
   background-image: -ms-linear-gradient(top, #ac0b03 0%, #5d0703 100%);
   -webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
   -moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
   box-shadow: 0 8px 6px -6px #777;
   position: relative;
   width: 100%;
   height: 50px;
   padding: 0 20px;
   box-sizing: border-box;
}

nav[role="navigation"] div.menu > ul:before, nav[role="navigation"] div.menu > ul:after {
  content: '';
  position: absolute;
  height: 0;
  width: 0;
}

nav[role="navigation"] div.menu > ul:before {
  top: 100%;
  left: 0px;
  border-top: 20px solid #440402;
  border-left: 16px solid transparent;
}
nav[role="navigation"] div.menu > ul:after {
  top: 100%;
  right: 0px;
  border-top: 20px solid #440402;
  border-right: 16px solid transparent;
  visibility: visible;
}

nav[role="navigation"] .menu ul li a, nav[role="navigation"] .menu #menu-icon {
	font-size: 1.25em;
	padding: 13px 20px;
}

#content {
	background: #FFF;
}

article[id*="post-"] {
	border: none;
}

/* Home content  */

.page-template-page-home article[id*="post-"] {
	padding: 0 0 1.2rem 30px;
	margin-bottom: 0;
}

.page-template-page-home .post-content {
	overflow: visible;
}

.metaslider {
	box-shadow: 0 6px 10px #BCBCBC;
	border: 8px white solid;
}

.home-tout h2 {
	font-size: 1em;
}

.tout-header {
	background: rgba(0, 0, 0, 0) url("images/sbt-button.png") no-repeat scroll center center / 100% auto;
	color: #fff;
	font-weight: normal;
	line-height: 32px;
	padding: 10px 10px;
	text-align: center;
	text-shadow: 1px 1px 2px #ddd;
	margin-bottom: 15px;  
	background-size: contain;
}

.home-tout .tout-header {
	padding: 20px 10px;
	font-weight: bold;
	font-size: 32px;
}

#sidebar .tout-header {
	background-size: contain;
	font-size: 24px;
	min-width: 195px;
	display: inline-block;
}

.tout-header > a {
	color: #FFFFFF;
}

.col300.home-tout {
	padding: 0 8px;
}

.page-template #content {
	background: url('images/woman.png') no-repeat 98% 98% scroll #FFF;
	padding-bottom: 156px;
}


.page-template.page-template-page-home #content {
	background-image: none;
	padding-bottom: 0;
}

.col300.home-tout:nth-child(5),
.page-template-default #content {
	background: url('images/woman.png') no-repeat 98% 98% scroll #FFF;
	padding-bottom: 156px;
}

.home-tout h3,
#sidebar h3 {
  color: #e56b10;
  font-size: .9em;
}

/* all content */

#main {
}

h1.page-title, h2.page-title,
h2.tout-title {
  color: #f3aa00;
  font-size: 1.3em;
  font-weight: 600;
  margin: 0 0 0.46em;
  padding: 0;
}


.home .entry-header {
	display: none;
}

.noimgthumb {
	margin: 0;
	background: none;
	height: auto;
}

#sidebar-left {
	float: left;
	margin-top: 2.2rem;
}


/* Menu page  */


.home #sidebar-left > img {
  margin-top: -3px;
}
	


.page-template-menu-items-template .cycle-slideshow {
  height: auto;
  margin-bottom: 30px;
}

.cycle-slideshow {
	width: 100%;
}

.cycle-slide {
  height: auto;
  width: 100%;
}


#menu-filter-wrap {
	border-top: none;
	margin-top: 0;
}

#menu-filter-wrap #menu-item-icon {
	display: none;
}

#menu-filters {
  margin-left: 30px;
}

#menu-filters li,
.button-group li {
	display: block;
	margin: 0;
}

#menu-filters li a,
.button-group li a {
	padding: 0 5px;
	color: #f3aa00 !important;
    font-weight: bold;
    text-transform: none;
	padding: 2px 5px;    
	display: inline-block;
	line-height: 1em;
	border-radius: 5px;
	font-size: 1em;
}

#menu-filters li.active a,
.button-group li.active a,
#menu-filters li a:hover,
.button-group li a:hover  {
/*
	color: #FFFFFF !important;
	background: #992624;
*/
	text-decoration: underline;	
}

#service-filter-wrap .button-group li a {
	font-size: 2em;
	display: inline-block;
	width: 135px;
	text-align: center;
	padding: 5px;
	font-weight: normal;

}

/* Hide Favorites on lunch menu */
.lunch #menu-filters li a.sa-bai-specialties {
	display: none;
}

#service-filter-wrap .button-group li.active a {
	background: rgba(0, 0, 0, 0) url("images/sbt-button.png") no-repeat scroll center center / contain;
	text-decoration: none;
	color: #ffffff !important;
}

.button-group {
	margin-bottom: 30px;
}

.grid-box .imgthumb {
	height: 86px;
	margin: 0 0 5px;
}

.imgthumb img {
	min-height: 86px;
	min-width: auto;
}

.grid-box .entry-title, body.page .grid-box .entry-title {
	font-family: verdana,helvetica,sans-serif;
	font-size: 0.8rem;
	font-weight: 600;
	padding: 0 6px;
	color: #555555;
}

.grid-box .entry-content {
	padding: 5px;
}

.grid-box .entry-content p {
	font-size: 1em;
	line-height: 1.25em;
	color: #555555;

}

.grid-box  footer {
	display: none;
}

/* .col60, .col140, .col220, .col300, .col380, .col480, .col540, .col620, .col700, .col780, .col860, .col940 */

footer[role="contentinfo"] {
	background: none transparent;
	padding-top: 0;
	text-align: center;
	font-size: .8em;
	font-family: 'Helvetica', Arial, sans-serif;
}

#site-generator {
	background-color: #f4aa00;
	border-radius: 0 0 35px 35px;
	padding: 10px;
	color: #000;
	font-weight: normal;
	box-shadow: 0 8px 12px #775100 inset;
}

#site-generator p {
	font-size: 1em;
	margin-bottom: 0;
}

.copyright {
	color: #FFF;
}



/**
* http://nicolasgallagher.com/micro-clearfix-hack/
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}

@media only screen and (max-width: 1040px) {
	#site-tag, #site-generator {
		width: 96%;
	}
}

@media only screen and (max-width: 767px) {
	#site-tag {
		text-align: center;
	}
}

@media only screen and (max-width: 640px) {

}

@media only screen and (max-width: 767px) {
	#site-tag {
		width: 100%;
		text-align: center;
		padding: 10px;
		font-size: 0.9em;
	}
	
	#inner-header {
		width: 100%;
	}
	
	nav[role="navigation"] .menu.nav-mobile #menu-icon {
	  position: relative;
	  padding-left: 1.25em;
	  text-indent: -9999px;
	}
	nav[role="navigation"] .menu.nav-mobile #menu-icon:before {
	  content: "";
	  position: absolute;
	  left: 20px;
	  top: 12px;
	  width: 2em;
	  height: 0.25em;
	  background: white;
	  box-shadow: 
	    0 0.5em 0 0 white,
	    0 1em 0 0 white;
	}
	
	div.menu {
		background: #ac0b03;
		background: -webkit-gradient(linear, left top, left bottom, from(#ac0b03), to(#5d0703));
		background: -webkit-linear-gradient(top, #ac0b03, #5d0703);
		background: -moz-linear-gradient(top, #ac0b03, #5d0703);
		background: -ms-linear-gradient(top, #ac0b03, #5d0703);
		background: -o-linear-gradient(top, #ac0b03, #5d0703);
		background-image: -ms-linear-gradient(top, #ac0b03 0%, #5d0703 100%);
		width: 100%;
	}
	
	nav[role="navigation"] div.menu > ul {
		padding: 0;
	}
	
	nav[role="navigation"] .menu.nav-mobile ul li, nav[role="navigation"] .menu.nav-mobile ul.sub-menu li, nav[role="navigation"] .menu.nav-mobile ul.children li {
		background: #FFF;
	}
	
	nav[role="navigation"] .menu.nav-mobile ul li > ul.sub-menu, nav[role="navigation"] .menu.nav-mobile ul li > ul.children, nav[role="navigation"] .menu.nav-mobile ul li ul.sub-menu li ul, nav[role="navigation"] .menu.nav-mobile ul li ul.children li ul {
		/* display: none; */
	}
	
	nav[role="navigation"] .menu ul li ul.sub-menu li a, nav[role="navigation"] .menu ul li ul.children li a {
		text-indent: 0;
		font-weight: 700;
		
		font-size: 1rem;
	}
	
	nav[role="navigation"] div.menu > ul::before,
	nav[role="navigation"] div.menu > ul::after {
		border: none;
	}
	
	nav[role="navigation"] div.menu > ul > li.menu-link > a {
		display: none;
	}
	#menu-filters li a,
	.button-group li a {
		width: 100%;
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
	#menu-filter-wrap #menu-item-icon {
	  color: #f3aa00 !important;
	  display: block;
	  margin: 0;
	  text-align: center;
	}
	#menu-filters {
		width: 85%;
		margin-left: 7.5%;
	}
	#menu-filters li a {
		font-size: 1.5em;
		padding: 10px 14px;
	}
	
	#social-media {
	  bottom: -67px;
	  right: 0;
	  top: auto;
	  z-index: 100;
	}
	
	.home #sidebar-left {
		display: none;
	}	
	
	#sidebar-left {
		width: 100%;
		margin-top: 1.2rem;
		margin-left: 0;
		margin-right: 0;
	}
	
	#sidebar-left .button-group {
		margin-bottom: 0		
	}
	
	#service-filter-wrap {
		margin-bottom: 1em;
	}
	
	#service-filter-wrap ul {
		margin-left: 0;
		margin-right: 0;
	}
	
	#service-filter-wrap .button-group li {
		float: left;
		width: 50%;
	}
	
	#service-filter-wrap .button-group li a {
		width: 100%;
		box-sizing: border-box;
	}
	
	.col300.home-tout:nth-child(5), .page-template-default #content {
		padding-bottom: 0;
		background: none;
	}
	
	.page-template #content {
		width: 100%;
	}
	
	.page-template-page-home article[id*="post-"] {
		padding: 0;
	}
	.post-content iframe {
		margin-bottom: 0;
	}
	
	.col300.home-tout {
		width: 100%;
		float: none;
	}
	
	.col480.mobile-full {
		width: 98%;
	}
	
	#site-tag, #site-generator {
		width: 100%;
	}
	#site-generator p a {
		color: #000 !important;
	}
	
}