@charset "UTF-8";
.navicon-button {
  display: inline-block;
  position: relative;
  padding: 15px 0px;
  
  -webkit-transition: 0.25s;
  -moz-transition: 0.25s;
  -ms-transition: 0.25s;
  -o-transition: 0.25s;
  transition: 0.25s;
  
  cursor: pointer;
  user-select: none;
  opacity: 1;
}

.navicon-button .navicon:before, .navicon-button .navicon:after {
  -webkit-transition: 0.25s;
  -moz-transition: 0.25s;
  -ms-transition: 0.25s;
  -o-transition: 0.25s;
  transition: 0.25s;
}

/*
.navicon-button:hover {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  opacity: 1;
}
.navicon-button:hover .navicon:before, .navicon-button:hover .navicon:after {
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.navicon-button:hover .navicon:before {
  top: 15px;
}
.navicon-button:hover .navicon:after {
  top: -15px;
}
*/

.navicon {/*barre centrale*/
  position: relative;
  width: 33px;
  height: 4px;
  background: #96bf2a;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.navicon:before, .navicon:after {/*autre barre*/
  display: block;
  content: "";
  width: 33px;
  height: 4px;
  background: #96bf2a;
  position: absolute;
  -webkit-transition: 0.5s 0.25s;
  -moz-transition: 0.5s 0.25s;
  -ms-transition: 0.5s 0.25s;
  -o-transition: 0.5s 0.25s;
  transition: 0.5s 0.25s;
}
.navicon:before {
  top: 11px;
}
.navicon:after {
  top: -11px;
}

/*
.open:not(.steps) .navicon:before,
.open:not(.steps) .navicon:after {
  top: 0 !important;
}
*/

.open .navicon, .open .navicon:before, .open .navicon:after {
  background:#68736c;
}

/*
.open .navicon:before,
.open .navicon:after {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
*/

/* Minus */
.open {
  /*
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
  */
}

.open:hover{
  /*
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -ms-transform: scale(1.3);
  -o-transform: scale(1.3);
  transform: scale(1.3);
  */
}

/* Arrows */
.open.larr .navicon:before, .open.larr .navicon:after,
.open.rarr .navicon:before,
.open.rarr .navicon:after,
.open.uarr .navicon:before,
.open.uarr .navicon:after {
  width: 1.5rem;
}
.open.larr .navicon:before,
.open.rarr .navicon:before,
.open.uarr .navicon:before {
  -webkit-transform: rotate(35deg);
  -moz-transform: rotate(35deg);
  -ms-transform: rotate(35deg);
  -o-transform: rotate(35deg);
  transform: rotate(35deg);
  
  -webkit-transform-origin: left top;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -o-transform-origin: left top;
  transform-origin: left top;
}
.open.larr .navicon:after,
.open.rarr .navicon:after,
.open.uarr .navicon:after {
  -webkit-transform: rotate(-35deg);
  -moz-transform: rotate(-35deg);
  -ms-transform: rotate(-35deg);
  -o-transform: rotate(-35deg);
  transform: rotate(-35deg);
  
  -webkit-transform-origin: left bottom;
  -moz-transform-origin: left bottom;
  -ms-transform-origin: left bottom;
  -o-transform-origin: left bottom;
  transform-origin: left bottom;
}

.open.uarr {
  -webkit-transform: scale(0.75) rotate(90deg);
  -moz-transform: scale(0.75) rotate(90deg);
  -ms-transform: scale(0.75) rotate(90deg);
  -o-transform: scale(0.75) rotate(90deg);
  transform: scale(0.75) rotate(90deg);
}

/* Arrows */
.open.rarr .navicon:before {
  -webkit-transform: translate3d(1em, 0, 0) rotate(-35deg);
  -moz-transform: translate3d(1em, 0, 0) rotate(-35deg);
  -ms-transform: translate3d(1em, 0, 0) rotate(-35deg);
  -o-transform: translate3d(1em, 0, 0) rotate(-35deg);
  transform: translate3d(1em, 0, 0) rotate(-35deg);
  
  -webkit-transform-origin: right top;
  -moz-transform-origin: right top;
  -ms-transform-origin: right top;
  -o-transform-origin: right top;
  transform-origin: right top;
}
.open.rarr .navicon:after {
  -webkit-transform: translate3d(1em, 0, 0) rotate(35deg);
  -moz-transform: translate3d(1em, 0, 0) rotate(35deg);
  -ms-transform: translate3d(1em, 0, 0) rotate(35deg);
  -o-transform: translate3d(1em, 0, 0) rotate(35deg);
  transform: translate3d(1em, 0, 0) rotate(35deg);
  
  -webkit-transform-origin: right bottom;
  -moz-transform-origin: right bottom;
  -ms-transform-origin: right bottom;
  -o-transform-origin: right bottom;
  transform-origin: right bottom;
}

/* × and + */
.open.plus .navicon,
.open.x .navicon {
  background: transparent;
}
.open.plus .navicon:before,
.open.x .navicon:before {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  background: #000;
}
.open.plus .navicon:after,
.open.x .navicon:after {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #000;
}



.open_blanc.plus .navicon:before,
.open_blanc.x .navicon:before {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  background: #FFF;
}
.open_blanc.plus .navicon:after,
.open_blanc.x .navicon:after {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #FFF;
}



.open.plus {
  -webkit-transform: scale(0.75) rotate(45deg);
  -moz-transform: scale(0.75) rotate(45deg);
  -ms-transform: scale(0.75) rotate(45deg);
  -o-transform: scale(0.75) rotate(45deg);
  transform: scale(0.75) rotate(45deg);
}


@media (min-width: 1900px){
	.navicon {/*barre centrale*/
	  width: 35px;
	  height: 4px;
	}
	.navicon:before, .navicon:after {/*autre barre*/
	  width: 35px;
	  height: 4px;
	}
	
	.navicon:before {
	  top: .700rem;
	}
	.navicon:after {
	  top: -.700rem;
	}
	
	.navicon-button:hover .navicon:before {
	  top: .860rem;
	}
	.navicon-button:hover .navicon:after {
	  top: -.860rem;
	}
}
