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


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


body { 
	font-family:Arial, Helvetica, sans-serif; 
	font-size:0.625em; /* The font size is now 0.625 x 16px = 10px */
	line-height:1.8em; /* The line height is now 18 pixels. */
	color:#757575;
	background:url(../joico-imgs/background.jpg) repeat-y top center;}
	
	
body a{ font-size: 1.2em; color:#808285;  text-decoration:none; }
body a:hover { font-size: 1.2em; color:#850822; text-decoration:underline; }


p 	{ font-size: 1.2em; /* 12px */ }
h1 	{ font-size: 48px; /* 24px */ font-family:Arial, Helvetica, sans-serif; margin-bottom:30px; margin-top:15px;}
h2 	{ font-size: 3.6em; /* 36px */ font-family:Arial, Helvetica, sans-serif; }
h3 	{ font-size: 2.4em; /* 24px */ font-family:Arial, Helvetica, sans-serif; }
h4 	{ font-size: 2.1em; /* 21px */ font-family:Arial, Helvetica, sans-serif; }
h5 	{ font-size: 1.8em; /* 18px */ font-family:Arial, Helvetica, sans-serif; }
h6 	{ font-size: 1.6em; /* 16px */ }

h2	{
  color:#FFFFFF;
  font-size:22px;
  font-weight:normal;
  line-height:36px;
  text-indent:12px;
  text-transform:uppercase;}
  
.menu h2 {background-color:#444444;}

.blue	{ color:#172983; }
.green	{ color:#97bf0d; }
.unitedstates a { color:#999999; font-style:italic; }
.unitedstates a:hover { color:#999999; font-style:italic; }
.subpara	{ font-weight:bold; color:#58595b; }

/* Structure */

#container 	{ margin:0 auto 0px; width:940px; padding:0 10px 10px 10px;background-color:#fff; border:1px solid #000;}

/* Gradients */

#grey	{ background-image:url(/joico/images/gradient.jpg); background-repeat:repeat-x; padding:15px; width:190px; }

/* Dynamic Menus */

.rel		{ font-family:Arial, Helvetica, sans-serif; font-size:1.2em; cursor:hand;  color:#808285;  text-decoration:none; }
.relover	{ font-family:Arial, Helvetica, sans-serif; font-size:1.2em; cursor:hand; color:#850822; text-decoration:underline;  }
.footer		{ font-family:Arial, Helvetica, sans-serif; font-size:0.625em; cursor:hand;  color:#525252;  text-decoration:none; font-weight:bold; }
.footerover	{ font-family:Arial, Helvetica, sans-serif; font-size:0.625em; cursor:hand; color:#525252; text-decoration:underline; font-weight:bold;  }	

/* SubNav - Hompage */

#redline		{ width:220px; padding-top:4px; }
#redline:hover { width:220px; border-top:solid 2px #850822; padding-top:2px; }


/* Footer Menu - Hompage */

.footer		{ font-size:1.2em; background-image:url(/images/greenarrow.gif); background-repeat:no-repeat; background-position:left; cursor:hand; text-decoration:none; padding-left:15px; vertical-align:middle; }
.footerover	{ font-size:1.2em; background-image:url(/images/bluearrow.gif); background-repeat:no-repeat; background-position:left; cursor:hand; text-decoration:none; padding-left:15px; vertical-align:middle;  }


/* Buttons */

#greenbutton { width:249px; height:49px; background-image:url(/images/greenbutton.gif); background-repeat:no-repeat; padding:15px 0 0 15px; }
#greenbutton:hover { width:249px; height:49px; background-image:url(/images/greenbuttonover.gif); background-repeat:no-repeat; padding:15px 0 0 15px; }
.buttontext { font-size: 1.8em; /* 18px */ font-family:"Trebuchet MS"; color:#FFFFFF; }
#bluebutton { width:249px; height:49px; background-image:url(/images/bluebutton.gif); background-repeat:no-repeat; padding:15px 0 0 15px;}
#bluebutton:hover { width:249px; height:49px; background-image:url(/images/bluebuttonover.gif); background-repeat:no-repeat; padding:15px 0 0 15px;}


blockquote {background-image:url(../images/bg-stripes.png); padding:30px; margin-bottom:20px;}
blockquote p {font-size:16px; margin-bottom: 20px; line-height:1.5; margin-bottom:0px;}
blockquote p a:link, blockquote p span{color:#850822;}
blockquote p strong{font-weight:bold;}

.menu a		{display:block; color:#FFF; text-decoration:none; font-family:franklin-gothic-ext-comp-urw,sans-serif}
.menu a:hover	{color:#eee; text-decoration:none;}


.column-main		{font-size:14px; line-height:1.5;}
.productTable strong	{color:#850822;}
.productTable h1		{margin-bottom:15px; }
.productTable h2		{font-family:Arial, Helvetica, sans-serif; background-color:#FFF; color:#757575; font-size:14px; text-indent:0px; font-weight:bold;}
.productTable h4		{font-size:14px;}

.column-main	{float:left;}
.productTextarea {height: 17px;}

.productfeaturelist {overflow:hidden; padding-left:10px;}
.productItem   {width:215px; margin-right:15px; float:left; min-height:450px; position:relative; background:url(../images/bg-stripes.png) repeat; margin-bottom:20px; border:1px solid #ddd;}
.productItem .padding	{padding:10px; margin: 0 10px; background-color:#FFF; height:240px;}
.productItem h2{background-color:none; color:#850822; text-indent:0px; line-height:1.2; margin-bottom:16px; font-size:20px; overflow:hidden; margin-bottom:10px; padding:10px;}
.productItem h2 img {float:right; margin-left:10px;}
.productItem .padding a	{background-color:#444; color:#fff; display:inline-block; font-family:"franklin-gothic-ext-comp-urw",sans-serif; font-size:20px; padding:0px 10px; width:120px; text-align:center; position:absolute; bottom:10px; left:10px;}
.productItem .padding a:hover	{background-color:#850822; text-decoration:none;}

.large-image	{float:right;}

td.productItem	{width:100%;}

.large-product-container	{overflow:hidden; padding:15px;}
.large-detail				{background-color:#FFF; padding:10px; min-height: 301px;}
.large-detail h1			{margin-top:0px; text-transform:uppercase; font-size:24px; font-size:42px;}
.addtocart					{font-size:12px;}

p.price						{margin-bottom:30px; color:#444; font-size:24px; background-color:#850822; color:#FFF; width:165px; padding-left:20px;}
p.price span				{font-size:14px; }
.shopping-summary			{margin:10px 0; overflow:hidden;}
.download-files				{width:300px; float:left; text-align:left;}

.download-files a		{font-size:14px; text-decoration:none; font-size:14px; background:url(/images/acrobat.png) no-repeat; padding-left:22px;}
.download-files a:hover	{color:#850822; font-size:14px;}

.overview .padding p span	{font-size:12px !important; line-height: 1.5em !important;}

.productItem .overview .padding	ul	{margin: 0 15px;}
.productItem .overview .padding	ul li	{list-style-type:disc; padding-bottom:5px; margin-bottom:5px; border-bottom:1px solid #e3e3e3;}
.productItem .overview .padding, .productItem .overview .padding p	{font-size:12px; line-height:1.5;}

.artists .padding			{height:130px;}
.artists					{min-height:340px;}
.artists .padding a			{font-size:20px; padding: 0px 20px; width:auto;}

.left{  float: left;
    width: 650px;
	 background-color: #FFFFFF;
    min-height: 200px;
    padding: 30px;
}

.photo						{width:140px; float:right;}
 .top-links					{text-align:right; padding:10px 20px 10px 10px; }
 .top-links a				{font-size:12px; text-decoration:none; font-weight:bold;}
 
.artists-large		{background: url("../images/bg-stripes.png") repeat scroll 0 0 transparent;
    margin-bottom: 20px;
    min-height: 300px; padding:0 20px 20px 20px; font-size:12px; line-height:1.6; overflow:hidden;}
	
.artists-large ul br{display:none;}
.artists-large ul			{margin-bottom:30px;}
.artists-large ul li		{list-style-type:disc; margin-left:15px; margin-bottom:5px;}
.artists-large h1			{margin-top:0px; margin-bottom:20px;}

td.education 				{position:relative; z-index:500;}
td.education ul			{display:none;}	
td.education:hover ul	{display:block; position:absolute;}
td.education:hover ul li a	{background-color:#444; display:block; font-size:24px; width:220px; text-indent:15px; padding: 10px 0; border-top:1px solid #fff; text-transform:uppercase;}
td.education:hover ul li a:hover	{background-color:#850822;}

#redline > table h2			{background-color:#444;}
#redline > table h2 a 		{font-size:22px; color:#FFF; text-decoration:none;}
#redline > table h2 a:hover	{color:#eee;}

a.home-button				{width:38px; height:38px; background:url(../images-2011/btn-home.gif) no-repeat; display:block; text-indent:-9999px; float:right; margin-right:20px;}
a.home-button:hover			{background-position: 0 -38px;}


.new-menu		{border: 1px solid #666; margin:20px 0 15px;  background-color:#dcdcdc; height:36px;}
.new-menu ul li	{float:left; position:relative; z-index:500;}
.new-menu ul li a {display:block; height:36px; color:#666; padding: 0 30px; line-height:36px; text-decoration:none; font-family: "franklin-gothic-ext-comp-urw",sans-serif; font-size:22px; text-transform:uppercase; border-right: 1px solid #666;}
.new-menu ul li a:hover	{background-color:#FFF;}
.new-menu ul li ul		{display:none; width:160px; border:1px solid #666; background-color:#FFf; border-bottom:none;}
.new-menu ul li ul a	{background-color:#fff; border:none; display:block; color:#666; padding:5px 30px;}
.new-menu ul li ul a:hover	{background-color:#dcdcdc;}
.new-menu ul li ul li	{border-bottom:1px solid #666; float:none;}
.new-menu ul li:hover ul	{display:block; position:absolute; left:-1px; top:36px;}

.footer a, .footer		{font-weight:normal; font-size:12px; color:#666;}	
.footer a:hover			{font-size:12px;}