@charset "utf-8"; /* CSS Document */ /* Theme Name: Quick Service Bicycle Shop Default Theme URI: http://www.quickservicecycle.com/ Description: A modified WordPress theme based on the famous Kubrick. Version: 1.6 Author: Whitney Inkster Author URI: http://www.winkwebdesign.com/ Tags: green, red, fixed width, two columns, widgets */ html {height: 100%; margin-bottom: 1px;} /* Normalize margin and padding */ h1, h2, h3, h4, h5 {margin: 0;padding: 0;} /* Normalize font-size for headers */ h1, h2, h3, h4, h5 {font-size: 100%;font-family: Arial, Helvetica, sans-serif;} /* Remove border from img */ img {border: none;} body {background: #c1cea2 url(images/body-bg.png) repeat-x;margin: 0;padding: 0;font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;font-size: 80%;text-align: center;color: #000;} a {color: #414257; text-decoration: underline;} a:hover {color: #900; text-decoration: none;} h3, h4, h5, p, ul, li {margin: 5px;padding: 5px;} h1, h2, h3, h4, h5 {color: #85150a;} h2 {margin: 5px;padding: 15px 5px 26px 5px;font-size: 1.7em;font-weight: normal;} #electric-bikes h2 {margin: 0 5px 5px 5px;padding: 0 5px 5px 46px;line-height: 68px;background: url(images/bolt.png) no-repeat left center;} #products.redline #redline-h2-padding {margin: 5px; padding: 15px 5px 26px 5px;} #products.redline h2 {position: relative;margin: 0;padding: 0;width: 233px;height: 42px;overflow: hidden;} #products.redline h2 span {position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: url(images/redline-h2.png) no-repeat;} #wrapper {width: 996px;margin: 0 auto;text-align: left;} #header {width: 996px;height: 234px;background: url(images/header-bg.png) no-repeat;position: relative;} #header h1 {width: 483px;height: 187px;position: relative;margin: 0;padding: 0;text-align: center;line-height: 187px;font-size: 1.8em;color: #85150a;overflow: hidden;} #header h1 span {position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: url(images/logo-bg.png) no-repeat;} #years {position: absolute;top: 142px;left: 503px;} #years p {font-weight: bold;font-size: 0.9em;color: #b81a0a;} #nav-box {position: relative;padding: 0;} #nav {position: absolute;top: -5px;right: 100px;width: 530px;height: 68px;float: right;margin: 0;padding: 0;} div#nav ul {list-style: none;margin: 0;padding: 0;display: block;} div#nav li {list-style: none;margin: 0;padding: 0;float: left;position: relative;font-size: 1.0em;} div#nav li a {display: block;font-weight: bold;overflow: hidden;border: none;margin: 0;padding: 0;cursor: pointer;} div#nav li.home, div#nav li.history, div#nav li.products, div#nav li.services, div#nav li.gallery, div#nav li.rides, div#nav li.directions, div#nav li.contact {height: 68px;position: relative;} div#nav li.home {width: 52px;} div#nav li.history {width: 60px;} div#nav li.products {width: 72px;} div#nav li.services {width: 69px;} div#nav li.gallery {width: 61px;} div#nav li.rides {width: 61px;} div#nav li.directions {width: 80px;} div#nav li.contact {width: 64px;} div#nav li.home span, div#nav li.history span, div#nav li.products span, div#nav li.services span, div#nav li.gallery span, div#nav li.rides span, div#nav li.directions span, div#nav li.contact span {position: absolute;width: 100%;height: 100%;} div#nav li.home span {background: url(images/button-home.png) no-repeat;} div#nav li.history span {background: url(images/button-history.png) no-repeat;} div#nav li.products span {background: url(images/button-products.png) no-repeat;} div#nav li.services span {background: url(images/button-services.png) no-repeat;} div#nav li.gallery span {background: url(images/button-gallery.png) no-repeat;} div#nav li.rides span {background: url(images/button-rides.png) no-repeat;} div#nav li.directions span {background: url(images/button-directions.png) no-repeat;} div#nav li.contact span {background: url(images/button-contact.png) no-repeat;} div#nav li.home:hover span, div#nav li.history:hover span, div#nav li.products:hover span, div#nav li.services:hover span, div#nav li.gallery:hover span, div#nav li.rides:hover span, div#nav li.directions:hover span, div#nav li.contact:hover span, #home div#nav li.home span, #history div#nav li.history span, #products div#nav li.products span, #electric-bikes div#nav li.products span, #services div#nav li.services span, #gallery div#nav li.gallery span, #rides div#nav li.rides span, #directions div#nav li.directions span, #contact div#nav li.contact span {background-position: 0 -71px;} #container {margin: 0;padding: 0;background: url(images/content-bg.png) repeat-y;} #container-top {background: url(images/content-top-bg.png) no-repeat;} #container-bottom {background: url(images/content-bottom-bg.png) no-repeat left bottom;} #content {min-height: 406px;} div.content-padding {margin: 0;padding: 10px 110px 100px 80px;} #home-box {min-height: 180px;padding: 10px 0 10px 20px;} html>body #home-box {overflow: auto;} #home-picture, #home-links, #home-events {float: left;} #home-picture {width: 214px;height: 179px;margin: 0;padding: 0;background: url(images/home-picture-bg.png) no-repeat;} #home-picture p {margin: 0;padding: 16px 0 0 19px;} #home-links {width: 248px;margin: -10px 0 0 0;padding: 0;} #home-links ul, #home-links li {list-style: none;padding: 0;} #home-links ul {margin: 0 0 0 10px;} #home-links li {float: left;display: block;overflow: hidden;margin:0;} #home-links li a {display: block;cursor: pointer;margin: 0;padding: 0;overflow: hidden;} #home-links li.electric, #home-links li.trek, #home-links li.redline , #home-links li.gt{position: relative;} #home-links li.electric {width: 121px;height: 83px;} #home-links li.trek {width: 121px;height: 50px;margin: 0 0 0 30px;} #home-links li.redline {width: 97px;height: 46px;margin: 0 0 0 70px;} #home-links li.gt {width: 128px;height: 43px;margin: 6px 0 0 100px;} #home-links li.electric span, #home-links li.trek span, #home-links li.redline span, #home-links li.gt span {position: absolute;width: 100%;height: 100%;} #home-links li.electric span {background: url(images/electric-bike-button.png) no-repeat;} #home-links li.electric:hover span {background-position: 0 -84px;} #home-links li.trek span {background: url(images/trek-button.png) no-repeat;} #home-links li.trek:hover span {background-position: 0 -58px;} #home-links li.redline span {background: url(images/redline-button.png) no-repeat;} #home-links li.redline:hover span {background-position: 0 -48px;} #home-links li.gt span {background: url(images/gt-button.png) no-repeat;} #home-links li.gt:hover span {background-position: 0 -53px;} #home-events {width: 270px;margin: 0 0 0 20px;padding: 0;} #home-events h3.home-events-h3 {margin: 0 5px 5px 5px;padding: 0 5px 5px 5px;} #home-events li {margin: 0 0 0 5px;padding: 0 0 0 5px;} #products ul, div.category-rides ul {margin-left: 15px;} a#product-frame {float: left;width: 172px;height: 177px;background: url(images/product-bg.png) no-repeat;} a#product-frame img {padding-top: 19px;padding-left: 26px;} div.trek-padding {float: left;width: 213px;padding: 0;margin: 0 24px 0 24px;} div.trek-padding p {text-align: center;font-size: 1.1em;font-style: italic;} a#product-frame-trek {float: left;width: 213px;height: 164px;background: url(images/product-bg-trek.png) no-repeat;} a#product-frame-trek img {padding-top: 21px;padding-left: 22px;} div.redline-padding {float: left;width: 213px; padding: 0;margin: 0 24px 0 24px;} div.redline-padding p {text-align: center;font-size: 1.1em;font-style: italic;} a#product-frame-redline {float: left;width: 213px;height: 186px;background: url(images/product-bg-redline.png) no-repeat;} a#product-frame-redline img {padding-top: 23px;padding-left: 22px;} div.mirraco-padding {float: left;width: 213px;padding: 0;margin: 0 24px 0 24px;} div.mirraco-padding p {text-align: center;font-size: 1.1em;font-style: italic;} a#product-frame-mirraco {float: left;width: 213px;height: 168px;background: url(images/product-bg-mirraco.png) no-repeat;} a#product-frame-mirraco img {padding-top: 22px;padding-left: 22px;} div.gt-padding {float: left;width: 213px;padding: 0;margin: 0 24px 0 24px;} div.gt-padding p {text-align: center;font-size: 1.1em;font-style: italic;} a#product-frame-gt {float: left;width: 213px;height: 164px;background: url(images/product-bg-gt.png) no-repeat;} a#product-frame-gt img {padding-top: 21px;padding-left: 22px;} p.photo-credits {font-size: 10px; color:#666; text-align: center;} #sidebar {clear: both;width: 150px;float: right;padding-top: 60px;} #footer {clear: both;background: url(images/footer-bg.png) no-repeat;min-height: 101px;margin: 0;padding: 10px 0 0 0;} #footer p {font-size: 0.85em;} #address {width: 496px;float: left;} #address-padding {padding: 0 0 0 214px;text-align: center;} #footer span.design {font-size: 0.7em;font-style: italic;color: #999;} #footer span.design a {color: #999;text-decoration: none;} #footer span.design a:hover {color: #666;} #hours {width: 220px;float: left;} #hours-padding {padding: 0 0px 0 0;text-align: center;} /* Begin Images */ p img {padding: 0;max-width: 100%;} /* Using 'class="alignright"' on an image will (who would've thought?!) align the image to the right. And using 'class="centered', will of course center the image. This is much better than using align="center", being much more futureproof (and valid) */ img.centered {display: block;margin-left: auto;margin-right: auto;} img.alignright {padding: 4px;margin: 0 0 2px 7px;display: inline;} img.alignleft {padding: 4px;margin: 0 7px 2px 0;display: inline;} .alignright {float: right;} .alignleft {float: left} /* End Images */ /* Begin Various Tags & Classes */ acronym, abbr, span.caps {cursor: help;} acronym, abbr {border-bottom: 1px dashed #999;} blockquote {margin: 15px 30px 0 10px;padding-left: 20px;border-left: 5px solid #ddd;} blockquote cite {margin: 5px 0 0;display: block;} .center {text-align: center;} .hidden {display: none;} hr {display: none;} a img {border: none;} .navigation {display: block;text-align: center;margin-top: 60px;margin-bottom: 20px;} div.archive {padding-bottom: 30px;} .clear {clear: both;} /* IE7 hack to fix navigation on posts */ *:first-child+html div.navigation {margin-bottom: -60px;} /* End Various Tags & Classes*/