/* BASE */

body {
    background:#302f2a;
	color:#E0DFDF;
	font-family: Helvetica, Arial, Verdana, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	color:#E0DFDF;
	text-transform:uppercase;
	font-family: Helvetica, Arial, Verdana, sans-serif;
}

a:link, a:visited {
    color:#E0DFDF;
	text-decoration:none;
}

a:hover, a:active {
    color:#E0DFDF;
	text-decoration:underline;
}

input:focus, textarea:focus {
	background:#FFFCDD;
}

input.submit:focus {
	background:#8d3d32;
}

textarea {
	font-family: Helvetica, Arial, Verdana, sans-serif;
}

a.block {
	background:#7A352B;
	color:#fff;
	text-transform:uppercase;
	padding:0.3em;
	padding-bottom:0;
}

input, textarea, select {
	background:#E0DFDF;
}

input:focus, textarea:focus, select:focus {
	background:#fff;
}


/* LAYOUT */

#wrapper {
	margin:20px auto 0 auto;
	width:950px;
	/*height:500px;*/
}

#upperNavigation ul#buttonNav {
	height:47px;
	margin-bottom:1em;
}
	#upperNavigation ul#buttonNav li {
		float:right;
	}
		
		#upperNavigation ul#buttonNav li a { display:block; width:99px; height:47px; background:transparent url("/images/top-buttons.gif") top left no-repeat; margin-left:1em; }
		
			#upperNavigation ul#buttonNav li#winFreeBoard a:link,
			#upperNavigation ul#buttonNav li#winFreeBoard a:visited { background-position:0 -47px; }
			
			#upperNavigation ul#buttonNav li#winFreeBoard a:hover,
			#upperNavigation ul#buttonNav li#winFreeBoard a:active { background-position:0 0; }
		
		
			#upperNavigation ul#buttonNav li#signupNewsletter a:link,
			#upperNavigation ul#buttonNav li#signupNewsletter a:visited { background-position:-102px -47px; }

			#upperNavigation ul#buttonNav li#signupNewsletter a:hover,
			#upperNavigation ul#buttonNav li#signupNewsletter a:active { background-position:-102px 0; }
			
		#upperNavigation ul#buttonNav li a span { display:none; }


#upperNavigation ul#subNav {
	height:20px;
}
	#upperNavigation ul#subNav li {
		float:right;
		margin-left:1em;
		text-transform:uppercase;
		font-size:0.75em;
		padding:0 3em;
		background:transparent url("/images/divider.gif") right 1px no-repeat;
	}

	#upperNavigation ul#subNav li.last {
		background:none;
		padding-right:1em;
	}

		#upperNavigation ul#subNav li a {
			text-decoration:none;
			padding-top:10px;
			color:#e0dfdf;
		}
	
			#upperNavigation ul#subNav li a:link, #upperNavigation ul#subNav li a:visited { }
			#upperNavigation ul#subNav li a:hover, #upperNavigation ul#subNav li a:active {
				background:transparent url("/images/active-icon.gif") top left no-repeat;
				color:#e0dfdf;
			}
			
#contentBorder {
	border:3px solid #fff;
	min-height:584px;
	height:auto !important;
	height:584px;
	background:#000;
}

	#content {
		text-align:left;
		margin-left:125px;
	}

#footer {
	text-align:left;
	font-size:0.91667em;
	margin-top:1em;
	padding-bottom:1em;
	color:#999;
}
	
	#footer a:link, #footer a:visited { color:#999; }
	#footer a:hover, #footer a:active { color:#E0DFDF; text-decoration:none; }
	
	#footer #wovenByFabrik { float:right; position:relative; top:5px; }
	#footer #artcompanyPlug { position:relative; top:5px; }
	
#navigation {
	height:119px;
	background:transparent url("/images/artcosurf-logo-sm.gif") top left no-repeat;
}
	
	#navigation #logoLink {
		float:left;
		display:block;
		width:100px;
		height:99px;
	}
		#navigation #logoLink span {
			display:none;
		}
	
	#navigation ul {
		margin-left:130px;
	}
	
		#navigation ul li {
			float:left;
			text-transform:uppercase;
			font-size:0.75em;
			padding:0 3.6em;
			margin-top:45px;
			background:transparent url("/images/divider.gif") left 1px no-repeat;
			position: relative;
		}
			
			#navigation li a {
				text-decoration:none;
				padding-top:10px;
				color:#e0dfdf;
			}
				
				#navigation li a:link, #navigation li a:visited {  }
				#navigation li a:hover, #navigation li a:active {
					background:transparent url("/images/active-icon.gif") top left no-repeat;
					color:#e0dfdf;
				}
				
				/* SUB NAV */
				#navigation li ul {
					display: none;
					position: absolute; 
					top: 0;
					left: 0;
					margin-left:-9px;
				}
					
					#navigation li ul li {
						float:none;
						margin:1.5em 0;
						padding:0;
						background:none;
						text-align:left;
						font-size:1em;
						width:200px;
						
					}
					
					#navigation li ul li a {
						padding-left:9px;
					}
					
					#navigation li li a:link, #navigation li li a:visited {  }
					#navigation li li a:hover, #navigation li li a:active {
						background:transparent url("/images/arrow-right.gif") left 11px no-repeat;
						
					}
					
				#navigation li > ul {
					top: auto;
					left: auto;
				}
				
				#navigation li:hover ul, #navigation li.over ul{ display: block; }
				
				
				/* PAGES */
				#page-static.action-home #navigation li#navigationHome a:link,
				#page-static.action-home #navigation li#navigationHome a:visited,
				#page-static.action-index #navigation li#navigationAbout a:link,
				#page-static.action-index #navigation li#navigationAbout a:visited,
				#page-store.men #navigation li#navigationMens a:link,
				#page-store.men #navigation li#navigationMens a:visited,
				#page-store.women #navigation li#navigationWomens a:link,
				#page-store.women #navigation li#navigationWomens a:visited,
				#page-store.boards #navigation li#navigationBoards a:link,
				#page-store.boards #navigation li#navigationBoards a:visited,
				#page-press_releases #navigation li#navigationNews a:link,
				#page-press_releases #navigation li#navigationNews a:visited,
				#page-static.action-contact #navigation li#navigationContactUs a:link,
				#page-static.action-contact #navigation li#navigationContactUs a:visited {
					background:transparent url("/images/active-icon.gif") top left no-repeat;
					cursor:default;
				}
					
					#page-static.action-contact #navigation li a a { cursor:pointer !important; }
				
				#page-store.boards #navigation li#navigationBoards li a:link,
				#page-store.boards #navigation li#navigationBoards li a:visited {
					background:none;
				}
				
				#page-store.boards #navigation li#navigationBoards li a:hover,
				#page-store.boards #navigation li#navigationBoards li a:active {
					background:transparent url("/images/arrow-right.gif") left 11px no-repeat;
				}
				
				
				#page-press_releases #navigation li#navigationNews li a:link,
				#page-press_releases #navigation li#navigationNews li a:visited {
					background:none;
				}
				
				#page-press_releases #navigation li#navigationNews li a:hover,
				#page-press_releases #navigation li#navigationNews li a:active {
					background:transparent url("/images/arrow-right.gif") left 11px no-repeat;
				}
				

#leftNavigation {
	float:left;
	width:125px;
}

/* ELEMENTS */

.submit {
	color:#fff;
	background:#7a352b;
	padding:0.2em 0.3em;
	text-transform:uppercase;
	font-weight:bold;
	margin-left:1em;
}
	
	input.active {
		background:#7a352b url("/images/spinner-red.gif") 2px center no-repeat;
		padding-left:18px;
	}

.print-icon {
	display:block;
	width:13px;
	height:12px;
	cursor:pointer;
	background:transparent url("/images/print-icon.gif") top left no-repeat;
}

span.required {
	color:#933;
}

.detail-icon {
	display:block;
	width:55px;
	height:20px;
	background:transparent url("/images/detail.png") top left no-repeat;
}

	.detail-icon:hover {
		background:transparent url("/images/detail-over.png") top left no-repeat;
	}

.zoom-icon {
	display:block;
	width:55px;
	height:20px;
	background:transparent url("/images/zoom.gif") top left no-repeat;
}

	.zoom-icon:hover {
		background:transparent url("/images/zoom-over.gif") top left no-repeat;
	}

/* DEFAULT BACKGROUND */
#contentBorder { background:#000 url("/images/background-generic.jpg") left top no-repeat; }


/* CUSTOM PAGE BACKGROUNDS */
#page-static.action-home #contentBorder { background-image:url("/images/background-home.jpg"); }
#page-store.men #contentBorder { background:#868686 url("/images/background-men.jpg") top left no-repeat; }
#page-store.women #contentBorder { background:#8d8d8d url("/images/background-women.jpg") top left no-repeat; }
#page-store.boards #contentBorder { background-image:url("/images/background-surfboards.jpg"); }
#page-store.skateboards #contentBorder { background-image:url("/images/background-skateboards.jpg"); }
#page-store.action-checkout #contentBorder { background-image:url("/images/background-checkout.jpg"); background-color:#979797; }
#page-static.action-index #contentBorder { background-image:url("/images/background-about.jpg"); }
#page-static.action-contact #contentBorder { background-image:url("/images/background-contact-us.jpg"); }
#page-news_articles #contentBorder,
#page-events #contentBorder,
#page-press_releases #contentBorder {
	background-image:url("/images/background-press-releases.jpg");
}


/* FLASH */

.errorExplanation h2,
#errorExplanation h2,
#flash {
	background:transparent url("/images/background-red.png") repeat;
	padding:0.1em 1em;
	margin:0 3em 2em 0;
}

	#flash p {
		margin:0.5em 0;
	}
	
	#flashCloseButton {
		float:right;
		position:relative;
		top:0.6em;
		left:-0.3em;
	}

/* FLASH PHOTO INTRO */
#page-static.action-flash_intro #wrapper {
	margin-top:99px;
}

html { height:auto; }

/* ERRORS */
#errorExplanation h2 {
	text-transform:none;
	padding:0.7em;
	margin:1em 0;
}

/* HOME PAGE */
#page-static.action-home #homePromo {
	position:relative;
	top:265px;
	left:201px;
}


/* PRODUCT PREVIEW */

#preview {
	position:absolute;
	background:transparent url("/images/background-grey.png") top left repeat;
	display:none;
	border:2px solid #53524e;
}

	#preview span {
		display:block;
		float:left;
		background:transparent url("/images/artcosurf-logo-tiny.gif") top left no-repeat;
		width:49px;
		height:48px;
		position:absolute;
		z-index:10;
	}

	#preview img {
		
	}

#noProductsFound {
	text-align:center;
	margin-top:10em;
}



/* STORE PAGE */

#page-store #panelsWrapper {
	overflow:hidden;
	width:750px;
	height:420px;
	margin-right:50px;
}

#page-store #content {
	margin-top:10px;
}

#page-store #panels {
	width:15000px;
}

#page-store .panel {
	float:left;
	position:relative;
	width:820px;
}

	#page-store .panel .product-item {
		float:left;
		width:127px;
		height:210px;
		/*overflow:hidden;*/
	}
		
		#page-store .panel .product-item .product-image {
			height:145px;
			position:relative;
		}
			#page-store .panel .product-item .product-image a {
				position:absolute;
				bottom:5px;
			}
			
		#page-store .panel .product-item .product-description {
			position:relative;
			left:20px;
			font-size:0.75em;
			line-height:1.3em;
			margin:0;
		}
		
		#page-store.boards .panel .product-item .product-description,
		#page-store.skateboards .panel .product-item .product-description {
			left:0 !important;
		}

	
		#page-store .panel .product-item a {
			text-decoration:none;
		}
			#page-store .panel .product-item a.block {
				line-height:2em;
			}
	
		#page-store .panel .product-item .money {
			color:#fff;
			font-weight:bold;
		}


.product-description {
	font-size:0.9166em;
	margin:2em 1em 0 0;
	color:#ccc;
}
	.product-description p { margin-top:0.3em; }

.specification-title {
	text-transform:uppercase;
	/*background:transparent url("/images/arrow-side.gif") left 2px no-repeat;
		padding-left:7px;*/
}

#page-store #previousNextButtons {
	margin-right:2em;
}
	#page-store #previousNextButtons .previous { float:left; }
	
	#page-store #previousNextButtons .next { float:right; }

	#page-store #previousNextButtons a {
		margin:0 2em 0 0;
	}
		#page-store #previousNextButtons a:link, #page-store #previousNextButtons a:visited { text-decoration:none; }
		#page-store #previousNextButtons a:hover, #page-store #previousNextButtons a:active { text-decoration:underline;}


#page-store #detailProduct {
	float:right;
	position:relative;
	top:2.5em;
	right:2em;
}

#page-store #backToListing {
	margin-top:5em;
	background:transparent url("/images/arrow-left.gif") left 2px no-repeat;
	padding-left:9px;
}

/* PRODUCT PAGE */

#page-store h1 {
	text-transform:uppercase;
}

#page-store .price {
	color:#fff;
	font-size:1.1667em;
	margin:0.2em 0 1em 0;
	font-weight:bold;
}

#page-store #left {
	width:400px;
	float:left;
}

#page-store #right {
	margin:0 50px 0 400px;
	padding-top:2.5em;
}

#page-store #productPreviewContainer {
	width:330px;
}

#page-store #productPreview {
	width:230px;
	height:400px;
	overflow:hidden;
	margin:0 50px;
}
	
	/* Firefox 2 Hack */
	#page-store #productPreview, x:-moz-any-link { margin-left:0; }

	#page-store #productPreview ul {
		width:15000px;
		position:relative;
		left:800px;
	}
		#page-store #productPreview ul li {
			width:230px;
			height:400px;
			text-align:center;
			float:left;
		}
	
#previousArrow,
#nextArrow {
	width:50px;
	height:400px;
	background:transparent url("/images/arrows.png") center center no-repeat;
}
	#previousArrow span,
	#nextArrow span {
		display:none;
	}



#previousArrow {
	float:left;
}
	
	#previousArrow:link,
	#previousArrow:active { background-position:-100px center; }

	#previousArrow:hover,
	#previousArrow:visited { background-position:-150px center; }
	
	#previousArrow.disabled:link,
	#previousArrow.disabled:active,
	#previousArrow.disabled:hover,
	#previousArrow.disabled:visited { background-position:-250px center; cursor:default; }
	
#nextArrow {
	float:right;
}

	#nextArrow:link,
	#nextArrow:active { background-position:0px center; }

	#nextArrow:hover,
	#nextArrow:visited { background-position:-50px center; }
	
	#nextArrow.disabled:link,
	#nextArrow.disabled:active,
	#nextArrow.disabled:hover,
	#nextArrow.disabled:visited { background-position:-200px center; cursor:default; }
	
	
	
	
#page-store #sizeSelector {
	padding-top:1em;
}

	#page-store #sizeSelector select {
		width:200px;
	}
	
	#page-store #sizeSelector a {
		color:#7a352b;
		text-decoration:none;
		font-size:0.916em;
		position:relative;
		top:3px;
	}

#page-store ul#thumbnails {
	height:38px;
}

	#page-store #thumbnails li a {
		float:left;
		width:35px;
		height:35px;
		background:#fff;
		border:1px solid #333;
		text-align:center;
		cursor:pointer;
	}
		#page-store #thumbnails li a.active {
			background:#ccc;
		}

/* CUSTOMERS PAGE */

#page-customers .form-list label {
	width:60px;
	
}

#page-customers ul.form-list {
	margin-top:1em;
}

#page-customers .form-list input {
	padding:0.2em;
}

#page-customers #content {
	text-align:center;
	margin-top:8em;
}

#page-customers ul#customersSidebar {
	margin-right:1em;
}

	#page-customers #customersSidebar li {
		float:right;
		padding:0.5em;
		color:#666;
	}

#page-customers .center-inner {
	width:300px;
}

#page-customers h1 {
	text-align:center;
}

#page-customers #lostPassword {
	float:left;
	margin:1.5em 2em 1.5em 3em;
}

#page-customers .submit {
	float:right;
	margin-right:4em;
}



.red-button {
	color:#fff;
	background:#7a352b url("/images/arrow-white.gif") 5px center no-repeat;
	padding:0.2em 0.3em 0.1em 14px;
	text-transform:uppercase;
	font-weight:bold;
	font-size:0.91667em;
	margin-left:1em;
}
	a.red-button { color:#fff; }
	a.red-button:hover {
		text-decoration:none;
	}

a.grey-button, .grey-button {
	color:#302F2A;
	background:#ccc url("/images/arrow.gif") 5px center no-repeat;
	padding:0.2em 0.3em 0.1em 14px;
	text-transform:uppercase;
	font-weight:bold;
	font-size:0.91667em;
	margin-left:1em;
}
	a.grey-button:hover {
		text-decoration:none;
	}
	
	a.grey-button.active {
		background:#ccc url("/images/spinner-grey.gif") 2px center no-repeat;
		padding-left:21px;
	}
	

/* ACCORDIAN */

.accordian-box li {
	margin-bottom:10px;
}

	.accordian-box .header {
		background:transparent url("/images/background-grey.png") repeat;
		color:#ccc;
		padding:1em;
		
	}
	
		.accordian-box .header h2 {
			color:#cccccc;
			background:transparent url("/images/arrow-accordian.gif") 10px center no-repeat;
			padding-left:2.7em;
			text-transform:none;
			font-family:Arial, Helvetica, sans-serif;
			font-weight:bold;
			cursor:pointer;
		}
		
		.accordian-box .header a {
			color:#fff;
		}
		
		.accordian-box li.active .header h2 {
			background:transparent url("/images/arrow-accordian-open.gif") 10px center no-repeat;
		}
	
	.accordian-box .actions {
		float:right;
		text-transform:uppercase;
		font-size:0.833em;
		margin:0.3em 0.5em 0 0;
	}
	
	.accordian-box .body {
		margin:0.5em 0 0 1.6em;
	}



/* ACCORDIAN ERROR */

.accordian-box li.error .header {
	background:transparent url("/images/background-red.png") repeat;
}
	
	.accordian-box li.error .header h2 {
		background:transparent url("/images/accordian-alert.gif") 10px center no-repeat;
	}
	
	.accordian-box li.error .header a {
		color:#ccc;
	}


/* CART TABLE */

table.cart {
	width:100%;
}
	table.cart th {
		text-transform:uppercase;
		font-weight:normal;
		font-size:0.91667em;
		color:#ccc;
	}
	
	table.cart td {
		/*padding:1em 0;*/
	}

/* PRIVACY POLICY */
#page-static.action-privacy-policy ol li {
	margin-left:2em;
}

#page-static.action-privacy-policy #content ul li {
	list-style-type:disc;
}

	#page-static.action-privacy-policy #content li {
		margin-top:0.5em;
		margin-bottom:0.5em;
	}

#page-static.action-privacy-policy p {
	margin:0.5em 0 1.5em 0;
}

#page-static.action-privacy-policy h5 {
	margin-top:2.5em;
}

/* BOARD GIVEAWAY and NEWSLETTER */
#page-static.action-board-giveaway h1,
#page-static.action-newsletter h1 {
	margin-bottom:0.5em;
}

#page-static.action-board-giveaway td,
#page-static.action-newsletter td {
	padding:0.5em 0.5em 0.5em 0;
}

#page-static.action-board-giveaway input,
#page-static.action-newsletter input {
	padding:0.3em;
}

#page-static.action-board-giveaway .red,
#page-static.action-newsletter .red {
	color:#933;
}


/* NEW WHOLESALE ACCOUNT */
#page-wholesale_users {
	
}

	#page-wholesale_users #left {
		width:390px;
		float:left;
	}

	#page-wholesale_users #right {
		margin:0 50px 0 400px;
	}
	
		#page-wholesale_users #right .form-list {
			padding-top:15px;
		}
	
	#page-wholesale_users .form-list li {
		width:170px;
		padding:8px 4px;
	}
		#page-wholesale_users .form-list label {
			text-align:left;
			float:none;
			font-size:0.91667em;
		}
		
			#page-wholesale_users .form-list li span {
				padding:0;
			}
		
		#page-wholesale_users .form-list li input,
		#page-wholesale_users .form-list li textarea {
			width:170px;
			padding:0.1em;
		}
	
	#page-wholesale_users .form-list li.full-line {
		width:350px;
		clear:none;
	}
	
		#page-wholesale_users .form-list li.full-line input,
		#page-wholesale_users .form-list li.full-line textarea {
			width:350px;
		}
		
		#page-wholesale_users .form-list li.full-line textarea {
			height:80px;
		}
		
	#page-wholesale_users #city,
	#page-wholesale_users #city input,
	#page-wholesale_users #state,
	#page-wholesale_users #state select,
	#page-wholesale_users #zip,
	#page-wholesale_users #zip input {
		width:110px;
	}