/* Start of CMSMS style sheet 'stylesheet' */
/* The Oxford Cycle Workshop CSS 2.1 Stylesheet (Screen) - 15/10/09 */
/* Import Stylesheets */

@import "uploads/assets/css/960.css";
@import "uploads/assets/css/text.css";
@import "uploads/assets/css/reset.css";






/* Layout */

html {
    background: transparent url(../uploads/assets/images/page-bg.gif) top left repeat;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
}

.nomargin {
    margin: 0 !important;
}

#contactus, #advicecontact, .button, .png, .image {
    position: absolute;
}

#page {
    padding: 44px 0 0 0;
}

.services-page h1, .bikes-and-parts-page h1 {
    display: none;
}

#headertop {
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 10px;
    position: absolute;
    top: 0;
    z-index: 1;
}

#headertop #wrapper, #footer {
    background-color: #9ead7e;
}

#topnavigation li, #topnavigation li a {
    display: inline-block;
    float: left;
}

#topnavigation .active {
    background-color: #9c9354;
}

#topnavigation li a {
    padding: 15px;
}

#topnavigation #co-topnav {
    width: 960px;
}

#topnavigation #co-topnav a {
    background: transparent url(../uploads/assets/images/co-topnav.gif) center no-repeat;
    width: 117px;
    height: 18px;
}

#topnavigation #ocw-topnav a {
    background: transparent url(../uploads/assets/images/ocw-topnav.gif) center no-repeat;
    width: 133px;
    height: 17px;
}

#topnavigation #ocwtraining-topnav a {
    background: transparent url(../uploads/assets/images/ocwtraining-topnav.gif) center no-repeat;
    width: 73px;
    height: 17px;
}

#topnavigation #ocwcoop-topnav a {
    background: transparent url(../uploads/assets/images/ocwcoop-topnav.gif) center no-repeat;
    width: 80px;
    height: 16px;
}

#topnavigation #co-topnav.active a {
    background: transparent url(../uploads/assets/images/co-topnav-active.gif) center no-repeat;
}

#topnavigation #ocw-topnav.active a {
    background: transparent url(../uploads/assets/images/ocw-topnav-active.gif) center no-repeat;
}

#topnavigation #ocwtraining-topnav.active a {
    background: transparent url(../uploads/assets/images/ocwtraining-topnav-active.gif) center no-repeat;
}

#topnavigation #ocwcoop-topnav.active a {
    background: transparent url(../uploads/assets/images/ocwcoop-topnav-active.gif) center no-repeat;
}

#headerbottom {
    padding-top: 22px;
}

#headerbottom #logo, #headerbottom #logo a {
    width: 234px;
    height: 120px;
    display: block;
}

#headerbottom #logo {
    overflow: hidden;
}

#headerbottom #logo a {
    background: transparent url(../uploads/assets/images/ocw-logo.png) top left no-repeat; 
    text-indent: -4000px;
}

#navigation {
    width: 285px;
    margin-top: 22px;
}

#headerbottom #homenav {
    background: transparent url(../uploads/assets/images/headerbottom-bg.gif) bottom right no-repeat;
    min-height: 340px;
    height: auto !important;
    height: 340px;
    postion: relative;
}

#headerbottom #homenav .button {
    top: 130px;
    right: -20px;
    -moz-transform: rotate(-25deg);
    -webkit-transform: rotate(-25deg);
}

#navigation ul {
    display: inline-block;
}

#navigation ul li, #navigation ul li a {
    float: left;
    display: inline-block;
}

#navigation ul li {
    margin: 5px;
}

#navigation a, #openingtimes, #history {
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -icab-border-radius: 10px;
    -o-border-radius: 10px;
    -khtml-border-radius: 10px;
}

#navigation a {
    background-color: #cad8aa;
    border: 2px solid #b8c799;
    padding: 2.5px 5px;
}

#navigation .currentpage a, #navigation .menuparent a {
    background-color: #ffba00;
    border: 2px solid #e9ab00;
}

#navigation .currentpage a:hover, #navigation .menuparent a:hover {
    border-color: #ffba00;
}

#navigation a:hover {
    border-color: #CAD8AA;
}

#navigation ul .bikes-and-parts {
    margin-left: 32px;
}

#welcometext {
    margin-top: 30px;
    display: inline-block;
}

#homemap {
    background: transparent url(../uploads/assets/images/map-bg.gif) top center no-repeat;
}

#homemap #map {
    width: 340px;
    height: 280px;
    margin: 25px 30px 10px 30px;
    display: block;
}

#homemap #map .mapbike, #gmapmarker {
    width: 270px;
    display: inline-block;
}

#homemap #map .mapbike {
    margin: 7.5px 0 0 5px;
}

#homemap #map .mapbike .mapimage {
    margin-right: 15px !important;
}

#homemap #map .mapbike .link {
    width: 170px;
    float: left;
    display: inline-block;
}

#viewmap {
    background: transparent url(../uploads/assets/images/viewmap-title.gif) top left no-repeat;
    width: 134px;
    height: 18px;
    margin: 0 30px 10px 0;
    display: inline-block;
}

.home-page #content .container_16, .contact-us-page #content .container_16 {
    position: relative;
}

.home-page #content .container_16 {
    background: transparent url(../uploads/assets/images/home-bg.gif) bottom left no-repeat;
}

.contact-us-page #content .container_16, .services-page #content .container_16 {
    background: transparent url(../uploads/assets/images/content-bg.gif) bottom right no-repeat;
}

.bikes-and-parts-page #content .container_16 {
    background: transparent url(../uploads/assets/images/bikescontent-bg.gif) bottom right no-repeat;
}

#content #partsbin {
    background: transparent url(../uploads/assets/images/partsbin-bg.gif) 100% 20% no-repeat;
}

#contactus {
    background: transparent url(../uploads/assets/images/contactus.gif) top left no-repeat;
    width: 170px;
    height: 92px;
    top: 186px;
    right: 0;
    z-index: 1;
}

#advice {
    margin-top: -30px;
}

#advice h2, #parts h2, #bikes h2, #footer h2, #contactmap h2, #bikeadvice h2, .services-page #content h2, #bikefeed h2, #partfeed h2 {
    text-indent: -4000px;
    overflow: hidden;
}

#advice h2, #bikeadvice h2 {
    background: transparent url(../uploads/assets/images/bikeadvice-title.gif) top left no-repeat;
    width: 138px;
    height: 33px;
    margin-bottom: 5px;
}

#advice ul li, #advice ul li a {
    display: block;
}

#advice ul {
    background: transparent url(../uploads/assets/images/bikeadvice-bg.gif) bottom center no-repeat;
    padding-bottom: 44px;
}

#advice ul li {
    margin-bottom: 2px;
}

#advice ul li a {
    background-color: #cad8aa;
    width: 246px;
    padding: 5px 15px;
    border: 2px solid #b9c89b;
}

#parts {
    background: transparent url(../uploads/assets/images/parts-bg.gif) top left no-repeat;
    margin-top: 10px;
    padding: 20px 0px 0 30px;
}

#parts h2, #bikes h2, #bikefeed h2, #partfeed h2, .titlerss {
    float: left;
}

#parts h2, .titlerss, #parts #flickr, #parts #moreparts {
    display: inline-block;
}

#parts h2, #partfeed h2 {
    background: transparent url(../uploads/assets/images/parts-title.png) top left no-repeat;
    width: 103px;
    height: 19px;
}

.titlerss {
    background: transparent url(../uploads/assets/images/rssicon.png) top left no-repeat;
    width: 21px;
    height: 22px;
    margin-left: 10px;
}

#flickr img, #bikes img, #bikefeed img {
    display: block;
}

#parts #flickr {
    width: 360px;
}

#parts #flickr .flickrimg, #partfeed #flickr .flickrimg, #homemap #map .mapbike .mapimage {
    width: 75px;
    height: 75px;
    margin: 0 5px 5px 0;
    border: 4px solid #cad8aa;
    float: left;
}

#parts #moreparts {
    background: transparent url(../uploads/assets/images/moreparts-title.png) top left no-repeat;
    width: 113px;
    height: 18px;
    margin: 10px 10px 10px 0;
    float: right;
}

#bikes {
    min-height: 330px;
    height: auto !important;
    height: 330px;
}

#bikes h2, #bikefeed h2 {
    background: transparent url(../uploads/assets/images/bikes-title.gif) top left no-repeat;
    width: 237px;
    height: 40px;
}

#bikes #bikeflickr {
    width: 760px;
    display: block;
    clear: both;
}

#bikes #bikeflickr .bike {
    margin: 0 10px 10px 0;
    display: inline-block;
}

#bikes #bikeflickr .flickrimg, #bikes #morebikes {
    display: block;
}

#bikes #bikeflickr .bike {
    background: transparent url(../uploads/assets/images/bike-bg.gif) bottom left no-repeat;
    padding-bottom: 32px;
    float: left;
}

#bikes #bikeflickr .flickrimg {
    width: 163px;
    height: 115px;
    border: 4px solid #cad8aa;
    border-bottom: none;
}

#bikes #morebikes {
    background: transparent url(../uploads/assets/images/morebikes-title.gif) bottom left no-repeat;
    width: 115px;
    height: 18px;
    margin-right: 42px;
    float: right;
}

.contact-us-page #content .container_16, .services-page #content .container_16, .bikes-and-parts-page #content .container_16 {
    padding: 10px 0 60px 0;
}

#content h1, #content h2, #content h3, #content h4, #content h5, #content h6, #content p {
    margin-bottom: 20px;
}

#contentcontainer {
    background: transparent url(../uploads/assets/images/contentcontainerbottom-bg.gif) bottom left no-repeat;
    padding-bottom: 39px;
}

#content #contentwrapper {
    background-color: #FFF;
    width: 540px;
    min-height: 470px;
    height: auto !important;
    height: 470px;
    padding: 0 20px;
    display: inline-block;
}

#contactform, #contactmap {
    position: relative;
}

#contactform, #bikeadvicecontent, #contentpageright {
     background: transparent url(../uploads/assets/images/contentcontainertop-bg.gif) top left no-repeat;
     padding-top: 20px;
}

#contactform {
    min-height: 716px;
    height: auto !important;
    height: 716px;
}

#contactform .png {
    bottom: -30px;
    right: -80px;
}

#contactform .contactus label {
    margin-bottom: 5px;
    display: block;
    clear: both;
}

#contactform .contactus input, textarea {
    background: #FFF url(../uploads/assets/images/input-bg.gif) top right no-repeat;
    margin-bottom: 10px;
    padding: 5px;
    border: 1px solid #dedede;
}

#contactform .contactus textarea {
    width: 440px;
    height: 278px;
}

#contactform fieldset div input {
    width: 275px;
}

#contactform .submit input {
    background: #545454;
    padding: 7.5px;
    margin-top: 15px;
    border: none;
}

#contactform .formerror, #bikeadvicecontent img, .servicecontent img {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -icab-border-radius: 5px;
    -o-border-radius: 5px;
    -khtml-border-radius: 5px;
}

#contactform .formerror {
    background-color: #FF5454;
    padding: 5px;
}

#footer #submit:hover, #contactform .submit input:hover {
    cursor: pointer;
}

#contactmap .button {
    top: -52px;
    right: 0;
    -moz-transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
}

#contactmap h2 {
    background: transparent url(../uploads/assets/images/contactmap-title.gif) top left no-repeat;
    width: 165px;
    height: 32px;
    display: block;
}

#contactmap #map {
    width: 340px;
    height: 310px;
    margin-bottom: 20px;
    display: block;
}

#contactmap #address {
    background: transparent url(../uploads/assets/images/address-bg.gif) top left no-repeat;
    padding-top: 31px;
}

#contactmap #address p {
    background-color: #cad8aa;
    border: 2px solid #91c999;
    border-top: none;
    padding: 0 20px 20px 20px;
}

#openingtimes, #history {
    background-color: #CAD8AA;
    margin: 20px 0;
    padding: 10px 20px;
}

#openingtimes {
    background-color: #CAD8AA;
}

#history {
    background-color: #9EAD7E;
}

#openingtimes p {
    margin: 0;
}

.bike-advice-page #content .container_16, .content-page #content .container_16  {
    background: transparent url(../uploads/assets/images/bikeadvicecontent-bg.gif) bottom right no-repeat;
    padding-bottom: 60px;
}

.bike-advice-page #headerbottom .container_16 {
    background: transparent url(../uploads/assets/images/bikeadviceheader-bg.gif) 71% 93% no-repeat;
}

#advicecontact {
    background: transparent url(../uploads/assets/images/contactus-advice.gif) top left no-repeat;
    width: 157px;
    height: 58px;
    display: block;
    top: -110px;
    right: 0px;
}

#bikeadvice h2 {
    margin-top: 20px;
}

#bikeadvicecontent img, .servicecontent img {
    border: 5px solid #cad8aa;
}

#bikeadvicesubnav {
    background: transparent url(../uploads/assets/images/bikeadvice-bg.gif) bottom center no-repeat;
    padding-bottom: 44px;
}

.bikeadvicemenu, #bikeadvice ul li a {
    width: 256px;
}

#bikeadvice ul li ul li a {
    width: 192px;
}

.bikeadvicemenu {
    background-color: #cad8aa;
    width: 256px;
    padding: 5px 10px;
    border: 2px solid #b9c89b;
    margin-bottom: 2px;
}

#advice li a {
    background: transparent url(../uploads/assets/images/adviceitem-bg.gif) 95% 50% no-repeat;
}

.bikeadvicemenu .topmenu a, .bikeadvicemenu a.menuparent {
    background: transparent url(../uploads/assets/images/adviceitem-bg.gif) 98% 50% no-repeat;
}

.bikeadvicemenu a.menuactive.menuparent {
    background: transparent url(../uploads/assets/images/adviceitemactive-bg.gif) 98% 50% no-repeat;
}

.bikeadvicemenu li, .bikeadvicemenu li a {
    display: block;
}

.bikeadvicemenu li .hide {
    width: 222px;
    margin: 10px 10px 10px 20px;
}

#bikeadvicecontent {
    position: relative;
}

#bikeadvicecontent .button {
    border: none;
    top: -30px;
    right: -40px;
    -moz-transform: rotate(-17deg);
    -webkit-transform: rotate(-17deg);
}

.services-page #content .left, .services-page #content .right {
    width: 480px;
}

.services-page #content .right {
    padding-top: 26px;
}

.services-page #content {
    padding-top: 40px;
}

.services-page #content .grid_8 {
    margin-bottom: 20px;
    position: relative;
}

#service1 h2, #service2 h2, #service3 h2, #service4 h2 {
    height: 34px;
    margin: 0;
}

#service1 h2 {
    background: transparent url(../uploads/assets/images/repairs-title.gif) top left no-repeat;
    width: 107px;
}

#service2 h2 {
    background: transparent url(../uploads/assets/images/custombikebuilds-title.gif) top left no-repeat;
    width: 228px;
}

#service3 h2 {
    background: transparent url(../uploads/assets/images/mobilemechanics-title.gif) top left no-repeat;
    width: 218px;
}

#service4 h2 {
    background: transparent url(../uploads/assets/images/workshopaccess-title.gif) top left no-repeat;
    width: 209px;
}

.servicecontent {
    background: transparent url(../uploads/assets/images/service-bg.gif) top left no-repeat;
    width: 400px;
    padding: 20px 30px;
}

#service1 .png {
    top: -20px;
    right: 150px;
}

#service1 .button {
    top: -30px;
    right: 30px;
    -moz-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
}

#service2 .png {
    top: -120px;
    right: -10px;
}

#service3 .image {
    top: -100px;
    right: 0;
}

#service3 .png {
    bottom: -40px;
    right: -20px;
}

#service4 .png {
    top: -5px;
    right: 145px;
}

.bikes-and-parts-page #content {
    padding-top: 30px;
}

.bikes-and-parts-page #headerbottom .container_16 {
    background: transparent url(../uploads/assets/images/bikesandparts-bike.gif) 86% 100% no-repeat;
}

#bikefeed {
    min-height: 1270px;
    height: auto !important;
    height: 1270px;
}

#content #bikefeed h2, #content #bikefeed h3 {
    margin: 0;
}

#bikefeed #introtext {
    margin-bottom: 40px;
}

#bikefeed #bikes {
    clear: both;
}

#bikefeed .bike {
    background: transparent url(../uploads/assets/images/bikefeedimg-bg.gif) top left no-repeat;
    width: 156px;
    height: 99px;
    margin-bottom: 10px;
    padding: 0 17px 50px 19px;
    display: inline-block;
    float: left;
}

#bikefeed .bike img {
    border-top: 6px solid #cad8aa;
}

#bikefeedcontent {
    background: transparent url(../uploads/assets/images/bikefeedcontent-bg.gif) top center no-repeat;
    padding: 20px 30px 30px 30px;
}

#partfeed {
    background: transparent url(../uploads/assets/images/partfeed-bg.png) top left no-repeat;
    padding-top: 75px;
    position: relative;
}

#partfeed p, #partfeed h2 {
    margin: 0 10px;
    clear: both;
}

#partfeed h2 {
    margin-bottom: 20px;
}

#partfeed p {
    margin-bottom: 10px;
}

#partfeed .button {
    top: -75px;
    left: -25px;
    -moz-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
}

#partfeed .image {
    top: -135px; 
    left: 70px;
}

#partfeed .titlerss {
    margin: 0;
}

#partfeed #flickr {
    background: transparent url(../uploads/assets/images/partfeedflickr-bg.gif) bottom left no-repeat;
    margin-top: 20px;
    padding: 0 38px;
}

#partfeed #moreflickr {
    background: transparent url(../uploads/assets/images/moreflickr-title.gif) bottom left no-repeat;
    width: 145px;
    height: 18px;
    margin: 10px 0 0 105px;
    display: inline-block;
}

#contactusparts {
    background: transparent url(../uploads/assets/images/contactusparts.gif) top left no-repeat;
    width: 204px;
    height: 169px;
    margin-top: 80px;
    display: block;
}

#footer {
    border-bottom: 42px solid #cad8aa;
    padding-bottom: 30px;
}

#footer h2, #footer p {
    margin-bottom: 10px;
}

#footer h2 {
    background: transparent url(../uploads/assets/images/newsletter-title.gif) bottom left no-repeat;
    width: 288px;
    height: 23px;
}

#footer .grid_7 {
    padding-top: 30px;
}

#footer .grid_8{
    padding-top: 10px;
}

#footer form input {
    border: none;
    float: left;
}

#footer form #email {
    background-color: #eaede6;
    width: 200px;
    margin-right: 5px;
    padding: 7.5px;
}

#footer form #submit {
    background-color: #5e615a;
    height: 31px;
}

#footer #twitterfeed {
    background: transparent url(../uploads/assets/images/twitterfeed-bg.gif) top left no-repeat;
    margin-bottom: 20px;
    padding-top: 32px;
}

#footer #twitterfeed .tweet, #contactmap #address p {
    border-radius-bottomleft: 8px;
    border-radius-bottomright: 8px;
    -moz-border-radius-bottomleft: 8px;
    -moz-border-radius-bottomright: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -icab-border-radius-bottomleft: 8px;
    -icab-border-radius-bottomright: 8px;
    -o-border-bottom-left-radius: 8px;
    -o-border-bottom-right-radius: 8px;
    -khtml-border-radius-bottomleft: 8px;
    -khtml-border-radius-bottomright: 8px;
}

.vimeo, .flickr, .facebook, .twitter {
    height: 32px;
    margin-right: 5px;
    display: inline-block;
}

#footer #twitterfeed .tweet {
    background: #cad8aa url(../uploads/assets/images/tweet-icon.gif) 15px 0px no-repeat;
    padding: 0 20px 10px 50px;
    display: block;
}

#footer #socialmedia .vimeo {
    background: transparent url(../uploads/assets/images/vimeo.gif) top left no-repeat;
    width: 101px;
}

#footer #socialmedia .flickr {
    background: transparent url(../uploads/assets/images/flickr.gif) top left no-repeat;
    width: 83px;
}

#footer #socialmedia .facebook {
    background: transparent url(../uploads/assets/images/facebook.gif) top left no-repeat;
    width: 119px;
}

#footer #socialmedia .twitter {
    background: transparent url(../uploads/assets/images/twitter.gif) top left no-repeat;
    width: 111px;
}

#footer #vcc {
    width: 960px;
    margin: 10px 0 0 0;
    display: inline-block;
}






/* Typography */

/*======== General declarations ========*/

h1, h2, h3, h4, h5, h6, p, a, span, ul, ol, blockquote, label, input, select {
    font-family: Tahoma, sans-serif;
    line-height: 140%;
}

p {
    color: #6F6F6F;
    font-size: 0.9em;
}

strong, b {
    font-weight: bold;
}

em {
   font-style: italic;
}

/*======== <h1>, <h2>, <h3>, <h4>, <h5> & <h6> tags ========*/

#content h1 {
    color: #ffba00;
    font-size: 1.5em;
}

#content h2, h3, h4, h5, h6 {
    color: #6F6F6F;;
}

#openingtimes h3, #history h2 {
    color: #FFF;
    text-shadow: 1px 1px 0px #AFAFAF;
}

/*======== <p> tags ========*/

#footer p, #contactmap #address p, #openingtimes p, #history p {
    color: #FFF;
}

#contactmap #address p {
    font-weight: bold;
}

#footer #vcc {
    color: #CAD8AA;
    font-size: 0.8em;
    text-align: right;
}

/*======== <a> tags ========*/

#content .bikeadvicemenu a, #navigation a, #content #advice a, .tweet  {
    color: #FFF;
}

#content .bikeadvicemenu a, #navigation a, #content #advice a, .tweet {
    text-decoration: none;
}

#navigation a, #advice a, .tweet, .bikeadvicemenu .parent, .bikeadvicemenu li .menuparent, .bikeadvicemenu .currentpage, #homemap #map .mapbike a {
    font-weight:  bold;
}

#content a, #content .bikeadvicemenu ul a:hover {
    text-decoration: underline;
}

#content a, #homemap #map .mapbike a {
    color: #FFBA40;
}

#content a:hover, #homemap a:hover {
    text-decoration: none;
}

#navigation a, .bikeadvicemenu ul a {
    font-size: 0.9em;
}

#navigation a:hover {
    text-shadow: 2px 2px 2px #B8C799;
}

#navigation .currentpage a:hover, #navigation .menuparent a:hover {
    text-shadow: 2px 2px 2px #e9ab00;
}

#footer #vcc a {
    color: #FFF;
}

/*======== <span>, <input> & <select> tags ========*/

#footer form #submit, #contactform .submit input, #contactform .formerror {
    color: #FFF;
}

#advice span, #footer form #submit, #contactform .submit input, #contactform .formerror {
    font-weight: bold;
}

#contactform .submit input {
    font-size: 0.9em;
}

#contactform .formerror {
    font-size: 0.7em;
}

/*======== <li>, <ol> and other tags ========*/

#openingtimes strong, #history strong {
    color: #FFF !important;
}

#content strong, #content b {
    color: #ffba00;
}
/* End of 'stylesheet' */

