﻿@charset "utf-8";
/* CSS Document Séb ANQUEZ - AS MOTOS - OLDSUZUKI.fr*/

/**********************************************************************************/
/* Page */

/* Déclaration de la police */
@font-face {
    font-family: "Suzuki-Headline";
    src: url('Suzuki-Headline.otf');
}
@font-face {
    font-family: "Suzuki-Regular";
    src: url('Suzuki-Regular.otf');
}
@font-face {
    font-family: "Suzuki-Bold";
    src: url('Suzuki-Bold.otf');
}
@font-face {
    font-family: "SuzukiPROHeadline";
    src: url('SuzukiPROHeadline.otf');
}

@font-face {
    font-family: "Calibri-Regular";
    src: url('calibri-webfont.eot');
    src: url('calibri-webfont.eot?#iefix') format('embedded-opentype'),
         url('calibri-webfont.woff') format('woff'),
         url('calibri-webfont.ttf') format('truetype'),
         url('calibri-webfont.svg#"Calibri-Regular"') format('svg');
    font-weight: normal;
    font-style: normal;

}

html, body {height: 100%; margin:0}
html {font-size: 100%; padding:0}
body {font-family: "Suzuki-Regular", "Calibri-Regular", Tahoma; background-color:#E1E1E1; min-width: 991px;
height: 100%;}

/* Bloc haut et contenu*/
#wrapper {
    width: 100%;
    min-height: 100%;
}

/**********************************************************************************/
/* Titres */
h1 {font-size: 1.2em; margin: 0 0 0 0; font-family: "Suzuki-Headline", "Trebuchet MS", Tahoma; font-weight: bold; font-variant: small-caps}
h2 {font-size: 1.1em; margin: 0 0 0 0}
h3 {font-size: 0.9em; margin: 0 0 0 0; font-weight: bold; font-variant: small-caps}
h4 {font-size: 0.9em; margin: 0 0 0 0; font-family:"Calibri-Regular", "Trebuchet MS", Tahoma}

h3 span.big {font-size: 1.1em; font-variant: small-caps}

p {margin:0 0 0 0; font-weight:normal; font-size:0.8em}

img {border: none}

.center {text-align:center}
.middle {vertical-align: middle}
.blanc {color:#FFF}
.GrisFonce {color:#333333}
.pad_r {padding-right:10px}
.small-c {font-variant: small-caps}
.gris {color:#757575}


/**********************************************************************************/
#ban-first {height:124px;background: url(../Images/Bannieres/mainnav-background.png) repeat-x left bottom}
#banniere {height:124px; width:1000px; margin:auto; padding-right:5px; padding-left:5px}
#banniere #logo {float:left; width:1000px; padding-top: 20px; background:url(../Images/Bannieres/logo_www.DT125MX.com.png) no-repeat left center}
#banniere #info {float:right; width:500px; text-align:right; margin-top: 15px}
#banniere #info p {font-family: Suzuki-Headline, "Trebuchet MS", Tahoma; font-size:1.2em; color:#c3c3c3; line-height:40px; text-shadow: -1px -1px 2px #000;
filter: dropshadow(color=#141421, offx=-1, offy=-1)}
#banniere #info p.tel {font-size:2em}
#banniere #info p.tel img {vertical-align: middle; padding-right:5px}
#banniere #info p.ouverture {font-size:0.7em; font-family: "Suzuki-Regular", "Calibri-Regular", Tahoma}


/**********************************************************************************/
#contener_menu {height:50px; background-color:#FFF;border-bottom: 2px solid #cacaca}
#contener_menu #menu {height:50px; width:1000px; margin:auto; padding-right:5px; padding-left:5px}
#contener_menu #menu ul {margin: 0px; padding: 0px}
#contener_menu #menu ul li {display: inline}
#contener_menu #menu a, #menu a.home {font: 1.2em Suzuki-Headline, "Trebuchet MS", Tahoma; color: #000; text-decoration: none; display: block; float: left; line-height:50px}
#contener_menu #menu a.home {padding-left:26px; padding-right:26px}
#contener_menu #menu a:hover, #menu a.home:hover, #menu a.home:focus{color: #c40000}
#contener_menu #menu a:active, a:focus{outline:none}
#contener_menu #menu .wayoflife {float:right}
/* Style pour la rubrique en cours */
#contener_menu #menu #en-cours a {color:#FFF; background: #9d0000;
    background: -moz-linear-gradient(top, #9d0000 0%, #fd0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9d0000), color-stop(100%,#fd0000));
    background: -webkit-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: -o-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: -ms-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: linear-gradient(to bottom, #9d0000 0%,#fd0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d0000', endColorstr='#fd0000',GradientType=0 );}


#contener_search {height:35px; background-color:#757575}
#contener_search #searchto {width:1000px; margin:auto}
#contener_search #searchto form#searchfast {float:right; margin-top:5px; font-family: "SuzukiPROHeadline", "Trebuchet MS", Tahoma; color:#003145}
#contener_search #searchto form#searchfast label {font-size:0.8em}
#contener_search #searchto form#searchfast select:hover {cursor:pointer}
#contener_search #searchto form#searchfast select {height:26px; width:250px; padding:3px; line-height:26px; font-family: "Calibri-Regular", "Trebuchet MS", Tahoma; font-size:0.9em; color:#FFF; border:none; background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #009f9a), color-stop(1, #035c59) ); background:-moz-linear-gradient( center top, #009f9a 5%, #035c59 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#009f9a', endColorstr='#035c59'); background-color:#009f9a; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;
	bracket-:hack[;
        color: #000;
    ];
}

#contener_search #searchto #am {float: left; width:500px; margin-top:8px}
#contener_search #searchto p a {text-decoration:none; margin-top:5px; font-family: "SuzukiPROHeadline", "Trebuchet MS", Tahoma; color:#003145}
#contener_search #searchto p a:hover{text-decoration:none}
#contener_search #searchto #am .annees {display: none; position: absolute; width:335px; height:120px; margin-left:140px; margin-top:-25px; z-index:2500}
#contener_search #searchto #am a:hover .annees {display: block}

/**********************************************************************************/
#contenu {width:1000px; /*min-height:60%; margin:auto; padding-left:5px; padding-right:5px; padding-top:15px; margin-bottom:50px*/margin: 15px auto;
padding: 0 0 150px;}

/**********************************************************************************/
#footer {background: #757575 url(../Images/Bannieres/mainnav-background_reverse.png) repeat-x left top; /*height:auto; clear: both; overflow:hidden; position:relative*/margin: -146px 0 0;
height: 146px;
overflow: hidden;clear: both;}
#footer #contenu_footer {width:1000px; padding-right:5px; padding-left:5px; margin:auto; color:#C0C0C0; font-family: "Calibri-Regular", Tahoma}
#footer #contenu_footer a,  #footer #contenu_footer a:visited {text-decoration:none; color:#C0C0C0}
#footer #contenu_footer a:hover {color:#c40000}
#footer #contenu_footer table {width:1000px; margin:auto}
#footer #contenu_footer table th {width:20%; color:#757575; font-size:0.9em; text-align:left; font-variant: small-caps; padding: 0 20px; text-shadow:1px 1px 1px #001821}
#footer #contenu_footer table tr {width:20%}
#footer #contenu_footer table td {vertical-align:top; padding: 0 20px}
#footer #contenu_footer table .border {border-right:#f20000 1px dotted}
#footer #contenu_footer table .motcles h1 {line-height:0.85em; font-size:0.75em; font-style:inherit; font-variant:inherit; font-family: "Calibri-Regular", Tahoma; color:#C0C0C0; text-align:justify}

/********************************************************************************/
/*  Cadre  */
.cadre {border:#757575 1px solid; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px}

/************************************************************************************/
/* Vehicule */

.conteneur_vehicule {zoom: 1; width:990px; padding:0; overflow: auto}

.vehicule {float: left; height:150px; width:150px; max-width:150px; background-color:#FFF;-moz-box-shadow: -3px 3px 15px 0px #000000;-webkit-box-shadow: -3px 3px 15px 0px #000000;-o-box-shadow: -3px 3px 15px 0px #000000;box-shadow: -3px 3px 15px 0px #000000;filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, Direction=225, Strength=15); margin:20px; text-align:center; display:table}
.vehicule p {font-family: Suzuki-Headline, "Trebuchet MS", Tahoma; font-size:1em; text-align:center}
.vehicule:hover {-webkit-box-shadow: -1px 1px 8px 0px #fff;-o-box-shadow: -1px 1px 8px 0px #fff; box-shadow: -1px 1px 8px 0px #fff; cursor:pointer}

.vehicule_contenu {display:table-cell; width:150px; height:150px; vertical-align:middle}
.conteneur_photo {height:120px; width:150px; display : table-cell; vertical-align : middle; text-align:center}
.dim {max-height:120px; max-width:150px}

/***********************************************************************************/
/* Tableau */
#produit {padding:0 20px 20px 20px}

#tableau {font-family: "Calibri-Regular", "Trebuchet MS", Tahoma;  width:800px; padding-top:20px; padding-bottom:20px; margin:auto;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px}
#tableau td p {margin-left:4px}
#tableau th {height:25px; color:#f20000; font-size:0.9em; text-align:center; background-color:#333; font-variant: small-caps}
#tableau .ligne-titre {height:20px; text-align:center; color:#000; font-size:0.8em; font-weight:bold; background-color:#757575}
#tableau .ligne-produit p {font-size:0.9em}
#tableau .ligne-produit p.com {font-size:0.7em; font-style:italic}
#tableau .ligne-produit:hover {background-color:#09F; color:#F8F8F8}

.ligne {height:30px}

#tableau #search {padding-bottom:10px; text-align:right; float:right; width:400px}
#tableau #search input[type=text] {height:20px; width:180px}
#tableau #search input[type=submit] {width:100px; border:none}
#tableau #search input[type=submit]:hover, #retour input[type=button] {cursor:pointer}

#tableau #selecteur {padding-bottom:10px; text-align: left; float:left; width:400px}
#tableau #selecteur select {height:26px; width:250px; padding:3px; line-height:26px; font-family: "Calibri-Regular", "Trebuchet MS", Tahoma; font-size:0.9em; color:#FFF;
	border: none;
	background: #9d0000;
    background: -moz-linear-gradient(top, #9d0000 0%, #fd0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9d0000), color-stop(100%,#fd0000));
    background: -webkit-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: -o-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: -ms-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: linear-gradient(to bottom, #9d0000 0%,#fd0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d0000', endColorstr='#fd0000',GradientType=0 );
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	bracket-:hack[;
    	color: #000;
    ];
	}
#tableau #selecteur option {font-family: "Calibri-Regular", "Trebuchet MS", Tahoma; color:#000000}
#tableau #selecteur .choix,  #searchfast .choix {font-family: "Calibri-Regular", "Trebuchet MS", Tahoma; font-size:0.9em; color:#CCC}
#tableau #selecteur select:hover {cursor:pointer}

#retour {text-align:center}
#retour input[type=button] {border:none; margin:auto}

/***********************************************************************************/
#cadre_sup {width:1000px; height:225px; margin:auto; display:block}
#cadre_sup #commander {float:left; width:500px; padding:0 20px 20px 20px; color:#757575}
#cadre_sup #commander a {font-size:1em; font-family:"Calibri-Regular", "Trebuchet MS", Tahoma; text-decoration:none; color:#757575; line-height:1.8em}
#cadre_sup #commander a:hover {color:#c40000}
#cadre_sup #photo_page_produit {float:right; width:220px}

#col_gauche {float:left; width:460px; padding:0 20px 20px 20px}
#col_gauche .cadreG {float:left; width:460px; padding-bottom:25px; color:#757575}
#col_gauche .cadreG h3 {padding-bottom:10px}

#col_droite {float:right; width:460px; padding:0 20px 20px 20px}
#col_droite .cadreD {float:right; width:460px; padding-bottom:25px; color:#757575}
#col_droite .cadreD h3 {padding-bottom:15px}

#col_gauche_c {float:left; width:600px; padding:0 20px 20px 20px;color:#757575}
#col_gauche_c .cadreG_c {float:left; width:600px; padding-bottom:25px; color:#757575}
#col_gauche_c .cadreG_c h3 {padding-bottom:10px}

#col_droite_c {float:right; width:320px; height:460px; background-image:url(../Images/Elements/casqueSeb.png); background-position:center; background-repeat:no-repeat; padding:0 20px 20px 20px}

/***********************************************************************************/

form#formID {margin: 0 auto; width:460px}

form#formID p {margin-top: 0px}

form#formID span {font-size:0.7em; float:right}
 
form#formID fieldset {margin-bottom: 15px; padding: 10px}
 
form#formID legend {padding: 0px 3px; font-weight: bold; font-variant: small-caps}
 
form#formID label {font-size:0.8em; text-align:left; width: 135px; display: inline-block; vertical-align: top; margin: 6px; margin-top:2px}
 
form#formID em {font-weight: bold; font-style: normal; color: #f00}

form#formID input {margin-bottom:8px}

form#formID input:focus {background: #FDFDFD}
 
form#formID input, form#formID textarea {width: 275px}
form#formID input[type=text], form#formID textarea {font-family:"Calibri-Regular", "Trebuchet MS", Tahoma; font-size:0.9em; color:#333}

form#formID input[type=file] {width: 281px}

form#formID textarea {height: 180px}
 
form#formID select {width: 281px}

form#formID input[type=submit] {width:100px; margin-left:190px; border:none}
form#formID input[type=submit]:hover {cursor:pointer}

/************************************************************************/
.classname {
	background: #9d0000;
    background: -moz-linear-gradient(top, #9d0000 0%, #fd0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9d0000), color-stop(100%,#fd0000));
    background: -webkit-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: -o-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: -ms-linear-gradient(top, #9d0000 0%,#fd0000 100%);
    background: linear-gradient(to bottom, #9d0000 0%,#fd0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d0000', endColorstr='#fd0000',GradientType=0 );
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	display:inline-block;
	color:#fff;
	font-family: "Calibri-Regular", "Trebuchet MS", Tahoma;
	font-size:0.8em;
	font-weight:bold;
	padding:5px 24px;
	text-decoration:none;
}
.classname:hover, .classname:active, .classname:link {
	background: #9d0000;
    background: -moz-linear-gradient(top, #fd0000 0%, #9d0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fd0000), color-stop(100%,#9d0000));
    background: -webkit-linear-gradient(top, #fd0000 0%,#9d0000 100%);
    background: -o-linear-gradient(top, #fd0000 0%,#9d0000 100%);
    background: -ms-linear-gradient(top, #fd0000 0%,#9d0000 100%);
    background: linear-gradient(to bottom, #fd0000 0%,#9d0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd0000', endColorstr='#9d0000',GradientType=0 );
}

/************************************************************************/
/* news */

#news {margin-top:30px; width:550px; float:left; display:block; margin-bottom:20px}
#news .contener_news, #news .nb_page_bottom {margin:10px; padding:5px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; color:#757575; background-color:#003e54; overflow: auto}
#news .contener_news .titre h2 {text-shadow: -1px -1px 1px #000}
#news .contener_news .date p {font-size:0.7em; font-family:"Calibri-Regular", "Trebuchet MS", Tahoma; line-height:1.6em}
#news .contener_news .contenu p {margin:5px; font-size:0.8em; font-family: "Suzuki-Regular", "Calibri-Regular", Tahoma; text-align:justify; text-indent:1em}
#news .contener_news .image {margin:10px 5px 10px 10px; float:right; text-align:center}
#news .contener_news .image img {width:180px}
#news .contener_news .lien {text-align:right; margin-right:5px}
#news .contener_news .lien a {font-size:0.8em; font-family:"Calibri-Regular", "Trebuchet MS", Tahoma; color:#4c99e5; text-decoration:none}
#news .contener_news .lien a:hover {color:#FFF}
#news .nb_page_bottom {text-align:right}
#news .nb_page_bottom p {font-family:"Calibri-Regular", "Trebuchet MS", Tahoma}
#news .nb_page_bottom p a {text-decoration:none; color:#757575}
#news .nb_page_bottom p a:hover {color:#4c99e5}

/************************************************************************/
/* Derniers produits */

#dernier_ajout {margin-top:30px; width:420px; float:right; display:block; margin-bottom:20px}
#dernier_ajout .contener_dernier_ajout {margin:10px; min-height:60px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; color:#757575; background-color:#003e54; overflow:hidden}
#dernier_ajout .contener_dernier_ajout table {width:390px; margin:auto; border:none}
#dernier_ajout .contener_dernier_ajout tr {height:60px; vertical-align:middle}
#dernier_ajout .contener_dernier_ajout .td1 {width:60px; text-align:center}
#dernier_ajout .contener_dernier_ajout .td2 {width:260px}
#dernier_ajout .contener_dernier_ajout .td3 {width:70px; text-align:center}
#dernier_ajout .contener_dernier_ajout .td3 .rond {height:40px; width:60px; background-color:#003145; line-height:20px}
#dernier_ajout .contener_dernier_ajout .td3 .rond p {color:#4c99e5;  text-shadow:1px 1px 1px #001821}
#dernier_ajout .contener_dernier_ajout p.small {font-size:0.7em; font-family:"Calibri-Regular", "Trebuchet MS", Tahoma}
#dernier_ajout .contener_dernier_ajout img {width:50px}

/*******************************************************************/
.top_link {position:fixed; right:10px; bottom:50%; display:none; width:40px; height:40px; background-image:url(../Images/Elements/gotop.png); -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; z-index:2000}
.top_link:hover {background-image:url(../Images/Elements/gotop1.png)}

.ap {width:500px}
.ap .apercu {display:none}
.ap:hover .apercu {display:block; position:absolute; margin-top:0; border:1px solid #333; border-radius: 5px; -moz-box-shadow: 1px 1px 6px #010101; -webkit-box-shadow: 1px 1px 6px #010101; box-shadow: 1px 1px 6px #010101; margin-left:450px}
.ap:hover .apercu img {width:150px; border-radius: 5px;}