Added Picture Gallery

1 files changed, 39 insertions, 0 deletions

diff --git a/britons.css b/britons.css
index 8b2fe55..e6d1088 100644
--- a/britons.css
+++ b/britons.css
@@ -137,3 +137,42 @@ figure img {
 .urlbutton img {
 	max-height: 31px; 
 }
+
+.gallery {
+	display: grid;
+	justify-content: center; 
+	grid-template-columns: repeat(auto-fit, minmax(15%, 1rem));
+	gap: 20px;
+}
+
+.gallery li {
+	position: relative;
+	overflow: hidden;
+
+}
+
+.gallery li img {
+	width: 100%;
+	height: 100%;
+	object-fit: cover;
+}
+
+.gallery li span {
+	position: absolute;
+	transform: translate(-50%, -50%);
+	color: white;
+	top: 50%;
+	left: 50%;
+	display: flex;
+	justify-content: center; 
+	align-items: center;
+	height: 100%;
+	width: 100%;
+	font-size: 1.5rem;
+	text-align: center;
+	background-color: rgb(0,0,0,0.4);
+}
+
+.gallery li span:hover {
+	opacity: 0;
+}