﻿@charset "utf-8";
/*==============================
	Title: Olay  
	Updated:   
	Content:  

    * Filename: nav.css
    * Version: 1.0.0 (2008-11-26) YYYY-MM-DD
    * Website: http://www.olay.com.cn
    * Author: Ray Huang (Ray.Huang@nurun.com)
    * Description: all css

    == STRUCTURE: ==============================
    * 
    * 
    ============================================
	 word-break:break-all; //强制换行
*/
#nav { width:630px; height:36px; padding:0; margin:0; position:relative; z-index:200;}
	#nav li { height:30px; float:left;}		
	#nav li.first { position:relative;}
		#nav li a { height:30px; float:left; text-indent:-1000em; text-decoration:none; white-space:nowrap; background-image:url(../img/nav.gif); background-repeat:no-repeat;}
		
		a.home { width:59px; background-position:-7px 0;}
		a.brand { width:106px; background-position:-66px 0;}
		a.promotion { width:84px; background-position:-172px 0;}
		a.product { width:89px; background-position:-256px 0;}
		a.diagnoses { width:106px; background-position:-345px 0;}
		a.freetrial { width:86px; background-position:-451px 0;}
		a.onlineshop { width:85px; background-position:-537px 0;}
		
		li.current a.home,a.home:hover { background-position:-7px -30px;}
		li.current a.brand,a.brand:hover { background-position:-66px -30px;}
		li.current a.promotion,a.promotion:hover { background-position:-172px -30px;}
		li.current a.product,a.product:hover { background-position:-256px -30px;}
		li.current a.diagnoses,a.diagnoses:hover { background-position:-345px -30px;}
		li.current a.freetrial,a.freetrial:hover { background-position:-451px -30px;}
		li.current a.onlineshop,a.onlineshop:hover { background-position:-537px -30px;}


		#nav li li { width:180px; height:32px; float:left; border-bottom:1px #fff solid;}
		* html #nav li li {float:left;}
		
		#nav li li a { width:180px; height:32px; display:block; float:none; color:#000; text-indent:0; background-color:#dadada; background-image:none;}
		#nav li li a:hover { color:#fff; background-color:#555;}
		
		#nav li li li a { width:143px; line-height:32px; background:#a6a5a5;}
		#nav li li li a span { padding:0 0 0 30px;}
		#nav li li li li { width:190px;}
		#nav li li li li a { width:190px; background:#807f7f;}
		#nav li li li li a span { padding:0;}
		
		#nav a.othersub { line-height:32px;}
		#nav a.othersub span { padding:0 0 0 20px;}
		
		#nav img { width:30px; height:30px; float:left; margin:0 10px 0 0;}
		#nav a.pordsort { color:#727171;}
		#nav a.prodsort span.en { width:100px; height:12px; float:left; line-height:12px; font-size:10px; font-family:Arial, Helvetica, sans-serif;}
		#nav a.prodsort span.cn { height:18px; float:left; line-height:18px;}
		#nav a.styles { width:143px; background:#a6a5a5 /*url(../img/icon-nav-arrow-gray.gif) 110px center no-repeat*/;}
		#nav a.styles:hover { background:#555 /*url(../img/icon-nav-arrow-white.gif) 110px center no-repeat*/;}

 		
.second, .third, .fouth { display:none;}
.second { width:180px; clear:both; position:absolute; top:30px; left:0;}
.third { width:143px; position:absolute; left:-143px; z-index:200; }
.fouth { width:190px; position:absolute; left:-190px; z-index:202;}

#taobaoLink .second { width:179px; height:43px; overflow:hidden; right:0; left:auto;}
#taobaoLink .second img { width:auto; height:auto;}
