/*311 web wizard css - last edited April 4, 2013 by lkline*/

/* Margins & padding */
*, body, h1, h2, h3, h4, h5, h6, form, p, input { margin: 0px;  padding: 0px; }

/* Font preferences */
body { 
	font-size:100%; 
	font-family: arial, helvetica, sans-serif;
	background-color: #ffffff;
	margin-top:5px;
}

div#wrapper {
	width: 929px;
	margin: auto;
	text-align: left;
}

#layout { 
	float:left;
	width: 929px;
	background: #ffffff;
	margin-bottom:20px;
}


h1, h2, h3, h4, h5, h6, form span{ 
	font-size: 1em; /* 16px * 0.75 = 12px */ 
	line-height: 1.5em;
}

p, ul, ol, h1, span{ 
	font-size: .75em; /* 16px * 0.75 = 12px */ 
	line-height: 1.5em;
}

#nav { font-size: 1em; }

ul ul { 
	font-size: 1em;
}


form {
	font-size: 1em; /* 16px * 0.75 = 12px */ 
}
form fieldset legend { font-size: 0.75em; /* 16px * 0.75 = 12px */  }

.hide { position: absolute; left: -200em; }

/* LK ADDED THIS ONE */
.hidden_button {
	display: none;       /* see IE6 CSS */
}

.large_text {
	font-size: 1.5em;
	font-weight: normal;
 	text-align: left;
}

/* LK ADDED THESE ONES */
.large_text_subheading {
	font-size: 1.5em;
	font-weight: normal;
 	text-align: left;
	padding: 15px 0px;
}

.medium_text {
	font-size: 1.3em;
	font-weight: normal;
 	text-align: left;
	padding-top: 10px;
}

.note_text {
	font-size: 1.1em;
	font-weight: normal;
 	text-align: left;
	padding-top: 10px;
	padding-right: 20px;
	line-height: 1.3em;
}

.fine_print {
	font-size: .9em;
	font-weight: normal;
 	text-align: left;
	padding-top: 5px;
	padding-right: 20px;
	line-height: 1.3em;
}

.tooltip_note {
	font-size: .9em;
	color: #666666;
}

/* Positioning*/

/* Header */
#header { 
	float: left;
	height: 70px;
	padding:15px;
	padding-bottom:0;
	width: 899px;
	overflow: hidden;
	background: #ffffff;
}


h1#logo {
	padding-top: 74px; /* height of the replacement image */
   	float:left;
	height: 0px;
    	overflow: hidden;
    	background-image:  url(../images/cot_logo_home.gif);
    	background-repeat: no-repeat;
}

.secure {
	float:right;
	margin-top:15px;
	background:url(../images/secure.gif) left center no-repeat;
	padding-left: 35px;
	color:#005695;
}

.secure a {
	color: #000000;
	text-decoration:underline;
}

/* end Header */

#image {
	float:left;
	height: 150px;
	width: 929px;
	padding:0;
	margin:0;
	overflow:hidden;
}

#menu {
	float:left;
	height: 50px;
	width: 929px;
	border-top: solid 1px #ffffff;
	border-bottom: solid 5px #a4b0bb;
	background: #064e80;
	overflow:hidden;
}


#nav {
	float:left;
	list-style-type: none;
	color:#ffffff;
	display:block;
	margin:15px 0 0 25px;

}

#nav li {
	color:#a4b0bb;
	display:inline;
	font-size:0.9em;
	margin-left:5px;
}

#nav li a {
	color:#a4b0bb;
	text-decoration:none;
}

#nav .first {
	margin-left:0;
}

#nav li.active a {
	color:#ffffff;
	font-weight:bold;
}

#nav li.active {
	color:#ffffff;
}

#nav li a:hover {
	text-decoration:underline;
}

#content {
	float:left;
	background-color:#fafbfc;
	width: 599px;
	margin: 3px 0 10px 0;
	padding: 5px 15px 20px 15px;
}

#content h2 {
	font-size:1.3em;
	color:#275577;
	border-bottom:dotted 1px #275577;
	margin-bottom:5px;
}

#content p {
	padding: 5px 0;
}


fieldset {
	border: solid 1px #064e80; 
	color:#275577; 
	padding: 0 10px 10px 10px;
	margin-top:15px;
}


.numbered li {
	/*float: left;          
	clear:both;*/ 
	margin:10px 0;
}


fieldset ul.checkbox input{
	margin-left: -20px;
}

fieldset ul.checkbox label{
	text-indent: -20px;
}

fieldset legend {  
	text-transform: uppercase;
	font-weight:bold;
	padding: 5px;
	margin-left: 10px;
	color: #ffffff;
	background: #064e80;
	letter-spacing:1px;
}

fieldset ol, fieldset ul{
	list-style: none;
	margin-top: 10px;
	margin-left: 20px;
}

fieldset .numbered {
	list-style: decimal outside !important;
	margin-left: 5px;
	padding-left: 20px;
}

fieldset ol.checkbox ol, fieldset ul.checkbox ul{
	margin-left: 40px;
	list-style: disc;
} 


fieldset li { 
	/*float: left;*/       
	margin:5px 0;
}



/* Joseph Modify below */ 

ol.questions li  {
	/*float:left;
	width:450px;*/
	clear:both;
	padding-bottom:5px;
}

ol.questions li .label {
	float:left;
	width:160px;
	padding: 3px 0;
	font-weight:bold;
	text-align: right;
}

/* LK ADDED THESE ONES */
ol.questions li .reviewlabel {
	float:left;
	width:125px;
	padding: 3px 0;
	font-weight:bold;
	text-align: left;
	margin-left: 20px;
}

ol.questions li .reviewlabel_status {
	float:left;
	width:145px;
	padding: 2px 0 22px 0;
	font-weight:bold;
	text-align: left;
	margin-left: 0px;
}

ol.questions li .required {
	width:140px;
	padding-right:20px;
	background: transparent url(../images/required.gif) no-repeat right top;
}

ol.questions li .textfield {
	/*float:left;*/
	width: 200px;                /* was 192px */
	padding: 3px 5px;
	margin-left: 10px;
	border: solid #a4b0bb 1px;
}

ol.questions li .inline {
	margin-left: 10px;
}

ol.questions li .dropdown {
	/*float:left;*/
	width: 200px;              /* was 192px */
	/*padding: 3px 5px;*/
	padding: 3px 3px 3px 5px;
	margin-left: 10px;
	/*min-width: 100px;*/
	border: solid #a4b0bb 1px;
}

ol.questions li .textarea {
	width: 250px !important;             /* added important was 180px */
	height: 64px;            /* was 150px */
	padding: 3px 5px;
	margin-left: 10px;
	overflow-x: hidden;
	overflow-y: auto;
	border: solid #a4b0bb 1px !important;
	white-space: pre-line;            /* was normal */
}

/* LK ADDED THESE */
.fixedfield {
	padding: 5px;
	margin-left: 10px;
	font-size: 1.3em;
}

.fixedfieldtextarea {
	padding: 2px 10px 10px 5px;
	margin-left: 10px; /* was 20px (PL 20150225) */
	font-size: 1.3em;
	float: left;
	width: 370px;
	overflow: auto;
	word-wrap: break-word;
}

.fixedfieldsmall {
	padding: 5px;
	margin-left: 50px;
	font-size: 1em;
}

.fixedfield_status {
	font-size: 1.2em;
	line-height: 1.3;
}

.radiolabel {
	font-size: 1.2em;
	color: #000000;
}

.charsavailable {
	width: 24px; 
	padding: 1px 3px;
	margin: 0px 0px 3px 10px;
	border: solid #a4b0bb 1px;
	font-size: 1.1em;
	color: #275577;
}

ol.questions li fieldset { 
	/*width:290px;*/ 
	display:block;
	margin-left:35px;
	padding:0;
	border: none ; 
	color:#275577;
}

ol.questions li fieldset legend {	
	text-transform: none;
	font-size: 1em;
	color:#275577;
	font-weight:bold;
	padding: 5px;
	margin-left: 10px;
	background: none;
}

ol.questions li fieldset label {
	float:left;
	clear:both;
	display: block;
	margin-left:90px;
	padding:2px 0;
	font-weight:normal;
	text-align:left;
}


.agree {
	margin-left: 80px;       /*  LK CHANGED - WAS 125PX   */
	padding: 10px;            /*  LK ADDED   */
	display:block;
	text-align:left !important;	
	font-weight:normal !important;
}

.agreement {
	border: solid #a4b0bb 1px;
	background: #eeeeee;
	height:240px;
	width:70%;
	margin-left:50px;
	margin-top:20px;
	overflow: auto;
}

.agreement p {
	font-size:1em;
}

.agreement ol {
	font-size:1em;
}
.agreement li {
	margin-left:20px;
}

fieldset p {
	font-size: .75em;
	color:#275577;
	margin:0 10px;
}



/* The hint to Hide and Show */
#tooltip {
	/*visibility: hidden;*/
	font-size:0.75em;
	border: 1px solid #c93;
	padding: 10px 12px;
	/* to fix IE6, I can't just declare a background-color,
	I must do a bg image, too!  So I'm duplicating the pointer.gif
	image, and positioning it so that it doesn't show up
   	within the box */
     background: #ffc url(../images/pointer.gif) no-repeat -10px 5px;
}

.checkbox , .numbered {
	/*float:left;*/
	clear:both;
}

.numbered li {
	float:left;
	clear:both;
	margin-top:0;
}

.checkbox li {
	float:left;
	clear:both;
	margin-top:20px;
}

.checkbox li.hint_disabled { 
	color:#666;
}


.checkbox li.hint_enabled, .checkbox li.hint_disabled {
	margin-left:20px;
	margin-top:0;
	clear:both;
}

/*
.numbered li.hint_disabled, .numbered li.hint_enabled {
	list-style: decimal outside !important;
	display:inline-block;
}
*/

ol.questions li.hint_disabled, ol.questions li.hint_enabled {
	float:left;
	clear: both;
}

.hint_disabled { 
	background: url(../images/help_disabled.gif) no-repeat right;
	border-bottom: 1px dashed #ccc;
	padding:2px 30px 3px 0;
	cursor: pointer;
	cursor: hand;
}

.hint_enabled {  
	background: url(../images/help_enabled.gif) no-repeat right; 
	border-bottom: 1px dashed #ccc;
	padding:2px 30px 3px 0;
	cursor: pointer;
	cursor: hand;
}

.hint {
	/* these styles will not control the hint - they're controlled by #tooltip and set in ToolTip.js */
	display: none;
	position: absolute;
	z-index:200;
	font-size:1em;
	left: 375px;
	width: 180px;
	margin-top: 5px;
	border: 1px solid #c93;
	padding: 10px 12px;
	/* to fix IE6, I can't just declare a background-color,
	I must do a bg image, too!  So I'm duplicating the pointer.gif
	image, and positioning it so that it doesn't show up
	within the box */
	background: #ffc url(../images/pointer.gif) no-repeat -10px 5px;
}


/* The pointer image is added by using another span */
.hint .hint-pointer, #tooltip .hint-pointer {
	position: absolute;
	left: -10px;
	top: 5px;
	width: 10px;
	height: 19px;
	background: url(../images/pointer.gif) left top no-repeat;
}

.doublefield {
	/* this is detected and controlled from ToolTip.js - to position hint further to the right when there are 2 fields in the same row */
}

.cancel {
	float:left;
	display:block;
	margin-top:25px;
	padding-left:5px;
}

.cancel a {
	color: #993333;
	font-size:1.3em;
	text-decoration:underline;
}

.buttons {
	display:block;
	width:185px;  /* was 165 */
	float:right;
	/*padding:5px;*/
	padding-top: 5px;
	margin-top:15px;
	/*margin-right:10px;*/
}

input.back {
	float:left;
	height:35px;
	width:82px;
	overflow: hidden;
	border:none;
	background: transparent url(../images/back.gif) no-repeat;
}

input.back:hover, .backHover {
	background: transparent url(../images/back.gif) no-repeat 0 -70px !important;
}

input.back_only {
	float:left;
	height:35px;
	width:82px;
	overflow: hidden;
	border:none;
	background: transparent url(../images/back_only.gif) no-repeat;
}

input.back_only:hover, .back_onlyHover {
	background: transparent url(../images/back_only.gif) no-repeat 0 -35px !important;
}

input.next {
	float:left;
	height:35px;
	width:96px;
	overflow: hidden;
	border:none;
	background: transparent url(../images/next.gif) no-repeat;
}

input.next:hover, .nextHover {
	background: transparent url(../images/next.gif) no-repeat 0 -35px !important;
}

input.start {
	float:left;
	margin-left:82px;
	height:35px;
	width:96px;
	overflow: hidden;
	border:none;
	background: transparent url(../images/start.gif) no-repeat;
}

input.start:hover, .startHover {
	background: transparent url(../images/start.gif) no-repeat 0 -35px !important;
}

input.submit {
	float:left;
	height:35px;
	width:96px;
	overflow: hidden;
	border:none;
	background: transparent url(../images/submit.gif) no-repeat;
}

input.submit:hover, .submitHover {
	background: transparent url(../images/submit.gif) no-repeat 0 -35px !important;
}

input.confirm {
	float:left;
	margin-left:75px;
	height:35px;
	width:103px;
	overflow: hidden;
	border:none;
	background: transparent url(../images/confirm.gif) no-repeat;
}

input.confirm:hover, .sendHover {
	background: transparent url(../images/confirm.gif) no-repeat 0 -35px !important;
}

img.feedback {
	float: left;
	height: 35px;
	width: 114px;
	overflow: hidden;
	border: none;
	background: transparent url(../images/feedback.gif) no-repeat 0 -35px !important;
}

img.feedback:hover {
	background: transparent url(../images/feedback.gif) no-repeat 0 0px !important;
}

/* end content */

#sidebar {
	float:left;
	background-color:#e2ebf1;
	border-top:3px solid #ffffff;
	width: 290px;
	margin-left:10px;
	margin-bottom:15px;
}

#sidebar h2 {
	font-size:1em;
	color:#ffffff;
	padding: 5px 15px;
	margin-bottom:10px;
	background: #a0a7ab;
}

#sidebar p {
	padding: 5px 15px;
	margin-bottom:15px;
}

#sidebar img {
	text-align:center;
	width:260px;
	padding: 0 15px;
	margin-bottom:10px;
	border:0;
}

/* end sidebar */


#footer{
	float: left;
	display: block;
	font-weight:bold;
	color: #333333;
	background: #fff;
	padding: 5px 10px;
	border-bottom: solid 3px #b2b2b2;
	width: 900px /*909px*/;
	margin-bottom:40px;
	overflow:hidden;
}

#footer a, #footer a:visited  { 
	color: #333333;
	text-decoration:none;
}

#footer a:hover { text-decoration: underline;}


/*         AND LK ADDED THESE ONES            */
.errortext {
	font-weight: bold;
	text-transform:uppercase;
	color: #C52020;
}

.error {
	background: #F5E6E6;
	border:1px solid #C52020 !important;
}

.warningtext {
	color: #C52020;
}

.toggle_hide {
	display: none !important;
}

.toggle_show {
	display: block !important;
}