/* Main layout components */
body {font-family: Tahoma, Verdana, sans-serif; font-size: 80%; padding-bottom: 1.5em; margin: 0.5em;}
#header {margin:0; padding: 0; background: url(/assets/top.png) top repeat-x; font-size:100%;}

/* Menu */
div.menu {margin: 0 0 0 0; position: relative; top: -1ex;}
ul.menu	{display: block; margin: 0; padding: 0 0 0.5ex 0; line-height: 4ex; z-index:-1;}
ul.menu li {list-style-type: none; display: inline; margin: 0; padding: 1ex 0;}
ul.menu li a {color: white; font-weight: bold; font-family: Tahoma, sans-serif;
	padding: 1ex; border: 1px solid white; margin: 0;}
ul.menu li a.selected {border-width: 0; margin-left: 1px; margin-right: 1px; text-decoration: none;}
ul.sub.menu {margin: 1px 0 0 5ex; font-size: 75%;}
ul.sub.menu li a.selected {background-color:white;}
ul.sub.menu.webdesign li a.selected {color: #800000; border: 1px solid #800000}
ul.sub.menu.resources li a.selected {color: #0000C0; border: 1px solid #0000C0}
#homelink, .homelink {background-color: #400080; border-left-width: 0;}
#homelink.selected {margin-left: 0;}
#designlink, .designlink {background-color: #800000;}
#resourceslink, .resourceslink {background-color: #0000C0;}
ul.blog.menu li a, #bloglink, .bloglink {background-color: #000000;}

/* Other layout components */
#breadcrumb	{float:right; font-size: 80%; z-index: 1; position:relative;}
#footer {margin-top: 1ex; padding: 1ex; border-top: 0.25ex rgb(207, 191, 223) solid;
		text-align: center; font-size:80%;
		position: fixed; bottom: 0; left: 0.5em; width: 100%; background: url(/assets/white.png);}
.webdesign #footer {border-color: rgb(223, 191, 191);}
.resources #footer {border-color: rgb(191, 191, 255);}
.blog #footer {border-color: rgb(191, 191, 191);}
#footer p {margin: 0; padding: 0;}
#footer ul {margin-left: 0; padding-left: 2em; display:inline;}
#footer li {display:inline; list-style-type: none; padding-left: 1ex; background-color: white;}
#footer a {}




/* Structure & headers */
h2 {color: white; background: #400080 bottom right no-repeat url(/assets/corner.png);
	width: auto; padding: 2px 30px 2px 7px; margin-bottom: 0; clear: both;
	font-family: Arial, Helvetica, sans-serif; font-weight: normal; font-size: 150%;}
h2.webdesign, .webdesign h2 {background-color: #800000;}
h2.resources, .resources h2 {background-color: #0000C0;}
h2.blog, .blog h2 {background-color: #000000;}
.box {border-left: 5px solid #400080; padding: 5px 35px 5px 5px; margin-top: 0; margin-bottom: 1ex;}
.box.webdesign, .webdesign .box {border-color: #800000;}
.box.resources, .resources .box {border-color: #0000C0;}
.box.blog, .blog .box {border-color: #000000;}
h2 span.highlight {background-color: white; font-size: 150%; margin-top: 1ex;
	border: 2px solid #800000; color:#800000; position:relative; padding: 0.5ex; top: -0.4ex;}
	
/* Lists */
.listitemTitle {font-weight: bold;}
a.listitemTitle {}
dt .icon {float:left; margin: 0 1ex 2ex 0;}
dt {clear: left; font-weight: bold; margin-top: 1ex;}
dd p {margin-top: 0; padding-top: 0;}

/* Asides */
.aside, blockquote, code {background-color: rgb(207, 191, 223); border: 1px solid #400080;
	margin: 1ex;}
.aside {padding: 1ex;}
.aside.right {text-align: right;}
.aside.right, .aside.left {max-width: 45%; margin-top:0;}
.aside h3 {margin: 0;}
.aside p {margin: 0.5ex 0;}
.aside img.opaque {border: 1px solid #400080;}

/* General classes */
.icon {border-width: 0px; vertical-align: middle; text-decoration: none;}
.left {float:left; margin-right: 1ex;}
.right {float: right;}
.clear {clear: both;}
.textonly {display: none; visibility: hidden;}

/* Elements */
textarea {width: 100%;}
abbr, acronym, q[title], span[title] {cursor: help; border-bottom: 1px dotted black;}
em, q {font-style:italic;}
blockquote, code {padding: 10px; display: block;}
code.inline {display: inline; padding: inherit; margin: 0; border-width:0;}
code {font-family:monospace; white-space:pre; font-size: 120%; overflow: auto; max-height: 80ex;}