/* FRAMEWORK CSS * * 12 April 2010 * * AKQA: Nigel Warson-Hill * */ /* CSS RESET (based on Yahoo YUI) */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; } ol,ul { list-style:none; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } q:before,q:after { content:''; } abbr,acronym { border:0; } body { font:13px/1.231 arial,helvetica,clean,sans-serif; } select,input,button,textarea,button { font:99% arial,helvetica,clean,sans-serif; } table { font-size:inherit; } pre,code,kbd,samp,tt { font-family:monospace; line-height:100%; } object, a { outline: none; } /* Not sure about removing all outlines for accessiblity (or lack of) */ /* * Font sizes... * * PX % * * 10 77 * 11 85 * 12 93 * 13 100 * 14 108 * 15 116 * 16 123.1 * 17 131 * 18 138.5 * 19 146.5 * 20 153.9 * 21 161.6 * 22 167 * 23 174 * 24 182 * 25 189 * 26 197 * */ /* NIKE */ body { width:100%; background:#000000 url(/nikefootball/assets/images/common/bg-training-ground.jpg) no-repeat center top; } .tracking-img {position:absolute; left:-10000px; width:1px; height:1px;} div.noscriptmsg { background-color:#d00; padding:20px; color:#fff; text-align:center; font-weight:bold; } /* PAGE SHELL */ /* 910 : content width * 974 : shadow width * 1001 : full width * 1033 including nav & shadow */ #p_outerwrapper { width:1033px; margin:0 auto; padding-bottom:30px; } /* full width centered container (with left padding for offset) */ #p_outerwrapperinner { margin:0 0 0 63px; padding:0 29px 0 33px; } /* shadow container right aligned (padding to give shadow space) */ .pageshadow #p_outerwrapperinner { background:transparent url(/nikefootball/assets/images/common/bg-shadow-y.png) repeat-y; } /* Change to transparent */ #p_innerwrapper { position:relative; } /* standard page layout for reference to "page items" */ /* PAGE HEADER */ #p_innerwrapperheader { } /* header bar - default content stub */ #p_contentstub { background-color:#000; } #p_lozenge { position:absolute; top:28px; left:-96px; z-index:150; font-family:Helvetica; } #p_navigation { position:absolute; top:92px; left:-96px; z-index:150; font-family:Helvetica; } #nav-module-left_swf, nav-module-top_swf {display:block;} /* seems to solve intermittent bug where swf nav doesn't show in FF */ #p_commerce { position:absolute; top:0; right:7px; z-index:150; font-family:Helvetica; } #p_contentstub { background:#000; padding:20px 0; color:#444; position:relative; font-family:Helvetica; border-style:solid; border-color:#464646; border-width:1px 1px 0; } #p_contentstub h1 { color:#444; line-height:1.8em; font-size:85%; padding:0 0 6px 20px; } #p_contentstub h1 strong { font-weight:bold; } #p_contentstub p { font-size:85%; line-height:1.2em; padding:0 0 5px; margin:0; } #p_contentstub p.breadcrumb { color:#444; line-height:1.8em; text-transform:uppercase; padding:0 0 5px 20px; } #p_contentstub p a { color:#444; text-decoration:underline; } #p_contentstub p a:hover { color:#f26100; text-decoration:none; } #p_contentstub p a.highlight, #p_contentstub p a.highlight:hover { color:#444; text-decoration:none; } #p_contentstub .leftcol {width:408px; padding:0 20px; float:left;} #p_contentstub .rightcol {width:430px; float:right;} #p_contentstub .fullwidth {width:866px;} /* PAGE CONTENT */ #p_innerwrapperinner { overflow:hidden; } /* page inner where it all happens */ /* PAGE FOOTER */ #p_innerwrapperfooter { background-color:#000; font-family:Helvetica; } #p_innerwrapperfooter .footercontainer {margin:0; border:1px solid #464646; } #p_innerwrapperfooter .sitemapinner {} #p_innerwrapperfooter .sitemapinner ul {position:relative;} #p_innerwrapperfooter .sitemapinner ul li.brand {width:97px; min-height:90px; padding:16px; text-transform:uppercase; font-size:131%; color:#787a79; float:left;} #p_innerwrapperfooter .sitemapinner ul li.brand strong { display:block; font-weight:normal; } #p_innerwrapperfooter .sitemapinner ul li.brand a { color:#787a79; text-decoration:none; } #p_innerwrapperfooter .sitemapinner ul li.brand a:hover { color:#f26100; text-decoration:none; } #p_innerwrapperfooter .sitemapinner ul li.sitemap {min-height:115px; padding:14px 10px 14px; text-transform:uppercase; border-left:1px solid #464646; float:left;}/*ie6*/ #p_innerwrapperfooter .sitemapinner ul li.sitemap ol {position:relative; display:block; width:113px; margin:0 6px; float:left;}/*ie6*/ #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li { line-height:1.4em; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.link { color:#999; font-size:77%; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.link a { color:#999; text-decoration:none; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.link a:hover { color:#f26100; text-decoration:none; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.header { color:#999; font-size:85%; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.header strong { font-weight:bold; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.header strong a { color:#999; text-decoration:none; } #p_innerwrapperfooter .sitemapinner ul li.sitemap ol li.header strong a:hover { color:#f26100; text-decoration:none; } #p_innerwrapperfooter .footerinner {font-size:77%; border-top:1px solid #464646; background:url(/nikefootball/assets/framework/v1/images/footerinner.gif) repeat-y 0 0;} #p_innerwrapperfooter .footerinner p {padding:7px 0 6px; margin:0; font-size:100%; color:#999; text-align:center; text-transform:uppercase; float:left;} #p_innerwrapperfooter .footerinner p.changeregion {position:relative; width:129px; background:#242424 url(/nikefootball/assets/framework/v1/images/bg-change-region-x.gif) repeat-x 0 0;} #p_innerwrapperfooter .footerinner p.changeregion a {display:block; color:#fff; text-decoration:none; margin:0;} #p_innerwrapperfooter .footerinner p.changeregion a:hover { color:#f26100; text-decoration:none; } #p_innerwrapperfooter .footerinner p.changeregion img {width:16px; height:11px;} #p_innerwrapperfooter .footerinner p.changeregion a img {margin:0 4px 0 0; vertical-align:top; } #p_innerwrapperfooter .footerinner p.links {width:466px; padding:7px 14px 6px; text-align:left;} #p_innerwrapperfooter .footerinner p.links a { color:#999; text-decoration:none; } #p_innerwrapperfooter .footerinner p.links a:hover { color:#f26100; text-decoration:none; } #p_innerwrapperfooter .footerinner p.copyright {width:246px; padding:7px 9px 6px;} /* FLASH PROXY */ #f4a_nikeflashcontent { position:absolute; bottom:0; left:-1px; } /* VIDEO TAG */ .videotagcontainer, .videotagcontainer video { width:908px; height:510px; } .videotagcontainer span { display:none; } /* Fix for IE and Nike implementation */ /* SIMPLE OVERLAY */ div#p_overlaycontainer { display:none; position:absolute; top:0; left:0; width:100%; height:100%; background:#333; z-index:160;} #p_closeoverlay { position:absolute; top:0; right:0; width:24px; height:24px; margin:0; padding:0; cursor:pointer; background:transparent url(/nikefootball/assets/framework/images/videos/btn-close.png) no-repeat top left;} /* SIMPLE VIDEO OVERLAY */ div#p_overlayvideo { display:none; position:fixed; z-index:170; top:35px; padding:1px 24px 1px 1px; width:909px; height:510px; overflow:hidden;} div#p_overlayvideo video { background:#333; width:908px; height:510px; } /* SIMPLE TERMS OF SERVICE OVERLAY */ div#p_overlaytos { display:none; position:fixed; z-index:170; top:35px; padding:1px 0 1px 1px; width:400px; height:330px; overflow:hidden; background:#333; font-family:Helvetica; } div#p_overlaytos h2 { font-size:153.9%; padding:40px 20px 10px; text-transform:uppercase; } div#p_overlaytos h3 { font-size:123.1%; padding:10px 20px; } div#p_overlaytos p { padding:10px 20px; } div#p_overlaytos p a { color:#fff; } div#p_overlaytos ul { padding:20px; font-size:123.1%; text-align:center; } div#p_overlaytos ul li { display:inline; padding:0 30px; } div#p_overlaytos li a { color:#fff; text-decoration:none; } div#p_overlaytos p a:hover, div#p_overlaytos li a:hover { color:#f26100; text-decoration:none; } /* FEEDBACK PLACEHOLDER */ /*** Feedback Panel */ /* Awaiting full implementation */ #feedback-bar { clear:both; position:relative; height:40px; line-height:40px; padding:10px 9px; background:#fff url(/nikefootball/assets/framework/v1/images/bg-footer-swoosh.jpg) no-repeat 9px 10px; } /***********************************************/ /* BEGIN : left nav and page global components */ /***********************************************/ .commerceinner { visibility:hidden; position:relative; width:332px; display:inline-block; font-size:.8em; background:url(/nikefootball/assets/framework/images/spr-commercebar.png) no-repeat 0 0;} .commerceinner a {display:block; color:#333; padding:0 10px; line-height:100%; text-decoration:none; text-transform:uppercase;} .commerceinner a:hover, .commerceinner a:focus {color:#ff6601;} .commerceinner a span {color:#ff6601; margin-left:10px;} .commerceinner .cart a {padding:0 20px; background:url(/nikefootball/assets/framework/images/spr-commercebar.png) no-repeat -484px -88px;} .commerceinner .cart a:hover, .commerceinner .cart a:focus {background-position:-484px -72px;} .commerceinner ul {position:relative; min-width:322px; left:8px; padding:8px 5px 14px; background:url(/nikefootball/assets/framework/images/spr-commercebar.png) no-repeat 100% -31px;} .commerceinner li {float:left;} .commerceinner li.region {width:16px;} .commerceinner li.region img {width:16px; height:11px;} .commerceinner li.region a {padding:0;} .commerceinner li.cart {float:right;} div#p_commerce.fixheight { padding:19px 0 0; } /* Nike Swoosh and Nike football logos */ .lozengeinner {overflow:hidden;} .lozenge {position:relative;} .lozengeinner .swoosh {display:block; height:39px; float:left; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat 0 -67px;} .lozengeinner .swoosh span {position:absolute; margin:2px 0 0 5px; z-index:-1;} .lozengeinner .swoosh {width:94px;} .lozengeinner .swoosh a {display:block; width:94px; height:39px;} .lozengeinner .swoosh a:hover, .lozengeinner .swoosh a:focus {background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat 0 -106px;} .lozengeinner .nike-football {width:168px; float:left;} .lozengeinner.expanded .nike-football {width:306px;} .lozengeinner .nike-football a {display:block; width:158px; height:31px; color:#ccc; font-size:1.4em; padding:8px 0 0 10px; text-transform:uppercase; text-decoration:none; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -228px -67px;} .lozengeinner .nike-football a:hover {color:#4d4d4d; background-position:-228px -106px;} .lozengeinner .nike-football a:focus {outline:dotted 1px #ccc;} .lozengeinner.expanded .nike-football a {width:296px; background-position:-94px -67px;} .lozengeinner.expanded .nike-football a:hover {background-position:-94px -106px;} .lozengeinner .flyout {position:relative; top:-3px; display:block; margin:0 0 0 94px; width:168px; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -228px 100%;} .lozengeinner .flyout.hide {display:none;} .lozengeinner.expanded .flyout {width:300px; background-position:-96px 100%;} .lozengeinner .flyout .btm {} .lozengeinner .flyout em {font-weight:bold;} .lozengeinner .flyout a {color:#666; margin:0 12px 0 33px; text-decoration:none;} .lozengeinner .flyout a:hover, .lozengeinner .flyout a:focus {color:#ccc;} .lozengeinner .flyout a.on {color:#fff;} .lozengeinner .flyout a.close {display:block; width:10px; line-height:1px; margin:10px 10px 0 0; height:10px; text-indent:-10000px; float:right; background:url(/nikefootball/assets/framework/images/spr-ctas.gif) no-repeat 0 0;} .lozengeinner .flyout .col {width:150px; float:left;} .lozengeinner .flyout ul {padding:0 0 14px;} .lozengeinner .flyout li {padding:5px 0;} .lozengeinner .flyout li.more {text-align:right; padding-bottom:10px;} .lozengeinner .flyout li.more a {color:#ccc; font-size:.9em; text-transform:uppercase;} /* left-navigation (main body section) */ ul#leftnav {margin:0 0 33px;} #leftnav, #login, #social {width:98px; font-size:.82em;} /* Level 1 navigation */ #leftnav li {} #leftnav a, .loggedout a, #social a {display:block; color:#ccc; margin:1px 0; padding:9px 9px 0 13px; min-height:18px; text-transform:uppercase; text-decoration:none; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -398px -90px;} #leftnav a:focus, #login a:focus, #social a:focus {outline:dotted 1px #ccc;} #leftnav a:hover, .loggedout a:hover, #social a:hover {color:#4d4d4d; background-position:-398px -118px;} #leftnav a.search, #leftnav a.search:hover {color:#4d4d4d; padding:12px 20px 0 13px; min-height:21px; background-position:-398px 0;} #leftnav a.nosubnav {background-position:-398px -34px;} #leftnav a.nosubnav:hover {background-position:-398px -62px;} #leftnav a.twoline {min-height:32px; background-position:-398px -264px;} #leftnav a.twoline:hover {background-position:-398px -306px;} #leftnav a.twoline.nosubnav {background-position:-398px -180px;} #leftnav a.twoline.nosubnav:hover {background-position:-398px -222px;} /* Search component */ .jsison #leftnav .search-panel {position:absolute;width:387px; min-height:67px; margin:-36px 0 0 97px; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -12px 0;} .jsison #leftnav .search-panel, #leftnav .search-panel a, #leftnav a.search {display:none;} .jsison #leftnav a.search {display:block;} .jsison #leftnav .search-panel a {position:relative; right:10px; display:block; width:10px; min-height:0; padding:0; line-height:1px; margin:10px 0 0; height:10px; text-indent:-10000px; float:right; background:url(/nikefootball/assets/framework/images/spr-ctas.gif) no-repeat 0 0;} .jsison #leftnav .search-panel a:hover, #leftnav .search-panel a:focus {background-position:0 0;} #leftnav .search-panel input {width:100%;} .jsison #leftnav .search-panel input {position:absolute; margin:17px 0 0 20px; width:314px; color:#666; font-size:2.4em; background:transparent; border:0; outline:0;} .jsison #leftnav .search-panel input.search-submit {position:relative; width:13px; height:12px; color:#ddd; margin:39px 0 0 337px; font-size:0; line-height:0; text-align:-10000px; cursor:pointer; background:url(/nikefootball/assets/framework/images/spr-ctas.gif) no-repeat 0 -12px; overflow:hidden;} /* Second-level navigation parent when the 2nd level is expanded */ #leftnav li.open {margin-bottom:-2px;} #leftnav li.open a {margin:1px 0 0; min-height:24px; background-position:-398px -146px;} #leftnav li.open a:hover {color:#ccc; background-position:-398px -146px;} #leftnav li.open a.twoline, #leftnav li.open a.twoline:hover {min-height:38px; background-position:-398px -348px;} /* Level 2 navigation */ .jsison #leftnav li .second-level {display:none;} .jsison #leftnav li.open .second-level {display:block;} #leftnav li .second-level, #leftnav li .second-level ul {padding:0; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -496px 0;} #leftnav li .second-level {display:block; padding:0 0 10px; background-position:-496px 100%;} #leftnav li .second-level ul {margin:-1px 0 0;} #leftnav li .second-level li {margin:0 3px; padding:0;} #leftnav li .second-level li a {color:#616161; margin:1px 0 1px 1px; padding:3px 9px; min-height:0; text-transform:none; background:#ccc;} #leftnav li .second-level li a:hover, #leftnav li .second-level li a:focus {color:#000; outline:0;} .jsison #leftnav li .second-level li a.has3rd {background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -401px -396px;} .jsison #leftnav li .second-level li a.has3rd.on {color:#000; background-color:#fff; background-position:-401px -451px;} /* Level 3 navigation (make this with js on only?) */ #leftnav li.open li .third-level {position:absolute; margin:-29px 0 0 94px; padding:0; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat 100% 0;} #leftnav li.open li .col1 {width:132px;} #leftnav li.open li .col2 {width:262px;} #leftnav li.open li .col3 {width:394px; margin-left:92px;} #leftnav li.open li ul {position:relative; top:5px; margin:0; padding:0; overflow:hidden; background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat 100% 100%;} #leftnav li.open li li {width:113px; margin:0; padding:7px 9px 15px; float:left;} #leftnav li li li h2 {color:#000; padding:0 0 0 1px; text-transform:uppercase;} #leftnav li.open li li a {background:#fff; margin:0; padding:0;} #leftnav li.open li li ul {position:static; width:auto; margin:0; background:none; border:0;} #leftnav li.open li li li {position:static; width:auto; margin:0; padding:0 0 0 1px; float:none;} #leftnav li a.selected, #leftnav li a.selected:hover, #leftnav li a.selected:active, #leftnav li a.selected:visited { color:#f26100!important; } /* social networks left navigation panel */ #login { visibility:hidden; } /*.jsison #login {display:block;}*/ #login.loggedin, #login.loggedout { visibility:visible; } #login.loggedin .loggedoutview { display:none; } #login.loggedout .loggedinview { display:none; } .loggedout a {background-position:-398px -508px;} .loggedout a:hover {background-position:-398px -536px;} #login.loggedin {margin-bottom:-3px;} .loggedin {min-height:101px; background:url(/nikefootball/assets/framework/images/spr-loggedin.png) no-repeat 0 0;} .loggedin li {padding:7px;} .loggedin img {width:84px; height:50px; margin:0;} .loggedin a {display:block; color:#ccc; text-decoration:none;} .loggedin a span {display:block; padding:2px 0 0 2px; float:left;} .loggedin a:hover {} .loggedin .profile-flyout {position:absolute; width:119px; margin:-56px 0 0 89px; padding:0; background:url(/nikefootball/assets/framework/images/spr-loggedin.png) no-repeat 100% 0;} .loggedin .profile-flyout ul {position:relative; top:7px; margin:0; padding:8px 10px 12px; overflow:hidden; background:url(/nikefootball/assets/framework/images/spr-loggedin.png) no-repeat 100% 100%;} .loggedin li .profile-flyout li {padding:3px 0;} .loggedin .profile-flyout li a {padding:0;} .loggedin .profile-flyout li a:hover { color:#eee; } /* social networks left navigation panel */ #social, .social {background:url(/nikefootball/assets/framework/images/spr-leftnav.png) no-repeat -398px 100%;} .social {margin:2px 0 0; background-position:-398px -678px;} #social {position:relative; top:7px; padding:0px 0 4px;} #social dt, #social dd {display:block; position:relative; top:-3px;} #social dd span {position:absolute; z-index:-1;} #social a {margin:0;} #social a.blog {background-position:-398px -683px;} #social a.blog:hover {background-position:-398px -566px;} #social a.blog span {position:static; z-index:0;} #social a.twitter {background-position:-398px -709px;} #social a.twitter:hover {background-position:-398px -593px;} #social a.facebook {background-position:-398px -736px;} #social a.facebook:hover {background-position:-398px -620px;} #social a.youtube {background-position:-398px -763px;} #social a.youtube:hover {background-position:-398px -647px;} /* clearFix: adapted from http://www.positioniseverything.net/easyclearing.html */ .cf:after, .commerceinner ul:after {content:"."; display:block; height:0; clear:both; visibility:hidden;} .cf, .commerceinner ul {height:1%;} /***********************************************/ /* END: left nav and page global components */ /***********************************************/ .hide, .js-show {display:none;} .js-hide {} .jsison .js-hide {display:none;} .jsison .js-show {display:block;} /***********************************************/ /* LOCALE OVERRIDES ****************************/ /***********************************************/ .it_it .commerceinner li a { padding:0 5px; } .it_it .commerceinner li.cart a { padding:0 5px 0 20px; } .fr_fr .commerceinner li a { padding:0 5px; } .fr_fr .commerceinner li.cart a { padding:0 5px 0 20px; } .es_es .commerceinner li.cart a { padding:0 5px 0 20px; } /* left nav */ #nav-module { float: left; margin-top: 0; position: absolute; width: 96px; z-index: 100; } #nav_input_form { left: 117px; position: absolute; top: 18px; visibility: hidden; z-index: 101; } #nav_input { background-color: transparent; border: 0 solid #000000; font-size: 30px; } #nav-module-top { top: 0; position:absolute; } #nav-module-left { top: 0; position:absolute; } #nav { width: 90px; display: block!important; visibility: hidden!important; } #nav div { visibility: hidden!important } noscript #nav { position:absolute; top:0; visibility: visible!important; } noscript #nav div { visibility: visible!important; } noscript #nav #search, noscript #nav #profile, noscript #site { display:none; } .jsison #nav div, #site { visibility: hidden!important; } #nav #profile { visibility: hidden!important; } #nav a { font-family: arial; } #nav a:hover, #nav .tertiaryColumn a:hover { color: #ed682f!important } #nav .primaryButton { display: block; margin-bottom: 1px; } #nav .primaryButton a { background: transparent url('../../assets/images/leftNav/top.png') no-repeat 0 0; text-indent: 0; } #nav .primaryButton a, #nav dt { display: block; text-decoration: none; color: #c5c5c5; padding: 6px 0 7px 6px; font-size: 11px; font-weight: bold; } #nav .secondaryButton { height: auto; background: #d5d5d5 url('../../assets/images/leftNav/hGrad.png') repeat-y 0 27px; } #nav a + .secondaryButton { background: #d5d5d5 url('../../assets/images/leftNav/subTop.png') no-repeat 0 0px; } #nav .secondaryButton:last-child { background: transparent url('../../assets/images/leftNav/subBottom.png') no-repeat 0 bottom; } #nav .secondaryButton a, #nav dt { height: auto; color: black; line-height: 14px; background-image: none; width: 84px; } #nav .tertiaryPanel { margin: 0 4px; } #nav .tertiaryPanel a { display: none!important; color: #333!important; width: 80px; } #nav .tertiaryColumn { border-bottom: 1px solid #ccc; } #nav .tertiaryColumn a { display: block!important; } #no_invisible { display: none; }