/*common
============================*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, .btn {
margin: 0;
padding: 0;
border: 0;
font-style: inherit;
font-weight: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline }

ul {list-style: none}
a img, frameset {border: 0}

table {border-collapse: collapse; border-spacing: 0}
caption, th, td {text-align: left; font-weight: normal}
blockquote:before, blockquote:after, q:before, q:after {content: ""}
blockquote, q {quotes: "" ""}
.clear {height: 1px; clear: both; margin-top: -1px; overflow: hidden}

.add-top, #add-top {margin-top: 15px}
.add-bottom, #add-bottom {margin-bottom: 15px}
.no-bottom {margin-bottom: 0 !important; padding-bottom: 0 !important}
.no-top {margin-top: 0}
.no-side {margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important}
.no-border {border: 0}

img.left {margin: 0 15px 15px 0}
img.right {margin: 0 0 15px 15px}

.centered {margin: 0 auto 19px}
.text-right {text-align: right}
.text-center {text-align: center}

.disabled, .hide {display: none}
.js .visiblity-hide {visibility: hidden;}

.contain-overflow {overflow: hidden}
.screen-reader {display: block; left: -9999px; position: absolute; top: -9999px}
.clearing {clear: both}
 
.left {float: left}
.right {float: right}
h1 {font-size: 2em}
h2 {font-size: 1.8em}
h3 {font-size: 1.5em}
h4 {font-size: 1.35em}
h5 {font-size: 1.15em}

a, a:link {color: #30868b; text-decoration: none}
a:hover, a:active {color: #c3c385}
.no-outline {outline: none}
p, ul, ol, table {margin: 0 0 12px 0}
em {font-style: italic}
th, td {padding: 6px 10px}

.screen-reader {
display: block;
left: -9999px;
position: absolute;
top: -9999px}

/*action*/
.actions {margin: 0 0 27px; overflow: hidden; width: 100%}
.actions li {float: left; margin-right: 5px}
.actions a,
.btn-replace {
background: url(common/images/structure/btn-actions.png) no-repeat;
display: block;
height: 28px;
overflow: hidden;
text-indent: -9999px;
width: 104px}
.actions .btn-add-cart a {background-position: -104px 0}
.actions .btn-buy-online a {background-position: -208px 0; width: 99px}
.actions .btn-share-product a {background-position: -307px 0; width: 122px}
.actions .btn-find-in-stores a {background-position: -429px 0; width: 118px}
.actions .btn-add-cart-small a {background-position: -547px 0; height: 25px; width: 84px}
.actions .btn-learn-more-small a {background-position: -631px 0; height: 25px; width: 84px}
.actions .btn-rsvp-facebook a {background-position: -715px 0; width: 160px}
.actions .btn-share a {background-position: -875px 0; width: 94px}
.actions .btn-add-calendar a {background-position: -969px 0; width: 151px}
.actions .btn-event-schedule a {background-position: -1120px 0; width: 151px}
.actions .btn-refine-search a, .actions .btn-refine-search-closed a {background-position: -2372px 0; height: 30px; width: 174px}
.actions .btn-refine-search-closed a {background-position: -2546px 0}
.actions .btn-shop-puma a {background-position: -3387px 0; height: 25px; width: 107px}
.actions .btn-more a {background-position: -3494px 0; height: 26px; width: 68px}
.actions .btn-learn-more a {background-position: -3625px 0; height: 28px; width: 98px}
.actions .btn-detail-more a {background-position: -3625px bottom; height: 28px; width: 98px}
.actions .btn-follow-along a {background-position: -3776px 0; height: 28px; width: 110px}
.actions .btn-more-crew-news a {background-position: -3942px 0; height: 23px; width: 157px}
.actions .btn-watch-video a {background-position: -4099px 0; height: 26px; width: 95px}

/*meta*/
.meta {
background: url(common/images/structure/bg-grey-border.png) repeat-y 155px 0;
margin-bottom: 24px;
overflow: hidden;
width: 100%;}
.meta li {
color: #30868b;
float: left;
font-size: 11px;
font-weight: bold;
line-height: 13px;
padding: 8px 10px 8px 0;
text-transform: uppercase;
width: 145px}
.meta a {color: #30868b; display: block}
.meta a:hover{ color: #c3c385}
.meta .location {padding: 8px 10px 8px 14px; width: 107px}
.meta .attended {background: url(common/images/structure/ico-attended.png) no-repeat 15px 50%; padding: 8px 10px 8px 48px; width: 100px}
.meta .label {color: #d1cdc5; display: block; font-size: 12px; font-weight: normal; line-height: 16px; text-transform: none}

/*continue button*/
#news-hub .column-main .actions {margin-bottom: 15px}
#news-hub .column-main .actions li, #home .articles .article .actions li {margin-right: 0}
#news-hub .column-main .actions li,
#home .articles .article .actions li {
margin-right: 0}
.btn_left{
background: #2f858a url(common/images/structure/bg-teal-button.png) no-repeat 0 0;
width:auto;
height:28px;
padding-left:5px;}
#news-hub .column-main .actions a,
#news-hub .column-aside .actions a,
#home .articles .article .actions a {
background: #2f858a url(common/images/structure/bg-teal-button.png) no-repeat 100% -28px;
color: #edf4dc;
font-size: 11px;
height: auto;
line-height: 28px;
padding: 0 12px;
text-indent: 0;
text-transform: uppercase;
width: auto;
display:inline-block;}
#news-hub .column-main .actions a:hover,
#news-hub .column-aside .actions a:hover,
#home .articles .article .actions a:hover {
color: #c3c385}


/*tags*/
.tags ul {font-size: 11px; overflow: hidden; width: 100%}
.tags ul li {float: left; margin: 0 4px 4px 0}
.tags ul a {
background: #2f858a;
border-radius: 5px;
color: #fff;
display: block;
font-weight: bold;
-moz-border-radius: 5px;
padding: 3px 8px;
-webkit-border-radius: 5px}
.tags ul a:hover {background: #0f4b4f}
.tags ul .category a {background: #0f4b4f}
.tags ul .category a:hover {background: #2f858a}




/*main layout
=============================*/
body {
background: #181d1f url(common/images/structure/bg-body.jpg) no-repeat 50% 0;
color: #94a5a6;
font: 12px/20px Helvetica, Arial, Sans-Serif;
min-width: 1081px}
#container {
background: #20282c url(common/images/structure/bg-container.png) no-repeat 0 100%;
margin: 0 auto;
padding: 0 0 16px;
position: relative;
width: 1081px;
z-index: 1000;
border:1px solid #ff033;}
#content {
padding: 35px 45px 0;
position: relative;
z-index: 100000}

.column-main {width: 666px}
.column-aside {width: 314px}
.secondary-row .column-main {width: 642px}
.secondary-row .column-aside {width: 338px}

/*section corner image*/
.section {
margin-bottom: 9px}
.section-header {
background: #fff url(common/images/structure/bg-section-corner-top-r.png) no-repeat 100% 0}
.section-header-inner {
background: url(common/images/structure/bg-section-corner-top-l.png) no-repeat}

.column-main .overlap .section-header {
background: url(common/images/structure/bg-section-hdr-main-trans.png) no-repeat}
.column-main .overlap .section-header-inner {
background: url(common/images/structure/bg-section-hdr-bottom.png) no-repeat 0 100%}
.column-aside .overlap .section-header {
background: url(common/images/structure/bg-section-hdr-aside-trans.png) no-repeat}

.section-content {
background: #dbdbcc url(common/images/structure/bg-section-corner-btm-r.png) no-repeat 100% 100%}
.section-wrapper {
background: url(common/images/structure/bg-section-inner-shadow.png) no-repeat 50% 0;
padding-top: 5px}
.section-content-inner {
background: url(common/images/structure/bg-section-corner-btm-l.png) no-repeat 0 100%}

/*social*/
.social {
line-height: 18px;
position: relative}


/*top page
=============================*/
#home #container {
padding-top: 582px}
#home #content {
background: none;
margin: 0 auto;
padding: 0;
width: 990px}
#home .column-main {width: 716px}
#home .column-aside {width: 264px}

/*feature*/
#home #feature-container,
#home #feature,
#feature-top {
height: 698px;
left: 0;
overflow: hidden;
position: absolute;
top: 0;
width: 1081px;
z-index: 100}

#home #feature-container {
z-index: auto}

#feature .feature-wrapper {
overflow: hidden;
position: absolute;
top: 0;
width: 99999px}

/*feature images*/
#feature .frame,
#feature-top .frame {
background: url(common/images/top/feature-1.jpg) no-repeat;
float: left;
height: 698px;
position: relative;
width: 1081px;
z-index: 100}
#feature #feature-2.loaded {
background-image: url(common/images/top/feature-2.jpg)}
#feature #feature-3.loaded {
background-image: url(common/images/top/feature-3.jpg)}
#feature .frame a {
background: url(common/images/top/btn-home-feature-hover.jpg) no-repeat -9999px -9999px;
display: block;
overflow: hidden;
position: absolute;
text-indent: -9999px}

#feature #feature-1 .primary {height: 59px; left: 145px; top: 440px; width: 171px}
#feature #feature-1 .primary:hover {background-position: 0 0}

#feature #feature-2 .primary {height: 46px; left: 225px; top: 397px; width: 161px}
#feature #feature-2 .primary:hover {background-position: 0 -59px}

#feature #feature-3 .primary {height: 46px; left: 73px; top: 425px; width: 215px}
#feature #feature-3 .primary:hover {background-position: 0 -105px}

/*pager???*/
.nav-feature-pager {
background: #020202;
background: rgba(2,2,2,0.45);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
bottom: 135px;
padding: 6px 17px;
position: absolute;
right: 82px;
z-index: 1000}
.nav-feature-pager .wrapper {
position: relative}
.nav-feature-pager ul {
float: left;
list-style: none;
margin: 0}
.nav-feature-pager li {
float: left;
margin-right: 50px}
.nav-feature-pager .last {
margin-right: 0}
.nav-feature-pager a {
background: #2f8489;
-webkit-background-clip: padding-box;
border: 5px solid #242323;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
color: #2f8489;
display: block;
height: 4px;
position: relative;
text-decoration: none;
width: 4px;
z-index: 100}
.nav-feature-pager .current a,
.nav-feature-pager .passed a {
border-color: #eeecd5}
.nav-feature-pager .preview {
background: #eeecd5;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
display: none;
font-size: 10px;
font-weight: bold;
left: 50%;
line-height: 25px;
margin-left: -57px;
padding: 3px 4px 0;
text-align: center;
text-transform: uppercase;
width: 107px;
position: absolute;
bottom: 10px;  }
.nav-feature-pager .preview img {
display: block}
.nav-feature-pager .preview .pointer {
background: url(common/images/top/ico-feature-pointer.png) no-repeat;
bottom: -8px;
display: block;
height: 8px;
left: 50%;
margin-left: -7px;
position: absolute;
width: 15px}
.nav-feature-pager .progress {
background: #242323;
display: block;
height: 6px;
left: 1px;
position: absolute;
top: 4px;
width: 98%;
z-index: 10}
.nav-feature-pager .progress .status {
background: #eeecd5;
display: block;
height: 6px;
width: 0}

/*feature arrows*/
#nav-feature {
display: none; margin: 0}
.js #nav-feature {
display: block}
#nav-feature a {
background: url(common/images/structure/btn-feature-nav.png) no-repeat 0 0;
display: block;
height: 34px;
overflow: hidden;
position: absolute;
text-indent: -9999px;
top: 321px;
width: 34px;
z-index: 1000}

#nav-feature .prev a {left: 47px}
#nav-feature .prev a:hover {background-position: 0 -34px}

#nav-feature .next a {background-position: -34px 0; right: 47px}
#nav-feature .next a:hover {background-position: -34px -34px}

#home #nav-feature strong {
background: #000;
color: #2f8489;
display: block;
font-size: 10px;
font-weight: bold;
height: 34px;
line-height: 34px;
overflow: hidden;
position: absolute;
text-indent: 0;
text-transform: uppercase;
top: 321px;
white-space: nowrap;
z-index: 999}
#home #nav-feature .prev strong {
-moz-border-radius-topright: 17px;
-moz-border-radius-bottomright: 17px;
-webkit-border-top-right-radius: 17px;
-webkit-border-bottom-right-radius: 17px;
border-top-right-radius: 17px;
border-bottom-right-radius: 17px;
left: 64px;
padding: 0 19px 0 26px}
#home #nav-feature .next strong {
-moz-border-radius-topleft: 17px;
-moz-border-radius-bottomleft: 17px;
-webkit-border-top-left-radius: 17px;
-webkit-border-bottom-left-radius: 17px;
border-top-left-radius: 17px;
border-bottom-left-radius: 17px;
padding: 0 26px 0 19px;
right: 64px}

/*------*/
#feature-top {
height: 56px;
overflow: visible;
top: 106px;
z-index: 10000001}
#feature-top .feature-wrapper {
height: 56px;
position: absolute;
top: 0;
width: 99999px;
z-index: 10000001}
#feature-top .frame {
background: none;
display: block;
float: left;
height: 41px;
position: relative;
width: 1081px;
z-index: 10000001}
#feature-top .feature-1,
#feature-top .feature-2,
#feature-top .feature-3 {
background: url(common/images/top/feature-top.png) no-repeat;
display: block;
height: 41px;
position: absolute;
top: -38px;
z-index: 10000001}
#feature-top .feature-1 {left: 526px; width: 236px}
#feature-top .feature-2 {background-position: -236px 0; left: 426px; width: 512px}
#feature-top .feature-3 {background-position: -748px 0; left: 593px; width: 351px}

/*section*/
#home .articles .section-header-inner {position: relative}
#home .articles .nav-tabs a {background-image: url(common/images/structure/bg-section-header-left-blue-shadow.png)}
#home .articles .nav-tabs .current a {color: #b2b6b6}
#home .articles .section-header .indicator {
background: url(common/images/structure/bg-home-tab-indicator.png) no-repeat;
bottom: 0;
display: block;
height: 7px;
margin-left: -7px;
position: absolute;
width: 14px}

.nav-tabs {margin: 0; overflow: hidden; width: 100%}
.nav-tabs li {float: left}
.nav-tabs a {
background: url(common/images/structure/bg-section-header-left-shadow.png) no-repeat 100% 100%;
color: #2f858a;
display: block;
font-size: 11px;
font-weight: bold;
padding: 11px 21px 10px 16px;
text-align: center;
text-decoration: none;
text-transform: uppercase}
.nav-tabs a:hover {color: #c3c385}
.nav-tabs .current a {color: #666161}

#home .articles .section-content {
background: #181d1f url(common/images/structure/bg-section-corner-blue-bottom-r.png) no-repeat 100% 100%}
#home .articles .section-content-inner {
background: url(common/images/structure/bg-section-corner-blue-bottom-l.png) no-repeat 0 100%}
#home .articles .section-wrapper {
background: url(common/images/structure/bg-blue-wrapper-shadow.png) repeat-x;
padding: 18px 18px 0}
.js #home .articles .tab {
height: 569px}

/*primary
-------*/
#home .articles .primary {
width: 430px}
#home .articles h2 {
color: #727c85;
font-size: 12px;
font-weight: bold;
line-height: 14px;
margin-bottom: 16px;
text-transform: uppercase}
#home .articles .primary .figure {
border-bottom: 1px solid #2e373a;
padding: 0 0 8px}
#home .articles .primary .figure .wrap {
max-height: 228px;
overflow: hidden}
#home .articles .primary .figure img {
display: block; margin: 0 auto}
#home .articles .primary h3 {
font-size: 16px;
float: left;
line-height: 18px;
margin: 0 0 18px;
padding: 6px 0 0;
width: 315px;
font-weight:bold;}
#home .articles .primary .date {
border-left: 1px solid #2e373a;
float: right;
font-size: 14px;
font-style: normal;
line-height: 14px;
padding: 9px 2px 0 17px}
#home .articles .primary .actions {
margin-bottom: 23px}

/*article meta*/
#home .articles .primary .meta {
background-position: 175px 0;
border-top: 1px solid #2e373a;
margin-top:15px;}
#home .articles .primary .meta li {
padding-bottom: 0}
#home .articles .primary .meta .author {
min-height: 24px; width: 165px}
#home .articles .primary .meta .author .left {
margin: 0 13px 0 0}
#home .articles .primary .meta .tags {
padding-left: 14px;
width: 231px}
#home .articles .primary .meta .tags a {
display: inline;
font-style: italic;
font-weight: normal;
text-transform: lowercase}

/*secondary
--------*/
#home .articles .secondary {
width: 234px}
#home .articles .timestream {
line-height: 18px;
margin: 0}
#home .articles .timestream li {
border-bottom: 1px dotted #2e373a}
#home .articles .timestream li:last-child {
border-bottom: none}
#home .articles .timestream .last {
border-bottom: none}
#home .articles .timestream a {
background: url(common/images/structure/ico-home-media-type.png) no-repeat 0 -103px;
color: #9db7b8;
display: block;
padding: 6px 0 7px 33px}
#home .articles .timestream a:hover {
color: #c3c385}

/*gallery*/
#home .gallery .section-header {
overflow: hidden}
#home .gallery .section-header h2{
color: #727c85;
font-size: 12px;
font-weight: bold;
line-height: 14px;
margin-bottom: 14px;
padding:12px 0 0 16px;
text-transform: uppercase;}
#home .gallery .section-content,
#home .gallery .section-content-inner{
min-height:554px;
height:554px;
overflow: hidden;}

#home .product-listing .products li {
float:left;
width:113px;
margin-left:8px;}
#home .product-listing .products .photo {display: block; height: 113px; padding: 29px 0 0; overflow:hidden; }
#home .product-listing .products .photo img {display: block; margin: 0 auto}
#home .product-listing .products .details {
background: #fff url(common/images/gear/bg-product-shadow.png) no-repeat 105px 0;
border: 1px solid #d7d7d7;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
display: none;
margin: 26px 0 0 8px;
position: absolute;
width: 123px;
height: 116px;
padding: 21px 10px 0 120px; }
#home .product-listing .products .alt .details {
background-position: 135px -137px;
margin: 26px 0 0 202px;
padding: 21px 120px 0 10px;}
#home .product-listing .products .details .photo {
width: 113px;
height: 113px;
padding: 10px 0 0 0;
position: absolute;
top: 0;
left: 0; }
#home .product-listing .products .alt .details .photo {
left: auto;
right: 0}
#home .product-listing .products .details h3 {
font-size: 15px;
font-weight: bold;
line-height: 19px;
margin-bottom: 10px}
#home .product-listing .products .details .button {
font-size: 10px;
margin-bottom: 5px;
padding: 3px 12px 2px 12px;}
#home .product-listing .products .details .btn-buy-online .button {
background: #df0403}
#home .product-listing .products .details .btn-buy-online .button:hover {
background: #b70000}
#home .product-listing .products .details .close {
background: url(common/images/gear/ico-all.png) no-repeat 2px -219px;
display: block;
height: 13px;
overflow: hidden;
position: absolute;
right: 5px;
text-indent: -9999px;
top: 5px;
width: 13px;}
#home .product-listing .products .details .actions li{margin:0;}
#home .product-listing .products .details .actions li a.button{padding:0;}

/*#home .gallery ul.thumbs{
padding:20px 0px 15px 13px;}
#home .gallery ul.thumbs li{
float:left;
width:113px;
margin-right:12px;
font-size:11px;
line-height:13px;
color:#333;
min-height:150px;
height:150px;}
#home .gallery ul.thumbs li a:hover{
filter:alpha(opacity=80);
-moz-opacity:.8;
opacity:.8;}*/

/* News Page
--------------------------------------------*/
#individual-news #content,
#news-hub #content {
background: url(common/images/news/bg-individual-news.jpg) no-repeat;
padding-top: 137px}

#individual-news #nav-sub .primary,
#news-hub #nav-sub .primary {
float: right}

#nav-sub {background: url(common/images/structure/bg-sub-nav.png) no-repeat; margin-bottom: 7px; padding-left: 5px; position: relative}
#nav-sub-inner {background: url(common/images/structure/bg-sub-nav.png) no-repeat 100% -40px; padding-right: 5px}
#nav-sub-wrapper {background: #30868b; overflow: hidden; height: 40px; width: 100%}

#nav-sub li {float: left}
#nav-sub .primary li {background: url(common/images/structure/bg-sub-nav-shadow.png) repeat-y 100% 0}
#nav-sub .primary .last {background: none}
#nav-sub a {color: #d6eaeb; display: block; height: 40px; line-height: 40px; padding: 0 22px 0 12px; text-transform: uppercase}
#nav-sub .primary .current a, #nav-sub .primary a:hover {color: #7be7ed}
#nav-sub .primary .last a {padding-right: 18px}
#nav-sub .secondary a {background: no-repeat 100% 48%; color: #d6eaeb; font-size: 11px; padding: 0 20px 0 11px}
#nav-sub .secondary .rss a {background-image: url(common/images/structure/ico-sub-nav-rss.png)}
#nav-sub .secondary .email a {background-image: url(common/images/structure/ico-sub-nav-email.png)}
#nav-sub .indicator {background: url(common/images/structure/bg-sub-nav-indicator.png) no-repeat; bottom: 0; display: block; height: 7px; margin-left: -31px; position: absolute; width: 50px}

.hdr-replace {
background: url(common/images/structure/hdr-all.png) no-repeat;
display: block;
overflow: hidden;
text-indent: -9999px}

.hdr-news-section {background-position: -106px -18px; height: 40px; width: 40px}
.hdr-news-section-current {background-position: -146px -18px; height: 40px; width: 40px}

.hdr-visit-talk-puma {background-position: 0 0; height: 9px; width: 132px}
.hdr-work-with-puma {background-position: 0 -9px; height: 9px; width: 107px}
.hdr-events {background-position: 0 -18px; height: 40px; width: 53px}
.hdr-events-current {background-position: -53px -18px; height: 40px; width: 53px}
.hdr-event-details {background-position: 0 -58px; height: 57px; width: 324px}
.hdr-similar-scenes {background-position: 0 -115px; height: 37px; width: 104px}
.hdr-on-the-horizon {background-position: 0 -152px; height: 35px; width: 133px}
.hdr-upcoming-events {background-position: -133px -352px; height: 35px; width: 152px}
.hdr-past-events {background-position: 0 -187px; height: 71px; width: 243px}
.hdr-sort-products {background-position: 0 -258px; height: 23px; width: 117px}
.hdr-filter-products {background-position: 0 -281px; height: 16px; width: 126px}
.hdr-about-crew {background-position: 0 -297px; height: 40px; width: 234px}
.hdr-notable-performances {background-position: 0 -337px; height: 48px; width: 234px}
.hdr-what-everyone-saying {background-position: 0 -385px; height: 27px; width: 323px}
.hdr-share-thoughts-elsewhere {background-position: 0 -412px; height:87px; width:259px}
.hdr-mix-our-media {background-position: 0 -499px; height: 14px; width: 157px}
.hdr-your-results {background-position: 0 -513px; height: 22px; width: 166px}
.hdr-store-always-open {background-position: 0 -535px; height: 41px; width: 244px}
.hdr-sailing-gear {background-position: 0 -576px; height: 44px; width: 106px}
.hdr-the-crew {background-position: 0 -620px; height: 37px; width: 123px}
.hdr-races-events {background-position: 0 -657px; height: 12px; width: 107px}


#nav-sub .section-title {float: left; margin-left: 12px}
#nav-sub .section-title a {display: block; padding: 0}

/*news column main-----*/
#news-hub #content .column-main {
background: url(common/images/structure/bg-events-hub-main.png) no-repeat;
padding-top: 5px;
width: 739px;}
#news-hub #content .column-aside {
width: 244px}
#news-hub .column-main .section {background: #181d1f url(common/images/structure/bg-section-corner-blue-bottom-l.png) no-repeat 0 100%}
#news-hub .column-main .section-content {background: url(common/images/structure/bg-section-corner-blue-bottom-r.png) no-repeat 100% 100%; padding: 23px 0 44px 26px}


/*news area-----*/
#news-hub .column-main .primary {
float: left;
width: 429px}
#news-hub .column-main .secondary {
float: right;
width: 258px}

/*primary*/
#nav-sub .primary {float: left}

#news-hub .news {border-bottom: 4px solid #2e373a; margin: 0 0 30px}
#news-hub h2 {
border-bottom: 1px solid #2e373a;
font-size: 26px;
font-weight: bold;
line-height: 28px;
padding: 0 0 10px}
#news-hub h2 a {color: #30868b}
#news-hub h2 a:hover {color: #c3c385}
#news-hub .meta {background: url(common/images/structure/bg-news-meta.png) repeat-y 196px 0; width: 357px}
#news-hub .meta li {padding: 16px 10px 8px 0; width: 127px}
#news-hub .meta .author {
background: url(common/images/structure/ico-puma-author.png) no-repeat 0 11px;
min-height: 24px;
padding-left: 51px;
padding-right: 34px;
width: 135px}

#news-hub .tags {border-top: 2px solid #272f32; padding: 11px 0 0}
#news-hub .tags ul {margin-bottom: 22px}
#news-hub .nav-internal {margin: 0; overflow: hidden; width: 100%}
#news-hub .nav-internal li {float: left}
#news-hub .nav-internal .newer {float: right}
#news-hub .nav-internal a {
background: url(common/images/structure/btn-actions.png) no-repeat -2054px 0;
display: block;
height: 26px;
overflow: hidden;
text-indent: -9999px;
width: 159px}
#news-hub .nav-internal .newer a {background-position: -2213px 0}

/*secondary*/
#nav-sub .secondary {float: right; margin-right: 13px}

#news-hub .column-main .secondary .section {background: url(common/images/structure/bg-section-aside-content-shadow.png) no-repeat}
#news-hub .column-main .secondary .section-header {background: none; padding: 0 0 14px}
#news-hub .column-main .secondary .articles .section-content {padding-top: 9px}

#news-hub .column-main .secondary .hdr-section {
background: url(common/images/structure/hdr-icons.png) no-repeat 0 -655px;
color: #74726b;
font-size: 15px;
font-weight: bold;
line-height: 20px;
padding: 0 0 0 29px;
text-transform:capitalize;}

#news-hub .column-main .nav-filter {margin-bottom: 12px; overflow: hidden; width: 100%}
#news-hub .column-main .nav-filter li {background: url(common/images/structure/bg-nav-filter-bg.png) no-repeat; float: left}
#news-hub .column-main .nav-filter li:first-child,
#news-hub .column-main .nav-filter .first {background: none}
#news-hub .column-main .nav-filter a {
background: none;
display: block;
font-size: 11px;
font-weight: bold;
padding: 7px 11px 8px 17px;
text-transform: uppercase}
#news-hub .column-main .nav-filter .current a {color: #898b84}

/*news list*/
#news-hub .column-main .secondary .section-content {background: none; padding: 0 24px 0 0}

#news-hub .column-main .secondary .tags {border: none; padding-top: 0}
#news-hub .column-main .secondary .articles ul {font-size: 11px; font-weight: bold; line-height: 16px}
#news-hub .column-main .secondary .articles li {
background: url(common/images/structure/ico-article.png) no-repeat 0 11px;
border-bottom: 1px dotted #2e373a;
padding: 9px 0 9px 25px}
#news-hub .column-main .secondary .articles a {color: #3387c1; display: block}
#news-hub .column-main .secondary .articles .date {color: #898b84}
#news-hub .column-aside .actions a {padding: 0 0 0 12px;}
#news-hub .column-aside .actions a strong {
background: url(common/images/structure/bg-teal-button.png) no-repeat 100% -28px;
display: block;
padding-right: 12px}

/*news content aside*/
.social .section-content {background: #2f858a url(common/images/structure/bg-section-corner-teal-btm-r.png) no-repeat 100% 100%; color: #f0f4e6}
.social .section-content-inner {background: url(common/images/structure/bg-section-corner-teal-btm-l.png) no-repeat 0 100%}
.social .section-wrapper {background-image: url(common/images/structure/bg-section-social-inner-shadow.png); padding-top: 14px}
.social .section-intro {line-height: 15px; margin: 9px 75px 19px 20px}
.social .indicator {
background: url(common/images/structure/bg-social-arrow.png) no-repeat;
display: block;
height: 7px;
left: 0;
margin-left: -7px;
position: absolute;
width: 14px;
z-index: 1000}
.social .indicator {top: 32px}
.social .connect {border-top: 1px solid #1b4b4d; margin-bottom: 0; padding-bottom: 5px}
.social .connect li {
background: #2f858a url(common/images/structure/bg-social-connect-shadow.png) repeat-x 0 100%;
border-bottom: 1px solid #1b4b4d;
padding: 0}
.social .connect a {
background: url(common/images/structure/ico-social-connect.png) no-repeat;
color: #f0f4e6;
display: block;
font-size: 17px;
line-height: 17px;
text-decoration: none;
width: 314px;
text-transform:uppercase;}
.social .connect a strong {
background: url(common/images/structure/btn-social-connect-arrow.png) no-repeat 273px 13px;
display: block;
font-weight: normal;
padding: 16px 0 13px 63px;
width: 251px}
#news-hub .social .connect {border-top: none}
#news-hub .social .connect .last {background-image: none; border-bottom: none}
#news-hub .social .connect li:last-child {background-image: none; border-bottom: none}
#news-hub .social .connect a {font-size: 12px; width: 244px}
#news-hub .social .connect a strong {background-position: 215px 7px; padding: 8px 0 9px 51px; width: 193px}
#news-hub .social .connect .rss a {background-position: 17px 10px}
#news-hub .social .connect .events a {background-position: 17px -184px}

.social .connect .rss a {background-position: 27px 19px}
.social .connect .twitter a {background-position: 27px -42px}
.social .connect .facebook a {background-position: 27px -108px}
.social .connect .events a {background-position: 27px -175px}
.social .connect .upcoming a {background-position: 27px -242px}


/*news detail*/
.full-two-col .column-main {padding: 28px 0 28px 26px; width: 610px}
.full-two-col .column-aside {width: 324px}

.full-two-col {
background: url(common/images/structure/bg-section-full-two-col-top.png) no-repeat;
padding-top: 5px}

.full-two-col .section-content {background: #181d1f url(common/images/structure/bg-section-corner-blue-bottom-r.png) no-repeat 100% 100%}
.full-two-col .section-content-inner {background: url(common/images/structure/bg-section-corner-blue-bottom-l.png) no-repeat 0 100%}
.full-two-col .section-wrapper {background: url(common/images/structure/bg-content-shadow.png) repeat-y 666px 0; padding: 0}

.intro {color: #716f6b}
.intro h2 {color: #bb9f1b; font-size: 30px; font-weight: bold; line-height: 32px; margin-bottom: 5px}
.intro p {margin-right: 15px}

#individual-news .full-two-col {
background-image: url(common/images/structure/bg-section-full-two-col-no-shadow-top.png)}

#individual-news .intro {padding: 22px 26px 26px}
#individual-news .intro h1 {
border-bottom: 1px solid #2e373a;
color: #30868b;
font-size: 30px;
font-weight: bold;
line-height: 32px;
padding: 0 100px 16px 0}
#individual-news .intro .meta {margin-bottom: 0}
#individual-news .meta {background: url(common/images/structure/bg-news-meta.png) repeat-y 195px 0}
#individual-news .meta li {padding: 16px 20px 8px 0; width: 140px}
#individual-news .meta .author {
background: url(common/images/structure/ico-puma-author.png) no-repeat 0 11px;
min-height: 24px;
padding-left: 51px;
width: 144px}
#individual-news .meta .comments {
background: url(common/images/structure/ico-comments.png) no-repeat 0 21px;
padding-left: 24px}

#individual-news #content .column-main {padding-top: 0; width: 669px}
#individual-news #content .column-aside {width: 257px}

#individual-news .column-main img{display:block;}
#individual-news .column-aside .section {
background: url(common/images/structure/bg-section-aside-content-shadow.png) no-repeat 100% 0}
#individual-news .column-aside .section h3 {
background: url(common/images/structure/hdr-icons.png) no-repeat;
color: #626d71;
font-size: 14px;
font-weight: bold;
line-height: 23px;
margin-bottom: 7px;
padding: 0 0 0 28px;
text-transform: uppercase}
#individual-news .column-aside .section .hdr-tags {background-position: 0 -655px}
#individual-news .column-aside .section .hdr-media {background-position: 0 -584px; padding-top: 4px}
#individual-news .column-aside .section .hdr-related-athletes {background-position: 0 -721px; padding-left: 35px}
#individual-news .column-aside .section .hdr-related-events {background-position: 0 -791px}
#individual-news .column-aside .section-wrapper {background: none; padding: 19px 20px 4px 0}

/*news archive*/

#news-hub .news-archive .column-main .section-header h1 {
color: #7e7f7c;
float: left;
font-size: 16px;
line-height: 20px;
padding: 0 0 6px 15px;
font-weight:bold;
width:707px;
text-transform:uppercase;}
#news-hub .news-archive .column-main .section-header {padding: 5px 16px 0 0px; background:#202a2e;}
#news-hub .news-archive .column-main .articles .section-header{background:none;}


/*crew*/
#athlete-hub .crew-bar {
background: #181d1f url(common/images/structure/bg-crew-bar.png) no-repeat 0 100%;
width:1081px;}
#athlete-hub .crew-bar .tabs {
float: left;
font-size: 11px;
font-weight: bold;
margin: 9px 0 0 45px;
text-transform: uppercase;}
#athlete-hub .crew-bar .tabs li {
float: left;
margin-right: 5px}
#athlete-hub .crew-bar .tabs a {
background: #1c2326 url(common/images/structure/bg-crew-tabs.png) repeat-x 0 100%;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
color: #30868b;
display: block;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
padding: 11px 17px 6px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px}
#athlete-hub .crew-bar .tabs .current a {
background: #20282c;
color: #b3b7b7}

#athlete-hub #content {padding: 25px 47px 25px 44px;}
#athlete-hub #content .column-main {width: 749px}
#athlete-hub #content .column-aside {width: 234px}

#athlete-hub .athlete-listing {
background: #383633 url(common/images/structure/bg-athlete-listing.png) no-repeat;
float: left;
margin-bottom: 8px;
padding: 20px 0 0;
position: relative}
#athlete-hub .athlete-listing h2 {
border-bottom: 1px solid #2a2826;
color: #68645f; font-size: 11px;
font-weight: bold;
line-height: 11px;
margin: 0 8px;
padding: 0 0 8px 7px;
text-transform: uppercase}
#athlete-hub .athlete-listing ul {
background: url(common/images/structure/bg-athlete-listing.png) no-repeat -749px 100%;
float: left;
margin: 0;
width: 749px}
#athlete-hub .athlete-listing li {
background: url(common/images/structure/bg-athlete-listing-top.png) repeat-x;
float: left;
width: 187px}
.js #athlete-hub .athlete-listing li {cursor: pointer}
#athlete-hub .athlete-listing .first-row {background: none}
#athlete-hub .athlete-listing .first {width: 188px}
#athlete-hub .athlete-inner {
background: url(common/images/structure/bg-athlete-listing-shadow.png) repeat-x 0 15px;
height: 218px;
padding: 15px 11px 0 10px;
width: 166px}
#athlete-hub .athlete-listing .first .athlete-inner {padding-left: 11px}

#athlete-hub .athlete-listing .photo .flag {
background: url(common/images/structure/bg-athlete-listing-shadow.png) repeat-x 0 100%}
#athlete-hub .photo {
display: block;
height: 158px;
overflow: hidden;
position: relative;
width: 166px}
#athlete-hub .photo img {display: block}
#athlete-hub .photo .flag {
background: #383633 url(common/images/structure/bg-athletes-hub-inner-shadow.png) repeat-x 0 100%;
border-top-left-radius: 5px;
bottom: 0;
display: block;
-moz-border-radius-topleft: 5px;
padding: 8px 0 8px 9px;
position: absolute; right: 0;
-webkit-border-top-left-radius: 5px;
width: 26px}
#athlete-hub .photo .flag img {
border: 1px solid #fff;
display: block}

#athlete-hub .athlete-content {
color: #bcbcbc;
display: block;
font-size: 11px;
line-height: 13px;
padding: 11px 0 11px 8px}
#athlete-hub .athlete-content strong {
color: #fefefe;
display: block;
font-size: 12px;
font-weight: normal}
#athlete-hub .athlete-content em {
display: block;
font-style: normal}
#athlete-hub .athlete-listing .athlete-content {
padding-right: 10px}

/**/
#athlete-hub .athlete-listing .details {
background: #181d1f;
display: none;
height: auto;
left: 0;
padding: 15px 15px 15px 10px;
position: absolute;
top: 0;
width: 529px;
z-index: 100}
#athlete-hub .athlete-listing .first .details {padding-left: 11px; width: 528px}
#athlete-hub .athlete-listing .second .details {left: 188px; padding-right: 22px}
#athlete-hub .athlete-listing .third .details {left: auto; right: 187px}
#athlete-hub .athlete-listing .fourth .details {left: auto; right: 0}
#athlete-hub .athlete-listing .alt .details {padding: 15px 11px 15px 14px}
#athlete-hub .athlete-listing .details .primary {float: left; width: 166px}
#athlete-hub .athlete-listing .alt .details .primary {float: right}
#athlete-hub .athlete-listing .details .photo {margin-bottom: 9px}
#athlete-hub .athlete-listing .details .photo .flag {
background: #181d1f;
-moz-box-shadow: inset 0 -3px 6px -3px rgba(0,0,0,0.7);
-webkit-box-shadow: inset 0 -3px 6px -3px rgba(0,0,0,0.7);
box-shadow: inset 0 -3px 6px -3px rgba(0,0,0,0.7)}
/**/
#athlete-hub .athlete-listing .details .facts {
background: none;
font-size: 11px;
line-height: 16px;
width: 100%}
#athlete-hub .athlete-listing .details .facts li {
background: none;
border-bottom: 1px dotted #414342;
cursor: normal;
padding: 7px 0; width: 100%}
#athlete-hub .athlete-listing .details .facts strong {display: block}
/**/
#athlete-hub .athlete-listing .details .secondary {
color: #fff;
float: right;
overflow: hidden;
width: 345px}
#athlete-hub .athlete-listing .alt .details .secondary {float: left}
#athlete-hub .athlete-listing .details .header {
border-bottom: 2px solid #3f4344;
color: #bcbcbc;
font-size: 11px;
line-height: 13px;
margin-bottom: 12px;
padding-bottom: 12px}
#athlete-hub .athlete-listing .details h3 {
color: #dbb917;
font-size: 22px;
line-height: 24px}
#athlete-hub .athlete-listing .details .header .role,
#athlete-hub .athlete-listing .details .header .nationality {display: block}
#athlete-hub .athlete-listing .details .close {
background: url(common/images/structure/ico-all.png) no-repeat 0 0;
display: block;
height: 20px;
overflow: hidden;
position: absolute;
right: -8px;
text-indent: -9999px;
top: -8px;
width: 20px}

#athlete-hub .athlete-bio {background: #dbdbcc}
#athlete-hub .athlete-bio .vitals {width: 100%}
#athlete-hub .athlete-bio .hdr-about-crew {border-bottom: 1px dotted #929288}
#athlete-hub .athlete-bio table {font-size: 10px; margin-bottom: 0}
#athlete-hub .athlete-bio .odd {background-color: #ecebe5}
#athlete-hub .athlete-bio .even {background: none}
#athlete-hub .athlete-bio .first th, #athlete-hub .athlete-bio .first td {background: none}
#athlete-hub .athlete-bio .last th, #athlete-hub .athlete-bio .last td {border-bottom: none}

.stripe .even {background-color: #ecebe5}
.stripe .odd {background-color: #dadac9}

.athlete-bio .vitals table {color: #6c848d; font-size: 11px; width: 100%}
.athlete-bio .vitals .ttl {/*border-right: 1px dotted #404343;*/ color: #2f858a; font-weight: bold}
.athlete-bio .vitals .odd {background-color: #1e2527}
.athlete-bio .vitals .even {background-color: #273034}
.athlete-bio .vitals th, .athlete-bio .vitals td {border-bottom: 1px solid #1c2225}
.athlete-bio .vitals .first th, .athlete-bio .vitals .first td {background-image: url(common/images/structure/bg-first-tr-top-shadow.png); background-repeat: repeat-x}
.athlete-bio .vitals .flag {border: 1px solid #fff; box-shadow: 0 0 3px rgba(0,0,0,.3); display: block; float: left; margin: 0 6px 0 0; -moz-box-shadow: 0 0 3px rgba(0,0,0,.3); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.3)}
.athlete-bio .vitals table ul {margin-bottom: 0}


/* footer old
--------------------------------------------*/
#footer {
background: url(common/images/structure/footer/bg-footer.jpg) no-repeat 50% 0;
color: #fff; padding: 18px 0 32px; position: relative; margin: -18px auto; width: 100%; z-index: 100}
#footer .container {margin: 0 auto; overflow: hidden; padding: 39px 0 56px 259px; width: 822px}
#footer a {color: #fff; text-decoration: none}
#footer a:hover {text-decoration: underline}
#footer .column-main {float: left; margin: 0 65px 0 0; width: 390px;}
#footer .column-main p {font-size: 14px; margin-bottom: 15px}
#footer .column-main .tagline {font-size: 15px}
#footer .more {background: #30868b url(common/images/structure/footer/bg-footer-more.png) repeat-x; border-radius: 5px; color: #fff; display: inline-block; font-weight: bold; margin-bottom: 25px; -moz-border-radius: 5px; padding: 5px 15px; text-transform: uppercase; -webkit-border-radius: 5px}
#footer .column-main .copy {clear: both; color: #727c85; font-size: 12px; line-height: 18px; margin-bottom: 0}
#footer .column-aside {margin-top:-12px; float: left; line-height: 18px; padding: 0 0 0 28px; width: 158px}
#footer .alt {width: 149px}
#footer .column-aside li {font-size:10px;}

/* footer
--------------------------------------------*/
#puma-global-footer {color: #fff; margin: 0 auto; overflow: hidden; padding-left: 217px; position: relative; height:auto; width: 864px; z-index: 100}
#puma-global-footer a {color: #fff}
#puma-global-footer .copyright {color: #9a9a9a; font-size: 11px; left: 44px; line-height: 16px; padding-top: 10px; position: absolute; top: 128px; width: 157px}
#puma-global-footer .copyright .reserved {display: block}
#puma-global-footer .section {float: left; padding-top: 35px; width: 172px;  padding-bottom: 32767px; margin-bottom: -32767px}
#puma-global-footer .section {-moz-transition: background 0.25s ease-in-out; -webkit-transition: background 0.25s ease-in-out; transition: background 0.25s ease-in-out}
#puma-global-footer .section h3 {color: #9a9a9a; font-size: 15px; font-weight: bold; margin: 0 0 6px 20px; text-transform: uppercase}
#puma-global-footer .section a {display: block; font-size: 10px; font-weight: bold; padding: 4px 10px 4px 20px; text-transform: uppercase}
#puma-global-footer .section a.view-mobile-site {display: none}
#puma-global-footer .section ul li.last { padding-bottom:50px; }
@media screen and (max-device-width=480px) {#puma-global-footer .section a.view-mobile-site {display: block}
}
   #puma-global-footer {background: url(common/images/structure/footer/bg-footer-logo.png) no-repeat 44px 41px}
#puma-global-footer .section:hover {background: #20282c}
#puma-global-footer .copyright {border-color: #2f858a}
#puma-global-footer .copyright, #puma-global-footer .section h3 {color: #485960}
#puma-global-footer .section a:hover {background: #2f858a url(common/images/structure/ico-global.png) no-repeat 8px -1943px}


/*===========================================
--- footer alpha ---
============================================*/
#nav-global {background: url(common/images/structure/footer/bg-global-nav.png) repeat-x; bottom: 0; height: 32px; padding: 2px 0 0; position: fixed; width: 100%; z-index: 100000}
.ie6 #nav-global {position: absolute}
#nav-global .nav {margin: 0 auto; position: relative; width: 1081px}
.fix-global-nav #nav-global .nav {width: 100%}
#nav-global .nav .nav-puma{position: absolute; top: 0}
#nav-global .nav .nav-puma {left: 0}
#nav-global .nav .control {background: url(common/images/structure/footer/global-nav.png) no-repeat; display: block; height: 32px; overflow: hidden; text-indent: -9999px; width: 143px}
#nav-global .nav .nav-puma .control {height: 53px; position: relative; top: -21px; z-index: 100000}



/*clearfix
=================================*/
.clear {
height: 1px;
clear: both;
margin-top: -1px;
overflow: hidden}
.row:after,
.clearfix:after,
#content:after,
.section:after,
.section-header:after,
.section-header-inner:after,
.section-content:after,
.section-content-inner:after,
.contain:after, .aside:after {content: "."; display: block; height: 0; clear: both; visibility: hidden}

.clearfix:after{ clear: both; content: "."; display: block; height: 0; line-height: 0; visibility: hidden; }
.clearfix{ display: inline-block; }
html[xmlns] .clearfix{ display: block; }
* html .clearfix{ height: 1%; }
