/********************************************************************************/
/********************************************************************************/
/*
*
*
*	This contains the main CSS for the template.
*
*
*
/********************************************************************************/
/********************************************************************************/

/*
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.5.2
*/
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,
form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table
{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,
dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym 
{border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select
{*font-size:100%;}legend{color:#000;}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/


body {
	background					: #FFFFFF;
	font						: 16px Helvetica, Verdana, Arial, sans-serif;
	color						: #000000;
}


#main {
	width						: 1000px;
	margin-left					: auto;
	margin-right				: auto;
	position					: relative;
	_overflow-x					: hidden;
}

#header {
	height						: 108px;
	overflow					: hidden;
	margin-top					: 20px;
	background					: #FFFFFF url('images/service_request_portal.gif') top right no-repeat;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* MAIN MENU START */

#main_menu ul {
	margin						: 0 auto;
	padding						: 0; 
	height						: 30px; 
	width						: 100%; 
	display						: block; 
	background					: url('images/topMenuImages.png') repeat-x;
}

#main_menu ul li {
	padding						: 0; 
	margin						: 0; 
	list-style					: none; 
	display						: inline;
}

#main_menu ul li a {
	float						: left; 
	padding-left				: 15px; 
	display						: block; 
	color						: #FFFFFF; 
	text-decoration				: none; 
	font-size					: 12px; 
	cursor						: pointer; background:url('images/topMenuImages.png') 0px -30px no-repeat;
}

#main_menu ul li a span { 
	line-height					:30px; 
	float						:left; 
	display						:block; 
	padding-right				:15px; 
	background					:url('images/topMenuImages.png') 100% -30px no-repeat;
}

#main_menu ul li a:hover {
	background-position			: 0px -60px; 
	color						: #FFFFFF;
}

#main_menu ul li a:hover span {
	background-position			: 100% -60px;
}

#main_menu ul li a.selected, #main_menu ul li a.selected:hover {
	line-height					: 30px; 
	font-size					: 12px; 
	background					: url('images/topMenuImages.png') 0px -90px no-repeat;
	color						: #000000;
}

#main_menu ul li a.selected span, #main_menu ul li a.selected:hover span {
	background		: url('images/topMenuImages.png') 100% -90px no-repeat;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* MODULE MENU START */

#module_menu {
	margin						: 0px;
	padding-left				: 50px;
	height						: 1%;
	position					: relative;
}

#module_menu ul li {
	display						: inline;
	position					: relative;
}

#module_menu ul li a, #module_menu ul li a:visited {
	padding						: 4px 8px 4px 8px;
	color						: #0031B3;
	text-decoration				: none;
	font-size					: 75%;
	float						: left;
	display						: block;
	text-align					: center;
	margin-right				: 10px;
	border-bottom				: none;
}

#module_menu ul li a span, #module_menu ul li a:visited span {
	text-align					: center;
	display						: block;
}

#module_menu ul li a img, #module_menu ul li a:visited img {
	margin-bottom				: 5px;
}

#module_menu ul li a.selected, #module_menu ul li a.selected:visited {
	background					: #f7f7f7;
	color						: #000000;
	font-weight					: bold;
	border-bottom				: none;
	text-align					: center;
}

#module_menu ul li a:hover, #module_menu ul li a.selected:hover {
	background					: #FFFFFF;
	color						: #000000;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* MODULE SUBMENU START */

#module_submenu {
	margin-bottom				: 50px;
	text-align					: center;
	position					: relative;
	height						: 1px;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* CONTAINER FOR BOTH COMPONENTS AND MODULE */

#output {
	background					: #D0D0D0;
	height						: 1%;
	position					: relative;
}


/* USER DETAILS */

#userDetails {
	text-align					: right;
	padding						: 10px;
	padding-top					: 15px;
	font-size					: 68.8%;
}


/* ERROR OUTPUT START */

#minorErrors {
	font-size					: 75%;
}

#minorErrors div span {
	font-weight					: bold;
	color						: #FF0000;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* ERROR STYLING */

#module p.error, p.warning, p.success, p.info, p.validation {
	font						: 75%;
	font-weight					: bold;
	font-family					: Verdana, Arial, Helvetica, sans-serif;
	padding						: 20px 0px 20px 60px;
	margin						: 0px 0px 20px 0px;
	height						: 1%;
}

#module p.error {	
	background					: #FFBABA url('images/error.gif') no-repeat 10px center;
	color						: #FF0000;
	border						: solid #FF0000;
	border-width				: 2px 0px 2px 0px;
}


#module p.warning {
	background					: #F7F7F7 url('images/warning.gif') no-repeat 10px center;
	color						: #000000;
	border						: solid #CCCCCC;
	border-width				: 2px 0px 2px 0px;
}


#module p.validation {
	background					: #FEEFB3 url('images/validation.gif') no-repeat 10px center;
	color						: #B88630;
	border						: solid #9F6000;
	border-width				: 2px 0px 2px 0px;
}

#module p.info {
	background					: #BDE5F8 url('images/info.gif') no-repeat 10px center;
	color						: #000000;
	border						: solid #1D439D;
	border-width				: 2px 0px 2px 0px;
}

#module p.success {
	background					: #BDE5F8 url('images/success.gif') no-repeat 10px center;
	color						: #000000;
	border						: solid #1D439D;
	border-width				: 2px 0px 2px 0px;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* START OF MODULE */

#module {
	padding						: 0px;
	height						: 1%;
	position					: relative;
	margin						: 0px;
}

#moduleOutput {
	border-top					: dotted #999999;
	border-left					: solid #F7F7F7;
	border-right				: solid #F7F7F7;
	border-bottom				: solid #EEFEEE;
	border-width				: 1px 1px 3px 1px;
	padding						: 20px;
	padding-top					: 30px;
	background					: #FFFFFF;
	position					: relative;
	height						: 1%;
}

#moduleOutput div.partwidth {
	width						: 730px;
	float						: right;
	position					: relative;
}

#module h2 {
	font-size					: 120%;
	font-weight					: bold;
	color						: #281F4C;
	padding-top					: 10px;
	padding-left				: 20px;
	margin-bottom				: 10px;
}

#module h2 span {
	font-weight					: normal;
	font-size					: 60%;
	padding-left				: 10px;
	font-weight					: bold;
	color						: #0031B3;
}

#module h2 img {
	vertical-align				: middle;
	margin-right				: 7px;
}

#module h3 {
	font-size					: 112.5%;
	font-weight					: bold;
	margin-bottom				: 20px;
	color						: #0031B3;
}

#module h4 {
	font-size					: 81.3%;
	font-weight					: bold;
	margin-bottom				: 10px;
}

#module p {
	color						: #000000;
	font-size					: 75%;
	margin-bottom				: 20px;
	margin-left					: 0px;
}

#module p strong {
	font-weight					: bold;
}

#module p.caution {
	color						: #000000;
}

#module p.caution strong {
	color						: #FF0000;
}

#module p.center {
	text-align					: center;
}

fieldset p.right, #module p.right {
	text-align					: right;
}

#moduleOutput ul {
	margin-bottom				: 20px;
}

div.topMenu {
	text-align					: center;
	padding-right				: 10px;
	padding-top					: 0px;
	margin-bottom				: 40px;
}

div.bottomMenu {
	text-align					: right;
	padding-right				: 10px;
	margin-top					: 10px;
	margin-bottom				: 30px;
}
		
.pane fieldset div.topMenu {
	padding-top					: 0px;
	margin-top					: -10px;
}

.pane {
	width						: auto;
	padding-right				: 40px;
}

a, a:visited {
	color						: #0000FF;
	text-decoration				: none;
}

a:hover {
	text-decoration				: underline;
}

div.clearBoth {
	clear						: both;
}

.floatRight {
	position					: relative;
	float						: right;
}

div.colLeft {
	width						: 49%;
	float						: left;
	clear						: left;
}

div.colRight {
	width						: 49%;
	float						: right;
	clear						: right;
}

#module div.tick {
	height						: 20px;
	background					: url('images/tick.gif') no-repeat center center;
}

#module div.cross {
	height						: 20px;
	background					: url('images/cross.gif') no-repeat center center;
}

#module div.tick span, #module div.cross span {
	display						: none;
	visibility					: hidden;
}



/*****************************************************************************************/
/*****************************************************************************************/

/* STYLING OF BUTTONS */

input.button, input.button:visited {
	padding						: 3px 7px 3px 7px;
	background					: #FF5353;
	color						: #FFFFFF;
	margin-right				: 5px;
	border						: 2px outset #DDDDDD;
	cursor						: pointer;
	font-size					: 12px;
	-moz-border-radius			: 7px;
	-webkit-border-radius		: 7px;
	width						: auto;
	overflow					: visible;
}

input.button:hover {
	background					: #DDDDDD;
	color						: #000000;
}

input.dark {
	background					: #1C19A4;
	color						: #FFFFFF;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* STYLING OF READ WRITE */

div.readwrite_header {
	width						: 102px;
}

div.readwrite_header span {
	float						: left;
	width						: 49%;
	text-align					: center;
	margin-bottom				: 10px;
}

div.readwrite {
	clear						: both;
}

div.readwrite input.checkbox {
	display						: block;
	width						: 50px;
	text-align					: center;
	background					: #DDDDDD;
	float						: left;
	margin-bottom				: 5px;
}

div.readwrite label {
	margin-left					: 10px;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* PAGINATION STYLING */

div.pagination {
	margin						: 20px;
	text-align					: center;
	padding-left				: 200px;
	padding-right				: 200px;
	font-weight					: bold;
	font-size					: 75%;
	background					: url('images/pagination_bg.gif') top center no-repeat;
}

div.pagination div.display {
	margin-bottom				: 10px;
}

div.pagination span.back, div.pagination span.next {
	color						: #888888;
}

div.pagination span.current {
	font-size					: 120%;
	margin-left					: 5px;
	margin-right				: 5px;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* Table styling */

div.listContainer {
	text-align					: center;
}

table.list {
	margin-left					: auto;
	margin-right				: auto;
	margin-bottom				: 10px;
	width						: 100%;
	border						: 1px solid #F7F7F7;
	text-align					: left;
}

table.noborder {
	border						: none;
}

/*\*/ * html table.list { width: 100%; } /**/

table.list th {
	background					:  #000C5E;
	color						: #FFFFFF;
	font-weight					: bold;
	padding						: 5px;
	font-size					: 75%;
}

table.list th a, table.list th a:visited {
	color						: #FFFFFF;
}

table.list th.orderedASC {
	background				: url('images/columnASC.gif') no-repeat center bottom #0076BD;
}

table.list th.orderedASC a, 
table.list th.orderedASC a:visited, 
table.list th.orderedDESC a,
table.list th.orderedDESC a:visited {
	color						: #FFFFFF;
}

table.list th.orderedDESC {
	background					: url('images/columnDESC.gif') no-repeat center top #0076BD;
}

table.list tr.row0 {
	background					: #FFFFFF;
}

table.list tr.row1 {
	background					: #F7F7F7;
}

table.list tr.row0:hover, table.list tr.row1:hover {
	background					: #EfEfEf;
}

table.list tr.row0:hover td.sorted, table.list tr.row1:hover td.sorted {
	background					: #EfEfEf;
}

table.list tr td {
	padding						: 5px;
	font-size					: 75%;
}

#module table.list tr td h4 {
	font-size					: 100%;
}

table.list tr td.orderedASC, table.list tr td.orderedDESC {
	border						: 1px dotted #888888;
	border-width				: 0px 1px 0px 1px;
}

table.list tr td.label {
	font-weight					: bold;
	vertical-align				: top;
	color						: #1C19A4;
	width						: 50%;
	padding-left				: 30px;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* LOOKUP STYLING */

#moduleOutput input.lookup {
	background					: #ECECEC;
	width						: 150px;
}

a.lookup {
	position					: absolute;
	top							: 0px;
	left						: 340px;
	display						: absolute;
	width						: 16px;
	height						: 16px;
	overflow					: hidden;
	text-decoration				: none;
	padding						: 0;
	background					: url(images/lookup.gif) no-repeat; 
}

div.emphasize a.lookup, p.emphasize a.lookup {
	top							: 10px;
}

a.lookup span {
	visibility					: hidden;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* SELECT GROUP STYLING */

div.groupSelect {
	clear				: both;
	position			: relative;
	padding-left		: 40px;
	padding-right		: 40px;
	height				: 1%;
}

div.groupSelect div.select {
	float				: left;
	width				: 33%;
	position			: relative;
	text-align			: center;
}

div.groupSelect select.left, div.groupSelect select.right {
	width				: 100%;
	display				: block;
	position			: relative;
	font-size			: 81.5%;
}

div.groupSelect div.controls {
	float				: left;
	width				: 33%;
	text-align			: center;
	margin-top			: 4em;
}

div.groupSelect div.controls input.button {
	display				: block;
	width				: 70px;
	margin-bottom		: 5px;
	margin-left			: auto;
	margin-right		: auto;
}

div.groupSelect label {
	font-size			: 85.5%;
	display				: block;
	text-align			: left;
	font-weight			: bold;
	margin-bottom		: 0.3em;
}

/*****************************************************************************************/
/*****************************************************************************************/



/*****************************************************************************************/
/*****************************************************************************************/

/* FOOTER START */

#footer {
	border-top				: 2px solid #000000;
	width					: 1000px;
	margin-left				: auto;
	margin-right			: auto;
	font-size				: 68.8%;
}

#copyright {	
	width					: 1000px;
	margin-left				: auto;
	margin-right			: auto;
	color					: #999999;
	padding-top				: 20px;
	padding-bottom			: 5px;
}

#timeloaded {
	width					: 1000px;
	margin-left				: auto;
	margin-right			: auto;
	color					: #999999;
	padding-top				: 5px;
	padding-bottom			: 20px;
}

/*****************************************************************************************/
/*****************************************************************************************/

		

/*****************************************************************************************/
/*****************************************************************************************/

/* FIELD SET STYLING */

fieldset {
	border					: 1px solid #CCCCCC;
	padding					: 25px 10px 10px 10px;
	position				: relative;
	background				: url(images/fieldset_bg.jpg) bottom left repeat-x #FFFFFF;
	width					: 100%;
	display					: block;
	margin-bottom			: 30px;
	padding-bottom			: 20px;	
	margin-right			: 0px;
	margin-left				: 10px;
}


fieldset legend {
	position				: absolute;
	top						: -13px;
	left					: 10px;
	padding					: 0.4em 1em 0.4em 1em;
	border					: 1px solid #CCCCCC;
	background				: #FFFFFF url('images/pane_bg.gif') repeat-x top left;
	font-size				: 75%;
	color					: #FFFFFF;
}

html>/**/body fieldset legend, x:-moz-any-link, x:default { 
	margin-top				: -25px;
	margin-bottom			: -25px;
}



fieldset.left {
	position				: relative;
	float					: left;
	width					: 45%;
	clear					: left;
	_margin-left			: 0px;
	margin-top				: 20px;
	margin-right			: 0px;
}

fieldset.right {
	position				: relative;
	float					: right;
	width					: 45%;
	clear					: right;
	margin-top				: 20px;
	margin-right			: -30px;
	_margin-right			: -20px;
}

fieldset p.required_text img {
	margin-right	: 5px;
}

fieldset p {
	margin-bottom	: 20px;
	font-size		: 75%;
}

#module fieldset div.colLeft p, #module fieldset div.colRight p {
	margin-left		: 40px;
}

#module fieldset p.required_text {
	top				: 10px;
	right			: 10px
	position		: absolute;
	font-size		: 68.8%;
	color			: #999999;
	vertical-align	: center;
	text-align		: right;
	clear			: both;

}

h3 {
	background		: #FFFFFF url('images/pane_bg.gif') repeat-x top left;
	font-weight		: bold;
	padding			: 0.4em 1em 0.4em 1em;
	border			: 1px solid #CCCCCC;
	width			: 100%;
}

fieldset h3 {
	clear			: both;
	margin-bottom	: 40px;
	margin-left		: 10px;
	margin-right	: 10px;
	background		: #DDDDDD;
	border			: 1px solid #CCCCCC;
	background		: #FFFFFF url('images/pane_bg.gif') repeat-x top left;
	padding			: 0.4em 1em 0.4em 1em;
	font-weight		: bold;
	width			: auto;
}

fieldset h4 {
	margin-bottom	: 10px;
	font-weight		: bold;
	font-size		: 81.3%;
	margin-left		: 10px;
}

#moduleOutput div.pane ul li {
	font-size		: 75%;
	margin-left		: 40px;
	padding-left	: 6px;
	list-style-type	: disc;
}

#module div.pane .igroup ul {
	margin-top		: 0px;
}

#module div.pane .igroup ul li {
	list-style-type	: none;
}

/* END OF FIELDSET STYLING */





.igroup {
	clear			: both;
	position		: relative;
	margin-bottom	: 20px;
}

.emphasize {
	border			: 1px solid #0012FF;
	background		: #FFFFFF url('images/pane_bg.gif') repeat-x top left;
}

label {
	font-size		: 75%;
}

.igroup label {
	display			: block;
	width			: 160px;
	position		: relative;
	text-align		: right;
	outline			: none;
}

.emphasize label {
	padding-top		: 10px;
}

.igroup label em {
	color			: #FF0000;
	font-weight		: bold;
	position		: absolute;
	left			: 170px;
	top				: 0px;
	display			: block;
}

.igroup label span {
	color			: #FF0000;
	padding-left	: 1.5em;
}

.igroup input, .igroup select {
	position		: absolute;
	left			: 185px;
	top				: 0px;
	font-size		: 68.8%;
}

.emphasize input, .emphasize select {
	top				: 10px;
}

.igroup input {
	outline			: none;
}

textarea {
	border			: 1px solid #999999;
	font-size		: 75%;
}

.igroup textarea {
	top				: -15px;
	left			: 185px;
	position		: relative;
	width			: 300px;
	height			: 50px;
	margin-bottom	: -20px;
}

.igroup textarea.narrow {
	width			: 220px;
	height			: 130px;
}

.igroup textarea.wide {
	width			: 600px;
	height			: 300px;
}
 
.igroup ul {
	top				: -30px;
	left			: 175px;
	position		: relative;
	width			: auto;
	margin-bottom	: -30px;
	padding-bottom	: -30px;
}

.igroup ul li {
	position		: relative;
	margin-bottom	: 0.5em;
}

.igroup ul li input {
	position		: absolute;
	left			: 0px;
	top				: 0px;
	display			: inline;
}

.igroup ul li label {
	text-align		: left;
	width			: auto;
	padding-left	: 2em;
	margin-bottom	: 0px;
}

input.text {
	font-size		: 81.3%;
	border			: 1px solid #999999;
}

input.small {
	width			: 50px;
}

input.medium {
	width			: 100px;
}

input.large {
	width			: 150px;
}

input.checkbox {
}

option.disabled {
	background		: #CCCCCC;
	color			: #000000;
}
