@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,300,700);

body { background: #fff; font-family: 'Open Sans', Helvetica, Arial, sans-serif; color: #444; text-align: center; }

h2, h1 { font-weight: 300; color: #4b4577; font-size: 36px; line-height: 24px; margin: 0 0 30px 0; padding: 0; }
h3 { font-weight: 700; color: #4b4577; font-size: 22px; line-height: 24px; margin: 0 0 20px 0; padding: 0; }

h3 span { font-weight: 700; color: #999999; font-size: 18px; line-height: 24px; margin: 0 0 20px 0; padding: 0; }

h4 { font-weight: 300; color: #4b4577; font-size: 22px; line-height: 24px; margin: 0; padding: 0; }
p { font-weight: 300px; color: #444; font-size: 14px; line-height: 24px; margin: 20px 0; padding: 0; }
p.small,
li.small { font-size: 10px; line-height: 14px; }
p.email { margin: 0 0 20px 0; }
ul { line-height: 24px; margin: 20px 0; padding: 0 0 0 20px; list-style: circle; }
li { font-weight: 300px; color: #444; font-size: 14px; line-height: 24px; }
em { font-style: italic; }
strong { font-weight: 700; }

a { color: #645d9f; text-decoration: underline; }
a:hover { color: #3b3664; text-decoration: none; }

h2.menu { margin: 0; }
h3 a { text-decoration: none; }

#container { width: 1020px; margin: 0 auto; padding: 0; text-align: left; }

#header { margin: 0; padding: 0; }
#header h1, #headerLogo { width: 200px; height: 200px; float: left; }
#header h1 a, #headerLogo a { display: block; text-indent: -9999px; width: 200px; height: 200px; background: url(../img/graphics.gif) no-repeat 0 -470px; }



/* New Pie Hole Menu */
#header ul { margin: 0 0 0 200px; padding: 120px 0 50px 0; height: 30px; width: 820px; list-style: none; }
#header ul li { margin: 0; padding: 0; height: 30px; float: left; }
#header ul li a { display: block; margin: 0 28px 0 0; padding: 0; height: 30px; background: url(../img/graphics.gif) no-repeat; text-indent: -9999px; }
#header ul li #pieholemenulink { width: 60px; background-position: 0 -1339px; }
#header ul li #pieholemenulink:hover { background-position: 0 -1309px; }
#header ul li #pieholemenulink.selected { background-position: 0 -1399px; }
#header ul li #pieholemenulink.selected:hover { background-position: 0 -1369px; }
#header ul li #pieholecoffee { width: 79px; background-position: -88px -1339px; }
#header ul li #pieholecoffee:hover { background-position: -88px -1309px; }
#header ul li #pieholecoffee.selected { background-position: -88px -1399px; }
#header ul li #pieholecoffee.selected:hover { background-position: -88px -1369px; }
#header ul li #pieholelocation { width: 109px; background-position: -196px -1339px; }
#header ul li #pieholelocation:hover { background-position: -196px -1309px; }
#header ul li #pieholelocation.selected { background-position: -196px -1399px; }
#header ul li #pieholelocation.selected:hover { background-position: -196px -1369px; }
#header ul li #pieholeshop { width: 149px; background-position: -333px -1339px; }
#header ul li #pieholeshop:hover { background-position: -333px -1309px; }
#header ul li #pieholeshop.selected { background-position: -333px -1399px; }
#header ul li #pieholeshop.selected:hover { background-position: -333px -1369px; }
#header ul li #pieholepress { width: 65px; background-position: -510px -1339px; }
#header ul li #pieholepress:hover { background-position: -510px -1309px; }
#header ul li #pieholepress.selected { background-position: -510px -1399px; }
#header ul li #pieholepress.selected:hover { background-position: -510px -1369px; }
#header ul li #pieholeabout { width: 70px; background-position: -603px -1339px; }
#header ul li #pieholeabout:hover { background-position: -603px -1309px; }
#header ul li #pieholeabout.selected { background-position: -603px -1399px; }
#header ul li #pieholeabout.selected:hover { background-position: -603px -1369px; }
#header ul li #pieholefranchise { margin: 0; width: 115px; background-position: -700px -1339px; }
#header ul li #pieholefranchise:hover { background-position: -700px -1309px; }
#header ul li #pieholefranchise.selected { background-position: -700px -1399px; }
#header ul li #pieholefranchise.selected:hover { background-position: -700px -1369px; }


p.pressitem { height: 110px; background: #f9f9f9; border: 1px solid #aaa; }
p.pressitem a { display: block; text-decoration: none; }
p.pressitem a img { float: left; border: 5px solid #d1cee1; margin: 5px 0 0 5px; }
p.pressitem a em { margin: 5px 0 0 10px; display: inline-block; }
p.pressitem a strong { margin: 0 0 0 10px; display: inline-block; font-size: 18px; color: #333; }
p.pressitem a span { margin-left: 10px; display: inline-block; text-decoration: underline; }
p.pressitem a span:hover { text-decoration: none; }



/*
#home #header { padding: 60px 0 30px 70px; }
#home #header h1 { width: 470px; height: 470px; margin: 0 0 50px 170px; float: none; }
#home #header h1 a { width: 470px; height: 470px; background-position: 0 0; }
#home #header ul { margin: 0; width: 820px; padding: 0; }
#home #header ul li a { margin: 0 38px 0 0; }
*/
#gallerycontainerhome {
    width: 467px;
    height: 700px;
    margin: 0;
    padding: 0;
    margin-left: 109px;
    margin-bottom: 30px;
}
#gallerycontainerhome img { border: 10px solid #d1cee1; box-shadow: 0 0 25px #a9a6c1; -moz-box-shadow: 0 0 25px #a9a6c1; -webkit-box-shadow: 0 0 25px #a9a6c1; }
#gallerycontainer { width: 760px; height: 510px; margin: 0; padding: 0; }
#gallerycontainer img { border: 10px solid #d1cee1; box-shadow: 0 0 25px #a9a6c1; -moz-box-shadow: 0 0 25px #a9a6c1; -webkit-box-shadow: 0 0 25px #a9a6c1; }

#map { border: 10px solid #d1cee1; box-shadow: 0 0 25px #a9a6c1; -moz-box-shadow: 0 0 25px #a9a6c1; -webkit-box-shadow: 0 0 25px #a9a6c1; margin: 20px 0; padding: 0; height: 500px; width: 820px; }
#map-Location { border: 10px solid #d1cee1; box-shadow: 0 0 25px #a9a6c1; -moz-box-shadow: 0 0 25px #a9a6c1; -webkit-box-shadow: 0 0 25px #a9a6c1; margin: 0; padding: 0; height: 500px; width: 820px; display: block; }
#video { border: 10px solid #d1cee1; box-shadow: 0 0 25px #a9a6c1; -moz-box-shadow: 0 0 25px #a9a6c1; -webkit-box-shadow: 0 0 25px #a9a6c1; margin: 20px 0; padding: 0; height: 416px; width: 740px; }

#main { margin: 0; padding: 0 0 30px 200px; background: url(../img/lax.png) no-repeat top left; }


#footer { width: 630px; padding: 0 0 30px 330px; margin: 0; }
/*#home #footer { width: 730px; padding: 0 0 30px 230px; } */
#footer p { width: 440px; margin: 0; padding: 0; }
#footer ul { width: 440px; height: 32px; margin: 0; padding: 0 0 20px 15px; list-style: none; }
#footer ul li { height: 32px; float: left; margin: 0 10px 0 0; padding: 0; }
#footer ul li a { display: block; height: 32px; background: url(../img/graphics.gif) no-repeat; text-indent: -9999px; margin: 0; padding: 0; }
#footer ul li #twitter { width: 32px; background-position: -46px -1144px; }
#footer ul li #twitter:hover { background-position: -46px -1204px; }
#footer ul li #facebook { width: 32px; background-position: -3px -1144px; }
#footer ul li #facebook:hover { background-position: -3px -1204px; }
#footer ul li #instagram { width: 32px; background-position: -89px -1144px; }
#footer ul li #instagram:hover { background-position: -89px -1204px; }
#footer ul li #zagat { width: 32px; background-position: -132px -1144px; }
#footer ul li #zagat:hover { background-position: -132px -1204px; }
#footer ul li #email { height: 20px; width: 260px; background-position: -240px -810px; margin-top: 6px; }
#footer ul li #email:hover { background-position: -240px -830px; }

#footer p.phone { line-height: 30px; height: 30px; background: none; text-indent: 0; text-align: center; }
#footer p.phone a { text-decoration: none; }


fieldset { padding: 20px 0; margin: 0 0 20px 0; border-bottom: 1px solid #d1cee1; }
fieldset legend { line-height: 40px; font-size: 20px; color: #4b4577; }
fieldset legend span { display: inline-block; width: 40px; height: 40px; background: url(../img/graphics.gif) no-repeat; text-indent: -9999px; margin: 0 10px 0 0; padding: 0; }
fieldset legend span.num1 { background-position: -530px -490px; }
fieldset legend span.num2 { background-position: -530px -530px; }
fieldset legend span.num3 { background-position: -530px -570px; }
fieldset legend span.num4 { background-position: -530px -610px; }

label { display: block; font-size: 16px; margin: 0 0 5px 0; padding: 0; position: relative; }
label em { display: block; font-size: 20px; font-weight: 300; font-style: normal; position: absolute; top: 2px; left: -18px; color: #c00; }
label.error { display: block; font-size: 16px; margin: -10px 0 10px 0; padding: 0 8px; height: 30px; line-height: 30px; text-align: left; width: 296px; background: #c00; color: #fff; border-radius: 5px; }

div.left { padding: 0; float: left; width: 360px; }
div.right { margin: 0 0 0 400px; padding: 0; width: 360px; }

fieldset div.left { padding: 0 0 0 55px; width: 340px; }
fieldset div.right { margin: 0 0 0 420px; width: 340px; }

div.confirmationBox fieldset { border: none; }
div.confirmationBox fieldset p { margin: 0; }

br.clear { clear: left; }

input,
select { border: 1px solid #ccc; border-radius: 5px; box-shadow: 0 0 10px #eee; font-family: 'Open Sans', Helvetica, Arial, sans-serif; color: #444; font-size: 16px; margin: 0 0 15px 0; }

p.note { border-radius: 10px; padding: 10px; font-size: 16px; margin: 10px 0; background: #e5e4eb; border: 1px solid #473f68; color: #473f68; }




input.text { width: 300px; padding: 3px 5px; margin: 0 0 15px 0; }
input.image { border-radius: 0; box-shadow: none; border: none; }
input.small { width: 120px; }
input.text:focus { border: 1px solid #645d9f; color: #111; box-shadow: 0 0 10px #aaa; }
select { padding: 3px 0 3px 5px; }
select:focus { border: 1px solid #645d9f; color: #111; box-shadow: 0 0 10px #aaa; }

#selectedDateContainer { display: inline-block; margin: 0 0 0 10px; font-weight: 700; color: #473F68; }
#selectedDate { display: inline; margin: 0; font-weight: 700; color: #473F68; border: 0; padding: 0; box-shadow: none; border-radius: 0; width: 170px; cursor: default; background: #fff; }

div.inlinefields span { display: inline-block; width: 140px; margin: 0 20px 0 0; }

div.qtyContainer,
div.descriptionContainer,
a.addBtn { display: inline-block; }
div.qtyContainer { width: 180px; vertical-align: top; margin: 0 0 0 20px; }
div.descriptionContainer { width: 480px; vertical-align: top; margin: 0; }
#productContainer { display: none; margin: 10px 0 0 0; }

#itemContainer { border-radius: 10px; padding: 10px; margin: 0 0 0 55px; background: #e5e4eb; }
#itemContainer select { margin: 0; }
#itemContainer p { margin: 0 0 5px 5px; padding: 0; line-height: 20px; }
#itemContainer p strong { margin: 0; padding: 0; font-size: 32px; font-weight: 300; line-height: 30px; }

#qty { width: 44px; }
#itemContainer #selectedProductPrice { margin: 5px 0 0 60px; font-size: 18px; }

#paymentContainer { display: none; }

#addToOrder { background: #645d9f; color: #fff; border-radius: 4px; height: 30px; line-height: 30px; margin: 0 0 0 10px; padding: 0 10px; text-decoration: none; }
#addToOrder:hover { background: #3b3664; }

.ui-datepicker thead th { font-size: inherit; }
.ui-datepicker tbody td { font-size: inherit; border-right: none; height: auto; line-height: inherit; text-align: inherit; }

#orderContainer thead th { text-align: left; font-size: 14px; font-weight: 700; padding: 0 5px 0 0; border-bottom: 1px solid #D1CEE1; }
#orderContainer tbody td { text-align: left; font-size: 14px; font-weight: 300; padding: 0 5px 0 0; height: 24px; line-height: 24px; }
#orderContainer tbody td a { width: 24px; height: 24px; display: block; text-indent: -9999px; background: url(../img/icons.png) no-repeat 0 -390px; }
#orderContainer tfoot td { text-align: right; font-size: 18px; font-weight: 300; padding: 10px 5px 0 0; }
#orderContainer #orderTotalContainer { text-align: left; }


div.questionBox { border-radius: 10px; padding: 10px 10px 10px 50px; margin: 0; background: #e5e4eb url(../img/question.png) no-repeat 10px 10px; }
div.questionBox p { color: #473f68; height: auto; line-height: 18px; font-size: 12px; font-weight: 300; margin: 0; }
div.questionBox p strong { font-weight: 700; font-size: 14px; }


div.warningMsg { border-radius: 10px; padding: 15px 15px 15px 80px; margin: 0 0 0 55px; background: #fc6 url(../img/alert.png) no-repeat 15px 15px; display: none; }
div.warningMsg p { color: #412310; height: 48px; line-height: 22px; font-size: 16px; font-weight: 300; color: #333; margin: 0; }
div.warningMsg p strong { font-weight: 700;}

div.errorMsg { border-radius: 10px; padding: 15px 15px 15px 80px; margin: 0 0 20px 0; background: #f99 url(../img/delete.png) no-repeat 15px 15px; }
div.errorMsg p { color: #3a0a0a; height: 48px; line-height: 22px; font-size: 16px; font-weight: 300; color: #333; margin: 0; }
div.errorMsg p strong { font-weight: 700;}

div.alertMsg { border-radius: 10px; padding: 15px 15px 15px 80px; margin: 0 0 20px 0; background: #9cc url(../img/info.png) no-repeat 15px 15px; }
div.alertMsg p { color: #08363a; height: 48px; line-height: 22px; font-size: 16px; font-weight: 300; color: #333; margin: 0; }
div.alertMsg p strong { font-weight: 700;}

div.alt_location {
    margin-top: 50px;
}

div.alt_location a {
    font-weight: bold;
    text-decoration: none;
    font-size: 18px;
}

div.menu_section {
    display: table;
}

div.menu_section div.items {
    display: table-cell;
    width: 700px;
    vertical-align: top;
}

div.menu_section div.price {
    display: table-cell;
    width: 200px;
}

div.menu_section div.items-pasadena {
    display: table-cell;
    width: 700px;
    vertical-align: top;
}

div.menu_section div.price-pasadena {
    display: table-cell;
    width: 200px;
}

div.menu_section div.price-pasadena ul, div.menu_section div.items-pasadena ul {
    line-height: 24px;
    margin: 20px 0;
    padding: 0 0 0 0px;
    list-style-type: none;
}

.footnote {
    font-size: 14px;
    color: #888;
    font-style: italic;
}



/*

div.msgBox { border-radius: 10px; padding: 15px 15px 15px 80px; margin: 10px 0; }
div.alertMsg { background: #9cc url(../img/info.png) no-repeat 15px 15px; }
div.warningMsg { background: #fc6 url(../img/alert.png) no-repeat 15px 15px; }
div.errorMsg { background: #f99 url(../img/delete.png) no-repeat 15px 15px; }
div.confirmMsg { background: #c3ee9d url(../img/confirm.png) no-repeat 15px 15px; }
div.msgBox p strong { font-weight: 700;}
div.msgBox p { height: 48px; line-height: 22px; font-size: 16px; font-weight: 300; color: #333; margin: 0; }
div.alertMsg p { color: #08363a; }
div.warningMsg p { color: #412310; }
div.errorMsg p { color: #3a0a0a; }
div.confirmMsg p { color: #0c240e; }

*/