@charset "UTF-8";
/* CSS Document */

:focus {
	outline:none;
	}

body {
	margin:0;
	font-family: Helvetica, Arial, sans-serif;
	font-size:1em;
	line-height:1.3em;
	color:#000;
	background:url(../img/layout/background.gif) top left repeat;
	}


a img { border: none; }



/* ---------------------- common --------------------------- */


.alert
{
color:#f00;
}





.clear
{
clear:both;
}



.line
{
clear:both;
height:1px;
background:url(../img/layout/dottedLine.gif) left top repeat-x;
margin:8px 0 8px 0 !important;
}




#content h1, h2, h3
{
font-family: Helvetica, Arial, sans-serif;
font-weight:bold;
color:#000;
}


#content h1
{
font-size:2em;
line-height:.95em;
text-transform:lowercase;
}

#content h2
{
font-size:1.5em;
line-height:.95em;
}


#content h3
{
font-size:1.2em;
line-height:.95em;
}



#content p
{
font-size:.85em;
}
#content p a:link,
#content p a:visited
{
color:#000;
font-weight:bold;
text-decoration:none;
}

#content p a:hover
{
text-decoration:underline;
}











#content ul
{
margin:0 0 20px 0;
padding:0;
}


#content ul li
{
margin-left:14px;
padding:0;
font-size:.85em;
list-style:disc;
}

#content ul li a:link,
#content ul li a:visited
{
margin:0;
padding:0;
color:#000;
text-decoration:none;
font-weight:bold;
}

#content ul li a:hover
{
text-decoration:underline;
}

#content ul li span
{
font-size:.75em;
color:#31c9c9;
}


.breadcrumb
{
background:url(/img/layout/hula-hula-hula-girl-little.png) center left no-repeat;
padding-left:20px;
line-height:250%;
text-transform:lowercase;
}

.breadcrumb a
{
text-transform:lowercase;
}

.breadcrumbSpacer
{
margin:0 8px;
color:#31c9c9;
}



#content .productLists ul
{
margin:0 0 20px 0;
padding:0;
}


#content .productLists ul li
{
margin:0;
padding:0;
font-size:1.2em;
list-style:none;
}

#content .productLists ul li a:link,
#content .productLists ul li a:visited
{
margin:0;
padding:10px;
line-height:150%;
color:#000;
text-decoration:none;
font-weight:bold;
background:url(../img/layout/dottedLine.gif) left bottom repeat-x;
display:block;
text-transform:lowercase;
}

#content .productLists ul li a:hover
{
text-decoration:none;
background:url(../img/layout/background.gif) top left repeat;
}

#content .productLists ul li span
{
font-size:.75em;
color:#31c9c9;
}





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

a:hover
{
text-decoration:underline;
}

.primary
{
color:#000;
}




.niceLink a:link,
.niceLink a:visited
{
margin:0;
padding:10px;
line-height:150%;
color:#000;
font-weight:bold;
text-transform:lowercase;
}

.niceLink a:hover
{
text-decoration:none !important;
background:url(../img/layout/background.gif) top left repeat;
}











/* ---------------------- // common --------------------------- */







/* ---------------------- Wrapper --------------------------- */


#wrapperWrapper
{
margin:20px 0;
padding:0;
}

	
#wrapper 
{
width:940px;
margin:0 auto;
padding:8px 8px 1px 8px;
background:#fff;
}





/* ---------------------- // Wrapper --------------------------- */



/* ---------------------- Header --------------------------- */

#headerWrapper
{
margin:0;
padding:0;
position:relative;
z-index:10;
}
			
#header
{
width:940px;
height:110px;
margin:0 auto 8px auto;
padding:0;
position:relative;
background:url(../img/layout/dottedLine.gif) left bottom repeat-x;

}


#logo
{
width:173px;
height:66px;
position:absolute;
top:26px;
right:26px;
margin:0;
padding:0;
}



#headerBasket ul
{
padding:0;
margin:0;
position:absolute;
top:30px;
left:340px;
}

#headerBasket ul li
{
margin:0;
padding:0;
display:inline;
font-size:.8em;
font-weight:bold;
}

#headerBasket ul li a:link,
#headerBasket ul li a:visited
{
margin:0;
padding:10px;
line-height:250%;
color:#000;
text-decoration:none;
}

#headerBasket ul li a:hover
{
text-decoration:none;
background:url(../img/layout/background.gif) top left repeat;
}

#headerBasket ul li.current a:link,
#headerBasket ul li.current a:visited
{
background:url(../img/layout/background.gif) top left repeat;
}








#headerNav
{
position:absolute;
bottom:0;
left:0;
}



.navigation ul
{
margin:0;
padding:0;
}

.navigation ul li
{
margin:0;
padding:0;
display:inline;
}

.navigation ul li a:link,
.navigation ul li a:visited
{
font-size:.8em;
margin:0;
padding:8px;
line-height:260%;
color:#000;
text-decoration:none;
font-weight:bold;
text-transform:lowercase;
}

.navigation ul li a:hover, .navigation ul li a.hover
{
text-decoration:none;
background:url(../img/layout/background2.gif) top left repeat;
}


.navigation ul li.current a:link,
.navigation ul li.current a:visited
{
background:url(../img/layout/background.gif) top left repeat;
}


.navigation ul.nav_submenu
{
	display:none;
	position:absolute;
	background:url(../img/layout/background2.gif) top left repeat;
	top:25px;
	left:0;
	width:440px;
	padding:0 0 5px;
	z-index:10000;
	border:1px dotted #98E4E4;
	border-top:1px solid #fff;
}

.navigation ul.nav_submenu li
{
	float:left;
}

.navigation ul.nav_submenu li a:link,
.navigation ul.nav_submenu li a:visited{
	width:210px;
	padding:8px;
	color:#000000;
	border:0;
	font-weight:bold;
	line-height:26px;
	background:none;
}
.navigation ul.nav_submenu li a:hover{
	color:#000000;
	background:#fff;
}

.navigation ul.nav_submenu ul {
	padding: 0 5px;
}
.navigation ul.nav_submenu ul li {
	display: block;
	float: none;
}
.navigation ul.nav_submenu ul li a:link,.navigation ul.nav_submenu ul li a:visited {
	font-weight: normal;
    	line-height: 18px;
    	padding: 4px 8px;
}


/* ---------------------- // Header --------------------------- */








/* ---------------------- Content --------------------------- */



#contentWrapper
{
margin:0;
padding:0;
position:relative;
z-index:1;
}


#content
{
width:940px;
margin:0 auto;
padding:0;
}





.imageLeft
{
float:left;
margin:0 16px 0 0;
}

.imageRight
{
float:right;
margin:0 0 0 16px;
}



.marginRight
{
margin:0 8px 0 0;
}




.productBox
{
background:url(../img/layout/dottedLine.gif) bottom left repeat-x;
padding:0 0 1px 0;
}








.thumb,
.thumbRight
{
float:left;
margin:0 8px 8px 0 !important;
}

.thumbRight
{
float:left;
margin:0 0 8px 0 !important;
}









.image_cycle
{
background:#fff !important;
}









/* ---------------------- // Content --------------------------- */









/* ---------------------- Columns --------------------------- */




.oneCol
{
width:150px;
margin:0 8px 8px 0;
float:left;
position:relative;
}

.twoCol
{
width:308px;
margin:0 8px 8px 0;
float:left;
position:relative;
}

.twoColRight
{
width:308px;
margin:0 0 8px 0;
float:right;
position:relative;
}

.threeCol
{
width:466px;
margin:0 8px 8px 0;
float:left;
position:relative;
}

.threeColRight
{
width:466px;
margin:0 0 8px 0;
float:right;
position:relative;
}

.fourCol
{
width:624px;
margin:0 8px 8px 0;
float:left;
position:relative;
}

.fourColRight
{
width:624px;
margin:0 0 8px 0;
float:right;
position:relative;
}

.fiveCol
{
width:782px;
margin:0 8px 8px 0;
float:left;
position:relative;
}

.sixCol
{
width:940px;
margin:0 0 8px 0;
float:left;
position:relative;
}


.titleOverlay
{
position:absolute;
top:0;
left:0;
z-index:10;
}








/* --------------------- // Columns -------------------------- */















/* ---------------------- Panels --------------------------- */




#boards
{
position:absolute;
top:0;
left:0;
z-index:20;
width:308px;
height:435px;
background:url(../img/panels/boards/boards.png) no-repeat 0 0;
}

#boards:hover
{ 
background:#31c9c9 url(../img/panels/boards/boards.png) no-repeat 0 0;
}







#customBoards
{
position:absolute;
top:0;
left:0;
z-index:20;
width:308px;
height:320px;
background:url(../img/panels/customBoards/custom-boards.png) no-repeat 0 0;
}

#customBoards:hover
{ 
background:#000 url(../img/panels/customBoards/custom-boards.png) no-repeat 0 0;
}








#clothing
{
position:absolute;
top:0;
left:0;
z-index:20;
width:308px;
height:320px;
background:url(../img/panels/clothing/clothing.png) no-repeat 0 0;
}

#clothing:hover
{ 
background:#000 url(../img/panels/clothing/clothing.png) no-repeat 0 0;
}






#blackPanel
{
background:#000 url(../img/layout/customPanelBack.gif) bottom left no-repeat;
margin:0;
padding:18px 18px 6px 18px;
color:#fff !important;
}



#blackPanel  h2
{
color:#fff;
margin:0;
padding:0;
line-height:115%;
}

#blackPanel a:link,
#blackPanel a:visited
{
color:#fff !important;
text-decoration:none;
}

#blackPanel a:hover
{
text-decoration:underline;
}





#otherStuff
{
position:absolute;
top:0;
left:0;
z-index:20;
width:308px;
height:320px;
background:url(../img/panels/otherStuff/other-stuff.png) no-repeat 0 0;
}

#otherStuff:hover
{ 
background:#000 url(../img/panels/otherStuff/other-stuff.png) no-repeat 0 0;
}








#socialPanels
{
margin:0;
padding:0;
position:relative;
}

#socialPanels p
{
color:#fff;
font-weight:bold;
font-size:.9em;
}


.small
{
color:#000;
font-weight:bold;
font-size:.6em;
}


#weStockPanel
{
background:#000;
width:292px;
height:87px;
margin:0 8px 8px 0;
padding:0 0 0 16px;
float:left;
position:relative;
}


.weStockBrands
{
position:absolute;
left:150px;
top:0;
}




.hulaGirl
{
position:absolute;
top:-5px;
right:25px;
z-index:20;
}
















#twitterPanel
{
background:#31c9c9 url(../img/layout/twitterPanelBack.gif) center center;
width:453px;
height:79px;
margin:0 0 8px 0;
padding:0 155px 8px 16px;
float:right;
position:relative;
}



#twitterPanel ul
{
color:#000;
font-weight:bold;
text-decoration:none;
margin:14px 0 0 0;
padding:0
}

#twitterPanel ul li
{
font-size:1em;
list-style-type:none;
margin:0;
padding:0;
color:#000;
}

#twitterPanel ul li a:link,
#twitterPanel ul li a:visited
{
color:#fff;
text-decoration:none;
}

#twitterPanel ul li a:hover
{
color:#000;
}


.twitterStatus
{
color:#000;
}

.twitterTime
{
color:#000;
font-size:.65em;
}












#facebookPanel
{
background:#00539e;
width:276px;
height:79px;
margin:0 8px 8px 0;
padding:0 16px 8px 16px;
float:left;
position:relative;
}
    

    
#flickrPanel
{
background:#000;
width:608px;
height:87px;
margin:0 0 8px 0;
padding:0 8px;
float:right;
position:relative;
}



/* --------------------- // Panels -------------------------- */

















/* ---------------------- Forms --------------------------- */




/* site search form */


#siteSearch
{
padding:0;
margin:0;
position:absolute;
top:30px;
left:0;
}

form.search
{
margin:0;
padding:0;
}


form.search input, 
form.search select, 
form.search textarea
{
margin:0 8px 0 0;
padding:5px 5px;
color:#fff;
font-size:.9em;
display:block;
width:260px;
background:#000;
border:none;
float:left;

}




form.search input#submit
{
padding:4px 0;
margin:0;
width:30px;
background:#000;
font-weight:bold;
color:#fff;
border:none;
float:left;
}


/* buying options form */


.productOptions
{
text-transform:lowercase;
}

.columnTitles
{
font-weight:bold;
}

form#productOptionsForm
{
margin:0;
padding:0;
}

.buyingOptionBlock
{
margin-right:16px;
float:left;
}


form#productOptionsForm label
{
display:block;
font-weight:bold;
margin:0;
padding:0;
font-size:.85em;
}


form#productOptionsForm input, 
form#productOptionsForm select, 
form#productOptionsForm textarea
{
margin:0 8px 0 0;
padding:5px 5px;
color:#000;
font-size:.8em;
display:block;
background:#fff;
border:solid 1px #98e4e4;
float:left;
}




form#productOptionsForm input.addToBasketButton
{
padding:0;
margin:16px 0 0 0;
border:none;
}













/* contact form */


#contactForm,
#alertForm
{
padding:8px 8px 8px 8px;
background:#000;
color:#fff;
}

form.normal
{
margin:0;
padding:0;
}

form.normal label
{
display:block;
font-weight:bold;
margin:0;
padding:0;
font-size:.85em;
color:#fff;
}


form.normal input, 
form.normal select, 
form.normal textarea
{
margin:5px 0 10px 0;
padding:5px 5px;
color:#000;
font-size:.85em;
display:block;
border:none;
background:#fff;
width:282px;
}


form#contactForm input#submit
{
padding:0;
margin:16px 0 0 0;
border:none;
width:292px;
height:90px;
cursor:pointer;
background:url('/img/layout/submitTheForm.gif') no-repeat;
}






/* --------------------- // Forms -------------------------- */








/* ---------------------- Shopping Basket --------------------------- */


table.shoppingBasket
{
color:#000;
border-collapse:collapse;
background:#f6f6f6;
margin:0 0 8px 0;
}

table.shoppingBasket th,
table.shoppingBasket td
{
border:1px solid #fff;
vertical-align:top;
font-size:.9em;
}

table.shoppingBasket td.bordercorner
{
border-left:0;
border-bottom:0;
background:#fff;
}



table.shoppingBasket .titles th,
table.shoppingBasket .titles td
{
background:#000;

color:#fff;
font-weight:bold;
text-align:left;
}


table.shoppingBasket tr.even
{
background:#f0f0f0;
}

table.shoppingBasket img
{
border:solid 1px #fff;
float:left;
margin-right:10px;
}

table.shoppingBasket a:link,
table.shoppingBasket a:visited
{
text-decoration:underline;
color:#9caa5b;
font-size:.9em;
}

table.shoppingBasket tr.promo a:hover
{
text-decoration:none;
}






table.shoppingBasket tr.promo
{
background:#31c9c9;
color:#fff;
}

table.shoppingBasket tr.promo a:link,
table.shoppingBasket tr.promo a:visited
{
text-decoration:underline;
color:#fff;
}

table.shoppingBasket tr.promo a:hover
{
text-decoration:none;
}






.total
{
font-size:1.1em;
font-weight:bold;
background:#000;
color:#fff;
}
.subtotal
{
font-size:1.1em;
font-weight:bold;
background:#ddd;
color:#111;
}




/* ---------------------- Shopping Basket --------------------------- */


.checkoutBlockHead {
color: #ffffff;
background: #31C9C9;
cursor: pointer;
padding: 8px;
margin:10px 0 0 0;
text-transform: lowercase;
}


#content .checkoutBlockHead h3
{
color:#fff !important;
}

div.checkoutBlock
{
background:#fff;
padding:20px 20px 10px 20px;
}


.checkoutBlock label
{
width:100px !important;
display:block;
float:left;
}

.checkoutBlock input
{
float:left;
margin:0 20px 10px 0;
}


.fieldsGood
{
padding:0 10px !important;
background:url('/img/icons/tick.png') no-repeat center center;
}
.fieldsBad
{
padding:0 10px !important;
background:url('/img/icons/cross.png') no-repeat center center;
}



/* ---------------------- Footer --------------------------- */

#footerWrap
{
margin:0;
}


#footer
{
width:940px;
margin:0 auto;
padding:24px 0 0 0;
position:relative;
}

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

#footer a:hover
{
text-decoration:underline;
}



/* ---------------------- // Footer --------------------------- */


.endCredits
{
width:940px;
margin:10px auto;
font-size:.7em;
line-height:1.5em;
}