/** CHANGELOG (newest changes at top) 

02/19/25 (Angela Ortner)
- added styling for .reading-time

02/17/25 (Angela Ortner)
- fixed .date-modified to include a wider left margin (left over from expanding side nav width)

02/14/25 (Angela Ortner)
- styled label for homepage search bar (.portal-search-label)
- styled label for article sidenav search bar (.sidebar-search-label) and placeholder text (.sidebar-search-label input::placeholder)
- fixed article sidenav pop-out for phones (.site-sidebar @media (max-width:766px))

02/13/25 (Angela Ortner)
- .portal-header .portal-search button,.publication-contents h4 span - added black 1 px border to search button
- .form-inline .search-field - added black 1 px border to search box
- .portal-header .portal-search .search-field - rounded left end
- .portal-header .portal-search button,.publication-contents h4 span  - rounded right end

01/31/25 (Angela Ortner)
- Added code to hide .table-title (is replaced by caption element)
- Styled table caption (.table caption) - added italics and set padding and margin)

01/15/25 (Angela Ortner)
-Changed logo padding to accommodate larger logo
-Increased font size in sidenav to 18px
-Added highlight to active link in sidenav (so it's clear what page the user is on)
-Changed background color, border, and padding of search box to distinguish it from active link and hover highlight color
-Moved search box up in side nav and increased bottom margin
-Slightly increased width of side nav to accommodate larger logo and text

01/14/25 (Angela Ortner)
-Added styling for feedback link at bottom of article pages

01/08/25 (Angela Ortner)
-Adjusted accordion padding, margins, size, and capitalization (.panel-heading and .panel) so accordions are consistent across the site and work in a better heirarchy with other headings.

12/03/2024 (Angela Ortner)
-Updated .informaltable.fixedheader and .table.fixedheader so that scrollable fixed-header tables can read column width settings set in Paligo (Edit table settings)

12/03/2024 (Angela Ortner)
-Updated .informaltable.image-and-key to include a 20px margin at the bottom to pad for text below it.

11/13/24 (Angela Ortner)
-created new table type for image keys on intro pages
-created new table type for side-by-side of intro page image and image key
-created new role for instructions on intro pages to get to a feature/page (.featurenav) 

10/25/24 (Angela Ortner)
-reordered changelog to be reverse chronological
-added code from Paligo Support as a fix for procedure numbering issue in Chrome (.procedure)

*06/30/24 - Angela Ortner
- Updated scrolling table CSS so only scrolling tables have vertical borders

*06/30/24 - Angela Ortner
- Added scrolling table

*11/28/2023 - Angela Ortner
-Added sectionheader role for paragraphs.

*06/08/2023 - Angela Ortner
-Fixed h6 for titles (typo, was too big) and added 1em of padding to the top for separation.

*06/08/2023 - Angela Ortner
-Changed h6 for titles (shows when creating a subheading within a topic that's several levels in within the TOC hierarchy) - made larger and bolded.

*05/16/2023 - Hoa Chiang
-Updated naming for Meet the team from customer to client

*03/23/2023 - Angela Ortner
-Adjusted spacing above and below section headers

*02/08/2023 - Angela Ortner
- Change size and margins of "More About this Topic" section, previously "In This Section" (div.section-toc-title)
- Change color and hover color for links.
- Remove Previous and Next buttons from topic pages.

*02/06/2023 - Angela Ortner
- Change size of "Show More" and "Show Less" text on homepage to 1.3em (.show-all-categories)

* 01/20/2023 - Angela Ortner
- Change color of search results background to #FFF8E7 on hover (.search-results-item)
- Add padding to Last Modified date on topic pages. (.date-modified)

* 01/17/2023 - Angela Ortner
- Change color of footer background to #FFF8E7
- Change color of footer link hover to #DE6E0D
- Update padding for footer columns 
- Update padding for footer columns on screens with width < 800px

* 01/13/2023 - Caio Borghi
- Update footer columns on screens with width < 800px
- Remove margin-top and margin-bottom from search-result-wrapper
- Add gray line on home

01/09/2023 - Caio Borghi
- Remove padding top of middle section
- Change footer to be always fixed 
- Change sidebar to stop at footer

*/


/*
 * YAPI overrides to the Paligo style sheet.
 */
 /* Roboto Condensed Font */
 @import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

/* Main text content on article pages AND Featured Content section header on homepage */
 body{
  font-family:'Roboto Condensed', sans-serif;
  font-size:16px;
  line-height:1.4;
  color:#595959;
  background-color:#fff
}

/* Color for links, buttons, and accordion (non-hover state)*/
a,.text-primary,.btn-link,.pagination>li>a,.pagination>li>span,.publication-contents a:hover {
  color:#D46E0D;
}

/* Hover color for links, accordion. */
a:hover,a:focus,.btn-link:hover,.btn-link:focus {
  color: #FFA132;
}

/* Accordion padding */
.panel-heading h4.title {
  padding: 0px;
  margin: 0px;
  font-size: 20px;
  color: inherit;
}
.panel-heading h5.title {
  padding: 0px;
  margin: 0px;
  font-size: 20px;
  text-transform: capitalize;
}
.panel-heading h6.title {
  padding: 0px;
  margin: 0px;
  font-size: 20px;
  font-weight: normal;
  text-transform: capitalize;
}
.panel.panel-default{
  margin-top: 0px;
  padding-bottom: 15px;
}

/* remove number count in featured content. if you want to keep the numbers, remove this section.*/
.featured-title .toc-count {
  display: none;
  } 

/* Tooltip font */
.tooltip{
    font-family:'Roboto Condensed', sans-serif;
    font-style:normal;
    font-weight:400;
  }
  

/* HOME PAGE */ 


 /* Removes opaque color overlay for home page hero image */

.portal-header::before {
  background-color: rgba(0, 0, 0, 1);
  }
  
  .portal-header::after {
  opacity: 1;
  filter: grayscale(0%);
  }
  
  header.portal-header > .inner > h1 {
  font-weight: 800;
  }


/* Homepage text color in header */
.portal-header{
  color:#000;
}

/* Sizing for second line of text in homepage welcome message */
@media (max-width: 500px) { .portal-header .inner h3 {
  font-size: 17px
   }
}

/* Rounds left end of search field */
.portal-header .portal-search .search-field{
  border-radius:50px 0 0 50px;
}


/* Secondary color - For portal search button icon (magnifying glass) on home page, featured content numbered callouts, rounds right end of button - HOVER DISABLED BY SETTING TO SAME COLOR  */
.portal-header .portal-search button,.publication-contents h4 span {
  background-color:#000;
  color: #e3e2de;  
  border: 1px solid #000;  
  border-radius: 0 50px 50px 0;
  padding-left: 14px; 
}

/* For portal search button icon when hovered over - HOVER DISABLED BY SETTING TO SAME COLOR  */
.portal-header .portal-search button:hover{
   background-color:#000;
   color: #e3e2de;   
}

/* "Search" label for article homepage search bar */
.portal-search-label {
  color: #000;
  padding-right: 10px;
  font-size: 20px;
}





/* Search Field cursor and type color */
.search-field{
  color:#000;
}

/* Search Field placeholder ("Search") color */
.search-field::placeholder{color:#595959}

.form-inline .search-field{
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid #000;

}


/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/
.portal-single-publication {
  width: 20%;
}
@media (min-width: 475px) and (max-width:887px){
  .portal-single-publication {
    width: 33%;
  }
}
@media (max-width: 475px){
  .portal-single-publication {
    width: 50%;
  }
}

/* Rounded link boxes below header (border-radius) */
.portal-single-publication a{
  color:#555;
  display:inline-block;
  padding:20px 20px;
  width:100%;
  height:100%;
  background-color:#fff;
  border-radius: 15px; 
  -webkit-box-shadow:0 3px 15px rgba(0, 0, 0, 0.09);
  box-shadow:0 3px 15px rgba(0, 0, 0, 0.09);
  -webkit-transition:-webkit-box-shadow 0.1s ease-in-out;
  transition:-webkit-box-shadow 0.1s ease-in-out;
  -o-transition:box-shadow 0.1s ease-in-out;
  transition:box-shadow 0.1s ease-in-out;
  transition:box-shadow 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out
}
@media (min-width:992px){
  .portal-single-publication a{padding:40px 20px}
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/

/* Removes Featured Content Section on Homepage */
.featured-content-label  {
  display: none;
}
.featured-content
{
  display: none;
}

/* Search Results Hover Background Color */
.searchresultitem:hover {
  background-color: #FFF8E7;
  border-radius: 5px;
}

.searchresultitem:focu,
.searchresultitem:focus-within,
.searchresultitem:active
{
  background-color: #FFF8E7;
  border-radius: 5px;
}

.show-all-categories{
  margin: 0 auto;
  font-size: 1.3em;
}



/* ARTICLE PAGES */
/* Sidebar width */
.site-sidebar {
  width: 18%;
}
@media (min-width:767px) and (max-width: 1200px) {
  .site-sidebar {
    width: 26%;
  }
}
@media (max-width:766px) {
  .site-sidebar {
    width: 60%;
  }
}
/* breadcrumb toolbar width */
.toolbar {
  margin-left: 1.33%
}
@media (max-width:767px){
  .toolbar {
    margin-left: 0%
  }
}


 /* Color for sidebar. Hover color seems to be derived from this*/
.bg-primary,.btn-primary,.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus,.site-sidebar,.portal-single-publication .publication-icon {
  background-color:#F7B500;
}
.nav-site-sidebar li a:focus{
  background-color: transparent;
}

/* Text color and formatting for sidebar */
.nav-site-sidebar{
  font-family:'Roboto Condensed', sans-serif;
  margin-top:15px;
  margin-bottom:20px;
  font-size: 16px;
}
.nav-site-sidebar li a {
  color:#000;
  padding:4px 0;
  display:block;
  -webkit-transition:background-color 0.2s ease-out
  ;-o-transition:background-color 0.2s ease-out;
  transition:background-color 0.2s ease-out
}

.nav-site-sidebar li a:focus,.nav-site-sidebar li a:hover{
  background-color:rgba(255, 255, 255, 0.2);
  text-decoration:none
}
.nav-site-sidebar>li>a{
  padding:10px 15px
}
.nav-site-sidebar .active>a{
  color:#000; 
  font-weight: 700;
  background-color: #f9c451;
}
.nav-site-sidebar ul{
  list-style:none;
  padding:0;
  display:none
}
.nav-site-sidebar .opened>ul{
  display:block
}
.nav-site-sidebar ul a{
  color:#000;
  padding:5px 15px 5px 30px;
  font-size:0.9em
}

/* Sidebar Logo */
.theme1 .site-sidebar .logo{
  width: 100%;
  max-width: 180px;
  padding: 25px 0px;
  display: inline-block
}

/* Sidebar Search */
.site-sidebar-search {
  background-color: #FFE29D;
  border: 1px solid #F7b500; 
  padding: 7px 0px;
  margin-top: 10px;
  margin-bottom: 48px;
}

.site-sidebar-search .search-field {
  background-color: transparent;
}

/* "Search" label for article sidenav */
.sidebar-search-label {
  background-color: #f7b500;
  color: #000;
  font-size: 18px;
  padding: 5px 15px;
  margin-top: -10px;
  display: block;
}

/* Placeholder text for article sidenav */
.site-sidebar-search input::placeholder {
  padding-left: 15px;
}


/* Estimated Reading Time A */
.reading-time {
  font-size: 16px;
  padding: 7px 15px;
  margin-top: -16px !important;
  margin-bottom: 26px;
  background-color: #FFF8E7;
  border-radius: 50px;
  display: inline-block;
  vertical-align: top;
  font-style: italic;
} 

/* Estimated Reading Time B 
.reading-time {
  font-size: 16px;
  color: #FFF;
  padding: 10px 10px;
  margin-top: -15px !important;
  margin-bottom: 26px;
  background-color: #000;
  border-radius: 5px;
  display: inline-block;
  vertical-align: top;
  font-style: italic;
}
*/

/* Estimated Reading Time C
.reading-time {
  font-size: 16px;
  color: #FFF;
  padding: 10px 10px;
  margin-top: -15px !important;
  margin-bottom: 26px;
  background-color: #F7B500;
  border-radius: 5px;
  display: inline-block;
  vertical-align: top;
  font-style: italic;
}
*/


/* COLOR FOR NUMBERED PROCEDURE STEP ICONS (NUMBERED CIRCLES) */
.theme1 .procedure > li::before {
  background-color: #F7B500;
  color: #fff;
}



/* NOTES, TIPS, & WARNINGS */
.important:before{
  content: '\f06a';
}

.note{
  border-left-color: #595959;
  background-color: rgba(89, 89, 89, 0.08);
}

.note:before{
  content: '\f05a';
  color: #595959;
}

.notice{
  border-left-color: #595959;
  background-color: rgba(89, 89, 89, 0.08);
}

.notice:before{
  content: '\f05a';
  color: #595959;
}

.tip{
  border-left-color: #00C48C;
  background-color: rgba(0, 207, 140, 0.08);
}

.tip:before{
  content: '\f0d0';
  color: #2E8406;
}

.warning{
  border-left-color: #EB0000;
  background-color: rgba(235, 0, 0, 0.08);
}

.warning:before{
  content: '\f071';
  color: #EB0000;
}

.warning.danger{
  border-left-color: #EB0000;
  background-color: rgba(235, 0, 0, 0.08);
}

.warning.danger:before{
  content: '\f071';
  color: #EB0000;
}

.caution{
  border-left-color: #EB0000;
  background-color: rgba(235, 0, 0, 0.08);
}

.caution:before{
  content: '\f071';
  color: #EB0000;
}

.important{
  border-left-color: #AD36F6;
  background-color: rgba(173, 54, 246, 0.08);
}

.important:before{
  content: '\f0d0';
  color: #AD36F6;
}


/* ROLE TO SEPARATE INSTRUCTIONS FOR GETTING TO A PAGE (FOR INTRO PAGES) */
.featurenav {
  padding: 20px;
  margin-bottom: 20px;
  background-color: #FFF8E7;
  color:rgba(0, 0, 0, 1);
}


/* Feedback Link */

div.feedback-panel #email-feedback{
  display: none;
}

div.feedback-panel #email-feedback.no-voting, div.feedback-panel #email-feedback.feedback-link-visible{
  display: block;
  white-space: pre-wrap;
}

div.feedback-panel{
  border: 1px solid #fff;
  width: 100%;
  margin-top: 100px;
  margin-left: 16.66666667%;
  padding-left: 0;
  background-color: #fff;
  border-radius: 6px;
  max-width: 66.66666667%;
  float: left;
  text-align: center;
  padding: 20px;
}

@media (max-width:768px){
div.feedback-panel{
  margin-left: 0%;
  max-width: 100%;
  margin-top: 50px;
}
}

div.feedback-panel a:focus {
  text-decoration:none;
  color: #D46E0D;
}
div.feedback-panel a:focus:hover {
  text-decoration:none;
  color: #FFA132;
}


div.feedback-panel p{
border: 1px solid #e5e5e5;
max-width: 60%;
margin: auto;
padding: 10px;
border-radius: 8px;
}

@media (max-width:768px) and (min-width: 668px){
div.feedback-panel p{
  max-width: 80%;
}
}

@media (max-width:667px){
div.feedback-panel p{
  max-width: 100%;
}
}



div.feedback-panel .btn{
  position: relative;
  float: left;
  border: 1px solid #1976d2;
  margin: 10px 20px !important;
  border-radius: 3px !important;
  padding: 5px 30px;
  background-color: transparent;
}

div.feedback-panel .btn.active,
div.feedback-panel .btn:active{
  -webkit-box-shadow: none;
  box-shadow: none;
  background-color: #1976d2;
  color: #ffffff;
}

div.feedback-panel .btn.active.focus, div.feedback-panel .btn.active:focus, 
div.feedback-panel .btn.focus, div.feedback-panel .btn:active.focus, 
div.feedback-panel .btn:active:focus, div.feedback-panel .btn:focus {
  outline: none;
}

.feedback-panel .voting-feedbackicon{
  display:none;
}

.feedbackicon{
  margin-right: 0.5em;
  font-size: 1.5em;
  vertical-align: text-bottom;
}




/* unsure but hoping this will change font of article pages */
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{
  font-family:'Roboto Condensed', sans-serif;
  font-weight:500;
  line-height:1.1;
  color:inherit}


  .h4, h4 {
    font-size: 26px;
    margin-top: 54px;
  }
  
  .h5, h5 {
    font-size: 20px;
    margin-top: 40px;
  }
  

/*Remove PREV and NEXT links on article pages */
  .pager li{
    display: none;
    }  
 





/* Image Caption spacing */
caption {
  padding-top:8px;
  padding-bottom:18px;
  margin-bottom: 20px;
  color:#777777;
  text-align:left
}
.mediaobject .caption{
  margin-top: 10px;
  margin-bottom: 6%;
  font-style: italic;
}
@media (max-width:768px){
  .mediaobject .caption{
    margin-bottom: 10%;
  }
}

/* Default Image Border & Custom No Border Role */
.mediaobject img {
  border: #E5E5E5;    
  border-style: solid;
  }

  .mediaobject.noborder img {
    border: none;
    }


/* Default Image Border & Custom No Border Role */
.videoobject {
  border: #E5E5E5;    
  border-style: solid;
  padding-top: 0px;
  }

  .videoobject.noborder {
    border: none;
    }

/* Fixed Table Header */

.informaltable.fixedheader { 
  overflow-y: auto; 
  height: 400px; 
} 
.informaltable.fixedheader thead th { 
  position: sticky; 
  top: 0; 
} 
.informaltable.fixedheader table { 
  border-collapse: collapse;  
  table-layout: fixed; /* Ensures uniform column width */       
  width: 100%; 
} 
.informaltable.fixedheader th { 
  background: #e9e9e9; 
  border: 1px solid #d6d5d5; 
  word-wrap: normal; /* Break words that are too long */
  white-space: normal; /* Allows text to wrap onto multiple lines */
  text-align: left; /* Align text to the left for better readability */
} 

/* applies vertical border between columns to fixed header tables only - .informaltable */
.informaltable.fixedheader td { 
  border: 1px solid #e9e9e9; 
  word-wrap: break-word; /* Break words that are too long */
  white-space: normal; /* Allows text to wrap onto multiple lines */
  text-align: left; /* Align text to the left for better readability */
} 

.table.fixedheader { 
  overflow-y: auto; 
  height: 400px; 
} 
.table.fixedheader thead th { 
  position: sticky; 
  top: 0; 
} 
.table.fixedheader table { 
  border-collapse: collapse;         
  width: 100%; 
  table-layout: fixed; /* Ensures uniform column width */
   
} 
.table.fixedheader th { 
  background: #e9e9e9; 
  border: 1px solid #d6d5d5; 
  word-wrap: normal; /* Break words that are too long */
  white-space: normal; /* Allows text to wrap onto multiple lines */
  text-align: left; /* Align text to the left for better readability */
} 

/* applies vertical border between columns to fixed header tables only - .table */
.table.fixedheader td { 
  border: 1px solid #e9e9e9; 
  word-wrap: break-word; /* Break words that are too long */
  white-space: normal; /* Allows text to wrap onto multiple lines */
  text-align: left; /* Align text to the left for better readability */
} 

/* Removes table title so it's not a duplicate of the caption (code from Paligo Support) */
.table-title {
  display:none;
 }
/* styles table caption */
.table caption {
  margin-bottom: 0px;
  padding-bottom: 5px;
  font-style: italic;
}


/* Intro Image & Key Table (side by side) */
.informaltable.image-and-key { 
  padding: 0px;
  margin: 0px 0px 20px 0px;
  border: none;
  vertical-align: top;
} 
.informaltable.image-and-key td { 
  vertical-align: top;
  border: none;
} 
.informaltable.image-and-key td { 
  border: 2px solid #e9e9e9;
} 

.informaltable.image-and-key .mediaobject { 
  margin: 0px;
} 


/* Intro Image Table (fixed height) */
.informaltable.introimage { 
  overflow-y: auto; 
  height: 400px; 
  
} 
.informaltable.introimage table { 
  border-collapse: collapse;         
  width: 100%; 
  border: none;
  margin: 0px;
  padding: 0px;
} 
.informaltable.introimage td { 
  border: none;
  vertical-align: middle;
} 
.informaltable.introimage .mediaobject { 
  margin: -8px;
  
} 


/* Intro Key Table (fixed height) */
.informaltable.key { 
  overflow-y: auto; 
  height: 400px; 
  /*border:*/ /* commented out by Johan since it was empty*/
} 
.informaltable.key table { 
  border-collapse: collapse;         
  width: 100%; 
  border: none;
  margin: 0px;
  padding: 0px;
} 
.informaltable.key td { 
  border: none;
  vertical-align: middle;
} 
.informaltable.key img { 
  margin-top: 0px;
  padding-top: 0px;
} 
.informaltable.key .inlinemediaobject { 
  padding-top: 0px;
  vertical-align: middle;
} 

.inlinemediaobject {
  vertical-align: middle;
}







    
/* In-Text Link Buttons */
.link.button {
  color: #000;
  padding: 2% 9%;
  text-align: center;
  background-color: #F7B500;
  border-radius: 50px;
  font-weight: 700;
  font-size: 1em;
  display: block;
  text-decoration: none;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
  }

.link.button:hover {
    background-color: #f8bd36;
    transition: all 0.2s ease-in-out 0s;
    box-shadow: 0px 4px 4px #d0cdcd;
    -webkit-transform: scale(1.03);
    transform: scale(1.03);

  }


/* Adjusted spacing above and below section headers */
#topic-content > section > .titlepage .title h2{
  margin: 0em 0 .6em;
}

#topic-content > section > section > .titlepage .title h3{
  margin: 1.8em 0 .6em;
}

#topic-content > section > section > .titlepage .title h5{
  margin: 2.8em 0 1em;
}




/* Adjusts section headers at level h6 within a topic to be bold and large (instead of paragraph size) */
h6.title {
  padding-top: 1em;
  font-size: 1.5em;
  font-weight: 700;
}


/* Adds sectionheader role for headers we don't to create as a formal "section" so they don't appear in a search */
p.sectionheader {
  padding-top: 1em;
  font-size: 1.5em;
  font-weight: 400;
  }

/* Text top-align for tables with large amounts of text */
.informaltable.topalign td, th{
  vertical-align: top;
  }


/* UNSURE - Not sure where this is used */


.btn-primary,.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus {
  border-color:#f70036;
}


a.text-primary:hover,a.text-primary:focus,.btn-primary:hover,a.bg-primary:hover,a.bg-primary:focus,.btn-primary:focus,.btn-primary.focus,.btn-primary:active,.btn-primary.active,.open > .dropdown-toggle.btn-primary,.btn-primary:active:hover,.btn-primary.active:hover,.open>.dropdown-toggle.btn-primary:hover,.btn-primary:active:focus,.btn-primary.active:focus,.open>.dropdown-toggle.btn-primary:focus,.btn-primary:active.focus,.btn-primary.active.focus,.open>.dropdown-toggle.btn-primary.focus {
  background-color:#18b43a;
}

.btn-primary:focus,.btn-primary.focus,.btn-primary:hover,.btn-primary:active,.btn-primary.active,.open > .dropdown-toggle.btn-primary,.btn-primary:active:hover,.btn-primary.active:hover,.open>.dropdown-toggle.btn-primary:hover,.btn-primary:active:focus,.btn-primary.active:focus,.open>.dropdown-toggle.btn-primary:focus,.btn-primary:active.focus,.btn-primary.active.focus,.open>.dropdown-toggle.btn-primary.focus {
  border-color:#8e117b;
}

.popover{
  position:absolute;
  top:0;
  left:0;
  z-index:1060;
  display:none;
  max-width:276px;
  padding:1px;
  font-family:'Roboto Condensed', sans-serif;
  font-style:normal;
  font-weight:400;
  line-height:1.4;
  line-break:auto;
  text-align:left;
  text-align:start;
  text-decoration:none;
  text-shadow:none;
  text-transform:none;
  letter-spacing:normal;
  word-break:normal;
  word-spacing:normal;
  word-wrap:normal;
  white-space:normal;
  font-size:16px;
  background-color:#fff;
  background-clip:padding-box;
  border:1px solid #ccc;
  border:1px solid rgba(0, 0, 0, 0.2);
  border-radius:6px;
  -webkit-box-shadow:0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow:0 5px 10px rgba(0, 0, 0, 0.2)
}

/* More About This Topic Title (previously "In This Section" */
div.section-toc-title{
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 0.5em;
  margin-top: 2.6em;
}


/* Last Modified Date */
.date-modified {
  margin-top: 0%;
  margin-bottom: 7%;
  margin-left: 3%;
}
@media (max-width:768px){
  .date-modified{
    margin-top: 0%;
    margin-bottom: 7%;
    margin-left: 0%;
  }
}


/* CustomFooter */

footer .replaceCSSSelector a {
  color: black; 
  background-color:green; 
  font-size: 2em; 
}

aside.site-sidebar {                /* Sergey's Change */
  bottom: 0px !important;
}

div.footer-row.with-sidenav {       /* Sergey's Change */
position: absolute;
}

.footer-row.with-sidenav {          /* Sergey's Change */
  width: 100%;
  padding-left: 19%;
  padding-top: 1.5%;
} 

/* PALIGO Support: remove the left padding when navbar is hidden */
@media (max-width: 767px)   {
  .footer-row.with-sidenav {
    padding-left: 0vw;
  }
}

.footer-row {
  background-color: #FFF8E7;             /* Sergey's Change */
color: #000;
padding: 1%;
overflow:auto;
box-shadow: 0px -8px 7px -5px #d0cdcd;   /* Johan's Change to get just the top border shaded */
}

.footer-row a {
  color: #000;
  }
 .footer-row a:hover {
    color: #DE6E0D;
    }





/**

@media (min-width: 601px) and (max-width: 800px) {
  .footer-column-1 {
    padding: 3%;
    width: 50%;
  }
}
@media (min-width: 601px) and (max-width: 800px) {
  .footer-column-2 {
    width: 50%;
    padding: 6% 3%;
  }
}
@media (min-width: 601px) and (max-width: 800px) {
  .footer-column-3 {
    width: 50%;
    padding: 3%;
  }
}
@media (min-width: 601px) and (max-width: 800px) {
  .footer-column-4 {
    width: 50%;
    padding: 0 3% 3% 3%;
  }
}




@media (max-width: 600px) {
  .footer-column-1 {
    padding: 5%;
    width: 100%
  }
}
@media (max-width: 600px) {
  .footer-column-2 {
  width: 100%;
  padding: 4% 5%;
}
}
@media (max-width: 600px) {
  .footer-column-3 {
    padding: 5%;
    width: 100%
  }
}
@media (max-width: 600px) {
  .footer-column-4 {
    padding: 0% 5% 5% 5%;
    width: 100%
  }
}

**/

.footer-pad-top {
  padding-top: 10px;
}
@media (max-width: 1200px) {
.footer-pad-top {
  padding-top: 0%;
}
}


.footer-social {
  padding-right: 7%;
  margin-top: -5%;
  font-size: 1.3em;
  float: left;
}

.footer-social p {
  margin: 0%;
}

.footer-row h3 {
  font-weight: 700;
  font-size: 1.7em;
  margin: 0%;
  padding: 0% 0% 3% 0%;
}

.footer-row h4 {
  font-weight: 700;
  font-size: 1.5em;
  padding: 0%;
  margin: 0% 0% 5px 0%;
}

/* Hide built in Paligo footer*/
.copyright {
display:none;
}

.dropup.languages {
  display: none;
}


/* Fix for procedure numbering issue in Chrome - Code from Paligo Support */
.procedure > li .procedure > li {
  counter-increment: nested-step-counter;
  margin-bottom: 10px;
  min-height: 1em;
}




/* Customer Footer code that paligo told me to enter 
footer .replaceCSSSelector a {
  color: white; 
  background-color:green; 
  font-size: 2em; 
}
*/


 

/* IN PROGRESS 

/* OLD Color for the opaque overlay on the homepage image.  Keeping here in case we need to revert back 
 .portal-header::before{
  background-color: #f7ab1e;  
  }

.theme2 .portal-header::before{
  background-color: #fff;
}
 */

 /* Portal header Gradient  

 .portal-header::before {
  background: linear-gradient(to right , rgb(247, 147, 30) 8% , rgb(242, 194, 61) 50% , rgb(255, 255, 255) 95%);
}


 .portal-header{
   color:#000;
   height:350px;
   padding:30px 15px;
   position:relative;
   text-align:center
}
 @media (min-width:768px){.portal-header{padding:30px 50px}}.portal-header .logo-link{display:block}
 @media (min-width:768px){.portal-header .logo-link{text-align:left}}.portal-header .logo{height:30px;margin-bottom:20px}
 @media (min-width:768px){.portal-header .logo{margin-bottom:0;height:40px}}.portal-header h1{font-size:28px;margin-bottom:0.835em}
 @media (min-width:768px){.portal-header h1{font-size:36px}}



    
.portal-header:after,.portal-header:before{
  content:"";
  top:0;
  left:0;
  bottom:0;
  right:0;
  position:absolute
}
       

.portal-header:after{
  z-index:-5;
  background:url(../images/portal1-bg.jpg) no-repeat center center;
  background-size:cover;opacity:0.05
}

.portal-header .search-page-link{
  margin-top:10px;
  font-size:0.875em
}
              
.portal-header .search-page-link a{
  color:rgba(255, 255, 255, 0.8)
}


/* Color for PREV and NEXT links on article pages
.pager li>a,.pager li>span {
  color:#f7931e;   
}
/* Hover color for PREV and NEXT links on article pages
.pager li>a:hover,.pager li>span:hover {
  color:#f7931e;
  background-color:#000;
}   

.pager li>a,.pager li>span{
  display:inline-block;
  padding:5px 14px;
  background-color:#fff;
  border:1px solid #ddd;
  border-radius:15px
}
.pager li>a:focus,.pager li>a:hover{
  text-decoration:none;
  background-color:#eeeeee
}
.pager .next>a,.pager .next>span{
  float:right
}
.pager .previous>a,.pager .previous>span{
  float:left
}
.pager .disabled>a,.pager .disabled>a:focus,.pager .disabled>a:hover,.pager .disabled>span{
  color:#777777;
  cursor:not-allowed;
  background-color:#fff
}
.label{
  display:inline;
  padding:0.2em 0.6em 0.3em;
  font-size:75%;
  font-weight:700;
  line-height:1;
  color:#fff;
  text-align:center;
  white-space:nowrap;
  vertical-align:baseline;
  border-radius:0.25em
}


*/

/* Layout styles -----------------------------------*/
@media (max-width: 619px) {
  .client-experience-team-container > .column {
    padding-bottom: 30px;
  }

  .client-experience-team-container > .column > header > img {
    width: 20%
  }

  .client-experience-team-container > .column > main {
    text-align: justify;
  }
}


@media (min-width: 620px) {
  .client-experience-team-container {
    column-count: 2;
    column-gap: 20px;
  }
  
  .client-experience-team-container > .column {
    break-inside: avoid;
    border-right: 1px solid #f4f4f4;
    padding-right: 10px;
  }

  .client-experience-team-container > .column:nth-child(2) {
    padding-top: 20px;
  }

  .client-experience-team-container > .column:last-child {
    border: none;
    margin-top: 60px;
  }

  .client-experience-team-container > .column > header > img {
    width: 40%;
  }
}

@media (min-width: 960px) {
  .client-experience-team-container {
     column-count: 3;
  }
  
  .client-experience-team-container > .column:nth-child(2) {
    padding-top: 0px;
  }
}

.client-experience-team-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px;
}

.client-experience-team-container > .column > header {
  display: flex;
  align-items: flex-start;
  padding-bottom: 20px;
}


.client-experience-team-container > .column > header > h3 {
  padding-left: 15px;
  margin: 0;
}

.client-experience-team-title {
  margin-bottom: 25px;
}

.portal-footer {
  margin-top: 2em;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  width: 100%;
}

.portal-footer .inner {
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 768px) {
  .portal-footer .inner {
    margin-left: auto;
    margin-right: auto;
    width: 750px;
  }
}

@media (min-width: 992px) {
  .portal-footer .inner {
    margin-left: auto;
    margin-right: auto;
    width: 970px;
  }
}

@media (min-width: 1200px) {
  .portal-footer .inner {
    margin-left: auto;
    margin-right: auto;
    width: 1140px;
  }
}

.site-body-row {
  display: flex;
}

.site-sidebar {
  position: fixed;
}

.site-content.content-space-left {
  margin-left: 0%;
}

#search-result-wrapper {
  margin-top: 0
}

#search-result-wrapper > div > h2 {
  margin-top: 0;
  margin-bottom: 0;
}

/* 
* Paligo-support: 
* Search Results on portal page needs to be relatively positioned 
* to be able to view the footer. 
*/
.portal-search-result {
  position: relative ;
}

.footer-column-1 {
  background-color: inherit;
  color: inherit;
  padding: 0% 2% 0% 2%;
  float: left;
  min-width: 250px;
}
.footer-column-2 {
  background-color: inherit;
  color: inherit;
  padding: 41px 2% 0% 2%;
  /*margin: 1% 0%;*/
  float: left;
  min-width: 407px;
}
.footer-column-3 {
  background-color: inherit;
  color: inherit;
  padding: 31px 2% 0% 2%;
  float: left;
  min-width: 227px;
  max-width: 227px;
}
.footer-column-4 {
  background-color: inherit;
  color: inherit;
  padding: 9px 2% 0% 0%;
  float: left;
  max-width: 150px;
  min-width: 150px;
}


.footer-row, .footer-row.with-sidenav {
  display: grid;
  justify-content: space-between;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

/* Medium screens: 2 columns */
@media (max-width: 1300px) {
  .footer-row,.footer-row.with-sidenav{
    grid-template-columns: repeat(2, 1fr);
  }
  .footer-row.with-sidenav {
    padding-left: 26%;
  }
  .footer-column-2 {
    padding-top: 30px;
  }

  .footer-column-3 {
    padding-top: 30px;
  }
  
  .footer-column-4 {
    padding-top: 0px;
  }

}

/* Small screens: 1 column */
@media (max-width: 799px) {
  .footer-row, .footer-row.with-sidenav {
    grid-template-columns: 1fr;
  }
  .footer-column-1, .footer-column-2, .footer-column-3, .footer-column-4 {
    padding: 1% 0%;
  }
  
}

@media screen and (max-width: 767px) {
  .footer-row, .footer-row.with-sidenav {
    padding-left: 15px;
  }
}


 

 .footer-column-4 img {
  width: 150px;
  min-width: 150px;
  vertical-align: top;
 }