Template:G1event/styles.css

.Event1Container {
	max-width: 500px; 
	background: #E0F2B6; 
	border-radius: 10px; 
	padding: 5px;
	box-sizing: border-box;
	margin-bottom: 10px;
}

.Event1Info {
	background: #2068e0; 
	border-top-left-radius: 8px; 
	border-bottom-left-radius: 8px; 
	padding: 5px 10px; 
	color: #FFF;
	font-variant: small-caps;
}

.Event1LeftTable {
	text-align: center; 
	font-size: 95%;
}

.Event1Name {
	background: #f8c850; 
	border-top-left-radius: 8px; 
	border-top-right-radius: 8px; 
	border-bottom-right-radius: 8px;
}

.Event1Level {
	background: #FFF; 
	border-bottom-left-radius: 8px; 
	border-bottom-right-radius: 8px;
}

.Event1Dex {
	background: #80d888; 
	border-top-left-radius: 8px; 
	border-top-right-radius: 8px;
	font-variant: small-caps;
}

.Event1DexNo {
	background: #FFF; 
	border-bottom-left-radius: 8px; 
	border-bottom-right-radius: 8px;
	font-family: monospace;
	font-size: larger;
}

.Event1Type {
	background: #70b870; 
	border-top-left-radius: 8px; 
	border-top-right-radius: 8px;
	font-variant: small-caps;
}

.Event1TypeBox {
	min-width: 75px;
	color: #FFF;
}

.Event1Item {
	width: 33%; 
	background: #f8c850; 
	border-top-left-radius: 8px; 
	border-top-right-radius: 8px;
	font-variant: small-caps;
}

.Event1ItemName {
	background: #FFF; 
	border-bottom-left-radius: 8px; 
	border-bottom-right-radius: 8px;
	line-height: 120%;
}

.Event1OT {
	width: 33%; 
	background: #80d888; 
	border-top-left-radius: 8px; 
	border-bottom-left-radius: 8px;
	font-variant: small-caps;
}

.Event1Trainer {
	width: 33%; 
	background: #FFF; 
	border-top-right-radius: 8px; 
	border-bottom-right-radius: 8px;
}

.Event1ID {
	background: #70b870; 
	border-top-left-radius: 8px; 
	border-bottom-left-radius: 8px;
	font-variant: small-caps;
}

.Event1IDNo {
	background: #FFF; 
	border-top-right-radius: 8px; 
	border-bottom-right-radius: 8px;
}

.Event1TopRight {
	display: flex; 
	flex-direction: column;
}

.Event1Moves {
	background: #2068e0; 
	border-top-right-radius: 8px; 
	border-bottom-right-radius: 8px; 
	padding: 5px 10px; 
	color: #FFF;
	font-variant: small-caps;
}

.Event1rightTable {
	text-align: center; 
	margin: 2px 2px 2px 0; 
	font-size: 95%;
}

.Event1MoveType {
	width: 50%;
	color: #FFF;
}

.Event1MoveA {
	width: 50%; 
	background: #f88078; 
}

.Event1MoveB {
	background: #f0a8a0;
}

.Event1Available {
	border-radius: 10px; 
	padding: 5px; 
	background: #d8c800;
	margin: 0 3px 3px 0;
	font-size: 90%;
	text-align: center;
	align-content: center;
}

.Event1Notes {
	text-align: center;
	font-size: 11px;
	line-height: 120%;
}

.Event1BottomTable {
	text-align: center; 
	background: #d078f8; 
	border-radius: 8px; 
	height: 58px; 
	padding: 1px;
}

.Event1GE {
	text-align: center;
	margin-top: 2px;
}

@media (min-width: 800px) {
	.Event1TopGrid {
		display: grid; 
		gap: 3px; 
		grid-template-columns: 1fr 1fr;
	}
	
	.Event1LeftTable {
		margin: 2px 0 2px 2px; 
	}
	
	.Event1BottomGrid {
		display: grid; 
		gap: 3px; 
		grid-template-columns: 1fr 1fr;
		margin-top: 3px;
	}
	
}

@media (max-width: 799px) {
	.Event1Info {
		border-radius: 8px; 
	}
	
	.Event1LeftTable {
		margin: 2px 2px 2px 0;
	}
	
	.Event1Moves {
		border-radius: 8px; 
	}
	
	.Event1BottomTable {
		margin-top: 3px;
	}
}