.oscuro{ 
    background-color: rgba(30,30,30,1.00);
	/*background: url("../images/textura2.jpg") repeat;*/
    color: #ccc;
    -webkit-transition: background-color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out;
    }
.oscuro .oficina a{ 
	color: #111;
}

html {
      font-size: 100%;
    }
    body {
      font-size: 1rem;
    }
    h1 {
      font-size: 2rem;
    }
    h3 {
      font-size: 1.4rem;
    }
    h5{
    	font-size: 1.3rem;
    }
    li {
      font-size: 0.8rem;
    }
   
    button{
      font-size: 1rem;
    }
    audio{    	
    	position: relative;
      transform: rotate(270deg);
      transform-origin: left top 0;
      float: left;
      z-index: 100;

    }


    .f0 {
      font-size: 0.7rem;
    }
    .f1 {
      font-size: 0.9rem;
    }
    .f2 {
      font-size: 1.1rem;
    }
    .f3 {
      font-size: 1.2rem;
    }
    .f4 {
      font-size: 1.4rem;
    }

#acces{
	position: fixed;
	top: 100px;
	right: 5px;
	display: flex;
	flex-direction: column; 
	gap: 10px; 
	background-color: rgba(255, 255, 255, 1); 
	padding: 5px; 
	border-radius: 100px; 
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); 
	z-index: 1000;
}
    #aumentar, #disminuir, #modo{
    padding: 10px;
    border-radius: 2px;
    font-weight: bold;
    float: right;
    color: rgba(30, 0, 180, 1);
    position: relative;
    z-index: 100;
	box-shadow: none;
	background-color: rgba(0,0,0,0.00);
    }
#aumentar:hover, #disminuir:hover, #modo:hover{
	background-color: #007bff;
	color: #eee;
	border-radius: 30px;
    }