/* basic elements */
body {color:#000; background:#000 url(../images/bg_book_01.jpg) bottom center no-repeat; font:normal 11px arial;}
html { height: 100%; margin-bottom: 0.01em; }

* {margin:0;padding:0;}  /* zero out everything */

.banner_a {	position:relative; font-size:60px; font-weight:normal; color:#fff; padding:0 0 0 10px;}
.banner_a p {font-size:11px; color:#fff; padding:0 0 0 5px;}
.hdr {font:normal 21pt arial; padding:0px 0px 5px 20px;}
h2 {position:relative; color:#fff; font-size:36px; width:170px; padding:10px 0 10px 20px; float:left; display:block; font-weight:normal;}


#contentWrapper {position:relative;}
.scroll-container {position:relative; height:445px;	background:url(../images/bg_transparent_20.png) top left repeat;}

/*-----------------------------------
[ homepage ]
-----------------------------------*/
#homeContent {}
#homeContent .scroll-container {background:none; height:230px;}
#homeContent .scroll-container p {font-size:18px; color:#e3dfb9; padding:0 0 8px 20px;}
#homeContent .scroll-container p span {font-style:bold; color:#fff;}

#promoWrapper {width:980px;	height:300px; position:absolute;}
#promo {padding:0px 20px 0px 10px; text-align:left;}


/*-----------------------------------
[ portfolio ]
-----------------------------------*/
#portfolioContent .scroll-container {height:300px;}
#portfolioWrapper {position:absolute; height:180px; overflow:hidden; width:100%; padding:20px 0 0 0; top:60px; left:0px;}
.btn_move_container {position:absolute; bottom:0px; right:0px; margin:10px 0 0 0;}

.btn_move:link,
.btn_move:visited,
.btn_move:hover,
.btn_move:active {display:block; background-color:#0797da; color:#fff; padding:10px 60px 10px 10px; float:right; margin:0 0 0 10px; outline:none;}

#portfolio {padding:0px; position:absolute; text-align:left; height:150px; overflow:hidden;}
.portfolioItemContainer {margin:0px 0px 0px 20px; float:left; width:180px; height:140px; background-color:000; background:url(../images/bg_transparent_60.png) top left repeat; border-left:1px solid #666; 	cursor:pointer;}
.portfolioItemImage {padding:10px 0px 0px 10px;}
.portfolioItemTitle {padding:4px 0px 0px 10px; color:#ccc; font:normal 11px arial;}
.portfolioItemYear {padding:2px 0px 0px 10px; color:#999; font:normal 11px arial;}


.modal-content {display:none; width:880px; height:420px; position:relative;}
/****** detail ******/
#portfolioDetail {position:absolute; width:280px; height:360px; padding:10px; top:20px; right:0px;}
#portfolioDetailImage {padding:0px 0px 10px 0px;}
#portfolioDetailInfo {}

.hdr_portfolioDetail {font:normal 11px arial; color:#666; float:left; width:80px;}

#portfolioDetailTitle {font:normal 14pt arial; color:#000; display:block; padding:20px 0 10px 0;}
#portfolioDetailTech {font:normal 11px arial; color:#333; float:left; width:280px;}
#portfolioDetailTools {font:normal 11px arial; color:#333; float:left; width:280px;}
#portfolioDetailDesc {font:normal 11px arial; color:#333; float:left; width:280px;}
.portfolioDetailClose {float:right;}

.portfolioDetailClose:link,
.portfolioDetailClose:visited {z-index:99999999999; position:absolute; top:0px; right:0px; font-family:arial; text-decoration:none; font-size:11px; color:#cc0000; font-weight:normal; display:block; width:60px; height:60px; background:#0797da url(../images_portfolio_items/close_modal.png) center center repeat;}
.portfolioDetailClose:hover {font-family:arial; text-decoration:underline; font-size:11px; color:#cc0000; font-weight:normal; }



/*-----------------------------------
[ resume ]
-----------------------------------*/
#resumeContent .scroll-container {height:455px;}
#resumeWrapper {position:absolute; top:0px; left:0px; height:410px;	overflow:hidden; width:100%;}
#resume {position:absolute;	padding:20px 0px 0px 20px; text-align:left;	top:50px;}
.resumeItemContainer {margin:0px 10px 20px 0px; padding:10px 0 0 10px; float:left; width:470px; height:410px; background:url(../images/bg_transparent_60.png) top left repeat; border-left:1px solid #666;}
.resumeItemInfo {width:120px; float:left;}
.resumeItemTitle {color:#ccc; font:normal 11px arial; padding:0px 0px 12px 0px;}
.resumeItemDates {color:#999; font:normal 11px arial; padding:0px 0px 12px 0px;}
.resumeItemCompany {color:#fff;	font:bold 11px arial; padding:0px 0px 4px 0px;}
.resumeItemDuties {color:#ccc; font:normal 11px arial; padding:0px 0px 8px 0px;}
.resumeItemLocation {color:#ccc; font:normal 11px arial; padding:0px 0px 8px 0px;}
.resumeItemDescription {width:330px; float:left; padding:4px 0px 0px 10px; color:#ccc; font:normal 11px arial;}
.hdr_resumeDetail {font:normal 11px arial; color:#999;}
.resumeItemDescription p {padding-bottom:10px;}
.resumeItemDescription li {list-style-position:outside; margin:0 0 5px 16px;}


/*-----------------------------------
[ contact ]
-----------------------------------*/
#contactContent {}
#contactContent .scroll-container {height:360px;}
#contactContent h2 {float:none;}
#contactContent .scroll-container p {color:#fff;}
#contactWrapper {}
#contactInfo {width:240px; padding:0px 0px 0px 20px; text-align:left; float:left;}
#contactContent #contactInfo p {color:#fff; font-size:14px; clear:both; font-weight:normal;}
#contactInfo .label {width:20px; float:left; color:#ccc;}
#contactInfo .content {font-weight:normal; width:200px; float:left;	color:#fff;}

#contactInfo .contact-row:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html #contactInfo .contact-row {zoom:1; display:block;}
*+html #contactInfo .contact-row {zoom:1; display:block;}

#contactInfo .contact-row {padding:0 0 10px 0;}
#contactFormWrapper {width:500px; padding:0px 20px 0px 10px; text-align:left; float:left;}
#contactFormWrapper label {font-weight:normal; float:left; width:200px;	color:#fff;}
#contactFormWrapper input {float:left; border:0; border-left:1px solid #666; padding:4px; background:url(../images/bg_transparent_20.png) top left repeat;}
#contactFormWrapper #comments {float:left; width:260px; height:60px; border:0; border-left:1px solid #666; background:url(../images/bg_transparent_20.png) top left repeat;}
#contactFormWrapper .form-row {padding:10px; margin:0 0 10px 0;	background:url(../images/bg_transparent_20.png) top left repeat;}

#contactFormWrapper .form-row:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html #contactFormWrapper .form-row {zoom:1; display:block;}
*+html #contactFormWrapper .form-row {zoom:1; display:block;}


#contactFormSend {}
#contactFormThankyou {position:relative; width:260px; display:none;}
#formInstructions {position:relative; display:block;}
#contactFormFailed {position:relative; display:none; color:#ff0000;	float:left;	width:310px;}
#contactFormSending {position:relative; width:310px; display:none;}
.hr_lightGray {background-color:#e5e5e5; height:1px;}

.btn_send:link,
.btn_send:visited,
.btn_send:hover,
.btn_send:active {display:block; width:240px; color:#fff; font-weight:normal; padding:5px; border-left:1px solid #666;background:url(../images/bg_transparent_20.png) top left repeat;}


/*-----------------------------------
[ dock ]
-----------------------------------*/
#dockWrapper {position:absolute; bottom:0px; left:0px; width:100%;}
#dockNav {float:left; overflow:hidden; height:1%; padding:10px;}
#dockNav a:link,
#dockNav a:visited,
#dockNav a:hover,
#dockNav a:active {display:block; float:left; padding:10px; width:160px; height:20px; color:#fff; font-size:14px; text-transform:uppercase; background-color:#0797da; margin-right:10px;}
#dockCopyright {float:right; position:relative; padding:20px 10px 0 0;}
#dockCopyright li {list-style-image:none; list-style-position:outside; list-style-type:none; float:right; border-left:1px solid #fff; padding-left:10px; margin-left:10px; font-size:14px; color:#fff;}
#dockCopyright li.last {border:0;}
#dockCopyright a:link,
#dockCopyright a:visited,
#dockCopyright a:hover,
#dockCopyright a:active {font-size:14px;}
#dockCopyright .txtSm {color:#000;}



.txtSm {font:11px arial; color:#ccc;}
.txtSm_gray {font:11px arial; color:#999;}
.txtSm_white {font:11px arial; color:#fff;}

.txt {font:10pt arial; color:#e5e3ce;}
.txt_white {font:10pt arial; color:#fff;}

.hdrSm {font:11px arial; color:#999; font-weight:bold;}
.hdrSm_gray {font:11px arial; color:#999; font-weight:bold;}
.hdrSm_darkGray {font:11px arial; color:#666; font-weight:bold;}
.hdrSm_white {font:11px arial; color:#fff; font-weight:bold;}

.hdr_gray {font:12pt arial; color:#666; font-weight:normal;}
.hdr_white {font:bold 12pt arial; color:#fff;}

.dock_hdrSm {font:11px arial; color:#e5e3ce; font-weight:bold; text-transform: uppercase;}

	
a:link, a:visited, a:active {font:normal 11px arial; text-decoration:none; color:#1c6dae;}
a:hover {font:normal 11px arial; text-decoration:underline; color:#1c6dae;}


.lnkDock:link 		{font:normal 10pt arial; text-decoration:underline; color:#c1ddf5; }
.lnkDock:active 	{font:normal 10pt arial; text-decoration:underline; color:#c1ddf5; }
.lnkDock:visited 	{font:normal 10pt arial; text-decoration:underline; color:#c1ddf5; }
.lnkDock:hover 		{font:normal 10pt arial; text-decoration:underline; color:#c1ddf5; }


.lnkFooter:link 	{font-family:arial; text-decoration:underline; font-size:11px; color:#fff; font-weight:bold; }
.lnkFooter:active 	{font-family:arial; text-decoration:underline; font-size:11px; color:#fff; font-weight:bold; }
.lnkFooter:visited 	{font-family:arial; text-decoration:underline; font-size:11px; color:#fff; font-weight:bold; }
.lnkFooter:hover 	{font-family:arial; text-decoration:underline; font-size:11px; color:#fff; font-weight:bold; }


a.btn_close {display:block; background:url(../images/btn_close.gif) no-repeat 0px 0px; 	width:55px; height:18px; overflow: hidden; text-indent:-4800px; outline:none; line-height:28px;	margin: 0px;}
a.btn_close:hover {background:url(../images/btn_close.gif) no-repeat 0px -18px;}