:root {
  --primary-color: #f5f5f5;
  --secondary-color: #151515;
  --secondary-color-light: #888888;
  --tertiary-color: #b37709;
  --bg-color: #151515;
  --primary-font: "Arial", Times, serif;
  --cube-color-1-300: #61cccc;
  --cube-color-1-500: #2f989d;
  --cube-color-2-300: #efc062;
  --cube-color-2-500: #e3851d;
  --cube-color-3-300: #ea7e73;
  --cube-color-3-500: #cb4537;
}

#services {
  background-color: var(--cube-color-3-300) !important;
}

.thumb-info-type {
  background-color: var(--cube-color-2-300) !important;
}

.bg-color-a {
  background-color: var(--cube-color-2-300) !important;
}

.contact-form input[type="submit"] {
  background-color: var(--cube-color-2-300) !important;
  border: none;
}
.contact-form input[type="submit"]:hover {
  background-color: var(--cube-color-2-500) !important;
}

html.dark form:not(.form-style-4) .form-control {
  background-color: white !important;
}

.main-color {
  background-color: var(--cube-color-2-300) !important;
}

.dark-bg {
  background: var(--bg-color);
}

.dark-txt {
  color: var(--cube-color-2-300) !important;
}

.sticky-body{
    background: rgb(0,0,0,0.70) !important
}

.white{
  background: white !important;
}


#map {
  height: 480px;
}
#semilla-map {
  height: 100%;
}


.faq-title{
  padding-top: 150px;
}

#mainNav .nav-item .nav-link {
  position: relative;
  transition: transform 0.3s, color 0.3s;
  padding: 10px 20px;
  perspective: 1000px;
  display:block !important;
  margin: 10px 5px !important;
}

#mainNav .nav-item .nav-link:hover {
  transform: translateZ(20px);
}

/* Efecto hover para el primer elemento - Color Turquesa */
#mainNav .nav-item:nth-child(2) .nav-link:hover {
  color: var(--cube-color-1-300);
  text-shadow: 2px 2px 4px rgba(97, 204, 204, 0.3);
  transform: translate3d(0, -2px, 20px);
  box-shadow: 0 5px 15px rgba(97, 204, 204, 0.4);
}

/* Efecto hover para el segundo elemento - Color Amarillo */
#mainNav .nav-item:nth-child(3) .nav-link:hover {
  color: var(--cube-color-2-300);
  text-shadow: 2px 2px 4px rgba(239, 192, 98, 0.3);
  transform: translate3d(0, -2px, 20px);
  box-shadow: 0 5px 15px rgba(239, 192, 98, 0.4);
}

/* Efecto hover para el tercer elemento - Color Salmón */
#mainNav .nav-item:nth-child(1) .nav-link:hover {
  color: var(--cube-color-3-300);
  text-shadow: 2px 2px 4px rgba(234, 126, 115, 0.3);
  transform: translate3d(0, -2px, 20px);
  box-shadow: 0 5px 15px rgba(234, 126, 115, 0.4);
}

/* Efecto hover para el cuarto elemento - Color Blanco */
#mainNav .nav-item:nth-child(4) .nav-link:hover {
  color: white;
  text-shadow: 2px 2px 4px rgba(255, 255, 255, 0.3);
  transform: translate3d(0, -2px, 20px);
  box-shadow: 0 5px 15px rgba(255, 255, 255, 0.4);
}

/* Efecto de transición suave para todos los elementos */
#mainNav .nav-item .nav-link {
  transition: all 0.3s ease-in-out;
  border-radius: 4px;
}

/* Opcional: Añadir un efecto de rotación sutil */
#mainNav .nav-item .nav-link:hover {
  transform: rotate3d(1, 0, 0, 10deg);
}
#contenedor-contenido h2{color:#333;}