.productView1 {
	width: 180px;
	height: 190px;
	margin-bottom: 45px !important;
	margin-bottom: 20px;
	border: 1px solid Silver;
	background-color: #F0F0F0;
	float: none;
}

/* remove all the bullets, borders and padding from the default list styling */
.productView1 ul {
	list-style-type: none;
	list-style-image: none;
	float: left;
	position: relative;
	z-index: 50;
	display: inline;
	margin: 0px;
	padding: 0px;
}

.productView1 ul ul {
	margin: 0px;
	border-top: 2px solid Yellow;
}

.productView1 li {
	float: left;
	position: relative;
	margin-left: 0px;
	display: inline;
}

.productView1 ul ul li{
	height: 20px;
	margin: 0px;
}

/* style the links for the top level */
.productView1 a, .productView1 a:visited {
	display: block;
	height: 170px;
	padding: 15px;
	width: 150px;
	font-size: 10px;
}

/* a hack so that IE5.5 faulty box model is corrected */
* html .productView1 a, * html .productView1 a:visited {
	width: 150px;
	w\idth: 150px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.productView1 ul ul {
	visibility: hidden;
	position: absolute;
	height: 0px;
	top: 190px;
	left: 0px;
	width: 150px;
}

/* another hack for IE5.5 */
* html .productView1 ul ul {
	top:180px;
	t\op:180px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.productView1 table {position:absolute; top:0; left:0;}

/* style the second level links */
.productView1 ul ul a, .productView1 ul ul a:visited{
	color: White;
	height: 30px;
	line-height: 30px;
	width: 165px;
	text-decoration: none;
	padding: 0px;
	padding-left: 15px;
	background: #002B55;
	font-size: 14px;
}
* html .productView1 ul ul a{
	width:165px; 
	w\idth:165px;
}

/* style the top level hover */
.productView1 a:hover{
	background: #002B55 repeat-x top left;
	font-weight: normal;
}

.productView1 :hover > a, .productView1 ul ul :hover > a{
	background: #E0E0E0 repeat-x top left;
}
.productView1 ul ul :hover > a{
	background: #002B55 no-repeat center left;
}

.productView1 ul ul a:hover, * html .productView1 ul ul a:hover
{
	background: #002B55 no-repeat center left;
	text-decoration: underline;
}

/* make the second level visible when hover on first level list OR link */
.productView1 ul li:hover ul, .productView1 ul a:hover ul{
	visibility: visible;
	width: 180px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.productView1 table {position:absolute; top:0; left:0; border-collapse:collapse;}

.productView1 ul a{
	color: Gray; /*Default font color when no hover*/
	text-decoration: none;
}

.productView1 ul a span{
	font-size: 16px;
	display: block;
	margin: 5px 0px;
	font-weight: bold;
}










/*-------Start Product View 2------*/

.productView2 {
	width: 180px;
	height: 190px;
	margin-bottom: 45px !important;
	margin-bottom: 20px;
	border: 1px solid Silver;
	background-color: #F0F0F0;
}

/* remove all the bullets, borders and padding from the default list styling */
.productView2 ul {
	list-style-type: none;
	list-style-image: none;
	float: left;
	position: relative;
	z-index: 50;
	display: inline;
	margin: 0px;
	padding: 0px;
}

.productView2 ul ul {
	margin: 0px;
	border-top: 2px solid Yellow;
}

.productView2 li {
	float: left;
	position: relative;
	margin-left: 0px;
	display: inline;
}

.productView2 ul ul li{
	height: 20px;
	margin: 0px;
}

/* style the links for the top level */
.productView2 a, .productView2 a:visited {
	display: block;
	height: 170px;
	padding: 15px;
	width: 150px;
	font-size: 10px;
}

/* a hack so that IE5.5 faulty box model is corrected */
* html .productView2 a, * html .productView2 a:visited {
	width: 150px;
	w\idth: 150px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.productView2 ul ul {
	visibility: hidden;
	position: absolute;
	height: 0px;
	top: 190px;
	left: 0px;
	width: 150px;
}

/* another hack for IE5.5 */
* html .productView2 ul ul {
	top:180px;
	t\op:180px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.productView2 table {position:absolute; top:0; left:0;}

/* style the second level links */
.productView2 ul ul a, .productView2 ul ul a:visited{
	color: White;
	height: 30px;
	line-height: 30px;
	width: 165px;
	text-decoration: none;
	padding: 0px;
	padding-left: 15px;
	background: #002B55;
	font-size: 14px;
}
* html .productView2 ul ul a{
	width:165px; 
	w\idth:165px;
}

/* style the top level hover */
.productView2 a:hover{
	background: #002B55 repeat-x top left;
	font-weight: normal;
}

.productView2 :hover > a, .productView2 ul ul :hover > a{
	background: #E0E0E0 repeat-x top left;
}
.productView2 ul ul :hover > a{
	background: #002B55 no-repeat center left;
}

.productView2 ul ul a:hover, * html .productView2 ul ul a:hover
{
	background: #002B55 no-repeat center left;
	text-decoration: underline;
}

/* make the second level visible when hover on first level list OR link */
.productView2 ul li:hover ul, .productView2 ul a:hover ul{
	visibility: visible;
	width: 180px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.productView2 table {position:absolute; top:0; left:0; border-collapse:collapse;}

.productView2 ul a{
	color: Gray; /*Default font color when no hover*/
	text-decoration: none;
}

.productView2 ul a span{
	font-size: 16px;
	display: block;
	margin: 5px 0px;
	font-weight: bold;
}












/*-------------------Start Product View 3---------------------------*/

.productView3 {
	width: 180px;
	height: 190px;
	margin-bottom: 45px !important;
	margin-bottom: 20px;
	border: 1px solid Silver;
	background-color: #F0F0F0;
}

/* remove all the bullets, borders and padding from the default list styling */
.productView3 ul {
	list-style-type: none;
	list-style-image: none;
	float: left;
	position: relative;
	z-index: 50;
	display: inline;
	margin: 0px;
	padding: 0px;
}

.productView3 ul ul {
	margin: 0px;
	border-top: 2px solid Yellow;
}

.productView3 li {
	float: left;
	position: relative;
	margin-left: 0px;
	display: inline;
}

.productView3 ul ul li{
	height: 20px;
	margin: 0px;
}

/* style the links for the top level */
.productView3 a, .productView3 a:visited {
	display: block;
	height: 170px;
	padding: 15px;
	width: 150px;
	font-size: 10px;
}

/* a hack so that IE5.5 faulty box model is corrected */
* html .productView3 a, * html .productView3 a:visited {
	width: 150px;
	w\idth: 150px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.productView3 ul ul {
	visibility: hidden;
	position: absolute;
	height: 0px;
	top: 190px;
	left: 0px;
	width: 150px;
}

/* another hack for IE5.5 */
* html .productView3 ul ul {
	top:180px;
	t\op:180px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.productView3 table {position:absolute; top:0; left:0;}

/* style the second level links */
.productView3 ul ul a, .productView3 ul ul a:visited{
	color: White;
	height: 30px;
	line-height: 30px;
	width: 165px;
	text-decoration: none;
	padding: 0px;
	padding-left: 15px;
	background: #002B55;
	font-size: 14px;
}
* html .productView3 ul ul a{
	width:165px; 
	w\idth:165px;
}

/* style the top level hover */
.productView3 a:hover{
	background: #002B55 repeat-x top left;
	font-weight: normal;
}

.productView3 :hover > a, .productView3 ul ul :hover > a{
	background: #E0E0E0 repeat-x top left;
}
.productView3 ul ul :hover > a{
	background: #002B55 no-repeat center left;
}

.productView3 ul ul a:hover, * html .productView3 ul ul a:hover
{
	background: #002B55 no-repeat center left;
	text-decoration: underline;
}

/* make the second level visible when hover on first level list OR link */
.productView3 ul li:hover ul, .productView3 ul a:hover ul{
	visibility: visible;
	width: 180px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.productView3 table {position:absolute; top:0; left:0; border-collapse:collapse;}

.productView3 ul a{
	color: Gray; /*Default font color when no hover*/
	text-decoration: none;
}

.productView3 ul a span{
	font-size: 16px;
	display: block;
	margin: 5px 0px;
	font-weight: bold;
}














/*---------- Start Product View 4 -----------------*/


.productView4 {
	width: 180px;
	height: 190px;
	margin-bottom: 45px !important;
	margin-bottom: 20px;
	border: 1px solid Silver;
	background-color: #F0F0F0;
}

/* remove all the bullets, borders and padding from the default list styling */
.productView4 ul {
	list-style-type: none;
	list-style-image: none;
	float: left;
	position: relative;
	z-index: 50;
	display: inline;
	margin: 0px;
	padding: 0px;
}

.productView4 ul ul {
	margin: 0px;
	border-top: 2px solid Yellow;
}

.productView4 li {
	float: left;
	position: relative;
	margin-left: 0px;
	display: inline;
}

.productView4 ul ul li{
	height: 20px;
	margin: 0px;
}

/* style the links for the top level */
.productView4 a, .productView4 a:visited {
	display: block;
	height: 170px;
	padding: 15px;
	width: 150px;
	font-size: 10px;
}

/* a hack so that IE5.5 faulty box model is corrected */
* html .productView4 a, * html .productView4 a:visited {
	width: 150px;
	w\idth: 150px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.productView4 ul ul {
	visibility: hidden;
	position: absolute;
	height: 0px;
	top: 190px;
	left: 0px;
	width: 150px;
}

/* another hack for IE5.5 */
* html .productView4 ul ul {
	top:180px;
	t\op:180px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.productView4 table {position:absolute; top:0; left:0;}

/* style the second level links */
.productView4 ul ul a, .productView4 ul ul a:visited{
	color: White;
	height: 30px;
	line-height: 30px;
	width: 165px;
	text-decoration: none;
	padding: 0px;
	padding-left: 15px;
	background: #002B55;
	font-size: 14px;
}
* html .productView4 ul ul a{
	width:165px; 
	w\idth:165px;
}

/* style the top level hover */
.productView4 a:hover{
	background: #002B55 repeat-x top left;
	font-weight: normal;
}

.productView4 :hover > a, .productView4 ul ul :hover > a{
	background: #E0E0E0 repeat-x top left;
}
.productView4 ul ul :hover > a{
	background: #002B55 no-repeat center left;
}

.productView4 ul ul a:hover, * html .productView4 ul ul a:hover
{
	background: #002B55 no-repeat center left;
	text-decoration: underline;
}

/* make the second level visible when hover on first level list OR link */
.productView4 ul li:hover ul, .productView4 ul a:hover ul{
	visibility: visible;
	width: 180px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.productView4 table {position:absolute; top:0; left:0; border-collapse:collapse;}

.productView4 ul a{
	color: Gray; /*Default font color when no hover*/
	text-decoration: none;
}

.productView4 ul a span{
	font-size: 16px;
	display: block;
	margin: 5px 0px;
	font-weight: bold;
}
