:root {
  --colNum: 10;
}
p , pre  {font-size: 20px;}    
#audio{background:#666;width:94%;padding:20px;}
.active a{color:#5DB0E6;text-decoration:none;}
div a{color:black;}
div a:hover{text-decoration:none;}
#playlist {
  display: grid;
  grid-template-columns: repeat(var(--colNum), 1fr);
  background-color: green;
  padding: 2px;
}
#playlist > div  {
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid black;
  padding: 3px;
  text-align: center;
  font-size: 18px;
}
  @media screen and (orientation: portrait) {
	  .installation {grid-template-columns: minmax(1fr, 400px), 1fr ;}
	  .item1 {grid-column: 2}
	  .item2 {
		font-size: 100%;
		padding: 3% 0;
	  }
  }
  @media screen and (orientation: landscape) {
	.installation {grid-template-columns: minmax(1fr, 450px), 2.5fr;}
	.item1 {grid-column: 1} 
	.item2 {
		font-size: 120%;
	    padding: 5% 0;
	}
  }