/* FORMULAIRE */
/*form {
 background-color:red;
 padding:10px;
 width:75%;
 }
fieldset {
 padding:0 20px 20px 20px;
 margin-bottom:10px;
 border:1px solid #DF3F3F;
 }
legend {
 color:#DF3F3F;
 font-weight:bold
 }*/

label {
 margin-top:10px;
 font-weight:bold;
 display:block;
 }

 input{
 background-color:transparent;
  height: 20px;
 }
textarea{
 background-color:transparent;
 }
input, textarea{
 padding:3px;
 border:1px solid #94a6b0;
 border-radius:0px;
 width:400px;
 }
input.radio{
 width:0px;
 height: 0px;
 display:none;
 }
button.bouton{
 text-align: center;
 width:100px;
 height: 40px;
 font-weight:bold;
 color:white;
  border-radius:0px;
 border:1px solid #94a6b0;
 background-color:#94a6b0;
 cursor:pointer;
 }
textarea{
 height: 80px;
 }

/* NIVEAU : BODY */

body
{
  margin:0;
  padding:0;
  background:white;
  font-family:Century Gothic, Tahoma, Verdana, Helvetica, Arial, sans-serif;
  font-weight:normal;
  font-size:12px;
  
}

h1{
  font-weight:bold;
  font-size:14px; 
}

/* TEXTE TITRE */
h2{
  line-height:1;
  font-family:Century Gothic;
  font-weight:bold;
  font-size:26px;  
}
h4{
  font-family:Century Gothic;
  font-weight:bold;
  font-size:20px;  
}
h6{
  font: black;
  font-family:Century Gothic;
  font-weight:bold;
  font-size:12px;
  text-align:center;  
}

video
{
 width:600px;
 height:400px;
}
/* NIVEAU : WRAPPER */

#wrapper
{
  width:100%;
  margin: auto;
}

/* SECTION : TOP */

#top
{
  clear:both;
  font-size:12px;
  border-bottom:1px solid #E5E5E5;
  /*text-align:center;*/
  height: 46px;
  color:grey;
  padding-right: 50px;
  
}
#top-links ul li{
    display: inline-block;
	border-width: 0px 1px 0px 0px; 
	border-style: solid;
	margin-right: 5px;
	
}

#top-links ul li a{
    color: black;
	font-size: 12px;
    font-weight: normal;
    display: block;
    margin-right: 10px;
	text-decoration: none;
	
}

#top-links ul li a:hover{
    color: black;
	font-size: 12px;
    font-weight: normal;
    display: block;
    margin-right: 10px;
	text-decoration: underline;
	
}

/* SECTION : LOGO et MENU */

#logo-et-menu
{
  /*position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  margin-bottom:20px;
  background:white;
  /*border:1px solid purple;*/
  height: 90px;
  z-index: 1;
  
  }
#retour
{ display:none; 
}
#retour.floatable
{ position: fixed;
  display:block;
  right:20px;
  bottom:10px;
  width:40px;
  height: 40px;
  background:#94A6B0;
  opacity: 0.7;
  z-index: 2; 
}

#logo-et-menu.floatable {
  position: fixed;
  top: 0;
  width: 100%;
  background:#94A6B0;
  opacity: 0.95;
  z-index: 2;
}

img#logo1
{
  float: left;
  width:160px;
  opacity: 1;
  z-index: 2;
  }
img#logo2
{
  float: left;
  width:160px;
  padding-top: 10px;
  padding-left: 140px;
  z-index: 2;
}

img#fleche
{
  float:left;
  padding-top: 10px;
  padding-left: 10px;
  width:20px;
  height:20px;
  opacity: 1;
  z-index: 2;
  }

div#selection
{
  float: right;
  width:100%;
  padding: 30px 0px 30px 0px;
}
img#selection
{
  padding: 0px 20px 0px 20px;
}

/* SECTION : MENU*/

#menu
{
float: right;
opacity: 1;
z-index: 2;
padding-right: 140px;
padding-top: 35px;

}

div#home {
  float: left;
  background-image: url('../images/home1.png');
  background-repeat: no-repeat;
  width: 20px;
  height: 15px;
  padding:5px;
  z-index: 2;
 
}


div#home.floatable {
  background-image: url('../images/home2.png');
}

/* main menu nav1 styles */
#nav1{
    display:inline-block;
	width: 480px;
    margin:0;
    padding:0;
	opacity: 1;
	z-index: 2;
    list-style:none;
	
}

#nav1 li {
    float: right;
    margin:0;
	font-size:15px;
	padding:0px 10px;
    position:relative;
    list-style:none;
	border-width: 0px 0px 0px 1px; 
	border-style: solid;
	z-index: 2;
	
}
#nav1.floatable li {
    border-color:white;
}
#nav1 li .top, #nav1 li .top2, #nav1 li .bottom, #nav1 li .bottom2{
	padding:0px 0px;
}

#nav1 a {
    font-weight:normal;
    color:black;
    text-decoration:none;
    display:block;
    padding:0px 0px;
}
#nav1.floatable a {
    color:white;
}

#nav1 a.barre:after{
content:'';
background-color: black;
width:0%;
margin-left:50%;
height:4px;
top:-37px;
left:10%;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
transition:all 0.5s;

position:absolute;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
transition:all 0.5s;
}

#nav1 a.barre:hover:after {
background-color: darkgrey;
width:80%;
margin-left:0%;
}
#nav1.floatable a.barre:hover:after {
background-color: black;
}

/* selected menu element */
#nav1 li:hover > a {
    color:#e7e5e5;
}
#nav1.floatable li:hover > a {
    color:black;
}

/*sublevels */
#nav1 ul li:hover a, #nav1 li:hover li a {
    font-size: 14px;
	padding:5px 5px 0px 10px;
    color:#000;
}

#nav1 ul li.decalage a:hover {
    background:none;
    color:#fff;
}

/* drop down */
#nav1 li:hover > ul {
    opacity:1;
    visibility:visible;
	-webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
	
}
#nav1 ul {
    opacity:0;
    visibility:hidden;
    padding:0;
    width:180px;
    position:absolute;
	right:100px;
	-webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
 #nav1 li ul li{
    float:none;
	left:0px;
    margin:0; 
	background:#F4F5F6;
	
}
 
#nav1 li ul li.bottom{
    height:30px;
    float:none;
	left:100px;
	background:#F4F5F6;
	border-left:none;
	color:black;
	border-top: 1px solid black;

}
#nav1 li ul li.bottom2{
    height:45px;
    float:none;
	left:100px;
	background:#F4F5F6;
	border-left:none;
	color:black;
	border-top: 1px solid black;
}
#nav1.floatable li ul li.bottom, #nav1.floatable li ul li.bottom2{
    border-color:black;
}
#nav1 li ul li.top {
    height:30px;
    float:none;
	left:100px;
	background:#F4F5F6;
	border-top:none;
	border-left:none;
	color:black;
}
#nav1 li ul li.top2 {
    height:45px;
    float:none;
	left:100px;
	background:#F4F5F6;
	border-top:none;
	border-left:none;
	color:black;
}
#nav1 li ul li.decalage {
    height: 36px;
    float:none;
	left:100px;
    margin:0;
	background:none;
	border-top:none;
	border-left:none;
}
#nav1 ul a {

    font-weight:normal;
}
#nav1 li.top a {
    height:30px;
	padding:0px 0px;
    font-weight:normal;
}
#nav1 li.bottom a {
    height:30px;
	padding:0px 0px;
    font-weight:normal;
}
#nav1 li.bottom2 a {
    height:40px;
	padding:0px 0px;
    font-weight:normal;
}
#nav1 li.top a:hover, #nav1 li.bottom a:hover , #nav1 li.bottom2 a:hover{
    background:darkgrey;
	color: white;
}
#nav1 ul ul {
    right:283px;
    top:0px;
	
}
/* TITRE PAGE */
#titre-et-nav
{
  clear:both;
  font-size:12px;
  /*text-align:center;*/
  height: 60px;
  color:grey;
  padding-right: 150px;
  
}
#titre-et-nav.magasin
{
  background: #FFC600;
}
#titre-et-nav.atelier
{
  background: #00a7e1;
}
#titre-et-nav.acoustique
{
  background: #e5007c;
}
#titre-et-nav.ergonomie
{
  background: #afca04;
}
#titre-et-nav.autres
{
  background: #94a6b0;
}
#titre
{
  float:left;
  top:20px;
  padding-left: 140px;
  color:black;
  width:330px;
}
/*
#navigation
{
  float:right;
  top:20px;
  padding-right: 30px;
}

/* NIVEAU : HEADER, MAIN et RESET */


#header
{
  float:right;
  width:20%;
  padding-right:100px;
}

#main
{
  float:left;
  width:100%;
  padding:20px;
}
/* SECTION : CONTENT*/ 

#content
{
line-height:2;
font-size:14px;
  float:left;
  width:60%;
  min-height:550px;
  padding-left:120px;
}
#content1
{
line-height:2;
font-size:14px;
  float:left;
  width:75%;
}
#content3
{
line-height:2;
font-size:14px;
  float:left;
  width:60%;
  min-height:250px;
  padding-left:120px;
}
#content2
{
  float:left;
  width:100%;
}
#header a
{
color:black;
}
#header a:hover
{
color:black;
text-decoration:underline;
}
#contentlarge
{
line-height:2;
font-size:14px;
  float:left;
  width:100%;
}

#content img
{
  float:left;
  width:300px;
  margin:0px 0px 10px 20px; 
}
#content img#plateau
{
  float:left;
  width:115px;
  height:90px;
}
#content div#plateau
{
  float:left;
  height:90px; 
}
#content img#deco
{
  float:right;
  width:100%;
  margin:0px 0px 10px 20px;
  border-bottom: none; 
}  
#content img#produit
{
  float:left;
  width:45%;
  padding-bottom: 50px;
} 
#content div#texte, div#saut
{
  float:right;
  width:50%;
}
#content div#texte2
{
  float:left;
  width:95%;
}
#content div#texte3
{
  font: red;
}
#content div#gamme
{	 
  float:left;
  width:95%;
}
#content img#deco.magasin
{
  border-bottom: 5px solid #FFC600; 
}
#content img#deco.atelier
{
  border-bottom: 5px solid #00a7e1; 
}
#content img#deco.acoustique
{
  border-bottom: 5px solid #e5007c; 
 }
 #content img#deco.ergonomie
{
  border-bottom: 5px solid #afca04; 
}
 #content img#deco.autres
{
  border-bottom: 5px solid #94a6b0; 
}

#blocimage, #blocproduit
{
  float:left;
  width:140px;
  padding-right:5px;
  font-size:12px;
  margin-bottom: 5px;
  padding-left:5px;
  padding-bottom:5px;
}
#blocproduit:hover
{
  border-bottom: 5px solid #00a7e1;
  margin: 0;
}
#blocproduit.ergo:hover
{
  border-bottom: 5px solid #afca04;
  margin: 0;
}
#blocproduit a
{
  color:black; 
}
#blocproduit a:hover
{
  color:black;
}
#blocimage img
{
  text-align:left;
  float: left;
  width:100%;
  margin:0;
}
#blocproduit img.select
{
  float: left;
  width:130px;
  margin-left:5px;
}

/* SECTION : NAV*/

#nav
{
  padding-top: 20px;
  font-size:13px;
  font-weight:normal;
  color: black;
  /*border-width: 1px 1px 1px 1px; border-style: solid;*/
}

#nav ul
{
  margin:0;
  padding:0;
  list-style:none;
  border-color: grey;
  border-width: 0px 0px 1px 0px; border-style: solid;
}

#nav ul li a
 {
  color: #444;
  text-decoration:none;
}

#nav ul li a:hover
 {
  color: #444;
  text-decoration:none;
}
#nav ul li.active 
{
  color: #444;
  
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; 
  border-style: solid;
}

#nav ul li.active:hover, #nav ul li.titrea:hover
{
  background-color:#C9D3D7;
}

#nav ul li.selection
{
  
  background-color:#C9D3D7;
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; border-style: solid;
}
#nav ul li.titre
{
  padding:5px 40px;
  border-color: grey;
  font-weight:bold;
  background-color:#C9D3D7;
}
#nav ul li.titrea
{
  padding:5px 40px;
  border-color: grey;
  font-weight:bold;
}
/*
FICHE PRODUIT
1 magasin background: #FFC600;
2 atelier background: #00a7e1;
3 acoustique background: #e5007c;
4 ergonomie background: #afca04;
5 autres background: #94a6b0;
*/
#nav ul li.fiche1
{
  color: #444;
  font-weight:bold;
  background-color:#FFC600;;
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; 
  border-style: solid;
}
#nav ul li.fiche2
{
  color: #444;
  font-weight:bold;
  background-color:#00a7e1;
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; 
  border-style: solid;
}
#nav ul li.fiche3
{
  color: #444;
  font-weight:bold;
  background-color:#e5007c;
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; 
  border-style: solid;
}
#nav ul li.fiche4
{
  color: #444;
  font-weight:bold;
  background-color:#afca04;
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; 
  border-style: solid;
}
#nav ul li.fiche5
{
  color: #444;
  font-weight:bold;
  background-color:#94a6b0;
  padding:5px 40px;
  border-color: grey;
  border-width: 1px 0px 0px 0px; 
  border-style: solid;
}
#nav ul li.fiche1:hover, #nav ul li.fiche2:hover, #nav ul li.fiche3:hover, #nav ul li.fiche4:hover, #nav ul li.fiche5:hover,
{
  background-color:white;
}
/* SECTION : FOOTER */

#footer
{
  clear:both;
  font-size:12px;
  border-top:1px solid black;
  text-align:center;
  height: 60px;
  color:black;
  padding-top:15px;
}
#footer-links ul li{
    display: inline-block;
	border-width: 0px 0px 0px 1px; border-style: solid; 
}
#footer-links ul li a{
    color: #444;
	font-size: 13px;
    font-weight: normal;
    display: block;
	margin-left: 15px;
    margin-right: 15px;
	text-decoration: none;
}

#map{
  width: 100%;
  height: 600px;
}


#reset
{
  clear:both;
}
