/*@media screen {*/

#reportresults h2 { font-size: 1.1em; font-weight: bold; }

.progress { color: #396EAA; margin-left: 140px; font: bold x-small "Segoe UI", Segoe, sans-serif; margin-top: -20px; }

/* define the main layout divs */
#project { padding-top: 6px; padding-left: 98px; color: #FFFFFF; font-weight: bold; font-size: 12px; height: 28px; top: 0px; text-align: center; }

/* IE needs height:512px BUT this height:512px below must be removed to display correctly in Mozilla */
#reportresults, #projectadministration, #adminedit, #timesheet, #addhours, #projectreport, #resourcereport { height: 100%; }
/* Mozilla needs min-height:512px (IE will ignore this min-height) */
#reportresults, #projectadministration, #adminedit, #timesheet, #addhours, #projectreport, #resourcereport { min-height: 512px; }

#addhours { padding: 10px; border: none; float: left; background: none; color: inherit; font-family: inherit; width: 60vw; position: relative; }
  #addhours fieldset { width: 99%; min-height: 90vh; }

#reportresults, #projectadministration, #projectreport, #resourcereport, #adminedit, #MC_adminedit { font-family: Apax, Helvetica, Arial, sans-serif; }

#timesheet { padding: 0px !important; border: none; margin-left: 0; background: #FFFFFF; color: inherit; font-family: inherit; }
  #timesheet fieldset { width: 98%; min-height: 90vh; margin-top: 10px; padding-left: 5px !important; }

#timesheetdata, #projecttable { width: 100%; text-align: center; }

#catlist { width: 20%; }
/* define other elements inside the main layout divs */
/* can be removed if no images in breadcrumb area */
#breadcrumb img { border: none; padding-right: 3px; vertical-align: middle; }

/* define sizes of the username field */
.username { font-size: 0.9em; width: 150px; }

/* create hover effect for calendar icons */
#addhours a:link img, #addhours a:visited img, #resourcereport a:link img, #resourcereport a:visited img { padding: 2px; border: 1px solid #DFE4EA; background: #DFE4EA; }
/* Put the admin edit calendar icon on a white background */
#adminedit a:link img, #adminedit a:visited img { padding: 0px; border: 1px solid #FFFFFF; background: #FFFFFF; }

#addhours a:hover img, #resourcereport a:hover img, #adminedit a:hover img { padding: 2px; border: 1px solid #C1CFE0; background: #E8ECF0; }

#addhours a:active img, #resourcereport a:active img, #adminedit a:active img { padding: 2px; border: 1px solid #C1CFE0; background: #C9D4E2; }
/* add fade background and padding to all table rows */
.row1 { padding: 3px; background: url(images/timesheet_data_bg.gif) repeat-x; background: #F9FAFB; }

  .row1 img { border: none; text-align: center; }
/* add hover effect to any a href images within the data tables */
#timesheetdata a:link img, #timesheetdata a:visited img, #projecttable a:link img, #projecttable a:visited img { padding: 2px; border: 1px solid #EDF0F3; background: #EDF0F3; }

#timesheetdata a:hover img, #projecttable a:hover img { padding: 2px; border: 1px solid #C1CFE0; background: #FBFBFC; }

#timesheetdata a:active img, #projecttable a:active img { padding: 2px; border: 1px solid #C1CFE0; background: #D9E2EC; }
/* zero margin on all forms */
form { margin: 0px; }
/* define the pop up calendar style */
#calbg { background: #ABBDD3 url(images/background_calendar.gif) repeat-x; height: 1000px; }

#calcontent { margin: 5px; padding: 5px 4px 9px 4px; border: 1px solid #000000; background: #FFFFFF; font-size: 10px; text-align: center; }

#month { margin-bottom: 6px; font-size: 9px; width: 80px; }

#year { margin-bottom: 6px; font-size: 9px; width: 50px; }

#calcontent table td a:link, #calcontent table td a:visited { padding: 0px 2px 3px; display: block; }

#calcontent table td a:hover, #calcontent table td a:active { display: block; background: #FFCC00; }

#calcontent table td a:active { display: block; color: #FFFFFF; background: #009900; }

/* make the cal icon appear in line with the forms and text */
#addhours img, #resourcereport img, #adminedit img { border: 0px; vertical-align: text-bottom; }
/* make hours input field more prominent */
#addhours .hours { padding-top: 1px; font-size: 1.5em; font-weight: bold; width: 35px; height: 20px; text-align: center; }

.projectlist, .resourcelist { border: 1px solid #00FF00; margin-bottom: 4px; width: 200px; }

/* define the look of the data tables (using colgroup in the source) 
colcatlist1 and colcatlist1 are generic names since I'm not sure 
what kind of date goes into these cells. More appropriate names can
be added for these */
.coldescription, .colcatlist1, .colcatlist2 { text-align: left; }

.colday, .colhours, .coledit, .coldelete { width: 5%; }

.colproject, .colcategory { width: 15%; }

.colhours { font-weight: bold; }

.coldescription { width: 50%; }
/* define pop up calendar look */
.calmonday, .caltuesday, .calwednesday, .calthursday, .calfriday, .calsaturday, .calsunday { text-align: center; }

.calcurrentmonth { background: #EEEEEE; }

.calcurrentday { border: 1px solid #000000; }

.calothermonth a:link, .calothermonth a:visited { color: #999999; }

.calweekend { background: #E2E2E2; }
/* create section heading container to separate long forms */
/*.formsection { padding: 10px; margin-top: 5px; background: #D6DDE9 url(images/background_formsection.gif) repeat-x center; font-weight: bold; text-align: center; }*/
.formsection { background: #d2d2d2; color: #304152; font-weight: bold; text-transform: uppercase; font-size: 1.05em; margin: 5px 10px 8px 0; padding: 8px 10px 8px; border: #304152 solid; border-width: 1px 0 2px 0; text-align: left }
/* sometimes we hide elements from display in visual browsers (but leave them in the source for non visual browsers and for accessibility). I've also hidden the table in the admin_create_projects.html page */
.hidden { visibility: hidden; }
.collapsed { visibility: collapse; }

.none { display: none; }

img { border: none; }

.headergrid { background: url(images/Office2003SilverBG.png); }

.blacklink { text-decoration: underline; text-align: center; cursor: pointer; }

.curs { cursor: pointer; }

.HeaderClass { padding: 1px; text-align: center; }


.verticaltext2 { font-weight: bold; writing-mode: tb-rl; text-align: left; filter: flipH() flipV(); height: 90px; }

.verticaltext { font-weight: normal; writing-mode: tb-rl; text-align: left; vertical-align: bottom; filter: flipH() flipV(); }

.headertest { padding: 0px; }


.Pager { font-family: Georgia; font-style: italic; color: Gray; font-weight: bold; text-decoration: none; padding: 5px 5px 5px 5px; }


.style1 { color: #FF0000; font-weight: 700; }

.style2 { font-weight: bold; text-decoration: underline; height: 20px; }



.bodyfont { padding: 3px; border: 1px solid #000000; background: #FFFFFF; color: #666666; font-family: Tahoma,Verdana,Helvetica,Helvetica-Narrow,sans-serif; font-size: 1.0em; }

.ColLeft { border-left-style: solid; border-left-width: thin; border-left-color: Black; }

tr.ColTop td { border-top: 3px solid #000000; }

.hideleftborder { border-left-width: 0px; }

/*GL-Style*/
.arrow_box { position: relative; background: #ec1759; border: 1px solid #ec1759; }

  .arrow_box:after, .arrow_box:before { right: 102%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }

  .arrow_box:before { border-color: rgba(194, 225, 245, 0); border-right-color: #ec1759; border-width: 8px; margin-top: -8px; -webkit-box-shadow: 1px 0px 2px -2px rgba(0,0,0,0.75); -moz-box-shadow: 1px 0px 2px -2px rgba(0,0,0,0.75); box-shadow: 1px 0px 2px -2px rgba(0,0,0,0.75); }

.arrow_box_span { display: block; width: 87px; height: 12px; position: absolute; top: 4px; left: 33px; line-height: 1em; font-size: 0.9em; font-weight: 400; padding: 2px 0 0 1px; color: white; -webkit-box-shadow: 1px 1px 2px -1px rgba(0,0,0,0.50); -moz-box-shadow: 1px 1px 2px -1px rgba(0,0,0,0.50); box-shadow: 1px 1px 2px -1px rgba(0,0,0,0.50); }

.autoSuggest_ul { background: white; border-bottom: solid 5px white; display: none; left: 2px; max-height: 50vh; top: 17px; overflow-y: auto; padding: 2px 0px; position: absolute; width: 100%; -webkit-box-shadow: 0px 5px 4px -3px rgba(0,0,0,0.7); box-shadow: 0px 5px 4px -3px rgba(0,0,0,0.7); -moz-box-shadow: 0px 5px 4px -3px rgba(0,0,0,0.7); z-index: 1031; }

  .autoSuggest_ul.top { bottom: 15px; top: auto; }

.autoSuggest_li { display: none; padding: 1px 10px; cursor: pointer; text-align: left; color: #575756 }
  .autoSuggest_li:hover, .optionPreSelected { background: #ec1759; color: white; }

  .autoSuggest_li:focus { color: #ec1759; font-weight: bold; }

  .autoSuggest_li.focusSelection:hover { color: white; }

.buyerDetails { display: none; }

.icon { width: 12px; height: 12px; cursor: pointer; vertical-align: middle; margin: 0 3px; }
  .icon.large { width: 18px; height: 18px; }

.modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: black; z-index: 99; opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; }

.water { font-family: Tahoma, Arial, sans-serif; font-size: 75%; color: gray; }

.ui-widget-overlay { background: #000000; opacity: .8; filter: Alpha(Opacity=30); }

.ui-dialog { font-size: 1.3em; }

  .ui-dialog textarea { margin-left: 25px; }

.overlay { border-right: #c0c0c0 4px solid !important; border-left: #c0c0c0 4px solid !important; font-weight: bold; }

  .overlay.header { border-top: #c0c0c0 2px solid !important; }


TR.updated TD { background-color: yellow; }

.style3 { font-size: x-large; }

.style4 { color: #FF0000; font-size: large; }

/*#region Fonts */

@font-face { font-family: Apax; src: url('fonts/Apax-Thin.woff') format('woff'), url('fonts/Apax-Thin.woff2') format('woff2'), url('fonts/Apax-Thin.eot?#iefix') format('eot'); font-weight: 100; }

@font-face { font-family: Apax; src: url('fonts/Apax-ThinItalic.woff') format('woff'), url('fonts/Apax-ThinItalic.woff2') format('woff2'), url('fonts/Apax-ThinItalic.eot?#iefix') format('eot'); font-weight: 100; font-style: italic; }

@font-face { font-family: Apax; src: url('fonts/Apax-Light.woff') format('woff'), url('fonts/Apax-Light.woff2') format('woff2'), url('fonts/Apax-Light.eot?#iefix') format('eot'); font-weight: 300; }

@font-face { font-family: Apax; src: url('fonts/Apax-LightItalic.woff') format('woff'), url('fonts/Apax-LightItalic.woff2') format('woff2'), url('fonts/Apax-LightItalic.eot?#iefix') format('eot'); font-weight: 300; font-style: italic; }

@font-face { font-family: Apax; src: url('fonts/Apax-Regular.woff') format('woff'), url('fonts/Apax-Regular.woff2') format('woff2'), url('fonts/Apax-Regular.eot?#iefix') format('eot'); font-weight: 400; }

@font-face { font-family: Apax; src: url('fonts/Apax-RegularItalic.woff') format('woff'), url('fonts/Apax-RegularItalic.woff2') format('woff2'), url('fonts/Apax-RegularItalic.eot?#iefix') format('eot'); font-weight: 400; font-style: italic; }

@font-face { font-family: Apax; src: url('fonts/Apax-Medium.woff') format('woff'), url('fonts/Apax-Medium.woff2') format('woff2'), url('fonts/Apax-Medium.eot?#iefix') format('eot'); font-weight: 700; }

@font-face { font-family: Apax; src: url('fonts/Apax-MediumItalic.woff') format('woff'), url('fonts/Apax-MediumItalic.woff2') format('woff2'), url('fonts/Apax-MediumItalic.eot?#iefix') format('eot'); font-weight: 700; font-style: italic; }

@font-face { font-family: Apax; src: url('fonts/Apax-Bold.woff') format('woff'), url('fonts/Apax-Bold.woff2') format('woff2'), url('fonts/Apax-Bold.eot?#iefix') format('eot'); font-weight: 800; }

@font-face { font-family: Apax; src: url('fonts/Apax-BoldItalic.woff') format('woff'), url('fonts/Apax-BoldItalic.woff2') format('woff2'), url('fonts/Apax-Bold.eot?#iefix') format('eot'); font-weight: 800; font-style: italic; }

@font-face { font-family: Apax; src: url('fonts/Apax-Superbold.woff') format('woff'), url('fonts/Apax-Superbold.woff2') format('woff2'), url('fonts/Apax-Medium.eotSuperboldiefix') format('eot'); font-weight: 900; }

@font-face { font-family: Apax; src: url('fonts/Apax-SuperboldItalic.woff') format('woff'), url('fonts/Apax-SuperboldItalic.woff2') format('woff2'), url('fonts/Apax-SuperboldItalic.eot?#iefix') format('eot'); font-weight: 900; font-style: italic; }

/*#endregion */
/*#region Screen size & Responsiveness */

/*Large Screen*/
@media screen and (min-width : 1281px) {
  .C1-12.out { width: 7.33% !important; }

  .C2-12.out { width: 15.67% !important; }

  .C3-12.out { width: 24% !important; }

  .C4-12.out { width: 32.33% !important; }

  .C5-12.out { width: 40.67% !important; }

  .C6-12.out { width: 49% !important; }

  .C7-12.out { width: 57.33% !important; }

  .C8-12.out { width: 65.67% !important; }

  .C9-12.out { width: 74% !important; }

  .C10-12.out { width: 82.33% !important; }

  .C11-12.out { width: 90.67% !important; }

  .C12-12.out { width: 98% !important; }

  .C1-12.in { width: 7.33% !important; }

  .C2-12.in { width: 15.67% !important; }

  .C3-12.in { width: 24% !important; }

  .C4-12.in { width: 32.33% !important; }

  .C5-12.in { width: 40.67% !important; }

  .C6-12.in { width: 49% !important; }

  .C7-12.in { width: 57.33% !important; }

  .C8-12.in { width: 65.67% !important; }

  .C9-12.in { width: 74% !important; }

  .C10-12.in { width: 82.33% !important; }

  .C11-12.in { width: 90.67% !important; }

  .C12-12.in { width: 98% !important; }

  body { font-size: 10.5px; }
}
/*Medium Screen*/
@media screen and (min-width: 1025px) and (max-width: 1280px) {
  .C1-12.out { width: 7.33% !important; }

  .C2-12.out { width: 15.67% !important; }

  .C3-12.out { width: 24% !important; }

  .C4-12.out { width: 32.33% !important; }

  .C5-12.out { width: 40.67% !important; }

  .C6-12.out { width: 49% !important; }

  .C7-12.out { width: 57.33% !important; }

  .C8-12.out { width: 65.67% !important; }

  .C9-12.out { width: 74% !important; }

  .C10-12.out { width: 82.33% !important; }

  .C11-12.out { width: 90.67% !important; }

  .C12-12.out { width: 98% !important; }

  .C1-12.in { width: 98% !important; }

  .C2-12.in { width: 98% !important; }

  .C3-12.in { width: 98% !important; }

  .C4-12.in { width: 98% !important; }

  .C5-12.in { width: 98% !important; }

  .C6-12.in { width: 98% !important; }

  .C7-12.in { width: 98% !important; }

  .C8-12.in { width: 98% !important; }

  .C9-12.in { width: 98% !important; }

  .C10-12.in { width: 98% !important; }

  .C11-12.in { width: 98% !important; }

  .C12-12.in { width: 98% !important; }


  body { font-size: 10.5px !important; }

  fieldSet:not(.fsApproval) { min-width: 220px !important; }

  .responsive.col25 { width: 25% !important; }

  .responsive.col40 { width: 40% !important; }

  .responsive.col50 { width: 49% !important; }

  .responsive.col60 { width: 58% !important; }

  .responsive.col75 { width: 73% !important; }

  .responsive.col25 .col100, .responsive.col40 .col100, .responsive.col60 .col100, .responsive.col50 .col100 { float: left !important; width: 98% !important; max-width: none !important; border-bottom: #e4e4e4 1px solid; }

  .responsive.W3.Left { float: left !important; clear: left; }

  .responsiveList input[type=submit] { position: absolute; transform: translate(-20px,-10px); }

  .responsiveListItem { width: 80% !important; }

    .responsiveListItem .listItemTitle { width: 30% !important; margin: 2px 4px 0 0; display: inline-block; text-align: right; vertical-align: top; }

    .responsiveListItem input[type=text], .responsiveListItem textarea, .responsiveListItem select { width: 50% !important; }
}
/*Small or Tablet*/
@media screen and (min-width: 736px) and (max-width: 1024px) {
  .C1-12.out { width: 98% !important; }

  .C2-12.out { width: 98% !important; }

  .C3-12.out { width: 98% !important; }

  .C4-12.out { width: 98% !important; }

  .C5-12.out { width: 98% !important; }

  .C6-12.out { width: 98% !important; }

  .C7-12.out { width: 98% !important; }

  .C8-12.out { width: 98% !important; }

  .C9-12.out { width: 98% !important; }

  .C10-12.out { width: 98% !important; }

  .C11-12.out { width: 98% !important; }

  .C12-12.out { width: 98% !important; }

  .C1-12.in { width: 7.33% !important; }

  .C2-12.in { width: 15.67% !important; }

  .C3-12.in { width: 24% !important; }

  .C4-12.in { width: 32.33% !important; }

  .C5-12.in { width: 40.67% !important; }

  .C6-12.in { width: 49% !important; }

  .C7-12.in { width: 57.33% !important; }

  .C8-12.in { width: 65.67% !important; }

  .C9-12.in { width: 74% !important; }

  .C10-12.in { width: 82.33% !important; }

  .C11-12.in { width: 90.67% !important; }

  .C12-12.in { width: 98% !important; }

  body { font-size: 10.5px !important; }
}

@media screen and (max-width: 735px) {
  .C1-12.out { width: 98% !important; }

  .C2-12.out { width: 98% !important; }

  .C3-12.out { width: 98% !important; }

  .C4-12.out { width: 98% !important; }

  .C5-12.out { width: 98% !important; }

  .C6-12.out { width: 98% !important; }

  .C7-12.out { width: 98% !important; }

  .C8-12.out { width: 98% !important; }

  .C9-12.out { width: 98% !important; }

  .C10-12.out { width: 98% !important; }

  .C11-12.out { width: 98% !important; }

  .C12-12.out { width: 98% !important; }

  .C1-12.in { width: 98% !important; }

  .C2-12.in { width: 98% !important; }

  .C3-12.in { width: 98% !important; }

  .C4-12.in { width: 98% !important; }

  .C5-12.in { width: 98% !important; }

  .C6-12.in { width: 98% !important; }

  .C7-12.in { width: 98% !important; }

  .C8-12.in { width: 98% !important; }

  .C9-12.in { width: 98% !important; }

  .C10-12.in { width: 98% !important; }

  .C11-12.in { width: 98% !important; }

  .C12-12.in { width: 98% !important; }

  body { font-size: 10px !important; }
}

.responsive { /*display: inline-block !important;*/ display: inline-block; }

.responsiveList { margin-bottom: 10px; }

.responsiveListItem { display: inline-block; margin-bottom: 3px; }

  .responsiveListItem .listItemTitle { margin: 0 0 3px 2px; }

/*#endregion */

body { margin: 0px; color: #575756; font-family: Apax, Helvetica, Arial, sans-serif; font-weight: 300; font-size: 10.5px; height: 100vh; background: none; }
#body { background: none; }
body.iframe { height: auto; }
iframe{border:none;}

[data-group="grpMonth"] { width: 70% !important; /*border:solid black 5px!important;*/ }

input, textarea, select, button { font-family: Apax, Helvetica, Arial, sans-serif; font-size: inherit; margin-bottom: initial; }

a, a:link, a:visited, a:hover, a:active { color: #ec1759; text-decoration: none; cursor: pointer; }

  a:hover { font-weight: 800; }

b { font-size: 1.03em; font-weight: 700; }

h1, h2, h3, h4 { margin: 7px 0 5px; text-transform: uppercase; }

h5, h6 { margin: 2px; font-weight: 400; font-size: 1em; display: inline-block; }

h3 { font-size: 1.1em; }

h4 { font-size: 1.1em; font-weight: 400; }

h5 { }

h6 { text-transform: uppercase; }

.h6 { font-weight: bold; margin: 2px; padding: 2px; text-transform: uppercase; }

.title1 { margin: 5px 0 0 0; padding: 1px 4px 0px; font-weight: bold; text-transform: uppercase; font-size: 1.05em; color: #304152; }

.emphasis { border: 2px #ec1759 !important; border-style: solid !important; background-color: #f1d3dc !important }

.emphas_1 { background: #ec1759 !important; color: #FFFFFF; margin: 5px 5px 10px 5px; }

.emphas_2 { background: #ec1759 !important; margin: 10px 0px 5px 0px; padding: 10px 35px !important; font-size: 1.2em !important; font-weight: 800 !important; display: block; left: 50%; transform: translate(-50%,-20%); position: relative; width: 100% !important; }

.btnExcel { border: 3px solid #737373; }

  .btnExcel:hover { border: 5px solid #d1d1d1; transform: scale(0.95, 0.95); }

#ctl00_maincontent_HL_excel { width: 22px !important; height: 22px !important; vertical-align: middle; margin: 0 4px 4px 2px; }
  #ctl00_maincontent_HL_excel:hover { transform: scale(0.8); opacity: 0.8 }

.show { }

.hide { display: none; }

.hideImportant { display: none !important; }

.hideImportantR { background-color: red !important; }

.hideOverFlowImportant { overflow: hidden !important; }

.overflowVisible { overflow: visible !important; }

.centered { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); }

.centered_Page { position: fixed !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); }

.centeredBottom { position: fixed; bottom: 0%; margin-bottom: 0; left: 50%; transform: translate(-50%, 0%); }

.contrast_dark, .contrast_dark * { color: white !important }
.contrast_light, .contrast_light * { color: black !important }

/*.center { z-index: 1000; margin: 300px auto; padding: 10px; width: 130px; background-color: red; border-radius: 10px; filter: alpha(opacity=100); opacity: 1; -moz-opacity: 1; }*/

.flipV { -webkit-animation: flip-horizontal-bottom 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; animation: flip-horizontal-bottom 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; }


.flipH { -webkit-animation: flip-vertical-left 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; animation: flip-vertical-left 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; }

.rotate-center { -webkit-animation: rotate-center 0.6s ease-in-out both; animation: rotate-center 0.6s ease-in-out both; }


@-webkit-keyframes rotate-center {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes rotate-center {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@-webkit-keyframes flip-horizontal-bottom {
  0% { -webkit-transform: rotateX(0); transform: rotateX(0); }
  100% { -webkit-transform: rotateX(-180deg); transform: rotateX(-180deg); }
}

@keyframes flip-horizontal-bottom {
  0% { -webkit-transform: rotateX(0); transform: rotateX(0); }
  100% { -webkit-transform: rotateX(-180deg); transform: rotateX(-180deg); }
}

@-webkit-keyframes flip-vertical-left {
  0% { -webkit-transform: rotateY(0); transform: rotateY(0); }

  100% { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); }
}

@keyframes flip-vertical-left {
  0% { -webkit-transform: rotateY(0); transform: rotateY(0); }

  100% { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); }
}

/*#region Header */

/*#header { max-height: 30px; position: relative; padding: 15px 10px; background-color: #304152; }*/
#header { max-height: 30px; position: relative; padding: 2px 5px; background-color: #304152; }

  #header .container { height: 100%; }
  #header.demo { max-height: 30px; border-top: solid 10px #ec1759; }

.logo_eValidate { font-size: 2em !important; color: #ffffff !important; border: none !important }

.logo_Faurecia { height: 3vw; max-height: 32px; width: 80px; position: absolute; top: 50%; right: 0; transform: translate(0,-50%); margin-right: 30px; }

/*.header_title { display: inline-block; color: white; height: 100%; border-left: white solid 1px; margin-left: 10px; padding-left: 20px; font-size: 2.2em; font-weight: 100; }*/
.header_title { display: inline-block; color: white; height: 80%; border-left: #5e5e5e solid 1px; margin-left: 10px; padding-left: 15px; font-size: 1.4em; font-weight: 100; }

.title_WORNumb { color: white; background-color: #ec1759; text-align: center; width: 200px; margin: 4px 0 0 -100px; padding: 5px 0px; /* font-size: 1.1em; */ position: absolute; left: 50%; display: none; }

#navtop { background-color: rgb(210,210,210); position: relative; z-index: 2 }

#breadcrumb { color: #d2d2d2; font-size: 10px; height: 15px; position: absolute; bottom: 0; right: 220px; }

.breadcrumbNode { border-left: solid 1px white; }

.infoSection { background-color: white; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; width: 22vw; max-width: 250px; height: 100%; top: 0; right: 0; position: absolute; border-left: solid 10px #ec1759; background: #ffffff; -webkit-transform: skewX(-40deg); transform: skewX(-40deg); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; }

  .infoSection > span { -webkit-transform: skewX(40deg); transform: skewX(40deg); float: left; height: 28px; }

  .infoSection img, .infoSection input { max-height: 17px; max-width: 17px; width: 2.5vw; height: 2.5vw; padding: 8px 10px 0px 0px !important; }
    .infoSection img:hover, .infoSection input:hover { transform: scale(0.9); opacity: 0.8 }
  .infoSection #login { position: initial; padding: 0 20px 0 0; float: right; color: inherit; font-weight: inherit; font-size: 0.95em; margin-top: -2px; }
  .infoSection #ctl00_Lbl_pg_dropWrapper { float: left; margin: 10px 10px 0 -10px; color: navy; }
  .infoSection a { display: inline-block }

.login-overlay { z-index: 1 }

* { box-sizing: initial; }

/*#endregion */

/*#region Loading */
.div_loading { display: flex; justify-content: center; align-items: center; margin: 20px; }
.wave { width: 3px; height: 50px; background: linear-gradient(45deg, #ec1759, #fff); margin: 10px; animation: wave 2s linear infinite; border-radius: 20px; }
  .wave:nth-child(2) { animation-delay: 0.1s; }
  .wave:nth-child(3) { animation-delay: 0.2s; }
  .wave:nth-child(4) { animation-delay: 0.3s; }
  .wave:nth-child(5) { animation-delay: 0.4s; }
  .wave:nth-child(6) { animation-delay: 0.5s; }
  .wave:nth-child(7) { animation-delay: 0.6s; }
  .wave:nth-child(8) { animation-delay: 0.7s; }
  .wave:nth-child(9) { animation-delay: 0.8s; }
  .wave:nth-child(10) { animation-delay: 0.9s; }

@keyframes wave {
  0% { transform: scale(0); }
  50% { transform: scale(1); }
  100% { transform: scale(0); }
}
/*#endregion */

/*#region Menu */

#ctl00_MainMenu { margin-left: 12px; cursor: pointer; text-transform: uppercase; }

  #ctl00_MainMenu a { padding: 8px 1vw 8px 1vw !important; color: inherit; background-image: none !important; }

  #ctl00_MainMenu .menu > li:not(:last-child) { border-right: solid 1px white; }

  #ctl00_MainMenu a.highlighted { background-color: #ec1759; color: white; }

  #ctl00_MainMenu a.highlightedImportant { background-color: #ec1759; color: white; }

  #ctl00_MainMenu a.dynamic { padding: 5px 25px 5px 15px !important; }

    #ctl00_MainMenu a.dynamic.selected { background-color: #ec1759; color: white; }

  #ctl00_MainMenu a.static.selected { background-color: #ec1759; color: white; }

  #ctl00_MainMenu .menu { background: none; font-size: 0.95em; font-weight: 400; }

    #ctl00_MainMenu .menu > li > ul.dynamic { border-top: white 1px solid; }

    #ctl00_MainMenu .menu > li > ul > li > ul.dynamic { top: -1px !important; border-top: white 1px solid; }

  #ctl00_MainMenu ul.dynamic { background-color: rgb(210,210,210); -webkit-box-shadow: 0px 2px 3px -2px rgba(0,0,0,0.65); -moz-box-shadow: 0px 2px 3px -2px rgba(0,0,0,0.65); box-shadow: 0px 2px 3px -2px rgba(0,0,0,0.65); z-index: 2 !important; }

    #ctl00_MainMenu ul.dynamic > li:not(:last-child) { border-bottom: solid 1px white; }

#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu #menu-button, #tabs { line-height: 1; background: #f3f3f3; width: auto; margin: 0; padding: 0; border: 0; list-style: none; line-height: 1; display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: 25px !important; }

  #cssmenu > ul > li, #tabs > ul > li { float: left; background: transparent !important; border: none !important; color: inherit !important; font-family: inherit !important; font-size: 0.95em !important; padding: 5px 5px 4px 17px !important; text-transform: uppercase; }

    #cssmenu > ul > li:hover, #cssmenu > ul > li.active, #tabs > ul > li:hover, #tabs > ul > li.tabActiveHeader { color: #ec1759 !important; border-bottom: solid 2px !important; font-weight: bold; }

#tabscontent { border: none !important; margin: 0px; padding: 0px; color: inherit !important; }

/*#endregion */

/*Content*/
#adminedit, #MC_adminedit { padding: 0px 0px; background: #FFFFFF; width: 100%; overflow: hidden; border: none; }
  #adminedit *, #MC_adminedit *, #body * { box-sizing: border-box; }

/*#region Modal Popup */
.modalPopup { position: absolute; /*left: 50% !important;
 top: 50% !important;
 transform: translate(-50%, -50%);*/ min-width: 300px; }

.modalBackground { background-color: #304152; filter: alpha(opacity=60); opacity: 0.6; }

.popupheader { background: #304152; color: #fff; border-color: #adadad; border-style: solid; border-width: 2px 1px 1px; border-radius: 0; padding: 8px 10px; font-size: 1.0em; text-transform: uppercase; }
  .popupheader > span { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 96%; display: inline-block; }
.popupfooter { background: transparent !important; border: none; color: inherit; font-weight: normal; padding: 10px; }

.popupbody { background-color: #ffffff; border-color: #adadad; border-style: solid; border-width: 0px 2px 3px; padding: 5px 10px 10px 10px; }
  .popupbody input[type=text], .popupbody textarea { padding: 1px 5px 2px; }
  .popupbody input[type="submit"], .popupbody input[type="button"] { padding: 3px 10px !important; font-size: 0.90em !important; }
.container .popupbody { padding: 0px; }

.popup { background: white; position: absolute; border: 6px #c3c3c3 outset; display: none; z-index: 1000002; }
  .popup .btnClose { position: absolute; top: 0px; height: 35px; padding: 2px 0 0 2px !important; width: 38px !important; text-align: center; right: 1px; margin: 0; }

.popup_tbl { width: auto; }

.close { right: 7px; background: url(\images/sprite.png) no-repeat 0px -300px; width: 25px; cursor: pointer; position: absolute; top: 10px; height: 15px; }

.modal.UpdateProgress { z-index: 100099 }

.dragHandle { cursor: crosshair; }

/*#endregion */

/*Controls*/
/*#region Divs */

.divExpander { position: absolute; bottom: 0; left: 0; background-color: rgba(240,240,240,0.95); width: 100%; text-align: center; height: 25px; padding-top: 5px; cursor: pointer; }

.divCollapsed { overflow: hidden; }

.divExpandable { -webkit-transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); -moz-transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); -o-transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); overflow: hidden; }

  .divExpandable legend { margin: 0; }

.divWOFlow { position: relative; }

.divCenter { /*height: 72vh;*/ overflow-y: auto; width: 100%; padding: 0.5vw; padding-right: 17px; box-sizing: content-box; }

.divCenterGVFullWidth { height: 72vh; overflow-y: auto; width: 100vw; padding: 0px 15px 10px 0px; }

.divBottom { bottom: 0; position: fixed; background-color: #f3f3f3; background-color: #304152; width: 100%; height: 24px; left: 0; padding: 10px; z-index: 2; }

.divBottomInfo { position: absolute; bottom: 5px; }

.divApprovalActions { position: absolute; bottom: 50px; width: 100%; height: 250px; }
.noMatch {#F48B50; font-size: 18px; text-align: center; margin: 100px; display: none; }
/*#endregion */
/*#region SideBars */
.divSideBarOpen { float: left; margin: 5px 0 0 20px; font-size: 3em; /*z-index: 3;*/ }

.divSideBar { color: #eaeaea; overflow: hidden; top: 0; left: 0; position: fixed; background-color: rgba(48, 65, 82, 0.98); width: 0px; height: 0px; z-index: 2; -webkit-box-shadow: 1px 0px 2px 0px rgba(0,0,0,0.5); box-shadow: 1px 0px 2px 0px rgba(0,0,0,0.5); -webkit-transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); -moz-transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); -o-transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); transition: all 0.5s cubic-bezier(0.10, 0, 0, 1.0); }

  .divSideBar .content { top: 80px; left: 20px; position: absolute; width: 92%; direction: ltr; }

  .divSideBar .title { border-bottom: solid 1px #ec1759; text-align: center; margin: 30px 40px 10px 10px; padding-bottom: 10px; font-size: 1.1em; font-weight: 400; text-transform: uppercase; }

  .divSideBar .row { min-height: 20px; padding: 10px 0px 10px 10px; position: relative; cursor: pointer; }

    .divSideBar .row:not(.open):hover { color: #ffffff; background-color: rgba(255,255,255,0.2); }

  .divSideBar .rowHover { background-color: rgba(255,255,255,0.2); width: 100%; height: 30px; position: absolute; top: 0; left: 0; z-index: 1; }

  .divSideBar input[type="submit"], .divSideBar input[type="button"] { border: 2px #f7f7f7 !important; border-bottom-color: #d1d1d1 !important; border-right-color: #d1d1d1 !important; border-style: outset !important; }

  .divSideBar a { vertical-align: middle; color: #ffffff; opacity: 0.6; }

    .divSideBar a:hover { opacity: 1; font-size: 1.1em; transform: translate(-2px,-2px); }

.divSideBarExpanded { width: 300px; height: 100vh; overflow-y: auto; margin-left: -17px; direction: rtl; }

.divSideBar_expander { width: 25px; height: 25px; cursor: pointer; }

.iconCheck { cursor: pointer; width: 40px; position: fixed; right: 3%; top: 120px; }

.iconRefresh { cursor: pointer; width: 13px; float: right; margin: 2px 1px 0 5px; opacity: 0.5 }

/*#endregion */

/*#region FileUpload */
.fileUpload { }

  .fileUpload .closeimg { width: 18px; cursor: pointer; padding: 0px 3px 0px 3px; position: absolute; top: 1px; right: -23px; }

  .fileUpload .closeimg { top: 15px; }

.uplimg, .small-icon { width: 18px; cursor: pointer; padding: 0px 3px 0px 3px; top: 1px; right: -23px; vertical-align: top !important; }

  .small-icon.closeDiv { width: 13px; padding: 2px 0px; opacity: 0.6; position: absolute; right: 5px; }

.fileUpload .dropArea, .signature .dropArea { width: 100%; text-align: center; font-weight: 800; font-size: 1.1em; color: #717179; text-transform: uppercase; position: relative; margin-top: 10px; }

  .fileUpload .dropArea .active { background-color: #8497AD !important; color: white; }

.fileUpload .dropSection, .signature .dropSection { height: 60px; width: 240px; background-color: rgba(241, 241, 241, 0.3); margin: 5px 0px 5px 5px; border: dotted 2px #b3b3b3; display: inline-block; left: 10px; }

.uploadedFiles { font-size: 0.9em; }

  .uploadedFiles .iconDelete, .divInclPeople .iconDelete { vertical-align: middle; width: 13px; height: 13px; padding: 1px 3px 10px 0; opacity: 0.8; }

    .uploadedFiles .iconDelete:hover, .divInclPeople .iconDelete:hover, .small-icon.closeDiv:hover { opacity: 1; width: 15px; height: 15px; transform: translate(-1px,-1px); }

/*#endregion */

/*#region Dialog */
.ui-dialog { padding: 0px; border: none !important; font-family: Apax, Helvetica, Arial, sans-serif; }

  .ui-dialog .ui-dialog-titlebar { border: solid; border-color: #ec1759 #304152 #ec1759 #304152; border-width: 8px 1px 5px 1px; border-radius: 0; background-color: #304152; color: white; padding: 5px 10px 10px 15px; height: 25px; }

  .ui-dialog .ui-dialog-title { font-weight: 400; font-size: 1.2em; }

  .ui-dialog .ui-dialog-buttonpane { background-color: #304152; }

    .ui-dialog .ui-dialog-buttonpane button:focus { background-color: #ec1759; color: white; border: none; outline-color: white; font-weight: 500; }

  .ui-dialog .ui-dialog-content { padding: 10px 80px 10px 60px; overflow: hidden; }

.ui-icon-alert { -ms-transform: scale(2) translate(-12px, 0px); /* IE 9 */ -webkit-transform: scale(2) translate(-12px, 0px); /* Chrome, Safari, Opera */ transform: scale(2) translate(-12px, 0px); background-image: url(images/Info.svg) !important; background-size: contain; background-position: 0 25px; width: 30px; height: 100px; display: block; }

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #ec1759; background: rgba(236, 23, 89,0.7); color: #ffffff; }

/*#endregion */

.disabledBtn { font-style: italic; color: #b6b6b6 !important; cursor: default !important; pointer-events: none; }

.disableTemp, .disableTemp_Existing { color: #d1d1d1 !important; border-color: #d6d6d6 !important; font-style: italic !important; cursor: default !important; opacity: 0.1 !important; }

input[type=text], select, textarea { font-size: 0.95em; padding: 3px 5px; margin: 1px 2px 1px 1px; border: 1px solid #e8e8e8; }

input[type="submit"], input[type="button"]:not(.inputAutocompleteDropDownUniform) { border: 1px outset #cccccc; cursor: pointer; font-weight: 400; font-size: inherit; background: #304152; color: #FFFFFF; text-align: center; padding: 5px 15px; width: auto; text-transform: uppercase; }
  input[type="submit"]:hover, input[type="button"]:hover { opacity: 0.8; font-weight: 100; }

  input[type="submit"][disabled="disabled"], input[type="button"][disabled="disabled"], input[type="submit"]:disabled, input[type="button"]:disabled { background-color: rgba(48,65,82,0.5); color: #d1d1d1; border-color: #d6d6d6; font-style: italic; cursor: default !important; }

input[type=checkbox] { /* Double-sized Checkboxes */ /*-ms-transform: scale(1.3);*/ /* IE */ /*-moz-transform: scale(1.3);*/ /* FF */ /*-webkit-transform: scale(1.3);*/ /* Safari and Chrome */ /*-o-transform: scale(1.3);*/ /* Opera */ /*height: 12px; vertical-align: middle;*/ }

input[type="radio"] { width: 15px; height: 15px; }

  input[type="radio"] ~ label, input[type="checkbox"] ~ label { margin-right: 10px; margin-left: 2px; font-size: 0.98em; line-height: 10px; vertical-align: text-top; }

/*#region FieldSets */

fieldSet { display: inline-block; padding: 5px 5px 25px; margin: 5px 0.25%; min-width: 240px; position: relative; border: solid #d1d1d1; /*Out-Ligth/In-Dark*/ /*border: solid #304152;/*In-Dark/Out-Ligth*/ border-width: 5px 1px 2px; vertical-align: top;; box-sizing: border-box }

  fieldSet.condensed { }

  fieldset.fullWidth { display: block; padding: 8px 0px 1px 5px; margin: -10px 0px 5px 0px !important; overflow: hidden; border-bottom-width: 10px; min-width: fit-content; width: 100%; }

    fieldset.fullWidth legend { margin-left: 10px; padding-top: 4px; }

.disabled_Expand .disabled_div { display: block; width: 102%; height: 102%; background-color: rgba(255,255,255,0.7); position: absolute; top: 0; left: -5px; z-index: 1; }

.disabled_Expand.fsApproval.PPVBackground .disabled_div { background-color: rgba(0, 95, 110, 0.6) !important; }

fieldSet.active_fieldSet:not(.disabled_Expand) { border-top-color: #ec1759 !important; }

fieldSet.active_fieldSet > legend { /*color: #ec1759 !important;*/ }

fieldset .btnEdit_fieldSet { float: right; margin: 7px !important; }

fieldset.empty { min-height: 0; opacity: 0.35; color: #ffffff; }

fieldset.inner { display: inline-block; border: solid #304152; /*Out-Ligth/In-Dark*/ /*border: solid #d1d1d1;/*In-Dark/Out-Ligth*/ border-width: 0px; border-top-width: 4px; padding: 2px 0 5px; padding-bottom: 5px; min-height: 70px; min-width: 160px; margin: 5px 2px !important; }

fieldset.fsApproval { color: #d1d1d1; padding: 18px 80px 20px; background-color: #304152; border-left: none; border-right: none; border-width: 7px 1px 0px; text-align: center; }

  fieldset.fsApproval a { color: #fd4f85 !important; font-weight: 400; }

  fieldset.fsApproval input[type="submit"], fieldset.fsApproval input[type="button"] { border: 2px #f7f7f7 !important; border-bottom-color: #d1d1d1 !important; border-right-color: #d1d1d1 !important; border-style: outset !important; }

  fieldset.fsApproval legend { color: #d1d1d1; margin: auto; transform: translate(0%,25%); background-color: #304152; font-size: 1.15em; padding: 2px 5px 0px; font-weight: 400; }

  fieldset.fsApproval.active_fieldSet > legend { color: #ffffff !important; }

  fieldset.fsApproval input { min-width: 150px; }

  fieldset.fsApproval .divExpander { background: transparent; }

.disabled_Expand.fsApproval .disabled_div { background-color: rgba(48, 65, 82, 0.6); }

.fsApprovalShadow { -webkit-box-shadow: 0px -3px 7px -2px rgba(0,0,0,0.75); -moz-box-shadow: 0px -3px 7px -2px rgba(0,0,0,0.75); box-shadow: 0px -3px 7px -2px rgba(0,0,0,0.75); }

.fsApprovalGradient { background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 80%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.25)), color-stop(80%, rgba(255, 255, 255, 0))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 80%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 80%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 80%); /* IE10+ */ background: linear-gradient(to top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 80%); /* W3C */ }

fieldset.inner legend { font-size: 1em; color: #a2a2a2; /*Out-Ligth/In-Dark*/ /*color:#304152;/*In-Dark/Out-Ligth*/ margin: 0px 10px; padding: 0 3px; }

legend, .legend { margin: 5px 0 0 0; padding: 1px 4px 0px; font-weight: bold; text-transform: uppercase; font-size: 0.98em; color: #304152; /*Out-Ligth/In-Dark*/ /*color: #a2a2a2;/*In-Dark/Out-Ligth*/ }
  legend a { font-weight: 500; }

.legendInfo { font-size: 0.9em; text-transform: none; font-weight: 200; }
.popup_fieldset, .popupbody fieldset { padding: 3px 3px 5px 3px; margin: 0px 2px; min-height: 50px; }
  .popup_fieldset legend, .popupbody fieldset legend { font-size: 0.92em; }

/*#endregion */

.row { clear: both; }

.tooltip { cursor: help; }

    .tooltip .trigger { /*text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-color: #ec1759; border-bottom: 1px dotted #ec1759;*/
    }
  .tooltip:not(.custom) .trigger::after { content: "\00A0"; background-image: url(../images/interrogation_grey.svg) !important; width: 12px; height: 12px; display: inline-block; margin: 0px 0px 2px 3px; vertical-align: middle; opacity: 0.7 }

.tooltipVisible { display: inline-block !important; text-align: left !important; }

#MC_ACE_Program_completionListElem { /*border:5px solid yellow!important;*/ padding: 2px 5px 2px 5px !important; position: fixed !important; max-height: 500px; overflow-y: auto; }

  #MC_ACE_Program_completionListElem li { /*background-color:red!important;*/ }

.tooltip .content { width: 350px; background-color: #f3f3f3; font-weight: 300; padding: 10px 10px 10px 20px; border: dotted 1px #ec1759; border-radius: 8px 8px 8px 0; text-transform: none; position: fixed; display: none; overflow: hidden; text-indent: -13px; transform: translate(0,-100%); -webkit-box-shadow: -1px 1px 2px 0px rgba(0,0,0,0.3); box-shadow: -1px 1px 2px 0px rgba(0,0,0,0.3); z-index: 1000; }

.tooltip.auto .content { transform: translate(-5px,-2px); }

.tooltip-Approvers, .tooltip-ApproversPrevious { font-size: 1.1em; background-color: #ffffff; display: none; width: 500px; text-align: left; padding: 20px 30px; border: solid #d1d1d1 10px; -webkit-box-shadow: 5px 5px 200px 30px rgba(0,0,0,0.75); -moz-box-shadow: 5px 5px 200px 30px rgba(0,0,0,0.75); box-shadow: 5px 5px 170px 20px rgba(0,0,0,0.75); z-index: 11; }

  .tooltip-Approvers li, .tooltip-ApproversPrevious li { margin: 10px 0; }

/*#region Appoval Steps */

.divStatus { margin: 0px 25px 0px 7px; /*height: 8vh;*/ transform: translate(0%, 0%); position: absolute; left: 4%; top: 10px; }

.divWOFlow { display: block; height: 60px; border-bottom: 1px #d1d1d1 solid; margin: 0 20px; }

.divApproved, .divCancelled { width: 100px; text-align: center; position: absolute; top: -2px; right: -150px; padding: 0 20px; }

.status { position: relative; margin: 0; }

.status { }
  /*Starter*/
  .status .starter { background: #304152 !important; }

  .status li.Pre { border: none !important; margin: 0; width: 0.2em !important; height: 0.7em !important; border-radius: 0.6em; background: none; border: none !important; }

    .status li.Pre::before { background: transparent !important; }

  /*step dot & width*/
  .status li { width: 1.3em; height: 1.3em; text-align: center; line-height: 1em; vertical-align: middle; margin: 0 0 0 4vw; display: inline-block; position: relative; border-radius: 1em; background: #f8c7d6; }
    /*step dot & width | Active*/
    .status li.active { background: #ec1759 !important; margin: 0 0 0 15vw; border: 2px solid #ec1759; }

    /*step line before */
    .status li::before { content: ''; /*content: attr(data-status);*/ position: absolute; top: .6em; left: -4.2vw; width: 4.4vw; height: .1em; z-index: -1; color: #d2d2d2; background: #304152; font-size: 0.86em; }
    /*step line before | Active */
    .status li.active::before { /*content: attr(data-status);*/ top: 0.6em; height: 0.3em; left: -15.4vw; width: 15.4vw; }

    /*step label*/
    .status li .spanBefore { position: absolute; box-sizing: border-box; top: .6em; left: -4.4vw; width: 4.4vw; height: .1em; padding: 5px 0.5vw; height: 15px; z-index: -1; color: #d1d1d1; font-size: 0.85em; }
    /*step label | Active*/
    .status li.active .spanBefore { font-weight: bold; color: #304152; left: -15.4vw; width: 15.4vw; font-size: 1.1em; /*text-transform: uppercase;*/ }

    /*Approved*/
    .status li.stepApp { /*display: none;*/ margin: 0 0 0 10vw !important; }
      /*Approved Label*/
      .status li.stepApp .spanBefore { left: -10.4vw !important; /*width: 120px !important;*/ width: 10.4vw !important; color: #ec1759 !important; top: -8px !important; text-transform: uppercase; font-size: 1.1em; font-weight: bold; }
      /*Approved Label | No line*/
      .status li.stepApp::before { left: -10.4vw !important; width: 10.4vw !important; }

    /*Steps grayed out*/
    .status li.active ~ li:not(.Pre), .status li.activeDummy ~ li, .status li.deactivated { background: #ffffff !important; border: solid 2px #d2d2d2 !important; width: 0.9em; height: 0.9em; }

      .status li.active ~ li:not(.Pre)::before, .status li.activeDummy ~ li::before, .status li.deactivated::before { background: transparent !important; border: #d1d1d1; border-style: dashed; height: 0; top: 0.4em; border-width: 1px 0 0 0; }

    .status li.active.partiallyBilled::before { content: attr(data-status) 'Partially Billed'; }

    .status li.active.completelyBilled::before { content: attr(data-status) 'Completely Billed'; }

/*#endregion */

/*To remove button from IE11, thank you Matt */
select::-ms-expand { display: none; }

select, .fakeSelect { border-radius: 1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; }

select, .fakeSelect { background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to top, #fff 0%, #eef5fd 50%, #fff 100%); background-position: calc(100% - 8px) calc(0.8em + 0px), calc(100% - 4px) calc(0.8em + 0px), calc(100% - 1.6em) 0em; background-size: 4px 3px, 4px 3px, 1px 1.9em; background-repeat: no-repeat; padding-right: 20px; }

  select:focus, .fakeSelect:focus { background-image: linear-gradient(45deg, gray 50%, gray 50%), linear-gradient(135deg, gray 50%, gray 50%), linear-gradient(to top, #fff 0%, #eef5fd 50%, #fff 100%); background-position: calc(100% - 7px) 0.9em, calc(100% - 5px) 0.9em, calc(100% - 1.6em) 0em; background-size: 4px 1px, 4px 1px, 1px 1.9em; background-repeat: no-repeat; }

  select:disabled, .fakeSelect:disabled { background-image: linear-gradient(45deg, #d1d1d1 50%, #d1d1d1 50%), linear-gradient(135deg, #d1d1d1 50%, #d1d1d1 50%), linear-gradient(to top, #fff 0%, #eef5fd 50%, #fff 100%); background-position: calc(100% - 7px) 0.9em, calc(100% - 5px) 0.9em, calc(100% - 1.6em) 0em; background-size: 4px 1px, 4px 1px, 1px 1.9em; }

.inputDropDown { cursor: pointer; text-align: left; }

  .inputDropDown:disabled { background-color: #ececec; border-color: #ececec; cursor: default; }

.inputAutocompleteDropDownUniform { background-image: none; position: absolute; right: 1px; top: 2px; -webkit-appearance: menulist; background-color: transparent !important; border: none; cursor: pointer; padding: 2px 6px 3px; }

.inputButtonSmall, .inputButtonSmallDisabled { font-size: 0.8em !important; line-height: 0.9em !important; margin: 0px 2px !important; /*padding: 4px 10px 4px!important;*/ text-transform: none !important; }

.inputButtonSmallDisabled { opacity: 0.5; }


.inputTextBox { }

.inputTextBoxSmall, .inputDropDownSmall { font-size: 0.95em !important; padding: 2px 2px !important; margin: 1px !important; }

.inputDropDown.required, .inputTextBox.required, .requiredTbx.empty { background-color: hsla(213, 36%, 90%, 1); border: rgba(48,65,82,0.1) 1px solid; }

  .inputTextBox.required:disabled, .inputTextBox.required:disabled + #MC_Span_ProgramBtn > .inputAutocompleteDropDownUniform, .inputDropDown.required:disabled { background-color: hsla(213, 36%, 95%, 1); border: hsla(213, 36%, 95%, 1) 1px solid; color: #797979; cursor: default; }

.inputCheckBoxList.required { background-color: hsla(213, 36%, 90%, 1); border: rgba(48,65,82,0.3) 1px solid; padding: 3px 3px; margin: 1px 3px; }

.inputCheckBoxSpan { margin: 0 2px; padding: 2px 0; }

/*DISABLED STYLE FOR EDIT/DISPLAY CONTROLS*/
.disabled_tbx { border: none !important; background-color: transparent !important; font-size: inherit; font-weight: inherit; color: inherit; padding: 0 !important; margin: 0 !important; }

.disabled_ddl { border: none !important; background-color: transparent !important; background-image: none !important; font-size: inherit; font-weight: inherit; -webkit-appearance: none; color: inherit; padding: 0 !important; margin-bottom: 0px; margin-top: 0px; }

  .disabled_ddl:disabled { color: inherit; }

  .disabled_ddl[disabled='disabled']::-ms-value { color: #000; }

.disabled_ddl_BG { border-left: solid 1px #dadada; padding: 0em 0.1em 0em 0.4em !important; margin-left: 1px !important; width: 37px !important; background: none !important; }

.disabled_Icon { opacity: 0.3; cursor: default !important; pointer-events: none; }


table { border-collapse: collapse; }


.infoTable > tbody > tr > td:first-child { text-align: right; padding-left: 5px; padding-right: 5px; font-weight: 400; width: 100px; }

.infoTable > tbody > tr > td:nth-child(2) { text-align: left; padding-left: 5px; padding-right: 5px; border-left: 1px solid #dadada; }

/*.infoTable tr td:nth-child(2) {
 width:75%;
}*/

.infoTable.clear tr td { text-align: inherit !important; font-weight: inherit !important; padding-right: 2px !important; width: auto !important; }

.gvClone { background-color: black; padding: 0 !important; }
.btnExcelExport.default { width: 25px; cursor: pointer; margin: 0px -2px -4px -2px; vertical-align: text-bottom; display: none; }
/*#region Gridviews */
.gridView { margin: 0 2px 2px 2px; font-size: 0.95em; box-sizing: border-box; }

  .gridView.fullWidth { margin: 0px; width: 99.5vw; }

    .gridView.fullWidth td:nth-child(1), .gridView.fullWidth th:nth-child(1) { border-left: none !important; }

    .gridView.fullWidth td:last-child, .gridView.fullWidth th:last-child { border-right: none !important; }

.gridViewDividor { position: absolute; top: 49px; width: 99.5vw; height: 3px; background-color: #d1d1d1; }

.gridView td, .gridView th, .gridView .header, .gridView .td, .trHead span { border-left: 1px solid #ffffff !important; border-right: 1px solid #ffffff !important; border-top: 1px solid #efefef; border-bottom: 1px solid #efefef; vertical-align: middle; box-sizing: border-box; }
/*divOK*/

.gridView th, .gridView .header, .trHead span { padding: 5px 4px !important; background-color: #d1d1d1; color: #575756 !important; vertical-align: middle; /*text-transform: capitalize;*/ font-weight: 400; }
/*divOK*/
.gridView td.colHighlighted, .gridView .td.colHighlighted { background-color: rgba(153, 153, 153, 0.2); font-weight: 400; }

.gridView .small-header { line-height: 5px; }

  .gridView .small-header th { padding: 0px !important; }

.gridView th.colHighlighted, .gridView th.colHighlighted a, .gridView .th.colHighlighted, .gridView .th.colHighlighted a { background-color: #304152; color: white !important; font-weight: bold; }
.gridView.noBorder td { border: transparent; }

.gridView th.iconHeader { color: transparent !important; }

.gridView .tdTrim { position: relative; }

  .gridView .tdTrim .iconMagnifier { position: absolute; width: 10px; right: 0; bottom: 0; }

  .gridView .tdTrim .ellipsis { display: none; margin-left: 1px; font-size: 0.9em; }

.gridView .tdTrimDisplay { max-height: 11px; width: 83%; display: inline-block; word-break: break-all; overflow: hidden; text-align: justify; }

.gridView .footer { background-color: #d1d1d1 !important; color: #575756 !important; font-weight: 700; }

.gridView .numeric, .numeric td { text-align: right; padding-right: 4px !important; }

.gridView .number, .number td, .gridView .mid, .gridView .center { text-align: center; }

.gridView th a { color: #575756; text-decoration: none; }

.gridView tr:nth-child(odd), .gridView tr.odd, .gridView .tr:nth-child(odd), .gridView .tr.odd { background: #f3f3f3; }
  .gridView tr:nth-child(odd) .sorted, .gridView tr.odd .sorted, .gridView .tr:nth-child(odd) .sorted, .gridView .tr.odd .sorted { background: #e6e6e6; }

/*divOK*/
.gridView tr.even, .gridView .tr.even { background: transparent; }
  .gridView tr.even .sorted, .gridView .tr.even .sorted { background: #f7f7f7; }
/*divOK*/
.gridView tr.hidden, .gridView .tr.hidden { line-height: 0; }
/*divOK*/

.gridView td, .gridView .td { padding: 3px 4px; text-overflow: ellipsis; overflow: hidden; box-sizing: border-box; }
  .gridView td[onclick], .gridView td[onclick] u { color: #ec1759; text-decoration: none; cursor: pointer; }
    .gridView td[onclick].contrast_dark, .gridView td[onclick].contrast_dark u { color: #fcd5e1 !important; }
    .gridView td[onclick].contrast_light, .gridView td[onclick].contrast_light u { color: #ec1759 !important; }
      .gridView td[onclick]:hover, .gridView a:hover { text-shadow: 0px 0px 1px #ec1759; font-weight: inherit !important; } }
/*divOK*/

.gridView.expanded td, .gridView.expanded th { padding-left: 12px !important; padding-right: 12px !important; }

.gridView.condensed td, .gridView.condensed th { padding-left: 2px !important; padding-right: 2px !important; font-size: 0.95em; }

.gridView .totalRow { background-color: transparent !important; }

  .gridView .totalRow td { border-top: solid 1px transparent; padding: 1px 0 1px; }

.gridView .totalCol { background-color: #f3f3f3 !important; text-align: center; border-top: solid 2px #d4d4d4 !important; font-weight: 400; font-size: 0.95em; }
.gridView .rotate_th { height: 140px !important; line-height: 14px; padding-bottom: 20px !important; padding-left: 0px !important; vertical-align: middle }

.tblInfo { color: transparent; font-size: 0.8em; top: 2px; position: relative; margin-left: -11px; }

  .tblInfo td.display { color: #05b4d0; display: table-cell !important; }

  .tblInfo .toggle { color: #05b4d0; background-color: rgba(5, 180, 208, 0.1); cursor: pointer; }

  .tblInfo td { padding: 2px 8px 0px 8px; border-left: solid 1px; vertical-align: top; }

    .tblInfo td:not(.toggle) { display: none; }

.alignCenter { text-align: center; }
table td[onclick]{cursor:pointer;}
table td[onclick]:hover { font-weight:800; }
/*#endregion */
/*#region Pager */
#tblPager { font-size: 8pt; }

  #tblPager td { }

  #tblPager a { padding: 2px 4px; border: solid 2px; border-color: transparent; }

    #tblPager a:not(.activePager) { color: inherit; }

      #tblPager a:not(.activePager):hover { background-color: #ececec; border-color: #ececec; padding: 2px 6px; }

  #tblPager td .activePager { text-decoration: none; background-color: #ececec; border-color: #ececec; font-weight: 400; }

/*#endregion */

/*#region BY PAGE */

/*#region LOGIN */
.login { font-size: 1.2em; text-transform: uppercase; }
  .login td { text-align: center; height: 40px; vertical-align: bottom; }
  .login input[type="text"], .login input[type="password"] { padding: 10px; background-color: #d1d1d1 !important; border: none; width: 200px; }

  .login .labelDetails { font-size: 0.8em; padding-bottom: 15px; }

/*#endregion */

/*#region PASSWORD */

.changePswd { margin-left: -50px; text-transform: uppercase; font-size: 1.2em; }

  .changePswd td { text-align: right; vertical-align: top; padding: 15px 5px 0 0; }

  .changePswd input[type="text"], .changePswd input[type="password"] { padding: 10px; background-color: #d1d1d1 !important; border: none; width: 100px; margin-top: -10px; }

  .changePswd input[type="submit"] { float: left; }

  .changePswd .labelDetails { font-size: 0.8em; padding-bottom: 15px; text-transform: none; color: #ec1759; }

/*#endregion */

/*#endregion */

.ddl { width: 100%; display: block; position: absolute; }
  .ddl option:first-child { font-weight: bold; font-style: italic; }
  .ddl:disabled { background-color: #ececec; border-color: #ececec; }
.ddlSpan { display: inline-block; position: relative; width: 19.4%; height: 23px; }
  .ddlSpan.dates { width: 100%; }
.divCollapseTrigger { border-top: 2px solid #ec1759; }
.imgCollapse { width: 15px; float: right; margin: 2px 0; padding: 0; cursor: pointer; }

.overlayDDL, .overlayTBXSuggest { width: 100%; height: 100%; position: absolute; z-index: 100001; background-color: rgba(255,0,0,0); }

.spanRBTScope { display: inline-block; margin: 3px 20px 3px 5px; height: 18px; vertical-align: middle; }

.spanBuyClass { background: #ececec; width: 78%; height: 23px; margin: 0 0 0 3px; display: inline-block; }

.tbx { min-width: 100px; padding: 3px; text-align: center; border: 1px solid #d3d3d3; position: absolute; }

  .tbx:disabled { background-color: #ececec; opacity: 0.7 }

/*IOM*/
.inlineSpan { display: inline-block; }

.inlineTD4Lt { vertical-align: top; padding: 0px 10px; border: solid #dadada; border-width: 0 1px; line-height: 1.7em; text-align: center; }

.btnAddItem { position: absolute; top: -12px; right: 0; border: white outset !important; border-width: 1px 1px 0px 5px !important; }

/*#endregion */


#MC_GVWrapper .gridView th:first-child, #MC_GVWrapper .gridView td:first-child { max-width: 125px !important; width: 125px !important; }

#MC_GVWrapper .gridView th:nth-child(2), #MC_GVWrapper .gridView td:nth-child(2) { max-width: 125px !important; width: 125px !important; }

.GridCellDiv { width: 95% !important; }

.GridviewScrollHeader TH, .GridviewScrollHeader TD { }

#title h1 a:link, #title h1 a:visited { color: #FFFFFF; text-decoration: none; }


#title h1 { display: inline; color: #FFFFFF; font-size: 14px; font-weight: bold; }

#project { margin: auto; width: 50%; }

.spinner { width: 80px; height: 80px; border: 3px solid #f3f3f3; border-top: 3px solid #ec1759; border-radius: 100%; position: absolute; top: 350px; bottom: 0; left: 0; right: 0; margin: auto; animation: spin 1s infinite linear; }

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.overlayPage { height: 100%; width: 100%; background: rgb(48, 65, 82); position: fixed; left: 0; top: 0; z-index: 100001; opacity: 0.95; }
  .overlayPage .message { color: white; top: 60%; left: 50%; position: fixed; transform: translate(-50%, -50%); text-align: center; font-size: 1.4em; margin-top: 60px; }

.overlay-logo { text-align: center; height: 100px; /*background-image: url(/images/Logo-IOM-White-NoBG.svg);*/ background-repeat: no-repeat; position: absolute; top: 35%; left: 0; right: 0; margin: auto; font-size: 1.5em; }

  .overlay-logo img { margin: 0 6px; height: 40px; }

  .overlay-logo .spin { animation: spin 1s infinite linear; }

.overlayPopup { height: 100%; width: 100%; background-color: #304152; filter: alpha(opacity=60); opacity: 0.6; position: fixed; left: 0; top: 0; z-index: 100001; display: none; }

.loader { width: 100%; height: 100%; border: 8px solid #f3f3f3; border-radius: 50%; border-top: 8px solid #3498db; width: 25px; height: 25px; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; position: fixed; }



/*.loading { font-family: Arial; font-size: 10pt; border: 5px solid #67CFF5; width: 200px; height: 100px; display: none; position: fixed; background-color: White; z-index: 999; }*/
.GridViewEditRow input[type=text] { width: 30px; }
/* size textboxes */
.GridViewEditRow select { width: 30px; }
/* size drop down lists */

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }

  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }

  100% { transform: rotate(360deg); }
}
/*}*/

/*******************/
/*1871*/