
/*### css ###*/

/* Silver 6 horizontal big slide*/


@media screen and (max-width:960px){
	html { background:#fff}
body {overflow-x:hidden ; max-width:60em; font-size:12px; margin: 0 auto}
#conteneur	{
	width:auto;
	margin:0px auto;
	background:url(../charte/fond-conteneur.jpg) repeat-y top center ;
}
	#pousse { margin-top:0px}
#actu a{margin:10px 0 0 500px; }
#entete {height:270px; background:#fff}

#logo {float:none; margin:0 auto; text-align:center; width:auto; background:url(../charte/fond-logo-responsive.jpg) no-repeat top center; height:150px;}
#slogan {display:block;float:none; margin:0 auto; text-align:center; width:auto; background:url(../charte/fond-slogan-responsive.jpg) no-repeat top center; clear:both; height:120px;}
#slogan p{ font-size:18px; text-align:center; color:#4B4B4D; padding-top:20px; margin:0}
#slogan p a {  color:#4B4B4D;}
#animation	{
	display:none }

#masque {
    display:block;
    width:100%;
    height:100%;
	min-height:100%;
    overflow:hidden;

}

#ami {display:none}
#favoris {display:none}

ul.dropmenu{
/*######################################################################################################*/
	font-family: 'Open Sans Condensed', sans-serif;			/*Police des rubriques/sous-rubriques*/
	font-size:18px;					/*Taille des rubriques/sous-rubriques*/
/*######################################################################################################*/
	position: relative;
	margin: 0px;
	padding: 0px;
	display:block;
	
	display: inline-block; /* fix position IE7 - 1ere partie */

}

.dropmenu li a{
/*######################################################################################################*/
	padding:0 5px;
	line-height:60px;	
		/*Espacement autour des rubriques (haut, droite, bas, gauche)*/
	color:#fff;							/*couleur des rubriques/sous-rubriques*/
	
/*######################################################################################################*/
	display: block;
	cursor:pointer;
	text-decoration: none;
}
section#integration { clear:both; width:auto; max-width:960px;border-top:0px solid #000}
#integration p{text-align:justify}
#integration p.test{clear:both}

#slide {float:none; margin:10px auto;border:1px solid #1f1a17;width:300px;height:225px}
#slide img {max-width:100%;width:100%; height:auto}
.map {width:300px; height:247px}
ul.no-mobile {display:none}
div#pied ul li.no-liens {display:none}

#pied  {width:auto; padding:0 20px;max-width:960px;}

#logo-distributeur{display:none}
.encart {width:80%; min-height:80px; height:auto}
#facebook {position:absolute; margin:10px}
.btmenu {position:absolute; right:10px; top:10px; z-index:90; cursor:pointer}

.encart-txt {width:auto; border-right:none; margin:0 auto; clear:both}

li.mobile {display:block}
li.mobile a {
	background-color:#fff;			/*fond de couleur des rubriques*/
	opacity:0.8;
	color:#35D4FE;	
}
.no-mobile {display:none}
.mobile {display:block}
.quarts {width:28em; margin:0.5em;}
.tiers {width:16em; margin:1em;height: 12em}
.demi2 {
    width: 25.4em;
    height: auto;
}
	#height2{height:auto}
#livre{display:none}
#height3{height:15em}
#integration a .deconnexion p{text-align:center}
#integration  .cercle{
	float:none;
		margin:0.5em auto 0 auto;
		width:17em; 
		height:17em; 
}
#integration .label-long{width:200px}
.thepet { background-color:#FFF}


/*** MODULE GARAGISTE ***/
#integration a .liste-vehicule{width:52em}
#integration a .liste-vehicule:hover{width:52em}
.liste-vehicule .prix-vehicule{float:none;width:95%}
.liste-vehicule .bloc-vehicule {
	float: right;
	width: 41em;
}
#integration .liste-vehicule .infos{
	width: 11em;
	margin-left: 0.5em;
	color:#000000;
	font-size:13px
}
#integration .encart-recherche .marge-recherche{margin-left:80px}
#integration .encart-recherche{width:52em}
#integration .encart-recherche .champ-recherche{margin-left:3.5em}
#integration .cat-vehicules{width:7em;}

.feedback1-input { padding:0px}
/************ MODULE IMMO ********************/


#integration a #liste-immo{width:52em}
#integration a #liste-immo:hover{width:52em}


#integration .bloc-immo-photo {
	width: 10em;
	text-align:center;
}

#integration .bloc-immo-annonce {
	width: 40em;
}

#integration #liste-immo .infos{
	width: 11em;
}

#integration #recherche .encart-recherche2{width:14em}
#integration #recherche .encart-recherche{width:26em}


#integration #recherche .encart-recherche3 {
    float: none;
    margin: 2em 0em 0em 2em;
    width: 52em;

}

#integration #recherche input[type=submit]{margin: 2em 0 0 1em;}


#integration .descriptif-immo{
	width:32em
}
#integration ul.liste-immo li{
	width:14.5em;
	float: left;
	font-size: 12px;
}

#integration .bien-immo h2{text-align:center}
/******** Fin MODULE IMMO   ****************/
.image { width:100%; height:auto; padding:0em}
#pied	{width:700px;padding:0 10px}

#baspage	{width:700px;}

#pav ul li a{width:230px;}
#pav ul li a div.plus {display:none}
#pav ul li a:hover div.plus {display:none}
#scrollToTop a{
display:none
}
	footer ul{padding:0px}
}
@media screen and (max-width:720px){
body {overflow-x:hidden ; max-width:60em; font-size:6px; margin: 0 auto}


#slogan p{ font-size:24px; text-align:center; color:#4B4B4D; padding-top:20px; margin:0}

#actu a{margin:155px 0 0 80px; }
#conteneur	{
	width:auto;
	margin:0px auto;
	background:url(../charte/fond-conteneur.jpg) repeat-y top center ;
}
#animation {display:none}
#masque {display:none}

#ami {display:none}
#favoris {display:none}


nav	{width:auto; height:auto; background:#4B4B4D;}
.image { width:100%; height:auto}
.dropmenu ul{
/*######################################################################################################*/
	width: auto; /*Largeur du sous-menu*/
	z-index:20;
	
/*######################################################################################################*/
}
.dropmenu li ul{
/*######################################################################################################*/
	width: 100%;
							/*Largeur du sous-menu*/
										/*fond de couleur des sous-rubriques*/
/*######################################################################################################*/
color:#fff
}
.dropmenu li ul li{
/*######################################################################################################*/
	background-color:#333;				/*fond de couleur des sous-rubriques*/
/*######################################################################################################*/
}
.dropmenu li ul li a{
	display:block;
	color:#fff
}

.dropmenu li{width:100%; border-top:1px solid white;border-left :none}
.dropmenu li a {color:#fff;padding:5px 20px; font-size: 24px} 
.dropmenu li:first-child{border-top:none}


#integration { clear:both; width:auto; max-width:960px;border-top:3px solid #000}
#integration p{text-align:justify}
#integration p.test{clear:both}

#slide {float:none; margin:10px auto;border:1px solid #1f1a17;width:300px;height:225px}
#slide img {max-width:100%;width:100%; height:auto}
.map {width:300px; height:247px}
ul.no-mobile {display:none}
div#pied ul li.no-liens {display:none}

#pied	{width:340px;padding:0 10px;min-height: 180px;}

#baspage	{width:340px;}

#logo-distributeur{display:none}
.encart {width:80%; min-height:80px; height:auto}
#facebook {position:absolute; margin:10px}
.btmenu {position:absolute; right:0.625em; top:0.625em; z-index:90; cursor:pointer}



li.mobile {display:block}
li.mobile a {
	background-color:#fff;			/*fond de couleur des rubriques*/
	opacity:0.8;
	color:#35D4FE;	
}
.no-mobile {display:none}
.mobile {display:block}

.menu-open {position:absolute; float:right; display:block; right:0.625em; top:0.625em; z-index:90; cursor:pointer}
.demi {width:56em; margin:1em;}
.quarts {width:28em; margin:1em 15em;}
.tiers {width:50em;margin: 1em 3em;height: auto;}
.bloc60{width:50em; margin:1em 4em;}
.bloc40{width:44em; margin:1em 7em;}
.bloc70{width:54em; margin:1em 2em;}
.bloc30{width:40em; margin:1em 9em;}
#height3{height: auto}
.demi2 { width: 55em;}
a .encart-contact{width: 52em; margin:1em; float:left; padding:1em;}
#livre{display:none}
#actualite-charte{float:none;min-height:500px}
#integration .cercle{
		width:35em; 
		height:35em; 
	float:none;
		margin:0.5em auto 0 auto;
}
input{margin-left:10px}
textarea{margin-left:10px}

#integration label{margin-left: 20px;text-align: left;}
#integration .label-long{width:200px}
#integration .photo-catalogue{float:none;margin:auto;text-align:center}


/* DEBUT TABLEAU RESPONSIVE */


    /* Force table to not be like tables anymore */
	#no-more-tables table, 
	#no-more-tables thead, 
	#no-more-tables tbody, 
	#no-more-tables th, 
	#no-more-tables td, 
	#no-more-tables tr { 
		display: block; 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	#no-more-tables thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
 
	#no-more-tables tr { border: 1px solid #eee; margin-top: 1em;}
 
	#no-more-tables td { 
		/* Behave  like a "row" */
		border: none;
		/* border-bottom: 1px solid #eee; */
		position: relative;
		padding-left: 50%; 
		white-space: normal;
		text-align:left;
	}
 
	#no-more-tables td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	}
 
	/*
	Label the data
	*/
	#no-more-tables td:before { content: attr(data-title); }

/* FIN TABLEAU RESPONSIVE */

.thepet { background-color:#FFF}

#integration a .deconnexion{float:none;margin:auto;width:20em}
#integration a .deconnexion p{text-align:center}

#integration .bloc-gauche-catalogue{float:none;width:49em}
#integration .bloc-droit-catalogue{float:none;width:49em}

#integration .bloc-gauche-garagiste{width:47em;float:none;margin-left:10px}
#integration .bloc-droite-garagiste{width:50em;float:none}
#integration .bloc-vehicule {
	width: 100%;
	float:none;
}
#integration .liste-vehicule .bloc-vehicule {
	float: none;
	width: 50em;
	text-align:center
}
#integration .liste-vehicule .bloc-photo-vehicule {
	float: none;
	width: 50em;
	text-align:center;
}
#integration .liste-vehicule .prix-vehicule{float:none;text-align:center;width:95%}
#integration .liste-vehicule .bloc-vehicule .exclu {float:none;width:95%}
#integration .liste-vehicule .infos{width:95%}
#integration .encart-recherche .champ-recherche{width:20em;float:left;margin-top:1em}
#integration .encart-recherche input[type="submit"]{
	padding:0.5em;
	width:90%;
}

#integration .cat-vehicules{width:25em;height:10em}
#integration .encart-recherche .cat-vehicules label{
margin-left:0px}
#integration .photo-moto{height:140px}
#integration .exclu-moto{ width:92%;}
.feedback1-input { padding:0px}


/******** MODULE IMMO  ****************/


#integration a #liste-immo{width:52em}
#integration a #liste-immo:hover{width:52em}

#integration .bloc-immo-photo {
	float: none;
	width: 52em;
	text-align:center;
}

#integration .bloc-immo-annonce {
	width: 52em;
	float: none;
	text-align:center;
}

#integration #liste-immo .prix{float:none;
width:100%;	
text-align:center;
}

#integration #liste-immo .infos{
	float: none;
	width: 95%;
}
#integration .exclu {
	float: none;
	width: 95%;
	margin:0.5em 0 0 0;
}

#integration #liste-immo .exclu-annonce{	
	width: 95%;
}

#integration #recherche .encart-recherche2, #integration #recherche .encart-recherche{width:54em;margin-top:2em}

#integration #recherche .encart-recherche label{margin-left:0px}

#integration #recherche a .bouton-recherche{margin: 1em 0 0 0.5em;}

#integration #recherche .encart-recherche3 {width: 20em;
}

#integration .photo-immo{width:54em;float:none;margin:auto}
#integration .details-immo{width:54em; float:none;margin:auto;clear:both}


#integration .descriptif-immo, #integration .performance{
	width:54em;
	float:none
}

#integration ul.liste-immo li{
	width:20em;
}


#integration .simulateur{margin-left:1em;width:52em}

#integration .bloc-centrer .bien-immo{
	width:50em;
	float:none
}
#integration .bien-immo h2{text-align:left}
#integration p.label-immo{text-align:center}
#liste-immo .prix{float:none;margin:0.6em 0em}
.image { width:100%; height:auto; padding:0em}
#pav { background:#fff}
#pav ul li a{width:320px; margin: 5px 20px}
#pav ul li a div.plus {display:none}
#pav ul li a:hover div.plus {display:block}
footer ul{padding:0px}

	}
