/*
Theme Name:     Beats Web Theme
Description: 	Este tema es propiedad intelectual de Beatsweb. Hemos creado este tema hijo para personalizar el tema padre sin alterarlo. 
Author:         Beats Web
Author URI:     https://beatsweb.com/
Template:       hello-elementor
Version: 		1.0
*/

/*===================*/
/* CUSTOM CODE - BEATSWEB
/*===================*/

/*General*/

.hover-column:hover h4, .hover-column:hover p, .hover-column:hover .elementor-button, .hover-column:hover .elementor-icon .icon{
	color:#FFB829 !important;
}

.hover-column:hover .elementor-button{
	border-color: #ffffff !important;
}

.desplegable .elementor-image-box-description {
  display: none;
}

.des-reconocimiento{
	display: none;
}

/*Animación de circulos en sección de la web*/
.circles-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
  pointer-events: none;
}
.circle {
  position: absolute;
  animation: moveCircleFreely linear infinite;
  opacity: 0.7;
}

/* Animación para movimientos libres */
@keyframes moveCircleFreely {
  0% {
    transform: translate(0, 0);
  }
  20% {
    transform: translate(100px, -120px) rotate(30deg);
  }
  40% {
    transform: translate(-150px, 80px) rotate(-45deg);
  }
  60% {
    transform: translate(200px, 200px) rotate(60deg);
  }
  80% {
    transform: translate(-100px, -150px) rotate(-30deg);
  }
  100% {
    transform: translate(0, 0);
  }
}

/* Personalización aleatoria para cada círculo */
.circle:nth-child(1) {
  width: 100px;
  height: 100px;
  top: 10%;
  left: 15%;
  animation-duration: 12s;
}

.circle:nth-child(2) {
  width: 100px;
  height: 100px;
  top: 30%;
  left: 40%;
  animation-duration: 18s;
}

.circle:nth-child(3) {
  width: 100px;
  height: 100px;
  top: 50%;
  left: 60%;
  animation-duration: 14s;
}

.circle:nth-child(4) {
  width: 100px;
  height: 100px;
  top: 70%;
  left: 20%;
  animation-duration: 16s;
}

.circle:nth-child(5) {
  width: 100px;
  height: 100px;
  top: 85%;
  left: 80%;
  animation-duration: 20s;
}

.circle:nth-child(6) {
  width: 100px;
  height: 100px;
  top: 10%;
  left: 15%;
  animation-duration: 12s;
}

.circle:nth-child(7) {
  width: 90px;
  height: 90px;
  top: 30%;
  left: 40%;
  animation-duration: 18s;
}

.circle:nth-child(8) {
  width: 80px;
  height: 80px;
  top: 50%;
  left: 60%;
  animation-duration: 14s;
}