/*
 * CSS Styles for Project 1
 * Sarah Menard - 301087605
 * Alex Salaveria - 301132524
 * Lab E101
 */

html, body {
	/* "Avant Garde" Font Stack courtesy of CSS-Tricks */
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	font-weight: 100;
	font-size: 12px;
	line-height: 1.3333333333em;
	color: #333333;
	background-color: #f4f0ea;
	background-image: url("./extra_clean_paper_@2XEDIT.png");
	background-size: 370px;
}


div.MainContainer {
	margin: 0 auto;
	width: 950px; 
	padding: 50px;


}

/*******************************************************
 * Code for the left coloumn. Includes positioning and 
 * styling for the header and iamges.
 ******************************************************/

div.LeftContent {
	margin-top: 10px;
	position: relative;
	float: left;
	width: 475px;
}

div.Title2{
	position: relative;
	float: left;
}

div.Title3{
	float: left;
}

	/* Styling for the text of the Title*/
	header h1{
		font-weight: 100;
		font-size: 38px;
		padding: 0;
		margin: 0;
		margin-bottom: 15px;
	}

	header h2{
		font-weight: 300;
		font-size: 38px;
		color: #2B3990;
		padding: 0;
		padding-top: 8px;
		padding-right: 5px;
		margin: 0;
	}

	header h3{
		font-weight: 100;
		font-size: 13px;
		padding: 0;
		margin: 0;
	}

div.images{
	clear:left;
	padding-top: 30px;
}

	/* Styling for the images (except for the index iamge) */
	img.image {
		margin-top: 10px;
		margin-right: 5px;
		margin-bottom: 5px;
		box-shadow: 2px 1.5px 4px #B5B0A9;
	}

	img.awkward{
	}


/*******************************************************
 * Code for the right coloumn. Includes positioning and 
 * styling for the navigation and text. 
 ******************************************************/

div.RightContent {
	padding-top: 12px;
	position: relative;
	float:left;
	width: 425px;
	margin-left: 25px;
	margin-bottom: 50px;
}

nav ul{
  list-style-type: none;
  margin: 0;
  padding-left: 0;
  margin-bottom: 10px;
  display: inline-block;

}

nav li{
	display: inline-block;
	margin:0;
	font-size: 13px;
}

/* This is the positioning for the navigation links. 
 * Unfortunately this is one of the only ways I could get the 
 * navigation to be justified (each link is a different width,
 * if the had been the same this would have been a lot simpler)
 * its messy, but it works. */

div.home{
	width: 90px;
}
div.cms{
	width: 106px;
}
div.assesment{
	width: 0px;
}
div.test{
	width: 140px;
}
	/* Styling for the navigation */
	a:link, a:visited {
		text-decoration:none;
		color: rgba(128, 130, 133, 0.85);



		
	}
		a:hover, a.current:link, a.current:visited {
			color: #0068AD;
			font-weight: bold;
		}


div.Text {
	background-color: #FFFFFF;
	box-shadow: 3px 2px 5px #B5B0A9;
	margin: 0px;
	padding-top: 7px;
	padding-left: 17px;
	padding-right: 17px;
	padding-bottom: 5px;
}

#HomeText{
	background-color: #FFFFFF;
	box-shadow: 3px 2px 5px #B5B0A9;
	margin: 0px;
	padding-top: 7px;
	padding-left: 17px;
	padding-right: 17px;
	height: 300px;
}

h1 {
	font-weight: 500px;
	font-size: 20px;
	padding-bottom: 8px;
}

h2{
	font-size: 16px;
	color: #0068AD;
	font-weight: bold;
}

p {
	font-size: 12px;
	line-height: 1.6;
}

p.p2 {
		position: relative;
		float;left;
		display: inline;
		font-weight: bold;

}