body {
	background: white;
}

/* Header */

header {
	background: black;	
}

header h1 {
	line-height: 2em;
	color: white;
	padding-left: 20px;
}

header a h1 {
	line-height: 2em;
	color: white;
	padding-left: 20px;
	text-decoration: none;
}

header a:link {
    color: white;
    text-decoration: none;
}
header a:visited {
    color: white;
    text-decoration: none;
}
header a:hover {
    color: white;
    text-decoration: underline;
}
header a:active {
    color: white;
    text-decoration: none;
}



/* Navigation */

nav {
	display: block;
	background: darkred;
}

nav li {
	display: inline;
}

nav li a {
	line-height: 1.8em;
	font-size: 1.2em;
	color: white;
/*	border-right: 1px solid; Doesn't work properly */
	list-style-type: none;
	text-decoration: none;	
	padding: 10px;
}

.webindex {
	background: red;
}

nav li a:hover {
	color: darkred;
	font: bolder;
	background: white;
}

/* Link columns */
.wrapper {
	display: block;
	/*
	width: 90%;
	max-width: 1230px;
	margin: auto;
	*/
}

.linkblock {
	width: 300px;
	margin-bottom: 20px;
	padding-top: 0;
}

.linkblock h2 {
	background-color: black;
	color: white;
	font-size: 1.2em;
	margin-top: 0;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 10px;
	line-height: 1.8em;
}

.linkblock ul {
	list-style-type: none;
	margin: 0;
	padding-left: 0px;
	padding-top: 0px;
}

.linkblock li a {
	line-height: 1.3em;
	font-size: 1em;
	color: black;
	padding-left: 5px;
	padding-right: 5px;
}

/* Footer */

footer {
	background: black;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-bottom: 3px;
}

footer p {
	padding-left: 20px;
	font-size: 1.2em;
	line-height: 2.0em;
	color:white;
}



@media only screen and (max-width:650px) {
    header {
    	width: 300px;
    	margin: auto;
    }

    nav {
    	width: 300px;
    	margin: auto;
    }

    .wrapper {
    	width: 300px;
    	margin: auto;
    }

    footer {
    	width: 300px;
    	margin: auto;
    }
}

@media only screen and (max-width:930px) and (min-width: 651px) {
    header {
    	width: 610px;
    	margin: auto;
    }

    nav {
    	width: 610px;
    	margin: auto;
    }

    .wrapper {
    	width: 610px;
    	margin: auto;
    }    

    footer {
    	width: 610px;
    	margin: auto;
    }
}

@media only screen and (max-width:1230px) and (min-width: 931px) {
    header {
    	width: 920px;
    	margin: auto;
    }

    nav {
    	width: 920px;
    	margin: auto;
    }

    .wrapper {
    	width: 920px;
    	margin: auto;
    }    

    footer {
    	width: 920px;
    	margin: auto;
    }
}

@media only screen and (min-width: 1231px) {
    header {
    	width: 1230px;
    	margin: auto;
    }

    nav {
    	width: 1230px;
    	margin: auto;
    }

    .wrapper {
    	width: 1230px;
    	margin: auto;
    }    

    footer {
    	width: 1230px;
    	margin: auto;
    }
}