/* =----------------------------------------------------------------------------------

Main Style Sheet

Version:	1.1

--------------------------------------------------------------------------------------*/
/* =------------------------------------------------------------------------

CSS

----------*/ 

@import url("reset.css");
@import url("typo.css");

/* */

/* =------------------------------------------------------------------------

Clearing

----------*/ 

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix{display: inline-block;}

.clear {clear: both;}

/* */


/* =------------------------------------------------------------------------

Layout

----------*/

html, body{ 
 margin:0; 
 padding:0; 
 text-align:center; 
 background: #fff url(../images/banner_bk.jpg) top center no-repeat
} 
 
#pagewidth{ 
 width:960px; 
 text-align:left;  
margin-left:auto; 
 margin-right:auto;  
} 
 
#header{
 position:relative; 
 height:262px; 
 width:100%;
 background: url(../images/swoosh01.png) bottom right no-repeat
} 
 
#secondaryNav{
 width:175px; 
 float:left; 
 position:relative; 
 background:#ccc;
 background: url(../images/secondarynav_bk.png) top left no-repeat
 }
 
#mainContent{
	float: left;  
	position: relative; 
	width:542px; 
	color: #666
 }
 
 #content{
 width:762px; 
 float:right; 
 position:relative;
  }
   
#secondaryContent{
 width:204px; 
 float:right; 
 position:relative;
 background:#F3F4F5;
 background: url(../images/swoosh02.png) top right no-repeat
 }
 
#footer{
 height:40px; 
 clear:both;
 background: url(../images/footer_bk.png) top left repeat-x;
 margin: 1em 0 0 0
 } 

/* Skip Navigation */

.textonly {/* Hides the 'Skip Navigation' link */
	position:absolute;
	left:-1500px;
	width:1px;
	height:1px;
	overflow:hidden;
}

 /* =------------------------------------------------------------------------

#header facts

----------*/

#header #logo a{float: right; margin: 0 20px 0 0;height: 170px; width: 205px; text-indent: -2000px}
#header .facts {
position: absolute;
top: 27px;
left: 5px
}

 /* =------------------------------------------------------------------------

#mainNav

----------*/

#mainNav {
display: block;
height: 80px;
position: absolute;
top: 193px;
left:10px
}

#mainNav li {
float: left;
margin: 0 21px 0 0
}

#mainNav li, #mainNav a {text-indent: -2000px}

#mainNav li.nav1 a {
display: block;
background: url(../images/nav1.png) top left no-repeat;
width: 92px;
height: 40px;
}

#mainNav li.nav2 a {
display: block;
background: url(../images/nav2.png) top left no-repeat;
width: 88px;
height: 40px;
}

#mainNav li.nav3 a {
display: block;
background: url(../images/nav3.png) top left no-repeat;
width: 70px;
height: 40px;
}

#mainNav li.nav4 a {
display: block;
background: url(../images/nav4.png) top left no-repeat;
width: 97px;
height: 40px;
}

#mainNav li.nav5 a {
display: block;
background: url(../images/nav5.png) top left no-repeat;
width: 93px;
height: 40px;
}

#mainNav li.nav6 a {
display: block;
background: url(../images/nav6.png) top left no-repeat;
width: 111px;
height: 40px;
}

#mainNav li.nav7 a {
display: block;
background: url(../images/nav7.png) top left no-repeat;
width: 73px;
height: 40px;
}

#mainNav li.this a,
#mainNav li.nav1 a:hover, #mainNav li.nav2 a:hover, #mainNav li.nav3 a:hover, #mainNav li.nav4 a:hover, #mainNav li.nav5 a:hover, #mainNav li.nav6 a:hover, #mainNav li.nav7 a:hover {
background-position: bottom
}
 /* =------------------------------------------------------------------------

Formatting

----------*/
#mainContent h1 {color: #006FB3; font-size: 3em; padding: 0; margin: 0}
#mainContent a {color: #29C3F4 !important}
#mainContent a:hover {color: #006FB3 !important}

#mainContent ul{
 padding: 0 1.2em;
 margin: 0 5px
}

#mainContent li{
 list-style: circle
}

#mainContent .title_image {margin: 0 0 0.8em 0}
#mainContent p strong {color: #006FB3}

/* =------------------------------------------------------------------------

#secondaryNav

----------*/

#secondaryNav ul {margin: 10px 15px}
#secondaryNav li a{
display: block;
width: 146px;
border-bottom: 1px dotted #ccc;
text-indent: -2000px;
}

#secondaryNav #weretap li a{
height: 38px;
}

#secondaryNav #badwater li a{
height: 56px;
}

#secondaryNav #tapaction li a{
height: 56px;
}

#secondaryNav #resources li a{
height: 56px;
}

#secondaryNav #media li a{
height: 38px;
}

/* #weretap */
#secondaryNav #weretap li.nav1 a{
background: url(../images/weretap_nav1.png) top left no-repeat;
}

#secondaryNav #weretap li.nav2 a{
background: url(../images/weretap_nav2.png) top left no-repeat;
}

#secondaryNav #weretap li.nav3 a{
background: url(../images/weretap_nav3.png) top left no-repeat;
}

#secondaryNav #weretap li.nav4 a{
background: url(../images/weretap_nav4.png) top left no-repeat;
}

#secondaryNav #weretap li.nav5 a{
background: url(../images/weretap_nav5.png) top left no-repeat;
}

/* #badwater */
#secondaryNav #badwater li.nav1 a{
background: url(../images/badwater_nav1.png) top left no-repeat;
}

#secondaryNav #badwater li.nav2 a{
background: url(../images/badwater_nav2.png) top left no-repeat;
}

#secondaryNav #badwater li.nav3 a{
background: url(../images/badwater_nav3.png) top left no-repeat;
}

#secondaryNav #badwater li.nav4 a{
background: url(../images/badwater_nav4.png) top left no-repeat;
}

/* #tapaction */
#secondaryNav #tapaction li.nav1 a{
background: url(../images/tapaction_nav1.png) top left no-repeat;
}

#secondaryNav #tapaction li.nav2 a{
background: url(../images/tapaction_nav2.png) top left no-repeat;
}

#secondaryNav #tapaction li.nav3 a{
background: url(../images/tapaction_nav3.png) top left no-repeat;
}

#secondaryNav #tapaction li.nav4 a{
background: url(../images/tapaction_nav4.png) top left no-repeat;
}

/* #resources */
#secondaryNav #resources li.nav1 a{
background: url(../images/resources_nav1.png) top left no-repeat;
}

#secondaryNav #resources li.nav2 a{
background: url(../images/resources_nav2.png) top left no-repeat;
}

#secondaryNav #resources li.nav3 a{
background: url(../images/resources_nav3.png) top left no-repeat;
}

/* #media */
#secondaryNav #media li.nav1 a{
background: url(../images/media_nav1.png) top left no-repeat;
}

#secondaryNav #media li.nav2 a{
background: url(../images/media_nav2.png) top left no-repeat;
}

#secondaryNav #media li.nav3 a{
background: url(../images/media_nav3.png) top left no-repeat;
}

#secondaryNav #weretap li.this a, #secondaryNav #weretap li a:hover,
#secondaryNav #badwater li.this a, #secondaryNav #badwater li a:hover,
#secondaryNav #tapaction li.this a, #secondaryNav #tapaction li a:hover,
#secondaryNav #resources li.this a, #secondaryNav #resources li a:hover,
#secondaryNav #media li.this a, #secondaryNav #media li a:hover {background-position: bottom}

#secondaryNav .bottom {
background: url(../images/secondarynav_bot.png) top left no-repeat;
display: block;
width: 175px;
height: 9px;
overflow: hidden;
line-height: 0px;
padding: 0;
margin: 0;
font-size: 0px
}

 /* =------------------------------------------------------------------------

#secondaryContent

----------*/

#secondaryContent .panel {
display: block;
margin: 140px 0 0 0
}

#tapchallenge {
padding: 20px 0 0 0;
background: #fff;
float: left
}

#tapchallenge a{
display: block;
background: #fff url(../images/tapchallenge.png) top left no-repeat;
width: 174px;
height: 150px;
margin: 0 0 0 1px;
text-indent: -5000px;
}

#tapchallenge a:hover{
background-position: bottom
}

 /* =------------------------------------------------------------------------

#footer links

----------*/

#footer .webbler {float: right; margin: 10px 0 0 0}
#footer .links li {float: left; margin: 10px 0 0 0;color: #717073;  padding: 0 1em; background: url(../images/footer_div.png) center right no-repeat}
#footer .links li a {color: #717073}
#footer .links li:last-child {background: none}
#footer .links li a:hover, #footer .webbler li a:hover {color: #0070B4}

 /* =------------------------------------------------------------------------

#sitemap

----------*/

#sitemap .trunktitle {display: none} 
#sitemap .branchmapitem {display: block; margin: 1em 0 0 0}
#sitemap .branchmapitem a { font-weight: bold; padding: 0 0 5px 0; margin: 15px 0 5px 0; font-size: 1.2em; }
#sitemap .branchmapitem a:hover {text-decoration: underline}
#sitemap .branchmap ul, #sitemap .branchmap ul li {list-style: none; margin: 0; padding: 0}

 /* =------------------------------------------------------------------------

homepage

----------*/

#page_image {
float: right;
margin: 10px 0 0 0
}

#page_flash {
margin: 20px 0 0 0
}

#latestnews h2 {
background: url(../images/home_tapnews_hd.png) top left no-repeat;
display: block;
width: 146px;
height: 34px;
text-indent: -2000px;
margin: 10px 0 0 14px}

#latestnews .item {
display: block;
margin: 10px 14px
}

#latestnews h3 {
font-size: 1.4em;
margin: 0;
padding: 0;
text-transform: uppercase;
font-weight: bold;
line-height: 1.2em
}

#latestnews p {
color: #0070B4;
font-size: 1.2em;
padding:0;
margin: 0
}

#latestnews a {
color: #6CCFF6
}

#latestnews a:hover {
color: #0070B4;
}

/* sign up */
#form input {
background: transparent url(../images/signup_bk.png) top left no-repeat;
width: 251px;
height: 22px;
border: 0 !important;
text-indent: 5px;
margin: 0 6px 0 0;
padding: 0;
float: left
}

#form .formsubmit {
background: transparent url(../images/signup_submit.png) top left no-repeat;
width: 62px;
height: 22px;
border: 0 !important;
text-indent: -2000px;
margin: 0;
padding: 0;
float: left;
cursor: pointer
}

/* signup button */
#signup_button {display: block; background: #fff}
#signup_button a { background: url(../images/signup_button.png) top left no-repeat;
display: block; width: 174px; height: 82px; text-indent: -2000px}
#signup_button a:hover {background-position: bottom}

/* shop */
table.dotted .price {color: #036FAF; font-size: 3em}
table.dotted .price a {font-size: 0.5em !important}
table.dotted {border-bottom: 2px dotted #C3C3C3;margin: 0.5em 0; padding: 0.5em 0}
#basket {background: url(../images/basket_bk.png) top left no-repeat;
width: 174px; height: 90px; padding: 0; margin: 0 0 0 1px}
#basket b {font-size: 16px; margin: 38px 0 0 15px; float: left; width: 174px; font-weight: normal}
#basket b a {color: #fff}
#basket b a:hover {text-decoration: underline}
#basket .total {color: #fff; font-size: 16px; font-weight: bold; margin: 0 0 0 15px}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  

 /*printer styles*/ 
 @media print{ 
/*hide the left column when printing*/ 
#leftcol{display:none;} 

/*hide the right column when printing*/ 
#rightcol{display:none;} 
#twocols, #mainContent{width:100%; float:none;}
}