@font-face {
	font-family:"Tiny5";
	src: url("/../fonts/Tiny5/Tiny5-Regular.ttf") format("truetype");
}

@font-face {
	font-family:"Bytesized";
	src: url("/../fonts/Bytesized/Bytesized-Regular.tff") format("truetype");
}

@font-face {
	font-family: "Jacquarda9";
	src: url("/../fonts/Jacquarda_Bastarda_9_Charted/JacquardaBastarda9Charted-Regular.ttf") format("truetype");
}


body {
    background-color: #303446; 
    color: #f4b8e4;
		font-family: 'Arial', sans-serif; 
		text-align: left;
		font-size: large;
		/*padding: 20px;*/
}

.post {
	margin-left: 30%;
}


h3 {
	text-align: left;

}

a:visited {
	color: #99D1DB;
}

a:unvisited {
	color: #99D1DB;
}


/*colors #81C8BE #99D1DB #303446 #f4b8e4 */
.site-header {
	display: flex;
	gap: 12px;
	align-items: center;
	text-align: center;
	padding: 16px 16px;
	margin-left: 30%;
}

nav {
	display: flex;
	gap: 24px;
	margin-left: 1em;
}

nav a {
	color: #f4b8e4;
	font-size: 1.2rem;
	font-family: "Tiny5";
	text-decoration: none;
}

nav a:hover{
	color:#99D1DB;
}


.logo img {
	width: 64px;
	height: 64px;
	display: block;
}

.photo-grid {
	display: flex;
  flex-wrap:wrap;	
	justify-content: flex-start;
	flex-direction: row;
	gap: 1vw;

}

.photo-grid img {
	max-width: 600px;
	width: 33vw
}



h1 a{
	color:#99D1DB;
}

h3{
	color:#81C8BE;
}

h1 a:visited{
	color:#81C8BE;
}

h3 a:visited{
	color:#81C8BE;
}

h1{
	margin: 0;
}