/*
Theme Name: VO2
Theme URI: http://www.vo2multisport.com/
Description: A custom Wordpress theme for VO2 Multisport.
Version: 1
Author: Jeremy Reiss
Author URI: http://www.jreiss.net
Tags: blue, custom header, fixed width, two columns, widgets
Tags: 

	©2010 VO2 Multisport. All Rights Reserved.
	Images and content may not be reproduced or reused in any fashion.
	
	Feel free to use any of the styles below, however this unique combination and layout is copyright.
*/


/* 
	Eric Meyer's CSS Reset 
	http://meyerweb.com/eric/tools/css/reset/
	v1.0 | 20080212
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
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-size:100%;vertical-align:baseline;background:transparent}

body {line-height:1}
ol, ul {list-style: none}
blockquote, q {quotes:none}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content:none}

/* remember to define focus styles! */

/* remember to highlight inserts somehow! */
ins {text-decoration:none}
del {text-decoration:line-through}

/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse:collapse;border-spacing:0}


/* ------- END CSS RESET --------- */

body {font:13px/1.5 Helvetica, Arial, sans-serif;color:#222222;background:#dde1d2 url(images/body-bg.jpg) no-repeat fixed center top}


/* ------------- General Classes ----------------- */
.clear:after {content: ".";display:block;height:0;clear:both;visibility:hidden}
.clear {display: inline-table;}
/* Hides from IE-mac \*/
* html .clear {height: 1%;}
.clear {display: block;}
/* End hide from IE-mac */

.skip {display:none;/* \*/display:block;/* */position:absolute;left:-5000px;top:-5000px;width:1px;height:1px}


/*------------- Element Styles ------------------- */

/*---- <a> ----*/
/* Hide dotted outlines in mozilla */
a {color:#933d12;text-decoration:none}
a:hover {text-decoration:underline}
a img {display:block}

/*---- <h*> ----*/

h1 {font:24px/1 "Trebuchet MS", Verdana, sans-serif;height:78px;margin:0 0 0 50px;text-indent:-9999px}
#home-page h1           {width:278px;background:transparent url(images/hdr-welcome.png) no-repeat 0 0}
#about-us-page h1       {width:302px;background:transparent url(images/hdr-about.png) no-repeat 0 0}
.services-section h1    {width:319px;background:transparent url(images/hdr-services.png) no-repeat 0 0}
.contact-section h1     {width:383px;background:transparent url(images/hdr-contact.png) no-repeat 0 0}
.products-section h1    {width:319px;background:transparent url(images/hdr-products.png) no-repeat 0 0}
.calendar-section h1    {width:323px;background:transparent url(images/hdr-calendar.png) no-repeat 0 0}

h2 {font:24px/1 "Trebuchet MS", Verdana, sans-serif;padding-left:18px;margin-bottom:14px;color:#933d12;font-weight:bold;letter-spacing:-1px;text-transform:uppercase;font-style:italic}
h3 {font:19px/1.3 "Trebuchet MS", Verdana, sans-serif;margin-bottom:4px;color:#933d12;font-weight:bold;font-style:normal}
h5 {color:#933d12}
/*---- <img> ----*/

img.bio {float:left;border:3px solid #666666;margin:0 1em 1em 0;}

img.alignright {float:right;margin:1em 12px 0 0;border:4px solid #fff;display:inline;-webkit-box-shadow:4px 4px 7px rgba(0,0,0,.2);-moz-box-shadow:4px 4px 7px rgba(0,0,0,.2);box-shadow:4px 4px 7px rgba(0,0,0,.2);}

/*---- <p> ----*/

#article p {margin:0 0 1em 0}
#article p.tagline {position:absolute;top:40px;right:38px;width:355px;font-size:14px;line-height:1.1;color:#933d12;font-style:italic}

p.highlight {clear:both;color:#933d12}

/*---- <ul> ----*/
#content ul {margin:0 0 1.5em 1.5em;list-style:disc}

#content ul.thirds {float:left;width:27%;margin-left:6%;display:inline}

#content ul.jumplist {float:right;margin:-16px 100px 0 40px;padding:1em 0 2.5em 1.5em;border-left:4px double #000000;list-style:none;display:inline}

/*---- <div> ----*/
div.module {padding:4px;margin-bottom:14px;background-color:#fff;-webkit-box-shadow:4px 4px 7px rgba(0,0,0,.2);-moz-box-shadow:4px 4px 7px rgba(0,0,0,.2);box-shadow:4px 4px 7px rgba(0,0,0,.2);}
    div.module h4 {font-size:14px;line-height:1.1;padding:10px 25px 0;height:40px;background:#999999 url(images/module-bg.png) repeat-x 0 0;border-bottom:4px solid #fff;color:#fff;text-transform:uppercase}
        div.module h4 span {padding:0 10px;font-size:13px;text-transform:none;color:#fff;font-weight:normal}
            div.module h4 a {color:#fff}

    div.callout h4 {text-transform:none;text-align:center;border-bottom:0}
    
    div.module div {position:relative;background-color:#e7e7d5;padding:12px 25px 25px}
        div.module div div {position:relative;background-color:transparent;padding:0}
        div.module p {margin:0 !important}
        div.module div p {margin:0 0 1em 0 !important}
        div.module img.callout {position:absolute;top:0;right:0}
        div.module img.mod-co {display:block;border-top:4px solid #fff}
        
        div.module ul.col {width:120px;float:left;list-style:none !important;margin:0 12px .5em 0 !important;display:inline}
            div.module ul.col li {padding-bottom:.5em;zoom:1}
        div.module ul.border {border-left:4px double #000000;margin-right:0 !important;padding-left:12px;}
        
div.third {width:267px;float:left;margin-right:16px;display:inline}
div.last {margin-right:0}
    div.red h4 {background:#933d12 url(images/module-red-bg.png) repeat-x 0 0;}
div.full {float:left;width:98.5%;}    
    div.full h4 {padding:18px 25px 0;height:32px}    
    div.full div {padding:12px 25px 0}    

div.full div.thirds {float:left;width:30%;margin:0 3% 1em 0}

/*------------- Layout Styles ------------------- */

#wrapper {width:904px;margin:0 auto;background:transparent url(images/wrapper-bg.png) no-repeat 0 0}

    #header {width:904px;height:171px;position:relative;z-index:210;background:transparent url(images/header-bg.png) no-repeat 292px 0}
        #logo {display:block;position:absolute;top:35px;left:84px}
        
        #nav {position:absolute;right:0px;bottom:65px}
            #nav li {float:left;margin-right:28px;display:inline}
                #nav li a {display:block;height:12px;text-indent:-9999px;background-image:url(images/nav-bg.png);background-position-y: 0;background-color:transparent;background-repeat: no-repeat}

            #nav li#link-zero a     {width:29px;background-position:0 0} 
            #nav li#link-one a      {width:35px;background-position:-54px 0} 
            #nav li#link-two a      {width:51px;background-position:-114px 0} 
            #nav li#link-three a    {width:56px;background-position:-189px 0} 
            #nav li#link-four a     {width:56px;background-position:-269px 0} 
            #nav li#link-five a     {width:47px;background-position:-349px 0} 
            #nav li#link-six a     {width:36px;background-position:-419px 0} 
                
            #nav li#link-zero a.current,
            #nav li#link-zero a:hover       {background-position:0 -12px} 
            #nav li#link-one a.current,
            #nav li#link-one a:hover        {background-position:-54px -12px} 
            #nav li#link-two a.current,
            #nav li#link-two a:hover        {background-position:-114px -12px} 
            #nav li#link-three a.current,
            #nav li#link-three a:hover      {background-position:-189px -12px} 
            #nav li#link-four a.current,
            #nav li#link-four a:hover       {background-position:-269px -12px} 
            #nav li#link-five a.current,
            #nav li#link-five a:hover       {background-position:-349px -12px} 
            #nav li#link-six a.current,    
            #nav li#link-six a:hover        {background-position:-419px -12px} 
            
                
        #social {position:absolute;bottom:8px;right:-2px;z-index:999}
            #social li {float:left;margin-left:8px;display:inline}
                #social li a img {display:block;}
        
    #stage {position:relative;z-index:100;margin-top:-22px;padding-top:36px;overflow:visible}  
    
        #article {position:relative;padding-top:33px;background:transparent url(images/article-bg.png) no-repeat 120px 0;}

        #hero {position:relative;border-top:4px double #000000;}
            #hero img {display:block;margin:0 auto}
            #hero span {position:absolute;z-index:105;display:block;}
        
        .subnav {padding:6px 50px;border-top:4px double #000000}
            .subnav li {float:left;margin-right:18px;display:inline}
                .subnav li a {font-size:11px;color:#222222;font-weight:bold;text-transform:uppercase;font-style:italic}
                .subnav li.current_page_item a,
                .subnav li.current_page_parent a,
                .subnav li a:hover {color:#933d12}
                
                .subnav ul {display:none}
        
        #content {padding:1.5em 20px;border-top:4px double #000000}
        
    #footer {margin-bottom:1.5em;padding:60px 0 1em;}
        #footer p {text-align:center;font-size:12px;font-style:italic}      
            #footer p strong {color:#933d12}

form {padding:1em 50px}
    form label {display:block;font-weight:bold;font-size:11px;color:#933d12;text-transform:uppercase}
    form .mc-field-group input {display:block;margin-bottom:1.5em;width:100%}
    form textarea {height:75px;}
          
/*------------- Page Specific Styles ------------------- */

/* --- Home Page --- */

#home-page #stage {background:transparent url(images/tire-br.png) no-repeat 0 0;}
#home-page #article {background:transparent url(images/home-article-bg.png) no-repeat 260px 0;}

    #home-page #article p {margin:0 0 1em 0}
    #home-page #hero {border-bottom:4px double #000000}
        #home-page #hero span {top:-51px;right:95px;width:468px;height:258px;background:transparent url(images/home-wheels.png) no-repeat 0 0}
    
    #home-page #content {padding:1em 0}

    #home-page h3 {text-transform:uppercase}
        #home-page h3 span {text-transform:none}
    
    #home-page .event-details {width:500px;float:left;padding:18px 18px 18px 50px;display:inline}
    #home-page .event-co .callout {width:250px;float:left;padding:4px 18px 18px;margin:48px 0 0 24px;border-left:2px solid #933d12;display:inline}

    #home-page .bordered {padding:18px;border-top:2px solid #933d12}
    #home-page .border {padding:1.2em 200px .75em 50px;border-bottom:4px double #000000}

    #home-page #news-items {padding:0 0 3em 168px;background:transparent url(images/news-home-bg.png) no-repeat 0 0}
        #home-page #news-items .col {float:left;width:160px;margin-right:60px}
            #home-page #news-items h2 {width:120px;height:28px;background-color:transparent;background-position:0 0;background-repeat: no-repeat;text-indent:-9999px}
            #home-page #news-items .upcoming-events h2  {background-image:url(images/upcoming-events-hdr-sm.png);}
            #home-page #news-items .product-news h2     {background-image:url(images/product-news-hdr-sm.png);}
            #home-page #news-items .multisport-news h2   {background-image:url(images/multisport-new-hdr-sm.png);}
            
            #home-page #news-items .col p {padding-left:10px;line-height:1.2;color:#933d12;font-style:italic}
            #home-page #news-items .col strong {display:block;padding-left:10px;line-height:1.2;color:#222222;font-style:normal;font-weight:normal}
            
#home-page #footer {margin-top:-16px;background:transparent url(images/tire-br.png) no-repeat 0 0}        

/* --- About Page --- */

.about-section #stage {background:transparent url(images/big-weight-br.png) no-repeat 0 0;margin-top:-28px;}
.about-section #footer {margin-top:-16px;background:transparent url(images/big-weight-br.png) no-repeat 0 0}

.about-section #content {padding:1.5em 30px 1em 50px}
.about-section #content strong {color:#933d12}

.about-section #about-hero {border-top:4px double #000000;display:block}

.about-section img.alignright {margin:0 12px 0 30px}

/* --- Services Section --- */

.services-section #stage {background:transparent url(images/weight-br.png) no-repeat 0 0;}

    #services-page #hero span {bottom:-50px;left:12px;width:879px;height:116px;background:transparent url(images/services-wheels.png) no-repeat 0 0}

#services-page #content {padding-top:1em;background:transparent url(images/services-content-bg.png) no-repeat 118px 0;}
#services-page #content {padding:2.5em 20px}

.services-section #footer {margin-top:-16px;background:transparent url(images/weight-br.png) no-repeat 0 0}

#bikes-page div.rowed div.full p {width:300px}
#bikes-page div.rowed div.full div {height:231px}

div.graphic-break {background:transparent url(images/weight-br.png) no-repeat 0 100%;padding-bottom:5em;margin-bottom:2em}

#calculator {padding:0 50px 1em}
    #calculator ol {width:500px;padding:1em 0;border-bottom:1px dotted #555555}
        #calculator ol li {width:100%;clear:both;}
            #calculator ol li label {width:150px;display:block;float:left;text-align:right;line-height:1;padding:8px 8px 0 0}
            #calculator ol li input {width:125px;float:left;font-size:14px;padding:2px 4px;margin-bottom:1em;display:inline}
            #calculator ol li .option-group {width:300px;float:left}
                #calculator ol li .radio-wrap {width:80px;float:left;padding-top:5px}
                #calculator ol li .field-wrap {width:100%;float:left;padding-top:5px}
                    #calculator ol li .field-wrap select {width:200px;font-size:14px}
                        #calculator ol li .field-wrap select option {font-size:14px}
            #calculator ol li input.radio {display:inline;float:none;margin-bottom:0;width:auto;padding:0}
            
    #caloric-total {width:400px;}
        #caloric-total strong {width:150px;float:left;text-align:right;padding:8px 8px 0 0;color:#933d12;display:inline}
        #caloric-total span {width:200px;float:left;font-size:16px;padding:6px 4px;font-weight:bold;display:inline}
    
/* --- Products Section --- */

.products-section #stage {margin-top:-33px;background:transparent url(images/helmet-br.png) no-repeat 0 0;}
.products-section #footer {margin-top:-16px;background:transparent url(images/helmet-br.png) no-repeat 0 0}

.products-section #content {padding:1em 0;position:relative}
#products-page #content {padding:1em 0 8em}

.products-section h2 {width:550px;padding-bottom:8px;border-bottom:4px double #000000;font:20px/1 "Trebuchet MS", Verdana, sans-serif;padding-left:50px;margin-bottom:12px;letter-spacing:0px;font-weight:bold;font-style:normal}
.products-section div.entry {width:550px;padding-left:50px;}
.products-section div.col {float:left;margin-right:36px;display:inline}
.products-section div.no-head {padding-top:18px}

.products-section img.alignright {position:absolute;top:0;right:40px}
#products-page img.alignright {top:14px}

.products-section #content h3 {font-size:14px}

div.entry-row {width:520px;padding:0 30px 1em 50px;margin-bottom:1.5em;border-bottom:4px double #000000}
    div.entry-row h3 {text-transform:uppercase;margin-bottom:0 !important;}
div.entry-row:last-of-type {border-bottom:0;margin-bottom:0}    
    
/* --- Contact Section --- */
.contact-section #stage {margin-top:-24px;background:transparent url(images/shoe-br.png) no-repeat 0 0;}
.contact-section #footer {margin-top:-16px;background:transparent url(images/shoe-br.png) no-repeat 0 0}

.contact-section #article p {margin:0 0 1.3em 0}
.contact-section #content {padding:0 50px}

.contact-section div.column {width:45%;float:left}
.contact-section div.first {width:55%}
.contact-section #mc_embed_signup {width:45%;float:left}

.contact-section div.col {width:200px;float:left}
.contact-section div.last {width:210px;}

/* --- Calendar Section --- */
.calendar-section #stage {margin-top:-14px;background:transparent url(images/goggles-br.png) no-repeat 0 0;}
.calendar-section #footer {margin-top:-16px;background:transparent url(images/goggles-br.png) no-repeat 0 0}

.calendar-section #content {padding:18px 0}

.calendar-section #content p {margin:0 0 1.5em 0}

.calendar-section div.entry-row {position:relative;width:534px;padding:0 320px 18px 50px}
.calendar-section div.entry-row .news-details {position:absolute;top:-8px;right:0;width:250px;padding:14px 0 0 18px;border-left:4px double #000000}
    .calendar-section div.entry-row .news-details strong {color:#933d12}

.kjo-link {display:none !important}

.calendar-section h2 {padding-left:50px}
.calendar-section .gallery {padding:18px 0 5em 50px}
    ul.galleries li {width:200px;float:left;margin-right:18px;display:inline}
        ul.galleries li a {display:block;margin-bottom:4px;font-weight:bold;}
        ul.galleries li img {display:block;border:2px solid #cfcfcf}
        
        
        
