@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;600;800;900&display=swap');


.social-icons {
margin-top: 20px;
display: flex;
gap: 10px;
font-size: 70px;
align-items: center;
justify-content: center;

}
.social-icons a:not(:last-child) {

margin-right: 35px;
}
.social-icons a {

margin-top: -25px;
}

 
/* Banner 2 */
#banner {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
}
#video-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.banner-content {
 
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color:whitesmoke;
  font-family: 'Roboto Slab', serif;
  text-align: center;
  position: absolute;
  z-index: 1;
}
.banner-content h1 {
  
  margin-bottom: 20px;
  font-size: 60px; /* Modifica el tamaño de la fuente para el título (h1) */
  font-weight: normal; /* Modifica el grosor de la fuente para el título */
}
  

.banner-content p {
  
  margin-bottom: 30px;
  font-size: 22px; /* Modifica el tamaño de la fuente para el párrafo (p) */
}





.scroll-down-btn {
  color: #fff;
  font-size: 24px;
  position: absolute;
  bottom: 30px; /* Ajusta esta distancia desde la parte inferior del banner */
  left: 50%;
  transform: translateX(-50%);
  transition: color 0.3s;
  margin-bottom: -90px;
  cursor: pointer;
}

.scroll-down-btn:hover {
  color: #007bff;
}




.navbar-brand {
padding: 0;
margin-left: -120px; /* Mover hacia la izquierda */
}

.navbar-brand .img_style {
margin-bottom: -60px; /* Margen en la parte inferior */
margin-top: -60px;
max-width: 350px;
height: auto;
transition: max-width 0.3s;
}

.navbar-brand:hover .img_style {
max-width: 380px; /* Tamaño máximo al expandirse en el hover */
}

#servicesCarousel .carousel-inner .carousel-item h5 {
text-align: center;
font-size: 45px; /* Puedes ajustar el tamaño del texto según tus preferencias */
color: #ffffff; /* Cambia el color del texto si lo necesitas */
/*background-color: rgba(0, 123, 255, 0.7); /* Cambia el color de fondo del texto si lo necesitas */
padding: 10px; /* Agrega un poco de espacio alrededor del texto */
border-radius: 5px; /* Agrega bordes redondeados al fondo del texto */
position: absolute;
bottom: 575%; /* Ajusta la posición vertical del texto dentro del carrusel */
left: 50%; /* Centra horizontalmente el texto */
transform: translate(-50%, -50%); /* Ajusta la posición horizontal y vertical del texto */
}

.titulo-contenedor{
text-align: center;
font-size: 45px;
padding: 10px;
margin-top: 15px ;
margin-bottom: 28px;
font-family: 'Roboto Slab', serif;
font-weight: bold; /* Estilo para la etiqueta h1 */
color:whitesmoke

}

body{
background-image: url('/img/banner_huellas.png');

margin: 0;
padding: 0;

}

.navbar-nav {
margin-right: -120px; /* Mueve los elementos del nav a la derecha */
}

.navbar-nav .nav-item .nav-link {
font-size: 20px; /* Tamaño de fuente para los títulos */

}

.navbar-nav .nav-item .nav-link i {
font-size: 20px; /* Tamaño de fuente para los iconos */
margin-right: 8px; /* Espacio entre el icono y el texto */
}

.testimonios{
margin-top: 50px;
margin-bottom: 50px;
}

.testimonial-img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  }
  .testimonial-card {
    max-width: 300px; /* Establece el ancho máximo deseado */
    margin: 0 auto; /* Centra horizontalmente el contenido */
  }
  #testimonials {
    background-image: url('/img/bg_1.jpg'); /* Ruta de la imagen de fondo */
    background-size: cover; /* Ajusta la imagen para cubrir todo el espacio */
    background-position: center; /* Centra la imagen horizontal y verticalmente */
    padding: 100px 0; /* Agrega espacio de relleno al contenido */
    background-attachment: fixed; /* Fija la imagen de fondo */
  
  }
  

#services-contact {
  background-image: url('/img/perro_servicios_contacto.jpg'); /* Ruta de la imagen de fondo */
  
  background-size: cover; /* Ajusta la imagen al tamaño del contenedor */
  background-position: center; /* Centra la imagen horizontalmente */
  padding: 50px 0; /* Añade un espacio alrededor del contenido */
  background-attachment: fixed; /* Fija la imagen de fondo */

  
  color: #fff; /* Color del texto */

}

#services-contact .row {
  justify-content: center; /* Centra el contenido verticalmente */
  margin-left: 20px;
  margin-right: 20px;
}
/* Estilos para la sección "Our Services" */
#our-services {
  padding: 50px 0; /* Espaciado interno en la parte superior e inferior de la sección */
}

/* Estilos para el título de la sección */
.section-title {
  text-align: center; /* Centrar el texto en el centro de la sección */
  margin-bottom: 30px; /* Margen inferior para separar el título de las tarjetas */
}

/* Estilos para las tarjetas (cards) */
.card {
  border: none; /* Sin borde en las tarjetas */
  margin-bottom: 20px; /* Espacio entre las tarjetas */
  margin-top: 20px;
  margin-right: 10px;

  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); /* Sombra suave */
  transition: transform 0.3s, box-shadow 0.3s; /* Transiciones suaves en transformación y sombra al interactuar */
}



/* Efecto de aumento y sombra al pasar el cursor sobre las tarjetas */
.card:hover {
  transform: translateY(-10px); /* Desplazar hacia arriba al interactuar */
  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2); /* Sombra más intensa */
}

/* Estilos para la imagen superior de la tarjeta */
.card-img-top {
  max-height: 200px; /* Altura máxima de la imagen */
  object-fit: cover; /* Ajuste de la imagen para llenar el espacio manteniendo la proporción */
}

/* Estilos para el cuerpo de la tarjeta */
.card-body {
  padding: 20px; /* Espaciado interno del cuerpo de la tarjeta */
}

/* Estilos para el título de la tarjeta */
.card-title {
  font-size: 1.5rem; /* Tamaño de fuente del título */
  margin-bottom: 10px; /* Margen inferior del título */
}

/* Estilos para el texto de la tarjeta */
.card-text {
  font-size: 1rem; /* Tamaño de fuente del texto */
}




/* Estilos de beneficios */

.heading-section .subheading {
font-size: 12px;
display: block;
font-weight: 600;
color: #00bd56;
text-transform: uppercase;
letter-spacing: 2px; }

.heading-section h2 {
font-size: 30px;
font-weight: 800; }
@media (max-width: 767.98px) {
.heading-section h2 {
  font-size: 28px; } }

.heading-section.heading-section-white .subheading {
color: #000000; }

.heading-section.heading-section-white h2 {
color: #000000; }

.heading-section.heading-section-white p {
color: rgba(255, 255, 255, 0.9); }

.row{
  margin-right: 0px;
}

  .services-2 {
    width: 100%;
    margin-bottom: 20px; }
    .services-2 .icon {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      background: #00bd56;
      -webkit-box-shadow: 0px 10px 30px -4px rgba(0, 0, 0, 0.15);
      -moz-box-shadow: 0px 10px 30px -4px rgba(0, 0, 0, 0.15);
      box-shadow: 0px 10px 30px -4px rgba(0, 0, 0, 0.15); }
      .services-2 .icon span {
        font-size: 40px;
        color: #fff; }
    .services-2 .text {
      width: calc(100% - 60px); }
      .services-2 .text h4 {
        font-size: 20px;
        font-weight: 700; }