/*************************************************************************

* This is the SKIN style definition for the CSS menu.                    *

* Feel free to customize this section.                                   *

*************************************************************************/



/*

 * Menu container settings

 * Applies to the first level menu container

 */

.menu {

	font-family: "Trebuchet MS", Arial, sans-serif;

	font-size: 11px;

	font-weight:bold;

	text-transform:uppercase;

	text-align:center;



	}



/*

 * Menu container settings

 * Applies to second (or more) level menu containers

 */

.menu ul {

	}



/*

 * Menu items settings

 * Applies to all menu items in all menu containers

 */

.menu li {

	background-image: none;
	
	text-transform:none;

	background: url(../images/menuh_l.gif) bottom left no-repeat;

	

	

	}



/*

 * Menu items settings

 * Applies to second (or more) level menu items

 */

.menu ul li {

	margin: 0px;

	width:230px;
	height:auto;

	background-image:none;

	background: url(../images/submenu_h.gif) top left repeat-x;
	

	color:#fff;

	

}



/*

 * Menu link settings

 * Applies to links that are to be found within the menu items, no matter the menu level

 */

.menu a {

	text-decoration: none;

	color: #fff;

	text-transform:uppercase;

	line-height: 27px;

	cursor: pointer;

	padding:0px 25px;

	background: url(../images/menuh_r.gif) bottom right no-repeat;	

	

}



/*

 * Menu link settings

 * Applies to links located in the second (or more) level menu items

 */

.menu ul a {

background-image:none;

color:#fff;

font-weight:bold;

line-height:22px;

padding:0px 14px;

text-decoration:none;

text-transform: none;

}





/***************************************************************************

* In this section, we will define what happens when mouse-overing an item  *

***************************************************************************/



/*

 * Mouse over on menu items

 * Applies to all menu items in all menu containers

 */

.menu li.hover {

	background: url(../images/menu_l.gif) bottom left no-repeat;

}

  

/*

 * Mouse over on menu items

 * Applies to second (or more) level menu items

 */

.menu ul li.hover {

	background: url(../images/submenu.gif) top left repeat-x;

}



/*

 * Mouse over on links

 * Applies to all links in all menu items

 */

.menu a.hover {

	color:#fff !important;

	background: url(../images/menu_r.gif) bottom right no-repeat;	

	text-decoration:none; 	



	

}



/*

 * Mouse over on links

 * Applies to links located in the second (or more) level menu items

 */

.menu ul a.hover {

  	color:#fff !important;

	background: url(../images/submenu_h.gif) top left repeat-x;

	line-height:22px;

	padding:0px 14px;

	 text-decoration:none;

	

}



/*****************************************************************************

* In this section, we will define what happens when a menu item is selected  *

*****************************************************************************/



/*

 * Selected menu item

 * Applies to selected menu items in all menu containers

 */

.menu li.selected {

}



/*

 * Selected menu item

 * Applies to second (or more) level selected menu items

 */

.menu ul li.selected {

}



/*

 * Selected links

 * Applies to selected links in all menu items

 */

.menu a.selected {

	color:#fff;

}



/*

 * Selected links

 * Applies to selected links located in the second (or more) level menu items

 */

.menu ul a.selected {

	color: #fff;

	}





/******************************************************************************

* In this section, we will define the menu arrows behavior                    *

* An arrow is inserted next to the menu item when the menu item has sub-menus *

******************************************************************************/



/* 

 * Define the arrow

 * Applies to all menu items that have sub-menus

 */

.menu .arrow {

	/* background-image:url(img/grey_arrow.gif);

	background-repeat: no-repeat;

	background-position: 9px center;  */

}



/* 

 * Define the arrow

 * Applies to all menu items that have sub-menus located in the second (or more) level

 */

.menu .hover ul .arrow,

.menu ul .arrow {

	background-image:url(img/arrow_sub.png);

	background-position:right;

	margin-right:8px;

}



/* 

 * Define the arrow on mouse over

 * Applies to all menu items that have sub-menus on mouse over

 */

.menu .hover .arrow {

	/* background-image:url(img/white_arrow_vertical.gif); */

}



/* 

 * Define the arrow on mouse over

 * Applies to all menu items that have sub-menus located in the second (or more) level on mouse over

 */

.menu ul .hover .arrow {

	 background-image:url(img/arrow_sub.png); 

	 background-position:right;

	 margin-right:8px;

	

}

/*************************************************************************

* This is the LAYOUT style definition for the CSS menu                   *

* DO NOT alter this section, unless you know what you're doing           *

*************************************************************************/

div.horizontal {

	clear: both;

	

}

div.horizontal br {

	clear: both;

	

}

div.horizontal ul {

	margin: 0px;

	padding: 0px;

	display: block;

	float: left;

	clear: both;

	

}

div.horizontal li {

	list-style-type: none;

	display: block;

	float: left;

	clear: none;

	text-align: left;

    position: static;

}

div.horizontal li img {

	border: none;

}

div.horizontal a {

	clear: both;

	display: block;

	margin: 0px; 

}

div.horizontal ul li ul {

	position: absolute;

	left: -5000px;

	top: -5000px;

	visibility: hidden;

	clear: both; 

}

div.horizontal ul li ul li {

	clear: both; 

}

div.horizontal ul li ul li a {

	clear: both;

}

.hasImg,

.hasImg a {

	padding: 0px !important;

	margin:	0px	!important;

	border:	none !important;

	outline: none !important;

	background:	transparent !important;

	width: auto !important;

}











/*--------product---------*/





/*--------left menu---------*/

ul.left_menu{

width:196px;

padding:0px;

margin:0px;

list-style:none;

}

ul.left_menu li{

margin:0px;

list-style:none;

}

ul.left_menu li.odd a{

width:166px;height:25px;display:block;background:url(images/checked.png) no-repeat left #dad0d0; background-position:5px 5px;border-bottom:1px #FFFFFF solid;

text-decoration:none;color:#504b4b;padding:0 0 0 30px; line-height:25px;

}

ul.left_menu li.even a{

width:166px;height:25px;display:block;background:url(images/checked.png) no-repeat left #eee6e6;background-position:5px 5px;border-bottom:1px #FFFFFF solid;

text-decoration:none;color:#504b4b;padding:0 0 0 30px; line-height:25px;

}

ul.left_menu li.even a:hover, ul.left_menu li.odd a:hover{

background:url(images/checked.png) no-repeat left #7bbcc7; color:#FFFFFF;background-position:5px 5px;

}



.border_box{

width:194px;

height:auto;

text-align:center;

border:1px #6da6b1 solid;

}

.product_title{

color:#ea2222;

padding:5px 0 5px 0;

font-weight:bold;

}

.product_title a{

text-decoration:none;

color:#ea2222;

padding:5px 0 5px 0;

font-weight:bold;

}

.product_title a:hover{

color:#064E5A;

}

.product_img{

padding:5px 0 5px 0;

}

.prod_price{

padding:5px 0 5px 0;

}

span.reduce{

color:#999999;

text-decoration:line-through;

}

span.price{

color:#ea2222;

}

/*----------newsletter--------------*/

input.newsletter_input{

width:160px;

height:16px;

border:1px #ddd9d9 solid;

margin:10px 0 5px 0;

font-size:12px;

padding:3px;

color:#999999;

}

a.join{

width:17px;

display:block;

margin:5px 0 5px 140px;

_margin:5px 0 5px 130px;

background:url(images/blue-add.png) no-repeat left;

padding:0 0 0 20px;

text-decoration:none;

color:#1c4a52;

}

.banner_adds{

width:194px;

text-align:center;

padding:10px 0 10px 0;

}



/*center content--------------------------*/

.center_content{

width:585px;

float:left;

padding:5px 10px;

background-color:#f7f3f3;

}

.center_title_bar{

width:520px;

height:33px;

float:left;

padding:0 0 0 40px;

margin:0 0 0 12px;

_margin:0 0 0 6px;

line-height:33px;

font-size:12px;

color:#847676;

font-weight:bold;

background:url(images/bar_bg.gif) no-repeat center;

background-color:#f7f3f3;

}







/*---------prod_box----------*/

.prod_box{

width:173px;

height:auto;

float:left;

padding:10px 10px 10px 11px;

}

.top_prod_box{

	background-color:#f7f3f3;

width:173px;height:12px;background:url(images/product_box_top.gif) no-repeat center bottom;float:left; padding:0px; margin:0px;

}

.bottom_prod_box{

	background-color:#f7f3f3;

width:173px;height:10px;background:url(images/product_box_bottom.gif) no-repeat center top;float:left;padding:0px; margin:0px;

}

.center_prod_box{

	background-color:#f7f3f3;

width:173px;height: auto;background:url(images/product_box_center.gif) repeat-y;float:left; text-align:center;padding:0px; margin:0px;

}

.prod_details_tab{

width:173px;

height:31px;

float:left;

background-color:#f7f3f3;

background:url(images/products_details_bg.gif) no-repeat center;

margin:3px 0 0 0;

}

img.left_bt{

float:left;

padding:6px 0 0 6px;

}

a.prod_details{

width:25px;

display:block;

float:left;

background-color:#f7f3f3;

background:url(images/square-blue-add.gif) no-repeat left;

padding:0 0 0 20px;

margin:7px 0 0 38px;

_margin:6px 0 0 35px;

text-decoration:none;

color:#0fa0dd;

}