/* 
* Estilos generales
* ------------------
*/

a {
  color: inherit;
  text-decoration: none;
}

body {
  overflow-x: hidden;
}

.picture img {
  width: 100%;
}

p::selection,
h1::selection,
h2::selection,
h3::selection,
span::selection,
strong::selection {
  background-color: #cec3ac;
}

.container {
  max-width: 1440px;
}

.padding__xl {
  padding: 120px 0;
}

.padding__lg {
  padding: 80px 0;
}

.padding__md {
  padding: 60px 0;
}

/* 
* Tamaños de fuentes
* -------------------
*/

h2 {
  font-family: 'NewYork-Regular';
  font-size: 500%;
  color: rgba(206, 195, 172, 1);
  font-weight: 400;
}

.font__xl {
  font-size: 312.5%; /* 50px */
  letter-spacing: 5px;
}

.font__lg {
  font-size: 150%; /* 24px */
}

.font__md {
  font-size: 137.5%; /* 22px */
}

.font__sm {
  font-size: 125%; /* 20px */
}

.font__xs {
  font-size: 112.5%; /* 18px */
}

.font__xxs {
  font-size: 70%; /* 16px */
}

/* 
* Fuentes
* -------------------
*/

.bold {
  font-family: 'HelveticaNeue-Bold';
}

.light {
  font-family: 'HelveticaNeue-Light';
}

.medium {
  font-family: 'HelveticaNeue-Medium';
}

.regular {
  font-family: 'HelveticaNeue-Regular';
}

.newyork {
  font-family: 'NewYork-Regular';
}

/* 
* Colores
* -------------------
*/

.white__color {
  color: #ffffff;
}

.black__color {
  color: #000000;
}

.primary__color {
  color: #cec3ac;
}

/* 
* Tamaños Responsive
* -------------------
*/

@media (width <= 992px) {
  h2 {
    font-size: 300%;
  }
  .padding__xl,
  .padding__lg {
    padding: 36px 0;
  }
  .font__xl {
    font-size: 200.5%; /* 50px */
  }

  .font__lg {
    font-size: 110%;
  }
  .font__xs {
    font-size: 100%;
  }

  .font__md {
    font-size: 90%;
  }
  .font__sm {
    font-size: 90%;
  }
}

@media (width <= 768px) {
  h2 {
    font-size: 180%;
  }
}

@media (width <= 480px) {
}