/* =============================
   General Page Styles
   ============================= */
body {
  
}

/* =============================
   Header Styles
   ============================= */
header {
   width: 100%;
   text-align: center;
   backround-color: #ddd;
   padding: 20px;
}

/* =============================
   Navigation Styles
   ============================= */
nav {
float: left;
width: 25%;
padding: 20px;
backround-color:#f2f2f2;
position: fixed;
top: 80px;
left: 0;
height: 100%;
}

nav ul {
list-style-type: none;
padding: 0;
}

nav ul li {
  margin-bottom: 10px;  
}

nav ul li a {
 text-decoration: none;
 color: black; 
}

/* Hover effect for links */
nav ul li a:hover {
 color: red;
}

/* =============================
   Main Content Styles
   ============================= */
main {
 float: right;
 width:70%;
 padding: 20px;
 margin-right: 2%;
}

/* =============================
   Footer Styles
   ============================= */
footer {
 clear: both;
 width: 100%;
 text-align: center;
 backround-color: #ddd;
 padding: 20px;
}