@charset "utf-8";

@font-face {
    font-family: 'wwBlack';
    src: url('fonts/walkway_black-webfont.eot');
    src: url('fonts/walkway_black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/walkway_black-webfont.woff') format('woff'),
         url('fonts/walkway_black-webfont.ttf') format('truetype'),
         url('fonts/walkway_black-webfont.svg#fonts/walkway_blackregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'wwBold';
    src: url('fonts/walkway_bold-webfont.eot');
    src: url('fonts/walkway_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/walkway_bold-webfont.woff') format('woff'),
         url('fonts/walkway_bold-webfont.ttf') format('truetype'),
         url('fonts/walkway_bold-webfont.svg#fonts/walkway_boldregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

*{
	box-sizing: border-box ;
}

body
{
margin : 0 ;
padding : 0 ;
font : normal 12px/18px Arial, Helvetica, sans-serif ;
color : #000 ;
      background: url(images/bg.jpg) no-repeat center center fixed #BED560 ; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
  position : relative ;
}

img
{
border : none ;
}

a
{
text-decoration : none ;
color : #000 ;
}

p >a {
	text-decoration : underline ;
}
a, input, textarea, div, li, p
{
transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
}

a:active, a:focus
{
outline : none ;
}

a:active
{
}
div
{
position : relative ;
}

.hidden
{
overflow : hidden ;
}

#conteneur
{
width : 895px ;
margin : 0 auto ;
padding : 0 ;
position : relative ;
overflow: visible ;
}

#header
{
height : 245px ;
z-index : 100 ;
background : url(images/header.png) no-repeat center center;
}
#headerIndexWrap
{
height : 123px ;
z-index : 100 ;
background : url(images/headerIndex.png) no-repeat left center;
}

#headerInt
{
width : 895px ;
margin : 0 auto ;
}

#logo
{
width : 400px ;
height : 185px ;
margin : 0 ;
padding : 0px 0 00px 0 ;
position : absolute ;
left : 0 ;
top : 0px ;
}

#logo a
{
display : block ;
height : 100px ;
margin : 0 ;
padding : 65px 0 20px 0 ;
color : #fff ;
font-family : wwBold ;
font-size : 17px ;
width : 400px ;
}

.indexTitle
{
font-family : wwBold ;
font-size : 17px ;
color : #0075B6;
text-align:center;
margin : -60px 0 120px 0;
position : absolute ;
top : 95%;
width : 100%}

#flags
{
width : 29px ;
height : 29px ;
position : absolute ;
top : 8px ;
right : -10px ;
}

#flags a
{
display : block ;
margin : 0 0 8px 0 ;
width : 29px ;
height : 29px ;
}

#flags a:hover, #flags a:focus
{
opacity : 0.7 ;
filter : alpha(opacity=70);
}
#mainMenu
{
margin : 0  ;
padding : 0 ;
list-style-type:none ;
width : 165px ;
position : absolute ;
z-index : 101 ;
top : -30px ;
left : 7px ;

}
#mainMenu li a
{
font-family : wwBlack ;
font-size : 17px ;
color : #0275B6 ;
border-bottom : 1px solid ;
display : block ;
padding : 7px 0 ;
}

#mainMenu li a:hover,
#mainMenu li a:focus,
#mainMenu li a.active
{
color : #fff ;
background : #000 ;
padding-left : 10px ;
}

.deco
{
position : absolute ;
display : block ;
width : 100% ;
height : 287px ;
top : 110px ;
}
.decoBottom
{
position : absolute ;
display : block ;
width : 100% ;
height : 287px ;
bottom : 0px ;
z-index : 10 ;
}
.deco1
{
background : url(images/deco1.png) no-repeat center center ;
}

.deco2
{
background : url(images/deco2.png) no-repeat center center ;
}

.deco3
{
background : url(images/deco3.png) no-repeat center center ;
}
.deco4
{
background : url(images/deco4.png) no-repeat center center ;
}
.deco5
{
background : url(images/deco5.png) no-repeat center center ;
}
.deco6
{
background : url(images/deco6.png) no-repeat center center ;
}
.deco7
{
background : url(images/deco7.png) no-repeat center center ;
}

#content
{
position : relative ;
padding : 70px 0 0 215px ;
min-height : 500px ;
}

#content h1
{
color : #A5E220 ;
font-size : 32px ;
background : #fff ;
padding : 16px 20px ;
font-weight : normal ;
text-transform : uppercase ;
margin : 0 0 20px 0 ;
display : inline-block ;
line-height : 28px ;
}
#content h2
{
color : #A5E220 ;
font-size : 24px ;
background : #fff ;
padding : 16px 20px ;
font-weight : normal ;
text-transform : uppercase ;
margin : 0 0 20px 0 ;
display : inline-block ;
line-height : 20px ;
}

#content h3
{
color : #A5E220 ;
font-size : 17px ;
padding : 0 ;
font-weight : normal ;
text-transform : uppercase ;
margin : 20px 0 ;
}
#content h4
{
font-size : 14px ;
padding : 0 ;
font-weight : normal ;
text-transform : uppercase ;
margin : 10px 0 ;
}

#content h4.mentions
{
font-size : 14px ;
padding : 0 ;
font-weight : bold !important ;
text-transform : uppercase ;
margin : 10px 0 ;
}
.whtBg
{
background : #fff ;
padding : 15px ;
}

.dash
{
background-image : url(images/dash.png) ;
background-repeat : no-repeat ;
background-position : 10px 10px ;
padding-top : 35px ;
}

.justify
{
text-align : justify ;
}

.margin20_0
{
margin : 20px 0 ;
}

.floatL
{
float : left
}

.floatR
{
float : right ;
}
.width40p100
{
width : 39% ;
}
.width60p100
{
width : 58% ;
}

.resultTeam
{
padding-left : 200px ;
min-height : 184px ;
}

.resultTeam div
{
margin : 0 ;
padding : 60px 0 0 0;
}

.resultTeam div strong
{
font-size : 16px ;
}

.alignCenter
{
text-align : center ;
}

.contactForm table
{
border : none ;
}

.contactForm table tr td
{
padding : 5px !important;
}

.contactForm input[type=text],
.contactForm input[type=email],
.contactForm input[type=password],
.contactForm input[type=date]
{
background : #CEF0FB ;
width : 200px ;
height : 40px ;
line-height : 40px ;
padding : 0 10px ;
border : none ;
color:#538392;font-style:italic
}

.contactForm textarea
{
background : #CEF0FB ;
width : 170px ;
height : 166px ;
line-height : 40px ;
padding : 10px 10px ;
border : none ;
color:#538392;font-style:italic;
font : normal italic  12px/18px Arial, Helvetica, sans-serif ;
}

.contactForm input[type=submit]
{
display : block ;
background : #ACCB5F ;
color : #0157BD ;
text-transform : uppercase ;
font-size : 17px ;
font-weight : bold ;
border : none ;
width : 190px ;
height : 40px ;
line-height : 40px ;
text-align : center ;
cursor : pointer ;
}

.contactForm input[type=submit]:hover
{
text-shadow : 0px 1px 1px #fff ;
}
/* all */
::placeholder	{ color:#999;font-style:italic }
/* input:-moz-placeholder { color:#999;font-style:italic }

.contactForm input[type=text]::-webkit-input-placeholder { color:#999;font-style:italic }

.contactForm input[type=text]::-moz-placeholder { color:#999;font-style:italic } */


#footer
{
color : #0275B6 ;
font-family : wwBlack ;
text-align : center ;
clear : both ;
margin : 20px auto ;
padding-left : 190px ;
position : relative ;
z-index : 11 ;
}

#footer a
{
color : #0275B6 ;
font-family : wwBlack ;
}

.produits
{
position : relative ;
width : 195px ;
height: 195px ;
margin : 0 25px 55px 5px  ;
padding: 0 ;
float : left ;
box-shadow : 0 0 7px #999 ;
}

.produits span
{
display : block ;
font-size : 16px ;
text-align : right ;
background : #fff ;
padding-right : 10px ;
position : absolute ;
bottom : 0 ;
right : 0 ;
width : 70% ;
height : 25px ;
line-height : 25px ;
color:#0275B6 ;
}

.blue
{
color : #0275B6 ;
}

#entrer
{
background : url(images/entrer.png) no-repeat left top ;
display : block ;
position : absolute ;
width : 163px ;
height:163px ;
overflow : hidden ;
text-indent: -5000px ;
top : 50% ;
left : 66% ;
}

.map
{
background : url(images/map.png) no-repeat left top ;
width : 666px ;
height : 523px ;
position : relative ;
}

.nosUsines
{
position : absolute ;
left : 10px ;
width : 205px ;
line-height : 18px ;
text-align : right ;
padding-bottom : 7px ;
overflow : hidden ;
}
.nosUsines span[itemprop=name]
{
display : block ;
text-transform : uppercase ;
border-bottom : 2px dotted ;
}


.nosUsines a
{
color : #000 ;
}
.siege
{
font-size : 9px ;
color : gray ;
}
.havre
{
top : 72px ;
}

.lyon
{
top : 215px ;
}
.pau
{
top : 350px ;
}

.espagne
{
top : 476px ;
}

.cookie-notice {
	transition : .2s ease-in-out ;
	background: rgba(51, 51, 51, .85);
	bottom: 0;
	color: white;
	font-size: 1.1em;
	left: 0;
	line-height: 1.2;
	padding: 0.4em 2%;
	position: fixed;
	text-align: center;
	width: 100%;
	z-index: 99999;
}
.cookie-notice a{
	  color : white;
	  border-bottom : 1px solid ;
}
  
.cookie-notice a:hover{
	text-decoration:none ;
	border-color : white ;
}
  
.cookie-notice__accept,
.cookie-notice__accept:hover {
	  background: rgba(95, 158, 160, .85);
	  color: white;
	  cursor: pointer;
	  font-size: .9em;
	  font-weight: 500;
	  padding: 0 .75em;
	  text-decoration: none;
	  margin-left : 20px ;
}

.alert-danger{
	padding : 1rem ;
	color : white ;
	background : rgba(255,0,0,.75);
}
.alert-success{
	padding : 1rem ;
	color : white ;
	background : rgba(22, 182, 115, 0.75);
}
#toggleMenu,
#closeMenuHandler{
	display: none ;
}

@media screen and (max-width: 992px) {
	#header{
		background: url(images/header-mobile.png) no-repeat top left;
	}
	#conteneur {
		width: 100% ;
	}
	#headerInt {
		width : 100% ;
	}

	#logo {
		width : 100% ;
	}
	#logo a{
		width : 100% ;
		padding-left : 10px ;
		padding-right : 10px ;
	}

	#flags{
		width: 100% ;
		right: 0px ;
		top : 110px ;
		padding-left: 10px;
		padding-right: 10px;
		display: flex;
		justify-content: space-between;
	}
	#flags a{
		display: inline-block;
		margin-left : 5px ;
	}

	img{
		max-width: 100%;
		height: auto;
	}
	#mainMenu{
		top:initial;
		width: 100% ;
		position: fixed;
		z-index : 10000;
		top : 0 ;
		right : 0 ;
		bottom : 0 ;
		left : 0 ;
		background-color: rgba(255, 255, 255, .95);
		transform : translateX(-100%);
		transition: all .2s ease-in-out;
	}

	#mainMenu li a {
		padding: 15px;
	}
		

	#mainMenu.show{
		transform : translateX(0);
	}
	#content{
		padding-left : 0 ;
	}
	#footer{
		padding-left : 0 ;
	}

	#toggleMenu,
	#closeMenu{
		display: block ;
		padding : 0 ;
		margin : 0 ;
		background: transparent;
		border: none;
	}
	#toggleMenu svg{
		fill: white ;
		border-radius: 2px ;
	}
	#closeMenuHandler{
		display: block ;
		text-align: right ;
		border : none ;
		font-size : 10px ;
		padding : 15px 10px ;
	}
	#closeMenu{
		display: inline-block;
		font-size : 30px ;
		color : #0275B6 ;
	}

	.produits{
		width : 100% ;
		height: auto;
		padding-left : 10px ;
		padding-right : 10px ;
		margin : 0 0 20px 0 ;
		float: none ;

	}
	.produits a{
		display: block ;
	}
	.produits img{
		width : 100% ;
	}

	.map{
		width : 100% ;
		background: url(images/map.png) no-repeat -80px top;
	}
	.nosUsines{
		width: 128px ;
	}

	.contactForm table tr td {
		display: block ;
		width: 100% ;
	}
	.contactForm input[type="text"],
	.contactForm input[type="email"],
	.contactForm input[type="tel"],
	.contactForm input[type="date"],
	.contactForm input[type="password"],
	.contactForm textarea {
		display: block ;
		width: 100% ;
	}
}