/* RSP CSS file to override Power Pages default CSS */

/* 1.0 */
/* ********* GLOBAL VARIABLES ********* */
:root {
  --fontFamilyNotoSans: "Noto Sans", sans-serif;
  --fontFamilyLato: Lato, sans-serif;
  --fontSizeH1: 38px;
  --fontSizeH2: 36px;
  --fontSizeH3: 24px;
  --fontSizeH4: 22px;
  --fontSizeH5: 20px;
  --fontSizeH6: 19px;
  --fontSizeBody: 20px;
  --fontWeightBold: bold;
  --fontWeightNormal: normal;
  --formControlBorderRadius: 4px;
  --formControlBackground: white;
  --formControlMinHeight: 37px;
  --formControlSpanBackground: #eaebed;
  --formControlSectionBackground: #fafafa;
  --formControlReadOnlyBackground: #fafafa;
  --mainContentWidth: 60%;
}


/* ********* FONTS ********* *//* 2.0 */

h1 {
  font-family: var(--fontFamilyLato) !important;
  font-size: var(--fontSizeH1) !important;
  font-weight: var(--fontWeightBold) !important;
  border-bottom: 0px !important;
  margin-bottom: 0.2em !important;
  margin-top: 1em !important;
  padding-bottom: 0.2em !important;
  font-size: 38px !important;
}

h1::after {
  content: "" !important;
  display: block !important;
  width: 70px !important;
  padding-bottom: 8px !important;
  border-bottom: 0.18em solid #af3c43 !important;
}

h2 {
  font-family: var(--fontFamilyLato) !important;
  font-size: var(--fontSizeH2) !important;
  font-weight: var(--fontWeightBold) !important;
}

h3 {
  font-family: var(--fontFamilyLato) !important;
  font-size: var(--fontSizeH3) !important;
  font-weight: var(--fontWeightBold) !important;
}

h4 {
  font-family: var(--fontFamilyLato) !important;
  font-size: var(--fontSizeH4) !important;
  font-weight: var(--fontWeightBold) !important;
}

h5 {
  font-family: var(--fontFamilyLato) !important;
  font-size: var(--fontSizeH5) !important;
  font-weight: var(--fontWeightBold) !important;
}

h6 {
  font-family: var(--fontFamilyLato) !important;
  font-size: var(--fontSizeH6) !important;
  font-weight: var(--fontWeightNormal) !important;
}

/* ********* MSFT COMPONENTS ********* *//* 3.0 */
.private-mode-banner, 
html > grammarly-desktop-integration {
  display: none !important;
}

.page-copy > .xrm-editable-html.xrm-attribute > .xrm-attribute-value {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}

/* ********* GRID TEMPLATE ********* *//* 4.0 */
header {grid-area: header;}
.page-title {grid-area: title;}
.notifications {
    grid-area: notification;
    margin-top: 0 !important;
    margin-top: 0 !important;
}

.logged-in {
    grid-area: logged-in;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.maintenance-banner {
    grid-area: banner;
    margin-top: 10px;
    margin-bottom: 10px;
}

.wrapper-body, #liquid_form, .xrm-attribute-value {grid-area: main;}
.pre-footer {grid-area: pre-footer;}
footer {grid-area: footer;}

.rsp-container {
  display: grid;
  grid-template-rows: auto auto auto auto min-content 2fr auto auto;
  grid-template-columns: 1fr var(--mainContentWidth) 1fr;
  grid-template-areas:
    "header     header       header"
    ".          logged-in    ."
    ".          title        ."
    ".          banner       ."
    ".          notification ."
    ".          main         ."
    ".          pre-footer   ."
    "footer     footer       footer";
  grid-gap: 5px;
  padding: 0px;
}

.container {
  width: var(--mainContentWidth) !important;
  padding: unset !important;
}

@media (max-width: 1024px) {
  .rsp-container {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto auto 1fr auto auto;
    grid-template-areas:
      "header"
      "logged-in"
      "title"
      "banner"
      "notification"
      "main"
      "pre-footer"
      "footer";
  }
  .container {
    width: 100% !important;
    padding: unset !important;
  }
}

/* ********* FORM SUB-GRID TEMPLATE ********* */
/* BUG 113315 */
.xrm-attribute-value {grid-area: main;}
.notifications {grid-area: notification;}
.page-copy {
    display: grid;
    grid-template-areas:
        "notification"
        "main";
}

/* ********* HTML & BODY ********* *//* 5.0 */
html,
body,
body[data-sitemap-state*="/"] {
  font-family: var(--fontFamilyNotoSans) !important;
  font-size: var(--fontSizeBody) !important;
  font-weight: var(--fontWeightNormal) !important;
  margin: 0;
  display: grid;
} /* source: https://francomusso.com/custom-css-per-page-or-per-section-using-data-attributes */


/* ********* PAGE HEADER ********* *//* 6.0 */
.page-heading,
.page-header {
  border-bottom: 0 !important;
}

/* ********* FORMS ********* *//* 7.0 */
/* BASIC FORMS *//* 7.1 */
.formColumnBlockLayout {grid-area: form;}
.helpColumnBlockLayout {grid-area: help;}

.rsp-form-container {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 4fr 2fr;
    grid-template-areas:
        "form   help";
    grid-gap: 10px;
    padding: 0px;
}

@media (max-width: 1024px) {
  .rsp-form-container {
    grid-template-columns: 1fr;
    grid-template-rows: auto 4fr;
    grid-template-areas:
      "help"
      "form";
  }
}

/* MULTISTEP FORMS *//* 7.2 */
.progressBar {grid-area: bar; margin-bottom: 40px;}
.webFormColumnBlockLayout {grid-area: form;}
.helpColumnBlockLayout {grid-area: help;}
.message {grid-area: message;}

.rsp-webform-container {
    display: grid;
    grid-template-rows: 1fr auto auto;
    grid-template-columns: minmax(750px, auto) minmax(300px, auto);
    grid-template-areas:
        "bar    bar"
        "message message"
        "form   help";
    grid-gap: 10px;
    padding: 0px;
}

@media (max-width: 1024px) {
  .rsp-webform-container {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto 4fr;
    grid-template-areas:
      "bar"
      "message"
      "help"
      "form";
  }
}


html[dir="ltr"] .crmEntityFormView .cell.checkbox-cell:first-child {
  padding-top: 0px !important;
  padding-right: 28px !important;
  padding-bottom: 20px;
  padding-left: 28px !important;
}

html[dir="ltr"] .crmEntityFormView .cell .textarea#name,
html[dir="ltr"] .crmEntityFormView .cell .textarea[readonly]#name {
  width: 100% !important;
  height: 70px !important;
  resize: none !important;
}

/* Form Text Area ReadOnly */
html[dir="ltr"] .crmEntityFormView .cell .textarea[readonly]#name {
  font-size: var(--fontSizeBody) !important;
  background: var(--formControlReadOnlyBackground) !important;
}

/* ********* HYPERLINKS ********* *//* 8.0 */
#mainContent a:not(.btn),
.breadcrumb a:not(.btn) {
  color: #284162 !important;
  font-size: inherit !important;
  text-decoration: underline !important;
}

#mainContent a:visited:not(.btn),
.breadcrumb a:visited:not(.btn) {
  color: #7834bc !important;
}

/* ********* PRE-FOOTER ********* *//* 9.0 */
.pagedetails {
    padding-bottom: 0 !important;
}

/* ********* FOOTER ********* *//* 10.0 */



/* ********* OTHERS ********* *//* 11.0 */

/* This may affect accessiblility. It removes the focus around the success message 
   when the form hidden. BUG
*/
#MessageLabel:focus, .checkbox input:focus {
  outline: none;
}

.d-flex {
    justify-content: space-between;
    flex-wrap: nowrap;
}

.d-flex > a {
    width: 100%;
}

/* Remove the extra info icon from the validation history fontawesome*/
.fa-info-circle:before {
  content: unset !important;
}

/*  Convert all fonts to WET default, besides icons     */
*:not(.glyphicon, .fa, code, pre),
footer {
  font-family: var(--fontFamilyNotoSans) !important;
}

/*  Revert MSFT's font rules for paragraphs back to WET's   */
p {
  margin-top: 16px !important;
  margin-bottom:16px important;
  color: #333 !important;
}

/* Remove side padding */
.col-md-3.columnBlockLayout {
  padding-right: 0 !important;
}

.col-md-9.columnBlockLayout {
  padding-left: 0 !important;
}

.row.sectionBlockLayout {
  padding: 0 !important;
  margin: 0 !important;
}

/*  Remove odd extra margin that MSFT applies to listed links */
html[dir="ltr"] li a {
  margin-left: 0 !important;
}

/* Revert MSFT's form input borders to match WET's */
input.form-control {
  border: 1px solid #ccc;
}

#wb-sm {
  min-height: auto !important;
}

/* ******************* Multistep Form Progress Bar ***************** */
/* Ensure the list group is a flex container */
ol.progress.list-group.top {
  display: flex;
  justify-content: space-between; /* Even spacing between items */
  align-items: stretch !important; /* Align items vertically */
  padding: 0;
  margin: 0;
  list-style: none;
  border-radius: 5px;
  background-color: unset !important;
  box-shadow: none;
  gap: 5px; /* Optional: Add space between steps */
}

/* Make each list item take equal space */
.list-group-item {
  flex: 1; /* Equal width for each step */
  display: flex !important;
  flex-direction: column;
  justify-content: space-between !important;
  align-items: center;
  text-align: center;
  padding: 15px;
  background-color: #f5f5f5;
  border: 1px solid #ddd;
  /*  border-radius: 5px; */
  min-height: 120px; /* Ensure all list items have the same minimum height */
  box-sizing: border-box; /* Ensure padding is included in the height */
}

/* Style for the chevron arrows */
.chevron {
  flex: 0; /* Do not expand */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 10px;
}
/* Ensure consistent height for success and active items */
.list-group-item-success,
.list-group-item.active,
.list-group-item.incomplete {
  min-height: 120px; /* Same height for all states */
}

/* Active and success styles */
.list-group-item.active {
  background-color: #2572b4 !important;
  border-color: #2572b4 !important;
}

.list-group-item.active .progress-step > p {
  color: #fff !important;
}

.list-group-item-success {
  background-color: #28a745;
  color: white;
  border-color: #28a745;
}

.list-group-item.incomplete {
  background-color: #f5f5f5 !important;
  color: #333;
  border-color: #f5f5f5 !important;
}

.list-group-item.incomplete .progress-step > p {
  color: #696969 !important;
}

/* Optional: Add margin between list group items and arrows */
ol.progress.list-group.top .glyphicon-chevron-right {
  font-size: 24px;
  color: #696969;
  display: flex;
  align-items: center;
}

.list-group-item.active + .glyphicon-chevron-right {
  color: #2572b4 !important;
}

.list-group-item-success + .glyphicon-chevron-right {
  color: #28a745 !important;
}

main .glyphicon {
  top: 1px !important;
}

html[dir="ltr"] ol.progress li span.glyphicon.glyphicon-ok {
  padding-left: 0px !important;
}
/* END ******************* Multistep Form Progress Bar ***************** */

/* Menu Links */
ul.list-inline.menu {
  padding-left: 15px !important;
}

#wb-sm .menu {
  display: flex !important;
}

#wb-sm .menu > li {
  border-left: unset !important;
  border-right: unset !important;
}

/* Input fields */
input[type="email" i] {
  width: 100% !important;
}

input[type="url" i] {
  width: 100% !important;
}

/* Support Request */
.question {
  text-align: center;
  margin-bottom: 20px;
  font-family: var(--fontFamilyNotoSans);
  font-size: 20px;
  border: 0 solid #ccc;
  background-color: rgba(240, 240, 240, 0.5);
  padding: 12px;
}
.options {
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: -10px;
}
.options button {
  margin: 5px;
  padding: 8px 12px;
  border: none;
  background-color: #0e51cb;
  color: white;
  cursor: pointer;
  font-family: var(--fontFamilyNotoSans);
  font-size: 14px;
}
.options button:hover {
  background-color: #0056b3;
}
.options select {
  padding: 8px;
  font-family: var(--fontFamilyNotoSans);
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 0px;
  background-color: #fff;
  color: #333;
}
.options select option {
  background-color: #fff;
  color: #333;
}
.options select:hover {
  border-color: #0e51cb;
}

.options .pressed {
  background-color: #6c8e3e;
}
#divLoading p {
  margin-top: 15px;
  font-family: var(--fontFamilyNotoSans);
  font-size: 18px;
}

/* Add styles to descriptions on forms */
.description {
  color: #333;
  font-size: small;
  line-height: normal;
}

.crmEntityFormView .description.above {
  margin-bottom: 10px;
}


.breadcrumb {
  font-size: 16px !important;
}

/* Remove RTE font-family and font-size. Credit: Frank Musso */
div[data-wrapper="true"] {
  font-family: unset !important;
  font-size: unset !important;
}

div[data-wrapper="true"].ck-content {
  font-family: unset !important;
  font-size: unset !important;
}

/* Remove the vertical alignment of radio buttons */
.crmEntityFormView .cell .picklist input[type="radio"] {
  vertical-align: unset !important;
  transform: scale(1.5);
}

.crmEntityFormView .cell.boolean-radio-cell input[type="radio"] {
  vertical-align: unset !important;
  transform: scale(1.5);
}

.crmEntityFormView .cell div.control span.checkbox {
  margin: unset !important;
}

.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"],
input#rsp_privacy_aggreement[type="checkbox"] {
  transform: scale(1.5);
}

input#rsp_privacy_aggreement[type="checkbox"] {
  margin-right: 4px;
}

.fa-warning:before,
.fa-exclamation-triangle:before {
  content: unset !important;
}

#registration-hub {
  .wb-eqht {
    section {
      border: 1px solid #ddd;
      border-radius: 4px;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
      box-sizing: border-box;
      display: inline-block;
      margin-bottom: 15px;
      padding: 15px;
      width: 100%;
    }
  }
}

/* Forms */
.crmEntityFormView .section-title {
  border-bottom-width: 0;
  margin-bottom: 5px;
  padding: 20px;
  padding-top: 0px !important;
  padding-right: 20px !important;
  padding-bottom: 20px !important;
  padding-left: 20px !important;
}

.crmEntityFormView fieldset {
  border-radius: 2px;
  border: 1px solid #ddd;
  background: #fafafa;
}

fieldset:first-child {
  margin-top: 20px;
  border-top: 1px solid #ddd !important;
}

fieldset > table.section:first-child {
  margin-top: 20px !important;
}

.panel-body.form {
  padding: 0 !important;
}

.disabled-link {
  color: #ccc;
  pointer-events: none;
  cursor: default;
}

.container .fa {
  line-height: 1;
}

/* Modify opacity behind WET-BOEW modal */
.mfp-bg {
  opacity: 0.6 !important;
}

/* Modify required label before and after text */
.crmEntityFormView .cell div.info.required label::before,
.section-title-required::before {
  content: "*" !important;
  color: #d3080c !important;
  margin-right: 8px !important;
}

/* Update active breadcrumb */
.breadcrumb > .active {
  font-weight: unset !important;
  color: #000 !important;
}

/* Highlight required field if error */
.has-error .form-control {
  border-color: #d3080c !important;
}

/* Re-center pagination text, from bootstrap */
.pagination > li > a,
.pagination > li > span {
  padding: 6px 12px !important;
  min-width: 50px !important;
}

/* BEGIN: Fix pagination buttons being too rounded*/
.pagination > .active > a,
.pagination > .active > a:hover,
.pagination > .active > a:focus,
.pagination > .active > span,
.pagination > .active > span:hover,
.pagination > .active > span:focus {
  border-radius: 0;
}

/* TODO: Doesn't apply on hover, etc */
.pagination > li:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

/* TODO: Doesn't apply - there's a disabled "last-child" for the hidden "Next" button */
.pagination > li:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
/* END: border rounding issue */

/* Fix hover-over for "Next"/"Prev" buttons being white instead of grey like the others */
.pagination > li:first-child > a:hover,
.pagination > li:first-child > span:hover,
.pagination > li:last-child > a:hover,
.pagination > li:last-child > span:hover {
  background: initial !important;
  background-color: #d4d6da !important;
}

/* Fix - use WET's blue shade for active pagination instead of MSFT's */
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
  background-color: #2572b4 !important;
  border-color: #2572b4 !important;
}

/* Organization Dashboard Style */
div#org-dashboard-details > p {
  font-size: 18px;
}

#facilities > div > ul {
  padding-top: 40px;
  padding-left: 0px;
}
#facilities > div > ul > li {
  list-style-type: none;
  margin-bottom: 10px !important;
}

#facilities > div > ul > li > a {
  text-decoration: none !important;
}

#facilities > div > ul > li.list-group-item {
  position: relative;
  text-align: left !important;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #ddd !important;
  border-radius: 4px;
}

/* Alerts */
.alert-danger {
  background-color: #f9f1f1 !important;
  border-color: #ebccd1 !important;
}

.alert-success {
  background-color: #dff0d8 !important;
  border-color: #d6e9c6 !important;
}

.alert-info {
  background-color: #d9edf7 !important;
  border-color: #bce8f1 !important;
}

.alert-warning {
  background-color: #fcf8e3 !important;
  border-color: #faebcc !important;
}

/* WET-BOEW Accordians */
.wb-tabs [role="tablist"] {
  display: block !important;
}

/* *********************** Support - Help & Support Page *********************** */
.card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  line-height: initial;
  border: 1px solid #777777;
  border-radius: 5px;
  padding: 10px;
  width: 400px;
  min-height: 150px;
}

.card button {
  background-color: #244578;
  color: white;
  border: none;
  padding-bottom: 2px;
  width: calc(100% - 2px);
  text-align: center;
  display: block;
  margin: 40px 0;
  margin-top: 25px;
  margin-bottom: 8px;
  border-radius: 5px;
  height: 50px;
}

.cards-container {
  margin-top: 50px !important;
  margin-bottom: 50px !important;
  gap: 20px;
}

/* *********************** Guided Help Page *********************** */

/* Accordion styles */
.accordion {
  cursor: pointer;
  color: #295376;
  width: 100%;
  text-align: left;
  outline: none;
  font-size: 20px;
  transition: 0.4s;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 4px 18px 4px 32px;
  margin-top: 10px;
  background-color: white;
  position: relative;
}

button.accordion:focus {
  border-width: medium;
}

.accordion::before {
  content: "\25B6";
  color: #295376;
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform 0.4s;
}

.accordion.active::before {
  transform: translateY(-50%) rotate(90deg);
}

.accordion.active,
.accordion:hover {
  background-color: white;
}

.accordion.active {
  border-radius: 0;
}

.accordionContent {
  padding: 8px 18px;
  display: none;
  overflow: hidden;
  background-color: white;
  border: 1px solid #ccc;
  border-top: none;
}

.black-line {
  margin-top: 40px;
  margin-bottom: 30px;
  width: 100%;
  height: 1px;
  background-color: black;
}

.border-container {
  border: 2px solid black;
  border-radius: 4px;
  padding: 10px;
  margin-top: 35px;
  transition: all 0.4s;
}

#loading {
  display: none;
  text-align: center;
  font-size: 20px;
  color: #295376;
  margin: 20px 0;
}

.custom-datalist-container {
  position: relative;
  display: inline-block;
  width: 100%;
}

.custom-datalist-input {
  width: 100%;
  padding-right: 35px;
  box-sizing: border-box;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 8px 12px;
  appearance: none;
}

option {
  background-color: white;
  padding: 4px;
  margin-bottom: 1px;
  cursor: pointer;
}

option:hover {
  background-color: lightblue;
}

input::-webkit-calendar-picker-indicator {
  opacity: 100;
}

/* *********************** Search Page *********************** */
.search-results {
  list-style: none !important;
}

.search-results > li > .search-score {
  display: none;
}

.crmEntityFormView .section-title h3 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

:not(#wb-srch) form {
  font-size: unset !important;
}

/* *********************** Support Request Page *********************** */
.custom-button {
  background-color: #2c3e50;
  color: white;
  padding: 24px 24px;
  border: none;
  border-radius: 5px;
  font-size: 18px;
  white-space: nowrap;
  width: auto;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* *********************** Multiselect Picklist *********************** */
#ModernMSPicklistControl-ModernMSPicklistControl-pcf-container-id
  input[role="combobox"] {
  min-height: var(--formControlMinHeight) !important;
  background-color: var(--formControlBackground) !important;
  border-top-left-radius: var(--formControlBorderRadius) !important;
  border-bottom-left-radius: var(--formControlBorderRadius) !important;
}

#ModernMSPicklistControl-ModernMSPicklistControl-pcf-container-id
  .fui-Combobox {
  border-top-right-radius: var(--formControlBorderRadius) !important;
  border-bottom-right-radius: var(--formControlBorderRadius) !important;
  background: var(--formControlSpanBackground) !important;
}

.text.form-control.readonly,
.aspNetDisabled.text.form-control.lookup.form-control {
  font-size: var(--fontSizeBody) !important;
  background: var(--formControlReadOnlyBackground) !important;
}

/* ********* Page Details ******* */
#wb-dtmd {
  font-size: 16px;
}

/* ******* Note Attachment ***** */
.notes {
  word-break: break-word;
}

/* ************ BEGIN Throbber - Spinner ****************** */
/* Full-screen overlay */
.throbber-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 1);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}

.view-loading.message {
  position: relative;
  padding: 50px;
}

#throbber-overlay-list {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Spinning circle */
.spinner {
  border: 16px solid #f3f3f3;
  border-top: 16px solid #ff0000;
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
  position: relative;
}

/* Centered flag (non-spinning) */
.flag-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px; /* Adjust size according to your logo */
  height: 50px;
  z-index: 1;
  background-image: url("/flag-of-canada-leaf.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

/* Animation */
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* ************ END Throbber - Spinner ****************** */

/* ************ Guidance Material Table **************** */

#guidanceMaterial_wrapper {
  padding-top: 10px;
}

/* ****************** MessagePanel ******************* */
#MessagePanel {
  margin: 10px !important;
}

/* ****************** Helpful Tips Panel Body ******************* */
.helpfultips-panel-body {
  display: block;
  margin-left: 15px;
}

.help-notes {
  list-style-position: outside;
  padding-left: 0;
}

.help-notes > li {
  padding-bottom: 10px;
}

/* ****************** Dashbaord Tables ******************** */

#my-registered-organization div.view-grid thead > tr,
#my-active-roles div.view-grid thead > tr,
#authorized_individuals_subgrid
  > div
  > div.view-grid.table-responsive
  > table
  > thead
  > tr {
  white-space: nowrap !important;
}

/* ****************** Dashbaord Notification Bell ******************** */

.badge {
  background-color: #dc143c !important;
  margin-left: 0.5px;
  position: relative;
  top: -12px;
}

.glyphicon-bell {
  font-size: 18px;
  margin-right: 2px;
}

/* ****************** Debug Banner ******************** */
#debug-banner {
  width: 100%;
  background-color: darkred;
  color: white;
  text-align: justify;
  padding-top: 10px;
  padding-bottom: 10px;
}

#debug-banner p {
  color: white !important;
  font-weight: bold !important;
  font-size: 14px !important;
}

/* ****************** Maintenance Banner ******************** */

.maintenance-final-text > a {
    font-size: unset !important;
}

/* ****************** Submission confirmation Page ******************** */
/******Important content section******/

 .info-bar-icon {
    width: 5px;
    background-color: #5098B8;
    margin-right: 23px;
    display: flex;
	padding-top:16px;
	margin-left:5px;
  }

  .info-icon-circle {
    height: 28px;
    background: white;
    display: flex;
    margin-left: -7px;
  }

  .info-icon-circle .glyphicon {
    color: #5098B8;
    margin-top: 3px;
  }

/* BUG 114027 */
.modal-body {
    .clearfix.alert:before {
        display: block !important; 
        content: "" !important; 
    }
}