@font-face {
	font-family: 'Raleway', sans-serif;
}
body {
	margin: 0;
	padding: 0;
/*		background: url(/include/images/background.jpg);
    background-position: top center; 
	background-repeat : no-repeat;
background-attachment: fixed;*/
/*	-webkit-background-size: 100%; 
	-moz-background-size: 100%;
	-o-background-size: 100%;
	background-size: 100%;*/
/*	color: #FFFFFF;*/
	font-family: 'Raleway', sans-serif;
	font-size: 100%;
	line-height: 1.2;
}

#page{
	margin-left: auto;
	margin-right: auto;
	width : 1024px;
}

#logo {
	float: left;
	margin-top: -445px;
	position : absolute;
	margin-left: 10px;
	margin-right: auto;
}	

#adresse_agence {
	float: center;
	margin-top: -100px;
	position : absolute;
	padding : 10px;
	margin-left: 10px;
	margin-right: auto;
	border-radius: 5px;
	background-color: #FFFFFF;
	border: 1px solid #07b1ee;
	  -moz-box-shadow: 8px 8px 20px #e7e7e7; 
	  -webkit-box-shadow: 8px 8px 20px #e7e7e7; 
	  box-shadow: 8px 8px 20px #e7e7e7; 
}	

#lien_agence {
	font-size: 13px;
	font-color : #07b1ee; /*#666666;*/
	text-decoration:none;
}

#signe {
	float: right;
	margin-top: -445px;
	position : absolute;
	margin-left: 664px;
}	

#separation{
	margin-top:32px;
	margin-bottom:20px;
/*	background: url(/include/images/separation.png);
    background-position: top center; 
	background-repeat : no-repeat;*/
}

#service {
	margin-left: auto;
	margin-right: auto;
	margin-top: -23px;
	width : 1024px;
	/*height : 300px;*/
	background-color: #FFFFFF;
	/*background-color: #00ade7;*/
}

#blocdevis{
	width : 290px;
	height : 432px;
	/*height : 425px;*/
	/*background: url(/include/images/fond_devis.png);
	background-repeat: no-repeat;*/
	border-radius: 10px;
	background-color: #F7F7F7;
	border: 1px solid #666;
	  -moz-box-shadow: 8px 8px 20px #e7e7e7; 
	  -webkit-box-shadow: 8px 8px 20px #e7e7e7; 
	  box-shadow: 8px 8px 20px #e7e7e7; 

	position : fixed;
	margin-top: 200px;
	margin-left : 780px; /* 690 */
	z-index:2;
}

#infodevis{
	margin-top: -15px;
	margin-left: auto;
	margin-right: auto;
	font-family: 'Raleway', sans-serif;
	font-size: 10px;	
	color: #7a7a7a;
}

/* ----------------------------------------------- */
#reduire{	
	position : fixed;
	margin-top: 575px;
	margin-left : 915px;
    /*transform:scale(1) rotate(-12deg);
    transition:all 2.50s;*/
    -webkit-animation-name: mymove;  /* Chrome, Safari, Opera */
    -webkit-animation-duration: 9s;  /* Chrome, Safari, Opera */
    -webkit-animation-iteration-count: infinite;
    animation-name: mymove;
    animation-duration: infinite;
    animation-iteration-count: infinite;
	z-index:1;
}

a.reduire{

}

@-webkit-keyframes mymove {
   0%, 100% {
        -webkit-transform:scale(1) rotate(-24deg);
    	-webkit-transition:all 3s;
    }
    50% {
	    -webkit-transform:scale(1) rotate(24deg);
	    -webkit-transition:all 6s;
    }
}

@keyframes mymove {
   0%, 100% {
        transform:scale(1) rotate(-24deg);
    	transition:all 3s;
    }
    50% {
	    transform:scale(1) rotate(24deg);
	    transition:all 6s;
    }
}

/* ----------------------------------------------- */


#blocdevisform{
	width : 290px;/* 310px;*/
	height : 245px;
	border-radius: 10px;
	background-color: #F7F7F7;
	border: 1px solid #666;
	  -moz-box-shadow: 8px 8px 20px #e7e7e7; 
	  -webkit-box-shadow: 8px 8px 20px #e7e7e7; 
	  box-shadow: 8px 8px 20px #e7e7e7; 

	position : fixed;
	margin-top: 200px;
	margin-left : 780px; /* 690 */
	z-index:1;
}
#devistitre{
	font-family: 'Raleway', sans-serif;
	font-size: 19px;
	font-weight: 500;
	padding-top: 10px;
	padding-left: 9px;
	color:#666666;	
	text-align: center;
}

#NumGeo{
	background: url(/include/images/telgeo.png);
	background-repeat: no-repeat;
	width : 294px;
	height : 103px;
	position : fixed;
	margin-top: 153px; /*213*/
	margin-left : 777px; /*698px;*/
	z-index:99;
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
    font-size: 35px;
    color:#FFFFFF;
}
#NumGeoTel{
	margin-left: 28px;
	margin-top: 7px;
}
#NumGeoTelsous{
	margin-left: 60px;
	margin-top: -35px;	
	font-family: 'Raleway', sans-serif;
    font-size: 10px;
    color:#FFFFFF;
}

#blocagencetitre{
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	width : 1024px;
	height : 160px;
	background-color: #00ade7;
	font-family: 'Raleway', sans-serif;
	line-height: 1.4;
	font-size: 27px;
	color : #FFFFFF;
	text-align: center;
}

#Listeagence{
	margin-left: auto;
	margin-right: auto;
	/*margin-top: -90px;*/
	width : 1024px;

}

#boxagence{
	height: 120px;
	width: 120px;
	padding:25px;
	border-spacing: 20px;
	border-radius: 10px;
	border: 1px solid #00ade7;/*#F6F6F6;*/
	  -moz-box-shadow: 8px 8px 20px #aaa; 
	  -webkit-box-shadow: 8px 8px 20px #aaa; 
	  box-shadow: 8px 8px 20px #838383; 
}

#map_wrapper {
    height: 400px;
}

#map_canvas {
    width: 100%;
    height: 100%;
}

#logomaps{
	width : 218px;
	position:relative;
	z-index: 99;
	/*margin-top: -20px;*/
	margin-left: auto;
	margin-right: auto;
}

#ligne_fine{
	line-height: 17px;
	color: #00ade7;
	text-decoration: none;
	font-size: 14px;
}

#map{
	/*margin-top: -103px; pour la position si image logo au dessus de la carte
	margin-top: -20px;*/
	z-index: 1;
}

hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

a{
	color:#ccc;
    text-shadow:0 -1px 0 white;
}

a:hover span, a:focus span{
	/*a:hover span, a:focus span{*/
    transform:scale(1) rotate(0);   
    opacity:1;    
}

#footer{
	height:150px;
	background:#5b5b5b;
	/*color:#FFFFFF;*/
}

a:hover, a:focus{
	/*background:rgba(0,0,0,.4);
    box-shadow:0 1px 0 rgba(255,255,255,.4);  */
}

a span{
	position: absolute;/*absolute;*/
	margin-top: -350px;
	margin-left: -300px;
	color:#FFFFFF;
    background:rgba(0,173,231,.9); /*rgba(0,173,231,.9)  Bleu GE   .9=opacité */
    /*background:rgba(0,0,0,.9);  .9=opacité */
    padding:15px;
    border-radius:3px;
    box-shadow:0 0 2px rgba(0,0,0,.5);
    transform:scale(0) rotate(-12deg);
    transition:all .50s;
	opacity:0;
	font-size: 17px;
	line-height: 1.8;
}
ul.circle {
	list-style-type: circle;
	color: #00ade7;
	padding-left: -15px;
}

a.circle {
	color: #00ade7;	
}

li{
	padding-left: -15px;
	padding-top: -50px;
	color: #00ade7;	
	text-decoration: none;

}

button {
    /* Cette marge représente approximativement le même espace
       que celui entre les étiquettes et les champs textuels */
    padding : 10px;
    background-color: #de38b4;
    color: #FFFFFF;
    border:0px;
    font-size: 9px;
    font-family: verdana;
}
form{
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	line-height: 1.2;
}
h1 {
	font-size: 29px;
	font-color : #7b7b7b; /*#666666;*/
}

h2 {
	font-size: 17px;
}

h3 {
	font-size: 14px;
}
#petittel {
	font-size: 9px;
	font-style: italic;
}

/*
#############################################
	Animation haut page avec 3 images
#############################################
*/
@keyframes AutoSlide {
    0%, 15%, 100% {
        left: 0px; /*1ère image*/
    }
    35%, 50% {
        left: -1024px; /*2ème image*/
    }
    70%, 85% {
        left: -2048px; /*3ème image*/
    }
}

#slideshow {
    position: relative;
    width: 1024px;
    height: 455px;
    margin:  0 auto 20px auto;
    overflow: hidden;
}

#sContent li {
    display: inline;
}

#sContent {
    position: absolute;
    top: 0;
    left: 0;
    /*width: 450px;*/
    width: 4048px;
    margin: 0;            
    padding: 0;
    
    /*CSS3 keyframes animation*/
    /*
    animation-name: AutoSlide;
    animation-duration: 20s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    */
}