html,
 body {
  font-size: 90%;
 }
 body {
  font-family: 'Roboto', sans-serif;
  /* font smoothing for Chrome */
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-smooth: always;
  transform: rotate(-0.0000000001deg);
  -webkit-font-smoothing: subpixel-antialiased;
  text-shadow: transparent 0 0 1px;
  background: #e1e2e1 none repeat scroll 0% 0%;
 }
 
 h1, h2, h3, h4, h5, h6 {
	font-family: "Roboto",sans-serif;
    color: #022E5F;
}

h2 {font-size: 1.5rem;}
h3 {color: #86B700;}

p {color: #022e5f;}

table{
    width:100%;
}
 
.fullwidth {
	max-width: none !important;
}
 
img.logo {
	max-width: 400px;
    width: 100%;
	display: block;
  	margin: 0.5em;
	float: left;
}

.top-bar {
	height: 5rem;
	background-color: #ffffff;
}

/* Contains logo */
.top-bar .title-area {width: 60%;}

.slogan {
    background: #ffffff none repeat scroll 0% 0%;
    position: relative;
    text-align: center;
	margin: 0 auto;
    width: 100%;
	padding: 1em 0 2em 0;
}

.white {background: #ffffff none repeat scroll 0% 0%;}

.top-bar-section .right {width: 30%;}
.top-bar-section ul.right {display: inline;}

h1.home {
    border-bottom: 0.3em solid #c3d600;
    font-size: 1.2em;
    font-style: italic;
    font-weight: 300;
    line-height: 0.1em;
    margin: 10px 0 20px;
    text-align: center;
    /*text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff, 0 0 100px #ffffff, 0 0 150px #ffffff;*/
    width: 100%;
}
h1.home span, h2.home span {
    background-color: #fff;
    padding: 0 0.8em;
}
h2.home {
    border-bottom: 0.3em solid #8ba4d5;
    font-size: 1em;
    font-style: italic;
    font-weight: 300;
    line-height: 0.1em;
    margin: 10px 0 20px 0;
    text-align: center;
    /*text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff, 0 0 100px #ffffff, 0 0 150px #ffffff;*/
    width: 100%;
}

/*@media only screen and (max-width: 480px) {
      h1 { font-size: 18px !important; }
      h2 { font-size: 14px !important; }
      h3 { font-size: 12px !important; }
	  
	 img.logo {
    	max-width: 350px;
	    width: 60%;
	}
}*/

/* degrade */
.grad {
    background-image: url("../img/bg-degrade.png");
    width: 100%;
    height: 5em;
    background-repeat: repeat-x;
}

.content {
  background: #e1e2e1 none repeat scroll 0% 0%;
  margin-top: 0.5em;
}

#homepage .content .row img { width: 100%; max-width: 180px;}
#homepage .content .row h4 {
    font-weight: 500;
    text-align: center;
    font-size: 1.2em;
}
#homepage .content .row p {margin-bottom: 0.2rem;}

/*#homepage .row, #homepage .content .row {max-width: none;}*/
#homepage .content .row .left50 {float: left !important; width: 50%;}
#homepage .content .row .right50 {float: right !important;; width: 50%;} 

ul.example-orbit {max-width: 400px; margin: 0 auto;}

.contact {
	width: 100%;
	background-color:#A0ADE5;
	margin: 1.5em 0;
}

.transparent {background: transparent none repeat scroll 0% 0%;}

#contact a {display:inline}
#contact img {
	display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1rem;
	width: 100%;
	max-width: 900px;
}

.footer img {
    max-width: 75px;
    width: 100%;
}

 .footer {
	background: #dee0df none repeat scroll 0% 0%;
    text-align: center;
    width: 100%;
  	padding-top: 0.5rem;
 }

.footer .social {margin: 0 auto;}
.footer ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}
.footer ul li {display: inline-block}
.footer ul.links li a {padding: 0.5rem 1rem;}
 .footer ul.links li a:link, .footer ul.links li a:visited {color: #022E5F; text-decoration: underline;}

/* Devis */
.stepsdevis_1 {
	background-image:url(../img/steps-devis-n.png);
	background-position: left top;
	background-repeat: no-repeat;
    display: block;
	width: 300px;
	height: 80px;
	margin:0 auto;	
}

.stepsdevis_2 {
	background-image:url(../img/steps-devis-n.png);
	background-position: left;
	background-repeat: no-repeat;
    display: block;
	width: 300px;
	height: 80px;
	margin:0 auto;	
}

.stepsdevis_3 {
	background-image:url(../img/steps-devis-n.png);
	background-position: bottom;
	background-repeat: no-repeat;
    display: block;
	width: 300px;
	height: 80px;
	margin:0 auto;	
}

/* Form padding */
#content form {padding-top: 1.5rem;}
select, label {color: #022e5f;}
label, .bold {font-weight: bold;}
p.bold span {font-weight: normal;}
span.postfix {background: transparent none repeat scroll 0% 0%; border: none;}
span.postfix img {max-width: 30px; margin-left: 0.3em;}
form .postfix {text-align:left;}
form .note {font-size: 0.9em; font-style:italic;}
.button {background-color: #A0ADE5; border: 1px solid rgb(105, 126, 214);}

button[type=submit] {
 -webkit-appearance: none; -moz-appearance: none;
 display: block;
 margin: 1.5em 0;
 font-size: 1em; line-height: 2.5em;
 color: #ffffff;
 font-weight: bold;
 width: 70%;
 margin:0 auto;
 font-size:1.6em;
 background: #fdfdfd; background: -moz-linear-gradient(top, #fdfdfd 0%, #A0ADE5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#A0ADE5)); background: -webkit-linear-gradient(top, #fdfdfd 0%,#A0ADE5 100%); background: -o-linear-gradient(top, #fdfdfd 0%,#A0ADE5 100%); background: -ms-linear-gradient(top, #fdfdfd 0%,#A0ADE5 100%); background: linear-gradient(to bottom, #fdfdfd 0%,#A0ADE5 100%);
 border: 1px solid rgb(105, 126, 214);
 -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
}

/* Page de présentation d'un véhicule */
h2.subheader {
	color: #A0ADE5;
	vertical-align: middle;
}

.lettre {
	background: url('../img/head-letters.png');
	display: inline-block;
}

.a {background-position: -0px -0px; width: 30px; height: 30px;}
.b {background-position: -0px -36px; width: 30px; height: 32px;}
.c {background-position: -0px -80px; width: 30px; height: 30px;}
.d {background-position: -0px -120px; width: 30px; height: 30px;}
.e {background-position: -0px -160px; width: 30px; height: 30px;}

.icon {
	background: url('../img/head-icons.png');
	display: inline-block;
}

.handicap {background-position: 0px 4px; width: 30px; height: 32px;}
.personne {background-position: 0px -36px; width: 30px; height: 32px;}

/* same but in the content, not in the header */
.subheader .lettre {
	background: url('../img/head-letters-sm.png');
	display: inline-block;
} 

.subheader .icon {
	background: url('../img/head-icons-sm.png');
	display: inline-block;
}

.subheader span.num {display:block;}
.columns p.num {margin: 1rem; text-align: center; font-size: 1.3rem;}

.subheader .handicap {background-position: 0px 2px; width: 20px; height: 20px;}
.subheader .personne {background-position: 0px -26px; width: 20px; height: 20px;}

.subheader .a {background-position: -0px -0px; width: 20px; height: 20px;}
.subheader .b {background-position: -0px -26px; width: 20px; height: 20px;}
.subheader .c {background-position: -0px -53px; width: 20px; height: 20px;}
.subheader .d {background-position: -0px -80px; width: 20px; height: 20px;}
.subheader .e {background-position: -0px -107px; width: 20px; height: 20px;}


.prix {font-size: 3rem;}
.prix span {display:block; font-size: 80%;}
.prix a:link {text-decoration: none;}

/* H2 section */
.imgRight h2, .imgLeft h2 {font-size: 1.4rem; clear: none !important;}
.imgRight h3, .imgLeft h3 {font-size: 1.2rem; clear: none !important;}

.imgRight img {float:right; margin: 0 0 1em 1em; max-width: 160px;}
.imgLeft img {float:left; margin: 0 1em 1em 0; max-width: 160px;}

/* Line breaks in content */
.row p, .row li {word-wrap: break-word;}
input.demande-devis {width:90%; max-height:200px;}
input.mail {width:30%; margin: 2em 0;}
input[type="checkbox"] {margin-right: 0.5em;}
input[type="submit"] {margin: 0 0 1.5em 0;}

hr.bg {border-color: #A0ADE5; margin: 0 0 1em 0; }

/* @override */
.panel.callout {border: 1px solid #AAC2DC; background-color: #EAEAEA;}

/* Content */
.row a:visited {color: #102CE6;}

/* Lists */
#liste h1, #listeoccasion h2 {color: #A0ADE5; margin-bottom: 1em;}
#liste .text-left img, #listeoccasion .text-left img {padding: 2em 0 2em 1em; max-width: 100%; height: auto;}
/*#liste h3, #liste h4, #listeoccasion h3, #listeoccasion h4 {color: #022E5F; vertical-align: middle; display: table-cell;}*/
#liste h4, #listeoccasion h4 {color: #022E5F; vertical-align: middle; display: table-cell;}
#liste h3, #listeoccasion h3 {color: #022E5F;}
#liste h3 {font-size: 1.5rem;}
#listeoccasion h3 {font-size: 1.2rem;}
#liste h3 a:link, #liste h3 a:visited, #listeoccasion h3 a:link, #listeoccasion h3 a:visited {color: #022E5F;}
#liste h4 a:link, #liste h4 a:visited, #listeoccasion h4 a:link, #listeoccasion h4 a:visited {color: #022E5F;}
#liste h4, #listeoccasion h4 {font-size: 1rem; vertical-align: middle;}
#homepage h4 a:link, #homepage h4 a:visited {color: #022E5F;}
.prix a:link, #listeoccasion h4 a:visited {color: #022E5F;}

/* Accordeon */
#zl_wrapper h4 {font-size: 1.4375rem; display: inherit;}

.verticalcenter {
	display: table;
  	height: 11em;
  	text-align: center;
}

.verticalcenter img {vertical-align: middle; display: table-cell; }

.subheader strong {font-size: 1.5em; display: block; padding: 0.1em 0 0.1em 0}
.arrow-right {
	background: url('../img/arrow-right.png');
	display: inline-block;
	background-position: -0px -0px; width: 45px; height: 45px;
}

/* Test */

#liste .paper li, #listeoccasion .paper li {
  display: table;
  border: 1px solid gray;
  width: 100%;
  border-bottom: 1px solid;
  padding: 10px;
  white-space: normal;
}

#liste .paper img, #listeoccasion .paper img {
  /*max-width: 100%;*/
    max-width: 10em;
}
#liste .paper .post-title, #listeoccasion .paper .post-title {
  display: table-cell;
  margin-left: 5px;
  max-width: 100%;
  vertical-align: middle;
}
#liste .paper .post-title a, #listeoccasion .paper .post-title a {
  white-space: normal;
}

#liste .paper .post-title p, #listeoccasion .paper .post-title p {
  margin-bottom: 0;
  color: gray;
  font-size: 11px;
}
#liste .paper li > a, #listeoccasion .paper li > a {
  width: 90px;
  display: table-cell;
  vertical-align: middle;
}

/* France map */
#francemap {width: 300px; height: 255px; margin: 0 auto;}
@media (max-device-width: 640px) and (orientation: landscape) {
	/* Map */
	#francemap {width: 450px; height: 382px; margin: 0 auto;}
	/* Logo space bottom */
	.top-bar {
		height: 7rem;
		background-color: #ffffff;
	}
	
	/* Image in accordeon */
	.imgRight img {float:right; margin: 0 0 1em 1em; max-width: 320px;}
	.imgLeft img {float:left; margin: 0 1em 1em 0; max-width: 320px;}
}

/* Slider */
.slider {position: relative; width: 100%; margin:0 auto; padding-bottom: 1.5rem; margin-bottom: 1.5rem;}
.slider img{
	display:block;
    margin:auto;
}
/* Slider arrows */
.slick-prev, .slick-next {z-index: 1;}
.slick-prev {left: 20px;}
.slick-next {right: 20px;}
.slider ul {margin-left: 0;}

.linkdiv {position: relative;}
div.linkdiv a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-decoration: none; /* No underlines on the link */
    z-index: 10; /* Places the link above everything else in the div */
    background-color: #FFF; /* Fix to make div clickable in IE */
    opacity: 0; /* Fix to make div clickable in IE */
    filter: alpha(opacity=1); /* Fix to make div clickable in IE */
}

.spinner {position: fixed;top: 50%;left: 50%;}

/* Youtube video optimization - see http://avexdesigns.com/responsive-youtube-embed */
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;	
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Menu mobile */
.top-bar-section .open-nav{
	font-size:42px;
	color:#022E5F;
	width:65px;
	height:64px;
	line-height:64px;
	text-align:center;
	margin-top: 5px;
	float:right;
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
	transition:all 400ms ease;
}

.all-elements{
	position:absolute;
	overflow-x:hidden!important;	
	width:100%;
	/*height:100%;
	min-height:100%;
	max-height:100%;*/
}

#main {
	background-color: #E1E2E1;
    overflow-x: hidden;
	clear: both;
}

/* tt_content */

.flRight img {float:right; margin: 0 0 2rem 2rem;}
.flLeft img {float:left; margin: 0 2rem 2rem 0;}

/* wd_classifiedads - convert to lower case */
 /* 13.02.2016 - suppression du style à cause d'un effet non souhaité sur les titres des accordéons */
/*#zl_wrapper h4 {text-transform: lowercase;}*/
#zl_wrapper h4:first-letter {text-transform: capitalize;}

/* Powermail forms */
#formulaire legend {display: none;}
#formulaire fieldset {border: none; padding: 0;}
#formulaire label {font-size: 1.2rem;}

.button_submit, .handynamic_submit {text-align: center;}
img.tx-srfreecap-pi2-image {display: block; margin-left: auto; margin-right: auto; padding: 1rem;}
.powermail_check_inner_uid156_0 label, .powermail_check_inner_uid23_0 label, .powermail_check_inner_uid82_0 label {width:90%;}
#boxalert {font-size: 1.2rem; color: #022e5f;}
 .handynamic_submit input.powermail_submit, .tx-powermail-pi1_mandatory_submit, .csc-mailform-submit {
     background: #25A6E1;
     background: -moz-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#25A6E1),color-stop(100%,#188BC0));
     background: -webkit-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -o-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -ms-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#25A6E1',endColorstr='#188BC0',GradientType=0);
     padding:1rem 2.5rem;
     color:#fff;
     font-family:'Helvetica Neue',sans-serif;
     font-size:1.4rem;
     border-radius:4px;
     -moz-border-radius:4px;
     -webkit-border-radius:4px;
     border:1px solid #1A87B9;
     white-space: normal;
 }

 /* Checkbox in forms */
 input[type="checkbox"] + label {display: inline;}

 /* Upload files - post ad */
 #files_list input {
     background: #25A6E1;
     background: -moz-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#25A6E1),color-stop(100%,#188BC0));
     background: -webkit-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -o-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -ms-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#25A6E1',endColorstr='#188BC0',GradientType=0);
     padding: 0.5rem;
     margin: 0.5rem;
     color:#fff;
     font-family:'Helvetica Neue',sans-serif;
     font-size:1rem;
     border-radius:4px;
     -moz-border-radius:4px;
     -webkit-border-radius:4px;
     border:1px solid #1A87B9
 }

 /* multiple upload Powermail */
 /*input[type="file"].powermail_multiupload, input[type="file"].powermail_file, input[type="file"]#mailformattachment1, input[type="file"]#mailformattachment2 {
     background: #25A6E1;
     background: -moz-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#25A6E1),color-stop(100%,#188BC0));
     background: -webkit-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -o-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: -ms-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     background: linear-gradient(top,#25A6E1 0%,#188BC0 100%);
     filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#25A6E1',endColorstr='#188BC0',GradientType=0);
     padding: 0.5rem;
     margin: 0.5rem;
     color:#fff;
     width: 25%;
     font-family:'Helvetica Neue',sans-serif;
     font-size:1rem;
     border-radius:4px;
     -moz-border-radius:4px;
     -webkit-border-radius:4px;
     border:1px solid #1A87B9
 }*/

 /* Override Jquery Mobile styles */
 .ui-page-theme-a a,
 html .ui-bar-a a,
 html .ui-body-a a,
 html body .ui-group-theme-a a {
     color: #102CE6 /*{a-link-color}*/;
     font-weight: bold;
 }
 .ui-page-theme-a a:visited,
 html .ui-bar-a a:visited,
 html .ui-body-a a:visited,
 html body .ui-group-theme-a a:visited {
     color: #102CE6 /*{a-link-visited}*/;
 }

 .required {color: #EF0C0C; font-weight: 600;}
 .label.alert {font-size: 1.2rem; margin: 1.5rem;}

 /* Devis */

 /* deactivate fullscreen view in JQM */
 /* "page" containers - full-screen views, one should always be in view post-pageload */
 /*.ui-mobile [data-role=page],
 .ui-mobile [data-role=dialog],
 .ui-page {
     top: 0;
     left: 0;
     width: 100%;
     min-height: 100%;
     position: absolute;
     display: none;
     border: 0;
 }*/

 .ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper {
     background-color: #E1E2E1;
 }

 #devis_step3 p {font-size: larger}
textarea#precisions {height: 10em;}
 .ui-content, .ui-overlay-a, #wizzard {
     background: #e1e2e1 none repeat scroll 0% 0%;
 }

 /* transverse navigation */
 #pagination
 {
     font-size : 0.6rem;
     font-weight: 800;
     list-style-type : none;
     margin : 0;
     overflow : hidden;
     padding : 0 0 1.2rem 0;
     text-transform : uppercase
 }
 #pagination li
 {
     display : inline
 }
 #pagination a,#pagination a:visited
 {
     color : #FFFFFF;
     text-decoration : none;
     padding: 0.7rem 0.7rem !important;
     background-color: #A0ADE5 !important;
     border: 0.1rem solid #FFFFFF !important;
     border-radius: 0.5rem !important;
 }
 #pagination a:hover
 {
     text-decoration : none
 }
 #pagination .pagination-prev a
 {
     /*background : url(previous.gif) no-repeat left center;*/
     float : left;
     margin: 0 0 0 0.3rem;
     /*padding-left : 20px*/
 }
 #pagination .pagination-next a
 {
     /*background : url(next.gif) no-repeat right center;*/
     float : right;
     margin: 0 0.3rem 0 0;
     /*padding-right : 20px;*/
     text-align : right
 }

 /* Change links color */
 .content a {color: #102CE6; text-decoration: underline; line-height: inherit;}
 .content li a:visited {color: #102CE6; text-decoration: underline; line-height: inherit;}

 /* Go to the main site */
 #skip {padding: 2rem 0; font-size: 1rem; width: 100%;}

 .button-link {
     padding: 0.6rem 0.8rem;
     background: #A0ADE2;
     color: #FFFFFF;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     border: solid 1px #FFF;
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
     -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
     -webkit-transition-duration: 0.2s;
     -moz-transition-duration: 0.2s;
     transition-duration: 0.2s;
     -webkit-user-select:none;
     -moz-user-select:none;
     -ms-user-select:none;
     user-select:none;
 }

 .back-button {
     padding: 0.2rem 0.8rem;
     background: #fff;
     color: #022E5F;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     border: solid 1px #FFF;
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
     -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
     -webkit-transition-duration: 0.2s;
     -moz-transition-duration: 0.2s;
     transition-duration: 0.2s;
     -webkit-user-select:none;
     -moz-user-select:none;
     -ms-user-select:none;
     user-select:none;
 }
 a.back-button {font-weight: normal; color: #022E5F;}

 #skip a:link {color: #fff;}
 #skip a:visited {color: #fff;}
 input.powermail_file, input.powermail_multiupload {font-size: 1.2rem; margin: 1rem 0;}
 .tx_powermail_pi1_fieldwrap_html_file input {font-size: 1.2rem; margin: 1rem 0;}

 @media all and (orientation:landscape) {
     /* Styles for Landscape screen */
     #liste .text-left img, #listeoccasion .text-left img {padding: 1em 0 1em 1em; max-width: 100%; height: auto;}

     #liste .paper img, #listeoccasion .paper img {
         /*max-width: 100%;*/
         max-width: 14em;
     }
 }
/* A supprimer après mise en ligne */
#demo h3 {color: #022E5F; font-size: 1.5rem; margin: 1em;}
#demo h3 a:link, #demo h3 a:visited {color: #102CE6;}