body{
font-family: Arial;
background:#111;
color:white;
text-align:center;
}

h1{
margin-top:20px;
}

.contenedor{
display:flex;
justify-content:center;
gap:30px;
padding:20px;
}

.emisoras{

width:300px;
height:500px;
overflow-y:auto;
background:#222;
padding:15px;
border-radius:10px;

}

.emisora{

padding:10px;
margin:5px 0;
background:#8b0000;
border-radius:8px;
cursor:pointer;
}

.emisora:hover{
background:#c40000;
}

.reproductor{

width:400px;
background:#222;
padding:20px;
border-radius:10px;

}

audio{
width:10%;
}
.mapa{
width:400px;
height:600px;
overflow-y:auto;
background:#0946cb;
padding:15px;
border-radius:10px;
position:absolute;
top:300px;
left: 800px; 
z-index: -1;
opacity: 0.8;
}   

.btn-fijo {
  width:  120px;     /* ancho fijo */
  height: 120px;      /* alto fijo */

  /* Centrar el texto vertical y horizontalmente */
  
  align-items: center;
  justify-content: center;

  font-size: 16px;
  background: #421983;
  color: white;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

.btn-auto {
  padding:    10px 20px;
  min-width:  140px;       /* nunca será más pequeño que esto */
  font-size:  16px;
  background: #ff5722;
  color: white;
  border: none;
  border-radius: 999px;    /* pastilla muy moderna */
  cursor: pointer;
}
.cancion {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 20px;
  margin-left: 50%;
} 


 /* 1. Declarar la fuente local */
@font-face {
    font-family: 'lcd'; /* Nombre que usarás en CSS */
    src: url('fuentes/lcd.ttf') format('truetype'); /* Opcional */
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'digital'; /* Nombre que usarás en CSS */
    src: url('fuentes/digital1.ttf') format('truetype'); /* Opcional */
    src: url('fuentes/digitall2.ttf') format('truetype'); /* Opcional */

    font-weight: normal;
    font-style: normal;
}
body {
    font-family: 'digital', sans-serif;
    font-size: 18px;
    background-color: #29c21e;
    padding: 20px;
}