/*
 * _MPCommonDyn.css - ManagePath 8 Core Stylesheet
 *
 * This file is combined with MasterPageDyn.css and Menu*.css during deployment
 * into a single _MPCommon2Dyn.css, then processed through the theme engine.
 * Order matters: rules here appear BEFORE MasterPageDyn in the cascade.
 *
 * TABLE OF CONTENTS
 * =================
 *
 * BASE ELEMENT STYLES (input, select, hr) .................... input/select/hr resets, generic text & cursor utilities
 * GLYPHICON OVERRIDES ........................................ Glyphicon padding, sizing, color overrides
 * TYPOGRAPHY, THEME & GLOBAL UTILITIES ....................... Global A/TH/P resets, font sizes, theme colors, link states
 * NAVIGATION (tabs, breadcrumbs, history) .................... Tab nav, breadcrumbs, history links
 * JQUERY UI OVERRIDES (states, datepicker, dialog) ........... jQuery UI states, datepicker, dialog, widget-content overrides
 * TOOLTIPS & FLYOUTS ......................................... jQuery tooltips, custom tooltip divs
 * JQUERY UI TOOLTIPS ......................................... jQuery UI tooltip content styling
 * MODAL POPUP ................................................ Modal backgrounds, popup styling, dialog panels
 * ICONS (Map, Email) ......................................... Map and email icon containers
 * DOCUMENT ADD/EDIT .......................................... Document list items, upload queue, version controls
 * LOADING OVERLAY ............................................ Loading spinners and overlay containers
 * JQUERY UI MENU ............................................. jQuery UI menu list and item styles
 * JQUERY UI DIALOG BUTTONS ................................... Dialog titlebar close, button pane
 * TOAST NOTIFICATIONS ........................................ Toast message container, types, positions
 * MISC FORM & LAYOUT CLASSES ................................. Template inputs, shortcut/contact containers
 * ATTACHMENT VIEW ............................................ Attachment file list, delete icons
 * PROJECT FLAGS & FINANCIAL TOTALS ........................... Project status flags, financial totals, contract footers
 * MISCELLANEOUS PAGE-SPECIFIC CLASSES ........................ Tickets, user edit, impacts, quick search, today widget
 * WEBLIST PAGE CONTAINER CLASSES ............................. Weblist page container, header styling classes
 * MP8 NEW CLASSES (Today Widget, Dialog, Breadcrumb, etc.) ... Today widget borders, dialog controls, breadcrumb extensions
 * HIGHCHARTS ................................................. Highcharts color overrides
 * GENERAL & DETAIL VIEW SECTIONS ............................. Page content tables, content headers, detail/general borders
 * CUSTOMIZER LITERAL CSS OPTIONS ............................. Bold/italic/subscript/heading customizer options
 * LAYOUT UTILITIES (markup-table flex grid) .................. markup-table flex grid, feature-specific layout strays
 * USER AVATAR ................................................ Note avatar cell, image, link styles
 * OPTIONS CRITERIA LAYOUT ......................................Options criteria general layout (mirror of Report Criteria Layout for non-Report Pages, UserReassignment,etc)
 * RESPONSIVE MEDIA QUERIES ................................... Breakpoint overrides for mobile/tablet/narrow viewports
 *
 *
 *
 * COMMON PREFIXES
 * =================
 * .ah_ = Adhoc
 * .abt = Abstraction Template
 * .mp = ManagePath (typically on things like mpEdit, mpComposite, mpChooser, etc.)
 * .rl = ReportList 
 * .wl = Weblist
 */

/* ============================================================
   BASE ELEMENT STYLES (input, select, hr)
   ============================================================ */

Table.CustomContent {
	width: 100%;
}

Table.CustomContent td {
	vertical-align: top;
}

Table.ShadowBox_PageBackground td.td-ContentWrapper {
	border-width: 0px;
	padding: 0px;
	vertical-align: top;
}

.OuterContent Table.ShadowBox_PageBackground td.td-ContentWrapper {
	padding-bottom: 5px;
}

/* to be removed: 49815
div.ContainerGhostBackground {
	background-color: rgba(255,255,255,.7);
}*/

Table.CustomContent tr.UnderlineItemRow > td {
	border: solid 0px black;
	border-bottom-width: 1px;
	border-color:#D1CFCF;
}

.RenderTable {
	border: solid 0;
	width: 100%;
}

.commonDialogTitleBar {
	padding: .5em;
}

.commonDialog {
	padding-left: .2em;
}

.dialogOverflow {
	overflow-y: scroll;
}

.PageBtnContainerTop {
	padding-bottom: 12px;
}

.mvcGroupedButtonContainer,
.mvcAddNewButtonContainer,
.mvcCreateNewButtonContainer {
	display: inline-block;
}

.ReportBtnContainerTop,
.FormBtnContainerTop {
	margin-bottom: 12px;
	padding-bottom: 10px;
	border: solid 0px black;
	border-bottom-width: 1px;
	border-bottom-color:#54606c;
}

.mvcFormSectionHeader {
	font-weight: bold;
	margin-bottom: 15px;
	margin-top: 15px;
	padding: 5px;
	border: solid 0px black;
	border-bottom-width: 1px;
	border-bottom-color:#54606c;
}

.PageBtnContainerBottom {
	margin-top: 8px;
}

.Box {
	border: solid 1px #2F4F4F;
	border-radius: 1.6em;
}

input,
input[type="text"] {
	padding: 5px 6px;
	border-color: #d9d9d9;
	border-radius: 2px;
	border-width: 1px;
	border-style: solid;
	background-color:#FFFFFF;
}

input[type="checkbox"],
input[type="radio"] {
	accent-color:#1F4E78;
}

select {
	padding: 4px 4px;
	border-color: #d9d9d9;
	border-radius: 2px;
	background-color:#FFFFFF;
}

hr {
	opacity: 0.5;
}

.NoWrap {
	white-space: nowrap !important;
}

.textAlignLeft {
	text-align: left;
}

.textAlignRight {
	text-align: right;
}

.borderZeroWidth {
	border-width: 0px;
}

.cursor-wait {
	cursor: wait !important;
}

.cursor-progress {
	cursor: wait !important;
}

/* Hide the admin Customize button from displaying on forms */
.display-none,
[id$="BtnCustomize"] 
{
	display: none !important;
}

/* ============================================================
   GLYPHICON OVERRIDES
   ============================================================ */
.glyphicons-nopadding:before 
{
    padding: 0px 0px !important;
}

.glyphicons-first-column-padding:before {
	padding: 6px 5px !important;
}

.glyphicons { cursor:default; }

.glyphicons-edittooltipico {
	font-size: .9em;
	color: #e30f00; /* almost pure red */
	position:relative;
	bottom: -5px;
	cursor: help;
}
.glyphicons-edittooltipico:before {
	padding: 0px 4px !important;
}

.GlphyiconIcon:not(.DisabledGlyphicon):hover {
	color:#F4AF5F;
	transition: 0.1s;
}

.glyphicons-captiontooltipico {
	color: gray;
	float: right;
	font-size: 11px;
}

.glyphicons-captiontooltipico:before {
	padding: 2px 2px !important;
	padding-left: 4px !important;
}

.glyphicons-captiontooltipico-custom {
	font-size: 10px;
	margin-top: -3px;
	color:#6B6B6B;
}

.glyphicons-abstractiontemplateitem:before {
	padding: 2px 4px !important;
}

.GlphyiconIcon-Green {
	color: #1e9c1e !important;
}

.GlphyiconIcon-Red {
	color: #d10000 !important;
}

.GlphyiconIcon-Yellow {
	color: #ffa700 !important;
}

/* ============================================================
   TYPOGRAPHY, THEME & GLOBAL UTILITIES
   ============================================================ */

.ui-widget-content a.HTMLLink,
.HTMLLink {
	color:#1F4E78;
	cursor: pointer;
	text-decoration: none; /*#MP_LINKDECORATION>*/
}

.react-form a.HTMLLinkTxt,
.HTMLLinkTxt {
    text-decoration: none;
    color:#000000;
    cursor: pointer;
}

.react-form a.HTMLLinkTxt:HOVER,
.HTMLLinkTxt:HOVER {
    text-decoration: underline;
    color:#000000;
    cursor: pointer;
}

A {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    color:#1F4E78;
    text-decoration: none; /*#MP_LINKDECORATION>*/
}

A.Default {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    color:#1F4E78;
    text-decoration: none; /*#MP_LINKDECORATION>*/
}

.ALabel {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    color:#1F4E78;
    text-decoration: none; /*#MP_LINKDECORATION>*/
}

TH {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    font-size: small;
}

P {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    font-size: small;
}

.pageHdr {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #FFFFFF;
}

.Default TEXTAREA {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    font-size: small;
    white-space: pre-wrap;
}

/*Used?*/
.Col {
    float: left;
    padding: .3em 1em .3em 0em;
    white-space: nowrap;
}

.font_size_smaller {
    font-size: x-small;
}

.font_size_small {
    font-size: smaller;
}

.font_size_large {
    font-size: medium;
}

.font_size_larger {
    font-size: large;
}

.font_size_largest {
    font-size: larger;
}

.subscript_display {
    font-size: x-small;
    color: Red;
    padding-right: 3px;
    padding-left: 1px;
}

.subscript_caption {
    font-size: x-small;
    color: Red;
    padding-left: 3px;
}

.RequiredIndicatorText {
    padding-left: 3px;
}

.BackgroundColor_PrimaryColor {
    background-color:#1F4E78;
}

.Color_PrimaryColor {
    color:#1F4E78;
}

.Color_PrimaryFontColor {
    color:#FFFFFF;
}

.BackgroundColor_SecondaryColor {
    background-color:#E0E0E5;
}

.Color_SecondaryColor {
    color:#E0E0E5;
}

.Color_SecondaryFontColor {
    color:#000000;
}

.theme_border_color {
    border-color:#D1CFCF;
}

.EnabledLink {
    color:#1F4E78;
    cursor: pointer;
}

.DisabledLink {
    color: #6F6F6F;
    cursor: default;
}

.DisabledGlyphicon {
    color: #C0C0C0;
    cursor: default;
}

.statusMsg {
    font-style: italic;
    opacity: 0.6;
}

.text-diabled {
	color: gray;
}

.PasswordInputError {
	background-color: #FFFACD; /*#MP_VALIDATIONCOLOR>*/
}

.findwatermark,
.perDiemWarning,
.ticketStatusLate,
.leaseaccountingLeaseTypeFail,
.warningcolor,
.viewTitleAlert,
.lr_warningcolor {
	color: red;
}

.mpCaptionColor {
	color:#6B6B6B;
}

td.mpCaptionCell {
	color:#6B6B6B;
	width: 5%;
	white-space: nowrap;
}

.wordBreak {
	word-wrap: break-word;
}

/* ============================================================
   NAVIGATION (tabs, breadcrumbs, history)
   ============================================================ */
.historybreadcrumb {
    Display: inline;
    Float: left;
    Padding-left: 10px;
}

.historybreadcrumbitemcontainer {
    Display: inline;
    Float: left;
}

.historybreadcrumbitem {
    Display: inline;
    padding-left: 8px;
    padding-right: 8px;
    float: left;
}

.tabNavTable TD,
.BorderStandard {
    border: solid 1px black;
    border-color:#D1CFCF;
}

.tabNavTable
{
	width:100%;
	margin-bottom:15px;
}

.tabNavCell
{
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	text-align:center;
	vertical-align:middle;
	background-color:#1F4E78;
	color:#FFFFFF;
	cursor:pointer;
	height:2.2em;
	font-weight:bold;
	width:16%;
}

.tabNavSelected
{
	cursor:default;
	background-color:transparent;
	color:#000000;
	font-weight:bold;
	border-bottom:none !important;
}

.tabNavCellEmpty
{
	border-top:none !important;
	border-left:none !important;
	border-right:none !important;
}

.EmailIconContainer {
	display: inline-flex;
}

.EmailIconHyperlinkMVC,
.EmailIconHyperlink {
	padding-left: 1px;
	padding-right: 5px;
	cursor: pointer;
	top: 3px !important;
}

.EmailIconHyperlinkMVC {
	top: 5px !important;
}
.mpAddressBlockMapContainer {
	position: relative;
	padding-bottom: 4px;
	height: 17px;
}

.mpAddressBlockMapIco
{
    position:absolute;
    left:-7px;
    cursor:pointer;
    font-size:1.05em;
}

.ModeToggleContainer {
	font-size: smaller;
	margin-left: 8px;
	margin-top: 8px;
}

.ModeLiteralContainer {
	padding-top: 12px;
}

.ModeLiteralTopContainer {
	padding-bottom: 15px;
}

.ModeLiteralDialogContainer {
	display: inline-block;
	padding-left: 5px;
}

.inlineLink,
.linkMenuItem {
	display: inline;
	float: left;
	white-space: nowrap;
	padding-right: 5px;
}

.LinkMenuContainer a:hover {
    text-decoration:underline;
}

.LinkMenuContainer .disabledLink {
	color:#6B6B6B;
	cursor:pointer;
}

tr.RowAlternateBackgroundColor {
	background-color:#e8e8eb;
}

.peekTitle {
    font-weight:bold;
    display:inline-block;
    position:relative;
    bottom:3px;
    padding-left:20px;
}

.peekContent {
    padding:20px;
    padding-top:10px;
    height:auto;
    overflow: auto;
    min-height: 365px;
    max-height: calc(100vh - 210px);
}

.lookupLinkMemberSelect
{
	margin: 20.5px 0px -22.5px 5px;
}


.gridWrapperWidgetExpandableSection
{
    min-height:0px;
}

.gridWrapperWidgetExpandableSectionNotes
{
	min-height:0px;
}

.gridWrapperWidgetExpandableSectionDocuments
{
	min-height:0px;
}

.gridWrapperWidgetExpandableSectionTasks,
.gridWrapperMyProjects,
.gridWrapperImpactChart
{
	min-height:25px;
}

.marginBottom3,
.myTasksWidgetGridWrapper
{
	margin-bottom:3px;
}

.MetricsTest
{
	background-repeat:no-repeat;
	border-style:none;
	width:480px;
	
	margin-left:auto;
	margin-right:auto;
	overflow:auto;
}

.ant-table-row {
    background-color:#FFFFFF;
}

.ant-table-cell {
    color:#000000;
}

.ui-widget {
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    font-size: smaller;
}

.ui-widget-header  
{
    border: 0px solid;
    border-bottom-width: 1px;
    border-color:#D1CFCF; 
    font-weight: bold; 
}

.ui-widget-header .ui-icon {
    background-image: url("../images/ui-icons_222222_256x240.png");
}

.ui-state-default,
.ui-widget-content .ui-state-default
{
}

.ui-widget-header .ui-state-default,
.ui-button.ui-widget-content.ui-state-default,
.ui-button-text-only {
	color:#000000;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
	color:#1F4E78;
}
/*.ui-state-hover,*/
/*.ui-widget-content .ui-state-hover,*/
/*.ui-widget-header .ui-state-hover,*/
/*.ui-state-focus,*/
/*.ui-widget-content .ui-state-focus,*/
.ui-widget-header .ui-state-focus 
{
	border: 0px solid #fbcb09;
	background-color:#F4AF5F;
    border-color:#F4AF5F;
}

.ui-widget-content .ui-state-focus {

}

.ui-widget-header .ui-state-hover {
    border: 0px solid #fbcb09;
	background: #dadada url(../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
    color:#212121;
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
	color: Black;
	text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    border: 1px solid #c0c0c0;
    font-weight: normal !important;
    background: #dadada url(../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
    padding: 3px;
    margin: -4px;
    color:#000000;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
    color:#000000;
    text-decoration: none;
}

.ui-button {
	background-color:#1F4E78;
    color:#FFFFFF;
}

.ui-button:hover
 {
	background-color:#F4AF5F;
    border-color:#F4AF5F;
}

.ui-datepicker .ui-state-default {
	border: 1px solid;
	border-color: transparent;
	font-weight: bold;
	color:#1F4E78;
}

.ui-datepicker .ui-state-active {
    
    font-weight:bold;
    color: #353535;
    
}

.ui-datepicker .ui-state-hover {
    color:#F4AF5F;
    border-color:#F4AF5F;
    background-color: transparent;
}

/* ============================================================
   JQUERY UI OVERRIDES (states, datepicker, dialog)
   ============================================================ */
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    border: 0px solid;
    border-bottom-width: 1px;
    border-color:#1F4E78;
    color: #363636;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: #363636;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 0px solid;
	background: #b81900 url("../images/ui-bg_diagonals-thick_18_b81900_40x40.png") 50% 50% repeat;
	color: #ffffff;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
	color: #ffffff;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: #ffffff;
}
.ui-dialog {
    PADDING-RIGHT: 0.2em;
    PADDING-LEFT: 0.2em;
    PADDING-BOTTOM: 0.2em;
    OVERFLOW: visible;
    WIDTH: 300px;
    PADDING-TOP: 0.2em;
    POSITION: absolute;
    background:#FFFFFF;
}

.ui-widget-content {
	background:#FFFFFF;
	color:#000000;
	border-color:#D1CFCF;
}

.ui-widget-content-strong-border {
	border-width:2px;
}

.ui-dialog .ui-dialog-titlebar {
	padding: .3em .3em .4em 1em;
	color:#54606c;
	position: relative;
	font-size: medium;
}

.dialogErrorText {
	font-size: .75em;
	color: red;
	display: block;
	margin-top: 5px;
	margin-left: 3px;
}

.placeholder
{
	opacity:.8;
}


.taskDateTable TBODY td
{
    padding-left:0px;
}

.expandableTasksButton table
{
	margin:0px !important;
}

.expandableTasksDateControl
{
	min-width:80px;
}

.expandableTasksHeaderText
{
	float:left;
	display:inline;
	padding-left:5px;
}

.popupPanelControlCluster,
.popupNoteEditControlCluster,
.popupMarkPayableControlCluster
{
	margin-top:20px;
}

.popupPanelButton
{
	float: right;
	margin-left:10px;
}

.popupPanelButtonLeft {
	float: left;
	margin-left: 10px;
}

.editNoteContainer
{
	display:inline;
	float:left;
	width:100%;
}

.notePDFPage
{
	margin-left:20px;
}

.expandableDocumentSendButton {
	margin-left: 8px !important;
}

.documentSendIcon {
	cursor:default !important;
	display:inline-block;
}

.documentSendIconText {
	display:inline-block;
	width:300px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.sendDocumentsSelectedDocumentsOuter {
	margin-left: 10px;
	height: 80px;
	width: 707px;
	overflow-y: scroll;
	overflow-x:hidden;
}

.sendDocumentsSelectedDocumentsInner {
	columns: 2;
	-webkit-columns: 2;
	-moz-columns: 2;
	-webkit-column-width:50%;
	-moz-column-width:50%;
	column-width:50%;
}

.expandableDocumentVersionsIcon
{
	background-image:url(/mp8images/doc2.gif);
	height:15px;
	width:15px;
	background-repeat:no-repeat;
	cursor:pointer;
	float:left;
	margin-top:2px;
	margin-right:4px;
}

.expandableSectionCompositeCaptionLeft
{
    display: inline;
	float: left;
}

.expandableSectionButton
{
	float:left;
	display:inline;
	margin-right:4px;
}

.documentEditTable
{
	width:100%;
	margin-bottom:5px;
}

.documentVersionButtonContainer
{
	margin-bottom:5px;
}

div.documentUploadQueContainer
{
    padding:2px;
    border-style:solid;
	border-color:#D1CFCF; 
	border-width:1px;
	width:720px;
}

div.documentUploadQueContainerSingle {
    padding: 2px;
    border-style: solid;
    border-color:#D1CFCF;
    border-width: 1px;
    height: 45px;
    width: 99%;
}

.documentUploadQue
{
    max-height:460px;
    overflow-y:auto;
	min-width:400px;
	min-height:135px;
}

.editDocumentContainer
{
	min-width:500px;
}

.documentVersionItemCount
{
	float:right;
	font-size:.75em;
	margin-right:.5em;
}

.visualManagerFrame {
	display: block;
    width: 100%;
    height: calc(100vh - 52px);
    min-height: 500px;
    max-height: none;
    border: 0;
	vertical-align: top;
}

tableau-viz {
	width: 100%;
	height: 100%;
}


/* ============================================================
   TOOLTIPS & FLYOUTS
   ============================================================ */

.jqueryTooltip {
	background-color: #fffeed;
	border-style: solid;
	border-color: silver;
	border-width: 1px;
	padding: 5px;
	cursor: default;
    white-space: pre-line;
}

.jqueryTooltipWide {
	max-width: 700px;
}

div.tooltip
{
	background-color:#FFFF99;
	border-style:solid;
	border-color:Black;
	border-width:1px;
	padding-top:0px;
	padding-bottom:0px;
	padding-right:3px;
	padding-left:3px;
	cursor:default;
}

/* ============================================================
   JQUERY UI TOOLTIPS
   ============================================================ */

.ui-tooltip {
	color: #000000;
}

.ui-tooltip-content {
	max-width: 350px;
}

/* ============================================================
   MODAL POPUP
   ============================================================ */
.modalBackground {
	background-color:#FFFFFF;
	opacity:0.5;
}

.modalPopup {
	background-color:#E0E0E5;
	color:#000000;
	border-width:3px;
	border-style:solid;
	border-color:#D1CFCF;
	padding:3px;
}

.PopupHeader
{
    color:#000000;
	font-size:medium;
}

.viewDialogLowerPanel,
.accountViewDialogLowerPanel {
	padding-top: 30px;
}

/* dragOptions_column - potential for removal - jpf '26 *******/
div.dragOptions_column
{
    overflow:hidden;
    overflow-y:auto;  
    white-space:nowrap;
}

.confirmationPopupButton {
	float: right;
}

.confirmationPopupMessage {
	min-height: 50px;
	max-height: 600px;
	overflow: auto;
	overflow-wrap: anywhere;
	top: 10px;
}

/* ============================================================
   ICONS (Map, Email)
   ============================================================ */

img.MapIcon
{
	border:0;
}

img.EmailIcon
{ 
	border:0;
}

.watermarked {
    background-color:#F0F8FF;
    color:gray;
}

.mpCompositeToEdit
{
    background-color:Silver;
}


/* ============================================================
   DOCUMENT ADD/EDIT
   ============================================================ */

.documentlistitem
{
    position: relative;
    display: block;
    /*float: left;	*/
    list-style-type: none;
    padding: 10px;
    border: solid 1px darkgray;
    margin: 12px;
    background:#1F4E78;
    text-align: left;
    -moz-border-radius: 0px 0px 0px 0px;
    -webkit-border-radius: 0px;    
}

#ulDocumentList
{
    padding: 0px;	
    margin: 0px;	
}	

.ActionPending
{  
    opacity: 0.5;
}


/*49815 - review this*/
.documentlistitem:hover .deletethumbnail
{
    display: block;
    z-index:10;
    opacity: 0.90;
}

/* REQUIRED Style - or IE fails to click on empty captions  */
/*.documentlistitem div:first-child { height: 63px; }*/
.documentlistitem div[id$=Caption] { height: 25px; } 

/* ============================================================
   LOADING OVERLAY
   ============================================================ */

.loading-overlay {
    background: #e9e9e9;
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    text-align: center;
    vertical-align: middle;
    z-index: 999;
    left: 0;
    top: -18px;
}

.loading-container-parent {
    z-index: 1;
    position: relative;
    min-height: 150px;
}

/* ============================================================
   JQUERY UI MENU
   ============================================================ */
.ui-menu {
	list-style:none;
	padding: 2px;
    padding-right:10px;
	margin: 0;
	display:block;
	float: left;
}

.ui-menu .ui-menu {
	margin-top: -3px;
}

.ui-menu .ui-menu-item {
	margin:0;
    padding:3px;
	zoom: 1;
	float: left;
	clear: left;
	width: 100%;
    border: 1px solid;
    border-color: transparent;
}

.ui-menu.ui-widget-content .ui-menu-item.ui-state-focus {
    
    border-color: silver;
	background: #dadada url(../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
	font-weight: normal;
}

.ui-menu .ui-menu-item a {
	text-decoration:none;
	display:block;
	padding:.2em .4em;
	line-height:1.5;
	zoom:1;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
	font-weight: normal;
	margin: -1px;
}

/* ============================================================
   JQUERY UI DIALOG BUTTONS
   ============================================================ */

.ui-dialog .ui-dialog-titlebar-close {
    font-size: 0;
    background-color:#FFFFFF;
    border: 0;
    margin: -10px 4px 0 0;
    border-radius: 2px;
}

.ui-dialog-titlebar-close:hover {
    border: 0px solid #fbcb09;
    background: #dadada url(../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
    color: #212121;
}

.ui-dialog .ui-dialog-buttonpane button {
    padding: 2px 12px 4px 12px;
    border: 0;
    font-weight: bold;
    border-radius: 3px;
}

.ui-dialog .radioBtnGroup {
    margin-top: 20px;
    width: 100%;
    float: left;
}

/* ============================================================
   TOAST NOTIFICATIONS
   ============================================================ */

.toast-container {
	width: 280px;
	z-index: 9999;
}

* html .toast-container {
	position: absolute;		
}
 
.toast-item {
	height: auto;
	background:#E0E0E5;
    opacity: 0.9;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	color:#000000;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 6px;
	padding-right: 6px;
	font-family: lucida Grande; /* Theme This Font1? */
	font-size: 14px;
	border: 2px solid;
	border-color:#D1CFCF;
	display: block;
	position: relative;
	margin: 0 0 12px 0;
}

.toast-item p {
    text-align: left;
    margin-left: 50px;
    margin-top : 5px;
    margin-right:inherit;
    margin-bottom:inherit;
}

.toast-item-image {
    width:32px;
    height: 32px;
    margin-left: 10px;
    margin-right: 10px;
    float:left;
}

.toast-item-image-notice {
    background:url(/mp8images/toast_notice.png);
}

.toast-item-image-success {
    background:url(/mp8images/toast_success.png);
}

.toast-item-image-warning {
    background:url(/mp8images/toast_warning.png);
}

.toast-item-image-error {
    background:url(/mp8images/toast_error.png);
}

/** 
 * toast types 
 * pattern: toast-type-[value]
 * where 'value' is the real value of the plugin option 'type'
 */
.toast-type-notice {
    color: white;    
}

.toast-type-success {
}

.toast-type-warning {
    color: white;
    border-color: #FCBD57;
}

.toast-type-error {
    color: white;
    border-color: #B32B2B;
}

/** 
 * positions 
 * pattern: toast-position-[value]
 * where 'value' is the real value of the plugin option 'position'
 */
 
.toast-position-top-left {
    position: fixed;
    left: 20px;
    top: 20px;
}

.toast-position-top-center {
    position: fixed;
    top: 20px;
    left: 50%;
    margin-left: -140px;
}

.toast-position-top-right {
    position: fixed;
    top: 20px;
    right: 20px;
}

.toast-position-middle-left {
    position: fixed;
    left: 20px;
    top: 50%;
    margin-top: -40px;
}

.toast-position-middle-center {
    position: fixed;
    left: 50%;
    margin-left: -140px;
    margin-top: -40px;
    top: 50%;
}

.toast-position-middle-right {
    position: fixed;
    right: 20px;
    margin-left: -140px;
    margin-top: -40px;
    top: 50%;
}

.toast-position-bottom-right 
{
	position:fixed;
	right:20px;
	bottom:0px;
}

/* ============================================================
   MISC FORM & LAYOUT CLASSES
   ============================================================ */

.templateValueInputDialog {
    vertical-align: top;
}

.templateValueInputField {
    float: left;
    padding-right: 15px;
}

.templateValueInputText {
    float: left;
    padding-top: 25px;
}

UL.BulletedList
{
     list-style-type:disc;
     margin-left:8px;
     padding-left:8px;
}

div.editShortcutContainer
{
    width:520px;
    height: 100px;
}

div.shortcutAddAdvancedItems
{
    margin-bottom:5px;
}

div.editContactContainer
{
    width:520px;
}

.r3
{
	background-color:Silver;
}

UL.cnfrmPwdMsg
{
    color: Red;
}

/* ============================================================
   ATTACHMENT VIEW
   ============================================================ */
#ulAttachmentView
{
    white-space:normal !important;
    padding: 0px; 
    margin: 0px;  
}

td.AttachmentFileName
{
      font-weight:bold;
      padding:0px !important;
}

td.AttachmentFilesize
{
      font-style:italic;
      padding:0px !important;
}

.AttachmentListItem
{
    position: relative;
    display: block;
    float: left;  
    list-style-type: none;
    padding-right:14px;
    padding-bottom:10px;
}
      
.DeleteAttachmentIcon
{                       
    position: absolute;
    top: 0px;
    right: 0px;         
    display: none;
    width:16px;   
    height:16px;        
    cursor: pointer;    
    background-image: url(../images/Picture_Delete.png);
}

.AttachmentListItem:hover div.DeleteAttachmentIcon,
.DeleteAttachmentIcon:hover
{
    display: block;
}

.doc16Icon
{
	width:16px;
	height:16px;
	margin-left:6px;
	margin-right:2px;
	cursor:pointer;
	background-color:Blue;
}

/* ============================================================
   PAGE-SPECIFIC WIDGET, WEBLIST, FEATURE OVERRIDES
   ============================================================ */

.myProjectsWeblistOuter,
.impactChartWeblistOuter
{
	margin-right:0px;
	margin-left:0px;
}

.commissionWarning {
    font-weight:bold;
    text-decoration:underline;
}


/* ============================================================
   PROJECT FLAGS & FINANCIAL TOTALS
   ============================================================ */

.expandableIncomeAmount
{
	cursor:pointer;
}
.expandableIncomeHeader
{
	min-width:825px;
}

.receivableList
{
	max-height:none;
}

.receivableList tbody td
{
    border-width: 0 0 0 0;
    border-style: none;
    white-space: normal;
}

.wl_NavReceivableList
{
    margin-right:0px;
}

.receivableStatus
{
	margin-left:20px;
	padding-top:2px;
	font-style:italic;
	opacity:0.6;
}

tr.expandableFooterRowDark td,
tr.expandableContractFooter td
{
    background-color:#1F4E78;
	color:#FFFFFF;
    border-top-style:solid;
	border-top-width:1px;
	border-color:#D1CFCF; 
	margin-top:5px;
}

.FinancialWidgetContent,
.ProjectFinancialWidgetContent,
.ContractFinancialWidgetContent,
.WeblistHeaderContent
 {
	background-color:#E0E0E5;
	color:#000000;
 }

.TotalsHeader
{
	background-color:#E0E0E5;
	color:#000000;
}

.TotalsHeaderContainer
{
    margin-bottom:20px;
    border: solid 2px;
    border-color:#1F4E78;
    padding: 1px;
}

.TotalsHeaderValue
{
	text-align: right;
	padding-right: 35px;
}

.ContractAdditionAmountMiddleCell
{
	padding-right: 60px;
	text-align: right;
}

/* ============================================================
   MISCELLANEOUS PAGE-SPECIFIC CLASSES
   ============================================================ */

/*Much of these have been moved to PagesDyn.css */

.narrativeLink,
.ticketLink
{
    text-decoration:none;
}

.narrativeLink:hover,
.ticketLink:hover 
{
    cursor:pointer;
    text-decoration:underline;
}

.optionEmphasize,
.ticketMRU {
	background-color: #f5f5f5;
}

.userEditRowPanel {
	padding: 2px;
	display: flex;
}

.userEditPasswordContainer {
	padding: 10px, 0px, 10px, 0px;
}

.userEditChgPasswordChk,
.projectTempEditOrgChooserDropdown, 
.discountRateEditDialogInfoContainer {
	padding-bottom: 10px;
}

.rtEditRowPanel,
.orgEditRowPanel,
div.ReportCriteria_ControlRow {
	padding: 0px 2px;
	min-height: 35px;
	display: flex;
}

.adminKey {
	margin-left: 5px;
	font-size: 1.2em;
	cursor: pointer;
}

.editRowPanel,
.cdEditRowPanel {
	display: flex;
	margin-top: 3px;
	align-items: center;
}

.timeZoneOffset
{
    font-size:.6em;
}

img.documentIcon
{
	cursor:pointer;
}


/* ============================================================
   WEBLIST PAGE CONTAINER CLASSES
   ============================================================ */

.pgWeblistContainer 
 {
 	margin: 6px 6px 7px 6px;
    border-width:1px;
    border-style:solid;
    border-color:#D1CFCF; 
    min-width:202px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
 }

.pgWeblistScrollContainer {
	margin: 0px 1px 0px 2px;
	border-width: 1px;
	border-style: solid;
	border-color:#D1CFCF;
	min-width: 202px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
}

.pgWeblistGridContainer {
    margin: 6px 6px 0px 6px;
    border-width: 0px;
    border-style: solid;
    border-color:#D1CFCF;
    min-width: 202px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

/*Pre-Weblist Header aka ExtraControls above Weblist*/
.WeblistHeaderContent {
    border-width: 1px;
    border-style: solid;
    border-color:#D1CFCF;
    min-width: 202px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

/*Used by NoteView and Expandable */
div.NoteViewRecipientsContainer {
    margin-bottom: 20px;
}

span.NoteViewRecipientCaption {
    width:35px;
    color:#6B6B6B;
    display:inline-block;
}

/* ============================================================
   MP8 NEW CLASSES (Today Widget, Dialog, Breadcrumb, etc.)
   ============================================================ */


.PageContent tr:last-of-type td
.GeneralSection_Border tr:last-child td {
	border-bottom: none;
}

.weblistExpandable tr:last-of-type td
{
	border-bottom-width: 0px;
}

table.TodayWidgetConentTable tr.TodayWidgetTotalRow td,
.weblistExpandable tr.ExpandableSection_SingleItemRow > td,
.weblistExpandable .ExpandableSection_SingleAlternateItemRow > td,
.PageContent tr.ExpandableSection_SingleItemRow > td,
.PageContent tr.ExpandableSection_SingleAlternateItemRow > td,
.PageContent tbody.ExpandableSection_SingleItemRow > tr:first-of-type > td,
.PageContent tbody.ExpandableSection_SingleAlternateItemRow > tr:first-of-type > td,
.GeneralSection_Border tr.ExpandableSection_SingleItemRow > td,
.GeneralSection_Border tr.ExpandableSection_SingleAlternateItemRow > td,
.GeneralSection_Border tbody.ExpandableSection_SingleItemRow > tr:first-of-type > td,
.GeneralSection_Border tbody.ExpandableSection_SingleAlternateItemRow > tr:first-of-type > td,
.weblistExpandable tbody td.weblistGroupHeader,
.weblistExpandable tbody tr.ExpandableSection_ColumnHeaderRow > td,
.weblistExpandable tbody tr.ExpandableSection_DarkItemRow:first-of-type > td,
.expenseList tbody tr.ExpandableSection_DarkItemRow:first-of-type > td,
.receivableList tbody tr.ExpandableSection_DarkItemRow:first-of-type > td {
    border-top: 1px solid;
    border-color:#D1CFCF;
}

.weblistExpandable tbody tr.ExpandableSection_FooterRow > td {
    border-top: solid 1px;
    border-bottom: solid 1px;
    border-color:#D1CFCF;
}

div.DialogControlCluster
{
    margin-top:9px;
    padding-top:9px;
    padding-bottom:3px;
    border: 0px solid;
    border-top-width: 1px;
    border-color:#D1CFCF;
}

/* ============================================================
   HIGHCHARTS
   ============================================================ */

.highcharts-color-0 {
    background-color:#1F4E78;
}

/* ============================================================
   GENERAL & DETAIL VIEW SECTIONS
   ============================================================ */

div.PageContent {
	margin: 6px 4px 4px 4px;
	position: relative;
}

table.PageContent {
    background-color:rgba(255,255,255,.5);
}

table.mvc-content {
	width: 100%;
	text-align: left;
	border-radius: 2px 2px 0 0;
	border-collapse: separate;
	border-spacing: 0;
	padding:0px;
}

div.mvc-viewcontentcontainer {
	width: 100%;
	text-align: left;
	padding: 2px;
}

div.mvc-viewrow {
	padding-top: 4px;
	padding-bottom: 4px;
}

.PageContent > td,
.mvc-content td,
.mvc-content th {
	padding: 4px;
}

td.ContentHeader {
	background-color:#1F4E78;
	font-weight: bold;
	padding-left: 6px;
	color:#FFFFFF;
	border-bottom: solid 1px;
	border-color:#D1CFCF;
}

tr.ContentHeader {
	background-color:#1F4E78;
	font-weight: bold;
	padding-left: 2px;
	color:#FFFFFF;
}

tr.ContentHeader td {
	border-bottom: solid 1px;
	border-color:#D1CFCF;
}

/* Details Section - which ones? */
.DetailSection_Border {
	border-width: 1px;
	border-style: solid;
	border-color:#D1CFCF;
}

/*Used system wide for borders*/
.GeneralSection_Border {
	border-width: 1px;
	border-style: solid;
	border-color:#D1CFCF;
}

.GeneralSection {
	width: 100%;
	border-collapse:collapse;
	margin: 0 0 10px 0;
}

/* ============================================================
   CUSTOMIZER LITERAL CSS OPTIONS
   ============================================================ */

.CustomizerLiteral_Bold {
	font-weight: bold;
}

.CustomizerLiteral_Italic {
	font-style: italic;
}

.CustomizerLiteral_Subscript {
	font-size: x-small;
}

.CustomizerLiteral_Heading1 {
	color:#E0E0E5;
	font-size: small;
	font-weight: bold;
}

/* ============================================================
   LAYOUT UTILITIES (markup-table flex grid)
   ============================================================ */


div.markup-table {
	width: 100%;
}

div.markup-tr {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

div.markup-td {
	flex: 1;
	padding: 1px;
	clear: both;
}

.loadingContainerOverlay {
	background-color: #e9e9e9;
	background-image: url("/mp8Images/load64_transparent.gif");
	background-repeat: no-repeat;
	background-position: center;
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 0.7;
	z-index: 999;
	left: 0;
	top: 0;
}

/*Does this belong in External?*/
body.External {
	padding: 0px;
	margin: 0px 0px 41px 0px;
	font-family: Calibri,Tahoma,Arial,sans-serif;
}

/*Leaving these here until we find out exactly where they are used */
td.inboxNotification_notifyByMaxWidth {
	max-width: 300px;
}

td.inboxNotification_subjectMaxWidth {
	max-width: 300px;
}

.marketBriefCompetitorCaptionContainer {
	width: 120px;
	overflow: hidden;
	display: inline-block;
}

table.fullWidth,
td.fullWidth {
	width: 100%
}



/* ============================================================
   USER AVATAR
   ============================================================ */
.note-avatar-cell {
	vertical-align: top;
	width: 46px;
	max-width: 46px;
	height: 46px;
	padding: 6px;
}

.note-avatar {
	border: none;
}

img.note-avatar {
	width: 40px;
	height: 40px;
	min-width: 40px;
	min-height: 40px;
	display: block;
	object-fit: cover;
}

.note-avatar-link {
	text-decoration: none;
	display: inline-block;
}

/* ============================================================
   OPTIONS CRITERIA LAYOUT
   ============================================================ */

/*system-wide variation of the ReportCriteria_Header style */
.optionsCriteria_Header {
	background-color:#1F4E78;
	color:#FFFFFF;
}

div.optionCriteria_Header {
	padding: 2px;
	padding-bottom: 3px;
	padding-left: 8px;
	margin-bottom: 15px;
}

.optionsCriteria_Subsection {
	font-size: 12px;
	margin-top: 10px;
}

.optionsCriteria_Subsection ~ div {
	margin-top: 10px;
}


/* ------------ END STANDARD CSS CLASSES -- MEDIA QUERY ONLY BELOW ---------------------------------------------*/

/* ============================================================
   RESPONSIVE MEDIA QUERIES
   ============================================================ */

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px),
/* iPads (portrait) ----------- */
(min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait),
/* Smartphones - high res (landscape) ----------- */
(min-device-width : 768px) and (max-device-width : 996px) and (orientation : landscape),
/* Non mobile ----------- */
(max-width:768px) {
	div.markup-table {
		display: block;
	}

	div.markup-tr {
		display: block;
		/* max-width: 1300px; */
	}

	div.markup-td {
		display: block;
	}

	div.markup-td .mpEditBase div:nth-child(1) {
		float: inherit !important;
		padding-left: 0px !important;
	}

	.reportcriteria-grid-2col {
		grid-template-columns: 1fr;
	}

	.report-criteria-col-span {
		grid-column: 1;
	}
}