@charset "utf-8";
body
,div
,dl
,dt
,dd
,ul
,ol
,li
,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
    margin:0;
    padding:0;
    font-family: Helvetica;
    font-size: 12px;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
fieldset,img {
    border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-style:normal;
    font-weight:normal;
}

ol,ul {
    list-style:none;
}

caption,th {
    text-align:left;
}
h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:normal;
} 

/* CSS Document */

body, html
{
	margin:0; padding:0; 
	font-size:12px;
}

body
{
	background: #000 repeat-x 0 0;
	text-align:center;
	color:#fff;
}

.clear{ clear:both; }
.right{ text-align:right; }
.left { text-align:left; }
.center { text-align:center; }

ul 
{
	padding:0;
	margin:0;
	
}

/* -------------------------------------------------------------- 
   Typography
-------------------------------------------------------------- */

/* This is where you set your desired font size. The line-heights 
   and vertical margins are automatically calculated from this. 
   The percentage is of 16px (0.75 * 16px = 12px). */
body { font-size: 75%; line-height: 1.5; }


/* Default fonts and colors. */
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,input,textarea { font-family: Helvetica, Arial, sans-serif; }


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-weight: bold; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; margin-bottom: 1.5em; }
h6 { font-size: 1em; }


/* Text elements
-------------------------------------------------------------- */

p { margin: 0 0 1.5em; }

ul, ol { margin: 0 1.5em 1.5em 1.5em; }
ul { list-style-type: circle; }
ol { list-style-type: decimal; }

dl { margin: 0 0 1.5em 0; }
dl dt { font-weight: bold; }
dl dd { margin-left: 1.5em; }

abbr, acronym { border-bottom: 1px dotted #000; }
address { margin-top: 1.5em; font-style: italic; }
del { color: #000; }

a { color: #009; text-decoration: none; }
a:hover { text-decoration: underline; }

blockquote { margin: 1.5em; }
strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
pre, code { margin: 1.5em 0; white-space: pre; }
pre, code, tt { font: 1em monospace; line-height: 1.5; } 
tt { display: block; margin: 1.5em 0; line-height: 1.5; }
span.amp { /* For better-looking ampersands */
  font-family: Baskerville, Palatino, "Book Antiqua", serif;
  font-style: italic;
}

.clearfix:before, .clearfix:after {  content: "\0020"; display: block; height: 0; visibility: hidden;  }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

a
{
	outline:none;
}

/* STRUCTURE */

#container 
{
	width:960px;
	margin:0 auto;
	text-align:left;
	position:relative;
	line-height:1.6 !important;
}

	#header
	{
		height:122px;
		background:url(../images/accueil.jpg);
		margin-top:10px;
		z-index:600;
	}
	
		#header ul
		{
			float:right;
			list-style-type:none;
			margin:0;
		}
		
			#header li
			{
				margin-botton:2px;
			}
			
				#header a
				{
					display:block;
					width:20px;
					height:20px;
					text-indent:-9999px;
					overflow:hidden;
				}
				
					#header .fr { background:url(../images/flag_france.png) no-repeat; }
					#header .en { background:url(../images/flag_uk.png) no-repeat; }
					#header .es { background:url(../images/flag_spain.png) no-repeat; }
					#header .it { background:url(../images/flag_italy.png) no-repeat; }
	
	#navigation
	{
		position:relative;
		z-index:800;
	}
	
		#navigation:after
		{
			content:".";
			display:block;
			height:0;
			clear:both;
			visibility:hidden;
		}
			
			#navigation ul
			{
				padding:0;
				margin:0;
				position:relative;
			}
			
			/* -------- 1er niveau --------- */
			
			#navigation ul.primary
			{
				list-style-type: none;
				display:block;
				margin:0;
				padding:0;
				position:relative;
				z-index:800;
			}
		
			.navigation1 ul.primary
			{
				
			}
		
				.navigation1 ul.primary li
				{
					display:block;
					float:left;
					position:relative;
				}
	
					.navigation1 ul.primary li a
					{
						text-decoration:none;
						background-color: #58585a;
						border-width:2px;
						border-color:#ffcc00;
						border-style:solid;
						float: left;
						font-family: Verdana, Geneva, sans-serif;
						font-size:13px;
						padding:7px 7px;
						color:#ffffff;
						border-left:none;
					}
	
						.navigation1 ul.primary a:hover, .navigation1 ul.primary li.active a
						{
							background-color:#ffcc00;
							text-decoration:none;
							color:#000;
						}
						
						.navigation1 ul.primary a:active
						{
							background-color:#c5c6cc;
							text-decoration:none;
						}
			
			/* -------- 2nd niveau --------- */	
				
			#navigation ul.secondary
			{
				display:none;
				position:absolute;
				float:left;
				top:36px;
				left:-2px;
				background:#FFCC00;
				text-align:left;
				padding:6px 6px;
				width:180px;
				z-index:800;
			}
				
				#navigation li:hover ul.secondary, #navigation li.over ul.secondary
				{
					display:block;
				}
				
					#navigation ul.primary li:hover a, #navigation ul.primary li.over a
					{
						background-color:#ffcc00;
						text-decoration:none;
						color:#333;
					}
					
					#navigation ul.secondary li
					{
						display:block;
						float:none;
						padding:0;
						margin:0;
						color:#333;
						position:relative;
					}
						
						#navigation ul.secondary li a
						{
							display:block;
							float:none;
							width:auto;
							height:auto;
							background:none;
							border:none;
							padding:2px 6px;
							text-decoration:none;
							margin:0;
							z-index:800;
						}
							
							#navigation ul.secondary li a:hover, #navigation ul.secondary li:hover a
							{
								background-color:#58585A;
								color:#fff;
							}
							
							#navigation ul.secondary li.exp a
							{
								background:url(../images/submenu.jpg) no-repeat 95% 50%;
							}
							
								#navigation ul.secondary li.exp a:hover, #navigation ul.secondary li.exp:hover a
								{
									background:#58585A url(../images/submenu-hover.jpg) no-repeat 95% 50%;
								}
							
				
			/* ----------- 3eme niveau --------- */	
						
			#navigation ul.third
			{
				display:none;
				left: 180px;
				top: -6px;
				position:absolute;
				z-index:800;
				background:#FFCC00;
				text-align:left;
				padding:6px 6px;
				width:180px;
			}
			
				#navigation ul.secondary li:hover ul.third, #navigation ul.secondary li.over ul.third
				{
					display:block;
				}
				
					#navigation ul.third li a
					{
						background:none !important;
						color:#333 !important;
					}
					

						#navigation ul.third li a:hover, #navigation ul.third li:hover a
						{
							background-color:#58585A !important;
							color:#fff !important;
						}
						
						#navigation ul.third li.exp a
						{
							background:url(../images/submenu.jpg) no-repeat 95% 50% !important;
						}
						
							#navigation ul.third li.exp a:hover, #navigation ul.third li.exp:hover a
							{
								background:#58585A url(../images/submenu-hover.jpg) no-repeat 95% 50% !important;
							}
							
				
			/* ----------- 4eme niveau --------- */				
			#navigation ul.fourth
			{
				display:none;
				left: 180px;
				top: -6px;
				position:absolute;
				z-index:800;
				background:#FFCC00;
				text-align:left;
				padding:6px 6px;
				width:180px;
			}
			
				#navigation ul.third li:hover ul.fourth, #navigation li.over ul.fourth
				{
					display:block;
				}
				
					#navigation ul.third li.exp ul.fourth li a
					{
						background:none !important;
						color:#333 !important;
					}
					

						#navigation ul.third li.exp ul.fourth li a:hover, #navigation ul.third li.exp ul.fourth li:hover a
						{
							background-color:#58585A !important;
							color:#fff !important;
						}
					
						
			.navigation2
			{
				
			}
	
				.navigation2 li
				{
					display:inline;
					float:right;
				}
	
					.navigation2 li a
					{
						text-decoration:none;
						background-color: #58585a;
						border-width:2px;
						border-color:#ffcc00;
						border-style:solid;
						float: right;
						font-family: Verdana, Geneva, sans-serif;
						font-size:13px;
						padding:7px 7px;
						color:#ffffff;
						border-right:none;
					}
					
						.navigation2 a:hover, .navigation2 li.active a
						{
							background-color:#ffcc00;
							text-decoration:none;
							color:#000;
						}
						
						.navigation2 a:active
						{
							background-color:#c5c6cc;
							text-decoration:none;
						}

	#main 
	{	
		padding:24px 18px;
		height:668px;
		background-repeat:no-repeat;
		overflow:hidden;
		/*background-attachment:fixed;*/
		background-repeat:no-repeat;
		position:relative;
		z-index:10;
	}
	
		#mainScrollbarText
		{
			margin-left:-7px;
		}
	
		#content
		{
			width:902px;
		}
		
		.wsb #sidebar 
		{
			width:310px;
			float:left;
			height: 668px;
			overflow: auto;
		}
		
		.wsb #content 
		{
			width:586px;
			float:left;
			height: 668px;
			overflow: auto;
		}
		
		#ts1
		{
			
		}
	
	#footer 
	{
		border-width:2px;
		border-color:#ffcc00;
		border-style:solid;
		font-family: Verdana, Geneva, sans-serif;
		font-size:10px;
		font-style:italic;
		text-align:right;
		margin-left:auto;
		margin-right:auto;
		background: url(../images/bg-footer.jpg) no-repeat;
		padding:10px;
		color:#CCC;
		border-left:none;
		border-right:none;
	}
		
		#footer ul
		{
			margin:0;
		}
		
			#footer ul li
			{
				display:inline;
			}
			
			#footer ul li.sep
			{
				margin : 0 6px;
			}
			
				#footer ul li a
				{
					color:#fff;
					text-decoration:underline;
				}
				
				#footer ul li a:hover
				{
					text-decoration:none;
				}


/* CONTACT */

#mailform fieldset
{ 
	margin:0;
	padding:24px;
	border:2px solid #FFCC00;
	width:500px;
}

	#mailform .csc-mailform-field {padding:4px 0 8px;}

	#mailform label
	{
		display:block;
		float:left;
		cursor:pointer;
		width:120px;
		padding-bottom:4px;
	}

	#mailform input, #mailform textarea
	{
		background:none repeat scroll 0 0 #FAF7F7;
		border:1px solid #bbb;
		font-family:Arial,Helvetica,sans-serif;
		font-size:12px;
		padding:4px 5px;
	}

#mailform .submit, #mailform .csc-mailform-submit
{
	cursor:pointer;
	border:none;
	color:#444;
	margin-left:120px;
}

#mailform .submit:hover, #mailform .submit:focus, .csc-mailform-submit:hover, .csc-mailform-submit:focus 
{
	color:#eb929c;
}

#mailform .submit:active, .csc-mailform-submit:active
{

}

#mailform textarea
{
	line-height:normal;
}

/* PERSONNAGES */

#contentpersonnages
{
	position:relative;
}

#sidebarC
{
	position:relative;
	width:320px;
	float:left;
}

#sidebar 
{
	width:320px;
	float:left;
    height: 668px;
    overflow: auto;
}

	.perso 
	{
		cursor: pointer;
		float: left;
		height: 125px;
		padding: 15px;
		text-align: center;
		width: 125px;
	}
	
		.perso img
		{
			border:2px solid transparent;
		}
		
			.perso:hover img
			{
				border:2px solid #FDCC05;
			}
	
		.perso  p
		{
			color:#FFF;
			font-size:10px;
			font-style:italic;
			font-family:Verdana, Geneva, sans-serif;
		}

.scrollbar
{
    background: url(../images/barre.png) repeat-y -4px top;
    width: 24px;
	float:left;
	right: -5px;
}

	.scrollbar .handle
	{
		background: url(../images/blason.png) no-repeat;
		cursor: pointer;
		height: 37px;
		margin-left: -5px;
		width: 24px;
	}

#personnagesC
{
	float: left;
    height: 668px;
    margin-left: 36px;
    overflow: hidden;
    width: 550px;
}

#personnagesC .scrollbar
{
	right: -18px;
}

	#personnagesC .persoContent
	{
		 height: 668px;
		 overflow:hidden;
	}
	
		#personnagesC .persoContent img
		{
			float:left;
			margin:0 14px 14px 0;
		}

/* VIDEOS */

#videos
{
	
}

	#videos .item
	{
		
	}
	
		#videos .item a
		{
			border:2px solid transparent;
		}
		
			#videos .item a:hover
			{
				border:2px solid #FFCC00;
			}
	
		#videos .item span
		{
			display:block;
		}

/*

#col1fiefs {
	width:752px;
	font-size:13px;
	font-family: Verdana, Geneva, sans-serif;
	font-style:italic;
	color:#FFF;
	line-height:200%;
	text-align:left;
	margin-left:108px;
	margin-right:108px;
	}
	
.tilde {
	text-align:center;
	}
	
.arbre {
	margin-left:10px;
	width:940px;
	text-align:left;
	color:#FFF;
	height:auto;
	}
	
.arbrepic {
	width:270px;
	padding-top:10px;
	float:left;
	text-align:center;
	}

.arbreperso {
	width:670px;
	height:500px;
	float:left;
	background: url(../images/bqperso.png) repeat-x repeat-y;
	}

.arbretp {
	width:650px;
	height:25px;
	background:url(http://www.imalaspina.com/fileadmin/templates/image/arbretp.png);
	}
	
.arbrebt {
	width:650px;
	height:25px;
	background:url(../images/arbrebt.png);
	}

.ancien {
	padding:10px;
	float:left;
	}
.texteancien {
	width:490px;
	font-family:Verdana, Geneva, sans-serif;
	color:#FFF;
	float:left;
	margin-left:130px;
	}	
	
#col1 {
	width:325px;
	font-size:12px;
	font-family: Verdana, Geneva, sans-serif;
	font-style:italic;
	color:#FFF;
	line-height:200%;
	text-align:left;
	margin-left:60px;
	}
	
#col12 {
	width:195px;
	font-size:12px;
	font-family: Verdana, Geneva, sans-serif;
	font-style:italic;
	color:#FFF;
	line-height:200%;
	text-align:left;
	margin-left:10px;
	}
#col3 {
	position:absolute;
	font-family: Verdana, Geneva, sans-serif;
	top:0px;
	right:10px;
	}
	

	
#colperso1 p{
	color:#FFF;
	font-size:10px;
	font-style:italic;
	font-family:Verdana, Geneva, sans-serif;
	}
	
#dessous {
	width: 480px;
	height: 6000px;
	}

#personnage {
	float:left;
	width:310px;
	height:511px;
	background: url(../images/xli4ya.jpg) no-repeat;
	margin-top:50px;
	}
	
.perso {
	width:150px;
	height:150px;
	float:left;
	padding:15px;
	float:left;
	}
	
#barre {
	width:50px;
	height:600px;
	background: url(../images/barre.png) no-repeat;
	float:left;
	}
#blason {
	width:50px;
	height:50px;
	background: url(../images/barre.png);
}

#mainphoto {
	width:100px;
	height:auto;
	font-family:Verdana, Geneva, sans-serif;
	color:#FFF;
	padding:20px;
	text-align:center;
	float:left;
	background-color:#FFF;
	}
*/

.align-justify
{
	text-align:justify;
}

.mui-treetitle
{
	background:red;
}

.mui-tree
{
	padding:12px;
}

#mainScrollbarText
{
	z-index:790;
	right:2px;
}

.story #content li {
    padding-left: 22px;
	list-style:none;
	background:url(../images/li-normal.png) no-repeat 0 3px;
	margin-bottom:8px;
	text-decoration:none;
}

.story #content li.expandable {
	background:url(../images/li-expand.png) no-repeat 0 2px;
	cursor:pointer;
}

	.story #content li.expandable:hover
	{
		text-decoration:underline;
	}
	
	.story #content li.expandable:hover ul
	{
		text-decoration:none;
	}

.story #content li.collapsable {
	background:url(../images/li-collapse.png) no-repeat 0 2px;
}
/*
.story #content li > ul {
    display: none;
}
*/
.story #content li ul
{
	margin-top:10px;
}

.story #content li > ul.show {
    display: block;
}

.story #content li > ul.hidden {
    display: none;
}