/****************************
LMENTS HTML GNRAL
****************************/
/* On paramtre les informations gnrales */
html, body {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.85em;
background: #F5F5F5;
color: #356D50;
height: 100%;
}
/* Suppression des marging et padding d'lments principaux */
h1, h2, h3, h4, ol, ul, form {
margin: 0;
padding: 0;
}
a, a:visited {
color: #333339;
text-decoration: underline;
}
a:hover {
text-decoration: none;
}
a img {
border: none;
}
/* Gestion de la page gnrale */
#page {
font-size: 105%;
min-height: 100%;
_height: 100%;
position: relative;
}
/*******************
CONTENU HAUT
*******************/
/* Il s'agit de la partie principale de contenu avec le logo, le menu, l'animation et le moteur de recherche */
#contenu-haut {
background: url(bg-contenu-haut.png) #555458 top repeat-x;
min-height: 366px;
_height: 366px;
}
#sub-contenu-haut, #sub-contenu-haut-admin {
margin: 0 auto;
width: 852px;
position: relative;
min-height: 366px;
_height: 366px;
}
#sub-contenu-haut-admin {
background: url(bg-admin-menu.png) no-repeat right 66px;
}
/*****************************
HEADER : logo et menu
*****************************/
#header {
padding: 66px 0 0 0;
}
#header h2, #accessibility {
display: none;
}
#logo {
position: absolute;
top: 0;
left: 0;
width: 120px;
height: 65px;
}
#logo a {
display: block;
width: 120px;
height: 65px;
background: url(bg-logo.png) 0 0 no-repeat;
}
#logo a:hover {
background: url(bg-logo.png) -120px 0 no-repeat;
}
#logo span {
display: none;
}
#navigation {
position: absolute;
top: 0;
right: 0;
text-align: right;
height: 65px;
}
#navigation ul {
padding: 0;
list-style: none;
}
#navigation li {
display: inline;
color: #E9F4EF;
}
#navigation li a {
/* display: block; */
float: left;
height: 21px;
padding: 35px 0 5px 0;
margin: 0 6px;
color: #D8E1DD;
text-decoration: none;
}
#navigation li a.other, #navigation li a.other-active {
color: #AFAFB0;
}
#navigation li a:hover, #navigation li a.active, #navigation li a.other-active {
border-bottom: 4px solid #FFFFFF;
}
/***************************************************************
RECHERCHER : modules de recherches
***************************************************************/
#rechercher {
position: relative;
padding: 25px 0 0 510px;
background: #D2D1D2 url(bg-recherche.png) repeat-x top;
width: 342px;
border-right: 1px solid #FFFFFF;
min-height: 275px;
_height: 275px;
color: #333339;
font-size: 0.9em;
}
#rechercher h3 {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
padding: 0 0 10px 20px;
background: url(puce-bleu.png) no-repeat 0 8px;
font-size: 1.7em;
font-weight: normal;
}
#rechercher select.large, #recherche-avancee select.large {
width: 316px;
}
#rechercher select.small, #recherche-avancee select.small {
width: 150px;
}
#rechercher select.large, #rechercher select.small, #recherche-avancee select.large, #recherche-avancee select.small {
border: 1px solid #356D50;
color: #6F7075;
}
#rechercher .bt-valider {
text-align: right;
padding: 15px 30px 0 0;
}
#recherche-avancee {
width: 370px;
float: left;
border-right: 1px solid #356D50;
}
#simple-page {
width: 420px;
float: left;
text-align: justify;
}
#recherche-avancee p.bt {
text-align: center;
margin: 7px 0 0 0;
}
#derniers-ajouts {
padding: 0 0 0 410px;
}
#call-to-action {
padding: 0 0 0 485px;
}
#simple-page #form-contact input, #simple-page #form-contact textarea {
width : 418px;
border: 1px solid #356D50;
background: #F1F1F1;
font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
font-size: 1em;
}
#simple-page #form-contact input:focus, #simple-page #form-contact textarea:focus {
background: #FFFFFF;
}
#simple-page p.center {
width: 418px;
}
#simple-page #form-contact input.bt {
width: 212px;
border: none;
background: none;
}
#contenu-bas #simple-page p.msg-bon {
padding: 5px;
}
#showroom-large {
border: 1px solid #356D50;
padding: 4px;
margin: 5px 0 0 4px;
}
/***************************************************************
COORDONNEES : Si pas de recherche alors carte
***************************************************************/
#coordonnees {
position: relative;
padding: 10px 0 0 500px;
background: #D2D1D2 url(carte-2.png) no-repeat 487px 0;
width: 352px;
border-right: 1px solid #FFFFFF;
min-height: 290px;
_height: 290px;
color: #333339;
font-size: 0.9em;
}
#coordonnees h3 {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
padding: 0 0 10px 20px;
background: url(puce-blanc-2.png) no-repeat 0 8px;
font-size: 1.7em;
font-weight: normal;
color: #F3F3F3;
}
#coordonnees address {
padding: 160px 10px 10px 95px;
width: 203px;
height: 80px;
font-style: normal;
}
/**********************
IMAGE CHANGEANTE
**********************/
#images-changeantes {
width: 485px;
height: 300px;
position: absolute;
top: 66px;
left: 0;
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
#mySlideShow
{
width: 485px !important;
height: 300px !important;
}
/***************************************************************
ADMIN : parties spcifiques l'admin
***************************************************************/
#admin-menu {
position: absolute;
top: 66px;
right: 1px;
padding: 0;
width: 200px;
min-height: 300px;
_height: 300px;
color: #333339;
font-size: 0.9em;
}
#admin-menu h3 {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
padding: 0 0 0 20px;
margin: 10px;
background: url(puce-bleu.png) no-repeat 0 8px;
font-size: 1.7em;
font-weight: normal;
}
#admin-menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#admin-menu li {
margin: 0;
padding: 0;
display: block;
_height: 1%;
}
#admin-menu a.active {
display: block;
background: #356D50;
color: #FFFFFF; !important
_height: 1%;
width : 185px;
padding: 2px 0 2px 15px;
margin: 0;
}
#admin-menu a, #admin-menu a:visited {
display: block;
padding: 2px 0 2px 15px;
margin: 0;
font-size: 1.2em;
color: #545458;
text-decoration: none;
_height: 100%;
_width: 185px;
}
#admin-menu a:hover {
color: #FFFFFF;
background: #545458;
padding: 2px 0 18px 15px;
margin: 0;
}
#admin-menu a.active {
color: #FFFFFF !important ;
}
#admin-menu p {
margin: 0;
padding: 0;
}
#admin-top {
width: 629px;
border-left: 1px solid #FFFFFF;
min-height: 280px;
_height: 280px;
color: #F5F5F5;
padding: 10px;
font-size: 0.9em;
}
#admin-top h3 {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
padding: 0 0 10px 20px;
background: url(puce-blanc.png) no-repeat 0 8px;
font-size: 1.7em;
font-weight: normal;
}
#admin-form input, #admin-form textarea, #admin-form select, #admin-form option, #admin-form-large input, #admin-form-large textarea, #admin-form-large select, #admin-form-large option {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #0A0A0B;
background: #97989A;
color: #FEFEFE;
font-size: 1em;
}
#admin-form input, #admin-form-large input {
padding: 2px;
}
#admin-form input, #admin-form textarea, #admin-form select {
width: 180px;
}
#admin-form-large input, #admin-form-large textarea, #admin-form-large select {
width: 400px;
}
#admin-form-large textarea {
height: 100px;
}
#admin-form option, #admin-form-large option {
border: none;
}
#admin-form input.bt, #admin-form-large input.bt {
background: #0A0A0B;
width: auto;
}
#admin-form input.petit {
width: 140px;
}
#admin-form-large input.petit {
width: 140px;
}
#admin-form label, #admin-form-large label {
float: left;
width: 100px;
padding: 3px 0 0 0;
}
#admin-form p, #admin-form-large p {
clear: left;
margin: 0 0 5px 0;
}
#admin-form span, #admin-form-large span {
margin: 0 0 0 100px;
padding: 0 0 5px 0;
}
#admin-form div.retour, #admin-form-large div.retour {
clear: left;
padding: 0 0 5px 0;
}
#admin-form div#admin-photos, #admin-form div#admin-promo, #admin-form div#admin-send {
clear: both;
border-top: 1px solid #97989A;
}
#admin-form div#admin-photos input {
_width: 350px;
}
#admin-form div#admin-photos h4, #admin-form div#admin-promo h4, #admin-form div#admin-photo h4 {
text-align: left;
font-size: 1.2em;
padding: 10px 0;
}
#admin-form #imma_jour, #admin-form #date_fin_jour {
width: 38px;
}
#admin-form #imma_mois, #admin-form #date_fin_mois {
width: 80px;
}
#admin-form #imma_annee, #admin-form #date_fin_annee {
width: 50px;
}
#admin-form textarea {
width: 280px;
height: 60px;
padding: 2px;
}
#admin-form-large .no-style, #admin-form .no-style {
width: auto;
_width: 15px;
background: none;
border: none;
float: none;
}
#admin-top a {
color: #F5F5F5;
}
#admin-form .box-preview-admin {
width: 154px;
float: left;
padding: 2px;
margin: 10px;
border: 1px solid #0A0A0B;
background: #97989A;
text-align: center;
}
#admin-form .box-preview-admin input {
width: auto;
_width: none;
}
#admin-top div.right {
float: right;
width: 310px;
padding: 0 0 0 20px;
border-left: 1px solid #97989A;
}
#admin-promo div.box-promo input, #admin-promo div.no-style {
border: none;
background: none;
width: auto;
_width: none;
}
#admin-promo div.box-promo label {
float: none;
width: auto;
padding: 0;
}
#admin-promo div.box-promo {
border: 1px solid #0A0A0B;
background: #97989A;
text-align: center;
width: 54px;
height: 70px;
float: left;
margin-right: 1px;
}
#admin-promo input {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #0A0A0B;
background: #97989A;
color: #FEFEFE;
font-size: 1em;
width: none;
}
#admin-promo input.long, #admin-promo textarea.long {
width: 420px;
}
#admin-promo label {
float: left;
width: 130px;
padding: 3px 0 0 0;
}
#admin-promo p {
padding: 5px 0;
}
#admin-promo input.no-style {
width: auto;
background: none;
border: none;
}
#admin-promo span {
margin: 0 0 0 35px;
}
#admin-promo label {
float: none;
}
#admin-form div#admin-send {
padding: 20px 0 10px 0;
text-align: center;
}
#admin-send input {
width: 212px;
border: none;
background: none;
}
#admin-form-large div#admin-send {
width: 400px;
padding: 20px 0 10px 100px;
text-align: center;
}
#admin-form div#admin-photos div.box-preview-admin input.no-style {
_width: 18px;
}
/******************
CONTENU BAS
******************/
#contenu-bas {
margin: 0 auto;
width: 837px;
position: relative;
padding: 10px 0 42px 5px;
font-size: 0.9em;
}
#contenu-bas h3 {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
padding: 17px 0 0 20px;
background: url(puce-vert.png) no-repeat 0 25px;
font-size: 1.7em;
font-weight: normal;
}
#contenu-bas p {
margin: 0;
padding: 7px 0 0 0;
}
#contenu-bas h4 {
padding: 0 0 1px 0;
margin: 0;
font-size: 1.1em;
font-weight: bold;
text-align: right;
}
#contenu-bas .box {
border: 1px solid #356D50;
padding: 4px;
min-height: 125px;
_height: 125px;
}
#contenu-bas .photo {
float: right;
margin: 0 0 0 7px;
}
#informations {
float: right;
width: 336px;
padding: 0 15px;
}
#informations p {
text-align: right;
}
#contenu-bas address {
padding: 203px 145px 25px 110px;
border: 1px solid #356D50;
width: 203px;
height: 80px;
background: url(carte.png) no-repeat 4px 4px;
font-style: normal;
}
#contenu-bas ul {
margin: 0 0 0 20px;
padding: 10px 0;
}
/*******************
BOX VOITURE
********************/
#contenu-bas .box-voiture, #contenu-bas .box-job {
width: 365px;
border:1px solid #356D50;
min-height:100px;
_height:100px;
padding:4px;
float: left;
margin: 10px 15px;
position: relative;
font-size: 0.9em;
}
#promo-home .box-voiture {
width: 326px;
float: none;
margin: 0;
}
#contenu-bas .box-voiture img {
float: right;
}
#contenu-bas .box-voiture p {
width: 195px;
text-align: right;
padding: 0 0 7px 5px;
margin: 0;
}
#contenu-bas .box-job p {
width: auto;
text-align: left;
padding: 5px 0 7px 5px;
}
#promo-home .box-voiture p {
width: 160px;
}
#contenu-bas .box-voiture h4, #contenu-bas .box-job h4 {
width: 195px;
text-align: right;
padding: 0 0 0 5px;
margin: 0;
}
#contenu-bas .box-job h4 {
text-align: left;
width: auto;
}
#promo-home .box-voiture h4 {
width: 160px;
}
#contenu-bas .box-voiture a {
color: #356D50;
}
#contenu-bas .smaller {
font-size: 0.9em;
}
#contenu-bas div.maca-05-pc, #contenu-bas div.maca-10-pc, #contenu-bas div.maca-15-pc, #contenu-bas div.maca-20-pc, #contenu-bas div.maca-25-pc, #contenu-bas div.maca-30-pc, #contenu-bas div.maca-35-pc, #contenu-bas div.maca-promo, #contenu-bas div.maca-prix-reduit, #contenu-bas div.maca-cadeau-offert {
width: 85px;
height: 85px;
position: absolute;
top: -15px;
right: -25px;
}
#contenu-bas div.maca-05-pc p, #contenu-bas div.maca-10-pc p, #contenu-bas div.maca-15-pc p, #contenu-bas div.maca-20-pc p, #contenu-bas div.maca-25-pc p, #contenu-bas div.maca-30-pc p, #contenu-bas div.maca-35-pc p, #contenu-bas div.maca-promo p, #contenu-bas div.maca-prix-reduit p, #contenu-bas div.maca-cadeau-offert p {
position: absolute;
left: -5000px;
}
#contenu-bas div.maca-05-pc {
background: url(../images/macarons/05-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/05-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-10-pc {
background: url(../images/macarons/10-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/10-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-15-pc {
background: url(../images/macarons/15-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/15-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-20-pc {
background: url(../images/macarons/20-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/20-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-25-pc {
background: url(../images/macarons/25-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/25-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-30-pc {
background: url(../images/macarons/30-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/30-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-35-pc {
background: url(../images/macarons/35-pc.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/35-pc.png', sizingMethod='scale');
}
#contenu-bas div.maca-promo {
background: url(../images/macarons/promo.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/promo.png', sizingMethod='scale');
}
#contenu-bas div.maca-prix-reduit {
background: url(../images/macarons/prix-reduit.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/prix-reduit.png', sizingMethod='scale');
}
#contenu-bas div.maca-cadeau-offert {
background: url(../images/macarons/cadeau-offert.png);
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/paniez/website/images/macarons/cadeau-offert.png', sizingMethod='scale');
}
/*******************
GROS BOUTONS
********************/
#call-to-action .box-showroom, #call-to-action .box-personnel {
width: 198px;
min-height:100px;
_height:100px;
padding: 5px 10px 20px 137px;
margin: 10px 0;
position: relative;
font-size: 1em;
}
#call-to-action .box-showroom p, #call-to-action .box-personnel p {
padding: 7px 0 0 0;
z-index: 30;
}
#call-to-action .box-showroom h4, #call-to-action .box-personnel h4 {
padding: 7px 0 0 0;
font-size: 1.2em;
text-align: left;
z-index: 40;
}
#call-to-action .box-showroom a, #call-to-action .box-personnel a {
position: absolute;
display: block;
top: 10px;
left: 10px;
width: 180px;
height: 25px;
padding: 75px 18px 0 137px;
text-align: right;
outline: none;
z-index: 50;
}
#call-to-action .box-showroom {
margin-top: 30px;
background: url(bt-showroom.png) no-repeat top left;
}
#call-to-action .box-personnel {
background: url(bt-personnel.png) no-repeat top left;
}
#simple-page .box-pdf {
width: 420px;
min-height:49px;
_height:49px;
padding: 0;
margin: 15px 0;
position: relative;
font-size: 1.2em;
font-weight: bold;
background: url(bt-pdf.png) no-repeat top left;
}
#simple-page .box-pdf a {
display: block;
padding: 14px 10px 5px 60px;
width: 350px;
height: 25px;
text-align: center;
}
/**********************
PROMO GENERALE
**********************/
#promo-generale {
background: #B8CCC2;
border-bottom: 1px solid #356D50;
border-top: 1px solid #356D50;
min-height: 105px;
_height: 105px;
color: #444444;
}
#sub-promo-generale {
margin: 0 auto;
width: 712px;
padding: 10px 10px 10px 115px;
position: relative;
}
#promo-generale p {
padding: 4px 0;
margin: 0;
}
#promo-generale h3 {
padding: 4px 0;
margin: 0;
font-size: 1.3em;
}
#promo-generale p.conditions {
font-size: 0.75em;
}
#promo-generale p.img {
position: absolute;
top: 8px;
left: 10px;
width: 85px;
height: 85px;
}
/**********************
GESTION TABLEAUX
**********************/
#resultats table {
width: 100%;
background: #D7E2DC;
border-collapse: collapse;
margin: 15px 0 0 0;
}
#resultats table th, #resultats table td {
vertical-align: middle;
border: 1px solid #F3F3F3;
padding: 3px;
}
#resultats .date, #resultats .modele, #resultats .kilometrage, #resultats .description, #resultats .prix, #resultats .action, #resultats th {
background: #356D50;
color: #F3F3F3;
}
#resultats .date {
width: 9%;
}
#resultats .modele {
width: 18%;
}
#resultats .kilometrage {
width: 18%;
}
#resultats .description {
width: 30%;
}
#resultats .prix {
width: 17%;
}
#resultats .action {
width: 9%;
}
#resultats .tr_hover {
background: #B8CCC2;
color: #333339;
}
#resultats .tr_normal {
background: #D7E2DC;
}
#resultats a, #resultats a:visited {
color: #356D50;
}
#resultats a:hover {
color: #333339;
}
/*****************
BOX-PHOTOS
******************/
#photos-page div.box-photo {
width: 174px;
height: 116px;
padding: 5px;
margin: 10px;
float: left;
border: 1px solid #356D50;
text-align: center;
}
/*************
FOOTER
*************/
#footer {
position: absolute;
margin: 0;
padding: 0;
height: 27px;
width: 100%;
bottom: 0;
left: 0;
background: url(bg-footer.png) repeat-x top;
}
#sub-footer {
margin: 0 auto;
width: 852px;
position: relative;
background: url(bg-footer-2.png) no-repeat bottom left;
}
#footer p {
margin: 0;
color: #FFFFFF;
font-size: 0.9em;
line-height: 27px;
height: 27px;
}
#footer p a, #footer p a:visited {
color: #FFFFFF;
text-decoration: underline;
}
#footer p a:hover {
text-decoration: none;
}
#footer span {
height: 27px;
}
/*************************
CLASS GNRALISTE
*************************/
.hide {
display: none;
}
.clear {
clear: both;
}
.center {
text-align: center;
}
a.blanc {
color: #FFFFFF;
}
.msg-bon, .msg-erreur {
font-weight: bold;
padding: 5px;
color: #333339;
}
.msg-bon {
background: #B8CCC2;
border: 1px solid #356D50;
}
.msg-erreur {
background: #EECCCC;
border: 1px solid #CC0000;
}