@charset "utf-8";
body{  color: #111;
		font: 80%/125% 'Open Sans',Tahoma,arial,sans-serif;
		margin: 0;
		padding: 0;}
		
@media (max-width: 767px) {
		.cadre{width:90vw;}
	    div#bloc-content{
		width:100%;
		margin-top:30px;
		}
		 div#title-mobile, div#ads_left, div#cartepc{
        display: none;
      }
		#directions-panel, #map-canvas{
	  width: 100%;
	  }
	  .itineraire
		{
		max-width:360px;
		}
		 .box{
				  margin-bottom: 10px;
			}
				
		.pub336-2
		{
		display: none;
		}
		.pub970
		{
		display: none;
		}
	
	  
	     }

 @media (min-width: 767px) {
		.cadre{width:982px;}	
		div#bloc-content{
		width:69%;
		margin-top:30px;
		}
		div#pub-mobile, div#menumobile, div#cartemobile{
        display: none;
      }
	  div#ads_right{
	  float:right;
	 
	  }
	 
	  
	   #directions-panel, #map-canvas {
	  width: 650px;
	  }
	  .pub970-2
{
display: none;
}
	  
		}
		
  #directions-panel {
         float:left; 
         margin:20px 0 20px 0;
      }
#map-canvas {
	  float:left; 
         margin:20px 0 20px 0;
		 height: 400PX;
	  }
     
      #control {
        background: #fff;
        padding: 5px;
        font-size: 14px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: 0 2px 2px rgba(33, 33, 33, 0.4);
        display: none;
      }

      @media print {
        #map-canvas {
          height: 500px;
          margin: 0;
        }

        #directions-panel {
          float: none;
                 }
      }
	    
h1, h2, h3 {color : #0C2270;}
h1 {font-weight : 14px !important;}
ul,li{padding-left:2px;}
tr{text-align:left;}

div.cadre-header{margin-bottom:4px;border-bottom:1px solid #ddd}
div#header{position:relative;
width:100%;
margin:0 auto;
padding:15px 10px;
background:#fff}

.title-mobile{	
		float: left;
		}
.upper{	
		text-transform: uppercase;
		}

div#header div#logo{float:left; width:100%; height:64px;}
div#header div#logo img{position:absolute;margin-right:8px}
div#header div#logo a{font-family:'Open Sans',sans-serif;font-size:2.2em;color:#505;text-decoration:none}
div#header div#logo span {
	font-family:'Open Sans',sans-serif;
	font-size:1.35em;
	color:#EA4; 
	position: absolute;
	padding-left: 59px;}
	div#header div#logo span.sous{
	margin-top:20px;
	color:grey; 
	font-size:0.95em;
	}

	div#banniere{
	}
	div#pub-mobile {
             }

div.cadre-nav{width:100%;top:0;left:0;float:right}
             }
div.cadre-nav{width:100%;top:0;left:0}

div.cadre{margin:0 auto;background:#fff;background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#f9f9f9));background:-webkit-linear-gradient(top, #fff, #f9f9f9);background:-moz-linear-gradient(top, #fff, #f9f9f9);background:-ms-linear-gradient(top, #fff, #f9f9f9);background:-o-linear-gradient(top, #fff, #f9f9f9);border-bottom:1px solid #eee}

div.content{width:100%;margin:0 auto;position:relative}

div.content div#ads_left{clear:both;width:312px; margin:17px 20px 0 0;float:left; }
div#ads_left .formul {background-color:#e5e5e5; padding:5px 5px 5px 10px; display: block;}
.block-left {
}
.title{
color: #0C2270;
font: bold 11px Arial, Helvetica, sans-serif;
text-align: left;
padding: 0;
display: block;
position: relative;}

.titleh1{
color: #0C2270;
font: bold 11px Arial, Helvetica, sans-serif;
text-align: center;
padding: 0;
display: block;
position: relative;
margin-bottom:-15px;}
#start{
width:265px;
height:25px;
padding-left : 20px;
}
#end{
width:265px;
height:25px;
padding-left : 20px;
}
.flag1 {
background-image: url('../images/drapeau-depart.jpg');
background-repeat: no-repeat;
}
.flag2 {
background-image: url('../images/drapeau-arrivee.jpg');
background-repeat: no-repeat;
}
.inverse{
background-image: url('../images/inverse2.png');
background-repeat: no-repeat;
height:25px;
background-position: center; 
width : 100px;
font-weight:10px !important;
}
.aller {
position:absolute;
padding-top:3px !important;
color:green;
}
.retour {
position:absolute;
padding: 3px 0 0 71px !important;
color:red;
}
.aller a{
color:green;
}
.retour a{
color:red;
}
.linkPink input{ 
display:inline-block; 
margin : 10px 8px 0 0;
height:26px; 
width : 125px;
border-radius: 3px;
border:none;
padding:5px !important; 
font-size:13px; 
color:#fff; 
background-color:#007A0F; 
 text-decoration:none;
 cursor : pointer;
 float : right;
 } 
 element.style {
}
.option {
position: relative;
margin: 6px 0 0 5px;
padding: 0 5px 23px 5px;
width: 272px;
background: #fff;
border-top: 1px solid #f2f2f2;
}
caption{
color: #0C2270;
font: bold 13px Arial, Helvetica, sans-serif;
text-align: center;
padding: 5px 2px 2px 2px;
width : 304px;
border-bottom: 1px dashed #D88;
}
.box2 caption{
color: #0C2270;
font: bold 13px Arial, Helvetica, sans-serif;
text-align: center;
padding: 5px 2px 2px 2px;
width : 642px;
border-bottom: 1px dashed #D88;
}
.resume th{
width : 150px;
font-size:12px;
padding: 2px 5px 5px 0;
}

.petit{
font-size:8px;
}
.table3 table{
width:100%;
}
	.table3 th
{
    background-color: #E1E6FA;
    border-right: 1px solid White;
    color: grey;
    font-weight: bold;
    padding: 6px;
    text-align: left;
}
.table3 td 
{
    border: 1px solid gray;
    margin: 0;
    vertical-align: top;
    padding: 6px;
}
dernier-bloc{
float:left;
width:650px;
}
td#distance1 {
padding:5px !important;
}
td#distance1 a{
color:#006FB9 ;
}
#distance2 {
padding:3px !important;
float :left;
width : 150px;
}
#distance2 a{
color:#006FB9 ;
}

input[type="radio"]:checked,
input[type="radio"]:not(:checked) {
background-color:#fff;
color:#fff}

div.content div#ads_content{} 
div.content div#ads_right{left:2px; margin-top:17px; bottom:15px;width:300px;}
div.content ul.hp_list{list-style-type:none}
div.content ul.hp_list li a.vorwahl{width:45px;margin-right:5px;text-align:right;display:inline-block}
div.content div#social{position:absolute;right:15px;top:30px;width:135px}
div.content div#social span{float:left;overflow:hidden;margin-bottom:5px}
div.content div#social span#facebook{width:135px;height:25px}
div.content div#social span#gplusone{width:90px;height:25px}
div.content div#social span#twitter{width:100px;height:25px}
div.content div#social.fixed{position:fixed;top:145px;width:100px;padding:5px;margin:0 0 0 10px}
		
		div#bloc1 {
				margin = 10px 0 10px 0;
				}
		.alfabito {
			
			font-size: 11px;
			border-radius:2px ;
			width : 150px;
			color: rgb(138, 143, 141);
			display: block;
			float: left;
			
			padding: ;
			text-decoration: none;
			margin : 0 0 5px 5px;
			}
			.alfabito2 {
			border:1px solid #959393;
			font-size: 13px;
			border-radius:2px ;
			background:rgb(253, 253, 253);
			color: rgb(236, 37, 93);
			display: block;
			float: left;
			overflow: hidden;
			padding: 3px 0;
			text-align: center;
			text-decoration: none;
			width: 186px;
			font-weight:bold;
			}
			
		
		.alfabito3{
		
		float:none;
	font-size:11px;
	font-family: sans-serif, Serif, Tahoma, Verdana, Arial, Helvitica;
	padding:0px;
	margin:0px;
	color:#0060a0;
	text-decoration:none;
	font-weight:normal;
		}
		
		a.alfabito3{
	font-size:11px;
	font-family: sans-serif, Serif, Tahoma, Verdana, Arial, Helvitica;
	padding:0px;
	margin:0px;
	color:grey;
	text-decoration:none;
	font-weight:normal;
		}
	
		a.alfabito3:hover{
	text-decoration:underline;
		}
		
		.alfabito5 {
			
			border:1px solid #959393;
			font-size: 13px;
			border-radius:2px ;
			background:rgb(253, 253, 253);
			color: rgb(138, 143, 141);
			display: block;
			margin-top:10px;
			float: left;
			padding: 3px 0;
			text-align: center;
			text-decoration: none;
			width: 186px;
			font-weight:bold;
			}
				
			
		.ultimo{
			margin: 0 auto;
			width:580px;
			
			}
			
			.alfabito4 {
			
			font-size: 16px;
			border-radius:3px ;
			background:#cccccc;
			color: red;
			width: 400px;
			margin: 0 0 5px 1px;
			padding : 20px;
			}
			
			.alfabito4 a{
			
			font-size: 16px;
			font-weight:bold;
			border-radius:3px ;
			background:#cccccc;
			color: red;
			width: 400px;
			margin: 0 0 5px 0;
			}
		.liste_departement{
		height:360px;
		float:left;
		margin-left:13px;
		}
.liste_departement2{
		height:100px;
		margin-left:13px;
		float:left;
		}
		.liste_departement3{
		height:100px;
		margin-left:20px;
		float:left;
		}
		
		.ultimo{
			margin: 0 auto;
			width:400px;
			
			}


.pub336
{
width : 338px;
height:280px;
float:right;
}

.itineraire
{
clear:both;
width:650px;
float:left;
}
.pub336-2
{
margin:27px 0 0 20px;
float:left;
position:relative;
width:312px;
}

#menu {float:left;margin:1px 0 2px 0; padding : 5px; font-size:12px;background:#C00;border:1px
solid #eee;color:white; height:20px; position :relative}
#menu a{font-size:12px; text-decoration: none; color:white; font-weight:bold; position :relative}

#menu1 {float:left;margin:1px 0 2px 0; padding : 5px; font-size:12px;background:#006FB9;border:1px
solid #eee;color:white; height:20px; position :relative}
#menu1 a{font-size:12px; text-decoration: none; color:white; font-weight:bold; position :relative}

#menu1 a hover{float:left;margin:0 0 5px 0;font-size:12px;background:#f5f5f5;border:1px
solid #eee;color:#fffff;
height:20px}
 #menu2 {float:left;margin:1px 0 2px 0; padding-top : 5px ; font-size:16px;background:#F7F7F0;border:1px
solid #eee;color:#C00; height:20px; width:300px; position :relative; text-transform: uppercase;}
#menu2 a{font-size:12px; text-decoration: none; color:#C00; font-weight:bold; position :relative}
#menu21 {float:left;margin:1px 0 2px 0; padding : 5px 5px 3px 5px; font-family: arial; font-size:16px;background:#f0f3f4;border:1px
solid #ccc; width:288px;  height:20px; position :relative; text-transform: uppercase;}
#menu21 a{font-size:12px; text-decoration: none; color:#002884; font-weight:bold; position :relative;}
#menu21 a:hover{float:left;margin:0 0 5px 0;font-size:12px;}
#menu21 a:focus{background:#de0029;}

#menu22 {float:left;margin:1px 0 10px 0; padding : 5px; font-size:16px;background:#C00; border:1px
solid #eee;color:white; width:300px;  height:40px; position :relative; text-transform: uppercase; padding: 18px 0 0 60px; border-radius: 5px; margin-left:100px}
#menu22 a{font-size:12px; text-decoration: none; color:white;font-size:16px; font-weight:bold; position :relative; background:#C00;}

#menu3 {float:right; width:170px; height:20px; padding : 4px; font-size:12px;background:#C00;border:1px
solid #eee;color:white; position :relative}
#menu3 a{font-size:12px; text-decoration: none; color:white; font-weight:bold; position :relative}
#menu5 {float:left;margin-left:-1px; padding : 5px; font-size:14px;background:#C00;border:1px
solid #eee;color:white; width:290px;  position :relative; text-decoration: none; }

#menumobile {
    margin-top: 82px;
    width: 300px;
    margin: 0 auto;
    float: left;
}
#menu-accordeon {
  padding:0;
  margin:0;
  list-style:none;
 }
 .menuli {
 text-align:center !important;
 }
#menu-accordeon ul {
  padding:0;
  margin:0;
  list-style:none;
  text-align: center;
}
#menu-accordeon li {
   background-color:#729EBF; 
   background-image:-webkit-linear-gradient(top, #729EBF 0%, #333A40 100%);
   background-image: linear-gradient(to bottom, #729EBF 0%, #333A40 100%);
   border-radius: 6px;
   margin-bottom:2px;
   box-shadow: 3px 3px 3px #999;
   border:solid 1px #333A40;
   text-align: left;   
}
#menu-accordeon li li {
   max-height:0;
   overflow: hidden;
   transition: all .5s;
   border-radius:0;
   background: #444;
   box-shadow: none;
   border:none;
   margin:0
}
#menu-accordeon a {
  display:block;
  text-decoration: none;
  color: #fff;
  padding: 8px 0;
  font-family: verdana;
  font-size:1.2em
}
#menu-accordeon ul li a, #menu-accordeon li:hover li a {
  font-size:1em
}
#menu-accordeon li:hover {
   background: #729EBF
}
#menu-accordeon li li:hover {
   background: #999;
}
#menu-accordeon ul li:last-child {
   border-radius: 0 0 6px 6px;
   border:none;
}
#menu-accordeon li:hover li {
  max-height: 15em;
}

 .box2 {
width:652px;
border: 1px solid #A7B6C7;
margin-top: 5px;
padding: 0 0 0 5px;
font-family:helvetica;
float:left;
position:relative;
}
 .bi-colonne {
 width:640px;
 position:relative;
 float:left;
 }
 .box {
width:312px;
height:599px;
border: 1px solid #A7B6C7;
margin-top: 17px;
padding: 0 0 0 5px;
font-family:helvetica;
float:left;
position:relative;
}
div.trajet {
width:306px;
height:86px;
border: 1px solid #A7B6C7;
margin-top: 5px;
padding: 0 0 0 5px;
font-family:helvetica;
}
div.trajet ul{
list-style-type:none
}

.box input[type=text]{width:350px; 
					float : right;
					}

#carte-france{
background: url("../images/france1.gif") no-repeat;
Height:179px;
width : 175px;
position :relative;
}
.cadre-footer{
clear:both;
float:left;
}