/* General */

html {
  box-sizing: border-box;
  font-size: 62.5%;
  /** Reset para REMS - 62.5% = 10px de 16px **/
}

:root {
    --pink: #e10185;
}

#nyx body
{
    font-family: "futura-book", Helvetica, Arial, sans-serif;
    font-weight: normal;
}

@font-face
{
    font-family: 'futura-book';
    font-weight: normal;
    font-style: normal;
    src:url("https://minisitios.ripley.cl/minisitios/belleza/nyx/assets2/fonts/Futura book.ttf");
}

@font-face
{
    font-family: 'futura-bold';
    font-weight: bolder;
    font-style: normal;
    src:url("https://minisitios.ripley.cl/minisitios/belleza/nyx/assets2/fonts/futura bold.ttf");
}

@font-face
{
    font-family: 'futura-medium';
    font-weight: 600;
    font-style: normal;
    src:url("https://minisitios.ripley.cl/minisitios/belleza/nyx/assets2/fonts/futura medium.ttf");
}

/* Texto */

h1,h2,h3,h4,h5,h6,p
{
    padding: 0;
    margin: 0;
}

h1 {
    font-size: 3.8rem !important;;
}
h2 {
    font-size: 3.4rem !important;;
}
h3 {
    font-size: 3rem !important;;
}
h4 {
    font-size: 2.6rem !important;;
}

h5{
    font-size: 2rem !important;;
}

h6{
    font-size: 1.3rem !important;
}

a{
  text-decoration: none;
  color: var(--black);
}

a:hover{
  color: var(--black);
}

.font-bold{
  font-weight: bolder;
}

.mayus{
  text-transform: uppercase;
}

.white {
  color: white;
}

/* background color */

.f-width{
  width: 100%;
}

/* background color */

.background-black{
  background-color: black;
}


/* Botones */

.btn-prm{
  text-transform: uppercase;
  letter-spacing: .01rem;

  width: 60%;

  text-align: center;
  font-size: 3rem;
  font-weight: 800;

  padding: 1rem 4rem;
  border: 0;
  margin: 2rem 0rem;

  text-decoration: none;
  color: white;
  background-color: var(--pink);

  transition: .3s ease;
}

.btn-prm:hover{
  color: white;
  background-color: black;
}

/* card product */

.owl-carousel-snd{
   width: 100%;
   padding: 0rem 1rem;
}

.card-carousel{
  text-align: center;
  padding: 1rem:
}

.carousel-image{
  background-color: white;
  justify-content: center;
}

.card-carousel a{
  text-decoration: none;
}

.card-carousel h4{
  color: var(--blue);
}

.card-carousel p{
  color: grey;
  font-size: 1.7rem;
  font-weight: 200;
}


.card-carousel span{
  color: var(--black);
  font-size: 2.5rem;
  font-weight: bold;
}

/* images size */

#logo-nyx{
  width: 20rem;
}

.img-main{
  width: 35rem;
}

.img-mini-logo{
  height: 5rem;
  margin: 1rem 1rem;
}

.img-types{
  width: 20rem;
}

.carousel-image{
  margin: 2rem ;
  padding: 2rem;
  text-align: center;
  width: 20rem;
  height: 20rem;
}

.carousel-image img{
  width: 15rem;
  height: 15rem;
}



/* Responsive */

@media (min-width: 992px){

  .flex-align{
    display: flex;
    align-items: center;
  }

  .card-carousel{
    text-align: center;
    padding: 3rem:
  }


}


@media (max-width: 992px){

  .carousel-image{
    width: 20rem;
    height: 20rem;
  }

  .carousel-image img{
    width: 17rem;
    height: 17rem;
  }

  .text-end{
    text-align: justify !important;
    text-align-last: center !important;
  }

/*  body{
    padding: 0 3rem;
  }*/

  h1 {
      font-size: 1.8rem !important;;
  }
  h2 {
      font-size: 2.4rem !important;;
  }
  h3 {
      font-size: 2rem !important;;
  }
  h4 {
      font-size: 1.6rem !important;;
  }

  h5{
      font-size: 1.2rem !important;
  }

  h6{
      font-size: 1rem !important;
  }

  .card-carousel p{
    font-size: 1rem !important;
  }

  .card-carousel span{
    font-size: 1.5rem;
  }

  .img-main{
    width: 20rem;
  }

  .img-types{
    width: 10rem;
  }

  .btn-prm{
    font-size: 2rem;
    padding: 1rem 3rem;
    width: 70%;
  }

}


@media (max-width: 554px){

  .btn-prm{
    font-size: 1rem;
    padding: 1rem 3rem;
    width: 90%;
  }

  .text-end,.text-start{
    text-align: center !important;
    text-align-last: center !important;
  }


}