p
{
	color: white;
	margin-top: 0;
	margin-bottom: 0;
	text-align: center;

	padding: 8px 8px 5px 5px;
}

img
{
	color: white;
}

li
{
	color: white;
	margin-top: 0;
	margin-bottom: 0;
	
	padding: 8px 8px 5px 5px;
}

h3
{
	padding: 0 0 0 10px;
	color: white;
}

header, footer
{
	color: white;
	border:solid;

	text-align: center;
	margin-bottom: 15px;

	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	padding-right: 8px;
}

body
{
	background-color: black;
	margin: 0;
	/*Disable horizontal scroll */
 	/* overflow-x: hidden; */
 	width: 100%;

	background-image: 
            url(/Assets/Pictures/ReapetPattern/PatternMaking_SingleTile_Black.png), /* Top layer */
           
           linear-gradient(to top, black, var(--prime-color), black);

   
       
	background-size: 
           
            350px 350px, 
            200%;       

	background-repeat: 
            repeat, 
            no-repeat; 

	background-attachment: fixed;

}
	
	  
/* 
div
{
	margin: 10px 8px 10px 8px;
	margin-top: 10px;
	margin-bottom: 10px;
}  */

a:link, a:visited
{
	text-decoration: none;	
}

footer
{
	background-color: rgba(0, 0, 0, .35);
}

.web-name
{
	font-size: 35px;
}

.page-container
{
	width: 715px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: 5px;
	/* align-items: space-between; */
	/* margin-left: 10px; */
	/* margin-right: 10px; */
	margin: 25px auto 25px auto;
	/* margin-left: auto;
	margin-right: auto; */
	
}

.page-link
{
	background-color: rgb(255, 0, 128);
	color: white;
	
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
	padding-right: 15px;

	margin-left: 5px;
	margin-right: 5px;
	transition: background-color 1.5s, color 1s;

	cursor: pointer;
}

#languageSelector
{
	position:absolute;
	top:5px;
	right: 5px;
	width: 100px;
	border: 0px;
	color: black;
	/* background-color: var(--prime-color); */
	padding: 5px 0px 5px 2px;
}

img.center
{
	width: 400px;
	display: block;
	
	margin: auto;
	background-image: radial-gradient(rgba(255,225,225, .5) 10% , rgba(0,0,0,0) 70%);
}
 

.small-container
{
	border: solid;
	border-color: white;
	background-color: rgba(0, 0, 0, .75);

	/* margin-left: 10px;
	margin-right: 10px; */
	padding: 5px;
	flex: 1;
}

.small-empty-space
{
	flex: 1;
}

.large-container
{
	border:solid;
	border-color: white;
	background-color: rgba(0, 0, 0, .75);

	padding: 5px;
	flex: 2;
}

.large-empty-space
{
	flex: 2;
}

.quote
{
	margin: 0px 20% 0px 20%; 
	text-align:justify;
}
.clickable
{
	padding: 5px 5px 5px 5px;
	cursor: pointer;
	display: inline;
}

.banner
{
	align-items: center;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: space-between;
	margin-bottom: 40px;
}

.logo
{
	width: 180px;
	margin-left: 15px;
	margin-right: 15px;
	z-index: 2;
}

.background-blur
{
	position: absolute;
	top: 85px;

	background-color: var(--prime-color);
	width: 15px;
	height: 2px;
	border-radius: 00px;
	box-shadow:  0px 0px 20px 25px var(--prime-color);
}
.background2-blur
{
	position: absolute;
	
	top: 80px; 
	width: 300px; 
	height: 25px; 
	
	background-color: black; 
	box-shadow:  0px 0px 20px 25px black;
	
	border-radius: 95px;
	
}
#background-image
{
	background-image: url("/Assets/Pictures/ReapetPattern/PatternMaking_SingleTile_Black.png");

	background-repeat: repeat;

	background-size: 350px;

	margin: -10px 0px;

	/* height: 500px; */
	
	/* padding: -10px; */
}

.side-detail
{
	z-index: 2;
	height: 100px;
	/* background-image: var(--side-detail);
	background-size: 100px; */
}

.name
{
	position: absolute;
	top: 160px;
	z-index: 3;
}

.name-image
{
	height: 80px;
}
 
#navbar-placeholder
{
	position: sticky;
	top:0px;
	z-index: 10;
}

@media screen and (max-width: 750px) 
{
	.page-container
	{
		/* width: 50px; */
		width: auto;
		margin-left: 10px;
		margin-right: 10px;
	}

	.large-empty-space, .small-empty-space
	{
		display: none;
	}

	.page-container
    {
        flex-direction:column;
    }
}

@media  screen and (max-width: 450px) 
{
	.side-detail
	{
		height: 75px;
	}

	img.center
	{
		width: 300px;
	}
	
}