/* ---------------------------------------------------------------------- */
/* ---------------------------------------------------------------------- */
/*
/*  Justhands-on.tv
/*  Copyright 2009
/*
/*  Cascading Style Sheet
/*
/* ---------------------------------------------------------------------- */
/* ---------------------------------------------------------------------- */
/*                           _                     _   _
/*        ___ _ _ ___ ___   |_|___ ___ ___ _ _ ___| |_|_|___ ___
/*       | . | | |  _| -_|  | |   |   | . | | | .'|  _| | . |   |
/*       |  _|___|_| |___|  |_|_|_|_|_|___|\_/|__,|_| |_|___|_|_|
/*       |_| ____________________________________________________
/* ---------------------------------------------------------------------- */

/* ###################################### */
/* RESETING
/* ###################################### */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin: 0; padding: 0; }
a img,:link img,:visited img { border: none; }

a {
  text-decoration: underline;
	font-weight: bold;
	color: #777777;
}

a:hover {
  text-decoration: underline;
}

body {
  margin: 0;
  padding: 0;
  font-family: Tahoma,Geneva,Kalimati,sans-serif;
  font-size: 11px;
	color: #464646;
  background-color: #666666;
}

h1
{
  font-size: 2.1em;
	color: #000000;
	margin-bottom: 10px;
}

h2
{
  font-size: 1.5em;
}

h3
{
	font-size: 1.2em;
}

p {
	margin-bottom: 12px;
}

/* ###################################### */
/* GENERAL
/* ###################################### */
div.fullWidth
{
	display: block;
	width: 100%;
	text-align: center;
}

div.pageArea
{
	margin: auto;
	width: 800px;
	background-color: #ffffff;
	text-align: left;
}

div.page_padd
{
  padding: 15px 36px 36px 36px;
}

div.oneQuaterColumn div.page_padd
{
  padding: 15px 10px 10px 10px;
}

div.bannersTop
{
	height: 140px;
	width: 800px;
	display: block;
}

.floatLeft
{
	float: left;
}

.floatRight
{
  float:right;
}

.margin0Auto
{
	margin: 0 auto;
}

.paddingBottom10
{
	padding-bottom: 10px;
}

.clear 
{
	clear:both;
	overflow: hidden;
	line-height: 0px;
}

.greyBg
{
	background-color: #F4F4F4;
}

/* ###################################### */
/* LAYOUT COLUMNS
/* ###################################### */

div.fullWidthColumn
{
  float: left;
	width: 100%;
  padding-bottom: 10px;
}

div.greyBgRightColumn
{
	float: left;
	padding-bottom: 10px;
	width: 100%;
	background: url(/images/content_grey_column_right_bg.gif) repeat-y;
}

div.threeQuaterColumn
{
	width: 597px;
}

div.oneQuaterColumn
{
  width: 203px;
}


/* ###################################### */
/* BUTTONS */
/* ###################################### */

/* Small Black */

a.blackSmallButton
{
  display: block;
  color: #FFFFFF !important;
  text-decoration: none;
  outline: 0px;
  font-size: 10px;
  font-weight: bold;
  line-height: 19px;
}

a.blackSmallButton span.buttonLeft
{
  display: block;
  float: left;
  clear: none;
  height: 20px;
  padding: 0px 0px 0 31px;
  margin: 0px;
  background-position: top left;
  background-repeat: repeat-x;
  background-image: url(/images/button_black_small_bg.png);
  cursor: pointer;
}

a.blackSmallButton span.buttonTitle
{
  float: left;
}

a.blackSmallButton span.buttonRight
{
  display: block;
  float: left;
  clear: none;
  width: 31px;
  height: 20px;
  background-position: top right;
  background-repeat: repeat-x;
  background-image: url(/images/button_black_small_bg.png);
  cursor: pointer;
}

/* Big Black */

a.blackBigButton
{
  display: block;
  color: #FFFFFF !important;
  text-decoration: none;
  outline: 0px;
  font-size: 16px;
  font-weight: bold;
  line-height: 41px;
}

a.blackBigButton span.buttonLeft
{
  display: block;
  float: left;
  clear: none;
  height: 41px;
  padding: 0px 0px 0 51px;
  margin: 0px;
  background-position: top left;
  background-repeat: repeat-x;
  background-image: url(/images/button_black_big_bg.png);
  cursor: pointer;
}

a.blackBigButton span.buttonTitle
{
  float: left;
}

a.blackBigButton span.buttonRight
{
  display: block;
  float: left;
  clear: none;
  width: 51px;
  height: 41px;
  background-position: top right;
  background-repeat: repeat-x;
  background-image: url(/images/button_black_big_bg.png);
  cursor: pointer;
}



/* ###################################### */
/* MAIN MENU */
/* ###################################### */

div.menuArea
{
  float: left;
	width: 100%;
	clear: both;
  height: 34px;
  border-top: 1px solid #ffffff;
  background-image: url(/images/common/menu/menu_off.gif);
}

div.menuArea ul
{
  list-style: none;
}

div.menuArea ul li
{
  float: left;
  height: 34px;
  line-height: 34px;
  border-right: 1px solid #ffffff;
}

div.menuArea ul li a
{
  font-size: 1.1em;
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
  display: block;
  padding-left: 10px;
  padding-right: 10px;
}

div.menuArea ul li a:hover, div.menuArea ul li.selected a
{ 
  text-decoration: none;
  background-image: url(/images/common/menu/menu_on.gif);
}

div.subLinksTab
{
	float: right;
	height: 24px;
	background-color: #000000;
}

div.subLinksTab img 
{
	float: left;
}

div.subLinksTab a
{
	display: block;
	padding: 5px 25px 5px 25px;
  font-size: 1.1em;
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
	float: left;
}

/* ###################################### */
/* SUB MENUS
/* ###################################### */

div.subMenu
{
  float: left;
  margin: 0 36px 20px 36px;
}

div.subMenu a
{
  margin-right: 10px;
  white-space:nowrap;
}


/* ###################################### */
/* FEATURED VIDEOS / PRODUCTS
/* ###################################### */

div.featuredRightContainer ul
{
	float: left;
	width: 100%;
	margin-top: 35px;
	list-style: none;
	padding: 0;
}

div.featuredRightContainer ul li
{
	display: block;
	border-bottom: 1px solid #d8d8d8;
	padding: 24px 0 24px 0;
}

div.featuredRightContainer ul li.first
{
	border-bottom: none;
	padding: 0;
}

div.featuredRightContainer  ul li h3
{
  color: #6a6a6a;
  font-size: 1.1em;
	padding-left: 18px;
}

div.featuredRightContainer ul li p
{
	text-align: center;
}

div.featuredRightContainer ul li p a.videoButton
{
  float: left;
  margin-left: 40px;
} 

div.featuredRightContainer ul li p a.productButton
{
  float: left;
  margin-left: 46px;
} 

div.sideAd {
  text-align: center;
  margin-top: 20px;
}

/* ###################################### */
/* SIDE MENU
/* ###################################### */

div.sideMenu ul
{
  float: left;
  width: 100%;
  margin-top: 35px;
  list-style: none;
  padding: 0;
}

div.sideMenu ul li
{
  display: block;
  border-bottom: 1px solid #d8d8d8;
  padding: 24px 0 24px 0;
}

div.sideMenu ul li.first
{
  border-bottom: none;
  padding: 0;
}

div.sideMenu  ul li h3
{
  color: #6a6a6a;
  font-size: 1.1em;
  padding-left: 18px;
}

div.sideMenu ul li p
{
  text-align: center;
}

div.sideMenu ul li p a.button
{
  float: left;
  margin-left: 18px;
} 

/* ###################################### */
/* HOMEPAGE
/* ###################################### */

div#homepage
{
	padding-bottom: 0 !important;
}

div#homepage div.lead
{
	float: left;
	width: 100%;
	padding: 35px 0 0 0;
  text-align: center;	
}

div#homepage div.lead h1
{
	font-size: 4em;
	margin-bottom: .05em;
}

div#homepage div.lead div.strapline
{
	font-family: Georgia,"Nimbus Roman No9 L",serif;
	font-size: 1.45em;
	font-style: italic;
}

div#homepage div.content
{
	width: 525px;
	text-align: justify;
}

div#homepage div.page_padd img
{
	margin-bottom: 20px;
}

div.featuredRightContainer ul
{
  float: left;
  width: 100%;
  margin-top: 35px;
  list-style: none;
  padding: 0;
}

ul.homepageVideos {
	list-style: none;
}

ul.homepageVideos li
{
  display: block;
  padding-top: 24px;
}

ul.homepageVideos li.first
{
  padding: 0;
}

ul.homepageVideos li p
{
  text-align: center;
}

ul.homepageVideos li p img
{
	margin: 0 !important;
}

div#homepage div#featured_videos {
	float: left;
	clear: both;
	width: 764px;
	border-top: 1px solid #C9C9C9;
	background-color: #f8f5f9;
	padding: 0 0 0 36px;
}

div#homepage div#featured_videos ul
{
	float: left;
	list-style: none;
	margin-top: 10px;
}

div#homepage div#featured_videos ul li
{
	float: left;
	display: block;	
	text-align: center;
	height: 160px;
}

div#homepage div#featured_videos ul li.first
{
	margin: 0;
}

div#homepage div#featured_videos div.video_container
{
	float: left;
	padding-top: 10px;
}

div#homepage div#featured_videos div.video_container.first
{
	width: 235px;
  border-right: 1px solid #C9C9C9;
	padding-right: 14px;
}

div#homepage div#featured_videos div.video_container.last
{
	width: 460px;
  padding-left: 20px;
}

div#homepage div#featured_videos div.video_container.first ul li
{
  width: 230px;
}

div#homepage div#featured_videos div.video_container.last ul li
{
	width: 230px;
}



/* ###################################### */
/* SHOPPING SECTION
/* ###################################### */

div#product_list div.productRow 
{
	display: block;
	clear: both;
	border-bottom: 1px solid #F4F4F4;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

div#product_list h2 
{
	color: #000000;
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid #000000;
}

div#product_list h3
{
  color: #000000;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

div#product_list img 
{
	width: 80px;
	height: 80px;
	padding-right:10px;
}

div#product_list div.pagination
{
	float: right;
}

div#product_list div.productRow div.description
{
	float: left;
	width: 350px;
}

div#product_list div.productRow div.description strong
{
	font-size: 1.5em;
}

div#product_description div.title
{
	position: relative;
}

div#product_description div.title h1 
{
	border-bottom: 1px solid #F4F4F4;
  margin-bottom: 14px;
  padding-bottom: 4px;
}

div#product_description div.title div.price
{
  position: absolute;
	top: 0px;
	right: 0px;
	font-family: Georgia,"Nimbus Roman No9 L",serif;
	font-style: italic;
	font-size: 2.1em;
}

div#product_description div.leftColumn
{
	float: left;
	width: 269px;
}

div#product_description div.rightColumn
{
  float: right;
  width: 249px;
}


/* ###################################### */
/* FOOTER */
/* ###################################### */

div.footerArea
{
	display: block;
	background-color: #000000;
	color: #ffffff;
	text-align: center;
	font-size: 0.9em;
	line-height: 22px;
	padding: 10px 0 10px 0;
}

div.footerArea.small
{
  height: 20px;
}

div.footerArea.big
{
	height: 132px;
}

div.footerArea a
{
	color: #ffffff;
}

div.footerArea div#google_ads
{
	float: left;
	clear: both;
	margin: 10px 0 0 35px;
}



/*
div.left_column
{
	float: left;
	width: 500px;
}	

div.right_column
{
	width: 220px;
	float: right;	
}

div.left_column h1
{
	display: block;
	font-size: 1.7em;
	font-weight: normal;
	margin-bottom: 20px;
}

*/


/* ###################################### */
/* BLOG */
/* ###################################### */

div.blog_post
{
	display: block;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #cccccc;
}

div.blog_post h2
{
	color: #666666;
}

div.blog_post h2 a
{
	color: #666666;
}

p.date
{
	color: #363636;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 0.9em;
}

ul.archive_menu
{
	list-style: none;
}

div#blog fieldset {
  border: 0;

}

div#blog fieldset ul {
  list-style: none;
}

div#blog fieldset ul li {
  margin-bottom:10px;
}

div#blog label
{
  display: block;
  font-weight: normal;
}

ul.error li 
{
	color: #FF0000;
}

div.errorPane li a {
  color: #FFFFFF !important;
}

/*
div.right_column h1
{
	display: block;
	font-size: 1.7em;
	font-weight: normal;
	margin-bottom: 20px;
}


div.archive
{
	background-color: #666666;
	padding: 10px;
}

div.archive h1
{
	color: #ffffff;
	border-bottom: 1px solid #ffffff;
	padding-bottom: 3px;
}

div.archive ul
{
	list-style: none;
}

div.archive ul a
{
	color: #ffffff;
	text-decoration: underline;
}
*/


ul.form
{
	float: left;
  list-style: none;
  margin: 0px;
  padding: 0px;
  margin-top: 20px;
}

ul.form li
{
	float: left;
	clear: both;
  width: 500px;
  margin: auto;
}

ul.form li label
{
	float: left;
	width: 120px;
	margin-bottom: 15px;
}

ul.form li input.text, ul.form li textarea
{
	width: 220px;
}

ul.form li input.submit
{
  margin-left: 120px;
}

ul.form li .help
{
	color: #949494;
  margin: 3px 0 10px 120px;
}


/* ###################################### */
/* REGISTRATION */
/* ###################################### */

div.register
{
	text-align: center;
}

div.register h1
{
	font-weight: normal;
	margin-top: 10px;
	margin-bottom: 10px;
}

div.register ul
{
	list-style: none;
	margin: 0px;
	padding: 0px;
	margin-top: 20px;
}

div.register li
{
	width: 500px;
	margin: auto;
	height: 30px;
	position: relative;
}

div.register label
{
	position: absolute;
	left: 0px;
	top: 0px;
}

div.register li input
{
	width: 400px;
	position: absolute;
	right: 0px;
	top: 0px;
}

input.noStyle
{
	width: auto!important;
	position: relative!important;
	left: 0px!important;
	margin-left: 94px;
}

p.alignLeft
{
	display: block;
	text-align: left;
	width: 500px;
	margin: auto;
}

div.errorPane
{
	background-color: #d15b44;
	border-bottom: 1px solid #7e2412;
}

div.successPane
{
  background-color: #136f1b;
	border-bottom: 1px solid #024304;
}

div.errorPane, 
div.successPane
{
	display: block;	
	padding: 10px;
	color: #ffffff;
	
}

div.errorPane ul,
div.successPane ul
{
	margin-left: 20px;	
	margin-top: 10px;
	margin-bottom: 10px;
}


div.errorPane h2
{
	color: #ffffff;
}