/* F O N T - F A C E */
@font-face {
  font-family: 'Brandon Grotesque';
  font-style: medium;
  font-weight: medium;
  src: local('Brandon'), url('../_fonts/hvd_fonts__brandongrotesque-medium-webfont.ttf') format('truetype');
}
@font-face {
  font-family: 'Brandon Grotesque';
  font-style: normal;
  font-weight: normal;
  src: local('Brandon'), url('../_fonts/hvd_fonts__brandongrotesque-regular-webfont.ttf') format('truetype');
}
@font-face {
  font-family: 'Brandon Grotesque';
  font-style: light;
  font-weight: 100;
  src: local('Brandon'), url('../_fonts/hvd_fonts__brandongrotesque-light-webfont.ttf') format('truetype');
}

@font-face {
  font-family: 'Proxima Nova';
  font-style: light;
  font-weight: 100;
  src: local('Proxima'), url('../_fonts/mark_simonson_-_proxima_nova_light-webfont.ttf') format('truetype');
}
@font-face {
  font-family: 'Proxima Nova';
  font-style: normal;
  font-weight: 400;
  src: local('Proxima'), url('../_fonts/mark_simonson_-_proxima_nova_regular-webfont.ttf') format('truetype');
}


/* C O L O N N E S */
.four {
	width: 940px;
}

.three {
	width: 700px;
}

.two {
	width: 460px;
}

.one {
	width: 220px;
}









/* B A S E */

ul {
	padding: 0;
	margin: 0;
}

ul li {
	list-style: none;
}

body {
	font-family: "Proxima Nova", sans-serif;
	font-weight: 200;
	color: #111111;
	height: 100%;
}

p {
	font-size: 18px;
	line-height: 25px;
}

a {
	color: #111111;
	font-weight: 600;
	text-decoration: none;
}

.container {
	width: 940px;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
}

header {
	background: #E6A42E;
	color: white;
	position: fixed;
	width: 100%;
	z-index: 99999;
	height: 91px;
}

.logo {
	position: absolute;
	left: 0;
	top: 20px;
}

main {
	background: white;
	margin-top: 200px;
	margin-bottom: 134px;
	position: relative; 
	float: left;
	width: 100%;
}

aside {
	margin-top: 205px;
	float: right;
	width: 220px;
}

.button {
	background: #E6A42E;
	padding: 7px 0;
	font-size: 18px;
	width: 220px;
	text-align: center;
	text-decoration: none;
	border: none;
	color: white;
	position: relative;
	left: 240px;
	font-family: "Brandon Grotesque";
	font-weight: 400;
	display: inline-block;
}



/*.no-link {
	cursor: not-allowed;
}*/











/* T Y P O */
.uppercase {
	text-transform: uppercase;
}

h1 {
	padding: 0;
	margin: 0;
	margin-bottom: 15px;
	font-family: "Brandon Grotesque", sans-serif;
	font-weight: 100;
	color: #E6A42E;
	font-size: 38px;
	line-height: 54px;
}

h2 {
	font-family: "Brandon Grotesque";
	color: #E6A42E;
	font-weight: 100;
	font-size: 25px;
	line-height: 25px;	
	margin-top: 0;
	margin-bottom: 10px;
}

h3 {												
	font-family: "Brandon Grotesque";
	color: #E6A42E;
	font-weight: 100;
	font-size: 18px;
}



/* N A V */
nav {
	display: inline;
}

.nav {
	display: block;
	text-align: center;
}

.nav--element {
	display: inline-block;
}

.nav--element__lien {
	color: white;
	font-weight: 100;
	font-family: "Brandon Grotesque";
	text-transform: uppercase;
	font-size: 18px;
	padding: 5px 10px;
	margin: 25px 0;
	display: block;


	border: 2px solid #E6A42E;
}

.nav--active {
	border: 2px solid #FFF;
}

.header--logo {
	position: absolute;
	right: 0;
	top: 30px;
}



/* F O O T E R */
footer {
	background: #FAFAFA;
	font-size: 18px;
}

.footer--list {
	margin-top: 85px;
	width: 220px;
	margin-right: 20px;
	float: left;
	padding: 0;
}

.footer--list__last-child {
	margin-right: 0;
}

.footer--one ul {
	padding: 0;
}

.footer--list__element {
	list-style: none;
	padding: 5px 0;
}

.footer--four {
	width: 940px;
	clear: both;
	display: block;
	padding: 110px 0;
	text-align: center;
}

footer a {
	font-weight: 100;
}









/* A S I D E - D I V */
.aside--div {
	position: relative;
}

.aside--div h2 {
	padding-top: 20px;
}

.aside--div__panier {
	padding: 2px;
}

.panier-block {
	display: none;
}

.aside--div__panier--element {
	list-style: none;
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: 100;
}

.aside--div__livraison {
	padding: 2px;
}

.aside--div__livraison--element {
	list-style: none;
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: 100;
}


/* P A G E   P R O D U I T */
.pageproduit--fildariane {
	color: #ADADAD;
	font-weight: 100;
}

.pageproduit--fildariane a {
	color: #ADADAD;
}

.titre-petit {
	font-size: 18px;
}

.pageproduit--text {
	font-size: normal;
}

.pageproduit--text p{
	margin-bottom: 0;
}

.pageproduit--text__livraison {
	margin-top: 0;
	color: #ADADAD;
}

.pageproduit--image {
	margin: 20px 0 70px 0;
	width: 700px;
	height: 265px;
	background: #FAFAFA;
}

.pageproduit--aside {
	background: white;
	position: absolute;
	top: 99px;
	right: 0px;
	line-height: 24px;
}

.orange {
	color: #E6A42E;
}

.grey {
	color: #ADADAD;
}

.black {
	color: #111;
}

.bold {
	font-weight: normal;
}

.text-center {
	text-align: center;
	display: block;
}

.miam {
	left: 0;
	cursor: pointer;
	padding: 7px 0;
	border: 1px solid #E6A42E;
}

.miam:hover {
	background: none;
	color: #E6A42E;

	padding: 7px 0;
	border: 1px solid #E6A42E;
}

.miam-clicked {
	background: white;
	color: #E6A42E;

	padding: 6px 0;
	border: 1px solid #E6A42E;
}

#thebutton {
	width: 220px;
}


footer a:hover, header a:hover, .ailleurs--part__element a:hover, .pageproduit--fildariane a:hover, .credits a:hover {
	text-decoration: underline;
}











.plus-de-produits, .accueil-produits {
	padding: 0;
	list-style: none;
	display: inline;
}

.plus-de-produits--element, .accueil-produits--element {
	width: 220px;
	height: 220px;
	border: 1px solid #ADADAD;
	background: white;
	margin-top: 10px;
	margin-right: 17px;
	position: relative;
	float: left;
}

.plus-de-produits--element p, .accueil-produits--element p {
	line-height: 1;
}

.section--produits .accueil-produits--element:hover, .plus-de-produits--element:hover {
	border: 1px solid #111;
	transition: .2s ease-out;
}

.plus-de-produits--element:nth-child(3) {
	margin: 0;
	margin-top: 10px;
}

.plus-de-produits--element__image, .accueil-produits--element__image {
	width: 220px;
	height: 160px;
	background: #FAFAFA;
}

.plus-de-produits--element__titre, .accueil-produits--element__titre {
	position: absolute;
	margin-bottom: 0;

	bottom: 10px;
	left: 10px;
	width: 135px;
}

.text--element__double {
	width: 440px;
}

.accueil-produits--element__prix {
	position:absolute;
	right: 10px;
	bottom: -10px;
}

.accueil-produits a, .plus-de-produits a {
	position: relative;
	display: block;

	height: 220px;
	font-weight: 100;
}

.button:hover {
	padding: 6px 0;

	text-decoration: none;
}

aside {
	margin-bottom: 134px;
}

.panier-relative {
	position: relative;
	width: 166px;
	padding-bottom: 20px;
}

.aside-div__panier--element {
	position: relative;
}

.aside--div__panier--element__titre{	
	width: 120px;
	margin-bottom: 10px;
}

.aside-div__panier--element__prix {
	position: absolute;
	bottom: 12px;
	right: 0;
	
	font-weight: bold;
}

.aside-div__panier--element__croix {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 20px;
	height: 20px;
	
	border: none;
	background: none;
}

.aside-div__panier--element__input {
	width: 40px;
	height: 10px;
	left: 0;
	text-align: center;
	position: relative;
	color: #111;
}



.aside--div__total--prix {
	font-weight: bold;
	position: absolute;
	right: 10px;
}

.aside--div__total {
	padding-top: 0px;
	border-top: 1px solid #ADADAD;
	margin-right: 10px;
}


.button--verification {
	position: relative;
	left: 478px;

}

.accepter-conditions {
	position: relative;
	top: 0;
	left: 260px;
}

.accepter-conditions__button {
	position: relative;
	right: -280px;
}

.header--logo__panier {
	margin-left: 10px;
	position: relative;
}

.panier-quantite {
	position: absolute;
	top: 9px;
	margin: 0;

	display: block;
	width: 35px;
	
	color: #E6A42E;
	
	font-family: "Brandon Grotesque", sans-serif;
	font-weight: bold;
	font-size: 15px;
	text-align: center;
}

.panier-quantite-aside {
	font-size: 18px;
}

.pageproduit--aside__quantite {
	width: 70px;
	height: 40px;

	position: absolute;
	top: 14px;
	right: 0;
	color: black;
	text-align: center;
	
	border: 1px solid #E6A42E;
}

.normal {
	margin-top: 23px;
}

.aside-div__panier--element__input {
	width: 70px;
	height: 40px;

	color: black;
	text-align: center;

	border: 1px solid #E6A42E;
}


.div-plus-de-produits {
	padding-top: 40px;
	border-top: 1px solid #E6A42E;
}

.pagedeproduit--aside__prix {
	position: absolute;
	right: 0;
}






.button--panier__lateral {
	background: #E6A42E;
	padding: 6px 51px;
	font-size: 18px;
	width: 120px;
	text-align: center;
	border: none;
	color: white;
	position: relative;
	left: -20px;
	font-family: "Brandon Grotesque";
	font-weight: medium;
	display: inline-block;
	margin-top: 55px;
	
	
	padding: 10px 20px;
	width: 180px;
}

.button--panier__lateral:hover {
	background: white;
	border: 1px solid #E6A42E;
	color: #E6A42E;
	text-decoration: none;
	padding: 9px 0;
	width: 218px;
}

.panier-lateral {
	padding-top: 100px;
	padding-left: 20px;
	width: 200px;
	height: 100%;
	display: none;
	position: fixed;
	right: 0;
	background: #FAFAFA;
	z-index: 9999;
}

.panier-lateral .aside--div__total {
	margin-right: 30px;
}

.panier-lateral .position-right {
	right: 30px;
}

.unecolone-deux {
	width: 220px;
	position: relative;
	top: -30px;
	left: 240px;
	height: 100px;
}

.unecolone-deux img {
	position: relative;
	left: 30px;
}

.unecolone-deux input {
	position: inherit;
	top: -25px;
}


.header--logo__panier {
	width: 35px;
	height: 31px;
	float: right;
	cursor: pointer;
}

.header--logo__panier-vide {
	background: url("../_images/panier.svg");	
}

.header--logo__panier-full {
	background: url("../_images/panier-plein.svg");
}


.button-input {
	width: 220px;
	padding: 6px 0;
	border: 1px solid #E6A42E;
}

.button-input:hover {
	border: 1px solid #E6A42E;
	background: white;
	color: #E6A42E;
	
	width: 220px;
	padding: 6px 0;
	
	transition: .2s ease-out;
}


fieldset {
	border: 0;
	padding: 0;
	margin: 0;
}


/* A N I M   P A N I E R */
.panier-animation{
  animation: panierFrames linear 1s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  
  -webkit-animation: panierFrames ease-out 1s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  
  -moz-animation: panierFrames ease-out 1s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  
  -o-animation: panierFrames ease-out 1s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  
  -ms-animation: panierFrames ease-out 1s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}

@keyframes panierFrames{
  0% {
    transform:  rotate(0deg) ;
  }
  20% {
    transform:  rotate(10deg) ;
  }
  40% {
    transform:  rotate(-9deg) ;
  }
  60% {
    transform:  rotate(10deg) ;
  }
  80% {
    transform:  rotate(0deg) ;
  }
  100% {
    transform:  rotate(0deg) ;
  }
}

@-moz-keyframes panierFrames{
  0% {
    -moz-transform:  rotate(0deg) ;
  }
  20% {
    -moz-transform:  rotate(10deg) ;
  }
  40% {
    -moz-transform:  rotate(-9deg) ;
  }
  60% {
    -moz-transform:  rotate(10deg) ;
  }
  80% {
    -moz-transform:  rotate(0deg) ;
  }
  100% {
    -moz-transform:  rotate(0deg) ;
  }
}

@-webkit-keyframes panierFrames {
  0% {
    -webkit-transform:  rotate(0deg) ;
  }
  20% {
    -webkit-transform:  rotate(10deg) ;
  }
  40% {
    -webkit-transform:  rotate(-9deg) ;
  }
  60% {
    -webkit-transform:  rotate(10deg) ;
  }
  80% {
    -webkit-transform:  rotate(0deg) ;
  }
  100% {
    -webkit-transform:  rotate(0deg) ;
  }
}

@-o-keyframes panierFrames {
  0% {
    -o-transform:  rotate(0deg) ;
  }
  20% {
    -o-transform:  rotate(10deg) ;
  }
  40% {
    -o-transform:  rotate(-9deg) ;
  }
  60% {
    -o-transform:  rotate(10deg) ;
  }
  80% {
    -o-transform:  rotate(0deg) ;
  }
  100% {
    -o-transform:  rotate(0deg) ;
  }
}

@-ms-keyframes panierFrames {
  0% {
    -ms-transform:  rotate(0deg) ;
  }
  20% {
    -ms-transform:  rotate(10deg) ;
  }
  40% {
    -ms-transform:  rotate(-9deg) ;
  }
  60% {
    -ms-transform:  rotate(10deg) ;
  }
  80% {
    -ms-transform:  rotate(0deg) ;
  }
  100% {
    -ms-transform:  rotate(0deg) ;
  }
}


/* À P R O P O S */
.apropos--aside {
	position: absolute;
	top: 75px;
	right: 0px;
	line-height: 24px;
}

.apropos--grid {
	margin-top: 145px;
	overflow: hidden;
	
}

.apropos--grid p {
	line-height: 1.5;
}

.grid {
	width: 940px;
}

.grid--element {
	width: 218px;
	height: 218px;
	
	margin-right: 20px;
	margin-bottom: 20px;
	
	background: white;
	border: 1px solid #E6A42E;
	float: left;
	
	position: relative;
}

.grid--element__double {
	width: 458px;
}

.grid--element:last-child {
	margin-right: 0;
}

.apropos--grid .grid--element:nth-child(4n) {
	margin-right: 0;
}

.objectifs--grid .grid--element:nth-child(3) {
	margin-right: 0;
}

.strategie--grid .grid--element:nth-child(2) {
	margin-right: 0;
}

.apropos--grid .grid--element p:first-child {
	font-weight: 100;
	font-size: 18px;
	color: #111;

	margin: 0;
	margin-top: 60px;
	
	text-align: center;
	text-transform: uppercase;
	
	letter-spacing: 2px;
}

.apropos--grid .grid--element p:nth-child(2) {
	font-weight: 100;
	font-size: 39px;
	color: #ADADAD;
	
	margin: 0;
	
	font-family: "Brandon Grotesque", sans-serif;
	
	text-align: center;
}

.apropos--grid .grid--element p:nth-child(3) {
	font-weight: 100;
	font-size: 15px;
	color: #ADADAD;

	margin: 0;
	
	font-family: "Proxima Nova", sans-serif;
	
	text-align: center;
}




/* P R O D U C T I O N */
.production--element {
	margin-bottom: 150px;
	position: relative;
}

.production--element p {
	width: 420px;
}

.production--element img {
	position: absolute;
	top: 0;
	right: 0;
	
	opacity: 0;
}


.production--element__right {
	position: relative;
	left: 220px;
}
	
	
	





/* P R O D U I T S */
.listedeproduits {
	width: 940px;
}

.produits--filtres {
	width: 940px;
	border-bottom: 1px solid #E6A42E;
	padding-bottom: 20px ;
	margin-bottom: 20px;
}

.produits--filtres__list {
	margin-top: 55px;
}


.produits--filtres__element {
	display: inline;
	margin-right: 15px;
}

.produits--filtres__element-button {
	background: white;
	color: #ADADAD;
	border: 1px solid #ADADAD;
		
	width: 220px;
	padding: 6px 0px;

	
	position: relative;
	left: 0;
}

.produits--filtres__element-button:focus {
	outline: none;
}

.produits--filtres__element-button:hover {
	background: white;
	color: #111;
	border: 1px solid #111;
	transition: .7s ease-out;
}


.produits--filtres__element:nth-child(4n) {
	margin: 0px;
}

.produits--listedeproduits__element {
	width: 220px;
	height: 220px;
	border: 1px solid #ADADAD;
	margin-right: 17px;
	margin-bottom: 17px;
	position: relative;
	float: left;
}

.produits--listedeproduits__element:nth-child(4n) {
	margin: 0;
}

.produits--listedeproduits__element:hover {
	border: 1px solid #111;
	transition: .7s ease-out;
}






/* A C C U E I L */
.accueil {
	margin: 0;
}
	
.wrapper {
	width: 100%;
	height: 100%;
	position: relative;
}

.section--accueil {
	height: 100%;
	position: relative;

	overflow: hidden;

	background: #E6A42E;
	width: 100%;
	
	color: white;
}

.section--accueil h1 {
	color: white;
	font-size: 57px;
	margin-top: 70px;
	text-transform: uppercase;
	font-weight: 100;
	letter-spacing: 1px;
}

.section--accueil p {
	width: 437px;
	letter-spacing: .8px;
	font-size: 27px;
	font-weight: 100;
	line-height: 1.2;
}

.section--accueil .container {
	position: relative;
	padding-top: 150px;
	height: 600px;
/*	background: url(../_images/accueil-background.svg) right bottom no-repeat;*/
}

.section--accueil__container .button {
	background: white;
	color: #E6A42E;
	left: 0;
}

.section--accueil__container .button:hover {
	background: #E6A42E;
	color: white;
	border: 1px white solid;
	width: 218px;
	
	transition: .2s ease-out;
}


.section--accueil__arrow {
	z-index: 10;

	width: 100%;
	height: 100px;
	background: url(../_images/accueil-arrow.svg) center center no-repeat;
	
	position: absolute;
	bottom: 0;
	
	border: none;
	
	cursor: pointer;
}

.section--objectifs {
	background: white;
}

.section--strategie {
	background: #FAFAFA;
}

.section--produits {
	background: #E6A42E;
}

.section--produits h1 {
	color: white;
}

.section--produits .button {
	background: white;
	color: #E6A42E;
	
	position: relative;
	left: 720px;
	margin-top: 20px;

	border: 1px solid white;
	padding: 6px 0;

	width: 218px;
}

.section--produits .button:hover {
	background: #E6A42E;
	color: white;
	border: 1px white solid;
	
	width: 218px;
	transition: .2s ease-out;
}

.accueil-produits--element {
	width: 220px;
	height: 220px;
	border: 1px solid #E6A42E;
	background: white;
	margin-right: 17px;
	position: relative;
	float: left;
}

.accueil-produits--element:last-child {
	margin-right: 0;
}

.accueil-produits--element__double {
	width: 460px;
}


.section--produits .accueil-produits--element {
	border: 1px solid #FFF;
	background: white;
}

section .container {
	padding: 145px 0;
}

.blog--element {
	border: 1px solid #E6A42E; 
	padding: 15px 20px;
	margin-bottom: 20px;
	
	width: 660px;
	background: url(../_images/blog-arrow.svg) 650px center  no-repeat;
}

.blog--element:hover {
	border: 1px solid #111;
	transition: .2s ease-out;
	text-decoration: none;
}

.blog--element h3 {
	text-transform: uppercase;
	color: #111;
}

.blog--element p {
	margin: 0;
	padding-right: 120px;
	font-weight: 100;

	padding-bottom: 15px;
	
	color: #ADADAD;
}

.blog--element__p:hover {
	text-decoration: none;
}

/*Objectifs*/
.objectif--texte {
	position: absolute;
	bottom: 10px;
	text-align: center;
	width: 100%;
}

.objectif--texte__titre {
	font-size: 25px;
	color: #111;
	text-transform: uppercase;
	margin: 0;
}

.objectif--texte__suite, .strategie--text__suite {
	font-size: 18px;
	color: #ADADAD;
	line-height: 22px;
	margin: 0 auto;
	width: 90%;
	text-align: center;
	
	font-family: "Proxima Nova", sans-serif;
	font-weight: 100;
}

.objectif--texte__suite--double {
	width: 85%;
	margin: 0 auto;
}

.objectif-augmenter {
	background: url(../_images/objectifs/augmenter.svg) center 20px no-repeat;
}

.objectif-transformation {
	background: url(../_images/objectifs/transformation.svg) center 20px no-repeat;
}

.objectif-ameliorer {
	background: url(../_images/objectifs/ameliorer.svg) center 20px no-repeat;
}

.objectif-renforcement {
	background: url(../_images/objectifs/renforcement.svg) center 20px no-repeat;
}

.objectif-contribuer {
	background: url(../_images/objectifs/contribuer.svg) center 20px no-repeat;
}

.strategie--texte__titre {
	font-size: 25px;
	color: #111;
	text-transform: uppercase;
	margin: 0;
	text-align: center;
}

.strategie--texte__suite {
	color: #ADADAD;
	line-height: 22px;
	
	font-family: "Proxima Nova", sans-serif;
	font-weight: 100;
	
	margin: 0 auto;
	width: 90%;
	text-align: center;
}

.strategie--texte {
	position: absolute;
	top: 60px;
	text-align: center;
	width: 100%;
}



.strategie-decentraliser {
	width: 235px;
	margin: 0 auto;
}

.strategie-decentraliser, .strategie--texte__suite {
	margin-top: 5px;
}

.strategie-sensibiliser {
	top: 90px;
}

.strategie-former {
	top: 60px;
}

.strategie-nationale {
	top: 50px;
}

.strategie-femmes {
	top: 40px;
}











.image--element__double {
	width: 460px;
	height: 160px;
	border: none;
	padding: 0px;
	margin: 0;
	
	position: absolute;
	left: -0px;
	top: 0px;
}





/* ANIMATIONS */
@-webkit-keyframes SlideLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-40px);
    -ms-transform: translateX(-40px);
    transform: translateX(-40px);
  }

  50% {
    -webkit-transform: translateX(10px);
	-ms-transform: translateX(10px);
    transform: translateX(10px);
  }


  100% {
	 opacity: 1;
    -webkit-transform: translateX(0);
	-ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.SlideLeft {
  -webkit-animation-name: SlideLeft;
  -moz-animation-name: SlideLeft;
  -o-animation-name: SlideLeft;

  animation-name: SlideLeft;

  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes SlideUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    transform: translateY(-40px);
  }

  50% {
    -webkit-transform: translateY(10px);
	-ms-transform: translateY(10px);
    transform: translateY(10px);
  }


  100% {
	 opacity: 1;
    -webkit-transform: translateY(0);
	-ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.SlideUp {
  -webkit-animation-name: SlideUp;
  -moz-animation-name: SlideUp;
  -o-animation-name: SlideUp;
  animation-name: SlideUp;

  opacity: 0;

  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}








/* CONTACT */
.contact--aside {
	position: absolute;
	top: 75px;
	right: 0px;
	line-height: 24px;
}

.contact-weight {
	font-weight: 100;
}

.ailleurs--part {
	padding-bottom: 20px;
	position: relative;
}

.contact--element input, .contact--element textarea {
	padding: 9px 15px;
	border: #E6A42E 1px solid;
	border-radius: 0;
	width: 190px;
	color: #111;
	font-weight: 100;
	
	resize: none;
}

.contact--element input:focus, .contact--element textarea:focus, .pageproduit--aside__quantite:focus, .aside-div__panier--element__input:focus {
	outline: none;
	border: 1px solid #111;
}

.contact--form {
	width: 460px;
	position: relative;
}

.contact--form .button {
	margin-top: 20px;
}

#prenom {
	float: left;
}

#nom {
	float: right;
}

#mail {
	width: 428px;
	margin-top: 20px;
	clear: both;
}

#entreprise {
	float: left;
	margin-top: 20px;
}

#ville {
	float: right;
	margin-top: 20px;
}

#message {
	width: 428px;
	height: 120px;

	margin-top: 20px;
	clear: both;
}

label {
	display: none;
}




.listedeproduits-element {
	margin-top: 20px;
	margin-right: 20px;
	
	width: 218px;
	
	border: 1px solid #ADADAD;
}

.listedeproduits-element__double {
	width: 458px;
}

.listedeproduits-element a {
		font-weight: 100;
}

.listedeproduits-element p {
	margin-top: 0;
	padding-top: 20px;
}

.listedeproduits-element img {
	width: 218px;
}

.listedeproduits-element__double img {
	width: 458px;
}

.listedeproduits-element:hover {
	border: 1px solid #111;
	transition: .2s ease-out;
}

.listedeproduits-element:nth-child(3) {
	margin-right: 0;
}





@-webkit-keyframes accueilbrasg {
  0% {
    -webkit-transform:  translateY(0) ;
    -moz-transform:  translateY(0) ;
    -o-transform:  translateY(0) ;
    transform:  translateY(0) ;
  }

  20% {
    -webkit-transform:  translateY(-20px) ;
    -moz-transform:  translateY(-20px) ;
    -o-transform:  translateY(-20px) ;
    transform:  translateY(-20px) ;
  }
  
  30% {
    -webkit-transform:  translateY(0px) ;
    -moz-transform:  translateY(0px) ;
    -o-transform:  translateY(0px) ;
    transform:  translateY(0px) ;
  } 
  
  40% {
    -webkit-transform:  translateY(-20px) ;
    -moz-transform:  translateY(-20px) ;
    -o-transform:  translateY(-20px) ;
    transform:  translateY(-20px) ;
  }  
  
  50% {
    -webkit-transform:  translateY(0) ;
    -moz-transform:  translateY(0) ;
    -o-transform:  translateY(0) ;
    transform:  translateY(0) ;
  }
  100% {
    -webkit-transform:  translateY(0) ;
    -moz-transform:  translateY(0) ;
    -o-transform:  translateY(0) ;
    transform:  translateY(0) ;
  }
  
}

@-webkit-keyframes accueilbrasd {
  0% {
    -webkit-transform:  rotateZ(0) ;
    -moz-transform:  rotateZ(0) ;
    -o-transform:  rotateZ(0) ;
    transform:  rotateZ(0) ;
  }

  50% {
    -webkit-transform:  rotateZ(0) ;
    -moz-transform:  rotateZ(0) ;
    -o-transform:  rotateZ(0) ;
    transform:  rotateZ(0) ;
  }
  
  75% {
    -webkit-transform:  rotateZ(20deg) ;	  
    -moz-transform:  rotateZ(20deg) ;	  
    -o-transform:  rotateZ(20deg) ;	  
    transform:  rotateZ(20deg) ;	  
  }
  
  100% {
    -webkit-transform:  rotateZ(0) ;
    -moz-transform:  rotateZ(0) ;
    -o-transform:  rotateZ(0) ;
    transform:  rotateZ(0) ;
  }
}


.section--accueil__animation {
	position: absolute;
	bottom: 0;
	right: 0;
}

#bras_gauche {
	-webkit-animation: accueilbrasg ease 3s infinite;
	-webkit-animation-fill-mode:forwards;
	-webkit-animation-delay: .7s;

	-moz-animation: accueilbrasg ease 3s infinite;
	-moz-animation-fill-mode:forwards;
	-moz-animation-delay: .7s;

	-o-animation: accueilbrasg ease 3s infinite;
	-o-animation-fill-mode:forwards;
	-o-animation-delay: .7s;

	animation: accueilbrasg ease 3s infinite;
	animation-fill-mode:forwards;
	animation-delay: .7s;

}

#bras_droit {
	-webkit-animation: accueilbrasd ease 3s infinite;
	-webkit-transform-origin: 50% 50%;
	-webkit-animation-fill-mode:forwards; 
	-webkit-animation-delay: .7s;

	-moz-animation: accueilbrasd ease 3s infinite;
	-moz-transform-origin: 50% 50%;
	-moz-animation-fill-mode:forwards; 
	-moz-animation-delay: .7s;

	-o-animation: accueilbrasd ease 3s infinite;
	-o-transform-origin: 50% 50%;
	-o-animation-fill-mode:forwards; 
	-o-animation-delay: .7s;

	animation: accueilbrasd ease 3s infinite;
	transform-origin: 50% 50%;
	animation-fill-mode:forwards; 
	animation-delay: .7s;
}

.titre-partieun {
	font-family: "Brandon Grotesque", sans-serif;
	font-weight: 100;
	text-transform: uppercase;
}

.titre-partiedeux {
	font-family: "Brandon Grotesque", sans-serif;
	font-weight: 400;	
	text-transform: uppercase;
}

.titre-light {
	font-weight: 100;
	text-transform: uppercase;
}

.titre-bold {
	font-weight: 400;	
	text-transform: uppercase;
}

.credits--aside img {
	position: absolute;
	right: 0;
}


.styleguide--couleur {
	width: 220px;
	height: 220px;

	margin-right: 20px;
	float: left;
	position: relative;
}


.styleguide--couleur:last-child {
	margin-right: 0;
}

.styleguide--couleur p {
	color: white;
	text-align: center;
	
	position: relative;
	top: 80px;
}

.styleguide--couleur__orange {
	background: #E6A42E;
}

.styleguide--couleur__gris {
	background: #ADADAD;
}

.styleguide--couleur__grisclair {
	background: #FAFAFA;
}

.styleguide--couleur__noir {
	background: #111;
}

.styleguide--section {
	clear: both;
	margin: 80px 0;
	overflow: hidden;
}

.styleguide--section .button {
	margin-right: 20px;
	margin-top: 20px;
	border: 1px solid #E6A42E;
}

.styleguide--section .button:hover {
	margin-right: 20px;
	margin-top: 20px;
	
	background: white;
	color: #E6A42E;
	
	transition: .2s ease-out;
}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}