/***************/
/* main layout */
/***************/
body { margin: 0; padding: 0; font-family:Gill Sans,Arial,Helvetica,sans-serif; color:#5F686E; font-size:12px;  /* backgrounds? */ }

#bodyWrapper { width: 734px; margin:17px auto; 17px 0 }

/* specific link colours for this site */
a         { color: #62b9be; text-decoration: none; }
a:link    { color: #62b9be; text-decoration: none; }
a:visited { color: #62b9be; text-decoration: none; }
a:hover   { color: #62b9be; text-decoration: underline; }
a:active  { color: #62b9be; text-decoration: underline; }

h1{}
h2{}
h3{font-size:14px;}
h4{font-size:13px; margin:0; padding:0}

li a:focus{outline:none;}

/** forms and attributes **/
.input{width:188px; height:14px; border:1px solid #636466;}
.btn{ height:18.5px; background:#bcbdc0; border:0; cursor:pointer; padding-bottom:2px;}
.btn_f{ height:18.5px; background:#bcbdc0; border:0; cursor:pointer; padding-bottom:2px; margin-left:60px}
.btn_f:hover{ background:#ccc;}
.btn:hover{ background:#ccc;}
#headers{margin:10px 0 10px 0;}


/*******************/
/* header elements */
/*******************/
#header {  }
.flash_header{ float:right; width:350px; height:229px; border:1px solid #76777b}

#logo { float: left; }

ul#nav      {clear:both;  }
ul#nav li   { float: left;  }
ul#nav li a { display: block; background:url(../images/nav.png) no-repeat top left; height:32px; text-indent:-99999px; }
#nav .nav-home a{width:103px; background-position:0 0;}
#nav .nav-products a{width:106px; background-position:-103px 0;}
#nav .nav-shop a{width:104px; background-position:-210px 0;}
#nav .nav-blog a{width:102px; background-position:-314px 0;}
#nav .nav-news a{width:94px; background-position:-416px 0;}
#nav .nav-dealer-login a{width:119px; background-position:-510px 0;}
#nav .nav-contact a{width:105px; background-position:-629px 0;}

/** roll overs **/
#nav .nav-home a:hover{width:103px; background-position:0 -32px;}
#nav .nav-products a:hover{width:106px; background-position:-103px -32px;}
#nav .nav-shop a:hover{width:104px; background-position:-210px -32px;}
#nav .nav-blog a:hover{width:102px; background-position:-314px -32px;}
#nav .nav-news a:hover{width:94px; background-position:-416px -32px;}
#nav .nav-dealer-login a:hover{width:119px; background-position:-510px -32px;}
#nav .nav-contact a:hover{width:105px; background-position:-629px -32px;}
/********************/
/* content elements */
/********************/
#main { width:724px; margin-bottom:10px  }
#home_content{ height:111px; border:1px solid #dcdcdc;}

/** index boxes **/
.index_box{ float:left; width:230px; height:198px; margin:10px 14px 0 0; border:1px solid #d0d0d1; text-align:center }
.none{ margin:10px 0 0 0; }

/** products **/
#leftside{ float:left; width:496px; height: 292px;}
#bigdog a{ float:left; width:224px; height:292px; background:url(../images/products/BigdogLink.jpg) no-repeat;}
#bigdog a:hover{ background:url(../images/products/BigdogLinkRollover.jpg) no-repeat}

#aquarian a{ float:left; width:242px; margin:0 0 0 22px; background:url(../images/products/AquarianLink.jpg) no-repeat; height:172px;}
#aquarian a:hover{ background:url(../images/products/AquarianLinkRollover.jpg) no-repeat}

#shaw a{ float:right; width:225px; margin:0 0 0 0px; background:url(../images/products/ShawLink.jpg) no-repeat; height:172px}
#shaw a:hover{ background:url(../images/products/ShawLinkRollover.jpg) no-repeat;}

#otherH a{ margin:15px 0 0 22px; float:left; background:url(../images/products/OtherHeadsSticksLink.jpg) no-repeat; height:104px; width:478px;}
#otherH a:hover{ background:url(../images/products/OtherHeadsSticksLinkRollover.jpg) no-repeat}

#cases a{ float:left; background:url(../images/products/CasesBagsLink.jpg) no-repeat;  height:123px; width:387px}
#cases a:hover{ background:url(../images/products/CasesBagsLinkRollover.jpg) no-repeat}

#duende a{ float:left; background:url(../images/products/DuendeLink.jpg) no-repeat;  height:123px; width:387px}
#duende a:hover{ background:url(../images/products/DuendeLinkRollover.jpg) no-repeat}

#hearing a{ float:left; margin-left:20px; background:url(../images/products/HearingProtectionLink.jpg) no-repeat;  height:123px; width:317px}
#hearing a:hover{ background:url(../images/products/HearingProtectionLinkRollover.jpg) no-repeat}

#drummer a{ float:left; margin-top:10px; background:url(../images/products/TshirtsLink.jpg) no-repeat; height:132px; width:280px;}
#drummer a:hover{ background:url(../images/products/TshirtsLinkRollover.jpg) no-repeat}

#other-stuff a{ float:left; margin:10px 0 0 23px; background:url(../images/products/OtherStuffLink.jpg) no-repeat; width:420px; height:129px}
#other-stuff a:hover{ background:url(../images/products/OtherStuffLinkRollover.jpg) no-repeat}

/** sign up **/
#signup{ height:101px; margin-top:10px; border:1px solid #dcdcdc; padding:0 0 5px 0;}
#signup table { padding:5px 0 0 20px;}

/** New Product Pages **/
.prodPage{ margin:0px -10px; }
.prodPage td{ border:1px solid #C2C2C5; }
.prodPage h2{
	display:block;
	height:26px;
	color:#fff;
	text-transform:uppercase;
	padding:7px 0 0 8px;
	font-size:24px;
	font-weight:bold;
}

.prodPage .bigdog h2{				background:#48669f; }
.prodPage .aquarian h2{				background:#000000; }
.prodPage .shaw h2{					background:#ed1c24; }
.prodPage .otherheadsandsticks h2{	background:#008000; }
.prodPage .hearingprotection h2{	background:#875fa8; }
.prodPage .drummertshirts h2{		background:#43A4A7; }
.prodPage .duende h2{				background:#6D4697; }
.prodPage .otherstuff h2{			background:#BF1E2E; }

.prodPage div.padded{ padding:10px; }


/********************/
/* prodcuts singles */
/********************/
.prod_header{ margin:10px 0 10px 0}
.prod_h1{}
.prod_leftside{ float:left; width:369px; min-height:400px}

/*blue header*/
.prod_leftside .item_bigdog{ border:1px solid #c2c2c5;  min-height:214px; margin-bottom:10px}
.prod_leftside .item_bigdog h2{ display:block; background:#48669f; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_bigdog p{ padding:5px}

/**red header*/
.prod_leftside .item_shaw{ border:1px solid #c2c2c5;  min-height:214px; margin-bottom:10px}
.prod_leftside .item_shaw p{padding:5px}
.prod_leftside .item_shaw h2{ display:block; background:#ed1c24; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}

/*black*/
.prod_leftside .item_aquarian{ border:1px solid #c2c2c5;  min-height:214px; margin-bottom:10px}
.prod_leftside .item_aquarian h2{ display:block; background:#000; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_aquarian p{ padding:5px}

/*dark red*/
.prod_leftside .item_otherstuff h2{ display:block; background:#bf1e2e; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_otherstuff p{padding:5px}
.prod_leftside .item_otherstuff{ border:1px solid #c2c2c5; min-height:214px; margin-bottom:10px}

/*torqoise*/
.prod_leftside .item_drummer{ border:1px solid #c2c2c5; min-height:214px; margin-bottom:10px}
.prod_leftside .item_drummer h2{ display:block; background:#43a4a7; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_drummer p{ padding:5px}

/*purple*/
.prod_leftside .item_hearing{ border:1px solid #c2c2c5; min-height:214px; margin-bottom:10px}
.prod_leftside .item_hearing h2{ display:block; background:#875fa8; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_hearing p{ padding:5px}

/*orange*/
.prod_leftside .item_cases{ border:1px solid #c2c2c5; min-height:214px; margin-bottom:10px}
.prod_leftside .item_cases h2{ display:block; background:#f1592a; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_cases p{ padding:5px}

/*green*/
.prod_leftside .item_headsandsticks{ border:1px solid #c2c2c5; min-height:214px; margin-bottom:10px}
.prod_leftside .item_headsandsticks h2{ display:block; background:green; height:26px; color:#fff; text-transform:uppercase; padding:7px 0 0 8px; font-size:24px; font-weight:bold;}
.prod_leftside .item_headsandsticks p{ padding:5px}

.prod_rightside{ float:right; width:331px; min-height:400px}
.prod_rightside .image img{border:1px solid #c2c2c5; margin-bottom:10px;}

/*********/
/* news */
/*********/
.news_leftside{ width:343px; margin-right:10px; float:left; min-height:400px}
.news_leftside .item{ border:1px solid #766d6f; width:339px;}
.news_leftside .item img{ float:left; width:105px; padding:0 10px 10px 10px} 
.news_leftside .item h2{ background:#c2dddd; display:block; height:22px; color:#636466; padding:0 0 4px 10px; font-size:18px}
.news_rightside{ float:right; min-height:400px; width:365px }
.news_rightside .video_item{height:62px; padding:30px 0 10px 0}
.news_rightside .video_item img{ float:left; width:62px; padding-right:10px}
.news_rightside #video_player{ width:337px; padding:12px; border:1px solid #766d6f;}

/*********/
/* blog */
/*********/
.blog_header{ display:block; height:35px; background:#9cc7c8; color:#636466; padding:3px 3px 3px 9px;}
.blog_item{ width:699px; height:221px; border:1px solid #646567; padding:10px; margin-bottom:10px}
.blog_item img{ margin:15px 0 0 0; float:left; width:154px}
.blog_item .content{float:right; width:535px; margin-top:10px; }
.blog_item h1{padding:0; margin:0}

.item .content{ margin-top:20px; padding-bottom:5px}

/*********/
/* login */
/*********/
#login_info { text-align:center; border:1px solid #67686a}
#login_info a{ color:#ed1c24}
#login_info h1 { color:#007071; font-size:16px}

/*login box*/
#login_box{ background:#b2d4d4; height:122px; margin:10px 0px 0 0px; text-align:center; padding-top:25px}

/***********/
/* contact */
/***********/
#contact_info{ border:1px solid #878585; height:221px; width:268px; float:left; padding:10px 0 0 10px}
#contact_info h1{color:#606163; font-size:18px}
#contact_info p{ color:#636466; font-size:14px}
#contact_info a{ color:#ed1c24}
#pics{ width:433px; height:232px; float:right;}

/*boxes*/
.box{ border:1px solid #403c3d; min-height:137px; width:338px; float:left; margin:0 40px 10px 0;}
.box .content{
	position:relative;
	float:right;
	text-align:right;
	margin-right:10px;
	width:190px;
	height:130px;
}
.box .content h1{ color:#007071; font-weight:bold; font-size:22px; }
.box .content h2{ font-size:16px; line-height:18px; margin-top:10px; padding:0; color:#7c7d7f}
.box img{ border:1px solid #929192; margin:10px 5px 5px 10px; float:left}
.box .content a{ color:#ed2129;}
.box .content a.ablue{ color:#177d7e; font-size:15px; padding-top:10px }
img.none{ border:0;  padding-left:90px}
.margin{ margin-left:14px}
.leftside{ float:left; width:356px}
.rightside{ float:right; width:354px}

/***************/
/* hidden elem */
/***************/
.more-profile { cursor:pointer; }
.more-profile:hover {color:#006e6f}
.more-bottom{
	position:absolute;
	bottom:0px;
	right:0px;
	font-size:14px;
	font-weight:bold;
}
#hidden img{ float:left; width:148px; padding:0; margin:0}

/*********/
/* items */
/*********/
.item          { margin-bottom: 10px; }
.item .title   { font-size: 1em; font-weight: bold; }
.item .date    { font-style: italic; }
.item .image   { float: left; margin-right: 5px; margin-bottom: 5px; }

/*********************/
/* featured products */
/*********************/
#left_prod{ width:325px; float:left; margin-right:15px; border:1px solid #69696b; min-height:440px;}
#left_prod img{ margin:18px; border:1px solid #69696b;}
#right_prod{ width:377px; float:right; border:1px solid #69696b; min-height:453px;}
#right_prod h1{ float:right;  padding-right:20px}
#right_prod p{ padding:10px; clear:both}
.thumb{ float:left; width:129px; margin:15px 19.2px 15px 0}


/*******************/
/* footer elements */
/*******************/
#footer { margin-top:40px;}
#footer a { text-decoration: none; color: #5F686E} /* for the clevercherry.com link */
#footer .left{
	float:left;
	line-height:35px;
}
#footer .right{
	float:right;
	padding-right:10px;
}


/***********************/
/* general form styles */
/***********************/
.required { color: #f00; }

/* all form elements are contained within a formrow div, with a label and
 *  then the element, this is the best way (but still not good) to emulate
 *  a table */
div.formrow {
  clear: both;
  text-align: left;
  margin-bottom: 10px;
}

div.formrow label {
  float: left;
  text-align: right;
  margin-right: 10px;
  width: 80px; /* default width for a default form, add new form ids and override */
}
div.formrow.indent { margin-left: 90px; } /* label width + label margin-right, override as above */
div.formrow label.radio {
	float: none;
	text-align: inherit;
	margin-right: 0;
	width: auto;
}

#recaptcha_widget         { margin-bottom: 15px; }
#recaptcha_image          { float: left; width: 300px; }
#recaptcha_options        { border-left: 1px solid #999; padding-left: 5px; float: left; margin-left: 10px; }
#recaptcha_response_field { width: 325px; }
#recaptcha_notice         { font-size: 0.833em; color: #555; }

/* message and error boxes, not just useful in contact form */
#messages,
#errors,
#warnings,
#info { margin-bottom: 10px; }
.message { border: 1px solid #080; background: #efe; color: #080; padding: 3px 5px; margin-bottom: 15px; float: left; width:98% } /* you may need to clearfix this */
.message.nomargin { margin-bottom: 0; } /* if before something with a margin-top */
.message.info { border-color: #880; background: #ffe; color: #880; width:98%} /* info box in yellow */
.message.warn { border-color: #f40; background: #ffe; color: #f40; width:98%} /* warning box in orange */
.message.error { border-color: #f00; background: #fee; color: #f00; width:98%} /* error box in red */