
/*### css ###*/
/*Silver6 vertical mini slide */
@media screen and (max-width:960px){
	html {background:#58595b}
body {overflow-x:hidden ; max-width:60em; font-size:12px; margin: 0 auto}
#conteneur	{
	width:auto;
	margin:0px auto;
	background:none;
	background-color:#CCCCCC;
	
}
#actu a{margin:10px 0 0 500px; }
#conteneur2	{
	width:60em;
	margin:0px auto;
	background:none;
	background-color:#fff;
}


#entete {height:280px; background:#fff}

#logo {float:none; margin:0 auto; text-align:center; width:auto; background:url(../charte/fond-logo-responsive.jpg) #fff no-repeat top center; height:160px;}
#slogan {display:block;float:none; margin:0 auto; text-align:center; width:auto; background:url(../charte/fond-slogan-responsive.jpg) #fff no-repeat top center; clear:both; height:120px;}
#slogan p{ font-size:18px; text-align:center; color:#58595b; padding-top:30px; margin:0}

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

nav	{width:100%; height:100%; background:#fff;}


.dropmenu ul{
	width: 51.4em;
	background-color:#222222;
	position: absolute;
	display: none;
	padding: 0px;
	margin: 0px;
	z-index:20;
}
.dropmenu ul a {
/*######################################################################################################*/
	border: 1px solid #f46f22;	
	color:#f46f22;/*taille et couleur de la bordure autour des sous-rubriques*/
/*######################################################################################################*/
	display:block;
}
.dropmenu ul a:hover {
/*######################################################################################################*/
	background-color: #f46f22;	
	color:#fff;/*fond de couleur des sous-rubriques au survol*/
/*######################################################################################################*/
}

	
ul.dropmenu2{font-size:15px;}
.dropmenu2 li a{padding:0 5px;}


.image { width:100%; height:auto; padding:0em}

.dropmenu li{width:100%; border-top:1px solid #f46f22}
.dropmenu li a {color:#f46f22;padding:5px 20px;line-height:40px;} 
.dropmenu li:first-child{border-top:none}
.btmenu {position:absolute; right:1.625em; top:1.625em; z-index:90; cursor:pointer}



section#integration {/*width:auto;*/width:58em; max-width:960px;float:left;}
#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;min-height: 160px}

#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}
.menu-open {position:absolute; float:right; display:block; right:0.625em; top:0.625em; 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}
.demi {width: 28em; margin:0.5em; float:left;}
.tiers {
    width: 16.3em;
    margin: 1em;
    float: left;
    height: 14em;
}
.quarts {width:13.5em; margin:0.5em; float:left; }
.bloc60{width:36em; margin:0.5em; float:left; }
.bloc40{width:18em; margin:0.5em; float:left;}
.bloc70{width:35em}

#livre{display:none}

#integration a .deconnexion p, #integration div.centrer p, #integration p.centrer{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}

#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}

#integration a #categorie{width:12em;}
#pav ul li a{width:230px;}
#pav ul li a div.plus {display:none}
#pav ul li a:hover div.plus {display:none}

#animation	{
	height:auto;
	width:100%;
	clear:both;
	background:url(../charte/fond-animation.jpg) no-repeat top center;
	margin:0px auto 0; }

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

}
#pied	{width:700px;padding:0 10px}

#baspage	{width:700px;}
#scrollToTop a{
display:none
}
a .encart-contact2 {
		width: 16.8em;}
	
	.tampon{width: 13em;
height: 13em;}
}
@media screen and (max-width:720px){
body {overflow-x:hidden ; max-width:60em; font-size:6px; margin: 0 auto}

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

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


nav	{width:100%; height:100%;}

.dropmenu ul{
	width: 25.7em;
	background-color:#222222;
	position: absolute;
	display: none;
	padding: 0px;
	margin: 0px;
}
.dropmenu ul a {
/*######################################################################################################*/
	border: 1px solid #CCC;				/*taille et couleur de la bordure autour des sous-rubriques*/
/*######################################################################################################*/
	display:block;
}
.dropmenu ul a:hover {
/*######################################################################################################*/
	background-color: #FFF;				/*fond de couleur des sous-rubriques au survol*/
/*######################################################################################################*/
}
	nav#navigation2	{width:auto; height:auto; background:#FBDC05;}
.dropmenu2 ul{
/*######################################################################################################*/
	width: auto; /*Largeur du sous-menu*/
	z-index:20;
	
/*######################################################################################################*/
}
.dropmenu2 li ul{
/*######################################################################################################*/
	width: 100%;
							/*Largeur du sous-menu*/
										/*fond de couleur des sous-rubriques*/
/*######################################################################################################*/
color:#fff
}
.dropmenu2 li ul li{
/*######################################################################################################*/
	background-color:#333;				/*fond de couleur des sous-rubriques*/
/*######################################################################################################*/
}
.dropmenu2 li ul li a{
	display:block;
	color:#fff
}

.dropmenu2 li{width:100%; border-top:1px solid #FF5A00; border-left:none}
.dropmenu2 li a {padding:5px 20px;} 
.dropmenu2 li:first-child{border-top:none}



.image { width:100%; height:auto; padding:0em}

.dropmenu li{width:100%; border-top:1px solid #f46f22}
.dropmenu li a {color:#f46f22;padding:5px 20px;} 
.dropmenu li:first-child{border-top:none}


section#integration { clear:both;/* width:auto;*/width:58em; max-width:348px;border-top:3px solid #f46f22;}
#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; height: auto;}

#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; float:left; }
.quarts {width:28em; margin:1em 15em; float:left; }
.tiers {width:46em; margin:1em 5em; float:left;height:auto }
.bloc60, .bloc70, .bloc30, .bloc40{width:55em; margin:1em 1em; float:left; }


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:52em}
#integration .bloc-droit-catalogue{float:none;width:52em}

#integration .bloc-gauche-garagiste{width:50em;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}


#integration #privatif{
	width: 50em;
	height: auto;
	background:none #e7e7e7
}

#integration #privatif .login{
	width:48em;
	
}


#integration #privatif .login p{text-align:left}

#integration a #categorie{width:25em;margin-top:2em}
#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}
#pied	{width:340px;padding:0 10px}

#baspage	{width:340px;}
	
	footer ul{padding:0px}
	
	a .encart-contact2 {
    width: 54em;
}
	.tampon{width: 30em;
height: 30em;}
	
#integration .tampon p {
    padding-top: 2.5em;
}	
	
	
	}
