File: /home/awaldron/public_html/archive/pbo/css/main.css
/* ==========================================================================
Author's custom styles
========================================================================== */
body {
font-family: "minion-pro",sans-serif;
font-style: normal;
font-weight: 400;
font-size:14px/1.5em;
background: #110d0a url(/img/bg-slate-repeat-sm.jpg) left top;
color:#f9e0b3;
}
a { color:#f7a132; }
a:hover { color:#f3dcbc; text-decoration: underline; }
#content { display: none; }
input, textarea {
opacity:0.7;
filter:alpha(opacity=70); /* For IE8 and earlier */
color:#000000;
}
#logo {
z-index: 9999;
position: relative;
max-width: none;
}
.tbl-flame {
z-index: 9999;
margin-top:-30px;
}
.line {
height:3px !important;
}
.flameline {
width: 100%;
height:2px !important;
position: relative;
top:12px;
}
#tbl-topnav {
margin-top:20px;
}
.topnav-wrap {
position: relative;
height:131px;
}
.topnav {
width:100%;
}
a.tnav,
a.tnav:link,
a.tnav:active,
a.tnav:visited {
display: block;
color:#f9e0b3;
width:32%;
float:left;
text-align: center;
border-right:solid 1px #a86839;
font-size: 1.4em;
text-transform: uppercase;
}
a.tnav:hover {
color:#FFFFFF;
}
/********************************************************************************************************/
/********************************************************************************************************/
@media (max-width: 767px) {
body { padding:0; }
#home {
background-color: transparent;
height: 335px;
overflow: visible;
background: none;
}
#heroline1, #heroline2 { width:100%; height:3px; }
.herospan {
margin-top:20px;
margin-bottom:14px;
}
h1.hero {
color:#fdf7ea;
text-shadow: 0px 5px 12px #080808;
filter: dropshadow(color=#080808, offx=0, offy=5);
text-align: center;
margin-top:0px;
text-transform: uppercase;
font-size:24px;
font-weight: normal;
}
h2.hero {
color:#f9e0b3;
text-shadow: 0px 5px 12px #080808;
filter: dropshadow(color=#080808, offx=0, offy=5);
text-align: center;
text-transform: uppercase;
font-size:20px;
font-weight: normal;
line-height: 1.2em;
margin-bottom: 0;
}
#tbl-topnav {
display:none;
}
#logo-resp { max-width: 240px; margin:0 auto; }
#welcome h1 {
color:#FFFFFF;
font-size:1.5em;
text-transform: uppercase;
font-weight: 700;
margin-top:20px;
text-align: center;
letter-spacing: 0.05em;
text-shadow: none;
filter: none}
#welcome h2 {
color:#f9e0b3;
font-size:1.1em;
text-transform: uppercase;
font-weight: 400;
margin-top:20px;
line-height: 1.8em;
margin:0.5em 10%;
text-align: center;
letter-spacing: 0.05em;
text-shadow: none;
filter: none}
#splash-photos, #welcome, #food, #drink, #about, #press, #contact, #p-nav, #progressContainer {
display: none;
}
}
/********************************************************************************************************/
/********************************************************************************************************/
@media (min-width: 768px) {
#logo-resp, #mobile, #heroline1, #heroline2 { display: none; }
#tbl-topnav { display: block; }
.fixed {
background-attachment: fixed;
}
#home {
background-color: #990000;
height: 335px;
overflow: visible;
background: url(/img/bg-brick.jpg) no-repeat center top;
}
#splash-photos {
height:400px;
background-image: url(/img/splash-photos.jpg);
background-repeat: no-repeat;
background-position: center top ;
position: relative;
}
#splash-shadow {
position: absolute;
top:0px;
left:0px;
width:100%;
}
#welcome {
background-image: url(/img/bg-leather.jpg);
background-repeat: no-repeat;
background-position: center center ;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#welcome h1 {
color:#6e2007;
font-size:2em;
text-transform: uppercase;
font-weight: 700;
margin-top:20px;
text-align: center;
letter-spacing: 0.05em;
text-shadow: 0px 2px 9px #cbaa6e;
filter: dropshadow(color=#cbaa6e, offx=0, offy=2);}
#welcome h2 {
color:#f9e0b3;
font-size:2em;
text-transform: uppercase;
font-weight: 400;
margin-top:20px;
line-height: 1.8em;
margin:0.5em 10%;
text-align: center;
letter-spacing: 0.05em;
text-shadow: 0px 2px 9px #080808;
filter: dropshadow(color=#080808, offx=0, offy=2);}
.sub-bg {
background-image: url(/img/bg-slate-big.png);
background-repeat: no-repeat;
background-position: center center ;
min-height:1200px;
}
.slate-bg {
position: absolute;
width:100%;
overflow: auto;
top:215px;
left:0px;
}
.slate-fade {
height:650px;
width:100%;
background: url(/img/bg-slate-fade3.png) repeat-x left top;
}
.slate-repeat {
width:100%;
background: url(/img/bg-slate-repeat.jpg) left top;
height: 100px;
}
.slate-body {
position: absolute;
top:215px;
left:0px;
width:100%;
margin-top:15px;
}
#food {
background-image: url(/img/bg-food.jpg);
background-repeat: no-repeat;
background-position: center center ;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
position: relative;
}
#drink {
min-height:800px;
background-image: url(/img/bg-drink.jpg);
background-repeat: no-repeat;
background-position: center center ;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
position: relative;
}
#about {
background-image: url(/img/bg-food.jpg);
background-repeat: no-repeat;
background-position: center center ;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
position: relative;
}
#press {
background-image: url(/img/bg-food.jpg);
background-repeat: no-repeat;
background-position: center center ;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
position: relative;
}
.herospan {
margin-top:20px;
margin-bottom:14px;
}
h1.hero {
color:#fdf7ea;
text-shadow: 0px 5px 12px #080808;
filter: dropshadow(color=#080808, offx=0, offy=5);
text-align: center;
margin-top:60px;
text-transform: uppercase;
font-size:60px;
font-weight: normal;
}
h2.hero {
color:#f9e0b3;
text-shadow: 0px 5px 12px #080808;
filter: dropshadow(color=#080808, offx=0, offy=5);
text-align: center;
text-transform: uppercase;
font-size:20px;
font-weight: normal;
margin-bottom: auto;
}
.title-line {
margin-top:44px;
width:100%;
height:3px;
}
.title-line-2 {
margin-top:20px;
width:100%;
height:3px;
}
h3 {
color:#fadca2;
font-size:1.8em;
text-transform: uppercase;
font-weight: 400;
margin-top:20px;
letter-spacing: 0.05em;
}
h4 {
color:#FFFFFF;
font-size:1.6em;
text-transform: uppercase;
font-weight: 400;
margin-top:20px;
line-height: 1.8em;
margin:0.5em 10%;
letter-spacing: 0.05em;
}
#p-nav {
width:100%;
position: absolute;
top:-90px;
left:0px;
height:40px;
z-index: 999999;
overflow: visible;
position: fixed;
background:#000000;
}
a.pnav,
a.pnav:link,
a.pnav:active,
a.pnav:visited {
display: inline;
color:#f9e0b3;
padding:0 2% 0;
border-right:solid 1px #a86839;
font-size: 1.1em;
text-transform: uppercase;
height:18px;
position: relative;
top:10px;
}
a.pnav:hover {
color:#FFFFFF;
}
#contact {
height:636px;
background: url(/img/bg-footer.jpg) center top no-repeat;
}
.sep {
background:url(/img/line-vert.gif) 3.5% top repeat-y;
}
.menupad {
margin-top:50px;
}
ul.subnav {
list-style-type: none;
margin: 0;
padding: 0;
}
ul.subnav li {
display: block;
text-align: right;
border-bottom:solid 1px #6b3e30;
}
ul.subnav a,
ul.subnav a:link,
ul.subnav a:visited,
ul.subnav a:active {
color: #eaa541;
display: block;
text-transform: uppercase;
font-size:1.7em;
font-weight: 400;
padding:14px 0;
}
ul.subnav a:hover {
text-decoration: none;
color:#FFFFFF;
}
ul.subnav a.on { color:#FFFFFF; }
.menusub {
display:none;
}
.menusub h3 {
margin-left: 10%;
color: #EAA541;
margin-top:0;
line-height: normal;
}
.menusub h4 {
margin-left: 10%;
color: #EAA541;
margin-top:0;
margin-bottom: 0.8em;
font-size: 1em;
line-height: normal;
}
.menusub p {
margin-left: 10%;
}
ul.menu {
list-style-type: none;
margin: 0 0 2em 0;
padding: 0 0 0 10%;
}
ul.menu li {
display: block;
padding:0.5em;
color: #FFFFFF;
font-size:1.4em;
}
ul.menu li:nth-child(even) {
background: url(/img/black25.png);
}
ul.menu li span {
float:right;
color:#FFFFFF;
}
ul.menu li i {
color:#cbb690;
font-size:0.75em;
}
#press ul.menu li {
margin-bottom: 18px;
}
#press i {
color:#fafaf5;
font-size: 0.9em;
}
#press u {
font-size: 0.9em;
text-decoration: none;
}
.menu-photo {
margin-top:40px;
}
#contact h2 {
color:#491909;
font-size:2em;
text-transform: uppercase;
font-weight: 700;
margin-top:20px;
text-align: center;
text-shadow: 0px 2px 9px #cbaa6e;
filter: dropshadow(color=#cbaa6e, offx=0, offy=2);
}
#contact h3 {
color:#f7a132;
font-size:1.5em;
text-transform: uppercase;
font-weight: 400;
padding-top:5px;
border-top: solid 1px #f3dcbc;
line-height: 1.1em;
text-shadow: 0px 2px 9px #080808;
filter: dropshadow(color=#080808, offx=0, offy=2);
}
#contact h4 {
color:#f3dcbc;
font-size:1.5em;
text-transform: uppercase;
font-weight: 400;
margin-top:20px;
line-height: 1.3em;
margin:0.5em 10%;
text-align: center;
letter-spacing: 0.05em;
text-shadow: 0px 2px 9px #080808;
filter: dropshadow(color=#080808, offx=0, offy=2);
}
#contact {
color:#FFFFFF;
font-size:1.1em;
text-transform: uppercase;
line-height: 1.5em;
filter: dropshadow(color=#080808, offx=0, offy=2);
}
.social-icons img {
max-width:24px;
margin-top:8px;
}
}
body.loaded #content {
display: block;
}
body.loaded #progressContainer {
display: none !important;
}
/* All HTML5 progress enabled browsers */
progress {
/* Turns off styling - not usually needed, but good to know. */
/*
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
*/
/* Apply border. */
border: solid 1px #FFFFFF;
/* Dimensions */
width: 400px !important;
height: 24px !important;
opacity: 0.8;
border-radius: 9px;
}
progress::-moz-progress-bar { background: #CB9A2C; border-radius: 8px;}
progress::-webkit-progress-bar { background: #000000; border-radius: 8px; }
progress::-webkit-progress-value { background: #CB9A2C; border-radius: 8px; }