/* 

Theme Name: New Surf Theme
Description: H20 Republic Surf Theme
Version: 1.0
Author: Marites Quitoriano (marites@orangefix.net)

*/



/* Remove all margin and paddings */

* {
   margin: 0;
   padding: 0;

}


 
html {
	height: 100%;
	margin-bottom: 10px;
}

body {
	height: 100%; 
	background: #000 url(images/paper_tile.jpg) top left repeat-x;
	font-family: "Trebuchet MS","Tahoma",sans-serif;
	font-size: 73%;
	line-height: 1.3em;
	color: #fff;
  	
}

/* Remove all border for images */

a img, img {
	border: none; 
	display: block; 
}



/* Hides Text */
.hidetext {
	display: none;
}

/* links */
a, a:link, a:visited {
	font-size: 100%;
	color: #FFF;
	text-decoration: none;
}


a:hover {
	font-size: 100%;
	color: #C3D937;
	text-decoration: none;
	height: auto;
	width: auto;
}


h1 {
font-size: 1.5em;
}

h2 {
font-size: 1.4em;
}

h3 {
font-size: 1.3em;
}


h4 {
font-size: 1.2em;
}

h5 {
font-size: 1.1em;
}

#accessibility {
	display: none;
}


#bwrapper {
  margin: 0 auto;
  width: 990px;
   background: transparent url(images/bwrapper_bg.gif) left top no-repeat;
}

#swrapper {
  margin: 0 auto;
  width: 990px;
  background: transparent url(images/wrapper_bg.gif) center top no-repeat;
}


#wrapper
{
	width: 880px;
	margin: 0 auto;
  
}


#header {
	float: left;
	width: 864px;
        position: relative;
        left: 8px;
	height: 98px;
        

	
}

#logo {
	float: left;
	position: relative;
	top: 40px;
	left: 35px;
	        
}

#logo, #logo a {
	display: block;
	width: 286px;
	height: 51px;
	
}

#logo a {
  background: url(images/h2orepublic_logo.png) 0 0 no-repeat;
}

#login {
float: right;
position: relative;
right: 5px;
top: 35px;
width: 370px;
}

#login p {
float: left;
padding-right: 6px;
}

#login label {
font-weight: bold;
}

#login #user_login, #login #user_pass {
border: 1px solid #A5B2AD;
margin: 2px 0px;
}

#login #wp-submit {
position: relative;
top: 13px;
width: 85px;
height: 27px;
}

#login p.welcome {
font-weight: bold;
font-size: 1em;
}



/* ---- Start of Nav ---- */

#topnav {
float: left;
width: 864px;
position: relative;
left: 8px;
height: 36px; 
z-index: 90;
font-family: Arial, Helvetica, sans-serif;
background: #000;
}


#topnav ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
padding-left: 22px;
}



#nav a {
display: block;
float:left;
text-decoration: none;
width: auto;
font-weight: bold;
color: #C3D937;
background: #000;
height: 20px; 
padding: 10px 22px 6px 22px;
}

#nav a:hover {
color: #fff;
background: #1F1F1F;
}

#topnav li { 
display: block;
float:left;
text-align: center; 
position: relative;
font-size: 14px;
text-transform: uppercase;
background: #000;
}




#nav li li a{
display: block;
text-decoration: none;
font-weight: bold;
filter: alpha(opacity=90);
opacity: .90;
background-image: none;
text-transform: none;
width: 12em;
padding: 5px 0 5px 40px;
height: 14px;
color: #fff;
}



#nav li li a:hover {
filter: alpha(opacity=85);
opacity: .85;
background: #111 url(images/bullet.gif) 22px 8px no-repeat;
color: #C3D937;
}



#topnav li>ul {
top: auto;
left: auto;
}



#topnav li ul { 
display: none;
position: absolute;
top:100%; left: 0;
width: 12em;
margin: 0;
padding: 0;
}


#topnav li li {
text-decoration: none;
font-weight: bold;
color: #fff;
font-size: 12px;
font-family:Arial, Helvetica, sans-serif;
filter: alpha(opacity=85);
opacity: .85;
text-align: left;

}

#topnav li:hover ul, #topnav li.over ul { /* lists nested under hovered list items */
display: block;
}


#maincontent {
float: left;
width: 864px;
position: relative;
left: 8px;
right: 8px;
height: 290px;
background: #D7D070 url(images/main_bg.jpg) top center no-repeat;
}

#maincontent_inner {
float: left;
width: 864px;
padding: 0 8px;
padding-bottom: 30px;
background: url(images/swrapper2_bg.gif) top center repeat-x;
}

#leftcontent {
float: left;
width: 170px;
}


#sidenav {
float: left;
position: relative;
left: 12px;
top: 40px;
width: 158px;
padding-bottom: 13px;
background: url(images/sidenav_bot_bg.png) bottom left no-repeat;

}

#sidenav h3.title {
background: url(images/sidenav_top_bg.png) top left no-repeat;




















height: 30px;
}

#sidenav .PeSwitcher {
	display: none;
}

#sidenav ul{
padding: 0;
margin:0;
}

#sidenav li {
float: left;
list-style-type:none;
padding-left: 20px;
background: #000;
}

#sidenav a, #sidenav a:link, #sidenav  a:visited {
width: 118px;
text-decoration: none;
padding: 0 0 8px 20px;
text-transform: uppercase;
display: block;
color: #fff;
font-weight: normal;
font-size: 13px;
}

#sidenav  a.tabactive, #sidenav a:hover {
color: #C3D93C;
font-weight: normal;
background: url(images/bullet.gif) left 4px no-repeat;
}

#showproduct {
	float: left;
	position: relative;
	left: 6px;
	top: 59px;
	width: 158px;
}

#leftcontent #showproduct {
	float: left;
	position: relative;
	left: 10px;
	top: 59px;
	width: 158px;
        padding-bottom: 40px; 
}


#rightcontent {
float: left;
width: 694px;	
}


#rightcontent .mycart a {
position: relative;
left: 510px;
top: 12px;
width: 140px;
height: 26px;
display: block;
background: url(images/btn_mycart.gif) top left no-repeat;
}

#mainphoto {
float: left;
height: 284px;
width: 314px;
position: relative;
top:6px;
left: 195px;
}

#mainphoto img {
float: left;
display:none;
position:absolute; 
top:0; left:0; 
}

#content {
position: relative;
top: 20px;
left: 15px;
width: 663px;
padding-top: 11px;
float: left; 
color: #000;
background: #FFF url(images/content_bg.gif) top left no-repeat;
}



#contentshopping {
float: left; 
position: relative;
top: 25px;
left: 15px;
width: 663px;
background: #fff url(images/shopping_page.jpg) top left no-repeat;
color: #000;
}

#contentbottom {
clear: both;
width: 663px;
padding-bottom: 16px;
background:  url(images/content_bot_bg.jpg) bottom left no-repeat;
}

#content .post  {
padding: 0px 10px 10px 14px;
}

#contentshopping .post {
padding: 15px 10px 10px 20px;
}

#contentshopping a , #content a {
color: #000;
}


#contentshopping a:hover, #content a:hover {
color: #6B6B6B;
}

#content .entry p, #contentshopping .entry p {
padding-top: 8px;
}

#content .title, #contentshopping .title {
color: #000;
text-transform: uppercase;
}

#content .post img {
padding: 2px 2px;
}

#content .date {
font-size: .985em;
font-style: italic;
}

#content h2.title {
padding: 0 0 12px 14px;
}

#contentshopping h2.title {
padding-bottom: 0px;
}


#content .postmetadata, #content .navigation {
padding: 4px 0 20px 14px;
font-size: .975em;
}

#content .more a, .more a{
margin-top: 5px;
font-size: .975em;
text-decoration: underline;
}

.archive .thumb {
float: left;
padding-left: 14px;
padding-right: 5px;
width: 75px;
}

.archive .post {
float: left;
width: 540px;
margin-bottom: 10px;
}


#content ul, #content ol {
margin-left: 15px;
}


#subcontent {
float: left;
width: 864px;
position: relative;
left: 10px;
top: 3px;
padding-bottom: 8px;
background: #D7D070;
}

#news {
float: left;
width: 340px;
padding-bottom: 13px;
background: url(images/news_events_bot_bg.gif) bottom left no-repeat;
}

#news h2.title {
background: url(images/news_events_top_bg.gif) top left no-repeat;
height: 43px;
}

#news #articles {
float: left;
width: 339px;
background: #373737;
}

#news .thumb {
float: left;
position: relative;
top: 11px;
bottom: 5px;
left: 7px;
height: 60px;
width: 95px;
}


#news .thumb a img  {
width: 60px;
height: 60px;	
border-left: solid 4px #7E9A15;
padding-left: 4px;
}

#news .thumb  a:hover img {
border-left: solid 4px #fff;
}

#news .post {
float: left;
width: 235px;
height: 66px;
position: relative;
top: 13px;
}

#news .post a:hover {
color: #C3D937;
}

#featuredproducts {
float: left;
width: 519px;
position: relative;
left: 2px;
padding-bottom: 13px;
background: url(images/featured_products_bot_bg.gif) bottom left no-repeat;
}



#featurenav {
float: left;
background: #373737 url(images/featured_products_top_bg.gif) top left no-repeat;
width: 100%;
height: 56px; 
font-family: Arial, Helvetica, sans-serif;
}

#featurenav ul{
list-style-type: none;
float: right;
position: relative;
top: 5px;
right: 30px;
}

#featurenav li {
float: left;
padding: 0 2px;
width: 60px;
}

#featurenav a {
display: block;
text-decoration: none;
color: #fff;
text-transform: uppercase;

font-weight: bold;
text-align: bottom;
}


#nav_gear a {
height: 56px;
width: 45px;
background: url(images/nav_gear.png) top left no-repeat;	 
}

#nav_gear a:hover {
height: 56px;
width: 45px;
background: url(images/nav_gear_hover.png) top left no-repeat;	 
}


#nav_apparel a {
height: 56px;
width: 52px;
background: url(images/nav_apparel.png) top left no-repeat;	 
}

#nav_apparel a:hover {
height: 56px;
width: 52px;
background: url(images/nav_apparel_hover.png) top left no-repeat;	 
}


#nav_accessories a {
height: 56px;
width: 80px;
background: url(images/nav_accessories.png) top left no-repeat;	 
}

#nav_accessories a:hover {
height: 56px;
width: 80px;
background: url(images/nav_accessories_hover.png) top left no-repeat;	 
}


#scrolling_container {
overflow: hidden;
width: 100%;
background: #373737;
width: 499px;   
clear: both;  
padding: 0px 10px;  
}

#scrolling_wrapper {
width: 100%;
position: relative;
height: 185px;
overflow: hidden;
}

.scrolling_content {
height: 185px;
width:3200px;
position: absolute;
}

.feature {
overflow: hidden;
text-align: justify;
width: 499px;
height: 185px;
}


.feature img {
padding-right: 20px;
}

.feature h4 {
padding-top: 30px;
}

.feature p {
padding-top: 20px;
padding-right: 5px;
}




#feature_gear
{ 
left:0;top:0;
}

#feature_accessories {
left:998px;top:0;
}

#feature_apparel {
left:499px;top:0;
}

#footer { 
clear: both;
width: 880px;
margin: 0 auto;
height: 74px;
padding-top: 12px;
background: #D7D070 url(images/footer_top_bg.gif) top center  no-repeat;
}

#footernav {
height: 68px;
width: 100%;
padding-bottom: 18px;
background:  url(images/footer_bot_bg.gif) bottom center no-repeat;
}


#footernav ul {
list-style-type:none;
margin: 0;
padding:0;
padding-left: 9px;

}

#footernav li {
float:left;
padding: 14px 12px 14px 11px;
background: #000;
height: 40px;
}

#scart {
float: left;
position: relative;
top: 23px;
left: 10px;
width: 163px;
padding-top: 41px;
background:  url(images/cart_top_bg.gif) top left no-repeat;
}


#sideshoppingcart {
padding-bottom: 11px;
background: url(images/cart_bot_bg.gif) bottom left no-repeat;
}

#shoppingcartcontents {
background: #000;
}

.cart_title {
position: relative;
left: 4px;
}

#sliding_cart {
position: relative;
}

.wpsc_buy_button {
 width: 79px;
 height: 21px;
 border: none;
 
}

a.wpsc_emptycart_button, a:hover.wpsc_emptycart_button {
display: block;
width: 106px;
height: 28px;
border: none;
background: url(images/btn_emptycart.gif) top left no-repeat;
}

a.wpsc_checkout_button, a:hover.wpsc_checkout_button {
display: block;
width: 106px;
height: 28px;
border: none;
background: url(images/btn_checkout.gif) top left no-repeat;
}




.wpsc_product_price{
 margin: 0;
 padding: 0;
}



#wpsc_page_numbers {
float: left;
font-weight: bold;
width: 100%;
margin-bottom: 10px;
}

#wpsc_page_numbers ul{ 
padding: 0;
margin:0;
list-style-type:none;
}

#wpsc_page_numbers li {
float: left;
margin: 0 3px;
height: 20px;
}


#wpsc_page_numbers a {
background: #C3D937;
padding: 0 4px 0 4px;
text-align: center;
border: 1px solid #000;
text-decoration: none;
display: block;
}

#wpsc_page_numbers a:hover {
background: #fff;
}

#wpsc_page_numbers a.selected {
background: #fff;
}

#content table {
margin-top: 10px;
margin-bottom: 10px;
border-width: 1px 1px 1px 1px;
border-style: solid solid solid solid;
border-color: #C3D937;
border-collapse: collapse;
border-spacing: 2px;

}


#content table th {
background: #C3D937;
padding: 3px;
text-align: center;
}


#content table td {
padding: 2px;
} 

div .wpsc_product_search form {
position: relative;
top: 15px;
left: -8px;
margin-bottom: 10px;
}

.announce {
font-weight: bold;
color: #000;
font-size: 1.1em;
padding-left: 20px;
}