/*reseteo*/
* {
  margin: 0px;
  padding: 0px;
  color: #1f1f21;
  list-style: none;
  text-decoration: none;
  font-family: Arial, Helvetica, sans-serif; }

/*general*/
body {
  width: 100vw; }

a {
  color: #1f1f21;
  text-decoration: none; }

a:hover {
  color: inherit; }

.wpp {
  width: 8%;
  position: fixed;
  bottom: 2%;
  right: 2%;
  z-index: 2; }
  .wpp a img {
    width: 100%; }

/*nav*/
header {
  width: 100vw;
  background-color: #f6f6f5f6;
  padding-top: 30px;
  padding-bottom: 50px; }

.menu-logo {
  text-align: center;
  width: 100%; }
  .menu-logo a img {
    width: 20%; }

.second-line {
  width: 100%;
  margin-top: 30px; }
  .second-line .nav {
    font-weight: bold;
    text-transform: uppercase; }
    .second-line .nav ul {
      margin: 0 auto;
      padding: 0; }
      .second-line .nav ul li {
        display: inline-block;
        position: relative;
        margin-right: 10px; }
        .second-line .nav ul li a {
          font-size: 1em; }
        .second-line .nav ul li ul {
          display: none;
          position: absolute;
          background-color: #f6f6f5f6;
          z-index: 1;
          padding-left: 2px; }
          .second-line .nav ul li ul li {
            padding: 5px 0px; }

.nav ul li a:hover {
  color: #c7c7c7; }

.nav ul li:hover > ul {
  display: block; }

/*footer*/
footer {
  width: 100vw;
  background-color: #f6f6f5f6;
  padding: 30px; }
  footer img {
    width: 10%;
    margin-bottom: 10px; }
  footer p {
    font-size: 1em; }

/*contacto*/
.contacto-redes {
  width: 100%;
  margin-bottom: 30px; }
  .contacto-redes ul {
    text-align: center;
    padding: 0; }
    .contacto-redes ul li {
      display: inline-block;
      margin-left: 10px;
      width: 5%; }
      .contacto-redes ul li a img {
        width: 100%; }

.herosection {
  width: 100%; }

.main-section2 {
  background-color: #c8cfae;
  width: 100%;
  padding: 100px 0px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-evenly;
  align-content: center; }
  .main-section2 .article {
    width: 25%; }
    .main-section2 .article img {
      width: 100%; }
    .main-section2 .article .article-txt {
      background-color: #f6f6f5f6;
      padding: 25px 10px 10px 10px;
      box-shadow: 4px 2px 15px #1f1f21; }
      .main-section2 .article .article-txt h2 {
        color: #757373;
        font-weight: bold;
        font-size: 1.5em; }
      .main-section2 .article .article-txt p {
        font-size: 1em; }
      .main-section2 .article .article-txt a {
        margin-left: 90%; }
        .main-section2 .article .article-txt a img {
          width: 3%; }

.advertencia {
  width: 40%;
  text-align: center;
  margin-left: 30%;
  font-size: 0.9em;
  font-style: italic;
  margin-bottom: 30px; }

.main-section {
  width: 100%;
  padding-bottom: 30px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-row-gap: 25px;
  justify-items: center;
  align-items: center;
  justify-content: space-evenly;
  align-content: space-evenly; }
  .main-section .tarjeta-producto {
    width: 90%;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center; }
    .main-section .tarjeta-producto img {
      width: 98%; }
    .main-section .tarjeta-producto .title-producto {
      font-size: 1.5em;
      text-align: center;
      text-transform: uppercase;
      margin-top: 10px; }
    .main-section .tarjeta-producto .btn-producto {
      width: 90%;
      display: flex;
      flex-flow: row nowrap;
      justify-content: center; }
      .main-section .tarjeta-producto .btn-producto button {
        width: 40%;
        margin: 0px 10px; }
    .main-section .tarjeta-producto .info-modal p {
      margin-top: 5%;
      font-size: 1em; }
    .main-section .tarjeta-producto .info-modal .limited {
      color: red;
      text-transform: uppercase;
      display: none; }
    .main-section .tarjeta-producto .info-modal ul li {
      list-style-type: disc; }
    .main-section .tarjeta-producto .info-modal h2 {
      text-align: right; }

h1 {
  text-align: center;
  margin-top: 15px;
  margin-bottom: 30px;
  font-size: 1.8em;
  color: #757373; }

.main-productos {
  width: 100vw;
  display: flex;
  flex-flow: row nowrap;
  justify-items: center;
  align-items: center;
  justify-content: space-evenly;
  align-content: space-evenly; }
  .main-productos div {
    width: 30%; }
    .main-productos div a img {
      width: 100%; }
    .main-productos div p {
      font-size: 2.5vw;
      text-align: center;
      text-transform: uppercase;
      margin-top: 15px; }

.main-productos div a img:hover {
  transform: scale(1.1); }

@media only screen and (max-width: 800px) {
  .main-section2 {
    flex-flow: column nowrap;
    justify-content: center;
    align-content: center;
    padding-left: 10%; }
    .main-section2 .article {
      width: 90%;
      margin-bottom: 30px; }
  .main-productos {
    flex-flow: column nowrap;
    justify-content: center;
    align-content: center; }
    .main-productos div {
      width: 60%; }
  .main-section {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-content: center;
    justify-items: center;
    align-items: center; }
  .wpp {
    width: 10%; } }

@media only screen and (max-width: 600px) {
  .main-section1 {
    margin-top: 30px; }
  .contacto-redes ul li {
    width: 10%; }
  .wpp {
    width: 15%; } }