﻿/* Revised version of CSS for HTML 5 version of site */

/* YUI values - px to %, ± means calculated by WF, not YUI ========================= 
**    8 -> 63 ±    13 -> 100       18 -> 138.5     23 -> 174    28 -> 212 ±  
**    9 -> 70 ±    14 -> 108       19 -> 146.5     24 -> 182    29 -> 220 ±
**   10 -> 77      15 -> 116       20 -> 153.9     25 -> 189    30 -> 227 ±
**   11 -> 85      16 -> 123.1     21 -> 161.6     26 -> 197    31 -> 235 ±
**   12 -> 93      17 -> 131       22 -> 167       27 -> 205 ±  32 -> 242 ±
** YUI values - End =============================================================== */

/* Important Colors 
  #741e11 - headings, "Italian Deep Red"
*/

/* Trunk's light reset */
body,div,dl,dt,dd,
ul,ol,li,
h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea, 
/*p,*/
blockquote,th,td {
	margin: 0; 
	padding: 0;
}

html {
	color: black;
	background-color: #F4E4A6; 
}

/* Dynamic Version of Site -------------------------------------------------- */
body {
	margin: 0;
	padding: 0;
	color: black;
	background-color: #F4E4A6; 
	font: 13px/1.231 'trebuchet ms',arial,helvetica,clean,sans-serif;
}
/* Layout */
.centering-container {
	width: 970px;
	margin: 0 auto;
}
.outer-top {
	height: 20px;
	background-image: url('/../../../../img/dynamic/outer-top-2.png');
	background-repeat: no-repeat;
}
.outer-content {
	position: relative;
/*	min-height: 1200px;*/  /* for testing only */
	background-image: url('/../../../../img/dynamic/outer-middle-2.png');
	background-repeat: repeat-y;
	padding-top: 8px;
}
.outer-bottom {
	height: 20px;
	background-image: url('/../../../../img/dynamic/outer-bottom-2.png');
	background-repeat: no-repeat;
	/*margin-bottom: 8px;*/ /* .footer follows */
}
.inner-container {
	width: 948px;
	margin: 0;
}
.left-stack { float: left;
	position: relative;
	width: 290px;
	margin-left: 20px;
}
.menu-box {
	position: relative;
	margin: 105px 0 12px 24px;
	padding: 50px 10px 5px 10px;
	width: 201px;
/*	min-height: 600px;*/  /* testing */
	background-color: white;
	border: 6px #6d0d0e solid;
	border-radius: 15px;
}
.logo { /* Make the logo sit on top of the menu box, hiding the upper rounded corners */
	position: absolute;
	top: -105px;
	left: -30px;
	height: 156px;
	width: 290px;
	background-image: url('/../../../../img/dynamic/logo-290.png');
	background-repeat: no-repeat;
}
.social-left-nav { 
	height: 32px;
	padding: 10px 0;
	text-align: center;
}
.restaurant_guru_badge {
	width: 170px;
	margin: 0 auto 10px auto;
}
.restaurant_ji_badge {
	width: 170px;
	margin: 0 auto 10px auto;
}
.right-container { float: left;
	width: 638px;
	margin: 0;
}
.right-top {
	width: 638px;
	height: 20px;
	background-image: url('/../../../../img/dynamic/inner-top-638.png');
	background-repeat: no-repeat;
}
.right-bottom { position: relative;
	width: 638px;
	height: 15px;
	background-image: url('/../../../../img/dynamic/inner-bottom-638.png');
	background-repeat: no-repeat;
	padding-bottom: 20px;
}
/* Caveats for catering pages */
.catering-caveats {
	width: 580px;
	margin: 30px auto 10px auto;
	text-align: center;
	font-size: 12px;
	font-style: italic;
	color: black;
}
/* Menu caveats live inside the right bottom div */
.menu-caveats { position: absolute;
	top: -8px;
	left: 0;
	width: 638px;
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 10px;
	font-style: italic;
	color: black;
}

.right-content-container { 
	width: 638px;
	background-image: url('/../../../../img/dynamic/inner-middle-638.png');
	background-repeat: repeat-y;
}
.right-content { 
	width: 596px;
	min-height: 665px;
	margin-left: 12px;
	margin-top: -5px; /* pushes the map up into .inner-top */
	background-image: url('/../../../../../../img/dynamic/map.jpg');
	background-repeat: no-repeat;
	padding: 5px 16px 20px 12px; /* thick padding at the bottom to stay away from the menu-caveats */
}
/* -------------------------------------------------------------------------- */

/* Styles */

a{color:#000000;text-decoration:none;}

a:hover{color:#daa520};

abbr,acronym{border-bottom:1px dotted #666666;font-variant:normal;}

address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}

caption,th{text-align:left;}

code{border:1px solid #cccccc;padding:10px;margin:10px 0px;display:block;background:#252525;}

div{position:relative;}

div.message{float:left;width:49%;padding:2px;text-align:center;position:relative;}

div.message textarea{border:1px solid #C8A767;width:90%;color:#333333;background:#8b8b8b none repeat scroll 0% 0%;height:107px;}

em{font-style:italic;}

strong{font-weight:bold;}

fieldset,img{border:0;}

/* Tuned up by WF */
h1, h2, h3, h4, h5, h6 { 
	font-size: 100%; 
	font-weight: normal;
	color: #741E11;
}

h1, .sameAsh1 { 
	font-size: 150%;
	padding-left: 5px;  
}
h2, .sameAsh2 { 
	font-size: 130%;
}
h3 {
	font-size: 110%;
}
/* Spacing for following paragraphs and bulleted lists */
h2+p, h3+p, h4+p, h5+p, h6+p      { margin-top: 2px; padding-top: 0; }
h2+ul, h3+ul, h4+ul, h5+ul, h6+ul { margin-top: 2px; padding-top: 0; }


img.alignright,img.alignleft{margin:10px 20px;padding:4px;display:inline;}

input,textarea,select{font:inherit inherit inherit;}

/*to enable resizing for IE*/

/* input,textarea,select{*font-size:100%;} */

/*because legend doesn't inherit in IE */

legend{color:#000;}

li{list-style:none;}

ol.comments a{color:#E13768;}

pre,code,kbd,samp,tt{font-family:monospace;line-height:100%;font-size:108%;}

q:before,q:after{content:'';}

sub{vertical-align:text-bottom;}

sup{vertical-align:text-top;}

table{border-collapse:collapse;border-spacing:0;}

/*table { font-size:inherit; font:100%;}*/

/*.price{text-align:center;color:#FFF;padding:3px 5px 3px 5px;background:#000;font-weight:bold;}*/
/*.price { text-align: center; color: white; padding: 5px; background: black; font-weight: bold;}*/
/* see .menu-items td.price */

.footer {
	padding:5px 0px 5px 0px;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #000000;
}

.menuLink{color:#741E11;font-size:130%;}

.menuLinkActive{color:#003300;font-size:130%;}

.frontPage{
	color:#990000;
	font-size : 150%;
	font-family : cursive;
	padding-bottom: 10px;
}

.spotLight{
	color:#990000;
	font-family : cursive;
}

a.underline{
	text-decoration: underline;
}

a:hover{
	text-decoration: none;
}

.label{color:#741E11;font-size:130%;}



input {
	border: 2px solid #741E11;
	padding:1px 1px 1px 1px;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
}
input[type=submit] {
	border: 2px solid #741E11;
	padding: 3px;
	font-size: 17px;
	font-style: normal;
	font-weight: bold;
	color: black;
}

input:focus {
	border: 2px solid #003300;
	background:#ffffff;
}

select {
	border: 2px solid #741E11;
	padding:1px 1px 1px 1px;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
}

select:focus {
	border: 2px solid #003300;
	background:#ffffff;
}

textarea {
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	padding:1px 1px 1px 1px;
	border: 3px solid #741E11;
}

textarea:focus {
	border: 3px solid #003300;
}

/* Styles taken from individual pages */

td.homePageLarge {
	font-weight: bold;
	color: #990000;
	font-family: Palatino Linotype, Book Antiqua3, Palatino, serif;
	font-size: 180%;
}


/* Will's Added Styles -------------------------------- */

a.standard-link {
	text-decoration: underline;
	color: blue;
}
a.standard-link:hover {
	color: #741e11;
}

/* Template */
.footer-box {
	padding: 5px 0px 5px 0px;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: black;
	text-align: center;
}
.footer-box.info {
/*	font-size: larger;*/
	font-size: 16px;
}
.footer-box.info.phone {
	font-size: 18px;
}
.footer-copyright {
	text-align: center;
	padding-top: 4px; padding-bottom: 20px; 
	font-size: 12px; 
	font-style: italic
}
.footer-copyright a {
	color: black;
	text-decoration: none;
}
.footer-copyright a:hover {
	color: #990000;
}

/* Home Page */
.home-page-title {
	text-align: center;
	margin-bottom: 10px;
}
.home-page-store-image {
	text-align: center;
	margin-bottom: 10px;
}
.home-page-ordering {
	width: 100%;
	border-top: 1px #990000 solid;
	border-bottom: 1px #990000 solid;
	margin: 10px 0;
}
.home-page-ordering td {
	padding: 5px;
	text-align: center;
}
.home-page-ordering-legend {
	font-weight: bold;
	color: #990000;
	font-family: Palatino Linotype, Book Antiqua3, Palatino, serif;
	font-size: 180%;
}
.home-page-ordering-coupon {
	margin-top: 4px;
}
.old-table-rule {
	height: 1px;
	border: 0;
	background-color: #990000;
}

/* Old-Style Menu Pages */

.menu-area {
	color: #741E11;
	font-size: 150%;
	border-bottom: 1px solid #990000;
}
.menu-heading {
	color: #741E11;
	font-size: 150%;
}
.menu-items { /* wrapper table for old-style menu pages */  /* can I make this full width (96%) */
	font-size: 13px;
	margin-top: 2px; /* to force table below page heading */
}
.menu-items td {
	padding: 0;
}
.menu-items td.unit-legend {
	white-space: nowrap;
	text-align: right;
	padding-right: 5px;
	padding-left: 5px;
}
.menu-items td.price { 
	white-space: nowrap;
	text-align: right; 
	color: black;
	background-color: transparent; 
	padding: 5px 8px 5px 5px; 
	font-weight: bold;
}
.menu-items td.price-tight {
	padding-top: 0px;
	padding-bottom: 1px;
}
.menu-items td.description {
	padding: 0 5px 0 10px;
}
.menu-items td.info {
	padding: 0 5px 0 10px;
	font-style: italic;
}
.menu-items td.details {
	padding: 0 5px 0 30px;
	font-style: italic;
}
.menu-items td.spacer-group {
	height: 6px;
}
.menu-items td.spacer-group-double {
	height: 12px;
}
.menu-items td.spacer-line {
	height: 0px;
}
.menu-items td.spacer-line-force {
	height: 1px;
}
.menu-items td.spacer-line-subs { /* for store menu subs & sandwiches */
	height: 3px;
}

.menu-items .col-name {
	width: 100%;
}
.menu-items .col-units {
/*	width: 100px;*/
}
.menu-items .col-price {
/*	width: 100px;*/
}

.ai-bullet-list {
	font-weight: bold;
}

.daily-specials {
	
}
.daily-specials td {
	font-weight: bold;
	color: #990000;
	font-family: 'Trebuchet MS', Helvetica, sans-serif;
}
.daily-specials td.homePageLarge {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 180%;
}
.daily-specials td.homePageMedium {
	font-size: 130%;
}
.daily-specials td.homePageSmall {
	text-align: right;
	font-size: 130%;
}

/* Menu Page caveats */
.menu-conditions { position: absolute; bottom: 0; left: 310px;
	width: 560px;
	height: 70px;
	vertical-align: top;
	text-align: center;
	font-size: 77%;
	font-style: italic;
	color: black;
}

/* Menu Navigation Page (/menus/index.php) */
.menus-page-table {
	border: 0;
	border-collapse: collapse;
	font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
	font-size: 153.9%;
	text-align: center;
}
.menus-page-table td {
	width: 250px;
	vertical-align: top;	
}
.menus-page-table td p.menu-group-name {
	font-size: larger;
	font-weight: bold;
	color: #990000;
}
.menus-page-table td a {
	color: black;
	text-decoration: none;
}
.menus-page-table td a:hover {
	color: #990000;
	cursor: pointer;
}

/* Generic */

.image-centered, .centerme {
	text-align: center;
}

.image-left  { float: left;  padding: 0; margin: 0 10px 0 0; }
.image-right { float: right; padding: 0; margin: 5px 0 5px 10px; }

/* Table-based image-caption system */
.image-caption-left {
	float: left;
	margin: 2px 15px 10px 0px;
/*	border: 1px #333 solid;*/
	background-color: transparent;
}
.image-caption-right {
	float: right;
	margin: 2px 0px 10px 15px;
/*	border: 1px #333 solid;*/
	background-color: transparent;
}
.image-caption-center {
	margin: auto auto;
}
.image-caption-left td, .image-caption-right td, .image-caption-center td {
	vertical-align: top;
	text-align: center;
	color: #222;
	font-size: 93%;
	font-style: italic;
	line-height: 1.1;
}
.image-caption-left td img, .image-caption-right td img, .image-caption-center td img {
	display: block;
	border: 1px solid #222 !important;
	border: 0;
}
.image-caption-left td.image-caption, .image-caption-right td.image-caption, .image-caption-center td.image-caption {
	padding: 3px;
	padding-bottom: 5px;
	text-align: left;
}
.image-caption-center td.image-caption {
	text-align: center;
}
.image-caption-left td.image-caption.left, .image-caption-right td.image-caption.left {
	text-align: left;
}
.image-caption-left td.image-caption.center, .image-caption-right td.image-caption.center {
	text-align: center;
}
.image-caption-left td.image-caption.right, .image-caption-right td.image-caption.right {
	text-align: right;
}
.image-caption-left td p, .image-caption-right td p, .image-caption-center td p {
	margin: 3px;
	padding: 3px;
	color: #222;
	font-size: 93%;
	line-height: 1.1;
}

.arial {
	font-family: Arial, Helvetica, sans-serif;
}
.fineprint, .smallprint, .italicize { font-style: italic; }
.fineprint  { font-size: 85%; }
.smallprint { font-size: 93%; }

.boldme { font-weight: bold; }
.mark-notice {
	color: maroon;
}
.mark-red, .mark-error {
	color: red;
}
.clear, div.clear, .clearboth {
	clear: both;
}

.page-title {
	color: #741E11;
	font-size: 150%;
	border-bottom: 1px solid #990000;
	margin-bottom: 4px;
}


/* Styles for Online Ordering pages */
.ordering-heading {
	margin-top: 15px;
/*	padding-left: 5px;*/
	color:#741E11;
	font-size:150%;
}

/* Information Display Panels */
.information-display {
	font-size: 15px;
/*	padding-left: 15px;*/
	padding-right: 25px;
}

/* Columbus Day */
.columbus-day {
	width: auto;
	border: 2px #990000 solid;
	margin: 10px;
	background-color: white;
	padding: 5px 10px;
	font-size: 20px;
	text-align: center;
}
.make-me-left {
	text-align: left;
}
.title {
	font-size: 28px;
	font-weight: bold;
}
.date {
	font-size: 20px;
	font-style: italic;
}
.ships {
	float: right;
}
a.detail-link {
	color: #741e11;
	text-decoration: underline;
}
a.detail-link:visited {
	color: #741e11;
}
a.detail-link:hover {
	color: darkgreen;
}
.columbus-day-flyer-table {
	border-collapse: collapse;
	border: 0;
}
.columbus-day-flyer-table td {
	vertical-align: middle;
	padding: 5px 20px;
}
.columbus-day-flyer-table td img {
	display: block;
	border: 1px solid black;
	box-shadow: 5px 5px 5px silver;
}
.columbus-day-flyer-table td img:hover {
	box-shadow: 5px 5px 5px gray;
}
.columbus-day hr {
	height: 2px;
	background-color: #741e11;
}
.donations {
	font-size: smaller;
	font-style: italic;
}

/* Ordering Buttons */
.aio-ordering-sprite {
	display: inline-block;
	width: 142px;
	height: 142px;
	background-image: url('/img/sprites/order-online-sprite.png');
	background-repeat: no-repeat;
	background-position: 0 0;
}
.aio-ordering-sprite:hover {
	background-position: -142px 0;
}

/* Christmas Gift Basket widget */
.xmas-gift-basket-widget {
	margin-top: 4px;
	border-top: 1px solid #990000;
	padding-top: 4px;
	font-size: 15px;
	line-height: 1.2;
}
.xmas-gift-basket-widget .xmas-gift-basket-widget-title {
	font-family: "IM Fell English SC", script;
	color: maroon;
	font-size: 40px;
	text-align: center;
}
.xmas-gift-basket-widget .xmas-gift-basket-widget-image {
	width: 596px;
	height: 458px; /* 428+20+10 */
	background-color: transparent;
	background-image: url('../img/christmas/gift-baskets.jpg');
	background-repeat: no-repeat;
	background-position: center 20px;
}

/* December coupons - first shown in 2022 */
.xmas-coupons-widget {
	margin-top: 4px;
	border-top: 1px solid #990000;
	padding-top: 4px;
	font-size: 15px;
	line-height: 1.2;
	font-family: "IM Fell English SC", script;
	color: maroon;
}
.xmas-coupons-widget .xmas-coupons-title {
	font-size: 40px;
	text-align: center;
}
.xmas-coupons-widget .xmas-coupons-image {
	border: 2px solid green;
	display: block;
}


/* Holiday Hours Widget */
.holiday-hours-widget {
	margin-top: 4px;
	border-top: 1px solid #990000;
	padding-top: 4px;
	font-size: 15px;
	line-height: 1.2;
	text-align: center;
}
.holiday-hours-widget .title {
	font-family: "IM Fell English SC", script;
	color: maroon;
	font-size: 24px;
	text-align: center;
}

/*	Buttons - Kevin Hale, ParticleTree, 2007
		Modified by WF for colors, borders, some behaviors, and to change hover behaviors to allow for a border radius
		18 Aug 2016 - modifications to use inline-block so a button or group can be centered
*/
.buttons.right { float: right; } /* to float a group (div) of left-aligned buttons to the right - WF ----------- */

.buttons a, .buttons button {
/*    display: block;*/
    display: inline-block; /* WF 18 Aug 2016 - a modern update */
    float: left;
    margin: 0 7px 0 0;
    background-color: #f5f5f5;
    border: 1px solid #aaa;  /* wf - darker */ 
    border-top-color: #ccc;  /* wf - darker */ 
    border-left-color: #ccc; /* wf - darker */ 
    color: #333;
    border-radius: 10px;
    font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    font-size: 100%;
    line-height: 130%;
    text-decoration: none;
    font-weight: bold;
    cursor: pointer; /* wf - AHA! */
    padding: 5px 10px 6px 7px; /* Links */
}
.buttons a:visited, .buttons button:visited {
	color: #333;
}
.buttons a.right, .buttons button.right {
	float: right;
}
.buttons a.none, .buttons button.none { /* WF 18 Jun 2016 - to remove float to allow centering */
	float: none;
}
.buttons button {
    width: auto;
    overflow: visible;
    padding: 4px 10px 3px 7px; /* IE6 */
    outline: none;
}
.buttons button[type] {
    padding: 5px 10px 5px 7px; /* Firefox */
    line-height: 17px; /* Safari */
}
*:first-child+html button[type] {
    padding: 4px 10px 3px 7px; /* IE7 */
}
.buttons button img, .buttons a img {
    margin: 0 3px -3px 0 !important;
    padding: 0;
    border: none;
    width: 16px;
    height: 16px;
    float: none !important;
}
/* STANDARD (default) */
button:hover, .buttons a:hover {
    background-color: #dff4ff;
    border-color: #c2e1ef; /* wf - Changed border to border-color here and almost everywhere below */
    color: #336699;
    color: black;
}
button:visited:hover, .buttons a:visited:hover {
	color: black;
}
/* MIDDLE - wf */
button.middle, .buttons a.middle {
    background-color: #f5f5f5;
    color: #6196cc; /* dull blue */
}
.buttons a.middle:hover, button.middle:hover {
    background-color: #dff4ff;
    border-color: #9fbfe0;
    color: #336699;
}
.buttons a.middle:visited:hover, button.middle:visited:hover {
		color: #336699;
}
/* POSITIVE */
button.positive, .buttons a.positive {
    color: #529214;
}
.buttons a.positive:hover, button.positive:hover {
    background-color: #E6EFC2;
    border-color: #C6D880;
    color: #529214;
}
.buttons a.positive:visited:hover, button.positive:visited:hover {
    color: #529214;
}
/* NEGATIVE */
.buttons a.negative, button.negative {
    color: #d12f19;
}
.buttons a.negative:hover, button.negative:hover {
    background: #fbe3e4;
    border-color: #fbc2c4;
    color: #d12f19;
}
.buttons a.negative:visited:hover, button.negative:visited:hover {
    color: #d12f19;
}

.main-action-button {
	padding-top: 30px !important;
}
.special-action-group {
	margin-top: 150px;
}
.special-action-group.half-top {
	margin-top: 75px;
}
.special-action-group.top {
	margin-top: 10px;
}

.special-action {
}
.special-action a {
	margin-bottom: 5px;
}


.covid-19-notice {
	border: 4px #1B7CBF solid;
	background-color: cornsilk;
	font-size: 16px;
	padding: 6px 8px;
}
.covid-19-notice h6 {
	font-size: 24px;
	text-align: center;
	font-weight: bold;
	color: crimson;
}
.covid-19-link {
	color: crimson;
	text-decoration: underline;
}
.covid-19-link:hover {
	color: #1B7CBF;
}

.covid-19-notice ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}
.covid-19-notice ul li {
	list-style: disc;
}
