/* THEME NAME: Mezze THEME URI: http://www.mezzerestaurant.com DESCRIPTION: Child theme of Sandbox, custom build for Mezze Bistro + Bar, Williamstown MA VERSION: 1.0 AUTHOR: Durable Goods Design */ /* Colors teal: #0c6673 blue: #1d577b magenta: #aa0b59 text: #413737 header dark brown: #655949 header tan: #947d61 light tan: #aa9781 bg tan: #efece7 */ /* ____________________ RESET ____________________ * html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /* Mezze Bistro */ body { margin: 0; padding: 0; background: #efece7 url(img/bg-top.png) top left repeat-x; font: lighter 100%/1.5 "Arial Narrow", "Arial Condensed", "Arial Thin", Arial, sans-serif; color: #413737; } /* ____________________ HEADER ____________________ */ #header-wrapper { width: 100%; margin: 20px 0 0 0; padding:0; } #header { width: 960px; margin: 0 auto; overflow: hidden; } #access { font-size: .75em; display: none; } #meta { font: italic .75em Georgia, "Times New Roman", serif; text-transform: lowercase; } #meta .mrg a { float: left; background: transparent url(img/mrg.png) top left no-repeat; width: 121px; height: 20px; text-indent: -999px; } #meta ul { float: right; } #meta ul li { float: left; padding: 0 20px 0 0; } #meta ul li:last-child { padding: 0; } #meta ul li a:link, #meta ul li a:visited { color: #947d61; text-decoration: none; } #meta ul li a:hover { color: #413737; -webkit-transition: color 1s ease; -moz-transition: color 1s ease; -o-transition: color 1s ease; transition: color 1s ease; } #meta ul li a:active { color: #aa0b59; } #nav { clear: both; padding: 40px 0 20px 0; } #nav h1 a { float: left; background: transparent url(img/logo.png) top left no-repeat; width: 194px; height: 68px; text-indent: -999px; } #nav h1 + p { float: right; margin: 45px 0 0 0; font: italic .75em Georgia, "Times New Roman", serif; } #nav h1 + p a:link, #nav h1 + p a:visited { padding: 5px 8px 5px 9px; color: #efece7; background: #aa0b59; text-decoration: none; } #nav h1 + p a:hover { background: #0c6673; -webkit-transition: background 1s ease; -moz-transition: background 1s ease; -o-transition: background 1s ease; transition: background 1s ease; } #nav h1 + p a:active { color: #413737; background: transparent; } #nav p + p { float: right; clear: right; margin: 15px 0 0 0; font: italic .75em Georgia, "Times New Roman", serif; } #nav p + p a:link, #nav p + p a:visited { padding: 5px 8px 5px 9px; color: #efece7; background: #4a4135; text-decoration: none; } #nav p + p a:hover { background: #0c6673; -webkit-transition: background 1s ease; -moz-transition: background 1s ease; -o-transition: background 1s ease; transition: background 1s ease; } #nav ul { clear: both; margin: 0; padding: 20px 0 5px 0; font: .905em adrianna-extended, Verdana, Arial, sans-serif; text-transform: uppercase; letter-spacing: .10em; } #nav ul li { float: left; padding: 0 15px 0 0; } #nav li:last-child { padding: 0; } #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: #1d577b; border-bottom: 1px solid #1d577b; } #nav ul .current_page_item a:link, #nav ul .current_page_ancestor a:link, #nav ul .current_page_item a:visited, #nav ul .current_page_ancestor a:visited { color: #1d577b; border-bottom: 1px solid #1d577b; } #nav ul .current_page_item a:hover, #nav ul .current_page_ancestor a:hover { color: #947d61; border-bottom: 1px solid #947d61; } #nav ul li a:active { color: #aa0b59; border-bottom: 1px solid #aa0b59; } /* ____________________ CONTENT ____________________ */ #content-wrapper { width: 100%; background: transparent url(img/bg-gradient.png) bottom repeat-x; } #content { width: 960px; margin: 0 auto; overflow: hidden; } #content h2, #content h3, #content h4, #content h5 { font-family: adrianna-extended, Verdana, sans-serif; font-weight: normal; text-transform: uppercase; } #content .entry-content { width: 580px; padding: 0 0 50px 0; } #content h2 { margin: 15px 0; font-size: 1.35em; color: #947d61; letter-spacing: .08em; } #content h3 { margin: 10px 0; font-size: 1.15em; color: #0c6673; letter-spacing: .08em; } #content h4 { margin: 15px 0; font-size: 1em; color: #655949; letter-spacing: .15em; } #content p { margin: 0 0 20px 0; font-size: 1em; letter-spacing: .015em; text-shadow:0 1px 0 #fff; text-shadow:0 1px 0 rgba(255,255,255,.5); } #content p strong, #content li strong { font-weight: bold; } #content p em, #content p cite { font-style: italic; } #content small { font-size: .80em; } #content a:link, #content a:visited { text-decoration: none; color: #aa0b59; } #content a:hover { color: #0c6673; } #content a:active { color: #413737; } #content p a:link, #content p a:visited { font-family: inherit; font-style: normal; font-size: 1em; } #content input[type="text"] { padding: 5px; border: 1px solid #655949; font: italic .90em/1.5 Georgia, "Times New Roman", serif; color: #bfaa91; } #content input[type="text"]:focus { border: 1px solid #aa0b59; } #content ol { list-style: lower-alpha; } #content ul { list-style: disc; } #content hr { margin: 0 0 30px 0; color: #d4cabf; background: #d4cabf; border: none; height: 1px; } .columns { width: 960px; margin: 20px 0 0 0; padding: 0 0 20px 0; overflow: auto; } .columns .column { float: left; margin: 0 30px 0 0; } .columns .column-a { width: 460px; } .columns .column-b { width: 220px; } .columns .column-b li { list-style: none; } .columns .column-c { width: 220px; margin: 0; } /* home */ .home .columns { overflow: hidden; } .home #content h2, .home #content h4, .home #content h5 { font-family: adrianna-extended, Verdana, sans-serif; text-transform: uppercase; } .home #content h2 { margin: 0; font-size: 2.25em; color: #1d577b; letter-spacing: .07em; } .home #content h3 { margin: 10px 0; font: bold italic 1.15em/1.5 Georgia, "Times New Roman", serif; text-transform: none; letter-spacing: normal; color: #413737; } .home #content h4 { margin: 0 0 10px 0; font-size: 1.5em; color: #655949; letter-spacing: .07em; } .home #content h5 { margin: 0 0 10px 0; font-size: 1em; color: #947d61; letter-spacing: .10em; } .home #content img + p { margin: 10px 0; } .home #content .column-a h3 + p { font-size: 1.2em; } .home #content .column-b ul { margin: 0 0 20px 0; padding: 0; } .home #content .column-c h5 { margin: 10px 0 5px 0; } .home #content .column-c h5 + p { font: italic .75em/1.5 Georgia, "Times New Roman", serif; text-transform: none; letter-spacing: normal; } .home #content #splash { width: 960px; height: 300px; } #splash img { display: none; background: url(img/overlay.png); } #splash img.first { display: block } /* the restaurant */ #post-3 .entry-content { float: left; width: 520px; } #post-3 .entry-content p:first-child { font: 1.15em/1.5 Georgia, "Times New Roman", serif; font-style: italic; font-weight: bold; text-transform: none; letter-spacing: normal; color: #413737; } #post-3 .entry-content blockquote { float: right; margin: 0 0 20px 20px; padding: 20px 20px 10px 20px; width: 280px; background: #f4f2ee; border: 1px solid #d4cabf; } #post-3 .entry-content blockquote p:first-child, #post-3 .entry-content blockquote p { font: normal 1.2em/1.5 "Arial Narrow", "Arial Condensed", "Arial Thin", Arial, sans-serif; } #post-3 .entry-content blockquote p:last-child { font: .90em/1.5 Georgia, "Times New Roman", serif; font-style: italic; color: #947d61; letter-spacing: normal; text-align: right; } #post-3 #sidebar { width: 340px; } #post-3 #sidebar p { margin: 10px 0 3px 0; font: .90em/1.5 Georgia, "Times New Roman", serif; font-style: italic; color: #947d61; letter-spacing: normal; text-align: right; } #post-3 #sidebar p + p { margin: 0; font-size: .80em; } /* farm partners */ .pageid-43 .entry-content { float: left; width: 520px; } .pageid-43 .entry-content p:first-child { font: 1.15em/1.5 Georgia, "Times New Roman", serif; font-style: italic; font-weight: bold; text-transform: none; letter-spacing: normal; color: #413737; } .pageid-43 .entry-content { background: transparent url(img/bg-rake-hoe.png) top no-repeat; } .pageid-43 #sidebar { width: 340px; } .pageid-43 #sidebar p { margin: 10px 0 3px 0; font: .90em/1.5 Georgia, "Times New Roman", serif; font-style: italic; color: #947d61; letter-spacing: normal; text-align: right; } .pageid-43 #sidebar p + p { margin: 0; font-size: .80em; } /* the team */ .pageid-4 #sidebar { width: 200px; height: 600px; background: url(img/bg-whisk.png) bottom no-repeat; } .pageid-4 #sidebar h3 { margin: 0; color: #947d61; } .pageid-4 #content .entry-content { float: left; width: 700px; } .pageid-4 #content .entry-content h3 { margin: 0 0 10px 0; text-transform: none; } .pageid-4 #content .entry-content .person { clear: left; width: 700px; overflow: hidden; margin: 0 0 20px 0; } .pageid-4 #content .entry-content .photo { float: left; width: 220px; margin: 0 20px 20px 0; } .pageid-4 #content .entry-content .bio { float: right; width: 460px; } .pageid-4 #sidebar h3 { margin: 0; color: #53666c; } /* menus */ #post-5 .entry-content, .parent-pageid-5 .entry-content, #post-34 .entry-content, #post-22 .entry-content { float: left; width: 660px; overflow: hidden; } .parent-pageid-5 .entry-content h4 { text-decoration: underline; } /* #post-5 .menu-items, #post-22 .menu-items, .parent-pageid-5 .menu-items { float: left; width: 340px; } */ /* #post-5 .menu-photos, #post-22 .menu-photos, .parent-pageid-5 .menu-photos { float: right; width: 280px; } */ .pageid-38 .menu-items { float: none; width: 100%; } #post-5 #sidebar h3 .parent-pageid-5 #sidebar h3 { margin: 0; color: #53666c; } #post-5 #sidebar, .parent-pageid-5 #sidebar { height: 300px; background: url(img/bg-carrots.png) bottom no-repeat; } #post-5 #sidebar .dinner-menu a:link:before, #post-5 #sidebar .dinner-menu a:visited:before { content: "» "; } /* cultural cocktails */ .pageid-38 .entry-content p:first-child { font: 1.15em/1.5 Georgia, "Times New Roman", serif; font-style: italic; font-weight: bold; text-transform: none; letter-spacing: normal; color: #413737; } .pageid-38 .entry-content p.alignleft { float: left; clear: left; width: 175px; padding: 0 40px 10px 0; text-align: center; } .pageid-38 .entry-content p.alignleft + p { padding: 10px 0 40px 0; } /* directions */ .page-template-page-directions-php .entry-content { float: left; width: 520px; } .page-template-page-directions-php #sidebar { float: right; width: 340px; } .page-template-page-directions-php #sidebar h3 { margin: 0 0 10px 0; color: #53666c; } .page-template-page-directions-php #sidebar .map { padding: 10px 10px 20px 10px; background: #fff; } .page-template-page-directions-php #sidebar .map small a:hover { background: transparent; color: #947d61; } .page-template-page-directions-php .map + p { padding: 0 0 0 10px; } .pageid-7 .entry-content { background: transparent url(img/bg-cabbage.png) top center no-repeat; } /* press */ #post-8 .entry-content { float: left; width: 580px; background: transparent url(img/bg-sorrel.png) right center no-repeat; } #post-8 .entry-content em { font-weight: bold; color: #53666c; } #post-8 .entry-content h4 { text-decoration: underline; } /* reservations */ .pageid-6 .entry-content { float: left; width: 520px; } .pageid-6 #sidebar { float: right; width: 340px; } /* WTF "Play with Your Food" */ .pageid-39 .entry-content p:first-child { width: 90%; font: 1.15em/1.5 Georgia, "Times New Roman", serif; font-style: italic; font-weight: bold; text-transform: none; letter-spacing: normal; color: #413737; } /* 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 { margin-bottom: 200px; } /* email newsletter */ .pageid-31 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-31 legend { margin: 10px 0; font: 1em adrianna-extended, Verdana, Arial, sans-serif; text-transform: uppercase; color: #0c6673; letter-spacing: .08em; } .pageid-31 #content form + p { margin: 5px 0; font: italic .75em/1.5 Georgia, "Times New Roman", serif; letter-spacing: normal; color: #947d61; } .pageid-31 #content form + p a:link, .pageid-31 #content form + p a:visited { color: #947d61; font-style: italic; } .raspberries { width: 212px; height: 206px; background: transparent url(img/bg-raspberries.png) top right no-repeat; position: absolute; top: 0; right: 0; z-index: -1; } /* ____________________ SIDEBAR ____________________ */ #sidebar { float: right; width: 280px; } #sidebar p, #sidebar ul { margin: 10px 0; font: italic .90em/1.5 Georgia, "Times New Roman", serif; letter-spacing: normal; } #sidebar ul { margin: 0; padding: 0; list-style: none; } #sidebar .current_page_item a:link:before, #sidebar .current_page_item a:visited:before { content: "» "; } /* ____________________ FOOTER ____________________ */ #footer-wrapper { clear: both; width: 100%; background: #f4f2ee url(img/bg-pig.png) center no-repeat; border-top: 1px solid #d4cabf; } #footer { position: relative; width: 960px; margin: 0 auto; padding: 10px 0 40px 0; } #footer h5, #footer h6 { margin: 0 0 10px 0; font: .85em adrianna-extended, Verdana, Arial, sans-serif; text-transform: uppercase; letter-spacing: .15em; color: #53666c; } #footer ul, #footer p { font: italic .75em/1.5 Georgia, "Times New Roman", serif; color: #aa9781; } #footer .column { margin: 0; } #footer .column:first-child { width: 740px; } #footer .affiliations li { float: left; padding: 20px 30px 0 0; } #footer .affiliations li a:hover { opacity: .5; } #footer .copyright { clear: both; padding: 10px 0 0 0; } #footer .copyright ul li { float: left; padding: 0 10px 0 0; } /* about column */ #footer h5 + p { width: 460px; } /* contact column */ #footer .column:last-child { margin: 0; } #footer .column:last-child ul + ul { padding: 10px 0 0 0; } #footer .column:last-child ul + ul li { float: left; width: 30px; } #footer ul + ul li a { opacity: .75; } #footer ul + ul li a:hover { opacity: .5; } #footer ul + p { clear: left; font-size: .90em; } #footer a:link, #footer a:visited { color: #947d61; text-decoration: none; } #footer a:hover { color: #0c6673; -webkit-transition: color 1s ease; -moz-transition: color 1s ease; -o-transition: color 1s ease; transition: color 1s ease; } #footer a:active { color: #aa0b59; } #footer .motto { position: absolute; bottom: 20px; right: 20px; padding: 5px; background: #796e5e; } #footer .motto p { font: bold .75em/.75 Helvetica, Arial, Verdana, sans-serif; color: #fff; letter-spacing: .15em; text-transform: uppercase; text-shadow: 2px 2px 2px #56572e; } #footer .motto p a { color: #fff; } /* open table */ #OT_searchWrapperAll{width:520px;height:150px;position:relative;margin:0 0 60px 0;padding:0;background: #f4f2ee;} #OT_searchWrapper{ background: #f4f2ee; border: 1px solid #d4cabf;height:150px;position:relative;margin:0;padding:20px 0 20px 20px;} #OT_searchWrapper .OT_feedTitle {position:absolute;top:0;left:0;margin:10px 0 0 10px;} #OT_searchWrapper dl{position:absolute;top:0;left:0;padding:0;margin:15px 0 0 0;} #OT_partySizeLbl{position:absolute;top:25px;left:0;margin:0 0 0 5px;padding:3px 0;text-align:right;width:110px;display:block;} #OT_partySize{position:absolute;top:25px;left:120px;margin:0;padding:0;} #OT_dateLbl{position:absolute;top:55px;left:0;margin:0 0 0 5px;padding:3px 0;text-align:right;width:110px;} #OT_date{position:absolute;top:55px;left:120px;width:100px;margin:0;padding:0;} #OT_timeLbl{position:absolute;top:55px;left:210px;width:60px;padding:3px 0;text-align:right;} #OT_time{position:absolute;top:55px;left:275px;margin:0;} #OT_empty{position:absolute;width:0;height:0;padding:0;margin:0;top:100px;left:0;} #OT_submitWrap{position:relative;top:115px;left:275px;margin:0 5px 0 0;z-index:5;} #OT_logo{position:absolute;top:120px;left:0;width:100%;padding:0;margin:0;display:block;} #OT_logoLink{position:absolute;top:100px;left:0;width:100%;padding:25px 0 10px 0;margin:0;display:block;} #OT_logoLink a{padding:0 0 0 10px;} #OT_logoLink a:link, #OT_logoLink a:visited { font-family: inherit; font-style: normal; font-size: 1em; } #OT_imglogo{border:0;margin:15px 0 0 15px;} #OT_searchWrapper form{margin:0;padding:0;} #OT_searchWrapper input.hidden{display:none;} #OT_searchWrapper .feedFormField,#OT_searchWrapper .feedFormField option{font-size:12px;margin:2px 2px 2px 2px;} #OT_searchWrapper #startDate, #OT_searchWrapper .OT_feedFormfieldCalendar{margin:0;width:85px;} #OT_searchWrapper #dateDisplay{float:right;margin:0 30px 0 0;display:inline;} #OT_searchWrapper .imgCal{position:absolute;display:none;z-index:100;} #OT_searchWrapper #imageCal table{font-size:12px;width:150px;font-family:arial;font-weight:bold;background:#FFF;} #OT_searchWrapper #imageCal td{padding:0;text-align:center;} #OT_searchWrapper .clickableDays{color:#000;text-decoration:none;height:18px;} #OT_searchWrapper .nonclickableDays{color:#CCC;height:18px;} #OT_searchWrapper .months{color:#FFF;text-decoration:none;} #OT_searchWrapper .weekdays{color:#000;text-decoration:none;color:#666;background-color:#EFEFEF;width:14%;}