h1{
	font-size: 250%;
}
header{
	text-align: center;
	background-color:  #a7adba;
	color: #f8f8f8;
	padding: 1%;
	margin-left: 1%;
	margin-right: 1%;
	background-image: url('flywheel.jpg');
	background-size: 100%;
	
}

nav a{
	display: inline-block;
	text-align: center;
	background-color: transparent;
	height: 20%;
	color: #011f4b;
	margin: 1%;
	padding: 1%;
	text-decoration : none;
	border-radius: 20px;
	font-size: 130%;
	font-weight: bold;

}

a:hover{
	background-color: #91bdd0;
}
a:focus
{
	background-color: #91bdd0;
}

.active{
	background-color: #f8f8f8;

}

body{
	margin-left:1%;
	margin-right: 1%;
	padding: 1%;

}

img{
	width: 70%;
	height: 30%;
	display: block;
	margin-top: 4%;
	border-style: solid;
	border-color: #444444;
	margin-left: 1%; 
	transition: border-radius, 1s, transform 1s;

}
img:hover{
	border-radius: 50%;
	transform: rotate(360deg);
}
aside{
	display: inline-block;
	float: left;
	background-color: #f36b26;
	margin-left : 1%; 
	margin-top: 1%;
	width:20%;
	padding-left: 3.5%;
	padding-bottom: 1%;

}
a aside: focus
{
	border-radius: 50%;
}


section{
	display:inline-block;
	float:right;
	width: 70%;
}

/*Assignment starts from here*/
table,td,th{
	border: 1px solid black;
}
th{
	border: 3px solid red;
	height: 50px;
}
table{
	margin-left: 7%;
	width: 80%;
}

th:first-child{
	text-align: left;
	border-radius: 20px 0px 0px 0px;
	padding-left: 10px;
}
th:last-child
{
	border-radius: 0px 20px 0px 0px;
}

th{
	text-align: center;
	background-color: #357c06;
	font-weight: bold;
	color: white;
}

tr td:first-child{
	text-align: left;
}

tr td{
	background-color: #acea83;
	text-align: center;
}

td{
	padding-left: 10px;
}
tr:first-child{
	opacity: 1;
}
tr{
	opacity: 0.6;
}

tr:hover
{
	opacity: 1;

}