@font-face
{
  font-family: 'atlantis';
  src: url(https://fraeddic.neocities.org/fonts/specimen_files/atlantis-webfont.woff);
}

@font-face
{
  font-family: 'connection serif';
  src: url(https://fraeddic.neocities.org/fonts/specimen_files/connectionserif-webfont.woff);
}

h1
{
    color: #44EAFC;
    font-size: 60px;
    font-family: Trebuchet MS;
    text-shadow: 4px 4px blue;
}

body
{
    background-color: black;
    background-image: url("https://fraeddic.neocities.org/images/abstract3.gif");
    color: white;
    margin: 0; /* Add margins to the body */
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-right: 10%;
    padding-left: 10%;
    padding-top: 1%;
    padding-bottom: 1%;
    cursor: url("https://fraeddic.neocities.org/images/fraeddic's cursor.png"), auto;
}

hr
{
    border-top: 3px dotted blue;
    border-bottom: 3px dotted purple;

}
    
h2
{
    color: white;
    font-family: 'atlantis';
    text-shadow: 3px 3px blue;
}

h3
{
    color: white;
    font-family: 'atlantis';
    text-shadow: 3px 3px purple;
    font-size: 40px;
}

p
{
    color: white;
    font-family: 'connection serif';
    font-size: 16px;
}
    
a
{
    color: #44EAFC;
    font-family: 'connection serif';
    font-size: 16px;
    text-shadow: 0 0 5px blue;
}

.site-header
{
		text-align: center;
		padding: 40px;
		height: 90px;
}

.site-main
{
		display: flex;
		flex-grow: 1; /* Allow main to grow and take up space */
}

.site-nav
{
		width: 15%; /* Set the width of the navbar */
		background-color: #030140;
		padding: 20px;
		background-image: linear-gradient(to right, #030140 , #1b004a);
		border-left: 2px dashed purple;
		border-right: 2px dashed blue;
		border-top: 2px dashed blue;
		border-bottom: 2px dashed purple;
}

.site-nav ul
{
		list-style: none;
		padding: 0;
		margin: 0;
}

.site-nav ul li
{
		margin-bottom: 10px;
}

.site-nav ul li a
{
		color: #44EAFC;
		text-decoration: none;
}

.content-area
{
		flex-grow: 1; /* Content area takes up remaining space */
		overflow-y: automatic; /* Enable vertical scrolling */
		padding: 20px;
		padding-left: 8%;
		padding-right: 8%;
		margin-left: 1%;
		background-color: #141121;
		border-top: 2px dashed blue;
		border-left: 2px dashed purple;
		border-right: 2px dashed blue;
		border-bottom: 2px dashed purple;
}

.site-footer
{
		text-align: center;
		padding: 10px;
		border-top: 2px dashed purple; /* Add a subtle divider */
		border-bottom: 2px dashed blue;
		background-color: #111;
		background-image: linear-gradient(#030140, #1b004a);
		border-left: 2px dashed purple;
		border-right: 2px dashed blue;
		margin-top: 1%;
}

.sitepath-container:
{
	background-color: white;
	padding: 2px;
	position: fixed;
}

.sitepath
{
	background-color: blue;
	color: white;
	padding: 2px 2px;
	border: black;
	border-radius: 5px;
	font-family: 'connection serif';
	font-size: 16px;
	cursor: url("https://fraeddic.neocities.org/images/fraeddic's cursor.png"), auto;
}

.sitepath:hover
{
	background-color: #44EAFC;
	box-shadow: 0 5px 10px black;
}

.extras-button
{
	background-color: yellow;
	color: black;
	padding: 10px 20px;
	border: black;
	border-radius: 5px;
	font-family: 'connection serif';
	font-size: 16px;
	cursor: url("https://fraeddic.neocities.org/images/fraeddic's cursor.png"), auto;
}

.extras-button:hover
{
	background-color: white;
	box-shadow: 0 5px 10px black;
}