/*
	Serval content management project, http://serval.informdesk.int.ru/, (с) 2005-2008 Anton A. Baskov
*/

@import url('../../../serval/web/css/lib/reset.css');
@import url('../../../serval/web/css/lib/text.css');
@import url('../../../serval/web/css/lib/menu.css');
@import url('../../../serval/web/css/serval/common.css');

/*Test colors in inverted background*/
/*body {background: black !important;}*/


/* Heading Images */
div.LeadImages {
	display: block;
	color: white;
}
/* Heading Images - selector layout and design */
div.LeadImages dl dt {
	border: dashed 1px grey;
	
	display: block;
	position: relative;
	z-index: 2;

	float: left;
	left: 85%;
	margin-right: 0.5em;
	
	font-size: 200%;
	background-color: Black;
}
div.LeadImages dl dt:hover{
	border-style: solid;
}
xdiv.LeadImages dl dt + dt {
	xleft: 20px;
}

/* Heading Images - content layout */
div.LeadImages dl dd {
	width: 100%;
	position: relative;

	float: right;
	margin-left: -100%;
}
div.LeadImages dl dd .image {
}
div.LeadImages dl dd .image img{
	max-width: 100%;
}
div.LeadImages dl .content {
	position: fixed; z-index: 3;
	max-height: 90%; width: 30%; overflow: hidden;
	margin-top: 0.5em; margin-left: 0.5em;
	padding: 0.5em;
	
	width: auto;
	max-width: 30%;
	xposition: relative;
	xfloat: right;
	xdisplay: block;
	
	background: url(/wwf-beige.png);
	color: Black;

}
div.LeadImages dl .content .description {
	font-size: 115%; line-height: 1.3;
}
div.LeadImages dl .content .title {
	font-size: 190%;
	margin-top: 0.5em; margin-bottom: 0.5em;
	
	xfont-family: "xWWF Font", "xGill Sans MT Condensed", "xFranklin Gothic Medium Condensed", "Arial Narrow", Arial, Helvetica, sans-serif;
	xfont-size:54px;
	xline-height: 60px;
}
div.LeadImages dl .content:hover {
	x-background-color: #0F0F0F;
	background: url(/wwf-beige.png);
}


/* Heading Images - image visibility */
div.LeadImages dl dd {
	display: block;
}
div.LeadImages dl dd + dt + dd {
	display: none;
}
div.LeadImages dl dd:hover {
	display: block;
}
div.LeadImages dl dt:hover + dd {
	display: block;
}

/* Heading Images - same for content */
/* Because we use fixed for inner content block,
 we can't leave first two rules same as previous - 
 two fixed blocks overlaps in this case. 
 Need a litte workaround: two different rules 
 for cursor outside our area and inside. */
div.LeadImages dl dd .content {
	display: block;
}
div.LeadImages dl dd + dt + dd .content {
	display: none;
}
div.LeadImages dl:hover dd .content {
	display: none;
}
div.LeadImages dl:hover dd + dt + dd .content {
	display: none;
}
div.LeadImages dl:hover dd:hover .content {
	display: block;
}
div.LeadImages dl:hover dt:hover + dd .content {
	display: block;
}



body {
	font-size: 9.5pt;
	xfont-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	xfont-family: Arial, Helvetica, sans-serif;
	xfont-family: Trebuchet MS, Arial, Sans-Serif;
	xfont-family: Georgia, Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-family: Lucida Grande, Arial, Sans-Serif;
}
body			{ color: #585858; }
body a			{ color: #585858; }
body a:hover	{ color: #585858; }
#header, #footer, #main-container  {
	width: 80%;
	min-width: 850px;
	margin: 0em auto 0em auto;
}
#header {
	xborder-bottom: solid 3px #FFCC00;
	xborder-bottom: dashed 1px #e3c797; 
	xbackground-color: #39587e;
	xbackground-color: #303030;/*#303030;*/
	background-color: #5b4f41;

	padding-top: 2em;
	padding-bottom: 1em;
	margin-bottom: 1em;
	padding-left: 10em;
}

#header .title, #header .subtitle {
	color: white;
}
#header .title a, #header .subtitle a {
	color: white;
	text-decoration: none;
}
#header .title {
	font-size: 180%;
	line-height: 140%;
}
#header .subtitle {
	font-style: italic;
}
#header .header-navigation-menu {
	float: right;
	margin: 2em 2em 0em 2em;
}

#footer {
	margin-top: 1.5em;
	padding-top: 0.5em;
	padding-bottom: 0.8em;

	border-top: dashed 1px #5b4f41;

	font-size: 85%;
	text-align: center;
}
#footer > div {
	margin: 0em auto 0em auto;
}
#footer > div > div.logos{
	float:left;
	border-right: dashed 1px #5b4f41;
}

/* ==== Распределение на блоки ==== */
#main-left {
	clear: left;
	float: left;
	width: 22%;
}
#main-center {
	clear: none;
}
#main-center > * {
	width: 90%;
}


/* ==== Центральная часть ==== */
div.headingImage {
	margin-top: 0.3em;
	max-height: 250px;
	max-width: 100%;
	text-align: center;
}
div.headingImage img {
	max-width: 100%;
}


/* === Текстовое поле === */
.content {
	margin: 0.1em 0.6em 0.6em 0.8em;
}
.content h1,h2,h3,h4,h5,h6 {
	color: #585858;
}
.icsContentText a {
	border-bottom: dashed 1px #585858;
}
.icsContentText a:hover {
	text-decoration: none;
	border-bottom-style: solid;
}
.icsContentText #_TOC+ol a {
	border-bottom: none;
}
.icsContentText #_TOC+ol a:hover {
	text-decoration: underline;
}

/* ==== Правая часть ==== */
.colorStrip {
	clear: both;
	height: 5px; background: #39587e;
}

/* ==== Панель меню ==== */
div.navigation-menu ul.vertical-menu ul						{ margin-left: 0.85em; }
div.navigation-menu ul.vertical-menu li a					{ line-height: 160%; padding-left: 0.05em; padding-right: 0.05em; }
div.navigation-menu ul.vertical-menu li.toplevel			{ display: block; }
div.navigation-menu ul.vertical-menu li.toplevel > a		{ display: inline; font-size: 120%; border-bottom: dashed 1px #585858; padding-top: 1.5em; }
div.navigation-menu ul.vertical-menu li.toplevel > a:hover	{ text-decoration: none; }
div.navigation-menu ul.vertical-menu li.genus > a			{ }
div.navigation-menu ul.vertical-menu li.species > a			{ font-style: italic; }
div.navigation-menu ul.vertical-menu li.current > a			{ }
div.navigation-menu ul.vertical-menu li.currentPath > a		{ }
div.navigation-menu ul.vertical-menu li.current > a			{ font-weight: bold; color: #db4802; }

div.header-navigation-menu ul.horizontal-menu								{ font-size: 110%; }
div.header-navigation-menu ul.horizontal-menu li							{ padding-left: 0.5em; padding-right: 0.5em; }
div.header-navigation-menu ul.horizontal-menu li > a						{ color: white; padding-left: 0.05em; padding-right: 0.05em; }
div.header-navigation-menu ul.horizontal-menu li > a:hover					{ text-decoration: none; }
div.header-navigation-menu ul.horizontal-menu li > a:hover,
div.header-navigation-menu ul.horizontal-menu li.current > a				{ border-bottom: dashed 1px white; }
div.header-navigation-menu ul.horizontal-menu:hover li.current > a			{ border-bottom: inherit; }
div.header-navigation-menu ul.horizontal-menu:hover li.current > a:hover	{ border-bottom: dashed 1px white; }