@import url("focusbox_print.css");

@media screen {

/*
--------------------------------------
  written by Shawn Zhang
  July 28, 2007
default styles 
--------------------------------------
*/
body {
	margin: 0px; 
	background-color:#EFECE6;
	text-align:left;
	vertical-align:top;
}

img {
	border:0;
	vertical-align:-40%;
}

h3 {
	font-size: 12pt;
}
form input, tr, td, td div {
	font-size: 9pt;
}

strong {
	font-weight:bold;	
}
/*
---------------------------------------
custom styles
---------------------------------------
*/
#page_wrapper {
	margin: 0px auto;
	width: 800px;
}

.base {
	font-family:Arial, Helvetica, sans-serif;
}

.validators {
	height: 31px;
	width:800px;
	text-align:right;
	padding:0px;
}
#header{
	background:url(../images/skin_07_header_bg.jpg) repeat-x; 
	height:59px;
	width:800px;
}

#logo_wrapper, .menu_wrapper, .vdiv_wrapper {
	position:relative;
	float:left;
}

.menu_wrapper {
	padding-top:35px;
}

/*
----------------------------------
decorative vertical lines
----------------------------------
*/
.menu_div_1 {
	padding-left:160px;
	height:29px;
	display:inline;
}
.menu_div_2, #menu_div_3{
	height:29px;
	display:inline;
}

#logo_wrapper img,
.menu_div_1 img,
.menu_div_2 img,
.menu_div_3 img {
	vertical-align:bottom;
}

.menu_curr {
	background:url(../images/skin_07_header_menu_curr.jpg) no-repeat center;
	width:110px;
	height:22px;
	padding-top:2px;
	text-align:center;
}

.menu_reg {
	background:url(../images/skin_07_header_menu_reg.jpg) no-repeat center;
	width:110px;
	height:20px;
	padding-top:2px;
	text-align:center;
}

.menu_over {
	background:url(../images/skin_07_header_menu_over.jpg) no-repeat center;
	width:110px;
	height:20px;
	padding-top:2px;
	text-align:center;
}

.menu_curr A:link, 
.menu_curr A:visited, 
.menu_curr A:active, 
.menu_curr A:hover,
.menu_reg A:link, 
.menu_reg A:visited, 
.menu_reg A:active, 
.menu_reg A:hover,
.menu_over A:link, 
.menu_over A:visited, 
.menu_over A:active {
	font-size:8pt;
	font-weight:bold;
	text-decoration:none;
	color:#FFFEFE;
}

/*
-------------------------------
content definitions
-------------------------------
*/
#content_home, #content {
	display:block;
	float:left;
	background:url(../images/skin_07_home_left_col_bg_01.jpg) top left repeat-y;
	background-color:#FFFFFF;
}


.left_column_wrapper {
	width:170px;
	/*height:380px;*/
	height:100%;
	overflow: hidden;
	/*overflow:auto;*/
	position:relative;
	float:left;
	font-size:9pt;
}

.left_column_content div, p {
	padding:2px 10px 2px 6px;
}

/*
----------------------------------
Left column wrapper and content
----------------------------------
*/

/*--------- login link on home page----- */
#loginbox{
	height:12px;
	margin-left:20px;
	margin-top:120px;
}


.left_column_content blockquote{
	margin: 0px 10px 0px 10px;
}

.left_column_content blockquote .client{
	font-size:8pt;
	color:#666666;
}
/* link styles*/
.left_column_content A:link,
.left_column_content A:active {
	color:#333333;
}

.left_column_content A:visited {
	color:#999999;
}

.left_column_content A:hover {
	color:#FF6600;
}

/*
---------------------------------------
left column portfolio nav styles
---------------------------------------
*/
.left_column_content {
/*	margin-left: 6px;*/
	margin-right: 6px;
	font-size: 9pt;
	padding-top:6px;
}

/*===========*/

.left_column_hr hr{
	text-align:center;
	width:80%;
	height:2px;
	padding:0px;
}

div .left_column_hr {
	height:10px;
}

.right_column_wrapper_about,
.right_column_wrapper_testimonial {
	width:630px;
	position:relative;
	float:left;
	background:none;
	/*background-color:#FFFFFF;*/
	font-size:9pt;
}

.right_column_wrapper_home{
	width:630px;
	position:relative;
	float:left;
	background:url(../images/skin_07_home_banner_bg_03.jpg) top right no-repeat;
}

.right_column_content_home {
	position:relative;
	float:left;
	width: 360px;
	height: 250px;
	/*overflow:hidden;*/
	padding:6px;
	padding-left:12px;
}	

.right_column_content_home #usab_quote {
	line-height:20px;
	font-size:12pt;
	color:#333333;
	padding-top:60px;
}

.right_column_content_home #quote_author {
	font-size:9pt;
	color:#666666;
	padding-left:200px;
}
.right_column_wrapper_contact {
	width:630px;
	position:relative;
	float:left;
	background:url(../images/skin_07_contact_banner_bg_01.jpg) top right no-repeat;
}


/*
--------------------------------
Home page tool bar
--------------------------------
*/
.right_column_toolbar {
	position:relative;
	display:inline;
	float:left;
	width:630px;
	height:130px;
	/*overflow:hidden;*/
	/*background-color:#FFFFFF;*/
}

.right_column_toolbar .icons,
.right_column_toolbar #expand_1,
.right_column_toolbar #expand_2,
.right_column_toolbar #expand_3 {
	position:relative;
	float:left;
}

.right_column_toolbar .icons {
	padding: 0px 2px 0px 15px;
	cursor:pointer;
}
.right_column_toolbar #icon_1 {
	padding: 0px 2px 0px 10px;
}

#expand_1 ul, #expand_2 ul {
	margin-bottom:4px;
}

/* 
----------------------------------
toolbar link styles
----------------------------------
*/
.right_column_toolbar A:link,
.right_column_toolbar A:active {
	color:#333333;
}
.right_column_toolbar A:visited {
	color:#999999;
}
.right_column_toolbar A:hover {
	color:#FF6600;
}

/*
------------------------------------
toolbar text styles
------------------------------------
*/
.right_column_toolbar #expand_1, 
.right_column_toolbar #expand_2,
.right_column_toolbar #expand_3 {
	width: 200px;
	height:115px;
	overflow:auto;
	vertical-align:top;
	border: 1px solid #EEEEEE;
	border-left: 2px solid #663333;

}

.right_column_toolbar #expand_1 { 
	visibility:visible;
}

.right_column_toolbar #expand_2,
.right_column_toolbar #expand_3 {
	display: none;
	visibility:hidden;
}

#expand_1 ul,
#expand_2 ul,
#expand_3 ul {
	margin-left:15px;
	margin-top: 0px;
	padding-left:15px;
}

#expand_1 li,
#expand_2 li,
#expand_3 li {
	font-size:9pt;
}

#expand_1 div,
#expand_2 div,
#expand_3 div{
	font-size:9pt;
	line-height:18px;
	padding-left: 6px;
	margin-bottom: 0px;
}

/*---------------------------------------
About and portfolio page left column nav 
styles
---------------------------------------*/
div #about {
	padding-top:6px;
}
.left_column_content .about_nav,
.left_column_content .portfolio_nav {
	font-size: 9pt;
}

.about_nav_curr, 
.portfolio_nav_curr {
	display:block;
	background-color:#FEFBE0;
	border: 1px solid #AA0000;
	text-decoration:none;
	margin: 0px 6px 0px 6px;
	padding-left: 10px;
}

.left_column_content .about_nav A:link,
.left_column_content .about_nav A:active,
.left_column_content .about_nav A:visited, 
.left_column_content .portfolio_nav A:link,
.left_column_content .portfolio_nav A:active,
.left_column_content .portfolio_nav A:visited {
	display:block;
	border: 1px solid #FFFFFF;
	text-decoration:none;
	padding-left:6px;
}

.left_column_content .about_nav A:link,
.left_column_content .about_nav A:active,
.left_column_content .portfolio_nav A:link,
.left_column_content .portfolio_nav A:active {
	color:#660000;
}

.left_column_content .about_nav A:visited,
.left_column_content .portfolio_nav A:visited {
	color:#996600;
}

.left_column_content .about_nav A:hover,
.left_column_content .portfolio_nav A:hover  {
	display:block;
	border: 1px solid #CC0000;
	color:#FF6600;
	padding-left:6px;
}

.float_list, .float_icon {
	position:relative;
	padding-left:10px;
	float:left;
	
}

.float_icon {
	width:580px;
	/*clear:right;*/
}

.right_column_content_about {
	position:relative;
	float:left;
	/*width: 630px;*/
	padding:12px;
}	

div .initial {
	color:#666666;
	font-size:9pt;
	padding-left:12px;
}

/*-------------------------------------------
footer 
---------------------------------------------
*/
#footer_wrapper{
	width: 800px;
	height: 61px;
	/*overflow:hidden;*/
	float:left;
}

#footer_wrapper	{
background:url(../images/skin_07_footer_bg.jpg) bottom left no-repeat;
}

.footer {
	color:#FFFEFE;
	font-size:8pt;
	text-align:center;
	padding-top:32px;
}

.footer_counter {
	font-size:8pt;
	color:#999999;
	padding-left:6px;
	margin-top: -6px;
	width: 50px;
}

/*
-----------------------------------
For resume
-----------------------------------
*/
#non-print-link {
	float:right; 
	padding-right:12px;
}

#resume .add-row-break {
	display:block;
	width:100%; 
	float:left;
	clear:both;
}

.cv-header1 {
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 0.95em; 
	color: #222222; 
	font-weight: bold;	
	padding: 6px;
}

#resume p {
	padding-left:6px; 
	padding-right:12px;
}
#resume li {
	padding-right:12px;
}
#resume .add-col-1 {
	float:left; 
	width:25%; 
	margin-left:12px; 
	font-size:.95em;
}
#resume .add-col-2 {
	float:left; 
	width: 70%;
	font-size:.95em;
}

/*
----------------------------------
contact form
----------------------------------
*/
.form_lable_right_align {
	text-align:right;
	white-space:nowrap;
}	

.form_lable_center_align {
	text-align:center;
}	

.right_column_content_contact {
	position:relative;
	float:left;
	width: 450px;
	padding:12px;
}	

td.verify_code {
	padding-top:10px;
	color:#FF3300;
}

#contact img {
	vertical-align:-10%;
}

#paypal_btn {
	padding-left:24px;
}


/*
--------------------------------
Portfolio
--------------------------------
*/
.right_column_wrapper_portfolio {
	width:630px;
	position:relative;
	float:left;
	/*background-color:#FFFFFF;*/
}

.portfolio_content_thumb {
	background:url(../images/skin_07_portfolio_frame_bottom.jpg) bottom left no-repeat;
	width:395px;
	position:relative;
	float:left;
	display:inline;
	padding:20px 0px 20px 50px;
	margin-left:10px;
}

.portfolio_content_inspire {
	position:relative;
	float:left;
	vertical-align:bottom;
	display:inline;
}


.portfolio_content_title {
	vertical-align:top;
	/*position:relative;*/
	float:left;
	font: 11pt Verdana, Arial, Helvetica, sans-serif;
	width: 200px;
	padding: 12px;
}

.portfolio_content_detail {
	vertical-align:top;
	/*position: relative;*/
	float:left;
	font: 9pt Verdana, Arial, Helvetica, sans-serif;
	width:380px;
	padding: 0px 6px;
}

.portfolio_content_detail p {
	line-height: 16px;
	padding: 2px;
}

.nav_wrapper {
	width:630px;
}
.portfolio_nav_wrapper_prev,
.portfolio_nav_wrapper_next {
	position:relative;
	float:left;
}

.portfolio_nav_wrapper_prev {
	padding-left:110px;
}

.portfolio_nav_wrapper_next {
	padding:0px 0px 0px 6px;

}
.portfolio_content_inspire_cap {
	position:relative;
	float:left;
	font-size: 8pt;
	color:#CCCCCC;
	padding-left: 170px;
	width:140px;
	height:20px;
}

/*-----------------------------------------
private 
--------------------------------------------*/
.right_column_wrapper_private {
	width:630px;
	position:relative;
	float:left;
	/*background-color:#F4EAE2;*/
	font-size:9pt;
}

.right_column_wrapper_private_login {
	width:630px;
	position:relative;
	float:left;
	background: #FFFFFF url(../images/skin_07_private_login_banner_bg_01.jpg) top right no-repeat;
	font-size:9pt;
}

div #private {
	padding-top:6px;
}

.private_comment_subject {
	margin-top:6px; margin-bottom:0px;
}

#private_comment form {
	margin-top: 6px;
}

.private_img {
	position: relative;
	float:right;
	padding:4px;
}

/*
--------------------
Log out box
--------------------*/

#logout {
	width:162px;
	margin: 0px;
	padding-bottom:4px;
	background-color:#FFFCF6;
	border-bottom: 1px #EFECE6 solid;
}
.logoutbox_lable {
	padding-left:20px;
/*	margin-top:-6px;
	margin-bottom:12px;
	height:18px;*/
/*	display:inline;*/
	width:160px;
}

.logoutbox_button {
	height:18px;
	text-align:left;
/*	margin-top:-6px;
	margin-bottom:12px;
	display:inline;*/
}

#logoutbutton {
	font-size:8pt; 
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	height:18px; 
	border:1px;
	background-color:#FF9900;
	color:#FFFFFF;
}

/*-------end of log out box ------*/

.left_column_content .private_nav {
	list-style:none; 
/*	margin-left: 6px;*/
	margin-right: 6px;
	font-size: 9pt;
}

.left_column_content .private_nav A:link,
.left_column_content .private_nav A:active,
.left_column_content .private_nav A:visited {
	display:block;
	border: 1px solid #FFFFFF;
	text-decoration:none;
	padding-left:10px;
}

.left_column_content .private_nav A:link,
.left_column_content .private_nav A:active {
	color:#660000;
}

.left_column_content .private_nav A:visited {
	color:#996600;
}

.left_column_content .private_nav A:hover {
	display:block;
	border: 1px solid #CC0000;
	color:#FF6600;
	padding-left:10px;
}

.right_column_content_private #private_default {
	text-align:left;
	margin-left:-10px;
	margin-top:-12px;
}

.right_column_content_private, 
.right_column_content_private_login {
	position:relative;
	float:left;
	/*width: 630px;*/
	padding:12px;
}	

.right_column_content_private_login {
	width: 450px;
	height:170px;
	padding:80px 40px 0px;
}	

/*------------------------------------
Private font changer
--------------------------------------
*/

#private_fonts {
	text-align:right;
	margin:0px;
	margin-top:-12px;
}
A.fonts_9:link,
A.fonts_9:active,
A.fonts_9:visited,
A.fonts_10:link,
A.fonts_10:active,
A.fonts_10:visited,
A.fonts_12:link,
A.fonts_12:active,
A.fonts_12:visited,
A.fonts_14:link,
A.fonts_14:active,
A.fonts_14:visited {
	color:#333333;
	text-decoration:none;
	vertical-align:baseline;
	padding-left:0.5em;
	font-weight:bold;
}

A.fonts_9:hover,
A.fonts_10:hover,
A.fonts_12:hover,
A.fonts_14:hover {
	color:#FF6600;
}

.fonts_9 {
	font-size:9pt;
}
.fonts_10 {
	font-size:10pt;
}
.fonts_12 {
	font-size:12pt;
}
.fonts_14 {
	font-size:14pt;
}

/*----------------------------------
private panel stuff
------------------------------------*/

.custom_panel_header {
	text-align: center;
	border:#666666 1px solid;	
	margin: 2px 12px;
	padding:2px;
}

.custom_panel_row A:link,
.custom_panel_row A:active,
.custom_panel_header A:link,
.custom_panel_header A:active {
	color:#333333;
	text-decoration:none;
	
}

.custom_panel_row A:visited,
.custom_panel_header A:visited {
	color:#996666;
	text-decoration:none;
}

.custom_panel_row A:hover,
.custom_panel_header A:hover {
	color:#FF6600;
	text-decoration:none;
}

.custom_panel_alt {
	background-color: #DFDFCE;
}

.custom_panel_row {
	width: 30px;
}

.order_panel_col {
	width:60px;
}

/*================================
custom content display
==================================*/
form #custom_content {
	width:610px;
	border:0px;
	overflow:auto;
}

/*================================
private article editor
==================================*/
#order_submit,
#edit_submit {
	width:100px;
	border:1px;
	background-color:#3366CC;
	color:#FFFFFF;
	height:20px;
	padding-top:2px;
}

.edit_small_note {
	margin-top:6px;
	font-size: 9pt;
	color:#333333;
}


}