<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title 2</title>
<link rel="stylesheet" href="../fonts/SchibstedGrotesk/style.css"/>
<style>
body {
margin: 0;
font-family: "Schibsted Grotesk";
}
* {
box-sizing: border-box;
}
#page {
width: 9.25in;
height: 12.25in;
/*padding: 15mm;*/
background-color: lightblue;
display: flex;
flex-direction: column;
overflow: hidden;
background-image: url(../assets/tree-and-sky-color-blurred-lightened.jpg);
background-size: cover;
}
.poem {
font-size: 28pt;
text-align: center;
flex: 1;
display: flex;
justify-content: center;
align-items: center;
font-weight: 500;
line-height: 1.5;
text-shadow: .03em .03em #aaaaaa;
}
.image {
flex: 1;
display: inline;
overflow: hidden;
}
.image img {
width: 100%;
height: 100%;
object-fit: cover;
}
</style>
</head>
<body>
<div id="page">
<div class="poem">
I look up to the Heavens<br />
to see the stars live and die<br/>
while sitting on lonely thrones<br/>
in their castles in the sky<br/>
</div>
<!-- <div class="image">-->
<!-- <img src="../assets/battlestation-grayscale.jpeg" />-->
<!-- </div>-->
</div>
</body>
</html>