/*RESET*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;} body {line-height: 1;}ol, ul{list-style:none;} blockquote, q{quotes:none;} blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;} :focus{outline:0;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse; border-spacing:0;}

/*Main Code for body*/
	
	body{
		font-size: 1.05em;
		line-height: 1.2em;
		font-family: arial;
		background:#191919;
		color:#8D2CD8;
	}
	
	.oof{
		height:100px;
		width:640px;
		border:2px solid red;
	}
	
	
	a{
		color:#8D2CD8;
		font-weight:bold;
		text-decoration:none;
		float:center;
		font-size:25
	}
	
	li:hover{
		color:#8D2CD8;
		text-decoration:underline;
		font-size:1.50em;
		display: inline-block;
		float: right;
		padding: 10px
	}
	
	header{
		background:#191919;
		width:100%;
		height:76;
		position:fixed;
		top:0;
		left:0;
		border-bottom:4px solid #8D2CD8;
	}
	
	#logo{
		margin: 20px;
		float: center;
		width: 200px;
		height: 40px;
		background: dank.png no-repeat center;
		display: block;
	}

	nav{
		float:right;
		padding: 20px;
	}

	#menu-icon{
		display: hidden;
		width: 40px;
		height: 40px;
		background: #4C8FEC url(../images/menu-icon.png);
	}

	a:hover#menu-icon{
		background-color: #444;
		border-radius: 4px 4px 0 0;
	}

	ul{
		list-style: none;
	}

	li{
		display: inline-block;
		float: right;
		padding: 10px    
	}

	.current{
		color: #2262AD;
	}

	section{
		margin: 80px auto 40px;
		max-width: 980px;
		position: relative;
		padding: 20px
	}
	/*
	h1{
		font-size: 1.6em;
		color: #8D2CD8;
		line-height: 1.15em;
		margin: 20px 0 ;
	}

	p{
		line-height: 1.45em;
		margin-bottom: 20px;
	}
	
	/*
	
		
	/*MEDIA QUERY*/
	/*when screen becomes 700px website will switch to mobile setting*/
	@media only screen and (max-width : 700px) {

	header {
	position: fixed;
	}

	#menu-icon {
	display: inline-block;
	}

	/*color of link AREA in mobile mode*/
	nav ul, nav:active ul {
	display: none;
	position: absolute;
	padding: 20px;
	background: gray; /*color of mobile link area*/
	border: 2px solid blue;
	right: 20px; /*spacing from mobile icon*/
	top: 60px; /*spacing from mobile icon*/
	width: 25%; /*width of link area on screen*/
	border-radius: 25px 0 25px 25px; /*rounded corner areas*/
	}

	nav li {
	text-align: center;
	width: 100%;
	padding: 10px 0;
	margin: 0;
	}

	nav:hover ul {
	display: block;
	}

	/*makes the image stay on a side*/*/
	.img_left{
	float:left;
	width:35%;
	margin-top:3px;
	margin-left:5px;
	margin-right:8px;
	border:2px solid #8D2CD8;
	padding:2px;
	}
	
	.img_right{
	float:right;
	width:35%;
	margin-top:3px;
	margin-left:5px;
	margin-right:5px;
	border:2px solid #8D2CD8;
	padding:2px;
	}