/* LAYOUT */
body {text-align: center} /* IE Hack */
#wrapper {position: relative; max-width: 1024px; margin: 0px auto; text-align: left}
#top {position: relative; height: 80px}
#logo {position: absolute; bottom: 10px; left: 20px}
#slogan {position: absolute; bottom: 10px; right: 20px}
#contents {position: relative; height: 435px}
#left-column {width: 420px}
#infobox {position: absolute; top: 0px; right: 0px; width: 510px; height: 435px}
#picture {position: absolute; top: 17px; right: 0px; width: 550px; height: 400px}

/* WHITE SPACE */
* {margin: 0; padding: 0;}
td {padding-right: 20px;}
h1 {margin-bottom: 0.8em; padding-top: 1.5em}
h2 {margin: 1.2em 0 0.4em}
p {margin-bottom: 0.8em}
#menu ul {padding: 10px 10px}
#menu li {padding: 14px 10px}
#contents {padding: 0 20px}
#contents ul {padding: 5px 0 5px 30px}
#infobox {padding: 0 20px}
#bottom {padding: 15px 20px 15px}
#bottom h2 {margin-top: 0}
#copyright {padding-left: 20px}
.space {margin-top: 2em;}
.smallspace {margin-top: 1em;}

/*
COLORS USED
white			#fff
gray			#53544C
light green		#e6ffd9
middle green	#e2f1c6
dark green		#529e4a
orange			#f60
dark gray		#3C3E33
red				#f33
*/

/* BACKGROUND COLOR AND IMAGES */
* {background: transparent}
input, textarea, select {background: white}
body {background: #eee}
#top, #copyright {background: transparent}
#bottom {background-color: #111}
#contents {background: white url('images/backgrounds/tavle.jpg') right no-repeat}
#menu {background: #111}
#infobox {background: #D3D4CC}

/* TEXT COLOR */
body {color: #3C3E33}
a {color: black}
#menu li, #menu li a:hover, a:hover, #bottom a {color: #ff0000}
#slogan {color: black}
#menu li a, #bottom {color: white}
#copyright, #copyright a {color: #83847C}
#msg {color: red}

/* BORDER */
body, form, div, h1, h2, h3, p, em, ul, li, img, table, tr, td {border: 0}

/* FONT FAMILY */
body {font-family: Verdana, Arial, sans-serif}
h1, h2, #menu li, input, textarea, select {font-family: Arial, Verdana, sans-serif}

/* FONT SIZE */
h1 {font-size: 20px}
h2 {font-size: 15px}
body, textarea {font-size: 13px}
#slogan, #copyright {font-size: 10px}

/* FONT WEIGHT */
* {font-weight: normal}
b, h1, h2, a, #menu li, #msg {font-weight: bold}
#copyright a {font-weight: normal}

/* LINE HEIGHT */
body {line-height: 1.3em;}
#menu li, #slogan {line-height: 1.2}
#copyright {line-height: 1.2}

/* ALIGNMENT */
#slogan {text-align: right}
#menu, #copyright {text-align: center}

/* MISCELLANOUS */
#menu li {display: inline; list-style: none}
#menu li a, #copyright a {text-decoration: none}
h1, h2 {text-transform: uppercase}
em {font-style: italic; font-weight: bold;}
.button {margin-right: 10px; vertical-align: middle;}
#button {color: white; background-color: black; text-align: center; font-family: Arial; font-weight: bold; font-size: 16px; padding: 10px; margin: 0px 0 30px}
#button a {color: white; text-decoration: none}
#button span#red {color: #f00; font-weight: bold}
#button a:hover {text-decoration: underline}
p#imperative {font-style: italic; font-weight: bold; font-size: 90%}
#news {position: absolute; top: 35px; left: 525px;}
#news p {font-size: 150%; font-weight: normal; text-align: center; line-height: 1.5}
#news a {font-size: 70%; color: #ff0000}
#news a:hover {color: black}