/* Theme Name: Kimballs Theme URI: http://www.kimballspub.com Description: Themed by Phil Warner Version: .1a Author: Phil Warner Author URI: */ /* fonts from fontsquirrel.com*/ @import url("fonts/Imperator/stylesheet.css"); /* Chris Meyer Reset */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /*** PAGE LAYOUT ***/ @charset "utf-8"; /* ### KimballsPub.com Color Palette Hex Codes */ /* Debug - highlight containers #header{border:1px solid #f0f;} #content{border:1px solid #f00; } #footer{border:1px solid #00f;} #navigation{border:1px solid #00f} #navigation ul li{border:1px solid #f00} #photoStream{border:1px solid #00f} #info > p{border:1px solid #fff} #info{border:1px solid #fff} ul.widget-list li{border:1px solid #f0f;} */ body{background:url('images/bg_repeat.jpg')} #gr{position:fixed; top:0; left:0; right:0; height:300px; background:url('images/bodyBg.png') repeat-x} /* Wrapper for everything */ #wrapper{display:block; position:relative; margin:0 auto; width:955px; height:auto; overflow:visible;} /* header */ #header{position:relative; height:90px; padding:20px 5px; width:100%;} /* image/ logo*/ #header img{margin:0 0 0 1%;} /* Main logo */ #logo{width:33%;} /* hours/map/phone */ #info{position:absolute; left:35%; top:15px; width:375px;} #info > p{padding:4px 0 0 16px; font-size:.75em; letter-spacing:0px; font-weight:normal; background-position: 3px 3px; background-repeat:no-repeat; color:#fff;} p#address,p#hours,p#phone{float:left; width:200px; margin:0; background-position:2px 8px;} p#address{width:175px; background-image:url('images/icons/circle_fff.png')} p#hours{width:225px; background-image:url('images/icons/clock_fff.png')} p#phone{background-image:url('images/icons/person_fff.png')} /* announcement box */ div.announcement{background:#fff; opacity:.8; border-radius:3px;} div.announcement h3{padding-top:10px;} div.announcment{float:right; width:360px; padding:5px 10px; margin:0 5px 5px; background: #FFFF99; opacity:.8; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; box-shadow: 0 0 10px #000;} div.announcment p{padding-top:1px; background:url('images/icons/information.png') 5px 0 no-repeat;} div.announcment img{float:right;} div.announcment a{color:#222;} /* Navigation */ #navigation{height:70px; width:1040px; margin-left:-40px; margin-bottom:10px; background:url('images/navBg.png') top center no-repeat; } #navigation ul{display:block; margin:0 auto; } #navigation ul li{position:relative; display:block; float:left; width:16%; text-align:center; padding:25px 0 0 0} #navigation ul li a{padding-right:20px; font-weight:normal; color:#fff; font: 36px/36px 'ImperatorRegular', serif; letter-spacing:-2px; background:url('images/icons/arrow_fff_right.png') right center no-repeat; text-decoration:none;} #navigation ul li a.home{padding-left:16px; background:url('images/icons/home_fff.png') left 14px no-repeat} #navigation ul li a.contact{padding-left:16px; background:url('images/icons/envelope_fff.png') left 14px no-repeat} #navigation ul li a:hover{text-decoration:none;} #navigation ul li a.active{} /* content */ #content{} /* photostream */ #photoStream{position:relative; width:100%; height:170px; text-align:center} #photoStream img{height:80%; border:3px solid #eee; box-shadow: 0 0 10px #000; margin:10px 0; border-radius:3px; /*transform:rotate(3deg);*/ -ms-transform:rotate(3deg); /* IE 9 */ } #photoStream img.even { transform:rotate(-2deg); -ms-transform:rotate(-2deg); /* IE 9 */ } .section{width:auto; padding:5px .5%; margin:5px 1%; background:#fff; border-radius:3px; box-shadow: 0 0 10px #000; overflow:auto;} /* feeds */ .data{display:none;} #feeds h2{padding:0; text-transform:lowercase ;background-position:left 14px; background-repeat:no-repeat; padding-left:13px;} #feeds h3{padding:0; text-transform:uppercase; font-size:16px} div#feeds p{padding:0 0 15px 10px; color:#333; font-size:14px; font-weight:normal} div#feeds p.description{padding:0 0 5px 0; margin:-8px 0 0 0;} div#feeds a{color:#36f} /* twitter feed */ div#twitter{} #twitter h2{background-image:url('images/icons/dialog_orange.png');} ul.tweet_list{list-style-type:none; margin:0; padding:0 0 0 5px} ul.tweet_list li{padding:0 0 10px 0; color:#222; font-size:14px} ul.tweet_list li .tweet_text a{display:block; text-align:right; color:#0033FF; background:#eee; padding:5px 5px 2px 5px;} ul.tweet_list li .tweet_time a{display:block; text-align:left; color:#0033FF; font-size:12px; font-weight:normal;} li.tweet_first tweet_odd{} /* events feed */ div#events{} #events h2{background-image:url('images/icons/calendar_orange.png');} div#events h3{} /* drink special module */ div#drinks{} div#drinks h3{} div#drinks ul{padding:0 0 15px 20px; color:#333; font-size:14px; font-weight:normal} /* Widget area */ ul.widget-list{margin:0; padding:0; list-style-type:none;} ul.widget-list > li{display:block; float:left;}/* This is a container... */ ul.widget-list li h3.widget-title{margin:0; padding:15px 0; font-size:1.55em; } ul.widget-list li ul{margin:0; padding:0 0 10px 0; list-style-type:none;} ul.widget-list li ul li{padding:0 0 10px 0; font-size:1.25em;} ul.widget-list li ul li span.post-date{display:block; padding-top:3px; font-size:.9em; } /* columnar layout */ .c100,.c66,.c50,.c33{float:left; overflow:visible;} .c100{width:100%} .c66{width:66%} .c50{width:47%; } .c33{width:31%; padding:0 1%;} .cb{clear:both} .cl{clear:left} /* Default Text */ h1, h2, h3, h4, h5, h6, p, ul, ol, legend, label, table, .checkboxes{padding-left:20px; font: .8em/1.3em 'ImperatorRegular', serif; letter-spacing:0; color:#111} /* Headings */ h1{font-size: 1.75em; line-height:1.9em; letter-spacing:-1px;} h2{font-size: 1.5em; line-height:1.5em; letter-spacing:-1px;} h3{font-size:1.15em; line-height:1.2em; letter-spacing:-1px;} h4{} h5{} h6{} /* anchors */ a, .fauxlink{font-weight:normal; text-decoration:underline; color:#fff; cursor:pointer} .section a{color:#222;} a:hover, .fauxlink:hover{font-weight:normal;} a:active{color: #222} a:visited{color: #222} .pdf{padding-right:16px; background:url('images/pdficon_small.gif') right center no-repeat;} /* content types (paragraph, lists, blockquotes) */ p,ul{color:#111} p{padding:0 5px 25px 25px;} ul,ol{padding:0 5px 25px 35px; list-style-type:square} /* content type modifiers */ strong{font-weight:bold} .shrink{font-size:.8em} .shrinker{font-size:.6em} .nobefore{padding-top:0} .nobottom{padding-bottom:0} .smallcaps{font-size:.8em; text-transform:upper; color:#444} p.bigger{font-size:14px;} .fl{float:left;padding:0 5px 5px 0; border:3px solid #fff;} .fr{float:right;padding:0 0 5px 5px; border:3px solid #fff;} /* Table */ table{margin:10px 2px; padding:0; background:#fff; border:1px solid #ccc; opacity:.8; border-radius:3px;} table tr{border-bottom:1px solid #000} table th{background:none; font-size:18px; font-weight:bold; padding:10px; text-align:center; border-bottom:1px solid #fff } table tr.head{} table tr td{padding:5px; font-size:11px; text-align:center; border-bottom:1px solid #444} #beer{width:99.5%} #beer th span{display:block; height:16px; width:16px; float:right; background:url('images/sort.gif') center center no-repeat;} #beer th:hover{background:#eee; cursor:pointer; text-decoration:underline;} /* Footer */ #footer{padding:20px; clear:both; text-align:center;} #content .noPadding{padding:0;} .hide{display:none;} .border{padding:1px; border:1px solid #b3382d} img.w100{padding:5px 15px; width:95%} .w50{float:left; width:49%} div.w50{float:left; width:49%} .w20{width:19%} .center{display:block; margin:0 auto} img.handle{cursor:pointer;} /* Forms */ #content form { margin:0 40px 40px;} #content form fieldset { border:1px solid #ccc; padding:0px 20px 10px; margin:0 0 10px; background-color: #fff; /* fallback color */ background-repeat: repeat-x; /* fallback repeat */ background-image: -moz-linear-gradient(100% 100% 90deg, #efefef, #fefefe); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fefefe), to(#efefef)); } form legend {font-size:1.5em; font-weight:bold;color:#333;} form fieldset fieldset { padding:0 40px 0; margin:5px -20px; border:none; border-top:1px solid #ddd; background:none;} form fieldset fieldset legend { font-size:13px; font-weight:bold; text-transform:none; padding:0; margin:0; color:#333} form fieldset fieldset label { float:left; margin:2px 5px 0 0; color:#222; font-size:11px; padding:0; font-weight:normal; text-transform:none;} form label {display:block; padding:5px 20px 0 0; font-size:12px; font-weight:normal; text-transform:none;} form input, #content form textarea { margin:0 5px 10px 0; background:#fff; border:1px solid #999;padding:2px;} form p{margin-left:0; padding-left:0;} .submit { margin:0 5px 0 40px; background: #fff; padding:8px 16px; border:1px solid #999; font-weight:bold; color:#444; cursor:pointer;} label.error {padding:12px 5px 3px 5px; display:inline-block;} .error img{margin-top:5px;} #content form input[type="checkbox"] {background:none; border:0; margin:0 3px 0 0;} .checkboxes{margin:0; padding:0 0 0 25px;color:#333} /* COLORBOX */ /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block;} .cboxIframe{width:100%; height:100%; display:block; border:0;} /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#fff;} #colorbox{} #cboxTopLeft{width:25px; height:25px; background:url(../images/colorbox/border1.png) no-repeat 0 0;} #cboxTopCenter{height:25px; background:url(../images/colorbox/border1.png) repeat-x 0 -50px;} #cboxTopRight{width:25px; height:25px; background:url(../images/colorbox/border1.png) no-repeat -25px 0;} #cboxBottomLeft{width:25px; height:25px; background:url(../images/colorbox/border1.png) no-repeat 0 -25px;} #cboxBottomCenter{height:25px; background:url(../images/colorbox/border1.png) repeat-x 0 -75px;} #cboxBottomRight{width:25px; height:25px; background:url(../images/colorbox/border1.png) no-repeat -25px -25px;} #cboxMiddleLeft{width:25px; background:url(../images/colorbox/border2.png) repeat-y 0 0;} #cboxMiddleRight{width:25px; background:url(../images/colorbox/border2.png) repeat-y -25px 0;} #cboxContent{background:#fff; overflow:hidden;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:20px;} #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;} #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;} #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;} #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;} #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;} #cboxLoadingOverlay{background:#fff url(../images/colorbox/loading.gif) no-repeat 5px 5px;} #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;} /* The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill when an alpha filter (opacity change) is set on the element or ancestor element. This style is not applied to or needed in IE9. See: http://jacklmoore.com/notes/ie-transparency-problems/ */ .cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); } /* The following provides PNG transparency support for IE6 Feel free to remove this and the /ie6/ directory if you have dropped IE6 support. */ .cboxIE6 #cboxTopLeft{background:url(../images/colorbox/ie6/borderTopLeft.png);} .cboxIE6 #cboxTopCenter{background:url(../images/colorbox/ie6/borderTopCenter.png);} .cboxIE6 #cboxTopRight{background:url(../images/colorbox/ie6/borderTopRight.png);} .cboxIE6 #cboxBottomLeft{background:url(../images/colorbox/ie6/borderBottomLeft.png);} .cboxIE6 #cboxBottomCenter{background:url(../images/colorbox/ie6/borderBottomCenter.png);} .cboxIE6 #cboxBottomRight{background:url(../images/colorbox/ie6/borderBottomRight.png);} .cboxIE6 #cboxMiddleLeft{background:url(../images/colorbox/ie6/borderMiddleLeft.png);} .cboxIE6 #cboxMiddleRight{background:url(../images/colorbox/ie6/borderMiddleRight.png);} .cboxIE6 #cboxTopLeft, .cboxIE6 #cboxTopCenter, .cboxIE6 #cboxTopRight, .cboxIE6 #cboxBottomLeft, .cboxIE6 #cboxBottomCenter, .cboxIE6 #cboxBottomRight, .cboxIE6 #cboxMiddleLeft, .cboxIE6 #cboxMiddleRight { _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')"); }