﻿/* Eléments principaux de la page */
html
{
	height: 100%;
}

body
{
	min-width: 980px;
	width: 90%;
	min-height: 830px;
	height: 90%;
	margin: auto;
	background: black;
}

header
{
	width: 100%;
	height:160px;
	margin-top: 25px;
	background: url('images/image_fd.jpg');
	border-radius: 5px 5px 0px 0px;
}

#slogan
{
	display: inline-block;
	margin-left: 25px;
	vertical-align: top;
	width: 50%;
}

#titre
{
	display: inline-block;
	vertical-align: 20px;
	width: 45%;
	margin-top: 20px;
	text-align: right;
}

#titre h3
{
	padding: 5px;
	margin: 0px;
}

header div h1, header div h2
{
	padding: 1px;
	margin: 5px;
}

/* Navigation */
#menu
{
	height:250px;
	font-size:0.9em;
}

#menu .menu_dynamique
{
	position:relative;
}

#menu .menu_ul
{
	padding-left:5%;
}

#menu .menu_dynamique ul
{
	width:95%;
	height:30px;
	margin-top:25px;
	background:#888;
	background:-moz-linear-gradient(top,#ccc,#555);
	background:-webkit-gradient(linear,left top,left bottom,from(#ccc),to(#555));
	-moz-box-shadow:0px 1px 2px black;
	-webkit-box-shadow:0px 1px 2px black;
	box-shadow:0px 1px 2px black;
}

#menu .menu_dynamique ul li ul
{
	display:none;
}

#menu .menu_dynamique ul li
{
	float:left;
	position:relative;
	list-style:none;
	height:30px;
}

#menu .menu_dynamique ul li a
{
	display:block;
	height:23px;
	padding:7px 20px 0px 20px;
	text-decoration:none;
	color:#333;
}

#menu .menu_dynamique ul li:hover a
{
	background: silver;
	background: -moz-linear-gradient(top,#111,#444 50%);
	background: -webkit-gradient(linear,left top,left bottom,from(#111),color-stop(0.5,#555));
	color: white;
	border-top: 3px solid #0C9;
	height: 23px;
	padding-top: 4px;
}

#menu .menu_dynamique ul li:hover ul
{
	display:block;
	position:absolute;
	z-index:100;
	top:-22px;
	left:50%;
	margin-left:-22px;
	-moz-box-shadow:0px 0px 2px black;
	-webkit-box-shadow:0px 0px 2px black;
	box-shadow:0px 0px 2px black;
	transition: 0.5;
}

#menu .menu_dynamique ul li ul:before
{
	content:"";
	position:absolute;
	top:-5px;
	left:10px;
	width:0px;
	height:0px;
	border-bottom:10px solid #0C9;
	border-left:10px solid transparent;
	border-right:10px solid transparent;
}

#menu .menu_dynamique ul li:nth-child(2) ul:before
{
	content:"";
	border-bottom-color:rgba(250,213,135,1);
}

#menu .menu_dynamique ul li:nth-child(3) ul:before
{
	content:"";
	border-bottom-color:#C09
}

#menu .menu_dynamique ul li:nth-child(4) ul:before
{
	content:"";
	border-bottom-color:#9C0;
}

#menu .menu_dynamique ul li:nth-child(5) ul:before
{
	content:"";
	border-bottom-color:#C90;
}

#menu .menu_dynamique ul li ul
{
	width:auto;
	height:auto;
	margin-top: 52px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	padding:5px 0;
}

#menu .menu_dynamique ul li ul li
{
	float:none;
	white-space:nowrap;
	height:18px;
}

#menu .menu_dynamique ul li:hover ul li a
{
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	background:none;
	font-size:0.9em;
	height:15px;
	padding:2px 20px 2px 10px;
	border:none;
}

#menu .menu_dynamique ul li ul li a:hover
{
	background:rgba(255,255,255,0.2);
}

#menu .menu_dynamique ul li:nth-child(1) ul
{
	background:#0c9;
	background:-moz-linear-gradient(top,#0C9 40%,#008060);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,#0C9),to(#008060));
}

#menu .menu_dynamique ul li:nth-child(2) ul
{
	background:rgba(250,213,135,1);
	background:-moz-linear-gradient(top,rgba(250,213,135,1) 40%,rgba(244,194,77,1));
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,rgba(250,213,135,1)),to(rgba(244,194,77,1)));
}

#menu .menu_dynamique ul li:nth-child(3) ul
{
	background:#c09;
	background:-moz-linear-gradient(top,#C09 40%,#800060);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,#c09),to(#800060));
}

#menu .menu_dynamique ul li:nth-child(4) ul
{
	background:#9c0;
	background:-moz-linear-gradient(top,#9C0 40%,#608000);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,#9c0),to(#608000));
}

#menu .menu_dynamique ul li:nth-child(5) ul
{
	background:#c90;
	background:-moz-linear-gradient(top,#C90 40%,#806000);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,#c90),to(#806000));
}

#menu .menu_dynamique ul li:nth-child(6) ul
{
	background:#0c9;
	background:-moz-linear-gradient(top,#0C9 40%,#008060);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,#0C9),to(#008060));
}

#menu .menu_dynamique ul li:nth-child(1) ul
{
	background:#0c9;
	background:-moz-linear-gradient(top,#0C9 40%,#008060);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0.4,#0C9),to(#008060));
}

#menu .menu_dynamique ul li:nth-child(2):hover a
{
	border-color:rgba(250,213,135,1);
}

#menu .menu_dynamique ul li:nth-child(3):hover a
{
	border-color:#C09;
}

#menu .menu_dynamique ul li:nth-child(4):hover a
{
	border-color:#9C0;
}

#menu .menu_dynamique ul li:nth-child(5):hover a
{
	border-color:#C90;
}

/* Corps de la page */
section
{
	width: 100%;
 	min-height: 500px;
/* 	max-height: 1200px; */
	overflow: auto;
	margin-bottom: -25px;
	background: white;
}

article
{
	width: 97%;
	margin: auto;
	margin-top: 0px;
	padding-bottom: 20px;
}

article a
{
	text-decoration: none;
}

/* Accueil */
#home_bkg
{
	width: 100%;
	overflow: auto;
	background: white url('icones/home.png') no-repeat;
	background-size: contain;
	background-position: top center;
}

/* Matériel */
#matos_bkg #tableau, #matos_detail #tableau
{
	border-collapse: collapse;
	margin: 0px auto;
}

#matos_bkg .img_mini
{
	width: 110px;
	text-align: center;
	vertical-align: middle;
}

#matos_bkg .descript
{
	width: 700px;
	vertical-align: middle;
	padding-left: 10px;
	padding-right: 10px;
}

.separateur_vertical
{
	height:100%;
	text-align: center;
	vertical-align: middle;
}

.prix
{
	width:200px;
	height:100%;
	text-align: center;
	vertical-align: middle;
}

#matos_bkg .descript a,#tableau .info_matos a
{
    text-decoration: none;
}

#matos_detail #tableau
{
	width: 800px;
}

#tableau .img_detail
{
	width: 300px;
	text-align: center;
	vertical-align: middle;
}
#tableau .docu_matos
{
	text-decoration: underline;
	color: royalblue;
	font-weight: bold;
	width: 500px;
	text-align: left;
	vertical-align: middle;
}
#tableau .info_matos,.description
{
	width: 500px;
	text-align: left;
	vertical-align: top;
	padding-left: 20px;
}

#tableau .logopdf
{
	width: 40px;
	text-align: center;
	vertical-align: middle;
}

.note_tva
{
	font-size: 11px;
	font-style: italic;
}

/* Galerie */
#tableau
{
	margin: 0px auto;
}

#gallery_bkg .img_mini
{
	width: 150px;
	text-align: center;
	vertical-align: middle;
}

#gallery_bkg .descript
{
	width: 760px;
	vertical-align: middle;
	padding-left: 10px;
}

#gallery_bkg .descript a
{
    text-decoration: none;
}

#gallery_bkg
{
	width: 100%;
	overflow: auto;
	background: white url('icones/gallery.png') no-repeat;
	background-size: contain;
	background-position: center;
}

/* Actus */
#actus_bkg
{
}

#actus_bkg h3
{
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: center;
	font-weight: bold;
	text-decoration: underline;
}

#actus_bkg dl
{
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 2px;
	padding-bottom: 2px;
}

#actus_bkg dt
{
	font-weight: bold;
}

/* Contact */
#contact_bkg
{
	width: 100%;
	overflow: auto;
	background: white url('icones/mail.png') no-repeat;
	background-size: contain;
	background-position: top center;
}

/* Boite à outils */
#toolbox
{
	width: 100%;
	overflow: auto;
	background: white url('icones/tool.png') no-repeat;
	background-size: contain;
	background-position: top center;
}

#toolbox h3
{
	margin: auto 0px;
	padding: 0px 0px;
}

#toolbox p
{
	margin-top: 0px;
	margin-bottom: 4px;
	padding: 0px 2px;
}

#toolbox a
{
	text-decoration: none;
}

#toolbox a:hover
{
	text-decoration: underline;
	color: royalblue;
}

#colspan
{
	min-width: 100%;
}

/* Général */
#anim, #cv, #send
{
	text-align: center;
	box-pack: center;
	-webkit-box-pack: center;
	-moz-box-pack: center;
}

#anim_size
{
	width: 900px;
	height: 450px;
}

#cv
{
	height: 90%;
}

form #Msg, form #input
{
	width: 400px;
}

/* Pied de page */
footer
{
	width: 100%;
	height: 30px;
 	margin-top: 0px;	
	padding-top: 5px;
	background: url('images/image_pdp.jpg');
	border-radius: 0px 0px 5px 5px;
}

#pdp
{
	width: auto;
	padding-top: px;
	margin: auto;
	margin-bottom: 20px;
	text-align: center;
}

#contact, #copyright
{
	width: 220px;
}

#siren
{
	width: auto;
}

#sociaux
{
	width: auto;
}

#contact a, #copyright a
{
	text-decoration: none;
	color: blue;
}

#contact, #siren, #copyright, #sociaux
{
	display: inline;
	vertical-align: middle;
	margin-left: 10px;
	margin-right: 10px;
	text-align: center;
}

#pub
{
	width: auto;
	margin: auto;
	margin-bottom: 50px;
	text-align: center;
}		