/**
 * Styles for Henry's Restaurant
 * 
 * This file defines all of the main styles 
 * for Henry's Restaurant.
 *
 * @author William Dodson | Outer Banks Design Works <http://obxdesignworks.com>
 * @copyright Copyright (c) 2009 Henry's Beef and Seafood, Inc.
 * @date 2009-01-08
 * @version 0.1.0
 * @site Henry's Restaurant (http://henrysobx.com/)
 * @media screen
 */
/**
 * Colors used for Henry's Restaurant
 *
 * @colordef #A93236 (red)
 * @colordef #3D1216 (burgundy)
 * @colordef #E9E49C (pale yellow)
 * @colordef #EEECCD (cream)
 * @colordef #E1EBEC (lt. pale blue)
 * @colordef #A6C0C5 (pale blue)
 * @colordef #68787A (gunmetal blue)
 * @colordef #604F40 (cocoa)
 * @colordef #3D322A (dk. chocolate)
 */
/**
 * @section Reset CSS
 * ======================================================================
 */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

/**
 * @section Base HTML
 * ======================================================================
 */

/**
 * @section Typography
 * ======================================================================
 */
body {
 color:#3D322A;
 background:#E1EBEC url('/img/main/body-tile-bg_inner.png') repeat-x 0 0;
 font: 75%/1.5em georgia, palatino, 'palatino linotype', 'times new roman', serif;
 text-align: center;/*IE fix*/
}
body#index {
 background:#E1EBEC url('/img/main/body-tile-bg_home.png') repeat-x 0 0;
}
h1, h2, h3, h4, h5, h6 {
 font-weight:normal;
 color:#A93236;
}
h1 {
 font-size:3em;
 line-height:1;
 margin-bottom:0.5em;
}
h2 {
 font-size:4em;
 line-height:0.375em;
 margin-bottom:0.5em;
}
h3 {
 font-size: 3em;
 line-height: 0.5em;
 margin-bottom:0.75em;
}
h4 {
 font-size:2em;
 line-height: 0.75em;
 margin-bottom:1em;
}
h5 {
 font-size:1.5em;
 line-height:1em;
 margin-bottom:1.25em;
 /*text-transform: uppercase;*/
}
h6 {
 font-size:1.2em;
 font-weight:bold;
 margin-bottom:1.5em;
 text-transform: uppercase;
}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
 margin:0;
}
h1 a, h2 a, h3 a, h4 a { 
 color: #A93236 !important; 
 text-decoration: none !important; 
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover { 
 text-decoration: underline !important; 
}
p {
 margin:0 0 1.5em;
}
p img {
 float:left;
 margin:1.5em 1.5em 1.5em 0;
 padding:0;
}
p img.right {
 float:right;margin:1.5em 0 1.5em 1.5em;
}
a, a:link {
 color:#68787A;
 text-decoration:underline;
}
a:visited {
 color: #777;
}
a:hover {
 color:#A93236;
}
a:active {
 color:#000;
}
a:focus {
 color:#000;
}
a span {
 cursor: pointer;
}
blockquote {
 margin:1.5em;
 color:#777;
 font-style:oblique;
}
strong {
 font-weight:bold;
}
em {
 font-style:oblique;
}
abbr, acronym {
 border-bottom:1px dotted #777;
}
li ul, li ol {
 margin:0 1.5em;
}
ul, ol {
 margin:0 1.5em 1.5em 1.5em;
}
ul {
 list-style-type:disc;
}
ol {
 list-style-type:decimal;
}
dl {
 margin:0 0 1.5em 0;
}
dl dt {
 font-weight:bold;
}
dd {
 margin-left:1.5em;
}
table {
 margin-bottom:1.4em;
 width:100%;
}
th {
 font-weight:bold;
 background:#C3D9FF;
}
th, td {
 padding:4px 10px 4px 5px;
}
tr.even td {
 background:#f3f3f3;
}
caption {
 background:#eee;
}

/**
 * @section Global Classes
 * ======================================================================
 */
.alt {
 color: #DE9194;
 font-family: palatino, 'palatino linotype', georgia, 'times new roman', serif;
 font-style: oblique;
}
.capitalize {
 text-transform: uppercase;
}
.center {
 text-align: center;
}
.clear {
 clear: both;
}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {
 border-style: none;
 display: block;
 font-size: 0;
 height: 0;
 line-height: 0;
 margin: 0 0 0 -999em;
 padding: 0;
 width: 0;
}
.hide-all {display:none;}

.indent {
 margin-right: 1em;
 margin-left: 1em;
}
.pad-top {
 margin-top: 1.5em;
}

.quiet {color:#A6C0C5;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0 !important;padding-top:0 !important;}
.bottom {margin-bottom:0;padding-bottom:0;}
.special {
 color: #68787A;
 font-weight: bold;
}
.important {
 color: #A93236;
 margin: 0;
}
/**
 * a dumb little visual trick to give some space between 
 * our level-3 headings which follow a paragraph. You can
 * use this on any HTML combination you need to based on 
 * your IA. +1 for CSS-3 browsers, -1 for IE...
 */
p ~ h3 {
 margin-top: 1.5em;
}
/*callout styles*/
.callout {
 float: left;
 margin-bottom: 1.5em;
 width: 270px;
}
.callout h2 {
 font-size:2em;
 line-height: 0.75em;
 width: 230px;
}
.callout p {
 font-size:1.167em !important;
 line-height: 1.286em !important;
 width: 150px;
}

/**
 * @section Base Grid
 * ======================================================================
 */
#wrap {
 background: #fff url('/img/main/content-tile-bg_inner.png') repeat-y 0 0;
 margin: 0 auto;
 padding: 0;
 position: relative;
 text-align: left !important;
 width: 970px;
}
body#index #wrap {
 background: #fff url('/img/main/content-tile-bg_home.png') repeat-y 0 0;
}

#header {
 background: #E9E49C url('/img/main/header-bg.png') no-repeat 0 0;
 height: 108px;
 padding: 0 50px;
 width: 870px;
}

#nav {
 background: transparent;
 height: 108px;
 left: 415px;
 padding: 0;
 position: absolute;
 top: 0;
 width: 481px;
}

#section-heading {
 background: #A93236;
 color: #fff;
 height: 72px;
 margin: 0;
 padding: 18px 10px 18px 10px;
 position: relative;
 width: 950px;
}

#article {
 background: transparent;
 float: left;
 margin-top: 0;
 padding: 1.5em 50px 0 50px;
 width: 590px;
}

#aside {
 background: transparent;
 float: left;
 padding: 1.5em 50px 0 0;
 width: 230px;
}

#footer {
 background: transparent url('/img/main/footer-bg.png') no-repeat 0 100%;
 clear: both;
 height: 10.5em;
 padding: 90px 50px 0 50px;
 width: 870px;
}
body#index #footer {
 background: transparent url('/img/main/footer-bg_home.png') no-repeat 0 100%;
}

/**
 * @section Wrap
 * ======================================================================
 */

/**
 * @section Header
 * ======================================================================
 */
#header img {
 display: none;
}
#header h1 {
 font-size:1.5em;
 line-height:1;
 height: 72px;
 left: 20px;
 overflow: hidden;
 position: absolute;
 top: 18px;
 width: 160px;
}
#header h1 a {
 background: transparent;
 display: block;
 height: 72px;
 position: relative;
 width: 160px;
}
#header h1 a span {
 background: transparent url('/img/main/header-bg.png') no-repeat -20px -18px;
 height: 100%;
 left: 0;
 position: absolute;
 top: 0;
 width: 100%;
}
/**
 * @section Navigation (nav)
 * ======================================================================
 */
#nav ul#main-menu {
 font-weight: bold;
 list-style-type: none;
 margin: 0;
 padding: 0;
}
#nav ul#main-menu li {
 float: left;
 margin: 0 1px 0 0;
 padding: 0;
 width: 119px;
}
#nav ul#main-menu li a {
 background: #E9E49C;
 color: #3D322A;
 display: block;
 height: 108px;
 margin: 0;
 padding: 0;
 position: relative;
 width: 119px;
}
body#index #nav ul#main-menu li#tab-home a,
body#about #nav ul#main-menu li#tab-about a,
body#menu #nav ul#main-menu li#tab-menu a,
body#contact #nav ul#main-menu li#tab-contact a {
 background: #A93236;
 color: #EEECCD;
}
#nav ul#main-menu li a:hover {
 background: #fff;
 color: #A93236;
}
#nav ul#main-menu li a span {
 height: 100%;
 left: 0;
 position: absolute;
 top: 0;
 width: 100%;
}
/*nav: off*/
#nav ul#main-menu li#tab-home a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -1px -113px;
}
#nav ul#main-menu li#tab-about a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -120px -113px;
}
#nav ul#main-menu li#tab-menu a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -240px -113px;
}
#nav ul#main-menu li#tab-contact a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -360px -113px;
}
/*nav: on (you are here)*/
body#index #nav ul#main-menu li#tab-home a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -1px 0;
}
body#about #nav ul#main-menu li#tab-about a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -120px 0;
}
body#menu #nav ul#main-menu li#tab-menu a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -240px 0;
}
body#contact #nav ul#main-menu li#tab-contact a span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -360px 0;
}
/*nav: over*/
#nav ul#main-menu li#tab-home a:hover span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -1px -226px;
}
#nav ul#main-menu li#tab-about a:hover span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -120px -226px;
}
#nav ul#main-menu li#tab-menu a:hover span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -240px -226px;
}
#nav ul#main-menu li#tab-contact a:hover span {
 background: transparent url('/img/nav/nav-sprite.png') no-repeat -360px -226px;
}

/**
 * @section Section Heading (main page/section heading)
 * ======================================================================
 */
body#index #section-heading {
 background: #A93236;
 height: 198px;
}
#section-heading span {
 background: transparent;
 height: 100%;
 left: 0;
 margin: 0;
 padding: 0;
 position: absolute;
 top: 0;
 width: 100%;
}
body#index #section-heading span,
body#error-404 #section-heading span {
 background: transparent url('/img/headings/section-heading_home.png') no-repeat 0 0;
}
body#about #section-heading span {
 background: transparent url('/img/headings/section-heading_about.png') no-repeat 0 0;
}
body#menu #section-heading span {
 background: transparent url('/img/headings/section-heading_menu.png') no-repeat 0 0;
}
body#contact #section-heading span {
 background: transparent url('/img/headings/section-heading_contact.png') no-repeat 0 0;
}
#section-heading h2,
#section-heading p {
 color: #fff;
 margin-left: 370px;
}
#section-heading h2 strong {
 display: block;
 font-weight: normal;
 margin-top: 0.5em;
}

/**
 * @section Article (main page content)
 * ======================================================================
 */
#article h3 {
 font-size:2.5em;
 line-height:0.6em;
 margin-bottom:0.5em;
}
#article p,
#article li,
#article dl {
 font-size:1.333em;
 line-height: 1.125em;
}
/*article callouts*/
#article #callout-daily-special {
 background: transparent url('/img/callouts/callout-icon-dailyspecial.png') no-repeat 100% 36px;
}
#article #callout-menu {
 background: transparent url('/img/callouts/callout-icon-menu.png') no-repeat 100% 36px;
 margin-left: 50px;
}
#article #callout-about {
 background: transparent url('/img/callouts/callout-icon-about.png') no-repeat 100% 36px;
 clear: both;
}
#article #callout-sunnyday {
 height: 180px;
 margin-top: -1.5em;
 margin-left: 50px;
}
#article #callout-sunnyday h2 {
 text-align: center;
}
#article #callout-sunnyday h2 a {
 display: block;
 height: 180px;
 position: relative;
 width: 270px;
}
#article #callout-sunnyday h2 a span {
 background: transparent url('/img/callouts/callout-sunnydayguide.png') no-repeat 0 0;
 height: 100%;
 left: 0;
 margin: 0;
 padding: 0;
 position: absolute;
 top: 0;
 width: 100%;
}
/*sub-menu for sub-pages*/
#article ul.sub-menu {
 float: left;
 list-style-type: none;
 margin: 0 0 3em 0;
 padding: 0;
 width: 100%;
}
#article ul.sub-menu li {
 border-right: 1px #EEECCD solid;
 float: left;
 margin: 0 12px 0 0;
 padding: 0 12px 0 0;
}
#article ul.sub-menu li.last {
 border-style: none;
 margin-right: 0;
 padding-right: 0;
}
/*The Menu Styles: these are the styles that control the display of the menus -- do not edit!*/
body#menu #article ul.menu-list {
 float: left;
 list-style-type: none;
 margin: 0 0 3em 0;
 padding: 0;
 position: relative;
 width:100%;
}
body#menu #article ul.menu-list.short {
 margin-bottom: 1.5em;
}
body#menu #article ul.menu-list li {
 border-bottom:2px dotted #EEECCD;
 line-height:1.0;
 margin:0 0 0.5em 0;
 position:relative;
 width:100%;
 float:left;
}
body#menu #article ul.menu-list li em {
 background:#fff;
 float:left;
 margin:0;
 padding:0 5px 3px 0;
 position:relative;
 top:0.2em;
}
body#menu #article ul.menu-list li strong {
 background:#fff;
 padding:1px 0 3px 5px;
 float:right;
 position:relative;
 top:0.2em;
}
body#menu #article .indent {
 clear: both;
 margin-top: -36px;
 margin-bottom: 3em;
}

/**
 * @section Aside (sidebar)
 * ======================================================================
 */
/*aside callouts*/
#aside .callout {
 border-bottom: 0.0833em solid #EEECCD;
 padding-bottom: 1.4167em;
 /*margin-top: 1.5em;*/
 width: 243px;
}
body#index #aside .callout {
 border: none;
 margin-top: 0;
}
#aside #callout-daily-special {
 background: transparent url('/img/callouts/callout-icon-dailyspecial.png') no-repeat 110px 36px;
 margin-top: 0;
}
#aside #callout-carryout {
 background: transparent url('/img/callouts/callout-icon-carryout.png') no-repeat 110px 36px;
}
#aside #callout-directions {
 background: transparent url('/img/callouts/callout-icon-directions.png') no-repeat 110px 36px;
}
#aside #callout-hours {
 background: transparent url('/img/callouts/callout-icon-hours.png') no-repeat 110px 36px;
 border: none;
 padding-bottom: 1.5em;
}
#aside #callout-daily-special p,
#aside #callout-carryout p,
#aside #callout-directions p,
#aside #callout-hours p {
 width: 110px;
}
#aside #callout-hours ul {
 float: left;
 list-style-type: none;
 margin: 0;
 padding: 0;
 position: relative;
 width: 100%;
}
#aside #callout-hours ul li {
 border-bottom: 3px double #E1EBEC;
 font-size:1.333em;
 float: left;
 line-height: 1.125em;
 margin:0 0 0.5em 0;
 padding: 0;
 width: 100%;
}
#aside #callout-hours ul li strong {
 background:#fff;
 float:left;
 margin:0;
 padding:0;
 position:relative;
}
#aside #callout-hours ul li em.important {
 display: block;
 float:right;
 font-style: normal;
 position:relative;
}
/*
body#menu #article ul.menu-list {
 float: left;
 list-style-type: none;
 margin: 0 0 3em 0;
 padding: 0;
 position: relative;
 width:100%;
}
body#menu #article ul.menu-list li {
 border-bottom:2px dotted #EEECCD;
 line-height:1.0;
 margin:0 0 .5em 0;
 position:relative;
 width:100%;
 float:left;
}
body#menu #article ul.menu-list li em {
 background:#fff;
 float:left;
 margin:0;
 padding:0 5px 3px 0;
 position:relative;
 top:0.2em;
}
body#menu #article ul.menu-list li strong {
 background:#fff;
 padding:1px 0 3px 5px;
 float:right;
 position:relative;
 top:0.2em;

}
*/

/**
 * @section Footer
 * ======================================================================
 */
#footer p#obxdw-badge a {
 background: #fff url('/img/affiliates/obxdesignworks-favicon24px.png') no-repeat 3px center;
 border: 1px solid #7A7A69;
 border-radius: 18px;
 	-moz-border-radius: 18px;
 	-webkit-border-radius: 18px;
 color: #3D85B0;
 display: block;
 font-family: helvetica, arial, sans-serif;
 font-weight: normal;
 width: 19em;
 padding: 0.75em 3px 0.75em 31px;
 text-decoration: none;
}
#footer p#obxdw-badge a:hover {
 color: #244E66;
}
#footer p#obxdw-badge a em {
 color: #7A7A69;
 font-style: normal;
}