body
{ border:10px solid black;
margin:0;
background:#ffffff;
font-family:'Work Sans',sans-serif;
font-weight:800;
}
.header{
background-color:linen;
padding:20px;
text-align:center;}

header::after{
content:";
display:table;
clear: both;
}

.logo
{
float:left;
padding:10px 0;
}

nav{
float:right;
}

nav ul{
margin:0;
padding:0;
list-style:none;
}
nav li{
display:inline-block;
margin-left:70px;
padding-top:23px;
position:relative;
}

nav a{
color:#444;
text-decoration:None;
text-transform:uppercase;
font-size:14px;
}
nav a:hover{
color:#9B1E7263;
}


nav a::before{
content:"";
display:block;
height:5px;
background-color:rgb(255, 255, 255);
position :absolute;
top:0;
width:0%;
transition:all ease-in-out 250ms;
}

nav a:hover::before{
width:100%;
}


.container{

width:80%;
margin:0 auto;
}

.btn {
    font-size: 20px;
    background-color: lightskyblue;
    border-radius: 10px;
    color: white;
    border-color: linen;
    
}
.middle{
background-image:url('Kerala.jpg');
padding:200px;
text-align:center;
opacity:.9;
color:white;
}
.content
{
background-color:black;
opacity:.7;
font-size:30px;
border:2px solid red;
font-family:"Times New Roman";
padding:20px;
color:white;
}
.wrapper
{
padding:50px;
text-align:center;
background-color:white;
width:1300px;
height:2800px;
border:1px solid black;
opacity:0.9;
}
.footer{
padding:15px;
font-size:20px;
background-color:lightblue;
text-align:center;
}

.styled-table{
border-collapse:collapse;
margin:25px;
font-size:.9em;
font-family:sans-serif;
min-width:400px;
box-shadow:0 0 20px rgba(0,0,0,.15);
}

thead tr
{ background-color:#009879;
color:#ffffff;
text-align:center;
}

th,td{
padding:12px 15px;}

tr{
border-bottom:1px solid #dddddd;}

tr:nth-of-type(even)
{
background-color:#f3f3f3;}

tr:last-of-type{
border-bottom:2px solid #009879;
}
<!-- lets make the active row look different -->
tr:active-row
{
font-weight:bold;
color:#009879;
}
tr:hover
{background-color:#3fba5c;}