.titulo {
      margin-left: 10px;
      width: 100%;
    }

    .led {
      position: absolute;
      top: 5px;
      left: 340px;
      height: 25px;
      width: 100px;
    }

    body {
      margin: 0;
      padding: 0;
      overflow: hidden;
      position: fixed;
	z-index:-1
    }

    #background {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: -1;
      background-image: url("../imagenes/tiled1.png");
      background-repeat: repeat;
      animation: animateBackground 3s linear infinite backwards; 
	margin: 0;
      padding: 0;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
     #overlay0{
		fill: rgb(0,0,10);
		fill-opacity: 0.35;
		width: 100vw;
		height: 100vh;
		mix-blend-mode: hard-light;}
    

    @keyframes animateBackground {

      0% { background-position: 0 0}
      100% { background-position: 512px 0}
    }
    .container {
      margin: 20px;
    }

.overlay {
    pointer-events: none; /* Para que no interfiera con otros eventos */
    width: 100%;
    height: 100%;
    position: relative;
}
 

    table {
      width: 70vw;
      height: 60vh;
      border-collapse: collapse;
      border: none; /* Quitar el borde */
      margin: 0 auto;
    }

    td {
      padding: 10px;
      text-align: center;
    }

    iframe {
      width: 100%;
      height: 60vh;
      border: none;
    }
        .volume-control .volume-slider .vol-progress .vol-bar {
            background: #FFE054 none repeat scroll 0 0 !important;
        }

  #playerbar{background: url("../imagenes/background6.png") scroll center;color: #0f487d;
}

#date-time {
position: fixed; display:block; bottom:1.5vh; right: 10vw; color:white; font-size:3.3vh; text-align:right
}

#colorControl{
	background-color: white;
	position:fixed;
	width: 20vw;
	height: 23vh;
	right: 10vw;
	top: 10vh;
	align-content: center;
	text-align: center;
	color: black;
	text-shadow: 1px 1px 1px lightgray;
	visibility: hidden;
	border-radius: 40px;
	}

/*Chrome*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
    input[type='range'] {
      overflow: hidden;
      width: 65%;
      -webkit-appearance: none;
      background-color: #977726;
    }
    
    input[type='range']::-webkit-slider-runnable-track {
      height: 10px;
      -webkit-appearance: none;
      color: #FFE054;
      margin-top: -1px;
    }
    
    input[type='range']::-webkit-slider-thumb {
      width: 10px;
      -webkit-appearance: none;
      height: 10px;
      cursor: ew-resize;
      background: #434343;
      box-shadow: -80px 0 0 80px #FFE054;
    }

}
/** FF*/
input[type="range"]::-moz-range-progress {
  background-color: #FFE054; 
}
input[type="range"]::-moz-range-track {  
  background-color: #977726;
}

/* IE*/
input[type="range"]::-ms-fill-lower {
  background-color: #977726; 
}
input[type="range"]::-ms-fill-upper {  
  background-color: #FFE054;
}

input[type="range"]{
	border-radius: 10px;
	filter: drop-shadow(3px 3px 2px rgba(0,0,20, 0.35));
}

#contenedorTitulo{
position:absolute; 
top: 1vh; 
right: 5vw; 
z-index: 2; 
width: 9vw; 
height:9vh;
object-fit: fill;
}

.botoncito {

@media (max-aspect-ratio: 1/1){
	r: 4vw;

}

}