/* --------------------------------------------------------------------------------------------- general setup --------------------------------------------------------------------------------------------- */ body { margin: 0; color: #401500; background: #fff; } a { outline: none; } a:hover { text-decoration: none; } /* TABS ---------------------------------------- */ ul.tabs { margin: 0; padding: 0; } ul.tabs li { float: left; list-style: none; margin: 0; padding: 0; } ul.tabs li a { float: left; display: block; } /* Clearing floats without extra markup */ ul.tabs { display: inline-block; } ul.tabs:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } * html ul.tabs { height: 1%; } ul.tabs { display: block; } /* --------------------------------------------------------------------------------------------- jump menu --------------------------------------------------------------------------------------------- */ #jump-wrapper { background: #632907; } #jump-menu { height: 54px; } #jump-menu #jump-logo { width: 230px; height: 54px; float: left; } #jump-menu #jump-list { width: 550px; height: 54px; float: right; } #jump-menu #jump-list ul.tabs { margin: 7px 0 0; float: right; } #jump-menu #jump-list ul.tabs a { padding: 0 10px; font-size: 10px; color: #fff; text-align: right; text-decoration: none; text-transform: uppercase; } #jump-menu #jump-list ul.tabs a:hover { color: #ffc85f;} #jump-menu #jump-list ul.tabs a.selected { font-weight: bold; color: #ffc85f;} /* --------------------------------------------------------------------------------------------- slider forms --------------------------------------------------------------------------------------------- */ #slider-wrapper { background: #fff; } #slider-wrapper .form-col { margin-top: 18px; margin-bottom: 18px; } #slider-wrapper .form-col .field { float: left; } #slider-wrapper .form-col .field h4 { margin-right: 10px; width: 95px; float: left; font-size: 11px; text-transform: uppercase; text-align: right; color: #632907; } #slider-wrapper .form-col .field input, #slider-wrapper .form-col .field select { padding: 5px; width: 190px; float: left; } #slider-wrapper .form-col .field input#captcha { margin-left: 104px; } #slider-wrapper .form-col .field select { margin-bottom: 5px; width: 202px; height: 20px; background-color: #f1e6d5; border-color: #f1e6d5; } .ff2 #slider-wrapper .form-col .field select, .ff3 #slider-wrapper .form-col .field select { height: 26px; } /* targeting FF2 & FF3 */ .safari #slider-wrapper .form-col .field select { height: 24px; } /* targeting Safari */ #slider-wrapper .form-col .field div.checkboxes { width: 180px; padding: 5px 10px; float: left; background: #f1e6d5; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #slider-wrapper .form-col .field input[type="radio"] { width: auto; float: none; } #slider-wrapper .form-col .field textarea { width: 190px; height: 140px; font-size: 12px; background-color: #f1e6d5; border-color: #f1e6d5; } #slider-wrapper .form-col .field textarea:focus { background-color: #f4ecdf; border-color: #f4ecdf; } #slider-wrapper .form-col .buttons { padding-left: 105px; } #slider-wrapper .form-col .buttons button.submit, #slider-wrapper .form-col .buttons a { margin-right: 10px; float: left; background-color: #632907; color: #c6a592; } #slider-wrapper .form-col .buttons a { margin-right: 0; } .ff2 #slider-wrapper .form-col .buttons button.submit, .ff3 #slider-wrapper .form-col .buttons button.submit, .win.safari #slider-wrapper .form-col .buttons button.submit { padding-top: 3px; height: 23px; font-size: 10px; } /* targeting FF2 & FF3 */ #slider-wrapper .form-col .buttons button.submit:hover, #slider-wrapper .form-col .buttons a:hover { color: #fff; } #slider-wrapper #quote-form { height: 250px; display: none; } #slider-wrapper #contact-form { height: 250px; display: none; } #slider-wrapper #contact-form p { padding: 0 10px 1.5em; font-size: 11px; text-transform: uppercase; } #slider-wrapper #contact-form p a { color: #632907; } /* --------------------------------------------------------------------------------------------- page container --------------------------------------------------------------------------------------------- */ #page-wrapper { background: url(/images/bg_page-wrapper.png) repeat-x; } /* --------------------------------------------------------------------------------------------- header --------------------------------------------------------------------------------------------- */ #header { margin-top: 4px; height: 140px; position: relative; background: url(/images/bg_header.png) no-repeat; } #header h1 { margin: 0; width: 257px; height: 122px; } #header h1 a {width: 257px; height: 122px; display: block; text-indent: -9999px; } /* GLOBAL NAV ---------------------------------------- */ #header #global-nav { width: 950px; height: 18px; float: left; } #header #global-nav li a { height: 18px; display: block; text-indent: -9999px; text-decoration: none; background: url(/images/sprite_main.png) no-repeat; } #header #global-nav #boerner a { width: 202px; background-position: 0 -38px; } #header #global-nav #lakepark a { width: 125px; background-position: -202px -38px; } #header #global-nav #bacchus a { width: 75px; background-position: -327px -38px; } #header #global-nav #pier a { width: 114px; background-position: -402px -38px; } #header #global-nav #mrbs a { width: 140px; background-position: -516px -38px; } #header #global-nav #ristorante a { width: 169px; background-position: -656px -38px; } #header #global-nav #grain a { width: 125px; background-position: -825px -38px; } #header #global-nav #boerner a:hover, #s-boerner #header #global-nav #boerner a { background-position: 0 -56px; } #header #global-nav #lakepark a:hover, #s-lakepark #header #global-nav #lakepark a { background-position: -202px -56px; } #header #global-nav #bacchus a:hover, #s-bacchus #header #global-nav #bacchus a { background-position: -327px -56px; } #header #global-nav #pier a:hover, #s-pier #header #global-nav #pier a { background-position: -402px -56px; } #header #global-nav #mrbs a:hover, #s-mrbs #header #global-nav #mrbs a { background-position: -516px -56px; } #header #global-nav #ristorante a:hover, #s-ristorante #header #global-nav #ristorante a { background-position: -656px -56px; } #header #global-nav #grain a:hover, #s-grain #header #global-nav #grain a { background-position: -825px -56px; } /* UTILITY NAV ---------------------------------------- */ #header #utility-nav { width: 240px; height: 19px; position: absolute; top: 0; right: 0; } #header #utility-nav li a { height: 19px; display: block; text-indent: -9999px; text-decoration: none; background: url(/images/sprite_main.png) no-repeat; } #header #utility-nav #utility-quote a { width: 143px; background-position: 0 0; } #header #utility-nav #utility-contact a { width: 97px; background-position: -143px 0; } #header #utility-nav #utility-quote a:hover, #header #utility-nav #utility-quote.active a { background-position: 0 -19px; } #header #utility-nav #utility-contact a:hover, #header #utility-nav #utility-contact.active a { background-position: -143px -19px; } /* --------------------------------------------------------------------------------------------- content --------------------------------------------------------------------------------------------- */ #content { background: url(/images/bg_content.png) no-repeat; } #s-home #content { margin-top: 1px; padding: 0 10px 0; width: 930px; background: none; } #s-home #content img { padding: 20px 0; } #s-home #content p { margin-bottom: 10px; padding: 0 20px; } #s-home #content #slideshow { margin: 0 0 36px 0; padding: 0; width: 930px; height: 400px; } #s-home #content #promo-left { margin: 10px 10px 0 0; padding: 0; width: 230px; height: 145px; float: left; } #s-home #content #promo-left.default { background: url(/images/bg_promo-left.jpg) no-repeat; } #s-home #content #promo-middle { margin: 10px 10px 0 0; padding: 0; width: 450px; height: 145px; float: left; } #s-home #content #promo-middle.default { background: url(/images/bg_promo-middle.jpg) no-repeat; } #s-home #content #promo-right { margin: 10px 0 0 0; padding: 0; width: 230px; height: 145px; float: left; } #s-home #content #promo-right.default { background: url(/images/bg_promo-right.jpg) no-repeat; } #s-home #content #promo-left.default img, #s-home #content #promo-middle.default img, #s-home #content #promo-right.default img { margin: 0 10px 0 0; padding: 0; float: left; } #s-home #content #promo-left.default p, #s-home #content #promo-middle.default p, #s-home #content #promo-right.default p { padding: 5px 10px 0; } #s-home #content #promo-left img, #s-home #content #promo-middle img, #s-home #content #promo-right img { margin: 0; padding: 0; } /* --------------------------------------------------------------------------------------------- sidebar --------------------------------------------------------------------------------------------- */ #sidebar { padding: 18px 40px 0 40px; width: 190px; min-height: 504px; height: auto !important; height: 504px; float: left; } #sidebar ul { margin: 0; list-style-type: none; font-size: 11px; text-transform: uppercase; } #sidebar ul ul { margin-left: 15px; } #sidebar li a { padding: 5px 0; display: block; text-decoration: none; color: #522d16; } #sidebar li a:hover { color: #a05c31; } #sidebar li.selected a { font-weight: bold; color: #a05c31; } #sidebar li.selected ul li a { font-weight: normal; color: #522d16; } /*#sidebar li.first a { padding-top: 0; }*/ #sidebar ul.main > li:first-child a { padding-top: 0; } /* --------------------------------------------------------------------------------------------- main --------------------------------------------------------------------------------------------- */ #main { padding-top: 18px; width: 680px; float: left; } #main img.logo { padding-bottom: 10px; } #main p img { float: none; } #main p img.left { margin: 10px 10px 10px 0; float: left; } #main p img.right { margin: 10px 0 10px 10px; float: right; } #main p img.left-top { margin: 0 10px 10px 0; float: left; } #main p img.right-top { margin: 0 0 10px 10px; float: right; } #main p img.full { margin: 0; } #main a, #main p a, #main li a { color: #632907; } #main a:hover, #main p a:hover, #main li a:hover { color: #401500; } /* COLUMN ONE ---------------------------------------- */ #main .col-1 { margin-right: 10px; float: left; } #main .col-1 img.logo { padding-bottom: 18px; } #main .col-1.about { padding-right: 10px; width: 270px; } /* 280px total width */ /* COLUMN TWO ---------------------------------------- */ #main .col-2 { float: left; } #main .col-2.main-pic { width: 390px; } /* GALLERIES & VIDEO---------------------------------------- */ #main .photo-entry { margin: 0 32px 32px 0; padding: 0; width: 324px; height: 243px; float: left; position: relative; } #main .video-entry { margin: 0 32px 32px 0; padding-top: 17px; width: 324px; height: 260px; float: left; position: relative; } #main .photo-entry.last, #main .video-entry.last { margin: 0 0 32px 0; } #main .photo-entry p { padding-left: 10px; height: 17px; width: 314px; font-size: 12px; color: #ffffff; text-transform: uppercase; position: absolute; top: 226px; left: 0; background: url(/images/bg_photo-title.jpg) repeat-x; } #main .video-entry p { padding-left: 10px; height: 17px; width: 314px; font-size: 12px; color: #ffffff; text-transform: uppercase; position: absolute; top: 0; left: 0; background: url(/images/bg_photo-title.jpg) repeat-x; } /* --------------------------------------------------------------------------------------------- footer --------------------------------------------------------------------------------------------- */ #footer-outer { height: 215px; background: url(/images/bg_footer.png) repeat-x; } #s-home #footer-outer { margin-top: -17px; } #footer { margin: 0 auto; padding-top: 30px; width: 972px; } #footer #facebook { width: 972px; height: 68px; background: url(/images/bg_facebook.png) no-repeat; } #footer #facebook h3 { margin: 23px 0 0 40px; width: 201px; height: 21px; display: block; float: left; display: inline; font-size: 12px; letter-spacing: 1px; color: #3f1f11; text-transform: uppercase; text-decoration: none; text-indent: -9999px; background: url(/images/tr_h3-facebook.png) no-repeat; } #footer #facebook #facebook-list { margin-top: 9px; width: 731px; height: 50px; float: right; } #footer #facebook #facebook-list ul.tabs { margin: 7px 40px 0; float: right; display: inline; } #footer #facebook #facebook-list ul.tabs li { margin-left: 60px; } .win #footer #facebook #facebook-list ul.tabs li { margin-left: 40px; } #footer #facebook #facebook-list ul.tabs a { padding: 0 10px; font-size: 10px; text-align: right; text-decoration: none; text-transform: uppercase; } #footer #facebook #facebook-list ul.tabs a:hover { text-decoration: underline; } #footer #social-nav { margin: 7px auto 0; width: 521px; height: 19px; } #footer #social-nav a { padding-left: 25px; height: 19px; display: block; font-size: 12px; letter-spacing: 1px; color: #3f1f11; text-transform: uppercase; text-decoration: none; display: inline; } #footer #social-nav #social-mailing a { margin-right: 119px; width: 177px; background: url(/images/bg_mailing-list.png) no-repeat; } #footer #social-nav #social-twitter a { width: 175px; background: url(/images/bg_twitter.png) no-repeat; } #footer #footer-nav { margin: 14px auto; width: 755px; } .win #footer #footer-nav { width: 765px; } .ie6 #footer #footer-nav { width: 785px; } #footer p#contact-info { margin-bottom: 9px; text-transform: uppercase; text-align: center; } #footer p#contact-info em { padding-left: 20px; font-style: normal; } #footer p#copyright { margin-bottom: 0; font-size: 9px; text-transform: uppercase; text-align: center; } /* --------------------------------------------------------------------------------------------- global forms --------------------------------------------------------------------------------------------- */ .field { margin-bottom: 18px; } .field.last { margin-bottom: 9px; } .field h4 { margin: 0 0 3px 0; } .field span.input { margin: 0 0 15px; padding: 3px; background: #666; -moz-border-radius: 5px; -webkit-border-radius: 5px; display: block; } .field input { margin: 0; padding: 3px; background: #f1e6d5; border: 1px solid #f1e6d5; -moz-border-radius: 4px; -webkit-border-radius: 4px; outline: none } .field input:focus { background-color: #f4ecdf; border-color: #f4ecdf; } .field select { margin: 0; padding: 4px 5px; border: 1px solid #FFF; -webkit-border-radius: 5px; -moz-border-radius: 5px; outline: none; } .field textarea { margin: 0; padding: 5px; height: 190px; background: #CCC; border: 1px solid #CCC; font: 14px Arial; -webkit-border-radius: 5px; -moz-border-radius: 5px; outline: none; } .field textarea:focus { background-color: #FFF; border-color: #FFF; } .field.checkbox { } .field.checkbox input { width: auto; } .field input.inline { margin-bottom: 5px; width: 250px; } .buttons { } .buttons button { margin: 0; padding: 5px 10px; font-weight: bold; text-transform: uppercase; border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; cursor: pointer; } .buttons a { padding: 4px 9px; display: block; font-size: 11px; font-weight: bold; line-height: 15px; text-transform: uppercase; text-decoration: none; border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .buttons a:hover { }