@charset "utf-8";

/* PART 0 - RESET */
/* undohtml.css */
/* (CC) 2004 Tantek Celik. Some Rights Reserved.                  */
/* http://creativecommons.org/licenses/by/2.0                     */
/* This style sheet is licensed under a Creative Commons License. */

:link, :visited {  } /* put text-decoration: none here to override */
ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6, pre, code, p { font-size: 1em; }
ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, body, table, td, html, p, blockquote, fieldset, input {	padding: 0; margin: 0; }
a img, :link img, :visited img { border: none; }
address { font-style: normal; }
.clear { clear: both; }


/*** LAYOUT *******************************************************/

body {
	background: #223241;
}

#foundation {
	width: 900px;
	margin: 0 auto;
	background-repeat: repeat-y;
}

#page {
	width:900px;
	height:600px;
	position:relative;
}


body#home #page { background: url(../images/bg-information-designer-bw.jpg) top left no-repeat; }

body#web, body#design, body#guide, body#contact, body#terms, body#about {
	background: #223241 url(../images/bg-page.png) 50% 0 repeat-y;
}
body#web #page, body#design #page, body#guide #page,
body#contact #page, body#terms #page, body#about #page,
body#skills #page {
	background: url(../images/bg-information-designer.jpg) no-repeat;
}

#page #logobar {
	position: fixed;
	top: 0px;
}
#page #sidenav {
	position: fixed;
	top: 160px;
	width: 242px;
	margin-left: 24px;
	padding: 12px;
	background-color: #203345;
}
#sidenav p.notice {
	background-color: #FC0;
	color: black;
	padding:1em;
	line-height: 1.5em;
}
#sidenav p a, #sidenav p a:visited {
	color:#06C;
}

/* Color Definitions *******************************************/

.emphasis { color: #003471; }
.greet { color: #8dc63f; }
.callout { color: #175296; }
.callout strong { font-weight:normal; color:#d66b36; }
.normal { font-weight: normal; color: #175296; }
.highlight { font-weight: bold; background-color: #fff090; }
.alert { font-weight: bold; text-transform: uppercase; color:#900; background: #FC0; }

/* callouts hovering orange was #d66b36, blue was #2a7ad7 */
.callout a { text-decoration: underline; }
.callout strong a, .callout strong a:visited { font-weight:normal; color:#d66b36; }
.callout strong a:hover { color:#d66b36; } 

/* photo styling */
img.fullwidth { margin-bottom: 1em; }

/* *************************************************************/

.things a, .things a:visited, #clicker a, #clicker a:visited {
	text-decoration: none;
	color: #0255b6;
}
.things a:hover, #clicker a:hover {
	color: #0255b6;
	text-decoration: underline;
}
.things a.right { float: right; margin-left: 1em; }
.things a.left { float: left; margin-right: 1em; }
.things a img {
	border: 1px solid #BBB;
	padding: 2px;	
	vertical-align: top;
	margin: 0 4px 8px 0;
}
.things a.right img { margin: 0 0px 8px 4px; }
.things a.left img { margin: 0 4px 8px 0; }

.things a:hover img {
	border-color: #00F;
}
#page .things, #sidenav {
	width: 540px;	/* set width of text area 540px */
	margin-left: 10px;
	background-color: white;
	font-family: Verdana, Geneva, sans-serif;
}

#page .topabs {
	position: absolute;
	right: 15px; top: 15px;
}

#page .toprel {
	margin-right: 15px;
	margin-top: 135px;
}
#page .section {
	margin-right:15px;
	margin-top: 15px;
}
#page .things {
	clear:right;
	float:right;
}
#page .things .clear {
	clear:both;
}

#sidenav { font-size: 13px; color: #65a6d3; }
#sidenav p { padding-bottom: 1em; }
#sidenav p.nopad { padding-bottom: 0; }
#sidenav ol, #sidenav ul { line-height: 1.25em; padding-bottom: 1em; }
#sidenav ol { list-style: decimal; margin-left: 2em; }
#sidenav ul.points { list-style:disc; margin-left: 2em; }
#sidenav ul.nopad, #sidenav ol.nopad { padding-bottom: 0; }
#sidenav a, #sidenav a:visited { color: #83bee8; 	text-decoration: none; }
#sidenav a:hover { text-decoration: underline; }

.things .header, .things .headersolo {
	background: url(../images/tt-edge3.png) repeat-y;
	padding-left: 28px; /* shift left padding 30px-2px */
}
body#home .things .header {
	background: url(../images/tt-bullet3.png) 0 50% no-repeat; 
}

.things div.columns {
	background: url(../images/tt-edge3.png) repeat-y;
	margin-left: 0px; 
	padding-left: 30px; /* shift left padding 30px */
}

.topabs h1, .toprel h1 {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 34px;
	letter-spacing: -2px;
	line-height: 36px;
	background: url(../images/tt-edge3.png) repeat-y;
	margin-left: 0px; 
	padding: 26px 18px 24px 30px; /* shift left padding 30px */
}
.toprel h1 {
	padding-bottom: 0px;
}
.topabs h1.subheader {
	letter-spacing: 0px;
	padding-top:4px;
	margin-top: -22px;
	font-size:16px;
	font-weight: normal;
	line-height: 22px;
	padding-bottom: 1em;
}

.things p, .things ul, .things ol { 
	font-size: 13px;
	line-height: 1.25em;
}
.things p {
	background: url(../images/tt-edge3.png) 0 -1px repeat-y;
	margin-left: 0px; 
	padding: 1em 2em 1em 30px; /* shift left padding 30px */
}

.things p + p, .things div.columns + p, .things p.first {
	padding-top: 0;
}

.things .header h2 {
	font-size: 32px;
	font-weight: normal;
	letter-spacing: -2px;
	color: #e27139;
	margin-left: 0px; 
}
.things .header h2 a, .things .header h2 a:visited {
	text-decoration: none;
	border-bottom: none;
	color: #e27139;
}
.things .header h2 a:hover {
	text-decoration: underline;
}
.things .header h3 {
}

.things p.bigmenu {
	padding: 12px 36px 24px 30px; /* shift left padding 30px */
} 

.things .footer {
	clear: both;
	background: url(../images/tt-edge3.png) repeat-y;
	margin-left: 0px; 
	padding-bottom: 2em; 
	padding-left: 30px; /* shift left padding 30px */
}

.columns {
	float:left; /* force div expansion */
}
.things div.columns + p {
	clear:both;
}
.things .column2 {
	float: left;
	width: 180px;
}
.things ul { 
	list-style:disc;
	margin: 0 2em 1em 2em;
}
.things ul.points {
	list-style:square;
	margin-right: 2em;
}
.things ul.points li, .things ol.points li {
	margin-bottom: 1em;
}
.things ol {
	list-style: decimal;
	margin: 0 2em 1em 2em;
}

.things cite {
	color: #272; 
	font-weight: bold;
}
.things ol li,
.things ul li { 
	margin-bottom: 0em; 
} 


body#web li#navweb, body#design li#navdesign,
body#guide li#navguide, body#contact li#navcontact,
body#terms li#navterms, body#about li#navabout,
body#skills li#navskills { 
	background-color:#334d63; 
}
body#web li#navweb a, body#design li#navdesign a,
body#guide li#navguide a, body#contact li#navcontact a,
body#terms li#navterms a, body#about li#navabout a,
body#skills li#navskills a {
	color:#fff;
}

/* jQueryish */

#jbox {
	overflow:hidden;
	visibility:hidden;
}

#clicker {
	position:absolute;
	visibility:hidden;
	right: 15px;
	top: 200px;
	background-color: white;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	padding: 8px;
}

#noscript {
	position:fixed;
	top:33%;
	width: 852px;
	background-color:#fff;
	padding:24px;
	font-size:24px;
}

/* FORM STYLING */

.things form, .things table { margin:0 30px; font-size: 12px; color: #444; margin-bottom: 2em;}
.things input, .things textarea { width: 100%; resize:none; }
.things label { display:block; margin:0; padding-top: 0.75em; padding-bottom: 0.25em; font-size: 14px; color:#175296; font-weight: bold;}
.things button { display: block;  margin-top: 1em; width: 100%; height: 3em; font-size:14px; font-weight: bold;}
form div#formerror { color:red; background-color: yellow; padding: 1em; margin-top: 1em; }
td { vertical-align: top; }
td { border-bottom: #aaa 1px dotted; margin-bottom: 2px; padding-bottom: 2px; }