@font-face {
  font-family: 'Lato';
  src:	url('./Lato-Regular.eot');
  src:	url('./Lato-Regular.woff2') format('woff2')
	,	url('./Lato-Regular.woff') format('woff')
	,	url('./Lato-Regular.eot') format('embedded-opentype')
	,	url('./Lato-Regular.ttf') format('truetype');
}

:root
{
	--CornerRadius: 10px;
	--DarkBar: #d0a98f;
	--TextMain: #4d243d;
	--TextHover: #B55590;
	--Background: #cac2b5;
	--Font: "Lato";
}

html
{
	min-height		: 100%;
	padding-bottom	: 1px;
	background-color : var( --Background );
	color			: var( --TextMain )
}

div.Body
{
	margin     		: auto;
	padding-top		: 25px;
	padding-bottom	: 25px;
	width      		: 1000px;
}

div.Header
{
	padding-left	: 15px;
	font-family		: var( --Font );
	width			: 990px;
	font-weight		: bold;
}

div.Footer
{
	font-family			: var( --Font );
	background-color	: var( --DarkBar );
	color				: var( --TextMain );
	width				: 1000px;
	padding				: 0px;
	height				: 48px;
	display				: table;
	border-radius		: var( --CornerRadius )
}

div.FooterInfo
{
	width				: 400px;
	height				: 44px;
	font-size			: 14px;
	padding-left		: 8px;
	padding-bottom		: 6px;
	display				: table-cell
}


div.Content
{
	padding				: 10px;
	font-family			: var( --Font );
	font-size			: 25px;
	width				: 980px;
}

div.Content td
{
	padding				: 2px;
	font-family			: var( --Font );
	font-size			: 25px;
	border				: 1px solid black;
}

div.Content a
{
	color				: darkred;
	text-decoration		: underline
}

div.Content a:hover
{
	color				: darkred;
	text-decoration		: none
}

div.Content p
{
	text-indent			: 30px
}

div.Navigation
{
	height				: 20px;
	padding-left		: 10px;
	padding-top			: 15px;
	padding-bottom		: 15px;
	font-family			: var( --Font );
	background-color	: var( --DarkBar );
	width				: 990px;
	font-size			: 20px;
	color				: white;
	text-align			: left;
	border-radius		: var( --CornerRadius );
	font-weight			: bold;
}

div.Navigation a
{
	color				: var( --TextMain );
	font-weight			: bold;
	text-decoration		: none
}

div.Navigation a:hover
{
	color				: var( --TextHover );
	font-weight			: bold;
	text-decoration		: none
}

div.Categories
{
	font-family			: var( --Font );
	width				: 860px;
	background-color	: var( --DarkBar );
	height				: 50px;
	padding-top			: 10px;
	padding-left		: 140px;
	border-radius		: var( --CornerRadius );
	font-weight			: bold;
}

div.Category
{
	width				: 180px;
	height				: 25px;
	float				: left;
	padding-top			: 7px;
	padding-bottom		: 8px;
	font-size			: 25px;
	text-align			: center;
	background-color	: var( --DarkBar );
	color				: var( --TextMain );
	border-radius		: var( --CornerRadius );
	font-weight			: bold;
}

div.Category:hover
{
	width				: 180px;
	height				: 25px;
	float				: left;
	padding-top			: 7px;
	padding-bottom		: 8px;
	font-size			: 25px;
	text-align			: center;
	background-color	: var( --TextMain );
	color				: var( --DarkBar );
	border-radius		: var( --CornerRadius );
	font-weight			: bold;
}

img
{
	border-radius		: 10px;
}

div.GalleryRow
{
	justify-content	: center;
	display 		: flex;
	align-items		: center;
}

div.GalleryRow img
{
	border-radius	: 5px;
	padding			: 10px;
}

div.DocumentLink
{
	width				: 150px;
	height				: 35px;
	padding-top			: 9px;
	padding-left			: 15px;
	padding-bottom			: 4px;
	font-size			: 25px;
	background-color		: var( --Background );
	color				: var( --TextMain );
	border				: black;
	border-radius			: var( --CornerRadius );
	font-weight			: bold;
}

div.DocumentLink:hover
{
	width				: 150px;
	height				: 35px;
	padding-top			: 9px;
	padding-left			: 15px;
	padding-bottom			: 4px;
	font-size			: 25px;
	background-color		: var( --TextMain );
	color				: var( --Background );
	border-radius			: var( --CornerRadius );
	font-weight			: bold;
}

div.DocumentLink a
{
	color				: var( --TextMain );
	font-weight			: bold;
	text-decoration		: underline
}

div.DocumentLink:hover a
{
	color				: var( --Background );
	font-weight			: bold;
	text-decoration		: underline
}

div.DirectoryLink
{
	width				: 970px;
	height				: 35px;
	padding-top			: 8px;
	padding-left		: 10px;
	padding-bottom		: 5px;
	font-size			: 25px;
	background-color	: var( --Background );
	color				: var( --TextMain );
	font-weight			: bold;
	border				: black
}

div.DirectoryLink:hover
{
	width				: 970px;
	height				: 35px;
	padding-top			: 8px;
	padding-left		: 10px;
	padding-bottom		: 5px;
	font-size			: 25px;
	background-color	: var( --TextMain );
	font-weight			: bold;
	color				: white
}

div.DirectoryLink a
{
	color				: var( --TextMain );
	font-weight			: bold;
	text-decoration		: underline;
}

div.DirectoryLink:hover a
{
	color				: var( --Background );
	font-weight			: bold;
	text-decoration		: underline
}

div.LinksSeparator
{
	width				: 970px;
	height				: 5px;
}

div.SocialMedia
{
	padding-right		: 10px;
}

div.SocialMediaLink
{
	float				: right;
	padding-left		: 5px;
	padding-top			: 10px;
}

div.SocialMediaLink img
{
	width				: 48px;
	background-color	: lightgrey;
	border-radius		: 7px;
}