/*
THEME NAME: Mezze Restaurant Group
THEME URI: http://www.mezzeinc.com
DESCRIPTION: Child theme of Sandbox, custom build for Mezze Restaurant Group, Williamstown MA
VERSION: 1.0
AUTHOR: <a href="http://www.durablegoodsdesign.com">Durable Goods Design</a>
*/

@import url(reset.css);

/* Colors
dark brown = #2a140a
gray beige = #7a6c66
dark teal blue = #557575
light blue = #e2f0f0
golden green = #beb589
*/

/* Mezze Restaurant Group */

@import url(reset.css);
@import url(type/type.css);
@import url(map.css);

body { margin: 0; background: #fff; font: 100%/1.5 Helvetica, Arial, Verdana, sans-serif; color: #292929; }



/* 
____________________


HEADER 

____________________

*/

#header-wrapper { width: 100%; margin: 0; background: #e2f0f0; }
#header { width: 960px; height: 116px; margin: 0 auto; overflow: hidden; background: url(img/bg-cabbage.png) top right no-repeat; }

#access { font-size: .75em; display: none; }

#nav { padding: 40px 0 20px 0; overflow: hidden; }
#nav h1 { float: left; width: 267px; }
#nav h1 a { display: block; background: transparent url(img/logo.png) top left no-repeat; width: 267px; height: 46px; text-indent: -999px; }

#nav ul { float: right; padding: 20px 0 0 0; font: .7em/1 Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase; letter-spacing: .13em; }
#nav ul li { float: left; padding: 0 0 0 10px; }
#nav ul li a:link, #nav ul li a:visited { padding: 0 0 3px 0; color: #413737; text-decoration: none; }
#nav ul li a:hover { color: #557575; border-bottom: 2px solid #557575; }
#nav ul .current_page_item a:link,
#nav ul .current_page_ancestor a:link, 
#nav ul .current_page_parent a:link,
#nav ul .current_page_item a:visited,
#nav ul .current_page_ancestor a:visited,
#nav ul .current_page_parent a:visited { color: #557575; border-bottom: 2px solid #557575; }
#nav ul .current_page_item a:hover, 
#nav ul .current_page_ancestor a:hover,
#nav ul .current_page_ancestor a:hover { color: #beb589;  border-bottom: 2px solid #beb589; }
#nav ul li a:active { color: #beb589; border-bottom: 2px solid #beb589; }

/*
____________________


CONTENT 

____________________

*/

#content-wrapper { width: 100%; }
#content { width: 960px; margin: 0 auto; overflow: hidden; }

#content .entry-content { width: 580px; padding: 0 0 50px 0; }
#content h2 { margin: 20px 0; font: 1.25em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase;  color: #2a140a; letter-spacing: .15em; }
#content h3 { margin: 10px 0; font: 1em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase;  color: #557575; letter-spacing: .15em; }
#content h4 { margin: 0 0 10px 0; font: .90em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase;  color: #655949; letter-spacing: .15em; }
#content h5 { margin: 0 0 10px 0; font: .80em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase;  color: #7a6c66; letter-spacing: .15em; }
#content p, #content ul, #content ol { margin: 0 0 20px 0; font-size: .90em; }
#content p em, #content li em, #content p cite { font-style: italic; }
#content p strong, #content li strong { font-weight: bold; }
#content small { font-size: .80em; }
#content a:link, #content a:visited { text-decoration: none; color: #557575; }
#content a:hover { color: #7a6c66; }
#content a:active { color: #413737; }
#content input[type="text"] { padding: 5px; border: 1px solid #7a6c66; color: #beb589; font: 1em/1.5 Helvetica, Arial, Verdana, sans-serif;  }
#content input[type="text"]:focus { border: 1px solid #557575; }

.columns { width: 960px; margin: 20px 0 0 0; padding: 0 0 25px 0; overflow: auto; }
.columns .column { float: left; margin: 0 20px 0 0; }
.columns .column-a { width: 460px; }
.columns .column-b { width: 220px; }
.columns .column-c { width: 220px; margin: 0; }

/* home */
.home #content h2 { margin: 0; font: 2em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase;  color: #557575; letter-spacing: .08em; }
.home #content h3 { margin: 10px 0; font: italic 1.2em/1.5 Georgia, "Times New Roman", Times, serif; text-transform: none; letter-spacing: normal; color: #7a6c66; }
.home #content h4 { margin: 0; font: 1em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; color: #655949;  text-transform: none; letter-spacing: .05em; }
.home #content h5 { margin: 20px 0; color: #2a140a; }
.home .columns .column-a { width: 400px; }
.home .columns .column-b { float: right; width: 507px; margin: 0; }
.home .secondary { margin: 0 0 20px 0; padding: 20px 20px 5px; background: #e2f0f0; overflow: hidden; }
.home .secondary p, .home .secondary li { font: italic 1em/1.5 Georgia, "Times New Roman", Times, serif; text-transform: none; letter-spacing: normal; color: #2a140a; }
.home .secondary .box-left { float: left; width: 520px; }
.home .secondary .box-right { float: right; width: 200px; }
.home #splash { width: 960px; height: 300px; }
.home #splash  img { display: none }
.home #splash img.first { display: block }


/* INTERIOR PAGES */
#content .entry-content { float: left; width: 580px; }
#content .entry-content > p:first-child { font: italic 1.2em/1.5 Georgia, "Times New Roman", Times, serif; color: #7a6c66; }

/* restaurants */
.pageid-2 #content { background: transparent url(img/corkscrew.png) center right no-repeat;  }
.pageid-2 #content .entry-content h3 { margin: 0 0 10px 0; text-transform: none; letter-spacing: .10em; }
.pageid-2 #sidebar img { visibility: hidden; } /* hide the sidebar image to avoid broken img in IE, since there isn't one */

/* the team */
.pageid-6 #sidebar { width: 220px; }
.pageid-6 #sidebar li:before { content: "» "; color: #557575;  }
.pageid-6 #sidebar img { visibility: hidden; } /* hide the sidebar image to avoid broken img in IE, since there isn't one */
.pageid-6 #content .entry-content h3 { margin: 0 0 10px 0; text-transform: none; letter-spacing: .10em; }
.pageid-6 #content .entry-content .person { clear: left; width: 700px; overflow: auto; margin: 0  0 20px 0; }
.pageid-6 #content .entry-content .photo { float: left; width: 220px; margin: 0 20px 20px 0; }
.pageid-6 #content .entry-content p { float: right; width: 460px; }

/* farm partners, philos, food is culture */
.pageid-4 #sidebar, .pageid-5 #sidebar { width: 340px; }
.pageid-5 #sidebar li { float: left; width: 100px; padding: 0 10px 0 0; }
.pageid-5 #sidebar li:last-child { padding: 0; }
.pageid-5 #sidebar li img[alt*=Bistro] { padding: 20px 0 0 0; }
.pageid-5 #sidebar li img[alt*=Restaurant] { padding: 20px 0 0 0; }
.pageid-46 #sidebar img { visibility: hidden; } /* hide the sidebar image to avoid broken img in IE, since there isn't one */

/* media inquiries */
.pageid-20 #sidebar p { margin: 20px 0 5px 0; }
.pageid-20 #sidebar p strong { font: bold 1em Arial, Verdana, sans-serif; }

/* email newsletter */
.pageid-42 form { margin: 0; padding: 15px 0 20px 15px; background: #f4f2ee; border: 1px solid #d4cabf;
	-moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; }
.pageid-42 legend { margin: 10px 0; font: 1em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase;  color: #557575; letter-spacing: .15em; }

/* contact */
.pageid-13 #sidebar img { padding: 40px 0 0 0; }

/* search, 404, etc. */
.four04 .blog-search, .search .blog-search { margin-bottom: 300px; }
.four04 h3 a:link, .four04 h3 a:visited, .search h3 a:link, .search h3 a:visited { font-style: normal; }
.search #content .entry-content, .four04 #content .entry-content { float: none; }
.search #content h3 { margin: 0; font-size: 1.25em; text-transform: none; }

/* jobs */
.pageid-7 #content ul { margin: 0; padding: 0; }
.pageid-7 #content li { list-style: none; margin: 0; padding: 0 0 10px 0; }
.pageid-7 #content li em { color: fuchsia; }
.pageid-7 #content .contact-address { font-size: 1em; }
.pageid-7 #content .contact-address li { float: left; padding: 10px 20px 10px 0; }
.pageid-7 #content ul.contact-address + li { clear: left; }

/* site credits */
.pageid-14 #sidebar img { visibility: hidden; } /* hide the sidebar image to avoid broken img in IE, since there isn't one */

/* turn off intro para on these pages */
.pageid-14 #content .entry-content > p:first-child { font-family: inherit; font-style: inherit; font-size: inherit; color: inherit; } 
/* site credits */
.pageid-20 #content .entry-content > p:first-child { font-family: inherit; font-style: inherit; font-size: inherit; color: inherit; } 
/* media inquiries */
.search #content .entry-content > p:first-child { font-family: inherit; font-style: inherit; font-size: inherit; color: inherit; } /* search */



/* blog */

img.alignleft { float: left; margin: 0 20px 0 0; }
img.alignright { float: right; margin: 0 0 0 20px; }

#posts-wrapper { float: left; width: 700px; }
.post-wrapper { float: left; width: 580px; margin: 20px 0 0 20px; }

.blog #content .entry-content,
.single #content .entry-content,
.archive #content .entry-content,
.attachment #content .entry-content{ float: none; }

.blog #content .entry-content p,
.single #content .entry-content p,
.archive #content .entry-content p,
.attachment #content .entry-content p { clear: left; }

.blog #content .entry-content > p:first-child,
.single #content .entry-content > p:first-child,
.archive #content .entry-content > p:first-child,
.attachment #content .entry-content > p:first-child { font-family: inherit; font-style: inherit; font-size: inherit; color: inherit; }

.blog .entry-content ul,
.single .entry-content ul,
.archive .entry-content ul,
.attachment .entry-content ul { padding: 10px 0 0 40px; list-style: circle; }

.blog .entry-content ol,
.single .entry-content ol,
.archive .entry-content ol,
.attachment .entry-content ol { padding: 10px 0 0 40px; list-style: decimal; }

.blog #content h2 a,
.single #content h2 a,
.archive #content h2 a, 
.attachment #content h2 a{ color: #2a140a; }

.blog #content .post h3,
.single #content .post h3,
.archive #content .post h3
.attachment #content .post h3 { margin: 10px 0 20px 0; font: bold 1.5em Helvetica, Arial, Verdana, sans-serif; text-transform: none; color: #41200c; letter-spacing: -.05em; }

.blog .entry-meta, 
.single .entry-meta,
.archive .entry-meta,
.attachment .entry-meta { clear: both; margin: 0 0 40px 0; font-size: .80em; color: #7a6c66; } 

.blog .entry-date,
.single .entry-date,
.archive .entry-date, 
.attachment .entry-date { font: italic .90em/1 Georgia, "Times New Roman", Times, serif; color: #7a6c66; }

.blog .comments-link, .single .comments-link, archive .comments-link { text-align: center; }
.blog #content .comments-link a:link, .blog #content .comments-link a:visited { font-size: .75em; color: #7a6c66; }
.blog #content .comments-link span, .single #content .comments-link span, archive .comments-link span { font-size: .75em; color: #7a6c66; }
.single #content .comments-link a:link, .single #content .comments-link a:visited { font-size: .75em; color: #7a6c66; }
.archive #content .comments-link a:link, .archive #content .comments-link a:visited { font-size: .75em; color: #7a6c66; }
.blog #content .comments-link a:hover { color: #557575; }
.single #content .comments-link a:hover { color: #557575; }
.archive #content .comments-link a:hover { color: #557575; }

.blog #nav-below, 
.single #nav-below,
.archive #nav-below { clear: left; margin: 20px 0; width: 100%; overflow: hidden; font-size: .80em; line-height: 1.25; }

.blog #nav-below .nav-previous, 
.single #nav-below .nav-previous,
.archive #nav-below .nav-previous { float: left; width: 40%; }

.blog #nav-below .nav-next, 
.single #nav-below .nav-next,
.archive #nav-below .nav-next { float: right; width: 40%; }


/* image gallery within a post */
.gallery { width: 510px; margin: 0 auto; clear: both; }
.gallery .gallery-item { float: left; }
.gallery .gallery-item .gallery-icon { width: 150px; margin: 0 20px 10px 0; }

.blog #sidebar, 
.single #sidebar,
.archive #sidebar { width: 230px; }

.blog #sidebar li, 
.single #sidebar li,
.archive #sidebar li { padding: 0 0 5px 0; line-height: 1.25; }

.blog #sidebar p, 
.single #sidebar p,
.archive #sidebar p { margin: 10px 0 20px 0; font: italic 1em Georgia, "Times New Roman", Times, serif; color: #7a6c66; }

.attachment .entry-attachment { padding: 0 0 20px 0; }
.attachment #sidebar, .attachment #nav-images { display: none; }

#sidebar h4 a:link, #sidebar h4 a:visited { color: #655949; }
#twitter-3 .entry-content { font: italic 1em/1.25 Georgia, "Times New Roman", Times, serif; color: #7a6c66; }
#twitter-3 .entry-content a:link, #twitter-3 .entry-content a:visited  { font: normal 1em Helvetica, Arial, Verdana, sans-serif;  }
#twitter-3 .entry-meta, #twitter-3 .entry-meta a:link, #twitter-3 .entry-meta a:visited { color: #655949; }
#twitter-3 .entry-meta a:hover { color: #557575; }


/* comments */

#comments h4 { margin: 20px 0 5px 0; font: bold 1em Helvetica, Arial, Verdana, sans-serif; text-transform: none; color: #7a6c66; letter-spacing: -.05em; }
.comments li { margin: 20px 0 0 0; border-bottom: 1px solid #e2f0f0; }
.comment-author { font-weight: bold; }
.comment-meta { font-size: .80em; color: #7a6c66; }  


/* Bubble with an isoceles triangle
------------------------------------------ */

.comments-bubble { float: left; width: 90px; }

.triangle-isosceles {
   position:relative;
   padding:10px;
   margin:1em 0 3em;
   background:#eee8c9;

   /* css3 */
   -moz-border-radius:10px;
   -webkit-border-radius:10px;
   border-radius:10px;
}

/* creates triangle */
.triangle-isosceles:after {
   content:"\00a0";
   display:block; /* reduce the damage in FF3.0 */
   position:absolute;
   z-index:-1;
   bottom:-20px;
   left:20px;
   width:0;
   height:0;
   border-width:10px 10px;
   border-style:solid;
   border-color:#eee8c9 transparent transparent;
}


/* 
____________________


SIDEBAR

____________________

*/

#sidebar { float: right; width: 340px; }
#sidebar p { margin: 10px 0 20px 0; font: italic .90em/1.5 Georgia, "Times New Roman", Times, serif; color: #7a6c66; }
#sidebar ul { font-size: .90em; }
#sidebar .current_page_item a:link:before, #sidebar .current_page_item a:visited:before { content: "» "; }


/* 
____________________


FOOTER

____________________

*/

#footer-wrapper { position: relative; clear: both; width: 100%; background: #3b1c0a url(img/bg-footer.png) bottom repeat-x; }
#footer { width: 960px; margin: 0 auto; padding: 5px 0 10px 0; overflow: hidden; }
#footer h5, #footer h6 {  margin: 15px 0 10px 0; font: .75em Sansumi-ExtraBoldRegular, Verdana, Arial, sans-serif; text-transform: uppercase; letter-spacing: .20em; color: #beb589; }
#footer ul, #footer p { font-size: .80em; color: #d0cbc9; }

#footer .column { float: left; width: 570px; overflow: hidden; }
#footer .column + .column { float: right; width: 230px; }
#footer h5 + p { width: 80%; }
#footer ul + p { clear: left; padding: 15px 0; }

#footer .affiliations { border: none; margin: 0; padding: 0; }
#footer .affiliations li { float: left; padding: 20px 30px 0 0; opacity: .5 }
#footer .affiliations li a:hover { opacity: .75; }

#footer .social { border: none; margin: 0; padding: 0; }
#footer .social li { float: left; padding: 0 5px 0 0; opacity: .5 }
#footer .social li a:hover { opacity: .75; }

#footer a:link, #footer a:visited { color: #beb589; text-decoration: none; }
#footer a:hover { color: #557575; 
		-webkit-transition: color 1s ease;
		-moz-transition: color 1s ease;
		-o-transition: color 1s ease;
		transition: color 1s ease;
}
#footer a:active { color: #557575; }

#footer .motto { clear: left; width: 130px; margin: 80px 0 0 0; padding: 7px 0 5px 8px; background: #557676; }
#footer .motto p { font: .75em Helvetica, Arial, Verdana, sans-serif; letter-spacing: .08em; text-transform: uppercase; text-shadow: 2px 2px 2px #56572e; }
#footer .motto p a, #footer .motto p a:hover { color: #fff; }
