@charset "utf-8";

body {
	background: #EEEEEE;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
}

.sub-rating-color {
	position: relative;
}
.sub-rating-color span {
	padding-left: 18px;
}
.sub-rating-color .sub-rating-color-box {
	width: 10px;
	height: 10px;
	display: inline-block;
	background-color: #ccc;
	border: 1px solid black;
	position: absolute;
	left: 2px;
	top: 2px;
}

.LoginBox {
	border: 1px solid #000000;
	height: 265px;
	width: 300px;
	padding: 30px;
	background: white;
}

.PwdReminderBox {
	border: 1px solid #000000;
	height: 300px;
	width: 300px;
	padding: 30px;
	background: white;
}

.expand {
	vertical-align:text-top;
	font-family:Arial;
	height: 1.1em;
	width: 95%;
	padding: 3px;
}

.progress {
	position: relative;
	width: 30%;
	height: 25px;
	background: #f7f7f7;
	border-radius: 4px;
	overflow: hidden;
}

.reference_position {
	background-color : #EEEEEE
}

.bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 25px;
	background: #85C220;
}

.dragandropbox
{
	border:2px dotted #0B85A1;
	width:30%;
	height: 100px;
	color:#92AAB0;
	text-align:center;vertical-align:middle;
	padding:10px 10px 10 10px;
	margin-bottom:10px;
	font-size:200%;
}

.sub_contact span.ui-button-text{ background: #ED4337; }

/* Main Layout */

#layout_header_title 
{
    margin-top: 39px !important;
    margin-left: 10px !important;
    float:left !important;
	text-align: left !important;
	display: block;
	color: #034490;
	font-size: 42px;
	font-weight: bold;
	font-variant: small-caps;
}

#layout_header_title.aim 
{
    margin-top: 39px !important;
    color: #008348;
}

#layout_header_title.maple_cdb_jv 
{
    margin-top: 35px !important;
    color: #034490;
}

#layout_header_text {
	position: absolute;
	top: 45px;
	right: 21px;
	width: 100%;
	text-align: right;
	display: block;
	font-size: 10pt;
}

#layout_top {
	position: relative;
	background: #FFFFFF;
	margin: 5px 5px 5px 5px;
	height: 100px;
	background: white;
}

#layout_top.aim:before {
	display: block;
	position: absolute;
	bottom: 10px;
	content: "";
	width: 100%;
	border-bottom: solid 10px #32cdfb;
}

#layout_top.aim:after {
	display: block;
	position: absolute;
	bottom: 0px;
	content: "";
	width: 100%;
	border-bottom: solid 10px #008348;
}

#layout_top.maple:before {
	display: block;
	position: absolute;
	bottom: 10px;
	content: "";
	width: 100%;
	border-bottom: solid 10px #EE801E;
}

#layout_top.maple:after {
	display: block;
	position: absolute;
	bottom: 0px;
	content: "";
	width: 100%;
	border-bottom: solid 10px #034490;
}

#layout_top.maple_cdb_jv:before {
	display: block;
	position: absolute;
	bottom: 10px;
	content: "";
	width: 100%;
	border-bottom: solid 10px #EE801E;
}

#layout_top.maple_cdb_jv:after {
	display: block;
	position: absolute;
	bottom: 0px;
	content: "";
	width: 100%;
	border-bottom: solid 10px #034490;
}

#layout_top img {
	float: left;
	height: 75px;
	width: auto;
	padding: 0px;
	margin: 2px 5px 5px 5px;
}

#layout_top span {
	float: right;
	width: 300px;
	text-align: right;
	display: block;
	padding: 0px 0px 0px 0px;
	margin: 4px 5px 0px 0px;
}

#layout_container {
	margin: 0;
	padding: 0;
	height: 99%;
}

#layout_left_menu {
    height: 100%;
    width: 150px;
    float: left;
    margin: 0px 0px 0px 5px; /* Top Right Bottom Left */
    background: #FFFFFF;
}

.menu {
	line-height: 1.5;
    padding-left: 5px;
}

.menu_app {
    color: white;
    background-color: #034490;
    margin: 0px 0px 0px 0px;
    padding: 5px 1px 5px 3px;
    border: none;
    border-bottom: solid 1px #FFFFFF;
    font-size: 10pt;
    font-weight: normal;
    width: 150px;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.menu_app.aim {
    background-color: #008348;
}

.menu_app:hover {
    color: rgb(247,143,30); /* Maple Orange */
    background-color: #034490;
    text-decoration: none;
}

.menu_app.aim:hover {
    color: rgb(50,205,251); /* AIM Blue */
    background-color: #008348;
}

.menu_app > a {
    border-bottom: none;
}

/* Left Menu - Hide by Default */

#ClickToShowMenu{
    display:none;
    transform: translate(22px, 15px) rotate(270deg); 
    white-space: nowrap; 
    width: 11px; 
    height: 11px; 
    cursor: pointer; 
    margin-top: -16px;
}

#ClickToShowMenuText {
     background-color:#034490; 
     color: white; 
     font-size: 9pt; 
     width: 100vh;
     text-align:end;
     margin-top: -16px;
     line-height: 20px;
     float:right;
     padding-right: 5px;
}

#ClickToShowMenuText.aim {
     background-color: #008348; 
}

#ClickToHideMenu {
    color: black;
    background-color: #EEBBF0;
}

#ClickToHideMenu:hover {
    color: white;
}

#ClickToShowMenu:hover {
    color: rgb(247,143,30); /* Maple Orange */
}


#layout_content {
	height: 100%;
	width: calc(100% - 165px); /* left menu */
	box-sizing: border-box;
	margin: 0px 5px;
	padding: 3px 3px 3px 3px;
	background: #FFFFFF;
	float: left;
}

#layout_content.collapsed {
	margin-left: 25px;
	width: calc(100% - 30px); /* left menu */
}

#layout_footer {
	clear: both;
}

#login_logo {
	position: relative;
	padding: 0 0 25px 0;
	text-align: center;
}

#login_logo img {
	display: inline-block;
	max-width: 300px;
}

#login_logo.aim:before {
	display: block;
	position: absolute;
	bottom: 0;
	content: "";
	width: 100%;
	border-bottom: solid 8px #32cdfb;
}

#login_logo.maple:before {
	display: block;
	position: absolute;
	bottom: 5px;
	content: "";
	width: 100%;
	border-bottom: solid 5px #ed7300;
}

#login_logo.maple:after {
	display: block;
	position: absolute;
	bottom: 0px;
	content: "";
	width: 100%;
	border-bottom: solid 5px #002992;
}

/* General Styles */
 p,td,input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
}

strong { font-weight: bold; }

.deleted {
	font-size: 8pt;
	color: red;
}

.form-text {
	height:20px;
	line-height:20px;
	border: solid 1px #d0d0d0;
}

.form-text-error {
	height:20px;
	line-height:20px;
	border: solid 1px #ff6969;
}

a {
	text-decoration: none;
	color: #000000;
}

a:hover {
	text-decoration: underline;
}

.red_text {
	color: #FF0000;
}

.blue_text {
	color: blue;
}

.green_text {
	color: green;
	font-weight: bold;
}

.dark_red_bg {
	background-color: #FF0000;
}

.yellow_bg {
	background-color: #FFFF7F;
}

.green_bg {
	background-color: #BCED91;
}

.row_hover_highlight {
	background-color: #EEEEEE;
}

.qscore {
	color: white;
	background-color: grey;
	font-size: 8pt;
	line-height: 20px;
	border-radius: 3px;
	padding: 0 4px;
	display: inline-block;
}

.qscore > a { color: white; }

/* Tables */
td a img.icon {
	padding: 0;
	margin: 0 1px -3px 1px;
	border: none;
}

div.inter_table_spacer {
	padding: 0;
	margin: 0;
	height: 17px;
}

/*- Menu Tabs K--------------------------- */
/* Source: http://www.exploding-boy.com/images/cssmenus/menus.html# */

#tabsK {
	background:#FFFFFF; /*E7E5E2;*/
	font-size:93%;
	line-height:normal;
	height: 24px;
}
#tabsK ul {
	margin:0;
	padding: 0px 10px 0 0px;
	list-style:none;
}
#tabsK li {
	display:inline;
	margin:0;
	padding:0;
}
#tabsK a {
	float:left;
	background:url("images/tabs/tableftK.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
}
#tabsK a span {
	float:left;
	display:block;
	background:url("images/tabs/tabrightK.gif") no-repeat right top;
	padding:5px 15px 4px 6px;
	color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsK a span {float:none;}
/* End IE5-Mac hack */
#tabsK a:hover span {
	color:#FFF;
	background-position:100% -42px;
}
#tabsK a:hover {
	background-position:0% -42px;
}
/* Selected / Default Tab */
#tabsK a.selected {
	float:left;
	background:url("images/tabs/tableftK.gif") no-repeat left top;
	background-position:0% -42px;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
}
#tabsK a.selected span {
	float:left;
	display:block;
	background:url("images/tabs/tabrightK.gif") no-repeat right top;
	background-position:100% -42px;
	padding:5px 15px 4px 6px;
	color:#FFF;
}

/* Project Name / Title */
#TabTitle {
	font-size: 14pt;
	font-weight: bold;
	margin: 10px 0;
	padding: 0px;
}
#TabBorder {
	border-bottom: 1px solid #000000; /*54545C;*/
	margin: 0px;
	padding: 0px;
	line-height: 0px; /* Needed to prevent IE from making it the size of a normal line, use with   inside the DIV */
	width: 100%;
}

/***** TABLES *****/
.table_content 
{
    background-color: White;
    border: 2px solid #DBD9D9;
    border-spacing: 1px;
    border-collapse: separate;
}

.table_title, .table_title td {
	background-color:#DBD9D9; 
	font-size:11px; 
	line-height: 25px; 
	font-weight:bold; 
	background-image:url("images/table_bg_title.gif"); 
	color: #616161;
}

.table_title_f2, .table_title_f2 td {
	background-color:#EBEAEA; 
	font-size:11px; 
	line-height: 25px; 
	font-weight:bold; 
}

/* Header (for column names) and/or footer for buttons/totals */
.table_subtitle_f1, .table_subtitle_f1 td {
	background-color:#DBD9D9; 
	font-weight:bold; 
	color: #616161;
	font-size: 10px;
	line-height: 20px;
}

.table_subtitle_f2 {
	background-color:#EBEAEA; 
	font-weight:bold; 
}

.table_border {
	background-color:#DBD9D9; 
}

/* Standard Cell */
.table_f1 {
	background-color:#EBEAEA; 
	color: #616161;
	font-size: 10pt;
	line-height: 20px;
}
.table_f1_hover
{
	background-color:#EBEAEA; 
	color: #616161;
	font-size: 10pt;
	line-height: 20px;
}
/* CSS on hover that is aware of DataTable styling*/
.table_f1_hover:hover, table.dataTable tbody .table_f1_hover:hover td, table.dataTable tbody tr td.table_f1_hover:hover
{
    background-color:#FFFFFF; 
	color: #616161;
}

/* White Cell (used for mouse-overs) */
.table_f2 {
	background-color:#FFFFFF; 
	color: #616161;
	font-size: 10pt;
	line-height: 20px;
}

/* Hilighted Cell */
.table_f3 {
	background-color:#E0E0E0; 
	color: #616161;
	font-size: 10pt;
	line-height: 20px;
}

/*  ### Cell/Row Shading ###
We need to account for TableFilter when applying the classes to either individual cells (td) or entire rows (tr).
table.dataTable tbody td <== Grey (default)
table.dataTable tbody .td_purple td <== Slightly more specific to apply shading to the entire row
table.dataTable tbody tr td.td_purple <== Most specific to apply shading to a cell while overriding the default and the row-level shading.
*/
.td_purple, table.dataTable tbody .td_purple td, table.dataTable tbody tr td.td_purple
{
	background-color:#EEBBF0;
}

.td_lightblue, table.dataTable tbody .td_lightblue td, table.dataTable tbody tr td.td_lightblue
{
	background-color: #B3C7EB;
}

.td_limegreen, table.dataTable tbody .td_limegreen td, table.dataTable tbody tr td.td_limegreen
{
	background-color: #b4fcb2;
}

.td_orange, table.dataTable tbody .td_orange td, table.dataTable tbody tr td.td_orange
{
	background-color: #FBC081;
}

.td_lightpink, table.dataTable tbody .td_lightpink td, table.dataTable tbody tr td.td_lightpink
{
	background-color: #FFCCCB;
}

.td_red, table.dataTable tbody .td_red td, table.dataTable tbody tr td.td_red
{ 
	background-color: #FF8088; 
}

.td_yellow, table.dataTable tbody .td_yellow td, table.dataTable tbody tr td.td_yellow
{ 
	background-color: lightgoldenrodyellow; 
}

.td_bright_blue, table.dataTable tbody .td_bright_blue td, table.dataTable tbody tr td.td_bright_blue
{ 
	background-color: #00ffff; 
}