body {
    text-align: center;
    background-color: #cccccc;
    font-family: "comic sans MS", sans-serif;
}

h1, h2, h3{
    color: #0066cc;
}

.content {
    background-color: white;
    width: 50em;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}

header, aside, main, footer{padding: 8px;}

header h1 {
    color: white;
}

header {
    background-color: #808080;
}

aside.left {
	background-color: #4da6ff;
    width: 14em;
    float: left;
}

footer {
	background-color: grey;
    border-top-style: dotted;
    clear: both;
}

main {
    background-color: white;
    margin-left: 15em;
    border-left-style: dotted;
}

nav {
    overflow: hidden;
    background-color: #555;
}

nav a {
    float: left;
    color: white;
	background-color: #0059b3;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
}

nav a:hover {
    background-color: #ddd;
    color: black;
}

.line {
	border: 1px solid;
}

.category {
	padding: 3px;
	background-color: #4da6ff;
	height: 100px;
	margin: 5px 0px;
}

.author {
	float: right;
}

.active {
	background-color: lightblue;
	color: black;
}



@media only screen and (max-width: 800px) {
   aside {
       display: none;
   }
   .content {
       margin: 0px;
       width: 100%;
   }
   main {
       margin: 0px;
       border: none;
   }
}