/*  9 of 12 Microsoft Internet Explorer Design Templates 


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 HTML TAGS
	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	margin:0;
	padding:0;
	}

p {
	font-size:.75em;
	line-height:160%;
	}
	
a img {
	border:none;
	}

/* HEADINGS */
	
h1, h2, h3, h4, h5, h6
{
    margin: 15px 0;
    font-family: "trebuchet MS" , verdana, sans-serif;
    color: #1A5A93;
}

.content-left h1, .content-right h1,
.content-left h2, .content-right h2,
.content-left h3, .content-right h3,
.content-left h4, .content-right h4,
.content-left h5, .content-right h5,
.content-left h6, .content-right h6 {
	margin:5px 0;
	}
	
h1.first,
h2.first,
h3.first,
h4.first,
h5.first,
h6.first {
	margin-top:0;
	}
	
h1 {
	font-size:1.2em;
	}
	
h2 {
	font-size:1.1em;
	}
	
h3 {
	font-size:.9em;
	background:url(../Content/images/bg-line.png) repeat-x bottom;
	}
	
h4 {
	font-size:.8em;
	}
	
h5 {
	font-size:.8em;
	}
	
h6 {
	font-size:.8em;
	}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 FORMS
	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

fieldset
{
	padding: 10px;
	margin: 15px 0;
	position: relative;
}

.input-box p
{
	padding: 0px 20px 0px 20px;
}

fieldset fieldset {
	margin:10px 0;
	width:90%;
	}
	
legend
{
	font-weight: bold;
	font-size: 14px;
	padding: 0px 10px 0px 10px;
	color: #000000;
	font-family: "trebuchet MS" , verdana, sans-serif;
}
	
.input-box
{
	display: block;
	vertical-align: top;
	padding: 20px 25px 5px 15px;
	color: #666666;
	font-size: 12px;
	border: 1px solid #A8A8A8;
}

/*	
input[type="text"], input[type="password"]
{
    border: 1px solid #999999;
    height: 18px;
}
*/

label {
	font-weight:bold;
	font-size:1em;
	font-weight:bold;
	display:block;
	}

.checkbox {	
	margin:12px 0;
	padding:4px 0 2px 3px;
	border:1px dotted #585858;
	width:95%;
	}
	
.checkbox input {	
	margin-right:6px;
	margin-bottom:2px;
	}

.forgot-password {
	margin:2px 0;
	font-size:.65em;
	}
	
input.button {
	color:#FFF;
	background:#317f0c url(../Content/images/bg-button.png) repeat-x;
	border:2px groove #FFF;
	font-size:.7em;
	font-weight:bold;
	padding:0 5px 2px 5px;
	cursor:pointer;
	}
	
input.button-big {
	padding:6px 20px;
	}
	
form
{
	display:block;
	float: left;
	margin-right: 20px;
}
	
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 LINKS
	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

a:link {
	color:#005598;
	text-decoration:underline;
	}

a:visited {
	color:#005598;
	text-decoration:underline;
	}

a:hover {
	text-decoration:none;
	}

a:active {
	text-decoration:underline;
	color:#005598;
	}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 HEADER
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.header-top
{
	height: 125px;
	background-color: #FFFFFF;
	border-bottom-style: solid;
	border-bottom-width: 15px;
	border-bottom-color: #005598;
}

.header-logo
{
	display: block;
	float: left;
	background-position: left;
	background: url(../Content/images/HKLogo.jpg);
	background-repeat: no-repeat;
	width: 251px;
	height: 140px;
	_height: 125px;
}

.portalname
{
	font-size: 1.9em;
	float: right;
	font-family: "trebuchet MS" , verdana, sans-serif;
	margin-top: 90px;
	color: #FFFFFF;
	text-align: right;
	padding-right: 15px;
	letter-spacing: 0.1em;
}

.header-top-right
{
	display: block;
	float: right;
	background-position: right;
	background: url(../Content/images/header-right.gif);
	background-repeat: no-repeat;
	width: 435px;
	height: 140px;
	_height: 125px;
}

.header-container
{
	position: relative;
	padding: 6px 0 0 0;
	background: #70A0E0;
	color: #FFF;
	min-height: 1px;
	_height: 1px;
	border-right-width: 15px;
	border-left-width: 15px;
	border-right-color: #005598;
	border-left-color: #005598;
	border-right-style: solid;
	border-left-style: solid;
	border-bottom-style: solid;
	border-bottom-width: 15px;
	border-bottom-color: #005598;
}

.logo-container
{
	width: 175px;
	padding-top: 10px;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 LOGIN
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.logincontainer
{
	width: 800px;
}

.logincontainer legend
{
	padding-bottom: 0px;
}

.logincontainer fieldset
{
	padding-left: 20px;
}

.logincontainer .login
{
	width: 300px; 
	display: inline-block;
	margin-right: 20px;
}

.nav-login  {
	font-size:.9em;
	text-align:right;
	margin:10px 15px 15px 0;
	float:right;
	width:20%;
	}

/* LOGIN LISTS */

.nav-login ul {
	margin:0;
	padding:0;
	}

.nav-login li {
	list-style:none;
	padding:3px 0 3px 17px;
	display:inline;
	margin-left:15px;
	background:url(../Content/images/bullet.png) no-repeat 0 4px;
	}

.nav-login li.first {
	list-style:none;
	margin-left:0;
	}
	
/* LOGIN LINKS */

.nav-login a:link,
.nav-login a:visited{
	color:#FFF;
	text-decoration:none;
	}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 MAIN NAV
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.nav-container
{
	background: #f6f6f6;
	min-height: 28px;
	_height: 28px;
	float: left;
	width: 780px;
	padding-left: 180px;
}

.nav-inner 
{
	font-family:"trebuchet MS", verdana, sans-serif;
	border-bottom: 1px dotted #686868;
	min-height:28px;
	_height:28px;
}

.nav-main
{
	min-height: 40px;
	_height: 40px;
}

/* MAIN NAV LISTS */

.nav-main ul {
	margin:0;
	padding:0;
	}

.nav-main li
{
	list-style: none;
	float: left;
	padding: 0;
	min-height: 40px;
	background-color: #CCCCCC;
	width: 60px;
	margin-right: 2px;
	line-height: 40px;
	text-align: center;
}
	
.nav-main .active
{
	background-color: #005598;
	color: #FFFFFF;
}

.nav-main li a {
	display:block;
	padding:0 10px;
	border-right:1px dotted #7A7A7A;
	}

.nav-main li.first a {
	padding-left:0;
	}
	
/* NAV MAIN LINKS */

.nav-main a:link,
.nav-main a:visited {
	color:#33840c;
	text-decoration:none;
	}

.nav-main .active a:link,
.nav-main .active a:visited {
	color:#000;
	}

.nav-main a:hover {
	text-decoration:underline;
	}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 FOOTER
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.footer {
	padding:10px 0;
	_height:1px;
	background:#005598;
	clear:both;
	}

.nav-footer {
	position:relative;
	_height:1px;
	margin:0 100px;
	text-align:center;
	clear:both;
	}

.nav-footer ul{
	padding:0;
	margin:0;
	text-align:center;
	}

.nav-footer li{
	background:none;
	display:inline;
	border-right:1px dotted #686868;
	padding:0 10px;
	}

.nav-footer li.first {
	border-left:1px dotted #686868;
	}
	
.copyright {
	color:#FFFFFF;
	font-size:.7em;
	clear:both;
	margin:5px 0 0 0;
	}

.nav-footer a:link,
.nav-footer a:visited {
	color:#CCC;
	}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 LISTS
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

li {
	list-style:none;
	padding:3px 0 3px 17px;
}
	
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 FORM ELEMENTS
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
	
.formwrapper
{
    display: block;
    float: left;
    width: 740px;
    _width: 730px;
    font-size: .75em;
    font-weight: normal;
    font-size: 12px;
}

.forminner
{
    display: inline-block;
    float: left;
    width: 350px;
}

.formwrapper h2
{
	font-weight: bold;
	font-size: 1.4em;
}

.formwrapper fieldset
{
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    margin-bottom: 18px !important;
    margin-top: 0;
    padding: 10px 6px 6px 6px;
}
.formwrapper p
{
	margin: 3px 0px 6px 0px;
}
.formwrapper .xsmall
{
    width: 100px;
}
.formwrapper .small
{
    width: 180px;
}

.formwrapper .medium
{
    width: 280px;
}

.formwrapper .large
{
    width: 730px;
    margin-bottom: 5px;
}

.formwrapper ul
{
	padding-left: 0px;
	margin-left: 40px;
}

.formwrapper li
{
	list-style-type: disc;
	list-style-position: outside;
}

.formwrapper label
{
	font-weight: normal;
	display: inline-block;
}

.formwrapper checkbox
{
	display:block;
}

.formwrapper input[type="text"], .dropdown
{
	display:inline-block;
}


.formwrapper .dropdown
{
	width:149px;		
	width/*\**/:155px\9/*IE8 only*/
}

.inlineinfo
{
    background-color:#FFFFFF;
    background-image:url(/Content/Images/info_little.png);
    background-position:left center;
    background-repeat:no-repeat;
    border:1px dotted #CCCCCC;
    display:block;
    margin-bottom:5px;
    padding:5px 5px 5px 30px;
}

.hidden
{
	visibility: hidden;
}

#large input[type="submit"] 
{
    margin-bottom: 6px;
	margin-top:10px;
}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 QUESTIONNAIRES
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.inner
{
	margin-top: 20px;
}

.questionnairepic
{
	width:855px;
	display: block;
}

.questionPanel
{
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom-style: dashed;
	border-bottom-width: thin;
	border-bottom-color: #C0C0C0;
}

.questionnairepic img
{
	width:128px;
	height:128px;
	float:right;
	display:block;
}

.input-validation-error
{
	border: 1px solid #F8ACAC;
	background-color: #FFF1F1;
	padding-right: 4px;
}

.field-validation-error
{
	font-weight: bold;
	color: #ff0000;
	margin-left: 10px;
}

.validation-summary-errors
{
	background: none repeat scroll 0 0 #FFF1F1;
	border-bottom: 1px solid #FDDCDC;
	color: #664B4B;
	margin-bottom: 20px;
	padding: 0px 0px 5px 0px;
	margin-left: -6px;
	margin-right:-6px;
	display:block;
}

.validation-summary-errors span
{
	background: url(images/alert-failure.gif) no-repeat scroll 13px 11px #FFD1D1;
	border-bottom: 1px solid #F8ACAC;
	border-top: 1px solid #F8ACAC;
	margin: 0;
	padding: 10px 0px 10px 35px;
	display: block;
}

.validation-summary-errors ul
{
	margin-left:20px;
	margin-top: 20px;
}

.validation-summary-errors li
{
	font-size: .8em;
	padding: 0;
	color: #000000;
	height: 20px;
	font-weight: normal;
	font-size:12px;
	color:#664B4B;
	vertical-align:middle;
}

.step
{
	font-weight: bold;
	font-size: 1.3em;
	margin-right: 5px;
	color: #005598;
}

.steptitle
{
	font-weight: bold;
	font-size: 1.25em;
	color: #005598;
}

.stepinfo
{
	margin-left: 35px;
}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 MISC STYLES
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.none {
	display:none;
	}

.clear {
	clear:both;
	font-size:1px;
	margin:0;
	padding:0;
	}

.align-left {
	float:left;
	margin:0 20px 15px 0;
	}

.align-right
{
	float: right;
	margin: 0 0 0px 20px;
}

.align-middle {
	vertical-align:middle;
	}
	
.inline {
	display:inline;
	}

.no-margin {
	margin:0;
	}
	
.red
{
	color:#ff0000;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~	 
	 GRID STUFF	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.grid_16p
{
	width: 960px;
	display: inline;
	float: left;
	position: relative;
	border-right-style: solid;
	border-left-style: solid;
	border-right-width: 15px;
	border-left-width: 15px;
	border-right-color: #005598;
	border-left-color: #005598;
	background-color: #F6F6F6;
}

.grid_13p
{
	width: 759px;
	display: inline;
	float: left;
	position: relative;
	padding-left: 10px;
	padding-right: 10px;
	border-left-style: dotted;
	border-left-width: 1px;
	border-left-color: #686868;
	background-color: #FFFFFF;
	padding-top: 10px;
	min-height: 290px;
	_height: 290px;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	 
	 SIDE BUCKET
	 	 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.side-bucket {
	margin-bottom:20px;
	line-height:normal;
	float:left;
	_right:-10px;
	}

/* SIDE BUCKET LISTS */

.side-bucket ul
{
	margin: 0 0 10 0;
	padding: 0;
	_height: 1px;
}


.side-bucket li
{
	list-style: none;
	border-bottom: 1px dotted #7a7a7a;
	background-position: 0 4px;
	font-size: 12px;
	padding-left: 0px;
	width: 160px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.side-bucket li.first {
	border-top:1px dotted #7a7a7a;
	}
	
	
.side-bucket li.current
{
	font-weight: bold;
}	
	
/* SIDE BUCKET LINKS */

.side-bucket a:link,
.side-bucket a:visited {
	text-decoration:none;
	display:block;
	_display:inline;
	}
	
.side-bucket a:hover {
	text-decoration:underline;
	}
	
#warningMsg {
    position:absolute;
    display:none;
    width:375px;
    color:#FFFFFF;
    border:3px solid #005598;
    padding:10px;
    background-color:#70A0E0;
    top:-400px;
    left:-400px; font-weight:bold
}

#btnDiv {
    text-align:center;
}
#sessionStatus
{
	font-size: 10px;
	color: #FFFFFF;
}

#StatusGrid
{
    margin-top:10px;
    margin-bottom:10px;   
    overflow:auto;
    width: 940px;
}

.reportcontainer
{
    width: 940px;
    float: left;
    padding:10px;
}