
.roboto-<uniquifier > {
	font-family: "Roboto", sans-serif;
	font-optical-sizing: auto;
	font-weight: <weight>;
	font-style: normal;
	font-variation-settings: "wdth" 100;
}
.thumbnail-grid {
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); /* Adapts to screen size */
	gap: 15px; 
}

	.thumbnail-grid img {
		width: 100%;
		aspect-ratio: 1 / 1;
		object-fit: cover;
		display: block;
		border-radius: 8px; /* Optional for rounded corners */
		opacity:0.6;
		border:1px solid grey;
	}
	.thumbnail-grid img:hover{
		
		opacity: 1.0;
		z-index:1;
	}
	 p > img {
		 border-radius:10px;
		 margin:5px;
	 }
	 ul > p {
		 padding:1em;
	 }

	 body{
		 font-family:Roboto,sans-serif;
		 font-weight:300;

	 }
	 h1,h2,h3,h4,h5,h6{
		 font-weight:900;
		 color:rgb(29, 102, 157);
	 }
	 a {
		 color:rgb(42, 122, 220);
		 text-decoration:none;
	 }

.navbar .nav-link {
	color: white;
}

	.navbar .nav-link:hover {
		color: #f8f9fa; /* Slightly lighter white */
	}
