/*********** BASICS */
* {
	margin: 0;
}
html, body {
	/* Sets the height of the html element and the body to 100%. */
	height: 100%;
}
body {
	font: 13px/1.5 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
	background: rgb(37,41,51) url(themes/base/images/carbon_fiber_pattern.png) repeat;
	background-position: left top;
}
pre {
	display: inline;
	font-family: arial, helvetica, sans-serif;
	overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
}
legend
{
	color: rgb(255,255,255);
	background: rgb(70,77,95) url(themes/base/images/carbon_fiber_pattern.png) repeat top left;
	/* Set the font size to 14 px tall. */
	font-size: 14px;
	/* Align all text in the center. */
	text-align: center;
	/* Set the legends' heights at 19 pixels. */
	height: 19px;
	/* Set the line height for the text at 18 pixels. */
	line-height: 18px;
	/* Sets the legends' widths to 90% of their parent forms' widths. */
	width: 98%;
}


/*********** TABLE */
table {
	border: 1px solid rgb(51,51,51);
	background-color: rgb(255,255,255);
	color: rgb(0,0,0);
	width: 100%;
}
table tr:last-child {
	border-bottom: 1px solid rgb(51,51,51);
}
td {
	padding: 5px;
	text-align: left;
}
th {
	font-weight: bold;
	padding: 1px 0px 0px 3px;
	background: #a9b8c5;
	border-bottom: 1px solid rgb(51,51,51);
}
tr.total td {
	font-weight: bold;
}
tr.total {
	border-bottom: 1px solid rgb(51,51,51);
}
table.gridtable {
	width: 100%;
	font-family: verdana,arial,sans-serif;
	font-size:11px;
	color:rgb(51,51,51);
	border-width: 1px;
	border-color: #666666;
	border-collapse: collapse;
}
table.gridtable th {
	border-width: 1px;
	padding: 2px;
	border-style: solid;
	border-color: #666666;
	/*background-color: #dedede;*/
	/*background-color: #5D7B9D;*/
	background-color: #a9b8c5;
	font-weight: bold;
	/*color: rgb(255,255,255);*/
	color: #000;
}
table.gridtable td {
	border-width: 1px;
	padding: 2px;
	border-style: solid;
	border-color: #666666;
}



/*********** PAGE SECTIONS */
.page-section {
	/* page-section automatically expands to hold all child elements. */
	overflow: auto;
	background-color: rgb(255,255,255);
	border: 1px solid rgb(51,51,51);
	margin: 0 10px 10px 10px;
}
.page-section-header {
	height: 34px;
	line-height: 33px;
	color: rgb(255,255,255);
	background: rgb(70,77,95) url(themes/base/images/carbon_fiber_pattern.png) repeat top left;
	border-bottom: 1px solid rgb(51,51,51);
	text-align: left;
	font-size: 16px;
	font-weight: bold;
	padding-left: 6px;
}
.page-section-content {
	padding: 5px;
	color: rgb(0,0,0);
}
.page-help-bar {
	background-color: rgb(255,255,255); 
	padding-left: 10px;
	margin-left: 10px;
	color: rgb(24,24,128);
	font-style: italic;
}



/*********** BUTTONS */
.cbutton {
	background: rgb(207,207,207);
	border: 1px solid rgb(189,189,189);
	border-color: rgb(189,189,189) rgb(173,173,173) rgb(158,158,158);
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: 0 1px 1px rgb(211,211,211), inset 0 1px 0 rgb(227,227,227);
	-moz-box-shadow: 0 1px 1px rgb(211,211,211), inset 0 1px 0 rgb(227,227,227);
	box-shadow: 0 1px 1px rgb(211,211,211), inset 0 1px 0 rgb(227,227,227);
	cursor: pointer;
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
	position: relative;
	text-decoration: none;
	/* Sets the element's z-index to 1. This is to clear up an overlap bug with menu items. I s */
	z-index: 101;
}
.cbutton:hover {
	background: rgb(246,250,165);
}
.cbutton:focus {
	outline-color: black;
	outline-style: dotted;
	outline-width: 1px;
}
.cbutton:active {
	background: rgb(70,77,95);
}
.cbutton-icon {
}
.cbutton-text {
	white-space: nowrap;
	color: rgb(0,51,102);
	text-decoration: none;
	text-shadow: 0 1px 0 rgb(233,233,233);
}
.cbutton-small {
	height: 20px;
	margin: 2px;
	padding: 0 6px 0 6px;
}
.cbutton-text-small {
	margin-top: 3px;
	font-size: 12px;
}
.cbutton-icon-small {
	margin-right: 4px;
	margin-top: -2px;
}
.cbutton-large {
	height: 28px;
	margin: 2px;
	padding: 1px 6px 0 6px;
}
.cbutton-text-large {
	margin-top: 10px;
	font-size: 16px;
}
.cbutton-icon-large {
	margin-right: 6px;
	margin-top: -1px;
}
.cbutton-switchboard {
	margin: 0px;
	padding: 0px 10px 0px;
	height: 32px;
	width: 70%;
	text-align: center;
}
.cbutton-text-switchboard {
	font-size: 20px;
}
.cbutton-icon-switchboard {
	margin-right: 6px;
	margin-top: -1px;
}
.button-bar
{
	border: 1px solid rgb(51,51,51);
	overflow: auto;
	background: rgb(70,77,95) url(themes/base/images/carbon_fiber_pattern.png) repeat top left;
	padding: 5px 5px 5px 5px;
}



/*********** SWITCHBOARD */
.switchboard {
	border: 1px solid rgb(51,51,51);
	background: rgb(90,100,130) url(themes/base/images/carbon_fiber_pattern.png) repeat top left;
	overflow: auto;
	margin-bottom: 8px;
}
.switchboard-content {
	width: 78%;
	margin: 0 0px;
}
.switchboard-description {
	height: 18px;
	color: rgb(255,255,255);
	padding: 2px 0 2px 65px;
}
.switchboard-image {
	margin: 2px;
}
.switchboard-image img {
	width: 48px;
	height: 48px;
}
.switchboard-button {
	margin: 2px;
	bottom: 0px;
	width: 80px;
}
.switchboard-header {
	height: 34px;
	line-height: 33px;
	color: rgb(255,255,255);
	background: rgb(70,77,95) url(themes/base/images/carbon_fiber_pattern.png) repeat top left;
	border-bottom: 1px solid rgb(51,51,51);
	text-align: left;
	font-size: 1.4em;
	font-weight: bold;
	padding-left: 5px;
}
.switchboard-link {
	padding-bottom: 4px;
	padding-left: 20px;
}
.switchboard-link a {
	color: rgb(255,255,255);
	font-weight: bold;
}
.switchboard-link a:hover {
	color: rgb(246,250,165);
	font-weight: bold;
}



/*********** MENU ITEMS */
.menu-container {
	height: 32px;
	background-color: rgb(227,232,236);
	box-shadow: 0 1px 3px rgb(51,51,51);
	z-index: 100;
}
.menu-item {
	display: inline;
	float: left;
	margin-left: 5px;
	margin-right: 5px;
	width: 95px;
	text-align: center;
	background-color: rgb(70,77,95);
}
.menu-bar {
	display: table;
	margin: 0;
	padding: 0;
	list-style: none;
	height: 41px;
	float: left;}
.menu-bar li {
	display: table-cell;
	list-style: none;
	background-color: #464d5f;
	margin: 1px 0px 0px 2px;
	padding: 0px;
	border: 1px solid #A3BDD1;
}
.menu-bar li a {
	padding: 5px 5px;
	display:block;
	background-color:transparent;
	color:#A3BDD1;
	cursor:pointer;
	font-size:12px;
	text-decoration: none;
}
.menu-bar li a:hover {
	background-color: #A9B8C5; 
	color: #333;
}
.menu-bar li:hover > a {
	background-color: #A9B8C5; 
	color: #333;
}
.menu-bar li ul {
	display:none;
	position:absolute;
	z-index:9999;
	padding:0;
	margin:0;
	list-style:none;
}
.menu-bar li ul li {
	background-color: #464d5f;
	display: block;
	border-bottom: 1px solid #A9B8C5;
	padding: 0px;
	margin: 0px;
	list-style: none;
	position: relative;
}
.menu-bar li ul li a {
	font-size: 11px;
	text-transform: none;
	display: block;
	margin: 0px;
	padding: 5px;
	border-bottom: 1px solid transparent;
	border-top: 1px solid transparent;
}
.menu-bar li ul li a:hover {
	background-color:#A9B8C5;
	border-top: 1px solid transparent;
	border-bottom:1px solid transparent;
	text-decoration: none;
}
.menu-bar li ul li {
	border-top: 1px solid #464d5f;
}
.menulink a {
	text-decoration: none;
	color: rgb(51,51,51);
	font-size: 13px;
	display: block;
	line-height: 27px;
}
.menulink li {
	width: 90px;
	margin-top: 1px;
	background-color: rgb(227,232,236);
}
.menulink > li:hover {
	background-color: rgb(169,184,197);
	margin-top: 1px;
}
.menulink > li:hover ul li {
	margin-top: 1px;
}
.menulink a {
	text-align: center;
}
.menulink a:hover {
	color: rgb(51,51,51);
}
.menulink-icon {
	padding-top: 10px;
}
.menulink-text {
	margin-top: 0px;
}





/*********** LINKS */
.forgot-password-link {   
	width: 50%;
	border-top: 1px solid #ccc;
	margin: 0 auto;
	text-align: center;
	padding: 10px 0;
	clear: both;
}



/*********** CLEARFIX -- The micro clearfix hack to make double floats work. http://nicolasgallagher.com/micro-clearfix-hack */
.group:before,
.group:after {
	content: "";
	display: table;
}
.group:after {
	clear: both;
}
.group {
	zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}



/*********** BASE AND COMMON LAYOUT SECTIONS */
.layout-wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	/* Bottom margin is negative pixels (this allows for the height of the footer plus its one pixel border). */
	margin: 0 auto -49px;
}
.layout-message {
	height: 20px;
	border-top: 1px solid rgb(51,51,51);
	border-bottom: 1px solid rgb(51,51,51);
	background: rgb(227,232,236) url(themes/base/images/carbon_fiber_pattern.png) repeat; 
	padding-left: 5px;
}
.layout-content {
	margin-bottom: 48px;
}
.layout-footer {
	background: rgb(43,47,58);
	text-align: center;
	border-top: 1px solid rgb(227,232,236);
	height: 48px;
	width: 100%;
	clear: both;
}
.push
{
	/* The height of both elements is set at 120 pixels. */
	height: 48px;
	/* Any content that is float left or float right does not affect either of these elements. */
	clear: both;
}
.page-title
{
	background-color: rgb(169,184,197);  
	color: rgb(43,47,58);
	height: 30px;
	line-height: 29px;
	top: 0;
}
.page-title > h3 {
	padding-left: 10px;
}



/*********** FADING MESSAGE */
.fading-message {
	height: 16px;
	line-height: 15px;    
}
.message {
	margin-left: 3px;
}
.success {
	color: rgb(51,153,0);
	font-size: 1.1em;
	text-shadow: 0px 1px 1px 0px rgb(0,0,0);
}
.failure {
	color: rgb(204,0,51);
	font-size: 1.1em;
	font-weight: bolder;
}



/*********** CSS COMMON SHORTCUTS */
.end {
	float: right !important;
}
.begin {
	float: left !important;
}
.clear {
	clear: both;
}
.hidden {
	display: none;
}
.wordwrap {
	word-wrap: break-word;
}
.center {
	text-align: center;
}
.normal {
	font-weight: normal !important;
}
.bold {
	font-weight: bold;
}







/*********** SPECIFIC ITEMS */
.header {
	padding: 0 10px;
	background-color: rgb(43,47,58); 
}
.paad-overview-image img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}
.users-online {
	width: 200px;
	text-align: center;
	font-size: 1.2em;
	font-weight: bold;
	background-color: rgb(255,255,255);
	border: 1px solid rgb(51,51,51);
	padding: 3px;
	margin:  3px 3px 3px 10px;
}
.link-centered {
	width: 80%;
	border-top: 1px solid #ccc;
	margin: 0 auto;
	text-align: center; 
	padding: 10px 0;
}
.validators {
	color: rgb(204,0,51);
	margin-left: 20px;
}


/*********** USED THINGS */

/* Set styles for the changePassword form input elements. */
#changePasswordForm input#OldPassword, #changePasswordForm input#NewPassword, #changePasswordForm input#ConfirmPassword
{
	width: 90%;
	/* Set the left margin to 20 pixels. */
	margin-left: 20px;
}

/* Set styles for the resetPassword form input elements. */
#resetPassword input#EmailAddress, #resetPassword input#NewPassword, #resetPassword input#ConfirmPassword
{
	/* Set the left margin to 20 pixels. */
	margin-left: 20px;
	/* Sets the width of the changepassword form inputs to 236 pixels. */
	width: 90%;
}

.passwordPolicy
{
	margin-left: 20px; 
	width: 90%;
}

/* Sets the style for the forgot password link on the login form. */
.forgotPassword
{
	/* Gives the element a single pixel wide, light gray top border. */
	border-top: 1px solid #ccc;
	/* Pushes the element down 26 pixels from the element above it. */
	margin-top: 26px;
	/* Places a 13 pixel tall space between the element's content and the element's top border. */
	padding: 13px;
	/* Center all text in the forgotPassword form. */
	text-align: center;
}

.image-popup a.button
{
	padding: 0 10px 0 10px;
}

/* -------------------- Modal Dialog styles ------------------------------------------------------------------------ */
/*.ui-widget-header  
{
	border: 1px solid #aaaaaa {borderColorHeader} !Important; 
	background: rgb(51,51,51){bgColorHeader} 50%{bgHeaderXPos} 50%{bgHeaderYPos} repeat-x{bgHeaderRepeat} !Important; 
	color: rgb(255,255,255){fcHeader} !Important; 
	font-weight: bold; 
}*/

 /*Sets the style for the overlay behind the modal dialog boxes.*/
/* 
.ui-widget-overlay
{
	 Sets the opacity of the overlay. 
	opacity: .60 !important;
	 Sets the opacity of the overlay for IE. 
	filter: Alpha(Opacity=60) !important;
	 Sets the color of the overlay. 
	background: rgb(0,0,0) !important;
}*/

/* -------------------- Icon styles -------------------------------------------------------------------------------- */

/*.icon-collection
{
	margin: 0; 
	padding: 0;
}

.icon-collection > span
{
	padding: 0; 
	position: relative; 
}

.icon-collection > span.border 
{
	margin: 2px; 
	position: relative; 
	padding: 2px 0; 
	float: left;  
	list-style: none;
}*/

span.ui-icon 
{
	float: left; 
	margin: 0 2px;
}

/* Sets the icon's color to dark blue. */
/*.darkblue
{
	background-image: url('themes/base/images/ui-icons_162f67_256x240.png') !Important;
}*/

/* Sets the icon's color to light blue. */
/*.lightblue
{
	background-image: url('themes/base/images/ui-icons_3775c2_256x240.png') !Important;
}*/

/* Sets the icon's color to red. */
/*.red
{
	background-image: url('themes/base/images/ui-icons_cc0033_256x240.png') !Important;
}*/

/* Sets the icon's color to green. */
/*.green
{
	background-image: url('themes/base/images/ui-icons_339900_256x240.png') !Important;
}*/

/* Sets the icon's color to medium gray. */
/*.mediumgray
{
	background-image: url('themes/base/images/ui-icons_454545_256x240.png') !Important;
}*/

/* Sets the icon's color to dark gray. */
/*.darkgray
{
	background-image: url('themes/base/images/ui-icons_303030_256x240.png') !Important;
}*/

/* Sets the icon's color to light gray. */
/*.lightgray
{
	background-image: url('themes/base/images/ui-icons_cccccc_256x240.png') !Important;
}*/

/* -------------------- Fingertip Styles --------------------------------------------------------------------------- */
.fingertipCategory
{
	font-weight: bold;
	font-size: 16px;
	color: #3366cc;
	text-align: left;
	border-top: solid 1px rgb(51,51,51);
}

.fingertipSubCategory
{
	font-weight: bold;
	font-size: 12px;
	color: rgb(51,51,51);
	background-color: #ddd;
	text-align: left;
}

.fingertipTitle
{
	width: 250px;
	font-weight: bold;
	text-align: left;   
	vertical-align: middle; 
}

.fingertipText
{
	text-align: left;   
	vertical-align: middle; 
}

/* -------------------- Validation Error Style --------------------------------------------------------------------- */
.validation-summary-errors
{
	color: #FF0000;
}

/* -------------------- Copyright and Version Styles --------------------------------------------------------------- */
.version
{
	text-align: center;
	color: rgb(255,255,255);
	font-weight: bold;
}


.disclaimer
{
	padding: 0 8px;
}


/* --------------------- Styles for Approve_Audit View ------------------------------------------------------------- */
	.SelectDiv {
		border: 1px solid black;
		width: 100%;
		height: 100%;
		margin-bottom: 15px;
	}
	.AssessSelectTitle {
		padding: 2px 10px 2px 10px;
		background: #a9b8c5;
		font-weight: bold;
	}
	.AssessSelectValue {
		text-align: left;
		border: 1px solid silver;
		background-color: aliceblue;
	}
	#AssessmentSelect {
		height: 100%;
		width: 100%;
	}
	#SiteSelector label {
		float: left;
		width: 12%;
		margin: 4px;
		background-color: #EFEFEF;
		border-radius: 4px;
		border: 1px solid #D0D0D0;
		overflow: auto;
		cursor: pointer;
	}
	#SiteSelector label span {
		text-align: center;
		font-size: .95em;
		font-weight: bold;
		padding: 4px 8px 4px 8px;
		display: block;
	}
	#SiteSelector label input {
		position: absolute;
		left: -20px;
	}
	#SiteSelector input:checked + span {
		background-color: #404040;
		color: #F7F7F7;
	}
	#SiteSelector input:focus + span {
		background-color: blue;
	}

/* --------------------- Styles for AuditDetailModel & _AuditApproveModel ------------------------------------------------------------- */
#auditDetail .box,
#qaList .box {
	border: 1px solid #404040;
	padding: 3px;
	clear: both;	/* for FF */
}

#auditDetail .box td,
#qaList .box td
{
	border-bottom: 1px solid #404040;
}

#auditDetail .lbl 
{
	width: 25%;
	text-align: right;
	padding-right: 5px;
}

#qaList .lbl {
	width: 30%;
	text-align: right;
	padding-right: 5px;
}


#auditDetail h3 {
	margin-bottom: 0px;
	margin-top: 5px;
}

#auditDetail .text,
#qaList .text
{
	padding-left: 15px;
}

#auditDetail textarea,
#qaList textarea 
{
	height: 75px;
	width: 100%;
	margin: 3px;
}

/* --------------------- Styles for FileUpload & FileUploadResult ------------------------------------------------------------- */
div.upload {
	font-size: 1.5em;
	vertical-align: middle;
	width: 126px;
	height: 32px;
	background: url(/content/themes/base/images/selectfiles.png);
	background-repeat: no-repeat;
	overflow: hidden;
}
div.upload input {
	display: block !important;
	width: 126px !important;
	height: 32px !important;
	border: 1px solid green;
	opacity: 0 !important;
	overflow: hidden !important;
}
#output {
	width: 80%;
	margin: 0 auto;
	padding: 1em;
}
#output > li {
	width: 100%;
	font-weight: bold;
}
#fileList {
	width: 90%;
	height: 390px;
	resize: none;
	margin: 10px;
	padding-left: 5px;
	background-color: transparent;
	color: rgb(51,51,51);
}
/* --------------------- Styles for FileUpload & FileUploadResult ------------------------------------------------------------- */
/* --------------------- Styles for UserFile ---------------------------------------------------------------------------------- */
.ufCategory
{
	font-weight: bold;
	font-size: 16px;
	color: #3366cc;
	text-align: left;
	border-top: solid 1px rgb(51,51,51);
}

.ufSubCategory
{
	font-weight: bold;
	font-size: 12px;
	color: rgb(51,51,51);
	background-color: #ddd;
	text-align: left;
}

.ufTitle
{
	/*width: 250px;*/
	font-weight: bold;
	text-align: left;   
	vertical-align: middle; 
}

.ufText
{
	text-align: left;   
	vertical-align: middle; 
}
/* --------------------- Styles for UserFile ---------------------------------------------------------------------------------- */