/*global*/
* {
  margin: 0px; }

* {
  padding: 0px; }

* {
  box-sizing: border-box; }

* {
  overflow-x: hidden; }

* {
  font-family: 'Varta';
  font-style: normal; }

/* VARIABLES */
/* GRAL */
a:link, a:visited, a:active {
  text-decoration: none; }

ul {
  list-style: none; }

/* NAV */
.navbar {
  text-align: end; }
  .navbar .nav-logo {
    height: 64px;
    margin-left: 15px; }

/* FOOTER */
footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  background-color: #FFD5D8; }
  footer .footer-div-redes {
    padding: 10px; }
    footer .footer-div-redes h2 {
      color: #CE3262;
      font-size: 20px;
      height: 30px; }
    footer .footer-div-redes img {
      height: 26px;
      margin: 5px 10px; }
  footer .footer-div-contacto p {
    color: #CE3262;
    margin: 10px; }
  footer .footer-div-mapa {
    display: none; }
  footer .footer-div-wapp img {
    position: fixed;
    bottom: 20px;
    right: 20px;
    height: 70px;
    width: 70px; }

/* INICIO */
.home-main-section {
  height: 300px;
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("../IMG/cosmetologist-cleaning-face-woman-beauty-salon.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover; }
  .home-main-section .home-main-section-txt {
    font-style: normal;
    font-weight: normal;
    font-size: 25px;
    line-height: 36px;
    text-align: center;
    color: rgba(255, 255, 255, 0.85);
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); }

.home-main-section2 {
  background-color: #FFD5D8; }
  .home-main-section2 .home-main-div-nosotras {
    height: 90px;
    color: #CE3262;
    padding-top: 20px;
    padding-left: 20px; }
    .home-main-section2 .home-main-div-nosotras p {
      font-weight: 300;
      font-size: 12px;
      line-height: 17px;
      margin-bottom: 0px; }
    .home-main-section2 .home-main-div-nosotras h4 {
      font-size: 18px;
      line-height: 26px;
      color: #A5323C;
      margin-bottom: 0px; }
    .home-main-section2 .home-main-div-nosotras img {
      display: none; }
  .home-main-section2 .home-main-div-parrafo {
    color: #CE3262;
    text-align: left;
    margin: 1px 20px;
    font-size: 14px;
    line-height: 20px; }

.home-main-section3 {
  background-color: #CE3262;
  margin: 20px;
  color: white;
  text-align: center;
  height: 154px;
  padding: 20px; }
  .home-main-section3 h3 {
    font-size: 18px;
    height: 50px; }
  .home-main-section3 button {
    background-color: #FFD5D8;
    color: #CE3262;
    font-size: 15px;
    height: 29px;
    width: 159px;
    text-align: center;
    padding-top: 4px;
    margin-top: 10px; }

.home-main-section5 {
  display: none; }

/* TRATAMIENTOS */
.tratam-main-section {
  height: 270px;
  width: 100%;
  background-image: url("../IMG/attractive-woman-getting-face-beauty-procedures-in-spa-salon.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center; }
  .tratam-main-section .tratam-main-section-txt {
    font-size: 25px;
    line-height: 36px;
    text-align: center;
    color: rgba(255, 255, 255, 0.85);
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); }

.tratam-main-section2 {
  background-color: white;
  color: #CE3262;
  text-align: center;
  height: 154px;
  padding: 30px; }
  .tratam-main-section2 h3 {
    font-size: 18px;
    height: 50px; }
  .tratam-main-section2 button {
    background-color: #CE3262;
    color: white;
    font-size: 15px;
    height: 29px;
    width: 159px;
    text-align: center;
    padding-top: 4px;
    margin-top: 5px; }

.tratam-main-section3 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax 360px, 1fr); }
  .tratam-main-section3 .tratam-main-section3-div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #F18DA5;
    color: white;
    transition: transform 0.3s ease-in-out;
    margin: 15px 15px;
    padding: 20px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); }
    .tratam-main-section3 .tratam-main-section3-div .texto h4 {
      font-size: 18px;
      font-weight: bold;
      text-align: center;
      height: 25px; }
    .tratam-main-section3 .tratam-main-section3-div .texto ul {
      font-size: 15px;
      text-align: center; }
    .tratam-main-section3 .tratam-main-section3-div .imagen img {
      width: 159px;
      height: 122px; }
  .tratam-main-section3 .tratam-main-section3-div:hover {
    filter: opacity 0.9;
    transform: scale(1.01); }

.button {
  text-align: center;
  margin: 20px; }
  .button .btn-sm {
    background-color: #CE3262;
    color: white;
    border-color: #CE3262; }

/* INFORMACION */
.info-main-section {
  background-color: white;
  color: #CE3262;
  text-align: center;
  height: 180px;
  padding: 20px; }
  .info-main-section h3 {
    padding: 5px; }
  .info-main-section h4 {
    font-size: 18px;
    height: 50px; }
  .info-main-section button {
    background-color: #CE3262;
    color: white;
    font-size: 15px;
    height: 29px;
    width: 159px;
    text-align: center;
    padding-top: 4px; }

.info-main-section2 .info-main-section2-cards {
  background-color: #F18DA5;
  color: white;
  transition: transform 0.3s ease-in-out;
  margin: 15px 15px;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); }
  .info-main-section2 .info-main-section2-cards .parrafo {
    padding: 20px 20px; }
    .info-main-section2 .info-main-section2-cards .parrafo h4 {
      font-size: 18px;
      font-weight: bold;
      text-align: center;
      height: 25px; }
    .info-main-section2 .info-main-section2-cards .parrafo p {
      font-size: 14px;
      text-align: center; }
    .info-main-section2 .info-main-section2-cards .parrafo ul {
      font-size: 14px;
      text-align: center; }
  .info-main-section2 .info-main-section2-cards .img img {
    width: 100%;
    height: 180px;
    object-fit: cover; }

.info-main-section2 .info-main-section2-cards:hover {
  filter: opacity 0.9;
  transform: scale(1.01); }

/* MEDIA QUERIES */
@media only screen and (min-width: 900px) {
  .navbar .nav-logo {
    height: 112px; }
  footer .footer-div-mapa {
    display: block;
    text-align: center;
    background-color: white; }
    footer .footer-div-mapa h3 {
      height: 40px;
      color: #A5323C;
      margin-top: 20px; }
    footer .footer-div-mapa iframe {
      width: 856px;
      height: 392px; }
  /* INICIO */
  .home-main-section {
    height: 520px;
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("/IMG/cosmetologist-cleaning-face-woman-beauty-salon.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; }
    .home-main-section .home-main-section-txt {
      width: 50%;
      font-size: 40px;
      line-height: 58px; }
  .home-main-section2 {
    height: 364px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center; }
    .home-main-section2 .home-main-div-nosotras {
      text-align: center;
      height: 250px;
      margin-right: 50px; }
      .home-main-section2 .home-main-div-nosotras img {
        display: block;
        border-radius: 200px;
        height: 150px;
        margin-top: 5px; }
    .home-main-section2 .home-main-div-parrafo {
      width: 404px;
      height: 230px;
      font-size: 18px;
      line-height: 26px;
      margin-left: 50px; }
  .home-main-section3 {
    background-color: #CE3262;
    margin: 0px;
    color: white;
    text-align: center;
    height: 154px;
    padding: 20px;
    box-shadow: 0px -3px 4px rgba(0, 0, 0, 0.25); }
    .home-main-section3 h3 {
      font-size: 18px;
      height: 50px; }
    .home-main-section3 button {
      background-color: #FFD5D8;
      color: #CE3262;
      font-size: 25px;
      height: 38px;
      width: 224px;
      text-align: center;
      padding-top: 1px;
      margin-top: 10px; }
  .home-main-section5 {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 300px;
    margin-top: 50px; }
    .home-main-section5 div {
      width: 1209px;
      height: 278px; }
      .home-main-section5 div img {
        width: 100%;
        height: 100%; }
  /* TRATAMIENTOS */
  .tratam-main-section {
    height: 520px; }
    .tratam-main-section .tratam-main-section-txt {
      background: rgba(206, 50, 98, 0.7);
      font-weight: 400;
      font-size: 40px;
      width: 564px;
      height: 170px;
      padding-top: 65px; }
  .tratam-main-section2 {
    background-color: white;
    color: #CE3262;
    height: 200px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
    .tratam-main-section2 h3 {
      font-size: 25px;
      line-height: 20px;
      padding-top: 10px; }
    .tratam-main-section2 button {
      background-color: #CE3262;
      color: white;
      font-size: 25px;
      line-height: 29px;
      width: 224px;
      height: 38px;
      text-align: center;
      padding-top: 5px;
      margin-top: 5px; }
  .tratam-main-section3 {
    justify-content: center;
    align-items: center; }
    .tratam-main-section3 .tratam-main-section3-div {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      width: 856px;
      height: 320px; }
      .tratam-main-section3 .tratam-main-section3-div .texto {
        margin: 0px 50px; }
        .tratam-main-section3 .tratam-main-section3-div .texto h4 {
          font-size: 25px;
          font-weight: bold;
          text-align: left;
          height: 35px; }
        .tratam-main-section3 .tratam-main-section3-div .texto ul {
          font-size: 18px;
          text-align: left; }
      .tratam-main-section3 .tratam-main-section3-div .imagen img {
        width: 366px;
        height: 259px; }
  /* INFORMACION */
  .info-main-section {
    background-color: #FFD5D8;
    color: #CE3262;
    text-align: center;
    height: 200px;
    padding: 20px; }
    .info-main-section h3 {
      padding: 0px;
      height: 40px; }
    .info-main-section h4 {
      font-size: 18px;
      height: 50px; }
    .info-main-section button {
      background-color: #CE3262;
      color: white;
      font-size: 25px;
      width: 224px;
      height: 38px; }
  .info-main-section2 {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: stretch; }
    .info-main-section2 .info-main-section2-cards {
      margin: 15px 15px;
      padding: 0px;
      width: 28%; }
      .info-main-section2 .info-main-section2-cards .parrafo h4 {
        height: 30px;
        font-size: 20px;
        text-align: left; }
      .info-main-section2 .info-main-section2-cards .parrafo .ancho {
        height: 50px; }
      .info-main-section2 .info-main-section2-cards .parrafo p {
        font-size: 14px;
        text-align: left; }
      .info-main-section2 .info-main-section2-cards .parrafo ul {
        font-size: 14px; }
        .info-main-section2 .info-main-section2-cards .parrafo ul li {
          text-align: left; } }