a.tile:hover { 
	opacity: 0.75; 
}
a.tile { 
	cursor: pointer; 

}
a { 
	text-decoration: none; 
	color: inherit; 
}

.page {
	height: 100vh;
	width: 100vw;    
}

.grid10 {
	height: 90vh;
	width: 90vw;
	margin: 0 auto;

	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-template-rows: repeat(2, 1fr);

	gap: clamp(6px, 1vw, 16px);
	padding: clamp(8px, 1vw, 16px);
}

.tile {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 8%;
	cursor: pointer;
}

.tile img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

body#index {
	background-color: #7A2C16;
	margin: 0;
}

body#p2 {
	background-color: #D4D4A1;
	margin: 0;
}

body#p3{
	background-color: #346947;
	margin: 0;
}

body#p4 {
	background-color: #137D6B;
	margin: 0;
}

body#p5 {
	background-color: #B8E3DB;
	margin: 0;
}

body#p6 {
	background-color: #D8B0FF;
	margin: 0;
}

body#p7 {
	background-color: #40307A;
	margin: 0;
}

body#p8 {
	background-color: #CFC2FF;
	margin: 0;
}

body#p9 {
	background-color: #375570;
	margin: 0;
}

body#p10 {
	background-color: #8FCAFF;
	margin: 0;
}