/**
  * TCICredit.com - TEScreener 3.0
	* 01/10/03
	*
	* General Style Sheet
	*/

/* Styles needed for skinning purposes */
/* Top most part of the page where the title of the
 * application is. We use a background image to set
 * the title of the application.
 */
#login-area {
    width: 600px;
    margin: 0px auto auto auto;
	padding: 20px;
}

#login-area-qa {
    width: 650px;
    margin: 0px auto auto auto;
	padding: 20px;
}

#disclaimer {
	margin-top: 20px;
	text-align: left;
	padding: 10px;	
	background: #eee;
	color: black;
	border-radius: 5px;
}

#title-area {
	height: 44px;
	background: #023c83 url(../images/titlebar/titlebar.jpg) no-repeat;
	color: inherit;
}

#logout-area {
	position: absolute;
	top: 1px;
	right: 5px;
	text-align: right;
	font-size: 12px;
	font-weight: bold;
	background: transparent;
	color: white;
}
#logout-area a {
 background: transparent;
 color: white;
}

/* The nav-topbar contains the main navigation of the
 * application.
 */
#nav-top {
	padding-top: 4px;
	border-bottom: 2px solid #000;
	border-top: 1px solid #000;
	background-color: #fff;
	color: #000;
}
#nav-bottom {
	padding-bottom: 3px;
	border-bottom: 1px solid #000;
	border-top: 2px solid #000;
}
#nav-cookieCrumbs {
	padding: 1px;
	margin-bottom: 5px;
	font-size: 11px;
	font-weight: normal;
	text-transform: capitalize;
	text-align: left;
	background: inherit;
	color: inherit;
}

#main-area-wrap {
	background: white;
	color: inherit;
}
/* Everything that needs to be centered on the page
 * should be within the main-area.
 */
#main-area {
	width: 820px;
	padding-top: 5px;
	margin: 0px auto auto auto;
}

.main-area-width {
	width: 820px !important;	
}

.main-area-width-big {
	width: 860px !important;	
}

/* The info area contains the title of the form as
 * well as information about the current applicant
 * and client being worked on.
 */
#info-area {
	height: 65px;
	min-height: 65px;
	text-align: left;
	font-size: 10px;
	margin-bottom: 5px;
	padding: 10px 10px 5px 10px;
	border: 1px solid #69c;
	background: #e7ecf5 url(../images/icons/icons_clipboard1.gif) no-repeat top right;
	color: inherit;
	border-radius: 4px;
}
#info-area.info-area-height{

}
#info-area #title {
	float: left;
	display: inline;
	width: 360px;
	margin-bottom: 3px;
}
#info-area #title h2 {
	font-size: 16px;
	margin-right: 20px;
	border-bottom: 1px solid #69c;
}

#info-area #title.extend {	/* For pages which don't have any */
	width: 95% !important;		/* client or applicant info on top */
}
#info-area #title.extend2 { /* for those pages which only have */
	width: 55% !important;		/* Client ID and Client Name */
}

#info-area table {
	width: 45%;
	margin-bottom: 15px;
}

#info-area table.short {
	width: 320px;
}
#info-area table.short th {
	width: 90px;
}
#info-area th {
	font-weight: bold;
	text-align: left;
}

/* The info area contains the title of the form as
 * well as information about the current applicant
 * and client being worked on for the EXTENDED APPLICATION.
 */
#info-ext-area {
	text-align: left;
	font-size: 10px;
	margin-bottom: 5px;
	padding: 10px 10px 5px 10px;
	border: 1px solid #69c;
	background: #e7ecf5; 
	color: inherit;
	border-radius: 4px;
}
#info-ext-area.info-area-height{

}
#info-ext-area #title {
	float: left;
	display: inline;
	width: 305px;
	margin-bottom: 3px;
}
#info-ext-area #title h2 {
	font-size: 16px;
	margin-right: 20px;
	border-bottom: 1px solid #69c;
}

#info-ext-area #title.extend {	/* For pages which don't have any */
	width: 95% !important;		/* client or applicant info on top */
}
#info-ext-area #title.extend2 { /* for those pages which only have */
	width: 55% !important;		/* Client ID and Client Name */
}

#info-ext-area table {
	width: 45%;
	margin-bottom: 15px;
}

#info-ext-area table.short {
	width: 320px;
}
#info-ext-area table.short th {
	width: 90px;
}
#info-ext-area th {
	font-weight: bold;
	text-align: left;
}


/* Copyright message on the bottom of every page */
#copyright {
	text-align: left;
	font-size: 10px;
	padding: 5px;
	/*border-top: 1px solid #000;*/
	background: #fff;
	color: #000;
}

/* Area used to show error messages about the form */
#required {
	margin-bottom: 5px;	
	clear: both;
}
#required table {
	width: 100%;
}
#required ul {
	margin-top: 0;
	margin-bottom: 0;
}
#required ul li {
	font-weight: bold;
}


/* Some pages have multiple rows of Tabs to navigate
 * between the different sections of the form. Below
 * are the styles for these tabs.
 */

#level0tabs {
	text-align: left;
	padding-left: 5px;
	border-bottom: 3px solid #369;
}
#level0tabs a {
	padding: 1px 8px 0px 8px;
	letter-spacing: 1px;
	border: 1px solid #000;
	border-bottom: 0;
	text-decoration: none;
	background: #999 !important;
	color: white !important;
}

#level0tabs a:hover {
	padding: 1px 8px 0px 8px;
	letter-spacing: 1px;
	border: 1px solid #000;
	border-bottom: 0;
	text-decoration: none;
	background: #369 !important;
	color: yellow !important;
}

#level0tabs a.here {
	font-weight: bold;
	border: 1px solid #369;
	background: #369 !important;
	color: white !important;
}

#apptype {
	font-weight: bold;
	font-size: 11px !important;
	letter-spacing: 1px;
	text-align: right;
	margin-bottom: 2px;
}
#apptype a {
	background: transparent !important;
	text-decoration: underline !important;
	font-weight: normal;
	border: none;
	color: #000 !important;
}

#apptype a:hover {
	background: transparent !important;
	text-decoration: none !important;
	font-weight: normal;
	border: none;
	color: #000 !important;
}

#apptype a.here {
	font-weight: normal;
	border: none;
	padding: 0;
	text-decoration: underline !important;
	background: transparent !important;
	color: #000 !important;
}

/* Some pages have tabs on the top and the bottom
 * of the page. These tabs have different formatting
 * and their styles are defined below.
 */
#topTabs {
	border: 1px solid #369;
	border-bottom: none;
}
#topTabs .level1Tabs,
#topTabs .level2Tabs,
#topTabs .level3Tabs {
	padding-top: 4px;
	padding-left: 7px;
}

#bottomTabs .level1Tabs,
#bottomTabs .level2Tabs,
#bottomTabs .level3Tabs {
	padding-bottom: 4px;
}


#applicants table,
#current-app table {
	width: 96%;
}
#applicants .heading-2,
#current-app .heading-2 {
	margin-bottom: 5px;
}


#applicants ul,
#current-app ul {
	margin: 0;
	padding: 0;
}

#current-app {
	margin-top: 0px !important;
	border: 1px solid #69c;
    background: #eee !important;
    border-radius: 4px;
}
#current-app-title {
	font-size: 14px;
	letter-spacing: 0.65em;
	text-transform: uppercase;
	padding: 4px 5px 4px 5px;
	background: #69c;
	color: white;
	border-radius: 10px;
}


#jump-to {
	font-weight: bold;
	font-size: 90%;
	text-align: left;
}
#jump-to .link {
	padding: 0 3px 0 3px;
	font-size: 90%;
}

#page-bottom {
	height: 95px;
	border-top: 1px solid #999;
	background: #006 url(../images/bkgd_h1.gif) repeat-x;
	color: inherit;
}

#sysmsg-title {
	margin-top: 50px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
}
#sysmsg {
	/* height: 100px; */
	padding: 25px;
	margin: 15px 30px 30px 30px;
	text-align: left;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
}
#sysmsg img {
	margin-right: 10px;
	margin-bottom: 30px;
	float: left;
}