/* @import url(flora-container.css);	/* YUI CSS file: Needed by flora-sample-dialog.css (see below) */

/* ----------------- GENERAL STYLES (RESET) ------------------ */
html, body {
	height:100%;
}
* {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	background: transparent;
}

/* :focus { outline:1; } */
ol, ul { list-style:none; }
html { 

	background: #81613b url(../media/images/global-bg.jpg) repeat-x left top;
}	
body { 
	text-align: center; 
	background: #81613b url(../media/images/global-bg.jpg) repeat-x left top;
	_height: 100%;
}
h1,h2,h3,h4,h5{
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, "Arial Narrow", Arial, Verdana, sans-serif;    
	font-weight: 300;
}
body.rtl #content-wrapper p .latin, 
body.rtl #content-wrapper li a .latin,
body.rtl #howtobuy #buy-intro h1 .latin {
	font-size:11px;
}
/* ------------- GENERAL COMPONENT STYLES (RESET) ----------- */
#aux-wrapper { 
/*	height: 580px;
	width: 960px;
	position: fixed;
	top: 50%;
	margin-top: -290px;
	_margin-top: 0;
	*position: relative;
	*top: expression(document.documentElement.offsetHeight/2);	/* This is not perfect for IE6. IE6 stays anchored to the same position at the bottom */
		height:580px;
/*	margin-top:-290px;
	_margin-top:0; 
	position:fixed;
	top:50%;*/
	width:960px;
	position:absolute;
	z-index: 1;

	
	
}
#aux-wrapper object {
	top:0px;
	position:absolute;
	_position:relative;
	_margin-top:-494px;
}

#vcenter {
	float:left;
height:50%;
margin:-295px 0 0;
visibility:hidden;
width:100%;
}

#content-wrapper {
/*	position: relative;
	margin: 0 auto;
	width: 960px;	
	text-align: left;*/
	height: 580px;	/* 580 = 494px + 76px + 10px (bottom P&G links) */
	z-index: 100;	/* It used to be 70, but after doing the integration with swfobject, a higher value was needed */

	text-align: left;
	height: 580px;	/* 494px + 76px + 10px (bottom P&G links) */
	z-index:70;		/* very important; don't remove */
	border:0 none;
	clear:both;
	margin:0 auto;
	position:static;
	top:-290px;
	width:960px;
	overflow:hidden;
	_overflow:visible;
}

#content-bg {
/*	position: absolute;
	_position:relative;*/
	width: 1200px;
 	overflow: hidden;
	height: 494px; 
	top: 0;
	margin: 0 0 0 0; 

	z-index: -1;
}

#flashObj {
/*	position: relative;*/
/*	left: -120px;*/
/*	_left:0;*/
/*	top:-494px;*/
}


/*** MAIN FLORA NAVIGATION ***/
#flora-navigation {
	position:absolute;
	left:120px;
	top:-15px;
	_top:5px;
}
#flora-navigation #logo {
 	position: absolute;
	top: 15px;
	top:30px;
	left: 60px;	/* 60px -if not placed inside the flash object */
	z-index: 1000;
}
body.rtl #flora-navigation #logo { left: 828px; }

#flora-navigation .flora-menu #skpnav {
	display: inline;
	position: absolute; 
	width: 150px;
	height: 12px;
	padding: 3px 0;
	left: -500em;
	text-align: center;
}

#flora-navigation .flora-menu {
	position: absolute;
	left: 154px;
	top: 52px;
	width: 850px;
}
#ar-flora-menu.flora-menu.edpmenu {left:433px; width:600px; top: 47px;}
#flora-navigation .flora-menu.arab {left:303px; width:600px; top: 47px; }
#flora-navigation ul#fr-flora-menu, #flora-navigation ul#de-flora-menu {
	width:900px;
}
.flora-menu li { display: inline; } 

.flora-menu li a { 
	display: block;
	float: left;
	width: 128px;
}
.flora-menu li a.fragrance { 
	width: 120px;
}

.flora-menu li a.collection { 
	width: 125px;
}
/*** SPECIAL LANGUAGE CASES ***/
.flora-menu li a#en-story { width: 150px; }
.flora-menu li a#en-downloads { width: 142px; }

#ar-flora-menu li a { width: 120px; }
#ar-flora-menu li a.collection { width: 80px; }
#ar-flora-menu li a.fragrance { width: 60px; }
#ar-flora-menu li a#en-story{ width: 125px; }
#ar-flora-menu li a#requestsample-link { width: 192px; }
#ar-flora-menu li a#en-downloads{ width: 130px; }

#it-flora-menu li a { width: 122px; }
#it-flora-menu #it-fragrance, #it-flora-menu #it-collection { width: 110px; }
#it-flora-menu li a#it-story { width: 150px; }
#it-flora-menu li a#requestsample-link { width: 192px; }

#fr-flora-menu li a { width: 106px; }
#fr-flora-menu #fr-discover { width: 124px; }
#fr-flora-menu #fr-story { width: 140px; }
#fr-flora-menu #fr-life { width: 165px; }
#fr-flora-menu li a#requestsample-link { width: 210px; }

#de-flora-menu li a { width: 130px; }
#de-flora-menu #de-fragrance { width: 90px; }
#de-flora-menu #de-collection { width: 125px; }
#de-flora-menu #de-story { width: 190px; }
#de-flora-menu #de-life { width: 145px; }
#de-flora-menu li a#requestsample-link { width: 210px; }

#menuline{
	position:absolute;
	top:48px;
	_top:65px;
	z-index:2;
	height:10px;
	_position:relative;

}

#flora-navigation.ef .flora-menu li a { width: 226px; }
#flora-navigation.ef  .flora-menu { width:915px; }

/* This section is not being used at the moment.
Continue at: FLORA SCROLLBAR */
/*** GUCCI LOGO & P&G LINKS CSS ***/
#gucci-menu-wrapper {
	position:relative;
	width:1200px;
 	z-index: 70;
	top:0;


}
#gucci-menu {
	position:relative;
	height: 45px;		/* 60px total (+ padding) */
	padding-top: 15px;
	width: 1034px;		/* same as gucci-menu-wrapper width minus the padding */
	padding-left: 166px;
	background: url(../media/system_images/main_nav_bg.png) repeat-x left top;
}
#gucci-menu #volume-control {
	position: absolute;
	top: 22px;
	right: 168px;
}
#gucci-menu #volume-control img{
	margin:0 10px;
	float: left;
}
#gucci-menu #volume-control a img#it-home.png{
	position:relative;
	top:3px;
	margin:0 7px;
}
#gucci-menu #volume-control #soundCTRL {
	/* inherits position attribute from #aux-wrapper object */
	position: relative;
	top: 1px;
	left: 0;
}

#gucci-menu #volume-control object{
	position:relative;
	_margin-top:0 !important;
}

#pg-links{
	height:20px;
	width:1200px;
	background-image: none;
	text-align:center;
	z-index:70;

	
}
/*#pg-links a, #pg-links span{
	color:#958260;
	text-decoration: none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	margin: 0 15px;
}*/
#pg-links a{
	color:#9a7e59;
	font-family:verdana;
	font-size:9px;
	text-decoration:none;
	padding:0;
	margin:0;
}

#pg-links.chinese a{
	font-size:11px;
}

#pg-links a:hover, #pg-links a:focus, #pg-links a:active { color:#e2cca9; }
body.rtl #pg-links { margin-top: 3px; }
body.rtl #pg-links a { font-size: 13px; }
/* ------------------------------------------------- */
	
/*** FLORA SCROLLBAR ***/
/* wrap to make sure that image area is clickable */
#scroll-wrap {
	position:absolute;
	right: 0;
	top: 0;
	width: 15px;
	height: 411px;
	background: transparent url(../media/images/flora-by-gucci/scroll_bg.gif) repeat-y left top;
}
/* vertical track */
#scroll-track {
	position: absolute;
	width: 12px;
	height: 411px;
}
/* vertical track handle */
#scroll-handle {
	width: 12px;
	height: 217px;
	cursor:pointer;	
}

/*** LVHA & FOCUS ***/
#flora-navigation .flora-menu #skpnav:focus, #flora-navigation .flora-menu #skpnav:active {
	position: absolute;
	top: 3.2em;
	left: 0; 
	background-color: #ffffff;
	color: #666f77;
	border: solid #787878 2px;
}

.flora-menu li a:hover, 
.flora-menu li a:focus, 
.flora-menu li a:active,
.flora-life-sub li a:hover,
.flora-life-sub li a:focus, 
.flora-life-sub li a:active {
	color: #000000;
}


/* ----------------- TYPE STYLES  ------------------ */
.flora-menu li a, .flora-life-sub li a {
	text-transform: uppercase;
	text-decoration: none;
	font: 0.63em verdana, arial, helvetica, sans-serif;
	letter-spacing: 0.01em;
	color: #484848;
}
body.rtl .flora-menu li a,
body.rtl .flora-life-sub li a,
body.rtl #content ul.flora-life-sub li span.smfont {
	font-size: 15px;
	font-family: verdana, arial, helvetica, sans-serif;
}
body.rtl #content ul.flora-life-sub li span.smfont { margin-right:0; }


.flora-menu.chinese li a, .flora-life-sub.chinese li a {
	font: 12px verdana, arial, helvetica, sans-serif;
	
}

#content ul.flora-life-sub li span.smfont {
	font-size:0.63em;
}

#content ul.flora-life-sub li span.smfont {
	font-family:verdana,arial,helvetica,sans-serif;
	color:#000000;
	font-size:0.63em;
	font-size-adjust:none;
	font-stretch:normal;
	font-style:normal;
	font-variant:normal;
	font-weight:normal;
	letter-spacing:0.01em;
	line-height:normal;
	text-decoration:none;
	text-transform:uppercase;
	margin-right:15px;
}

#content ul.flora-life-sub.chinese li span.smfont {
	font-size:12px;
}

#content {
	font-family: verdana, arial, helvetica, sans-serif;
	color: #212121;
}
#content h1 {
	margin-bottom: 0;
	letter-spacing: 0;
}
#content h2 {
	font-size: 0.9em;
	letter-spacing: 0;
	margin-bottom: 0.3em;
	margin-top: 1.4em;
}
#content p {
	margin: 0.5em 0;
	font-size: 0.7em;
	line-height: 1.5em;
}
#life.rtl #content h2 { font-size: 18px; }
body.rtl #content p{ font-size: 15px; }

/* ------------------- AD-DIALOGS ------------------  */
#floraads1.noVis, #floraads2.noVis, #floraads3.noVis, #floraads4.noVis {
	/* visibility: hidden was changed to display: none to fix a bug in IE6 */
	display: none; 
}
#floraads1 .bd, #floraads2 .bd, #floraads3 .bd, #floraads4 .bd {
	/* After changing visibility: hidden to display: none, YUI will now compute a height two times 476 so now we must force the body of the panel to have the height that we need. */
	height: 476px !important; 
}
#floraads1 .bd img, #floraads2 .bd img, #floraads3 .bd img, #floraads4 .bd img {
	/* Fix for IE6 (does not harm the other browsers). 
	If removed, the background color of .yui-skin-sam .yui-panel .bd will show at the bottom of the ads (10px strip) */
	float: left; 
}

/* ------------------- BUY-DIALOG ------------------  */


/* Buy Button */
#howto-buy {
            position: absolute;
            top: 445px;
            left: 618px;
            display: block;
            height: 24px;                 /* Sets the height for the buy button */
            text-decoration: none;
			z-index: 50;
}
#howto-buy.zhbuy{
	width:100px;
}
#howto-buy:hover { cursor: pointer; }

#howto-buy .buyLeft {
            float: left;
            width: 10px;
            height: 24px;
            background: url(../media/images/flora-by-gucci/buy-left.gif) no-repeat left top;
}
#howto-buy .edpBuyLeft { background-image: url(../media/images/flora-by-gucci/edp-buy-left.gif); }

#howto-buy .buyLabel {
            float: left;
            height: 24px;
            padding: 0 5px;
            line-height: 24px;           /* This line-height is affected by the font-size. With font-size: 12px, It needs to be 2px bigger than the line-height for .buyRight. */
            background: url(../media/images/flora-by-gucci/buy-middle.gif) repeat-x left top;
            font-family: verdana,arial,helvetica,sans-serif;
            font-size: 12px;
            color: #784d0e;
}
body.rtl #howto-buy .buyLabel { font-size: 16px; }
#howto-buy .buyRight {
            float: left;
            height: 24px;
            width: 10px;
            line-height: 24px;           /* Needs to be the same value as the height for #howto-buy */
            background: url(../media/images/flora-by-gucci/buy-right.gif) no-repeat left top;
}
#howto-buy .edpBuyRight { background-image: url(../media/images/flora-by-gucci/edp-buy-right.gif); }

#howtobuy.noVis {
	/* visibility: hidden was changed to display: none to fix a bug in IE6 */
	display: none; 
}

#howtobuy {
	height: 475px;
	background-color: #755634;
	position: relative;
}
#howtobuy #buy-intro { 
	position: absolute; 
	width: 302px;
	text-align: right;
	margin-top: 188px;
}
#howtobuy #buy-intro h1, #howtobuy #buy-intro p, #howtobuy #buy-country-list h2 {
	margin: 0;
	padding: 0;
	font-size: 0.7em;
	font-family: verdana, arial, helvetica, sans-serif;
	color: #ffcc9a;
}
#howtobuy #buy-country-list li a {
	font-size: 0.7em;
	font-family: verdana, arial, helvetica, sans-serif;
	color: #c1a67e;
	text-decoration: none;
}

#howtobuy #buy-intro h1 { margin-bottom: 4px; }
#howtobuy #buy-country-list { 
	position: absolute; 
	width: 302px; 
	left: 392px; 
	margin-top: 67px; 
}
#howtobuy #buy-country-list h2 { margin-top: 20px; margin-bottom: 6px; }
#howtobuy #buy-country-list ul { margin-left: 15px; }

body.rtl #howtobuy h1,
body.rtl #howtobuy p,
body.rtl #howtobuy li,
body.rtl #howtobuy h2 {
	direction: rtl;
	text-align: right;
}

body.rtl #howtobuy #buy-country-list { width: 130px; margin-top: 50px; }
body.rtl #howtobuy #buy-country-list ul {
	margin-left: 0;
	margin-right: 15px;
}
body.rtl #howtobuy #buy-intro h1,
body.rtl #howtobuy #buy-intro p,
body.rtl #howtobuy #buy-country-list h2,
body.rtl #howtobuy #buy-country-list li a { font-size: 15px; }

body.rtl #howtobuy #buy-country-list-men-ar { 
	width: 130px;
	margin-top: 50px;
}
body.rtl #howtobuy #buy-country-list-men-ar ul {
	margin-left: 0;
	margin-right: 15px;
}

body.rtl #howtobuy #buy-country-list-women-ar { 
	width: 130px;
	margin-top: 50px;
}
body.rtl #howtobuy #buy-country-list-women-ar ul {
	margin-left: 0;
	margin-right: 15px;
}


/* ---------------- MISCELLANEOUS ----------------- */
#index .altEDT, #index .altEDP {
	display: block;
	position: relative;
	left: 895px;
	height: 70px;
	width: 155px;
}
#index.rtl .altEDT, #index.rtl .altEDP {
	left: 910px;
	width: 140px;
}
#index .altEDT { top: 100px; }
#index .altEDP { top: 60px; }

#index .altEDP { 	
	top: 410px; 
	display: block;
	position: absolute;
	left: 930px;
	height: 70px;
	width: 100px;
}

#index .altFlora.zh { left:900px; top: 400px; width:150px; } 

#index .altFlora { 	
	top: 410px; 
	display: block;
	position: absolute;
	left: 820px;
	height: 70px;
	width: 100px;
}

#altcontent { 
/*	position:absolute;
	top:0px;
	left:0px;
	width:1000px;
	height:400px;
	display:block;*/
	z-index:10;
	position:relative;
	*position:absolute;
	*margin-top:-494px;
	_margin-top:-513px;



}

.flora-jScrollPane .jScrollPaneContainer {
	height:414px !important;	
}

.jScrollPaneContainer {
	top:80px;
	position:relative;
	left:120px;	
}

#no-scroll-wrapper {
	height:600px;
	width:1202px;
/*	overflow-y:hidden;*/
	margin-left:-120px;
	_margin-left:0px;
/*	_overflow:visible;*/
}
#aux-wrapper #flashObj object {
/*	display:none;
	*display:block;*/
}
#content-wrapper #content {
	margin-bottom:5px;
}

.missing { color: #f00; }

/* For left-to-right languages, such as Arabic */
body.rtl #flora-navigation, body.rtl #content, body.rtl #pg-links{
	direction:rtl;
}
body.rtl #content h1, body.rtl #content h2, body.rtl #content p, body.rtl #content ul.flora-life-sub{
	text-align: right;
}
body.rtl #content h2{
	font-size:18px;
}
.missing { color: #f00; }

/* For chinese we need a bigger font */
body.chinese #content p{
	font-size: 12px;
}

body.chinese #content h2{
	font-size: 15px;
}

body.chinese #content ul{
	font-size: 15px;
}