body {
  background: #EFEDEE; 
  color: #F1F5F4; 
  scrollbar-3d-light-color: #cecece;
  scrollbar-arrow-color: #bebebe;
  scrollbar-base-color: #bebebe;
  scrollbar-dark-shadow-color: #DCDCDE;
  scrollbar-face-color: #DCDCDE;
  scrollbar-highlight-color: #DCDCDE;
  scrollbar-shadow-color: #DCDCDE;
}
 
A:link { COLOR: #404040 }
A:visited { COLOR: #404040 }
A:hover { COLOR: #D45000}
A{text-decoration: none;}
A.yellow:link { COLOR: #E0B834 }
A.yellow:visited { COLOR: #E0B834 }
A.yellow:hover { COLOR: #E0B834 }

a.white{ COLOR: #DCDFC9 }

a.whiteBig{ COLOR: #DCDFC9;
			font-size: 18px;
		}
a.opennew{ COLOR: #8F865E;
			font-size: 9px;
		}
a.copy{ COLOR: #ffffff;
			font-size: 11px;
			/*font-weight: bold;*/
		}		

a.mucemHead{ COLOR: #C7C7C7 }
a.mucemHead:hover { COLOR: #D45000 }
 
 #general{
	background: #EFEDEE;
	color: #C7DAF1;
    margin: 0 auto;
    width: 1000px;
	margin-top: 0;
	padding:0px;
	/*border: 1px solid #C5C0AD;*/
	font-family:arial;
	text-align:center;
}

#enterImg{
	position:fixed; top:4px; margin:2px 0 0 -40px;
	/*background: #969E89;*/
   /*background: rgb(83, 73, 39);*/ /* Fall-back for browsers that don't support rgba */
   /* background: rgba(83, 73, 39, .85);*/
	
	background: #DAD8C7;
	margin: 0 auto;
	margin-top: 0px;
	padding:0px;
	padding-left:150px;
 	padding-top:6px;
    width: 850px;
	height:25px;
	border: 1px solid #C5C0AD;
	font-family:arial;
	z-index:2;
	color: #675411;
	font-weight:bold;
	font-size: 100%;
	letter-spacing: 0.05em  ;
	text-align:left;
	vertical-align:middle;
	/*color: #EFEDEE;*/
	color: #3B5544;
}

div.communeData{ 
       position: absolute;
	   margin: 0 auto;
	   margin-top: 0px;
	   top:35px;
	   left: 0px;
 	   padding:8px;
	   padding-left:150px;
	   width: 1000px;	   
       font-family: Arial, Times, serif ; 
	   text-align: left; 
	   font-size: 95%;     
       font-weight: bold; color: #524C4E;
	   background: #EFEDEE;
}
div.communeSubData{ 
       position: absolute;
	   top:55px;
       left:145px;	   
	   padding:8px;
       font-family: Arial, Times, serif ; text-align: left; font-size: 85%;     
       font-weight: normal; color: #524C4E;
}
#footerPosition{
	/*position:fixed; */
	position:relative;
	top:100px;
    margin: 0 auto;
	margin-top: 0px;
	padding:0px;
    width: 1000px;
	height:15px;
	font-size: 65%;
	color: #C5C0AD;
	letter-spacing: 0.05em;
	border-top: 1px dotted #C5C0AD;
	z-index:1;
	text-align:center;
}
div.thumbsForObjects{ 
       position: relative;
	   margin-top: 5px;
	   margin-bottom: 10px;
	   padding:0px;
       font-family: Arial, Times, serif ; text-align: left; font-size: 80%;     
       font-weight: normal; 
	   color: #524C4E;
	   z-index:2;
	   display: inline-block;
	   width:415px;
}

div.mucemExpand{ 
    position: relative;
	top:0px;
    left:0px;	
	padding:3px;	   
	padding-left:6px;
    font-family: Arial, Times, serif ; 
	font-size: 100%;     
    font-weight: normal;
	display: inline-block;
	background-color: #8F865E;
	border-radius: 11px;
	width:425px;
	color:#C7C7C7;
	margin-left: 0px; /*pour bloquer l'ensemble menu par rapport a la gauche */
	white-space : normal;
	min-height: 70px; /* hauteur du parent */
	line-height: 70px; /* hauteur de ligne (identique) */
	vertical-align: middle; 
	text-align: left; 
}
div.metierExpand{ 
    position: relative;
	top:0px;
    left:0px;	
	padding:3px;
	padding-left:6px;	
    font-family: Arial, Times, serif ; 
	font-size: 100%;     
    font-weight: normal;
	display: inline-block;
	background-color: #D0C99D;
	border-radius: 11px;
	width:425px;
	color:#4D4D4D;
	margin-left: 0px; /*pour bloquer l'ensemble menu par rapport a la gauche */
	white-space : normal;
	min-height: 70px; /* hauteur du parent */
	line-height: 70px; /* hauteur de ligne (identique) */
	vertical-align: middle; 
	text-align: left; 
}
div.edificesExpand{ 
    position: relative;
	top:0px;
    left:0px;	
	padding:3px;
	padding-left:6px;	
    font-family: Arial, Times, serif ; 
	font-size: 100%;     
    font-weight: normal;
	display: inline-block;
	background-color: #8B93A2;
	border-radius: 11px;
	width:483px;
	color:#4D4D4D;
	margin-left: 0px; /*pour bloquer l'ensemble menu par rapport a la gauche */
	white-space : normal;
	min-height: 70px; /* hauteur du parent */
	line-height: 70px; /* hauteur de ligne (identique) */
	vertical-align: middle; 
	text-align: left; 
}
div.objectSpacer{
	   position: relative;
	   top:0px;
       left:0px;	
	   padding:3px;	
	   width:425px;		   
	   margin-bottom: 0px;	   	   
}
div.ObjectDetail{ 
       position: relative;
	   top:2px;
       left:11px;	
	   padding:3px;	
	   width:425px;		   
	   margin-bottom: 15px;	   	   
       font-family: Arial, Times, serif ; 
	   text-align: left; 
	   font-size: 83%;     
       font-weight: normal; 
	   color: #524C4E;
	   /*background: rgb(245,245,245);*/
}
div.MetierDetail{ 
       position: relative;
	   top:2px;
       left:31px;	
	   padding:3px;	
	   width:425px;		   
	   margin-bottom: 15px;	   	   
       font-family: Arial, Times, serif ; 
	   text-align: left; 
	   font-size: 83%;     
       font-weight: normal; 
	   color: #524C4E;
	   /*background: rgb(245,245,245);*/
}
div.imageInOverlay{ 
    position: relative;
	top:6px;
	width:424px;
	text-align: center; 
}

div.embeddedImagePosition{ 
	   position: relative;
	   top:6px;
	   left:50%;
	   margin-left:-190px;   /* half of width*/
	   margin-bottom: 15px;
	   min-height:16px;
	   width:380px;
       font-family: Arial, Times, serif ; 
	   text-align: left; 
	   font-size: 100%;     
       font-weight: bold; 
	   color: #eeeeee;
	   z-index:2;
	   background-color:#D3D0BB;
	   text-align:center;
}

#legend{
	position:relative;
	margin-left: 15px;
	margin-top: 15px;
	margin-bottom: 15px;
	text-align: left; 
	font-size: 95%;      
	color: #797878;
}

div.objectEmpty{ 
    position: relative;
	top:0px;
    left:0px;	
	padding:3px;	   
	padding-left:6px; 
	font-family: Arial, Times, serif ; 
	font-size: 100%;     
    font-weight: normal;
	display: inline-block;
	background-color: #E1E1E1;
	border-radius: 11px;
	border: 1px dotted #ffffff;
	width:425px;
	color:#4D4D4D;
	margin-left: 0px; /*pour bloquer l'ensemble menu par rapport a la gauche */
	white-space : normal;
	min-height: 70px; /* hauteur du parent */
	line-height: 70px; /* hauteur de ligne (identique) */
	vertical-align: middle; 
	text-align: left; 
}

div.artefact{ 
       position: relative;
	   top:4px;
       left:20px;	
	   padding:2px;	   
	   /*background-color:rgba(0,0,0,0.15);*/
       font-family: Arial, Times, serif ; 
	   text-align: left;   
       font-weight: normal; color: #524C4E;
}

div.artefactSubContent{ 
       position: relative;
	   padding:4px;	  
	   width:450px;
	   top:0px;
	   left:26px;
	   color:#524C4E;
	   font-size: 90%;
}

div.metier{ 
       position: relative;
	   top:4px;
       left:19px;	
	   padding:2px;	   
	   /*background-color:rgba(0,0,0,0.15);*/
       font-family: Arial, Times, serif ; 
	   text-align: left;   
       font-weight: normal; color: #524C4E;
}

div.metierSubContent{ 
       position: relative;
	   padding:4px;	  
	   width:450px;
	   top:0px;
	   left:25px;
	   color:#524C4E;
	   font-size: 80%;
}
div.metierSources{ 
       position: relative;
	   padding:4px;	  
	   width:450px;
	   top:0px;
	   left:15px;
	   color:#524C4E;
	   font-size: 100%;
}

span.artefactName:hover{      
       font-weight: bold; color: #524C4E;
	   /*background-color:rgba(0,0,0,0.15);*/
}
span.artefactSelected{      
       font-weight: bold; color: #524C4E;
	   /*background-color:rgba(0,0,0,0.15);*/
}
span.artefactUnSelected{      
       font-weight: normal; color: #524C4E;
	   /*background-color:rgba(0,0,0,0.15);*/
}

div.artefactFurtherDetail{ 
	   position: relative;
	   top:6px;
	   left:0px;
	   margin-bottom: 14px;
	   min-height:14px;
	   width:380px;
       font-family: Arial, Times, serif ; 
	   text-align: left; 
	   font-size: 100%;     
       font-weight: bold; 
	   color: #eeeeee;
	   z-index:2;
	   background-color:#D3D0BB;
	   text-align:center;
}
div.communeFurtherDetail{ 
	   position: relative;
	   top:6px;
	   left:0px;
	   margin-bottom: 14px;
	   min-height:14px;
	   width:380px;
       font-family: Arial, Times, serif ; 
	   text-align: left; 
	   font-size: 100%;     
       font-weight: bold; 
	   color: #eeeeee;
	   z-index:2;
	   background-color:#D3D0BB;
	   text-align:center;
}

#movablecellscontainer{ 
	position:relative;
	margin: 0;
	padding: 0px;
	top: 85px;
	/*background: #E5E1E1;*/
	max-width: 1000px;    /* max_width and not width if you want to have text contenf of the two cells modified when resizing the window*/
	min-height:590px;
	/*border: 1px solid #FFAAAA;*/
	color: #111111;
	font-family:arial;
	z-index:1;
	overflow-y: auto;
	overflow-x: hidden;
}

#leftcell{
	float:left;
    margin-left:0px;
	padding:2px;
    width: 444px;
	min-height:370px;
	/*border: 1px solid #C5C0AD;*/
	/*text-align:center;*/
	font-size: 80%;
	overflow-y: auto;
	overflow-x: hidden;
}
/* if this one is positioned as relative then will go to next line, after leftcell*/

#rightcellMaps{
	margin-left:480px;
	padding:0px;
	min-height:370px;
	/*border: 1px solid #C5C0AD;*/
	font-family:arial;
	font-size: 80%;
	width: 520px;
	text-align:left;
}

div.embeddedMapPosition{ 
       position: relative;
	   margin-top: 0px;
	   left:0px;
	   padding:8px;
       font-family: Arial, Times, serif ; text-align: left; font-size: 85%;     
       font-weight: bold; color: #eeeeee;
	   z-index:2;
	   background: rgb(83, 73, 39); /* Fall-back for browsers that don't support rgba */
	   background: rgba(83, 73, 39, .83);
	  /* width: 499px;*/
	   /*height: 370px;*/
	   /*min-height:360px;*/
	   visibility:visible;
}

img { 
	vertical-align:middle;
}

img.agriculture { 
	background-color:#8A9E5A;
	width:12px;
	height:12px;
	opacity:0.7;
}
img.elevage { 
	background-color:#E55933;
	width:12px;
	height:12px;
	opacity:0.7;
}
img.cueillette { 
	background-color:#E9C417;
	width:12px;
	height:12px;
	opacity:0.7;
}
img.chasse { 
	background-color:#AD5B7A;
	width:12px;
	height:12px;
	opacity:0.7;
}
img.peche { 
	background-color:#5D63D7;
	width:12px;
	height:12px;
	opacity:0.7;
}

span[ibulle3]{
  border-bottom: 0px dotted #888;
  cursor: alias;
}

[ibulle3]{
  display: inline-block;
  position: relative;
}

[ibulle3]:hover::before{
  /*content: url(../3logos2.jpg);*/
  content: "";
  border-bottom: 8px solid transparent;
  border-top: 8px solid transparent;
  border-right: 8px solid rgba(103, 84, 17, 1);
  position: absolute;
    /*padding: 0 8px;*/
  left: 24px;
  top: 0px;
  z-index: 1;
}

/* This is a single-line comment */
 [ibulle3]:hover::after {
	content: 'Autre(s) nom(s):\a' attr(ibulle3);
	/*content: 'un string utilisé \a a plusieurs lignes mais qui va pas passer automatiquement';*/
	white-space: pre;
    position: absolute;
    left: 0;
    top: 0px;
    min-width: 150px;
    border: 1px #696040 solid;
    border-radius: 10px;
    background-color: rgba(233, 230, 211, 0.9);
    padding: 8px;
    left: 32px;
	top: -10px;
    color: #564D2C;
    font-size: 14px;
    z-index: 1;
}

span[ibulle4]{
  border-bottom: 0px dotted #888;
  cursor: help;
}

[ibulle4]{
  display: inline-block;
  position: relative;
}

[ibulle4]:hover::before{
  /*content: url(../3logos2.jpg);*/
  content: "";
  border-bottom: 8px solid rgba(103, 84, 17, 1);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  position: absolute;
    /*padding: 0 8px;*/
  left: -24px;
  top: 14px;
  z-index: 1;
}

/* This is a single-line comment */
 [ibulle4]:hover::after {
	content: 'Angle que fait l\'axe longitudinal du vaisseau par rapport à un axe Nord-Sud\a Par convention angle compté avec un chevet au nord.';
	/*content: 'un string utilisé \a a plusieurs lignes mais qui va pas passer automatiquement';*/
    position: absolute;
    left: -250px;
    top: 0px;
    width: 265px;
    border: 1px #696040 solid;
    border-radius: 10px;
    background-color: rgba(233, 230, 211, 0.9);
    padding: 8px;
	top: 25px;
    color: #564D2C;
    font-size: 12px;
    z-index: 1;

}