/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

@font-face {
  font-family: "Avernir";

  src: url("../data/fonts/Avenir-Medium/AvenirLTStd-Medium.eot");
  src: url("../data/fonts/Avenir-Medium/AvenirLTStd-Medium.eot?#iefix") format("embedded-opentype"),
    url("../data/fonts/Avenir-Medium/AvenirLTStd-Medium.woff") format("woff"),
    url("../data/fonts/Avenir-Medium/AvenirLTStd-Medium.ttf") format("truetype"),
    url("../data/fonts/Avenir-Medium/AvenirLTStd-Medium.svg#svgFontName") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "AvernirLight";

  src: url("../data/fonts/Avenir-Light/AvenirLTStd-Light.eot");
  src: url("../data/fonts/Avenir-Light/AvenirLTStd-Light.eot?#iefix") format("embedded-opentype"),
    url("../data/fonts/Avenir-Light/AvenirLTStd-Light.woff") format("woff"),
    url("../data/fonts/Avenir-Light/AvenirLTStd-Light.ttf") format("truetype"),
    url("../data/fonts/Avenir-Light/AvenirLTStd-Light.svg#svgFontName") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "AvernirRoman";

  src: url("../data/fonts/Avenir-Roman/AvenirLTStd-Roman.eot");
  src: url("../data/fonts/Avenir-Roman/AvenirLTStd-Roman.eot?#iefix") format("embedded-opentype"),
    url("../data/fonts/Avenir-Roman/AvenirLTStd-Roman.woff") format("woff"),
    url("../data/fonts/Avenir-Roman/AvenirLTStd-Roman.ttf") format("truetype"),
    url("../data/fonts/Avenir-Roman/AvenirLTStd-Roman.svg#svgFontName") format("svg");
  font-style: normal;
  font-weight: normal;
}

html,
body {
  width: 100%;
  height: 100%;
  background-color: #9b2e49;
}

* {
  -webkit-transition-duration: 0.25s;
  -o-transition-duration: 0.25s;
  transition-duration: 0.25s;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  margin: 0;
  border-style: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;

  background-color: #ffffff;
  background-repeat: no-repeat;
  -webkit-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
  background-size: cover;
  background-position: center center;
  background-image: url("./../data/img/textureBackground.png");
}

.mainContent {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;




}

.mainContent>div {
  width: 85%;
  margin-top: 50px;
  height: 200px;



  display: -webkit-box;



  display: -ms-flexbox;



  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: distribute;
  justify-content: space-around;

}

.mainContent h2 {
  font-family: "Avernir";
  font-weight: normal;
  color: #ada8a8;
  border-bottom: 2.3px solid #ada8a8;
}

.products {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;


  -ms-flex-pack: distribute;


  justify-content: space-around;

}

.product {

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 30px;
}

.product img {
  width: 100px;
  cursor: pointer;
}

.productDescription {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-family: "Avernir";
  font-weight: normal;


}

.productDescription p {
  font-family: "Avernir";
  font-weight: bolder;

}


@media (max-width: 800px) {

  .mainContent>div {

    width: 100%;
  }

  .mainContent h2 {
    font-size: 20px;
  }



  .product {

    margin-right: 0px;
    width: 300px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .productDescription {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-left: 0;
    margin-top: 20px;
    text-align: center;
    font-size: 14px;
  }

  .productDescription p {
    font-family: "Avernir";
    font-weight: bolder;

  }

  .product img {
    width: 70px;

  }

}