/*
Theme Name: Blocksy Child
Theme URI: http://example.com/twenty-twenty-three-child/
Description: Blocksy Child Theme
Author: Albert Sánchez - Javajan
Author URI: http://albertsanchez.cat
Template: blocksy
Version: 1.0.0
*/

/* Estils dani */
.lswssp-logo-img-wrap a:hover { opacity:0.8; padding:5px;  }
.btn-warning { background-color: #fff; color:#000; padding:10px; }
.btn-primary { background-color: #999; color:#fff; padding:10px; }
/* widgets */
.margen { margin-bottom:-50px; }
.ct-header-search { display:none !important; }
.ct-container { display:nnone !important; }
.ct-toggle { display:none !important;}
.menu { display:none !important; }
.node-title {
		font-size: 12px !important;
	}
/* Menú toggle fuera del body */
.menunew {
	display: none;
	flex-direction: column;
	background: #fff;
	padding: 10px;
	position: fixed; /* Fijado en la ventana del navegador */
	top: 138px;
	right: 10px;
	width: 120px; /* Ocupa todo el ancho del viewport */
	height: auto; /* Ocupa todo el alto del viewport */
	z-index: 99999; /* Asegúrate de que esté por encima de todo */
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.menunew-active {
	display: flex;
}

/* Botón de toggle */
#menunew-toggle-button {
	cursor: pointer;
	background: #000;
	color: #fff;
	border: none;
	padding: 10px 15px;
	font-size: 34px;
	z-index: 10000; /* Asegúrate de que el botón esté visible */
	position: fixed; /* Fijado en el viewport */
	top: 60px;
	right: 10px;
		float:right;
}

#menunew-toggle-button:hover {
	background: #fff;
	  color:#000;
}

/* Estilo de los enlaces del menú */
.menunew-list {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 100%;
	text-align: center;
}

.menunew-list li {
	margin: 10px 0;
}

.menunew-list li a {
	text-decoration: none;
	color: #333;
	font-size: 18px;
	padding: 10px 15px;
	display: block;
	  font-family: "Jost", Sans-serif;
}


#header {
	position: relative;
	z-index: 50;
	background-color: transparent !important;
}
#top_title_area { display:none !important; }
#breadcrumb { display:none !important; }
svg {
			display: block;
		}

/* canvas nuevo */
#canvas {
		width: 100%;
		height: 80vh;
	  }

	  #form-container {
		padding: 10px;
		background-color: #161313;
		position: absolute;
		top: 80vh;
		width: 100%;
		box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.1);
				color:#000 !important;
	  }

	  #info-box {
				margin-top:-640px; 
				width:24%;
		position: static;
		background-color: white;
		border: 1px solid #ccc;
		padding: 20px;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
		display: none;
		z-index: 10;
				color:#000;
	  }

/* Contact form 7 */
.wpcf7 label:not(.wpcf7-form-control-wrap) {
	display: block;
	font-size: 18px;
	font-weight: 600;
}
.wpcf7 input[type=submit] { color: #000; background-color:#fff; }
input[type=submit]:hover { color: #fff; background-color:#f58929; }

@media (max-width:600px) {
	svg {
	display: block;
	margin-left: -180px !important;
}
	#grafico-nodos {
		width: 270% !important;
			  margin-left: -254px !important;
	  }
	.node-title {
		font-size: 20px !important;
	}
	#info-box {
				width:100% !important;
		position: static !important;
		background-color: white;
		border: 1px solid #ccc;
		padding: 10px;
			margin-top: 0px !important;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
		display: none;
		z-index: 10;
				color:#000;
	  }
	.mov { width: 70% !important; }
	.font { font-size:24px !important; }
	
}
@media (min-width:601px) and (max-width:800px) { 
#info-box {
				width:50% !important;
		position: static !important;
		background-color: white;
		border: 1px solid #ccc;
		padding: 10px;
			margin-top: 0px !important;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
		display: none;
		z-index: 10;
				color:#000;
	  }
}
@media (min-width:801px) and (max-width:1024px) {
	
	#info-box {
				width:50% !important;
		position: static !important;
		background-color: white;
		border: 1px solid #ccc;
		padding: 10px;
			margin-top: 0px !important;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
		display: none;
		z-index: 10;
				color:#000;
	  }	
}

/*  *************************
*****************************
        ESTILS CHILD
*****************************
*************************** */
#viz{
	position: relative;
}
@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.1); }
}

@keyframes rotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}


#center-logo {
  transform-origin: center center;
  animation: pulse 1.5s ease-in-out infinite;
  cursor: pointer;
}

#center-logo-border {
  opacity: .8;
  transition: .8s;
  transform-origin: center center;
  animation: rotate 20s linear infinite;
}

.border-rotate {

  transform-origin:  center;
  animation: rotate 40s linear infinite;
}

#vantapanel, #overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  filter: blur(2px);
}
canvas {
  display: block;
}