@charset "UTF-8";
/* -- TOC -- */
/*

#1 - RESET
#2 - GLOBAL STYLES
#3 - WRAPPER
#4 - NAV
#5 - BODY
#6 - FORMS

*/


/* #1 - RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* #2 - GLOBAL */
body{background:#06273a url(../images/bg-main-rpt.png) repeat-x top left; font-family:Tahoma, Geneva, sans-serif; font-size:14px; color:#fff; }
h1, h2, h3, h4, h5, h6{ font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif; letter-spacing:1.4;display:block; clear:both;}
h1#head-bg{margin:0 0 0 -120px; width:1200px; height:250px; position:relative; z-index:1; background:transparent url(../images/head-bg.jpg) no-repeat; overflow:hidden; text-indent:-1000em }
h3{padding:0; font-size:2em; color:#35a3de; margin-bottom:1em }
h4{padding:0; font-size:1.6em; color:#35a3de; margin-bottom:.8em }
a, a:active, a:visited{ color:#35a3de; text-decoration:none; display:block }
a:hover{color:#DD22AA; text-decoration:underline}
p{ clear:both; letter-spacing:0.15em; line-height:1.4em; margin-bottom:1.6em;}
.fleft{float:left}
.fright{float:right}
.clear{clear:both}
.ofauto{ overflow:auto}
.hidden{display:none}

/* #3 - WRAPPER */
#wrapper, .wrapper{position:relative; margin:0 auto; width:960px; z-index:2; background-color:#082c41; }
#wrpper{ margin-bottom:2em}
#wrapper h2{text-indent:-1000em; overflow:hidden; padding:10px 10px 10px 27px; width:50%; margin:2em 0 1em; background-color:#06273a; background-position:27px 10px; background-repeat:no-repeat; 
-moz-border-radius-topright: 6px;
-moz-border-radius-bottomright: 6px;
-webkit-border-top-right-radius: 6px;
-webkit-border-bottom-right-radius: 6px;}
#wrapper h2.home{ background-image:url(../images/h2-home.png) }
#wrapper h2.folio{ background-image:url(../images/h2-folio.png) }
#wrapper h2.resume{ background-image:url(../images/h2-resume.png) }
#wrapper h2.contact{ background-image:url(../images/h2-contact.png) }

/* #4 - NAV */
ul#nav{position:absolute; right:27px; height:44px; top:-193px; z-index:2}
ul#nav li{float:left; position:relative}
ul#nav li a{height:44px; display:block; overflow:hidden; text-indent:-1000em}
ul#nav li.home a{ background:transparent url(../images/nav-home.png) no-repeat; width:99px; }
ul#nav li.home a#home-active, ul#nav li.folio a#folio-active, ul#nav li.resume a#resume-active, ul#nav li.contact a#contact-active{
	filter:alpha(opacity=0);
	-moz-opacity:0;
	-khtml-opacity: 0;
	opacity: 0;
	position:absolute;
	top:0;
	left:0
	}
	ul#nav li.home a.active{
	filter:alpha(opacity=100)!important;
	-moz-opacity:1!important;
	-khtml-opacity: 1!important;
	opacity: 1!important;
	}
ul#nav li.home a#home-active, ul#nav li.home a#home-active.active{ background:transparent url(../images/nav-home-active.png) no-repeat; width:99px; }
ul#nav li.folio a{ background:transparent url(../images/nav-folio.png) no-repeat; width:94px; }
ul#nav li.folio a#folio-active{ background:transparent url(../images/nav-folio-active.png) no-repeat; width:94px; }
ul#nav li.resume a{ background:transparent url(../images/nav-resume.png) no-repeat; width:111px; }
ul#nav li.resume a#resume-active{ background:transparent url(../images/nav-resume-active.png) no-repeat; width:111px; }
ul#nav li.contact a{ background:transparent url(../images/nav-contact.png) no-repeat; width:103px; }
ul#nav li.contact a#contact-active{ background:transparent url(../images/nav-contact-active.png) no-repeat; width:103px; }


/* BODY */
.boundry-blue{width:862px; background-color:#07273a; border:1px solid #15374b; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-left:27px; padding:14px 18px; position:relative; margin-bottom:1em}
.boundry-blue.open h4{margin-bottom:.8em; color:#fff; width:70%;}
.boundry-blue.hover h4 a{ color:#DD22AA; text-decoration:none; }
.boundry-blue.open h4 a:hover{ color:#ffffff; }
.menu_list { float:left; clear:both; width:862px }
.menu_list .boundry-blue{ margin-bottom:1em}
.boundry-blue.hover, .boundry-blue.open {border:1px solid #DD22AA;cursor:pointer;}
.boundry-blue.open {background-color:#000000;}
.folio.open {padding-bottom:42px;}
.boundry-blue h4 {margin:0;}
.boundry-blue.open h4 a {color:#FFFFFF;text-decoration:none;}
.boundry-blue h4.menu_head a span.twister {
background:url("../images/icon_sprite.png") no-repeat scroll -175px 0 transparent;
float:right;
height:25px;
overflow:hidden;
width:25px;
}
.boundry-blue.open h4.menu_head a span.twister {background-position:-225px 0;}

.boundry-blue.folio.open h4.menu_head a span.twister {display:none}

#wrapper .menu_list .menu_head {
	cursor: pointer;
	position: relative;
	width:862px;
	
}
#wrapper .menu_list .menu_head {
	margin-bottom:0px;
}

#wrapper .menu_list .open .menu_head {
	margin-bottom:10px;
}
.menu_body {
	margin-top:-1em;
	position:relative;
	margin:0;
	width:860px;
	height:300px;
	overflow:hidden
}

#wrapper .text-blocks .menu_body{height:auto}

.menu_body a {
  color:#006699;
  font-weight:bold;
  text-decoration:none;
}
.menu_body a:hover {
  text-decoration:underline;
}

#resume h3{margin:1em 0 .5em 27px; clear:both}
.menu_body .folioDetail{ position:absolute; width:840px; height:55px; bottom:-75px; background:url(../images/blue-transparent.png) repeat;margin:0; padding:10px; border-top:1px solid black; }
.menu_body .folioDetail a{color:#dd22aa; display:inline}
.menu_body .folioDetail a:hover{color:#fff}
.boundry-blue .paging{position:absolute; right:20px; top:14px; display:none}
.boundry-blue.open .paging{display:block}
.boundry-blue .paging li, .boundry-blue .infoToggle a{ float:left; width:25px; height:25px}
.boundry-blue .paging li.seperator{ margin-right:1em; }
.boundry-blue .paging li a, .boundry-blue .infoToggle a{background:url(../images/icon_sprite.png) no-repeat -125px 0; width:17px; height:25px; font-weight:bold; color:#cff0fc; padding:4px 0 0 8px;}
.boundry-blue .infoToggle a{ background-position:-100px 0}
.boundry-blue .paging li a.next, .boundry-blue .paging li a.back, .boundry-blue .infoToggle a{ text-indent:-1000em; overflow:hidden; }
.boundry-blue .paging li a.next{ background-position: -50px 0; }
.boundry-blue .paging li a.back{ background-position:-75px 0 }
.boundry-blue .paging li a.current{ background-position:-150px 0}
.boundry-blue .infoToggle{ position:absolute; bottom:5px; left:12px; margin:0; display:none}
.boundry-blue.open .infoToggle{display:block}
a.more-examples{padding:1em; border:1px dotted #DD22AA; float:right; clear:both; margin-right:3em }
a.more-examples:hover{background-color:#20171f }
.gallery-wrapper{ width:1000em; height:300px;}
.gallery-wrapper a{ float:left}

/* FORMS */
.contact h3{margin-bottom:.5em}
.contactInfo{ width:45%; display:inline}
form label{display:block; margin:0 0 .1em; }
form p{margin:0 0 .6em; font-size:.7em}
form input, textarea{margin-bottom:1.4em; width:100%}
#waiting, #feedback, #message-sent{display:none}
#feedback.error{display:block; border:1px solid #F33; padding:1em 2em; background-color:#FFC; color:#F33; font-weight:bold; margin-bottom:.6em;}
#feedback h2{ background-color:transparent; color:#f33; margin:0;  text-indent:0; font-size:1.4em; font-weight:bold; padding:0; width:auto}
#cptcha-question{font-size:1.3em}

/* TOP SITES */
#top-sites {margin-top:2em; font-size:1.6em; background-color:#20171f; overflow:auto; padding:2em 0 4em; border-top:3px solid #f6e8d9}
#top-sites ul {width:30%; float:left}
#top-sites {margin-top:2em; font-size:1.6em}
#top-sites ul li{margin-bottom:.6em}
#top-sites ul.middle{ margin:0 2.1em}
#top-sites ul li h2{ font-size:1.4em; color:#f6e8d9}