/* CSS Document */
@import url(option-red-2.css);

body {
	font: normal 12px arial, serif;
	margin:0px;
	padding:0px;
  background: url(../i/background.jpg) #efefef;
}

#wrapper {
  text-align:center;
  padding-top: 13px;
}

#maincontent {
  margin: 0 auto;
  width: 974px;
  padding: 10px 13px 0px 13px;
  text-align: left;
}

a, a:hover {
  font: normal 12px Arial,Serif;
  color: #333333;
  text-decoration: none;
}

h1,h2,h3,h4,h5,h6,div,p,td {
  padding:0px;
  margin:0px;
  font-family: arial,serif;
  color: #333333;
}

img {
  border: 0px;
}

form {
  margin: 0px;
  padding: 0px;
}

.clearer {
  clear: both;
}

#validator {
  position: absolute;
  background: red;
  padding: 3px;
  border: 1px solid #333333;
  top: 5px;
  right: 5px;
  color: white;
}

/* -------------------------------------------- header */
      
#header {
  padding: 0px 0px 20px 12px;
  position: relative;
}

#header h1 {
  font: normal 18px Arial,Serif;
  margin-left: 28px;
}

#header h2 {
  font: normal 14px Arial,Serif;
  margin-left: 28px;
}

#header h2 strong {
  font-weight: normal;
  color: #cc0000;
}

#header h3 {
  font: normal 22px Arial,Serif;
  position: absolute;
  top: 75px;
  left: 430px;
}


#header img {
  border: 1px solid #cccccc;
}

/* -------------------------------------------- menu */

ul#menu {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

ul#menu li {
  display: block;
  float: left;
  width: 165px;
  margin-right: 26px;
}

ul#menu li a,
ul#menu li a:hover {
  font: normal 16px/47px Arial,Serif;
  color: #333333;
  text-decoration: none;
  display: block;
  float: left;
  height: 47px;
  width: 100px;
  padding-left: 75px;
}

ul#menu li.selected a,
ul#menu li a:hover {
  color: #cc0000;
}

ul#menu li#home a {
  background: url(../i/home.jpeg) no-repeat top left;
}
ul#menu li#linkHistorique a {
  background: url(../i/bt_history.jpg) no-repeat top left;
}
ul#menu li#linkCarte a {
  background: url(../i/bt_carte.jpg) no-repeat top left;
}
ul#menu li#linkCal a {
  background: url(../i/bt_cal.jpg) no-repeat top left;
}
ul#menu li#linkContacter a {
  background: url(../i/bt_contacter.jpg) no-repeat top left;
}

ul#menu li#linkFinancement a {
  background: url(../i/bt_financement.jpg) no-repeat top left;
}
ul#menu li#linkService a {
  background: url(../images/accueil.jpg) no-repeat top left;
}
ul#menu li#linkOutLink a {
  background: url(../i/outlink.jpg) no-repeat top left;
}
ul#menu li#linkOutLink2 a {
  background: url(../i/outlink.jpg) no-repeat top left;
}
ul#menu li#linkOutLink3 a {
  background: url(../i/outlink.jpg) no-repeat top left;
}
ul#menu li#linkAccessoire a {
  background: url(../images/service.jpg) no-repeat top left;
}

ul#menu li#linkInventaire a {
  background: url(../i/bt_inventaire.jpg) no-repeat top left;
}

ul#menu li#linkInventaireVR a {
  background: url(../i/camper.jpg) no-repeat top left;
}

ul#menu li#linkInventaireHeavyVR a {
  background: url(../i/camion.jpg) no-repeat top left;
}
/* ----------------------------------------------- content */

#columns {
  clear: both;
  padding-top: 18px;
  width: 974px;
}

#wideColumn {
  float: left;
  display: block;
  width: 668px;
}

#narrowColumn {
  float: right;
  display: block;
  width: 301px;
}
        
/* ----------------------------------------------- boxes */

#wideColumn .block {
  clear: both;
  width: 668px;
  margin-bottom:18px;
  background: url(../i/wide-shadow-bg.gif) repeat-y;
}


#wideColumn .block .b1 {
  width: 668px;
	background: url(../i/wide-shadow-top.gif) no-repeat top;
}

#wideColumn .block .b2 {
  background: url(../i/wide-shadow-btm.gif) no-repeat bottom;
  width: 660px;
	padding: 10px 4px 5px 4px;
}


#wideColumn .blockMarque {
  clear: both;
  width: 330px;
  margin-bottom:18px;
  background: url(../i/330-shadow-bg.gif) repeat-y;
}


#wideColumn .blockMarque .b1 {
  width: 330px;
	background: url(../i/330-shadow-top.gif) no-repeat top;
}

#wideColumn .blockMarque .b2 {
  background: url(../i/330-shadow-btm.gif) no-repeat bottom;
  width: 330px;
	
}

#narrowColumn .block {
  width: 301px;
  margin-bottom:18px;
  background: url(../i/narrow-shadow-bg.gif) repeat-y;
}

#narrowColumn .block .b1 {
  width: 301px;
	background: url(../i/narrow-shadow-top.gif) no-repeat top;
}

#narrowColumn .block .b2 {
  background: url(../i/narrow-shadow-btm.gif) no-repeat bottom;
  width: 273px;
	padding: 10px 12px 5px 16px;
}

.block h2 {
  font: normal 16px Arial,Sans-serif;
  color: #333333;
  padding: 0px 7px 2px 7px;
  border-bottom: 1px solid #D8D8D8;
}
.blockMarque h2 {
  font: normal 16px Arial,Sans-serif;
  color: #333333;
  padding: 0px 7px 2px 7px;
  width:306px;
  border-bottom: 1px solid #D8D8D8;
}
#narrowColumn .block h2 {
  text-align: center;
  color: #cc0000;
}

.blockMarque h2.main {
  color: #cc0000;
}

.blockMarque p {
  margin-top: 6px;
}

.block h2.main {
  color: #cc0000;
}

.block p {
  margin-top: 6px;
}

/* ----------------------------------------------- footer menu */

#footerMenu {
  clear: both;
  height: 21px;
  background: #cc0000;
}

#footerMenu,
#footerMenu a,
#footerMenu a:hover {
  font: normal 14px/21px Arial,Sans-serif;
  color: #ffffff;
}

/* ----------------------------------------------- footer */

#footerbg {
  background: #efefef;
  padding: 7px 0px 50px 0px;
}


#footer {
  margin: 0 auto;
  width: 974px;
  text-align: left;
  position: relative;
  height: 100px;
}

#copyright {
  left: 210px;
  top: 10px;
  width: 568px;
  position: absolute;
  font: normal 11px Arial,Serif;
  text-align:center;
}

#poweredby a {
  font-weight: bold;
  display: block;
  font-size:6pt;
}


#poweredby {
  left: 785px;
  top: -6px;
  width: 180px;
  
  position: absolute;
}


/* ----------------------------------------------- information block */

#informationBlock.block .b2 {
  width: 668px;
	padding-left: 0px;
	padding-right: 0px;
}

#informationBlock.block h2 {
  margin-left: 4px;
	margin-right: 4px;
}

#informationBlock .phoneinfo {
  float: left;
  clear: left;
}

#informationBlock .locationinfo {
  float: right;
  clear: right;
  padding-right: 17px;
}

#informationBlock .webinfo {
  clear: both;
  background: #efefef;
}

#informationBlock span {
  padding: 0px 17px 0px 17px;
}

#informationBlock p {
  padding: 7px 0px 7px 0px;
}

#informationBlock p.link {
  padding: 12px 0px 7px 17px;
}

#informationBlock p.link a {
  font-size: 11px;
}

/* ----------------------------------------------- infos block */

#infosBlock p {
  padding-left: 13px;
  padding-right: 13px;
}

/* ----------------------------------------------- recherche block */

#rechercheBlock form {
  margin:0px;
  padding: 15px 0px 7px 0px;
}

#rechercheBlock label {
  font-size: 11px;
  color: #cc0000;
}

#rechercheBlock p {
  text-align: left;
  padding: 2px 0px 2px 60px;
  margin:0px;
}

#rechercheBlock p.marquee select,
#rechercheBlock p.modele select {
  width: 160px;
}

#rechercheBlock p.annee select {
  width: 48px;
}

#rechercheBlock p.prix select {
  width: 70px;
}

#rechercheBlock .buttons {
  padding: 15px 8px 0px 0px;
  text-align: right;
}

#rechercheBlock .buttons button {
  border: 0px;
  background: url(../i/submitbg.jpg) no-repeat top left;
  padding-left: 32px;
  text-align:left;
  width: 107px;
  height: 24px;
  font: normal 14px/24px Arial,Serif;
  color: #4b4b4b;
}

/* ----------------------------------------------- offerts block */

#offertsBlock.block .b2 {
  width: 285px;
	padding-right: 0px;
}

#offertsBlock.block h2 {
	margin-right: 12px;
}

#offertsBlock .offerts {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  list-style: none;
  clear: both;
}

#offertsBlock .offerts li {
  margin: 10px 8px 0px 0px;
  float: left;
  display: block;
  width: 120px;
  padding: 5px;
  background: #f3f3f3;
}

#offertsBlock .offerts li img {
  border: 1px solid #d8d8d8;
  margin: 0px;
}

#offertsBlock .offerts li .details {
  padding: 25px 0px 20px 14px;
}

#offertsBlock .offerts li p {
  padding: 0px;
  margin: 0px;
  color: #000000;
}

#offertsBlock .offerts li p span {
  color: #cc0000;
}

#offertsBlock .clearer {
  height: 10px;
}

/* ----------------------------------------------- results */

#marques {
  clear: both;
  padding: 5px;
  text-align: center;
}

#resultatsBanner {
  clear: both;
  display: block;
  width: 942px;
  padding: 7px 15px 9px 15px;
  margin: 5px 0px 5px 0px;
  height: 32px;
  line-height: 25px;
  background: url(../i/resultssumbg.jpg) no-repeat top left;
}

#resultatsBanner .title {
  font: normal 16px/25px Arial,serif;
  color: #cc0000;
}

#resultatsBanner label {
  padding-left: 40px;
  padding-right: 5px;
  color: #cc0000;
}

#resultatsBanner select {
  vertical-align: middle;
}

#resultatsBanner select.marque,
#resultatsBanner select.croissant {
  width: 160px;
}

#resultatsBanner select.paging {
  width: 50px;
}

#resultatsBanner button {
  background: url(../i/tierbg.jpg) no-repeat left top;
  vertical-align: middle;
  border: none;
  width: 77px;
  height: 22px;
  color: #333333;
  margin-left: 15px;
  padding: 0px;
  font: normal 12px Arial,serif;
}
 
/* ----------------------------------------------- result list */
/*
<div id="results">
        <div class="header">
          <div class="annee">Année</div>
          <div class="foto">Photo</div>
          <div class="marque">Marque / Modele</div>
          <div class="prix">Prix</div>
          <div class="km">Km</div>
        </div>
        */

#results {
  
}

#results .header {
  background: #cc0000;
  height: 24px;
}

#results .header .annee,
#results .header .foto,
#results .header .marque,
#results .header .prix,
#results .header .km {
  display: block;
  float: left;
  text-align: center;
  font: normal 12px/24px Arial,serif;
  color: white;
}

#results .header .annee {
  width: 64px;
}

#results .header .foto {
  width: 120px;
}

#results .header .marque {
  width: 260px;
}

#results .header .prix {
    width: 82px;
}

#results .header .km {
  margin-left: 64px;
  width: 90px;
}



#results .item {
  margin: 12px 0px 20px 0px;
  clear: both;
	height: 80px;
overflow:hidden;
}

#results .item .annee,
#results .item .marque,
#results .item .prix,
#results .item .km {
  display: block;
  float: left;
  text-align: center;
  font: bold 14px/28px Arial,serif;
  background: #efefef;
  height: 28px;
}

#results .item .annee,
#results .item .prix {
  color: #cc0000;
}

#results .item .foto {
  display: block;
  float: left;
  width: 120px;
  height: 90px;
}

#results .item .foto img {
  border: 1px solid #efefef;
}

#results .item .details {
  /* display: block; */
  width:770px;
  float: left;
}

#results .item .details p {
  float: left;
  display: block;
  width: 770px;
  margin: 0px;
  padding: 8px;
}

#results .item .row1 {
  background: #efefef;
  height: 28px;
  width: 770px;
}

#results .item .annee {
  width: 64px;
}


#results .item .marque {
  width: 240px;
}

#results .item .prix {
  margin-left: 10px;
  width: 100px;
}

#results .item .km {
  margin-left: 64px;
  width: 90px;
overflow:hidden;
}

#results .item .fav {
  display: block;
  float: left;
  width: 13px;
margin-left:70px;
}

#results .item .fav a,
#results .item .fav a:hover {
  
  font: normal 12px/28px Arial,serif;
  color: #cc0000;
  background: url(../i/favlinkicon.jpg) no-repeat right;
  padding: 3px 22px 3px 0px;
  
}

/* ------------------------------------------------------- pagingbar */

#pagingbar ul, #pagingbar li, #pagingbar a {
	padding: 0;
	margin: 0;
	border: none;
	text-decoration: none;
	font-weight: normal;
	font-style: normal;
	list-style: none;
	text-transform: none;
	text-indent: 0px;
	font-variant: normal;
	text-align: left;
	line-height: 12px;
	letter-spacing: 0px;
	word-spacing: 0px;
	font-size: 11px;
	font-family: Arial;
}

#pagingbar {
	padding: 10px 0px 10px 400px;
}

#pagingbar ul {
  width: 100%;
}

#pagingbar li {
	float: left;
	display: block;
	margin-bottom: 2px;
}

#pagingbar a {
	padding: 3px;
	padding-left: 11px;
	padding-right: 11px;
	margin-left: 2px;
	margin-right: 2px;
	display: block;
	color: #333333;
	border: 1px solid #cccccc;
}

#pagingbar li a:hover {
	border-color: #666666;
	background: #efefef;
	color: #000000;
}

#pagingbar li button {
  background: url(../i/pagingbutton.gif) no-repeat left top;
  width: 77px;
  height: 22px;
  border: none;
  font: normal 12px/22px Arial,serif;
  color: #333333;
  padding: 0px;
  margin: 0px 0px 0px 10px;
}

#pagingbar li button span {
  font: normal 12px/22px Arial,serif;
  color: #cc0000;
}

#pagingbar li.active_page a {
	font-weight: bold;
}