@font-face {
  font-family: "ERASLGHT";
  src: url("../fonts/ERASLGHT-webfont.eot");
  src: url("../fonts/ERASLGHT-webfont.eot?#iefix") format("embedded-opentype"),
    url("../fonts/ERASLGHT-webfont.woff2") format("woff2"),
    url("../fonts/ERASLGHT-webfont.woff") format("woff"),
    url("../fonts/ERASLGHT-webfont.ttf") format("truetype"),
    url("../fonts/ERASLGHT-webfont.svg#webfontregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "FRADMCN";
  src: url("../fonts/FRADMCN.eot");
  src: url("../fonts/FRADMCN.eot?#iefix") format("embedded-opentype"),
    url("../fonts/FRADMCN.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "FRAMDCN";
  src: url("../fonts/FRAMDCN.eot");
  src: url("../fonts/FRAMDCN.eot?#iefix") format("embedded-opentype"),
    url("../fonts/FRAMDCN.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
html {
  background: #414141;
}
body {
  font-family: "ERASLGHT";
  background: black;
  min-width: 1200px;
}
a:link,
a:visited,
a:hover,
a:active {
  outline: none;
}
.clearfix:after {
  content: " ";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.container {
  width: 1200px;
  margin: 0 auto;
}
.on_top {
  display: block;
  position: relative;
  z-index: 200;
}
div.hundret_px {
  display: block;
  width: 900px;
  margin: 30px auto;
}
h2 {
  font-size: 2.5em;
}
header {
  width: 100%;
  background: #000000;
  background: -moz-linear-gradient(
    top,
    #000000 0%,
    #000000 50%,
    #323336 51%,
    #323336 100%
  );
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%, #000000),
    color-stop(50%, #000000),
    color-stop(51%, #323336),
    color-stop(100%, #323336)
  );
  background: -webkit-linear-gradient(
    top,
    #000000 0%,
    #000000 50%,
    #323336 51%,
    #323336 100%
  );
  background: -o-linear-gradient(
    top,
    #000000 0%,
    #000000 50%,
    #323336 51%,
    #323336 100%
  );
  background: -ms-linear-gradient(
    top,
    #000000 0%,
    #000000 50%,
    #323336 51%,
    #323336 100%
  );
  background: linear-gradient(
    to bottom,
    #000000 0%,
    #000000 50%,
    #323336 51%,
    #323336 100%
  );
  position: relative;
  padding-bottom: 1px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#323336', GradientType=0);
}
#navi_section {
  position: relative;
  min-width: 75em;
}
#logo_section {
  height: 100%;
  width: 271px;
  float: left;
  padding: 1px;
}
#logo_section img {
  font-size: 1.25em;
  line-height: 3.95em;
}
#menu_section {
  margin-left: 30%;
  margin-right: 0px;
  background: none;
  background: -moz-linear-gradient(
    left,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.67) 20%,
    rgba(255, 255, 255, 0.74) 30%,
    rgba(255, 255, 255, 0.82) 41%,
    rgba(255, 255, 255, 0.83) 42%,
    rgba(255, 255, 255, 0.9) 65%,
    rgba(255, 255, 255, 1) 100%
  );
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    color-stop(0%, rgba(255, 255, 255, 0)),
    color-stop(20%, rgba(255, 255, 255, 0.67)),
    color-stop(30%, rgba(255, 255, 255, 0.74)),
    color-stop(41%, rgba(255, 255, 255, 0.82)),
    color-stop(42%, rgba(255, 255, 255, 0.83)),
    color-stop(65%, rgba(255, 255, 255, 0.9)),
    color-stop(100%, rgba(255, 255, 255, 1))
  );
  background: -webkit-linear-gradient(
    left,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.67) 20%,
    rgba(255, 255, 255, 0.74) 30%,
    rgba(255, 255, 255, 0.82) 41%,
    rgba(255, 255, 255, 0.83) 42%,
    rgba(255, 255, 255, 0.9) 65%,
    rgba(255, 255, 255, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.67) 20%,
    rgba(255, 255, 255, 0.74) 30%,
    rgba(255, 255, 255, 0.82) 41%,
    rgba(255, 255, 255, 0.83) 42%,
    rgba(255, 255, 255, 0.9) 65%,
    rgba(255, 255, 255, 1) 100%
  );
  background: -ms-linear-gradient(
    left,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.67) 20%,
    rgba(255, 255, 255, 0.74) 30%,
    rgba(255, 255, 255, 0.82) 41%,
    rgba(255, 255, 255, 0.83) 42%,
    rgba(255, 255, 255, 0.9) 65%,
    rgba(255, 255, 255, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.67) 20%,
    rgba(255, 255, 255, 0.74) 30%,
    rgba(255, 255, 255, 0.82) 41%,
    rgba(255, 255, 255, 0.83) 42%,
    rgba(255, 255, 255, 0.9) 65%,
    rgba(255, 255, 255, 1) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=1);
}
ul.main_navi {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  text-align: right;
}
ul.main_navi li {
  display: block;
  float: left;
  text-align: right;
  border-left: solid 1px silver;
  background: white;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
ul.main_navi a {
  display: block;
  position: relative;
  z-index: 200;
  text-decoration: none;
  color: black;
  padding: 0px 10px;
  font-size: 1.25em;
  line-height: 3.95em;
  font-weight: bold;
}
ul.main_navi li:hover {
  background: #1d1e23;
}
ul.main_navi li:hover a {
  color: white;
}
#menu_section.scroll_navi {
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  margin: 0;
  z-index: 1000;
}
#menu_section.scroll_navi a {
  line-height: 1.3em;
}
#sub_navi {
  display: none;
  position: absolute;
  z-index: 9999;
  background: white;
}
#sub_navi:hover {
  display: block;
}
#sub_navi li {
  clear: both;
  font-size: 0.8em;
  width: 100%;
  text-align: left;
  border: none;
}
#sub_navi li a {
  line-height: 1.1em;
  display: block;
  color: black;
}
#sub_navi li a:hover {
  color: white;
}
li:hover #sub_navi {
  display: block;
}
#baner_section {
  position: relative;
  top: -40px;
  height: 500px;
  display: flex;
}

.banner-div1 {
  height: 550px;
}

.banner-div2 {
  height: 550px;
}

@media screen and (max-width: 2200px) {
  .banner-div1 {
    height: 450px;
    margin-top: 20px;
  }
  .banner-div2 {
    height: 450px;
    margin-top: 20px;
  }

  #baner_section {
    height: 450px;
  }
}

@media screen and (max-width: 1650px) {
  .banner-div1 {
    height: 400px;
    margin-top: 20px;
  }
  .banner-div2 {
    height: 400px;
    margin-top: 20px;
  }

  #baner_section {
    height: 380px;
  }
}

@media screen and (max-width: 1420px) {
  .banner-div1 {
    height: 350px;
    margin-top: 20px;
  }
  .banner-div2 {
    height: 350px;
    margin-top: 20px;
  }

  #baner_section {
    height: 325px;
  }
}

@media screen and (max-width: 1220px) {
  .banner-div1 {
    height: 340px;
    margin-top: 20px;
  }
  .banner-div2 {
    height: 340px;
    margin-top: 20px;
  }
  #horaires {
    padding-left: 30px;
  }
}

.banner-image {
  height: 100%;
}

#horaires {
  padding-top: 75px;
  color: white;
  font-size: 1em;
  min-width: 300px;
}
#horaires h3 {
  text-decoration: underline;
  margin-bottom: 2px;
}
#horaires img {
  margin-top: 3px;
  /*width: 22px;
	height: 18px;*/
  margin-bottom: -4px;
  margin-right: 5px;
}
#horaires p {
  margin-bottom: 3px;
}
#horaires div {
  margin-top: 15px;
}
div.baner_caption {
  display: block;
  color: white;
  position: absolute;
  top: 35%;
  left: 85%;
  right: 1%;
  font-family: "FRADMCN";
  line-height: 1.2em;
}
#main_content {
  background: #323436;
  border-top: 1px solid grey;
  margin-top: 40px;
}
#produkts {
  position: relative;
  top: -80px;
}
#produkts figure {
  box-sizing: border-box;
  float: left;
  width: 290px;
  height: 200px;
  margin: 0 5px;
  border: 1px solid white;
  overflow: hidden;
  position: relative;
  background: white;
}
#produkts figure a {
  text-decoration: none;
}
#produkts img {
  width: 100%;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 1.5s;
  -moz-transition-duration: 1.5s;
  -o-transition-duration: 1.5s;
  transition-duration: 1.5s;
}
#produkts figure:hover img {
  width: 110%;
  height: 110%;
}
#produkts figure p {
  font-family: "FRADMCN";
  display: block;
  width: 91%;
  background: #444;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0px;
  color: white;
  margin-top: 155px;
  padding: 5%;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 1.5s;
  -moz-transition-duration: 1.5s;
  -o-transition-duration: 1.5s;
  transition-duration: 1.5s;
}
#produkts figure:hover p {
  margin-top: 0px;
  background: #c64545;
  background: rgba(255, 0, 0, 0.7);
}
#nos_activites {
  background: #323436;
}
#nos_activites figure {
  float: right;
  padding-top: 25px;
  padding-right: 25px;
  padding-left: 25px;
  padding-bottom: 40px;
}
#nos_activites h2 {
  clear: left;
  text-align: center;
  color: #fff;
  padding-top: 25px;
  padding-bottom: 40px;
}
#nos_activites h2 span {
  background: black;
  padding: 2px;
}
#nos_activites p,
#nos_activites h3 {
  padding-bottom: 40px;
  font-family: "FRAMDCN";
  padding-left: 25px;
  font-size: 1.15em;
  line-height: 1.2em;
  letter-spacing: 1px;
  color: #9d9d9d;
}
#nos_activites h3 {
  padding-bottom: 2px;
  font-weight: bold;
}
#nos_activites p span,
div.text_full p span {
  color: #5c5c5c;
}
div.text_full {
  clear: both;
  width: 1170px;
  padding: 15px;
  padding-top: 40px;
  background: #323436 url(../img/black_sep_line.png) center top no-repeat;
  font-family: "FRAMDCN";
  font-size: 1.15em;
  line-height: 1.2em;
  letter-spacing: 1px;
  color: #9d9d9d;
  text-align: center;
}
div.text_full p {
  padding-bottom: 20px;
}
div.text_full img {
  padding: 15px;
}
footer {
  position: relative;
  background: #414141;
}
div.h2_background {
  background: #2a2a2a;
  min-width: 1200px;
}
footer h2 {
  color: #fff;
  padding-left: 25px;
  padding-top: 5px;
  padding-bottom: 5px;
}
footer ul {
  padding: 25px;
}
footer a {
  font-size: 1.5em;
  color: white;
  text-decoration: none;
  line-height: 1.2em;
}
#footer {
  position: relative;
}
#footer div {
  font-size: 1.4em;
  position: absolute;
  top: 25px;
  right: 25px;
  color: white;
}
#footer div h3 {
  font-weight: bold;
}
footer p:last-child {
  margin-top: 1em;
}
.barcode_section {
  position: absolute;
  right: 10px;
  bottom: 10px;
}
.barcode_section > img {
  height: 15px !important;
  width: auto !important;
}
