/****************************************************************
*				Set CSS for screens 1450px wide					*
****************************************************************/

@media screen and (max-device-width: 1450px) and (max-width: 1450px)
{
	
	#sidebar
	{
		margin-top:			5%;			/* When screen is 1450px wide, set sidebar 5% from top margin */
	}
}

/****************************************************************
*				Set CSS for screens 1000px wide					*
****************************************************************/

@media screen and (max-device-width: 1000px), screen and (max-width: 1000px)
{
	#container
	{
		margin-top:			0;			/* Set container 0% from top margin */
		margin-left:		auto;		/* Set container 0% from left margin */
		margin-right:		auto;		/* Set container 0% from right margin */
		width:				100%;		/* Set container to be 100% of screen width */
	}

	header
	{
		top:				0;			/* Set header 0% from top margin */
		position:			fixed;		/* Header will stay persistent on screen */
		width:				100%;		/* Header is 100% of screen width */
		margin-right:		auto;		/* Header is auto-sized from right margin */
		margin-left:		6.2%;		/* Header is 6.2% from left margin */
	}
	
	#logo
	{
		font-size:			3.5em;		/* Set logo font to 3.5em */
		text-align:			left;		/* Set logo to text align left */
	}

	#content
	{
		padding-top:		5%;			/* Put content 5% from top margin */
		margin-left:		50%;		/* Put content 50% from left margin */
		margin-right:		5%;			/* Put content 5% from right margin */
		text-align:			right;		/* Text align content to the right */
		font-size:			3em;		/* Set content font size to 3em */
	}

	#sidebar
	{
		position:			fixed;		/* Make sidebar position persistent on screen */
		margin-top:			10%;		/* Set sidebar 10% from top margin */
		margin-left:		2%;			/* Set sidebar 2% from left margin */
		margin-right:		auto;		/* Set sidebar to auto-size from right margin */
		width:				76%;		/* Set width to be 76% of its size */
		text-align:			left;		/* Align text to left */
		font-size:			1.1em;		/* Set font to 1.1em */
	}
	
	.link
	{
		margin-left:		auto;		/* Set link margins to auto */
		margin-right:		50%;		/* Set link right margin to 50% */
		text-align:			left;		/* Set link text align to left */
		width:				50%;		/* Set width of link to 50% */
	}
	
	.link:hover
	{
		width:				50%;		/* When mouse hovers, do not change width */
	}
	
	#underline
	{
		background-color:	none;		/* Disable underlines and spacers color */
	}
	
	.image
	{
		max-width:			100%;		/* Set image max width to 100% of its size */
		height:				auto;		/* Make height auto-calculate from image width */
	}
	
	.video
	{
		max-width:			100%;		/* Set video max width to 100% of its size */
		height:				auto;		/* Make height auto-calculate from video width */
	}
}