|  |  | @@ -84,7 +84,7 @@ a:hover { | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | flex-wrap: nowrap; | 
		
	
		
			
			|  |  |  | text-align: center; | 
		
	
		
			
			|  |  |  | width: 300px; | 
		
	
		
			
			|  |  |  | width: 25%; | 
		
	
		
			
			|  |  |  | padding: 100px; | 
		
	
		
			
			|  |  |  | background-color: rgba(0, 0, 0, 0.9); | 
		
	
		
			
			|  |  |  | } | 
		
	
	
		
			
				|  |  | @@ -104,6 +104,28 @@ a:hover { | 
		
	
		
			
			|  |  |  | color: #eee; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | @media (max-aspect-ratio: 1/1) { | 
		
	
		
			
			|  |  |  | .modal-content { | 
		
	
		
			
			|  |  |  | width: 75%; | 
		
	
		
			
			|  |  |  | height: 75%; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | .menu-button { | 
		
	
		
			
			|  |  |  | height: 10%; | 
		
	
		
			
			|  |  |  | font-size: 5vw; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | @media (min-aspect-ratio: 1/1) { | 
		
	
		
			
			|  |  |  | #info-area { | 
		
	
		
			
			|  |  |  | height: 60%; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | #control-area { | 
		
	
		
			
			|  |  |  | height: 40%; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | .menu-button:active { | 
		
	
		
			
			|  |  |  | background-color: #222; | 
		
	
		
			
			|  |  |  | } | 
		
	
	
		
			
				|  |  | 
 |