<!DOCTYPE html>
<html>
<head>
	<title>INTRO Page</title>
	<style>
		body{
			background-image: url("http://images.all-free-download.com/images/graphiclarge/nostalgic_blue_background_04_hd_pictures_169785.jpg");
			background-size: 70%;
		}
		#BlockMenu{
			height: 50px;
			width: 1100px;
		}
		#BlockMenu ul li{
			list-style: none;
			color: white;
			background-color: #2d2d2d;
			float: left;
			position: relative;
			left: 21%;
			line-height: 60px;
			vertical-align: middle;
			text-align: center;
		}
		#BlockMenu .menuLink{
			text-decoration: none;
			color: white;
			display: block;
			width: 300px;
			font-size: 40px;
			font-weight: bold;
			font-family: "Trebuchet MS", Dotum, Arial;
		}
		#BlockMenu .menuLink:hover{
			color: red;
			background-color: #4d4d4d;
		}

		#topMenu{
			height: 30px;
			width: 850px;
			/*float: right;*/
		}
		#topMenu ul li{
			list-style: none;
			color: white;
			text-shadow: 2px 2px 5px black;
			/*background-color: #2d2d2d;
			background : rgba(0, 0, 0, 0.4);*/
			float: left;
			position: relative;
			left: 80%;
			line-height: 40px;
			vertical-align: middle;
			text-align: center;
		}
		#topMenu .menuLink{
			text-decoration: none;
			color: white;
			display: block;
			width: 120px;
			font-size: 17px;
			font-weight: bold;
			font-family: "Trebuchet MS", Dotum, Arial;
		}
		#topMenu .menuLink:hover{
			color: red;
			background-color: #4d4d4d;
			background : rgba(0, 0, 0, 0.2);
		}
		#back{
			position: absolute;
			top:205%;
			left:100%;
			height: 1070px;
			width: 1250px;
			background: black;
			background : rgba(0, 0, 0, 0.5);
			transform:translate(-50%, -50%)
		}
	</style>
</head>
<body>
	<nav id="topMenu">
		<ul>
			<li><a class="menuLink" href="file:///Users/ju/CURLY-FORTNIGHT/main/main.html#">HOME</a></li>
			<li><a class="menuLink" href="file:///Users/ju/CURLY-FORTNIGHT/introduction/src/1_Introduction/introduction.html">ABOUT</a></li>
			<li><a class="menuLink" href="file:///Users/ju/CURLY-FORTNIGHT/introduction/src/2_LAB/LAB.html">LAB</a></li>
			<li><a class="menuLink" href="#">CURRICULUM</a></li>
			<li><a class="menuLink" href="#">ACADEMY</a></li>
			<li><a class="menuLink" href="#">FACILITY</a></li>
		</ul>
	</nav>
	
	<div style="text-align:center">
		<div id="back"></div>
			<img src="http://www.edujin.co.kr/news/photo/201606/13070_16245_3624.jpg" height= "300px" width = "800px">
		</div>
	</div>

	<nav id="BlockMenu">
		<div style="text-align:center">
			<ul>
				<li><a class="menuLink" href="#">Education</a></li>
				<li><a class="menuLink" href="#">Goal</a></li>
				<li><a class="menuLink" href="#">Career</a></li>
			</ul>
		</div>
	</nav>

	<div>
</div>
</body>
</html>