body{background-image: url('images/green.jpg');}
#wrapper
{
	
	width:100%;
	height:100%;
	background-color:transparent;
	margin:auto;
}

#header
{
	width:70%;
	height:10%;
	background-color:DarkTurquoise;
	margin:auto;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
}

#menu
{
	width:70%;
	height:4%;
	background: linear-gradient(to top, #dcdcdc 0%, #ffffff 100%);
	margin:auto;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#content
{
	width:70%;
	height:62%;
	 background: linear-gradient(to bottom, #dcdcdc 0%, #ffffff 100%);
	margin:auto;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#footer
{
	width:70%;
	height:6%;
	background-color:FireBrick;
	margin:auto;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#navigation ul
{
	list-style:none;
	margin:0;
	padding:0;
	overflow: hidden;
}

#navigation ul li
{
	float:left;
	width:14%;
}

#navigation ul a
{
	display:block;
	text-decoration:none;
	color:Black;
	text-align:center;
	padding: 7% 6%;
	font-size:14px;
}

#navigation ul li a:hover
{
	background-color:DeepPink;
	color:black;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


@-ms-viewport{
  width: device-width;
}

#menu-container
{
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transform: scale(1) translate(-50%); /* Scaled down for a better Try-it experience (change to 1 for full scale) */
	transform: scale(1) translate(-50%); /* Scaled down for a better Try-it experience (change to 1 for full scale) */
	left: 50%;
	position: absolute;
	width: 1920px;
	height: 1080px;
	border-width: 24px 24px 80px;
	background-color:DimGray;
	font-family: arial;
	color: gray;
}
