/************************************************
*		Fonts, Page Features, Div Setting		*
************************************************/

@font-face {
	font-family: 'bodoniMTBlack';
	src: url('fonts/bodoni-mt-black-italic.ttf') format('truetype');
	font-weight: normal;
	}

@font-face {
    font-family: 'bodoniMT';
    src: url('fonts/bodoni-mt-italic.ttf') format('truetype');
}

@font-face {
    font-family: 'guardian';
    src: url('fonts/Guardian Egyptian-Light.otf') format('opentype');
}

#container
{
	margin-left:		auto;							/* Set left margin to auto */
	margin-right:		auto;							/* Set left margin to auto */
	width:				100%;							/* Make containter take up 100% of page width */
}

body
{
	background-color:	#EAEAEA;						/* Set page's background color */
}

/************************************************
*			Headers, Footers, Logo, Divs		*
************************************************/

header
{
	position:			fixed;				/* Make header position fixed */
	margin-top:			1%;					/* Keep header 1% from top margin */
	margin-left:		1%;					/* Keep header 1% from left margin */
	width:				20%;				/* Make header size 20% of page */
}

footer
{

	font-size:			.7em;				/* Set footer font size */
	text-align:			center;				/* Set footer text alignment */
	width:				100%;				/* Set footer width to 100% of page                                     */
}

#logo
{
	font-family:		'bodoniMTBlack';				/* Set logo font to vcr */
	font-size:			2em;				/* Set logo font size to 2em */
	text-align:			right;				/* Set logo text alignment to right */
}

#underline
{
	text-align:			center;				/* Set div to center within window */
	position:			relative;			/* Position div relative to other divs */
	width:				60%;				/* Make width 60% of page */
	height:				1px;				/* Make height 1px */
	background-color:	black;				/* Set color to black */
}

/************************************************
*			Navigation, Content, Links			*
************************************************/

#sidebar
{
	font-family:		'bodoniMT';				/* Set sidebar font to vcr */
	position:			fixed;				/* Make sidebar position fixed */
	margin-top:			4%;					/* Position 4% from top margin */
	margin-left:		1%;					/* Position 1% from left margin */
	margin-bottom:		80%;				/* Position 80% from bottom margin */
	text-align:			right;				/* Position text to the right */
	font-size:			.45em;				/* Set sidebar font to .45em */
	width:				20%;				/* Set width to 100% of page */
}

#content
{
	font-family:		'guardian';			/* Set content font to proFont */
	padding-top:		4.5%;				/* Set positon from top 4.5% */
	margin-left:		25%;				/* Position 25% from left margin */
	margin-right:		5%;					/* Position 5% from margin right */
	text-align:			left;				/* Align text to left */
}

.link
{
	list-style-type:	none;				/* Remove list decoration */
	text-align:			right;				/* Align text to right */
	-webkit-transition:	width 1s;			/* Import webkit transition to change width in 1 second */
	transition:			width 1s;			/* Set transition to change width in 1 second */
	width:				100%;				/* Set width as 100% of div */
}

.link:hover
{
	width:				95%;				/* On hovering over link class, change width to 95% of current width */
}

/************************************************
*		General font and typeset changes		*
************************************************/

a
{
	text-decoration:	none;				/* Set every link to have no text decoration */
	color:				black;				/* Set every link color to black */
}

a:hover
{
	color:				gray;				/* When hovering over a link, change the color to gray */
}

.title
{
	font-size:			1em;				/* Set headings with title class to a size of 1em */
}

.attribution
{
	font-size:			.8em;				/* Set text with an attribution class to .8 em */
}

p
{
	font-size:			.9em;				/* Set paragraph size for page to .9em */
}

.external
{
	color:				#468499;			/* Set color for links of external class */
}

.image
{
	max-width:			70%;				/* Set size of image to 70% of container */
	height:				auto;				/* Determine height from width */
}

.video
{
	max-width:			70%;				/* Set size of video to 70% of container */
	height:				auto;				/* Determine height from width */
}