body,
html {
  margin: 0;
  padding: 0;
  height: 100%;

}
   body p{
        font-family:RALEWAY-REGULAR
    }
    body .navbar{
        font-family:RALEWAY-EXTRABOLD
    }
    body h1, h2, h3, h4, h5, h6, b{
        font-family:RALEWAY-BLACK
    }
    .card-title{
      font-family:RALEWAY-EXTRABOLD !important
    }

    @font-face {
      font-family: "RALEWAY-SEMIBOLD";
      src: url("../../fuente_2/RALEWAY-SEMIBOLD.TTF");
      font-weight: 600;
  }
  @font-face {
      font-family: "RALEWAY-EXTRABOLD";
      src: url("../../fuente_2/RALEWAY-EXTRABOLD.TTF");
      font-weight: 600;
  }
  @font-face {
      font-family: "RALEWAY-BOLD";
      src: url("../../fuente_2/RALEWAY-BOLD.TTF");
      font-weight: 600;
  }

  @font-face {
      font-family: 'RALEWAY-LIGHT';
      src: url("../../fuente_2/RALEWAY-LIGHT.TTF") format('truetype');
      font-weight: normal;
      font-style: normal;
  }

  @font-face {
      font-family: 'COOLVETICA-CONDENSED-RG';
      src: url("../../fuente_2/COOLVETICA-CONDENSED-RG.OTF") format('truetype');
      font-weight: normal;
      font-style: normal;
  }
  @font-face {
      font-family: 'RALEWAY-BLACK';
      src: url("../../fuente_2/RALEWAY-BLACK.TTF") format('truetype');
      font-weight: normal;
      font-style: normal;
  }

  @font-face {
    font-family: 'RALEWAY-REGULAR';
    src: url("../../fuente_2/RALEWAY-REGULAR.TTF") format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family: 'COOLVETICA-RG';
  src: url("../../fuente_2/COOLVETICA-RG.OTF") format('truetype');
  font-weight: normal;
  font-style: normal;
}
.social-container {

  position: fixed;
  /* Siempre visible en el lado izquierdo */
  top: 50%;
  /* Posicionado verticalmente en el centro */
  left: 0px;
  /* Alineado a la izquierda */
  transform: translateY(-50%);
  /* Centrado verticalmente */
  display: flex;
  flex-direction: column;
  /* Coloca los elementos uno debajo del otro */
  gap: -0px;
  /* Espaciado entre los botones */
  height:150px;
}

.social-button img {
  width: 40px;
  height: 35px;
  cursor: pointer;
  margin-top:5px;
  transition: transform 0.2s ease;
}

.social-button img:hover {
  transform: scale(1.5);
  /* Animación de agrandamiento al pasar el cursor */
}
.container-fluid {
    background-color: #03424E;
    /* Color de fondo similar */
  }

  h4 {
    color: #F6A42C;
    /* Color de texto naranja */
  }

  h1 {
    color: #ffffff;
    word-spacing: 5px;
    letter-spacing: 3px;
  }

  h2 {
    color: #03424E;
  }

  h3 {
    color: #ffffff;
  }

  h5 {
    color: #ffffff;
    font-size: 500px;
  }

  .text-warning {
    color: #F6A42C !important;

    /* Color de texto para "TUS HOGAR" */
  }

  .btn-warning {
    background-color: #F6A42C;
    border-color: #F6A42C;
  }

  .form-group input,
  .form-group textarea {
    border-radius: 0.25rem;
  }

  .d-flex img {
    border-radius: 50%;
  }
  .transparencia_pie {
    width: 100%;
    /* Ajuste opcional */
    height: auto;
    /* Ajuste opcional */
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
  }
  .transparencia_left{
    width: 100%;

    height: 100%;
    /* Ajuste opcional */
    mask-image: linear-gradient(to left, black 20%, transparent 100%);
    -webkit-mask-image: linear-gradient(to left, black 20%, transparent 100%);

margin-left: 14px;

  }

  .text-overlay {
    position: absolute;
    left: 8%; /* Ajusta este valor para controlar cuánto se superpone */


    z-index: 0;

    padding: 5px 10px;
  }



.degradado-centro {

  background: radial-gradient(circle, #fffcfc31 -100%, #03424E 100%);

}
.card-body img{
  border-radius: 0px !important;
}

#iti-0__country-listbox {
  background-color: #055261; /* Fondo azul oscuro */
  color: #fff; /* Texto blanco */
  position: absolute; /* Necesario para z-index */
  z-index: 9999; /* Valor alto para estar por encima de todo */
}

.iti--allow-dropdown{
  width:100% !important
}
input::placeholder { /* Navegadores modernos */
  color: white !important;
  opacity: 1; /* Hace que el color sea totalmente visible */
}

input::-webkit-input-placeholder { /* Chrome, Safari, Opera */
  color: white !important;
  opacity: 1;
}

input:-ms-input-placeholder { /* Internet Explorer */
  color: white !important;
}
.borde-contenedor{
  display: flex;



  background-color: #f0f0f0;
}
.borde-derecha{
  border-right: solid 5px rgb(255, 255, 255);


  border-radius: 5px;

}