/*
body {
  font-family: Arial, sans-serif;
  max-width: 1200px;
  margin: 40px auto;
  padding: 20px;
}
*/
input, button {
  padding: 10px;
  margin: 6px 0;
  width: 100%;
  box-sizing: border-box;
}
button {
  cursor: pointer;
}
pre {
  background: #f4f4f4;
  padding: 12px;
  overflow: auto;
}
.row {
  display: grid;
  gap: 8px;
}

.head{
	width:100%; 
	text-align:center
}

.location{
	margin: 20px;
}

.container {
  /* Flexbox centering */
  display: flex;
  justify-content: center; /* Centers horizontally on the main axis */
  align-items: center;     /* Centers vertically on the cross axis */
  
  /* Visual styling */
 
  
  /* Container size (required for vertical centering to be visible) */
  width: 100%;
  min-height: 80vh;
  gap:20px;
}  

.container>.display{
	max-width:50%;
	min-height:100px;
	border: 1px solid #000;  /* 1px border */
	border-radius: 12px;     /* Adjust value for roundness */
	background-color:white;
/*    
    align-items: center;   
	justify-content: center; 
	display: flex;
*/	
	text-align: center;
	padding:20px;
	
	
}


.container>.fulldisplay{
	max-width:98%;
	min-height:100px;
	border: 1px solid #000;  /* 1px border */
	border-radius: 12px;     /* Adjust value for roundness */
	background-color:white;
/*    
    align-items: center;   
	justify-content: center; 
	display: flex;
*/	
	text-align: center;
	padding:20px;
	
	
}




.container>.display:hover, .container>div:focus{
	background: #f5f5f5;
	cursor: pointer;
}