body {
   background-image: url("../imagenes/fondo1.png"); 
   background-size: 80%;
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-position: center center;
   font-family: 'Inter', sans-serif;
   background-color: #f0edeb;
}


img {
     object-fit: cover;
     width: 100%;
     height: 100%;
}

.cabecera{
   margin-top: 5px;
   background-color: #c3b4ab;   
   margin-bottom: 5px;
}

.contImagen{
}

ti1{
     color: rgb(78, 70, 65);
     font-size: 190%; 
     font-weight: bold;
     display: flex;
     justify-content: center;

}

ti2{
  color: rgb(78, 70, 65);
  font-size: 160%; 
  font-weight: bold;
  display: flex;
  justify-content: center;
}

ti3{
  color: rgb(78, 70, 65);
  font-size: 100%; 
  font-weight: bold;
  display: flex;
  justify-content: center;

}

.container 
{ 
    width: 100%;
    justify-content: center;
    object-fit: cover;
    object-position: center center;
    align-items: center;
}

.form-select
{ 
    background: rgba(195, 180, 171, 0.40);
    font-weight: bold;
}

#ciudad{
     margin-top: 0px;
}

.play{background: url('../imagenes/play.png') ;}
.pause{background: url('../imagenes/pause.png') ;}

#audioplayer{
	height: 60px;
	margin: auto;
	margin-top: 20px;
	background: rgba(195, 180, 171, 0.62);
	border-radius: 15px;
}

#pButton{
	height:60px;
	width: 60px;
	border: none;
	background-size: 50% 50%;
	background-repeat: no-repeat;
	background-position: center;
	float:left;
}

#timeline{
	width: 45%;
	height: 20px;
	background: rgba(0,0,0,.3);
	margin-top: 20px;
	margin-left: 20px;
	float: left;
	border-radius: 15px;
}

#playhead{
	cursor: pointer;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	margin-top: 1px;
	background: black;
}

#tiempo{
  color: rgb(78, 70, 65);
  font-size: 110%; 
  font-weight: bold;
  float:right;
  margin-right: 15px;
  margin-top: 18px;
}