/*
Theme Name: Copa D Oro
Theme URI: the-theme's-homepage
Description: a-brief-description
Author: Kevin Sandness
Author URI: your-URI
Template: use-this-to-define-a-parent-theme--optional
Version: a-number--optional
.
General comments/License Statement if any.
.
[Table Of Contents]
0- Reset & Layout
1- Global
2- Links
3- Headings
4- Header
5- Navigation
6- Middle
7- Forms
8- Extras
9- Footer
*/
/* =0 Reset
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
@import url('reset.css');
@import url('960_no_margin.css');
/* =1 Global
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
body { line-height: 1; font: normal 0.88em Arial, Helvetica, sans-serif; vertical-align: top; color: #a45d30; background:#230f01 url(../images/tile.jpg) repeat left top;}
.align-left { text-align: left; }
.align-right { text-align: right; }
.align-center { text-align:center; }
.justify { text-align:justify; }
.hide { display: none; }
.clear { clear: both; }
.bold { font-weight:bold; }
.italic { font-style:italic; }
.underline { border-bottom:1px solid; }
.highlight { background:#ffc; }
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignleft { float:left; margin:4px 10px 4px 0; }
img.alignright { float:right; margin:4px 0 4px 10px; }
h1 a, #credit, #footer_nav { border:none; behavior:url(iepngfix.htc); }
.bumpleft { margin-left:10px;}
.bumpright { margin-right:10px;}
.noborder { border:none; }
.floatleft { float:left; }
.floatright { float:right; }
#wrapper { background:#220e01 url(../images/bg_content.jpg) repeat-x left top; }
span.clear {background: none;border: 0;clear: both;display: block;float: none;font-size: 0;list-style: none;margin: 0;padding: 0;overflow: hidden;visibility: hidden; width: 0;height: 0;}
/* =2 Links
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
a { color: #e76100; text-decoration:none; }
a:hover { color: #e76100; text-decoration:underline; }
/* =3 Headings
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
h1 { font: bold 2em 'Myriad Pro', Arial, sans-serif; color:#e76100; }
h3 { font: bold 18px Arial, Geneva, Helvetica, sans-serif; color:#e76100; font-weight:normal; letter-spacing: 1px;}
#li_spirits h3 { font-size:14px; }
/* =4 Header
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
/* =5 Navigation
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#nav {position:absolute; top:0; right:0; z-index:200;}
#nav li { float:left; margin:0 0 0 35px; display:inline;}
#nav li.nomargin { margin:15px 0 0 0; }
#nav #nav_home { margin:0 0 0 65px; }
#nav a { font-size:18px; font-family:'Myriad Pro', Arial, sans-serif; color:#b55510; display:block; height:47px; width:50px; text-indent:-999em; }
#nav a:hover { color:#e76100; text-decoration:none; }
#nav_home a { width:39px; background: url(../images/sprite_nav.gif) no-repeat left top; }
#nav_home a:hover, #nav_home a.selected { background: url(../images/sprite_nav.gif) no-repeat -39px top; }
#nav_about a { width:63px; background: url(../images/sprite_nav.gif) no-repeat -78px top; }
#nav_about a:hover, #nav_about a.selected { background: url(../images/sprite_nav.gif) no-repeat -141px top; }
#nav_drink a { width:82px; background: url(../images/sprite_nav.gif) no-repeat -204px top; }
#nav_drink a:hover, #nav_drink a.selected { background: url(../images/sprite_nav.gif) no-repeat -286px top; }
#nav_food a { width:79px; background: url(../images/sprite_nav.gif) no-repeat -368px top; }
#nav_food a:hover, #nav_food a.selected { background: url(../images/sprite_nav.gif) no-repeat -447px top; }
#nav_contact a { width:60px; background: url(../images/sprite_nav.gif) no-repeat -526px top; }
#nav_contact a:hover, #nav_contact a.selected { background: url(../images/sprite_nav.gif) no-repeat -586px top; }
/*submenu dropdown*/
#nav li ul {
position:absolute;
left:-999em;
padding:18px 0 0 0;
background:#7b3d10 url(../images/bg_subnav.jpg) repeat-x left top;
top:auto;
width:120px;
z-index:100;
}
#nav li ul li {margin:0; height:auto; clear:both; padding-top:0; padding-bottom:12px;}
#nav li ul a{height:auto;float:left; clear:both; background:none; text-indent:0px; color:#fff; font-size:12px; display:block; width:120px; text-indent:-999em;}
#nav li ul a:hover {text-decoration:none;}
#nav li:hover ul, #nav li.show ul{left:auto; zoom:1;}/*Zoom to fix IE7 sticky header*/
#nav li:hover, #nav li.show {height:auto;}/*Zoom to fix IE7 sticky header*/
#nav #nav_gallery a { height:19px; background: url(../images/sprite_nav.gif) no-repeat -646px top; }
#nav #nav_gallery a:hover, #nav #nav_gallery a.selected { background: url(../images/sprite_nav.gif) no-repeat -766px top; }
#nav #nav_news a { height:16px; background: url(../images/sprite_nav.gif) no-repeat -886px top; }
#nav #nav_news a:hover, #nav #nav_news a.selected { background: url(../images/sprite_nav.gif) no-repeat -1006px top; }
#nav #nav_events a { height:16px; background: url(../images/sprite_nav.gif) no-repeat -1126px top; }
#nav #nav_events a:hover, #nav #nav_events a.selected { background: url(../images/sprite_nav.gif) no-repeat -1246px top; }
#nav #nav_happy a { height:18px; background: url(../images/sprite_nav.gif) no-repeat -1366px top; }
#nav #nav_happy a:hover, #nav #nav_happy a.selected { background: url(../images/sprite_nav.gif) no-repeat -1486px top; }
#nav #nav_cocktail a { height:16px; background: url(../images/sprite_nav.gif) no-repeat -1606px top; }
#nav #nav_cocktail a:hover, #nav #nav_cocktail a.selected { background: url(../images/sprite_nav.gif) no-repeat -1726px top; }
#nav #nav_beer a { height:16px; background: url(../images/sprite_nav.gif) no-repeat -2086px top; }
#nav #nav_beer a:hover, #nav #nav_beer a.selected { background: url(../images/sprite_nav.gif) no-repeat -2206px top; }
#nav #nav_wine a { height:16px; background: url(../images/sprite_nav.gif) no-repeat -1846px top; }
#nav #nav_wine a:hover, #nav #nav_wine a.selected { background: url(../images/sprite_nav.gif) no-repeat -1966px top; }
/* =6 Middle
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
.container_16 { position:relative; }
#about .container_16, #wrapper_gallery .container_16 { background: url(../images/bg_about.jpg) no-repeat right 46px; }
#contact .container_16 { background: url(../images/bg_contact.jpg) no-repeat right 46px; }
#drink_menu .container_16, #food_menu .container_16 { background: url(../images/bg_drinks.jpg) no-repeat right 46px; }
#home #masthead {height:44px;}
p, ul, dl {margin-bottom:.9em;}
h1 a { display:block; width:420px; height:138px; text-indent:-999em;background: url(../images/logo.png) repeat-x left top; cursor:pointer; }
#h1_home { width:541px; height:146px; text-indent:-999em; background: url(../images/logo_home.png) no-repeat right top; padding-left:55px; margin-top:50px;}
#wrapper_flash { width:466px; height:326px; position:relative; margin:-155px 0 0 -40px;}
#main_copy { padding-top:40px; padding-bottom:60px; line-height:1.7em; }
#home #main_copy { padding-bottom:0;position:relative; margin:-85px 0 0 -60px;}
#quote { text-indent:-999em; margin-top:16px; position:absolute; right:0; top:40px; }
#about #quote, #wrapper_gallery #quote { height: 55px; background: url(../images/quote_about.gif) no-repeat right top; }
#contact #quote { height: 133px; background: url(../images/quote_contact.gif) no-repeat right top;}
#drink_menu #quote { height: 53px; background: url(../images/quote_drinks.gif) no-repeat right top;}
#food_menu #quote { height: 74px; background: url(../images/quote_food.gif) no-repeat right top;}
#map { border: 5px solid #b55510; margin:0 0 15px 0; }
.time { position:relative; left:-767px; top:-35px;}
/*PAGE SPECIFIC RULES*/
/*HOME*/
#promo-home {position:absolute; top:187px; right:0;}
#event-home {position:absolute; top:50px; left:0px; z-index:-4;}
/*DRINK NAV*/
#nav_drink_menu {margin:15px 0 0 0;}
#nav_drink_menu li {float:left; padding:5px 0 5px 30px;}
#nav_drink_menu a {color:#a45d30; text-decoration:underline; float:left;}
#nav_drink_menu a:hover {text-decoration:none;}
#nav_drink_menu #aromatic_cocktails {background: url(../images/sprite_drink_nav.gif) no-repeat left -597px; padding-left:15px;}
#sour_cocktails {background: url(../images/sprite_drink_nav.gif) no-repeat 15px -497px;}
#sparkling_refreshing {background: url(../images/sprite_drink_nav.gif) no-repeat 15px -400px;}
#out_of_town {background: url(../images/sprite_drink_nav.gif) no-repeat 15px -295px;}
#wine {background: url(../images/sprite_drink_nav.gif) no-repeat 15px -197px;}
#sake {background: url(../images/sprite_drink_nav.gif) no-repeat 15px -92px;}
#beer {background: url(../images/sprite_drink_nav.gif) no-repeat 15px top;}
#li_spirits {padding:20px 0 10px 0;}
#li_spirits .li_spirits {float:left;}
#drink_menu table, #food_menu table {margin-bottom:25px; width:100%;}
#drink_menu table.nomargin {margin-bottom:10px;}
#drink_menu td {padding-right:45px;}
#drink_menu .threecol td {padding-right:0;}
.price {color:#e76100;}
.bump_bottom {margin-bottom:25px;}
.menu-section {position:relative;}
.top_link {color:#a45d30; text-decoration:underline; position:absolute; top:3px; left:-80px;}
.top_link:hover {text-decoration:none;color:#a45d30;}
#food_menu h2 {margin-bottom:10px;}
/*GALLERY*/
#wrapper_gallery #main_copy {padding-bottom:100px;}
/**
Stylesheet: Slideshow.css
CSS for Slideshow.
License:
MIT-style license.
Copyright:
Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
HTML:
Notes:
These next four rules are set by the Slideshow script.
You can override any of them with the !important keyword but the slideshow probably will not work as intended.
*/
.slideshow {display: block;position: relative;z-index: 0;}
.slideshow-images {display: block;overflow: hidden;position: relative;}
.slideshow-images img {display: block;position: absolute;z-index: 1;}
.slideshow-thumbnails {overflow: hidden;}
/**
HTML:
Notes:
The images div is where the slides are shown.
Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/
.slideshow-images {height: 300px;width: 400px;}
.slideshow-images-visible { opacity: 1;}
.slideshow-images-prev { opacity: 0; }
.slideshow-images-next { opacity: 0; }
.slideshow-images img {float: left;left: 0;top: 0;}
/**
Notes:
These are examples of user-defined styles.
Customize these classes to your usage of Slideshow.
*/
.slideshow {height: 300px;margin: 0 auto;width: 400px;}
.slideshow a img {border: 0;}
/**
HTML:
...
Notes:
Customize the hidden / visible classes to affect the captions animation.
*/
.slideshow-captions {
background: #000;
bottom: 0;
color: #FFF;
font: normal 12px/22px Arial, sans-serif;
left: 0;
overflow: hidden;
position: absolute;
text-indent: 10px;
width: 100%;
z-index: 10000;
}
.slideshow-captions-hidden {height: 0;opacity: 0;}
.slideshow-captions-visible {height: 22px;opacity: .7;}
/**
HTML:
Notes:
Customize the hidden / visible classes to affect the controller animation.
*/
.slideshow-controller {
background: url(controller.png) no-repeat;
height: 42px;
left: 50%;
margin: -21px 0 0 -119px;
overflow: hidden;
position: absolute;
top: 50%;
width: 238px;
z-index: 10000;
}
.slideshow-controller * {
margin: 0;
padding: 0;
}
.slideshow-controller-hidden {
opacity: 0;
}
.slideshow-controller-visible {
opacity: 1;
}
.slideshow-controller a {
cursor: pointer;
display: block;
height: 18px;
overflow: hidden;
position: absolute;
top: 12px;
}
.slideshow-controller a.active {
background-position: 0 18px;
}
.slideshow-controller li {
list-style: none;
}
.slideshow-controller li.first a {
background-image: url(controller-first.gif);
left: 33px;
width: 19px;
}
.slideshow-controller li.last a {
background-image: url(controller-last.gif);
left: 186px;
width: 19px;
}
.slideshow-controller li.next a {
background-image: url(controller-next.gif);
left: 145px;
width: 28px;
}
.slideshow-controller li.pause a {
background-image: url(controller-pause.gif);
left: 109px;
width: 20px;
}
.slideshow-controller li.play a {
background-position: 20px 0;
}
.slideshow-controller li.play a.active {
background-position: 20px 18px;
}
.slideshow-controller li.prev a {
background-image: url(controller-prev.gif);
left: 65px;
width: 28px;
}
/**
HTML:
Notes:
Customize the hidden / visible classes to affect the loader animation.
*/
.slideshow-loader {
height: 28px;
right: 0;
position: absolute;
top: 0;
width: 28px;
z-index: 10001;
}
.slideshow-loader-hidden {
opacity: 0;
}
.slideshow-loader-visible {
opacity: 1;
}
/**
HTML:
Notes:
Customize the active / inactive classes to affect the thumbnails animation.
Use the !important keyword to override FX without affecting performance.
*/
.slideshow-thumbnails {
bottom: -65px;
height: 65px;
left: 0;
position: absolute;
width: 100%;
}
.slideshow-thumbnails * {
margin: 0;
padding: 0;
}
.slideshow-thumbnails ul {
height: 65px;
left: 0;
position: absolute;
top: 0;
width: 10000px;
}
.slideshow-thumbnails li {float: left;list-style: none;margin: 5px 5px 5px 0;position: relative;}
.slideshow-thumbnails a {display: block;float: left;padding: 2px;position: relative; }
.slideshow-thumbnails a:hover {background-color: #7b3d10 !important;opacity: 1 !important;}
.slideshow-thumbnails img {display: block;}
.slideshow-thumbnails-active {background-color: #e76100;opacity: 1;}
.slideshow-thumbnails-inactive {background-color: #b55510;opacity: .5;}
/* =7 Form
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
/* =8 Extra
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#FB_contact { margin-left:-50px; background-color: #000000; }
/* =9 Footer
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#wrapper_footer { text-align:right; height:76px; background-color:#b55510; margin-bottom:15px; }
#wrapper_footer .container_16 { background:none; }
#wrapper_footer p { line-height:76px; color:#f8bf97; }
#wrapper_footer a { color:#f8bf97; }
#wrapper_credit {width:960px; margin:0 auto; font-size:.8em;}
#wrapper_credit, #wrapper_credit a {color:#602f0e;}
#footer_nav li, #credit {float:left;}
#credit {height:28px; padding:12px 20px 0 20px; background:url(../images/bg_credit.png) no-repeat left top;}
#footer_nav {float:right; height:28px; background:url(../images/bg_footer_links.png) no-repeat 5px top; padding:12px 20px 0 20px;}
#footer_nav li {margin-left: 5px; display:inline;}
#footer_nav li a {margin-right:5px;}
#credit {padding-bottom:30px;}
/*
SIFR DON'T TOUCH
*/
@media screen {
.sIFR-flash {visibility: visible !important;margin: 0;padding: 0; }
.sIFR-replaced, .sIFR-ignore {visibility: visible !important;}
.sIFR-alternate {
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
display: block;
overflow: hidden;
}
.sIFR-replaced div.sIFR-fixfocus {
margin: 0pt;
padding: 0pt;
overflow: auto;
letter-spacing: 0px;
float: none;
}
}
@media print {
.sIFR-flash {
display : none !important;
height : 0;
width : 0;
position : absolute;
overflow : hidden;
}
.sIFR-alternate {
visibility : visible !important;
display : block !important;
position : static !important;
left : auto !important;
top : auto !important;
width : auto !important;
height : auto !important;
}
}
/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {
/* Example:
.sIFR-active h1 {
font-family: Verdana;
visibility: hidden;
}
*/
}
.sIFR-active h2{ visibility: hidden;font-family: Verdana;}
.sIFR-active h1 { padding-bottom: 0;}
.sIFR-active h2 {font-size: 30px;display: block;}
.sIFR-active #drink_menu h2 {font-size: 24px;display: block;margin-bottom:10px;}
#footer {font-size:14px; margin-top:30px;}