/* General */

body {
	text-align : center;
	font-size : 10pt;
	font-family : sans-serif;
	background : #3a3a3a;
}

hr {
	clear : both;
	visibility : hidden;
	margin : 0;
	padding : 0;
	height : 0;
}

a:hover { cursor : pointer; }

h2 { color : #00b3fe; }

strong { color : #267cc6; }

.centrer { text-align : center; }



/* Page */

#page {
	background : url("../img/page_fond.png") top left repeat-y;
	width : 959px;
	min-height : 799px;
	margin : auto;
	text-align : left;
	padding : 0 11px 0 11px;
	position : relative;
	overflow : hidden;
}



/* Titre */

#titre {
	background : url("../img/titre.png") top left no-repeat;
	height : 131px;
	width : 965px;
	overflow : hidden;
	z-index : 1;
	margin-bottom : -4px;
	margin-left : -8px;
}

#titre a {
	height : 0;
	padding-top : 131px;
	display : block;
}



/* Menu */

#menu {
	background : url("../img/menu_fond.png") top left no-repeat;
	width : 723px;
	height : 31px;
	margin : auto;
	padding-left: 5px;
	padding-top : 4px;
	margin-bottom : -6px;
}

#menufin {
	height : 20px;
	margin-bottom : -20px;
	background : url("../img/menu_fin.png") top left no-repeat;
	margin-left : -11px;
}

#menu li {
	float : left;
	height : 31px;
	text-align : center;
	position : relative;
}

#menu li a {
	line-height : 26px;
	display : block;
	color : #a0a0a0;
	text-decoration : none;
}

#menu li .sousmenu a:hover { color : #1c86ff; }

#menu li.actif a,
#menu li a:hover { color : #21aaf4; }

#menu li .sousmenu { display : none;  }
#menu .rollover:hover .sousmenu { display : block;  }



/* Sousmenu */

#menu { position : relative; z-index : 10; }

#menu ul { position : absolute; }

#menu .sousmenu {
	position : absolute;
	line-height : 20px;
	font-size : 8pt;
	width : 138px;
	left : 0;
	background : url("../img/menu_sousmenu.png") bottom left !important;
	background : url("../img/menu_sousmenu-ie.png") bottom left;
	padding-top : 15px;
	padding-bottom : 20px;
	padding-left : 3px;
	z-index : 5;
}

#menu .sousmenu li {
	display : inline;
	width : 134px;
	/*background : url("../img/menu_sousmenu.png") bottom left;*/
	text-align : left;
	margin : 0 auto 0 auto;
	height : auto;
}

#menu .sousmenu li a {
	line-height : 20px;
	border-top : 0;
	background : url("../img/menu_sousmenu_fleche.png") left center no-repeat !important;
	background : url("../img/menu_sousmenu_fleche-ie.png") left center no-repeat;
	background-position : 4px 50%;
	text-indent : 15px;
	padding-top : 1px;
	padding-bottom : 1px;
	color : #4a4a4a;
}

#menu .sousmenu li a:hover {
	background-image : url("../img/menu_sousmenu_fleche_actif.png") !important;
	background-image : url("../img/menu_sousmenu_fleche_actif-ie.png");
	background-color : white !important;
	padding-top : 0;
	padding-bottom : 0;
	border-top : 1px solid #84b0e0;
	border-bottom : 1px solid #84b0e0;
	font-weight : normal;
}

/*#menu .sousmenu li:first-child { background : url("../img/menu_sousmenu_haut.png") top left repeat-x #fdfdfd; }*/

#menu #menuhover {
	position : absolute;
	height : 41px;
	top : -4px;
	left : 0px;
	background : url("../img/menu_hover_gauche.png") top left no-repeat !important;
	background : url("../img/menu_hover_gauche-ie.png") top left no-repeat;
	width : 104px;
}

#menu #menuhover .droite {
	position : absolute;
	top : 0;
	right : -11px;
	height : 41px;
	width : 11px;
	background : url("../img/menu_hover_droite.png") top right no-repeat !important;
	background : url("../img/menu_hover_droite-ie.png") top right no-repeat;
}

#menu #menuhover .texte {
	background-image : url("../img/menu_texte_hover.png") !important;
	background-image : url("../img/menu_texte_hover-ie.png");
	display : block;
	height : 41px;
}

#menu.accueil #menuhover { left : 2px; }
#menu.accueil #menuhover .texte { background-position : -2px 4px; }

#menu.produits #menuhover { left : 112px; width : 137px; }
#menu.produits #menuhover .texte { background-position : -112px 4px; }

#menu.support #menuhover { left : 255px; width : 103px; }
#menu.support #menuhover .texte { background-position : -255px 4px; }

#menu.contact #menuhover { left : 364px; width : 146px; }
#menu.contact #menuhover .texte { background-position : -364px 4px; }

#menu.enregistrezmobile #menuhover { left : 516px; width : 194px; }
#menu.enregistrezmobile #menuhover .texte { background-position : -516px 4px; }




/* Menu : boutons */

#accueil { width : 110px; margin-left : 2px; }
#accueil a.texte { width : 110px; overflow : hidden; height : 30px; }
#accueil .texte span { padding-left : 110px; width : 110px; }

#nosprod { width : 143px; }
#nosprod a.texte { width : 143px; overflow : hidden; height : 30px; }
#nosprod .texte span { padding-left : 143px; width : 143px; }
#nosprod .sousmenu { margin-left : -1px; }

#support { width : 109px; }
#support a.texte { width : 109px; overflow : hidden; height : 30px; }
#support .texte span { padding-left : 109px; width : 109px; }
#support .sousmenu { margin-left : 0; background : url("../img/menu_sousmenu_petit.png") bottom left !important; background : url("../img/menu_sousmenu_petit-ie.png") bottom left; width : 102px; }
#support .sousmenu li { width : 98px; }

#contact { width : 152px; }
#contact a.texte { width : 152px; overflow : hidden; height : 30px; }
#contact .texte span { padding-left : 152px; width : 152px; }
#contact .sousmenu { margin-left : 3px; }

#enregistrez { width : 200px; }
#enregistrez a.texte { width : 200px; overflow : hidden; height : 30px; }
#enregistrez .texte span { padding-left : 200px; width : 200px; }

/*#apropos { width : 256px; }
#apropos a { background : none !important; }*/


/* Produits */

#produits {
	background : url("../img/produits_fond.jpg");
	height : 250px;
	width : 948px;
	text-align : center;
	margin-top : 3px;
}

#produits img { margin : 20px; }
#produits h2 img { margin : 0; }


/* Caracteristiques */

#caracteristiques { color : #464646; min-height : 420px; }

#caracteristiques .grandephoto {
	float : left;
	width : 228px;
	height : 380px;
	background-repeat : no-repeat;
	background-position : top center;
}
#caracteristiques .miniatures {
	float : left;
	width : 193px;
	background : url("../img/caracteristiques_separation.png") bottom right no-repeat;
	padding-right : 10px;
	height : 343px;
}
#fichetechnique h2,
#pointsforts  h2 {
	margin-top : 12px;
	font-size : 120%;
	margin-top : 20px;
	margin-left : 228px;
	padding-bottom : 10px;
	width : 193px;
	text-align : center;
}
#caracteristiques .description {
	float : left;
	width : 273px;
	padding : 20px 10px 0 28px;
	height : 325px;
	overflow : auto;
}

#caracteristiques .description h3 { margin : 1em 0 1em 0; }

#caracteristiques .description li { margin-left : 9px; }
#caracteristiques .description li:before { content : "* "; }

#caracteristiques #choix {
	float : left;
	width : 189px;
	height : 356px;
	background : url("../img/produits_caracteristiques.jpg") top left no-repeat;
	padding : 0 3px 3px 3px;
	margin-top : 20px;
	font-size : 10pt;
	font-weight : bold;
}

#caracteristiques #fichetechnique { clear : both; }
#caracteristiques #pointsforts { clear : both; }

/* Intéressant pour l'effet en JavaScript, faire défiler l'image de fond à la hauteur du menu sélectionné */
/*
#caracteristiques #choix ul {
	background : url("../img/produits_caracteristiques_selection.jpg") top left no-repeat;
	background-position : 0 20px;
}*/

#caracteristiques #choix .titre {
	height : 40px;
	line-height : 40px;
	color : white;
	font-weight : bold;
	text-align : center;
	font-size : 12pt;
}

#caracteristiques #choix a {
	width : 189px;
	line-height : 47px;
	color : white;
	text-decoration : none;
	display : block;
	text-indent : 34px;
}

#caracteristiques #choix a:before { content : '» '; }

#caracteristiques #choix a:hover,
#caracteristiques #choix a.actif {
	background : url("../img/produits_caracteristiques_selection.jpg") top left no-repeat;
	color : #303030;
}

#caracteristiques #detail {
	float : left;
	width : 743px;
}

.miniatures  .miniature {
	float : left;
	width : 90px;
	height : 100px;
	margin-bottom : 5px;
}

.miniatures  .miniature a {
	background-repeat : no-repeat;
	background-position : center center;
}

/* Descriptif */

#descriptif {
	padding-right : 50px;
	text-align : justify;
	line-height : 1.2em;
}

#descriptif p {
	padding : 0.5em 0 0.5em 0;
	margin-left : 267px;
}
#descriptif h2 { margin-top : 32px; padding-bottom : 0.5em; }

#galerie {
	float : left;
	position : relative;
	padding-left : 96px;
}

#galerie .grandephoto {
	background-position : center center;
	background-repeat : no-repeat;
	height : 328px;
	width : 478px;
	border : 1px solid #6a6b72;
	margin-right : 13px;
}

#galerie .miniatures {
	width : 58px;
	height : 310px;
	overflow : hidden;
}

#galerie .miniature {
	width : 56px;
	margin-bottom : 5px;
	height : 56px;
	border : 1px solid #73747a;
}

#galerie .precedent,
#galerie .suivant {
	width : 100%;
	height : 0;
	padding-top : 15px;
	overflow : hidden;
	display : inline-block;
}

#galerie .precedent { background : url("../img/precedent.png") top center no-repeat; margin-bottom : 2px; }
#galerie .suivant { background : url("../img/suivant.png") top left no-repeat; margin : 3px 0 0 2px;}

#galerie .colonne {
	float : left;
	width : 58px;
	margin-top : -7px;
}

#galerie h2 { margin : 15px 0 15px 0; }

#faq h2 { margin : 2em 0 1em 3em; }

#galerie .miniatures { background : 0; }


/* FAQ : Liste de définition */

dl { margin : 2em 2em 0 2em; }

dt {
	border-bottom : 1px solid silver;
	padding-bottom : 0.5em;
	padding-left : 1em;
	margin-left : 1em;
	margin-bottom : 0.5em;
	cursor:pointer;
}

dd {
	margin-bottom : 2em;
	padding-left : 5em;
}

dt span {
	display : inline-block;
	width : 2em;
	text-align : right;
	font-weight : bold;
}

dt a {
	margin-left : 10px;
}

a { color : gray; text-decoration : none; }
a:hover { text-decoration : underline; }

.lienplein {
	display : block;
	height : 100%;
}


/* telechargements */

#telechargements h2 {
	margin : 3em;
}

#tuto h2 {
	margin : 3em;
}


table {
	margin-left : 6%;
	width : 88%;
	text-align : center;
}

tr th:first-child,
tr td:first-child { text-align : left; }

th {
	background : #e1e1e1;
	padding : 1em;
}

td {
	padding : 0.5em 1em 0.5em 1em;
	border-bottom : 1px solid #e1e1e1;
}


/* Footer */

#footer {
	background : url("../img/footer.png") top left no-repeat;
	height : 28px;
	line-height : 19px;
	text-align : center;
	margin-left : -11px;
	font-size : smaller;
	width : 968px;
}

#footer li { display : inline; }

#footer li:before { content : " - "; }
#footer li:first-child:before { content : ""; }

#footer * { color : white; }



/* Accueil */

#topaccueil { margin-left : -2px; height : 134px; width : 952px; overflow : hidden; }
#bottomaccueil { margin-left : -1px; }



/* debug */

#centre {
	width : 516px;
	float : left;
	margin-top : 20px;
	color : #afafaf;
}

#centre p {
	padding : 0.5em 0 0.5em 0;
}

#detail .cache { display : none; }

#photoombre {
	height : 380px;
	width : 267px;
	background-repeat : no-repeat;
	background-position : center center;
	float : left;
}


/* Page de texte */
#pagedetexte {
	min-height : 630px;
	padding-left : 265px;
	padding-right : 40px;
	margin-right : 11px;
	color : #6b6b6b;
	line-height : 1.2em;
	margin-top : 3px;
}

#pagedetexte UL, #pagedetexte UL
{
	overflow:hidden;
	_overflow:visible;
	zoom: 1;
}

#pagedetexte h2 { padding : 1em 0 1em 0; }

#pagedetexte p { padding : 0 0 1em 0; }

.apropos { background : url("../img/decos/apropos.jpg") top left no-repeat; }
.enregistrez { background : url("../img/decos/enregistrez.jpg") top left no-repeat; }
.contact { background : url("../img/decos/contact.jpg") top left no-repeat; }
.garantie { background : url("../img/decos/garantie.jpg") top left no-repeat; }
.gris { background : url("../img/decos/gris.jpg") top left no-repeat; }

.garantie a { font-weight : bold; }
.garantie em { color : #ee7f00; }


/* A propos */

#pagedetexte .partie1,
#pagedetexte .partie2,
#pagedetexte .partie3 {
	clear : both;
	padding-top : 0.5em;
}

.partie1 img {
	margin-left : 1em;
	float : right;
}

.partie2 img {
	margin-right : 1em;
	float : left;
}

.listtitre:before { content : "- "; }

#pagedetexte li { text-indent : 2em; }
#pagedetexte ul { margin-bottom : 1em; }
#pagedetexte li:before { content : "> "; color : #3586ca; }

/**/


/* FAQs */

.faqs2 li,
.faqs li {
	background : url("../img/faq_fond_mobile.png") top left no-repeat;
	width : 280px;
	height : 141px;
	position : relative;
	float : left;
	list-style : none;
	margin-right : 20px;
	margin-bottom : 20px;
	text-indent : 0 !important;
	text-align : center;
}

.faqs2 a,
.faqs a {
	display : block;
	height : 100%;
	color : #464646;
}

.faqs2 .description,
.faqs span {
	position : absolute;
	font-weight : bold;
	width : 133px;
	margin-right : 12px;
	margin-top : 40px;
	right : 0;
}

.faqs2 .image,
.faqs div {
	position : absolute;
	height : 100px;
	width : 90px;
	top : 20px;
	left : 27px;
	background-repeat : no-repeat;
	background-position : center center;
 }

#pagedetexte.faqs2 li:before,
#pagedetexte.faqs li:before { content : ""; }


 
/* Formulaires */

label {
	float : left;
	width : 20%;
	text-align : right;
	line-height : 1.7em;
	padding-right : 0.5em;
}

input, select { height : 1.5em; }

form { margin : 0 3em 0 3em; }

form label:after { content : " : "; }

form p { padding : 0.5em 0 0.5em 0; }

input,
select,
textarea {
	background : #e0f4da;
	border : 0;
	border-bottom : 1px solid #57ab2a;
	padding : 0.1em;
}

#mailSent
{
	background : #e0f4da;
	border-bottom : 1px solid #57ab2a;
	font-weight:bold;
	text-align:center;
	height:50px;
	line-height:50px;
	margin:10px;
}

input[type=submit] { border : 1px solid #57ab2a; }

.submit { margin-left : 21%; }

input[type=submit] { padding : 0.25em 1em 0.25em 1em; height : auto; }

.contact input,
.contact select,
.contact textarea {
	background : #fff2f6;
	border-bottom : 1px solid #ffb0c6;
}

.contact #mailSent
{
	background : #fff2f6;
	border-bottom : 1px solid #ffb0c6;
	font-weight:bold;
	text-align:center;
	height:50px;
	line-height:50px;
	margin:10px;
}

.contact input[type=submit] {
	border : 1px solid #ffb0c6;
}

.contact a { color : #0090ed; }