@font-face {
  font-family: 'Lobster';  
  src: url('fonts/Lobster 1.4.otf') format('opentype'); 
}
body,html {
background: url(../../images/body_bg.jpg);
margin: 0;
padding: 0;
text-align: center;
font-family: 'Lobster', arial, serif;
}
.debut{margin:0;padding:0;border:1px solid gray;}
header {
width: 100%;
height: 140px;
background: url(../../images/top_bg.jpg) top center no-repeat;
padding-top:20px;
}
#waitingContainer{
	width: 100%;
	height: 16px;
	margin:0;
	padding:0;
}
#waiting{
	width: 100px;
	height: 16px;
	margin:0 auto 0 auto;
	padding:0;
	background: url(../../images/loading.gif) no-repeat;
	display:none;
}
div.wrapper{
position:absolute;
top:160px;
left:50%;
width:1024px;
height:auto;
margin-left:-512px;
}
section.left{
width:350px;
float:left;
background: url(../../images/fond_left.png);
border:1px solid gray;
display: table-cell;
}
section.left h2{
padding:20px;
margin:0;
border:1px solid gray;
background: url(../../images/titre.jpg) bottom left repeat-x;
}
section.left nav{
padding:10px;
margin:0;
border:1px solid gray;
text-align:left;
}
ul li {
   list-style-image: url(../../images/menu2.gif);   
}
ul li.actif{
   list-style-image: url(../../images/target3actif.png);
}
ul li.actif a,ul li a:hover{   
   color:gray;
}
ul li.actif a{   
   cursor:default;
}
section.right{
float:right;
text-align:center;
width:620px;
height:auto;
font-family: 'Lobster', arial, serif;
border:1px solid gray;
background: url(../../images/fond_right.jpg);
display: table-cell;
margin-top:-20px;
}
section.right h2{
padding:20px;
margin:0;
border:1px solid gray;
background: url(../../images/titre.jpg) bottom left repeat-x;
}
form{
width:620px;
height:457px;margin-bottom:0!important;	
}
form.form{
width:618px;
height:auto;
min-height:295px;
text-align:center;
border:1px solid gray;	
}
/*input,label,select{margin-left:30px}*/
input[type="submit"]{
border:2px outset green;
height:29px;
font-family:verdana;
font-weight:bold;
background: url(../../images/contact.png) 0 0 no-repeat;
margin:0;
margin-right:200px;

}
input[type="button"]{
border:2px outset green;
font-family:verdana;
font-weight:bold;
height:29px;
background: url(../../images/contact.png) 0 0 no-repeat;
margin:0;
margin-top:-5px;
}
input[type="button"].annul{background: url(../../images/contactred.png) 0 0 no-repeat;color:white}
input[type="button"].annul:hover{color:navy}
input[type="submit"]:hover ,input[type="button"]:hover,input[type="button"].annul:hover { background-position: 0 100%;border:2px inset green;color:gray }
select{
margin-left:50px;
}
.choix{display:none;}
.error{color:red;}
.headerCmd,.footerCmd{
	width:578px;
	margin: 0 auto;
	padding:20px;	
	border:1px solid gray;
	height:30px;
	background:url(../../images/titre.jpg) bottom left repeat-x;
	text-align:center;
}
form.form div.headerCmd{border:none;border-bottom:1px solid gray;}
form.form div.footerCmd{border:none;border-top:1px solid gray;}

#contenu{ 
	width:618px;
	height:311px;
	background: url(../../images/crumpled-paper.jpg) no-repeat;		
	font-family: 'Lobster', arial, serif;
	position: relative;
	border:1px solid gray;
}
.posAbsolute{
	position:absolute;
} 
iframe {
	width: 618px;
	height: 315px;
	position: absolute;
	margin-top: 0;
	border: 1px solid gray!important;
}
 img.posAbsolute{
	width:618px;
	height:313px;
	margin-left:1px;
}
span.spot{
	position:absolute;	
	top:-80px;
	left:25px;
	width:50px;
	height:80px;
	z-index: 1;
}
span.spot:before{
	content: "";
	position:absolute;	
	width:50px;
	height:80px;
	background: url(../../../cartes/logo.jpg)no-repeat;
	background-size: 32px 32px;
	background-position:11px 9px;
	-webkit-transform:rotate(-6deg);
    -moz-transform:rotate(-6deg);
	z-index: -1;
}
span.spot img{	
	width:50px;
	height:80px;	
}
span.spot:hover{cursor:pointer;}
span#spot0.spot:hover{cursor:auto}

.alert{background:red;}

@-webkit-keyframes redalert0 {
  50% {
    box-shadow: 0px -100px 150px -50px magenta, 0px -100px 150px -50px magenta, inset 0px 0px 200px red;
    background:none; 
	} 
}
	
.redalert0 {
  -webkit-animation: redalert0 0.5s linear 0s infinite normal;
  -moz-animation: redalert0 0.5s linear 0s infinite normal;
  animation: redalert0 0.5s linear 0s infinite normal; 
 }
 
@-webkit-keyframes redalert {
  50% {
    box-shadow: -100px 0px 50px -50px magenta, 100px 0px 50px -50px magenta, inset 0px 0px 200px red;
    background-color: #FFF; 
	} 
}
	
.redalert {
  -webkit-animation: redalert 0.5s linear 0s infinite normal;
  -moz-animation: redalert 0.5s linear 0s infinite normal;
  animation: redalert 0.5s linear 0s infinite normal; 
 }
#spot0{z-index:2;}

#makeMeDraggable{
	position:absolute;
	top:-8px;
	left:47px;
	z-index:7;
}
#makeMeDraggable:hover{
cursor:move;
}
#footPage {
clear:both;
width: 1024px;
height: 140px;
}
footer{
clear:both;
position:fixed;
bottom:0;
height: 121px;
width:100%;
background: url(../../images/bg_bottom.jpg) center bottom no-repeat;
z-index:-1;
}