Theme 30

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>theme</title>

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Luxurious+Roman&display=swap" rel="stylesheet">

<style>

body{
background-color: #988B8B;
background-image: url('');
}

#all{
background-color: #fff;
width: 420px;
margin: 0 auto;
}

#header{
width: 418px;
height: 489px;
background-color: #fff;
border-width: 1px 1px 0px 1px;
border-style: solid;
border-color: #B2BFAA;
background-image: url('https://i.imgur.com/kPIVb5l.png');
}

#nav{
color: #a2b09b;
}

#nav ul{
margin: 0px;
padding: 0px;
list-style-type: none;
background-color: #fff;
opacity: 0.8;
text-align: center;
}

#nav li{
display: inline;
letter-spacing: 3px;
font-size: 14px;
}

a{
text-decoration: none;
color: #a2b09b;
}

a:visited{
color: #a2b09b;
}

a:hover{
font-style: italic;
}

a:active{
font-style: italic;
font-weight: bold;
color: #a2b09b;
}

#title{
font-weight: normal;
letter-spacing: 4px;
margin: 0px;
text-transform: uppercase;
text-align: right;
font-size: 28px;
font-family: 'Luxurious Roman', serif;
color: #fff;
text-shadow: 0px 0px 8px #fff;
}

#main{
background-color: #fff;
}

h2{
font-weight: normal;
margin: 0px;
background-color: #B2BFAA;
line-height: 12px;
letter-spacing: 4px;
font-size: 21px;
font-family: 'Luxurious Roman', serif;
padding-left: 5px;
color: #fff;
}

.maincontent{
padding: 15px;
font-size: 13px;
text-align: justify;
letter-spacing: 1px;
color: #544b4b;
}

#credit a{
text-decoration: none;
color: #d9d0d0;
}

#credit a:visited{
color: #d9d0d0;
}

#credit a:hover{
font-style: italic;
}

#credit a:active{
font-style: italic;
font-weight: bold;
}

::-webkit-scrollbar{
width: 8px;
}

::-webkit-scrollbar-track{
background-color: transparent;
}

::-webkit-scrollbar-thumb{
background-color: #706868;
}

#credit{
font-size: 12px;
position: fixed;
bottom: 0;
right: 0;
}

</style>

</head>

<body>

<div id="all">

<div id="header">
<div id="nav">
<ul>
<li>[<a href="URL HERE">home</a> |</li>
<li><a href="URL HERE">about</a> |</li>
<li><a href="URL HERE">gallery</a> |</li>
<li><a href="URL HERE">blog</a> |</li>
<li><a href="URL HERE">links</a> |</li>
<li><a href="URL HERE">misc</a>]</li>
</ul>
</div>

<h1 id="title">title here</h1>

</div>

<div id="main">
<h2>header here</h2>

<div class="maincontent">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam id justo ut sapien lobortis ultrices. Aliquam bibendum feugiat tellus, at viverra diam dapibus id. Sed maximus mauris dictum lobortis mollis. Aliquam magna lacus, placerat eu consectetur ut, condimentum non dolor.</p>

<p><a href="URL HERE">Interdum et</a> malesuada fames ac ante ipsum primis in faucibus. Suspendisse metus ex, tristique sit amet sollicitudin eu, hendrerit vel lorem. Duis elementum turpis lacus, sit amet ullamcorper lorem tincidunt sollicitudin. Donec et sapien a odio vehicula auctor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

<p>Nulla euismod urna id lobortis laoreet. Donec fermentum maximus massa, ut scelerisque turpis scelerisque eu. Nam gravida lacus eu libero gravida facilisis. Donec sed convallis risus, ac faucibus eros. Ut scelerisque placerat felis, vitae rhoncus tortor consectetur sit amet. Suspendisse faucibus quam tortor, et ultrices sem sollicitudin quis. Proin nisl libero, iaculis eget orci in, tristique ultricies urna.</p>
</div>

</div>

</div>

<div id="credit"><a href="https://repth.neocities.org/index.html">©repth</a></div>

</body>

</html>