body {
background-color:gray;
width:800px;

background:url(texture-IH.gif);
}
#titleombre ,#title2, #titpag,#ntitpag {


}

#titpag {
top:60px;
color:green;
font-size:20px;
text-align:left;
}
#ntitpag {
top:46px;
color:black;
font-size:20px;
text-align:left;
}

#thumb {
position:absolute;
top: 520px;
left:300px;
}
#thumb2 {
position:absolute;
top: 515px;
left:260px;
}
#thumb2 {
position:absolute;
top: 515px;
left:280px;
}
#fleches {
position:absolute;
top: 515px;
left:260px;
}

#fleches a{
display:block;

}


#thumb img {
/*margin-rigth: 5px;*/
width:7em;
height:4em;
}
#thumb2 img {
margin-left:5px;
height:32px;
vertical-align:middle;
margin-top:2px;
}
#thumb2 img:hover {
margin-left:0px;
margin-top:0px;
height:37px;
vertical-align:middle;
margin-right:-2px;
}
#thumb2 img.bord:hover {
margin-left:4px;
margin-top:-2px;
height:35px;
border-color:blue;
border-width:2px;
vertical-align:middle;
margin-right:-3px;

}
#thumb1 {
position:absolute;
top: 520px;
left:260px;
/*width:900px;*/
font-size:36px;
padding-right:20px;
padding-left:20px;
background-color:transparent;

}
#thumb3 {
position:relative;
top: 0px;
left:0px;
/*max-width:900px;*/
font-size:36px;
/*padding-right:20px;*/
/*padding-left:20px;*/
background-color:transparent;
}
#thumb3 b {

margin:0px;
height:35px;
width:5px;
vertical-align:middle;
/*background:red;*/


}

#thumb3 img {

display:inline;
margin-left:5px;
height:32px;
vertical-align:middle;
margin-top:2px;
}

#thumb3 img:hover {
margin-left:0px;
margin-top:0px;
height:37px;
vertical-align:middle;
margin-right:-2px;
}
thumb3 img.bord:hover {
margin-left:4px;
margin-top:-2px;
height:35px;
border-color:blue;
border-width:2px;
vertical-align:middle;
margin-right:-3px;

}
#flecheg {
float:left;
position:absolute;
top: 30px;
left:0px;
}
#fleched {
float:right;
position:absolute;
top: 30px;
right:0px;
}

#flecheg a{
display:block;

}

.bord {
border-style:solid;
border-width:4px;
border-color:blue;
margin:0;

}

#divconteneur {
	position:absolute;
	top:140px;
	left:300px;
}

#divcont {
position:absolute;
top:90px; 
left:30px; 
width:700px; 
height:483px; 
/*overflow-x: auto ; */
background-color:gray;
}#divcont2 {
position:absolute;
top:90px; 
left:30px; 
width:700px; 
height:483px; 
/*overflow-x: auto ; */
background-color:gray;
}
#divimagea {
position:absolute;
height:416px; /*height:26em;*/
/*opacity:100;*/  /* opacity est fait en set par javascript pour etre compatible testeur css*/
max-width:665px;
}
#divimageb {
position:absolute;
position:absolute;
height:416px;/*height:26em;*/
/*opacity:0;*/ /* opacity est fait en set par javascript pour etre compatible testeur css*/
max-width:665px;
}

#comment2 {
position:absolute;
top:100px;
left:25px;
width:300px;
background:red;
}
dl.top_rgt {background:#eee  url(images/c_bl.gif) bottom left no-repeat; margin:5px 0 0 50px; padding:0; float:left; margin-right:10px; width:100%; display:inline;}
dl.top_rgt dt {background:#7f7f9c url(images/c_tl.gif) top left no-repeat; padding:10px; text-align:center; color:#fff;}
dl.top_rgt dd {background:transparent url(images/c_br.gif) bottom right no-repeat; padding:0; margin:0;}

dl.top_1 {background:transparent ; margin:5px 0 0 0px; padding:0; float:left; margin-right:10px; width:100%; display:inline;}
dl.top_1 dt {background:#7f7f9c url(images/c_tl.gif) top left no-repeat; padding:10px; text-align:center; color:#fff;}
dl.top_1 dd {background:#eee url(images/c_br.gif) bottom right no-repeat; padding:0; margin:0;}

dd p {margin:0; padding:10px; line-height:1.3em;}

dl.bot_lft {background:#7f7f9c url(images/c_tl.gif) top left no-repeat; margin:5px 0; padding:0; float:left; margin-right:10px; width:100%;}
dl.bot_lft dt {background:transparent url(images/c_tr.gif) top right no-repeat; padding:10px; text-align:center; color:#fff;}
dl.bot_lft dd {background:#eee url(images/c_br.gif) bottom right no-repeat; padding:0; margin:0;}








#goo1{
width:280px;

}

#crue {    
position:absolute;
width:220px;
top:510px;
left:94px;
}
#cruebleue {    
position:absolute;
margin-left:20px; 
font-size:0.8em; 
padding:0 10px 5px 10px; 
border:1px solid #444;
background:red;
height:10px;
width:100px;
display:inline;
z-index:100;
}
#cruebleue img {   
position:absolute;
top:-400px;  /*118*/
left: 250px;/*942*/
display: block;
}



#comment {    
position:absolute;
top: 90px;
left:5px;
width:180px;
}
#comment3 {    
position:absolute;
top: 140px;
left:25px;
width:180px;
}
/* -------round border from --------------------------
-------http://www.cssplay.co.uk/boxes/snazzy2.html----
------------------------------------*/

.xsnazzy h1, .zsnazzy h1 {
margin:0; 
font-size:1.2em; 
padding:0 10px 5px 10px; 
border-bottom:1px solid #444;
}
.xsnazzy p, .zsnazzy p {
margin:0; 
padding:5px 10px; 
font-size:11px;
		background:white; 

}
.xsnazzy {
background:transparent; 
width:240px; 
float:left; 
margin:0 3px;
}

.xtop, .xbottom {
display:block; 
background:transparent; 
font-size:1px;
}
.xb1, .xb2, .xb3, .xb4 {
display:block; 
overflow:hidden;
}
.xb1, .xb2, .xb3 {
height:1px;
}
.xb2, .xb3, .xb4 {
background:#fff; 
border-left:1px solid #444;
border-right:1px solid #444;
}
.xb1 {
margin:0 5px; 
background:#444;
}
.xb2 {
margin:0 3px;
border-width:0 2px;
}
.xb3 {
margin:0 2px;
}
.xb4 {
height:2px; 
margin:0 1px;
}

.xboxcontent {
display:block; 
border:0 solid #444; 
border-width:0 1px; 
height:auto;
}
* html .xboxcontent {
height:1px;
}

.color_a {
background:#c9ba65;
color:#fff;
}
.color_b {
background:#d4d8bd; 
color:#000;
}
.color_c {
background:#758279; 
color:#fff;
}
.color_d {
background:#b2ab9b; 
color:#000;
}

/*--------fin de snazzy2-----------------*/


#toto2 {
position:absolute;
top:33px;
left:25px;

}
.w400 {
width:400px;

}
.w230 {
width:230px;

}
.w150 {
width:150px;

}

.t400 {
top: 440px;
}


#menu_sel {
display:inline;
width:350px;
height:28px;
background:white;
font-family:	MS Shell Dlg;
font-size:	13.3333px;
}

#divform {         
top: 35px;
left:25px;
height:20px;
width:280px;
background:transparent;
vertical-align:middle;
position:absolute;
}
#divform2 {         
top: 28px;
left:5px;
height:20px;
width:280px;
background:transparent;
vertical-align:middle;
position:absolute;
}


.moi {
position:absolute;
top: 450px;
left:25px;
width:180px;
}
.moi h1 a, .moi h1 a:active, .moi h1 a:focus{
text-decoration:none ;
color:white;
margin-left:30px;
}

#new {
position:absolute;
top: 330px;
left:25px;
width:180px;
}
#new p  {
display:none;
}
#new:hover p  {
display:block;
max-height:230px;
overflow-y: auto ;
}



#comm1{
font-size:16px;

}


#titre3 {
position:absolute;
left:300px;
top:65px;
font-size:20px;
font-weight: bold;
color:white;

}
/*#map div a {text-decoration: none; color: transparent; background-color: transparent;font-size: 6px;}*/

/*#map div span {font-size: 6px;color:  transparent;text-decoration: none;}*/
h4.infowin {


}
h4.infowin a {
font-size:10px;
font-weight: bold;
color:Black;
/*text-decoration: none;*/

}

.infowindow {
height:20px;
width:150px;

}
.infoBox  a{
text-decoration: none;
}

div.boxText a {
border: 1px solid black; 
margin-top: 8px;
 background: red; 
 padding: 5px;
}
.colinfoBox  {
text-align:center;
border: 1px solid black; 
margin-top: 8px; 
background: yellow ; 
padding: 5px;
}
.colinfoBox  a {
text-decoration: none;
}


/*---commun page------------------------------------------------------------------------------------*/
/*----css menu ---------------------./

/* ================================================================ 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/scroll_menu.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== 
modified by bobthefrog to be adapted to my use 
principaly i use javascript for simulate :hover on div on ie6 */

/* set up the overall width of the menu div, the font and the margins with a relative position*/
.menu {
font-family: verdana, arial, sans-serif; width:240px; padding:0px 0 0px 0px; position:fixed;top:15px;left:30px;height:30px;z-index:200;}

* html .menu {position:absolute;right:186px;} /* for ie55*/
/* remove the bullets and set the margin and padding to zero for the unordered list */
.menu ul 
{padding:0; margin:0; list-style-type: none; border:0;}

/* float the list so that the items are in a line */
.menu ul li 
{float:left; position:relative; margin-right:1px;}

/* style the links to be 205px wide by 25px high. Set the background color and the font size. */
.menu ul li a, 
.menu ul li a:visited 
	{display:block; text-align:left; text-decoration:none; width:205px; height:25px; color:#aaa; background:transparent url(menuh1.gif) no-repeat; line-height:24px; font-size:10px; text-indent:10px;}
.menu ul li ul li#li2 a, 
.menu ul li ul li#li2 a:visited 
	{display:block; text-align:left; text-decoration:none;  width:184px; height:25px;  background:#363636;line-height:24px; font-size:10px; text-indent:10px;}


/* Get rid of any default table style */
/*table {border-collapse:collapse;margin:0; padding:0;}*//* not necessary for ie du to ie6.js */

/* make the dropdown ul invisible */
.menu ul li ul {display:none; text-align:left; position:absolute; top:25px; left:-20px; text-align:left;z-index:100; padding:0 30px 7px 20px; }

/* set the foreground color of the main menu li on hover and the border to trigger IE */
.menu ul li:hover a 
	{color:#fff; border:0;}

/* make the sub menu ul visible and position it beneath the first list item */
.menu ul li:hover ul 
	{display:block; text-align:left; position:absolute; top:25px; left:-20px; text-align:left;z-index:100; padding:0 30px 7px 20px; background:url(menub2.gif) 20px 100% no-repeat;}

/* make the sub menu ul li the full width  with padding and border. Add an auto scroll bar */
.menu ul li:hover ul li#li2
	{background:#363636; color:#000;width:204px; height:470px;overflow:auto; border-left:1px solid #7a7a7a;}
/* hack the widht for IE5.5 */
* html .menu ul li a:hover ul li {width:205px; w\idth:204px;}

/* style the background and foreground color of the submenu links with 129*/
.menu ul li:hover ul li a
	{float:left; display:block; background:#363636; color:#aaa; width:184px; text-align:left; text-decoration:none; border:0; text-indent:10px;}

/* style the background and forground colors of the links on hover */
.menu ul li:hover ul li a:hover
	{text-decoration:none; color:#fff; background:#222;}

	
	/* fin menu*/
	
/* menu suivant precedant  dans le container*/
.menupage {
		float:left;
		/*position:relative;*/
		margin-left:-12.5px;
		font: 12px Verdana, sans-serif;
		width:230px;/*  necessaire pour ie6 et7 pour l'ascenceur du bas */
	  /*	_width:181px;
	  _margin-right:79px;*/  /*  hack ie5 ie6 */
		color:#aaa;
		/*vertical-align:center;*/
		height:16px;
		text-align:center;
		padding:0;
}
.menupage a {
		text-decoration:none;
}	
.menupage a img {
		border:0;
}	
.menupagebas {
		margin-left:12px;
		background:url(menub1.gif) 0px 100% no-repeat;
		border: 0;
		height:9px;
}	
div.txtici {
	display:block;
	width:203px;
	/*_width:148px;*/ /* for ie55*/
	height:16px;
	text-align:center;
	margin-left:13px;
	background:transparent url(menum1.gif) no-repeat; 
}
#prec,.aleft {
	float:left;
}
#suit,.aright {
	float:right;
}
/* fin menu suivant precedant  dans le menu*/
/*------fin menu---------------------*/



#colombestitre,#titleombre{
		position:absolute;
		color:black;
		font-family: Arial, Helvetica, sans-serif;
		text-align: center;
		font-weight: bold;
		font-size:24px;
		top:20px;
		left:304px;
		font: 28px Verdana, sans-serif;
}
#colombestitre{
		color:red;
		left:300px;top:18px;
}
#titleombre{
		color:#226622;
}
.conseilpage {
		font-size:12px;
		color:white;
		vertical-align:top;
		margin-left:5px;
}
#conseilpage {
		position:absolute;
		top :610px; 
		left:300px;
		font-size:12px;
}

#map{}/* sert simplement pour situe le div de googleapi*/
.googlemap {  /* definit la carte de googleapi*/
		position:absolute;
		top: 90px;
		left:940px;
		height:26em;
		width:300px;
		background:white;
		overflow: hidden;
}

/* fin commun page ----------------------------------------------------------*/




/* page d'acceuil---------------------------------------------------------------*/
.bobcomment  {display:block; 
		position:absolute; left:15px; 
		width:235px; 
		font-family:verdana, arial, sans-serif; color:#666; font-size:10px;
		line-height:15px; text-align:left;background-color:white;
		padding: 0 0px 5px 3px;
		-moz-border-radius: 10px ;
		border-radius: 10px;
}
.bobcomment h1 {display:block;
		font-family:verdana, arial, sans-serif; color:#fff; /*width:241px;*/
		 font-size:14px; line-height:30px; text-align:center; background-color:#666;
		-moz-border-radius: 10px 10px 0 0;
		border-radius: 10px 10px 0 0;
		margin-top:0px;
		margin-left:-3px;
		margin-bottom:5px;
		font-style:normal;
		font-weight:bold;
}
.bobcomment p {display:block;
font-size:9px;
		position:relative;
		margin:0px;
		padding: 0 0px 5px 3px;
}
.pourquoi{ top:105px; }
.moi		{ top:450px; }
.new  	{top:350px; }
.new p  {display:none;}
.new:hover p  {display:block;max-height:230px;overflow: auto ;}/* ouoverflow-y: auto ; */
#conseilnavig {
		position:absolute;
		top:67px;
		left:25px;

		font-size:12px;
		color:white;
}
.google1 {
position:absolute;
top: 90px;
left:300px;
height:500px;
width:800px;
background:white;

}

/* fin page d'acceuil---------------------------------------------------------------*/
/*debut div diverse---------------------------------------------------------------*/
#plan {    
position:absolute;
width:220px;
top:60px;
left:950px;
}
#p1900 {    
position:absolute;
margin-left:20px; 
font-size:0.8em; 
padding:0 10px 5px 10px; 
border:1px solid #444;
background:red;
height:10px;
width:100px;
display:inline;
z-index:100;

}
#p1900 img {   
	position:relative;
	top:40px;/*-410px;  118*/
	left: -35px;/*942*/
	display: none;
}
#p1900:hover img { 
	display:block;  

}
#p1900_white {  
	position:absolute;
	display:inline;  
	margin-left:150px; 
	font-size:0.8em; 
	padding:0 10px 5px 10px; 
	border:1px solid #444;
	background:white;
	height:10px;
	width:100px;
	z-index:100;
}
#p1900_white img {   
	position:relative;
	top:40px;/*-410px;  118*/
	left: -165px;/*942*/
	display: none;
}
#p1900_white:hover img {   
	display: block;
}

.google {/* map de panoramique*/
	position:absolute;
	top: 90px;
	left:820px;
	height:320px;
	width:400px;
	background:white;
}

.pano {/* modifie le bobcomment du panoramique*/
	position:absolute;
	top:430px;
	left:820px;
	width:400px;
}
#soustitre {/* soustitre pour panoramique*/
	position:absolute;
	left:300px;
	top:50px;
	font-size:20px;
	font-weight: bold;
	color:white;
  white-space:nowrap;
}

.video {/* comment de 3D video*/
	position:absolute;
	top:100px;
	left:820px;
	width:400px;
}
.bob3Dcss {/*comment de 3Dcss*/
	position:absolute;
	top:100px;
	left:985px;
	width:230px;
}
.bob3Dcss2 {/*comment de 3Dcss2*/
	position:absolute;
	top:100px;
	left:15px;
	width:150px;
}

/*---fin div diverse---------------------------------------------------*/
/*--------------- fleches valmy 34-190-----------*/
.fleche1 span , .fleche2 span , .fleche3 span ,  .fleche4  span ,.fleche5  span {
display:none;

}
.fleche1 ,.fleche2 ,.fleche3,.fleche4,.fleche5, .fleche6, .fleche7{
text-decoration: none;
}
.fleche1:hover ,.fleche2:hover ,.fleche3:hover,.fleche4:hover,.fleche5:hover,.fleche6:hover,.fleche7:hover{
color:red;
}
.fleche1:hover span {
display:block;
position:absolute;
left:675px;
top:265px;/*265px;*/
background:  url(../i/fleche1.gif) no-repeat;
height:96px; width:396px; /*675px;*/
z-index:150;
}
.fleche2:hover span {
	display:block;
	position:absolute;
	top:245px;
	left:730px;
	height:80px; width:351px;
	z-index:100;
	background:  url(../i/fleche2.gif) no-repeat;
}
.fleche3:hover span {
	display:block;
	position:absolute;
	top:220px;
	left:745px;
	height:70px; width:351px;
	background:  url(../i/fleche3.gif) no-repeat;
	
	z-index:100;
}
.fleche4:hover span {
		display:block;
		position:absolute;
		top:87px;
		left:704px;
		width:410px;
		height:167px;
		background:  url(../i/fleche4.gif) no-repeat;
		
		z-index:100;
}
.fleche5:hover span {
		display:block;
		position:absolute;
		top:60px;
		left:685px;
		width:435px;
		height:167px;
		background:url(../i/fleche4.gif) no-repeat;
		z-index:100;
}
.fleche6:hover span {
		display:block;
		position:absolute;
		top:275px;
		left:840px;
		width:265px;
		height:167px;
		background:url(../i/fleche6.gif) no-repeat;
		z-index:100;
}

.fleche7:hover span {
		display:block;
		position:absolute;
		top:48px;
		left:390px;
		width:605px;
		height:137px;
		background:url(../i/fleche7.gif) no-repeat;
		z-index:100;
}

#gallery ul li dl.curved dd p.alertr{
color:red;
font-size:10px;
}

#gallery ul li dl.curved dd p.alertr blink{
position:relative;
color:black;
float:left;
top:-10px;
font-size:12px;
}



/*---------------fin fleches valmy 34-190-----------*/
/*----------------contact-----------------------------*/
#sendmail{
		display:block;
		width:300px;
		height:370px;
		top:100px; 
		/*left:500px;*/
		padding:0px;
		border:0;
		overflow: hidden;
		margin-top:100px;
		margin-left: auto; 
		margin-right: auto; 
}
#buttonbob{
	
		/*left:100px;*/
		width:40px;
		margin-left: auto; 
		margin-right: auto; 

}
#result.curved  {
				margin-top:100px;
		/*left:500px;*/
		display:none;
	  width:300px;
		height:370px;
		color:black;
		border:0;
					background:transparent;
				 margin-left: auto; 
         margin-right: auto; 
				 padding:0; 
				 font-family:verdana, arial, sans-serif; color:#666; font-size:10px; line-height:15px; 
				 text-align:left;background:transparent;padding: 0 0px 0px 0px;
}

#result.curved dt {
		background:#666; padding:10px; 
		text-align:center; color:#fff;
		font-size:14px;
		-moz-border-radius: 10px 10px 0 0;
		border-radius: 10px 10px 0 0;
}
#result.curved dd {background:#eee ; padding:0; margin:0;
		-moz-border-radius: 0px 0px 10px 10px;
		border-radius: 0px 0px 10px 10px;
}
#result.curved dd p {
		font-size:12px;
		font-weight: bold;
		color:black;
		background:white;
}
#result.curved dd p.last {
		background:#eee ;
		-moz-border-radius: 0px 0px 10px 10px;
		border-radius: 0px 0px 10px 10px;
		text-align:center;
 }
#result.curved dd p span {
		font-size:12px;
		font-style: italic;
		color:grey;
		background:white;
}
#text {
display:block;
		height:160px;
}
#centi {
width:100%;
background:red;
text-align:center;
height:800px;
}


/* i add this because if not the fonction document.body.style.OTransform  =  'scale(0.833, 0.833)';
  does not work in opera !!!!!!!*/
body{
padding-top: 1px;

}


/* css3 crosbrowser solution seen on http://john-smith.appspot.com/emulating--lt-blink-gt--using-webkit-css3-animation*/
@-webkit-keyframes blinker {  
  from { opacity: 1.0; }
  to { opacity: 0.0; }
}

.blink{
text-decoration:blink;
  -webkit-animation-name: blinker;  
  -webkit-animation-iteration-count: infinite;  
  -webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
  -webkit-animation-duration: 1s; 

}