/*.container-topbar .mod-custom .overlay {
  height: 148px;
  margin-top: 0;
}*/

/* styles used in the process for editing the images in the solution areas on the home screen */ 
/*div.MOD_SOLUTION_AREAS div.container.debug div.solutionAreaItem {
    border: 1px solid black;
}

div.MOD_SOLUTION_AREAS div.container.debug p {
    margin-top: -18px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
  color: #0f5c90;
}

div.MOD_SOLUTION_AREAS div.container.debug p:hover {
  color: red;
}

div.MOD_SOLUTION_AREAS div.container.debug div.imageWrapper {
	margin-top: -14px;
}


/*****************************				full-width sections (shared css)		************************************/

  
td {
	border: 2px solid white;
    padding: 1rem;
}

tr:nth-child(odd) td:not(.blue-background) {
    background-color: #d3d3e4;
}

tr:nth-child(even) td:not(.blue-background) {
    background-color: #f1f1f9;
}

td.blue-background {
    background-color: #2e74b5;
    color: white;
}

.sidebar-left .metismenu.mod-menu .metismenu-item>a {
    overflow: unset;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6,
p,
span:not(.divider):not(.icon-menu):not(.icon-chevron-right):not(.icon-chevron-left):not(.icon-angle-right):not(.icon-angle-left):not(.icon-angle-double-left):not(.icon-angle-double-right):not(.icon-home):not(.icon-search-plus),
strong,
a {
	font-family: sans-serif !important;
}

a:hover {
  color: red !important;
}


div#osmap {
    max-width: 1320px;
    margin: auto;
}

@media screen and (max-width: 1420px) {
	div.osmap-items ul li {
		margin-top: 1rem;
		margin-bottom: 1rem;
	}

	div#osmap {
		padding-left: 1.618rem;
		padding-right: 1.618rem;
	}
}

/* Home page banner */
@media screen and (max-width: 1419px) and (max-width: 2700px) {
  div.MOD_HOMEPAGE_BANNER div.fullwidth-inner-wrapper {
	padding-left: 2.618rem;
    padding-right: 2.618rem;
  }
  div.MOD_HOMEPAGE_BANNER div.fullwidth-inner-wrapper div.text-wrapper{
	text-align: center;
  }
}

div.MOD_HOMEPAGE_BANNER div.fullwidth-inner-wrapper {
   background: url(/images/HPCImages/hpc_homepage_background_black.jpg);
    color: white;
}

/* Home page banner */
@media screen and (min-width: 1420px) and (max-width: 2700px) {
  div.container-banner  div.MOD_HOMEPAGE_BANNER  div.fullwidth-outer-wrapper {
    
  }
  div.container-banner   div.MOD_HOMEPAGE_BANNER div.fullwidth-inner-wrapper {
  	width: 99.55vw;
    margin-left: -50vw;
    position: relative;
    left: 50%; 
    padding-top: 2.618rem;
  }
}

@media screen and (max-width: 440px) {
  div.MOD_HOMEPAGE_BANNER div.text-wrapper p:nth-child(2) {
      font-size: 2rem;
  }
}

div.MOD_HOMEPAGE_BANNER div.button-wrapper {
    margin-left: auto;
    margin-right: auto;
    width: fit-content;
}

button.callsButton,
button.portalButton {
    background-color: #bf3825;
}

button.callsButton a,
button.portalButton a {
    background-color: #bf3825;
  	color: white;
    text-decoration: none;
}

button.callsButton a:hover,
button.portalButton a:hover {
  color: black !important;
}

@media screen and (min-width: 441px) {
  div.MOD_HOMEPAGE_BANNER div.button-wrapper button.callsButton,
  div.MOD_HOMEPAGE_BANNER div.button-wrapper button.portalButton {
      width: 17.94rem;
  }
}
  
div.MOD_HOMEPAGE_BANNER div.button-wrapper button.callsButton,
div.MOD_HOMEPAGE_BANNER div.button-wrapper button.portalButton {
	padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 2.618rem;
    padding-right: 2.618rem;
    font-size: 1.3rem;
    margin-top: 1.618rem;
    margin-bottom: 1.618rem;
    margin-right: 2.618rem;
    margin-left: 2.618rem;
  	border: 0;
}

@media screen and (max-width: 400px) {
	div.MOD_HOMEPAGE_BANNER div.button-wrapper button.callsButton,
	div.MOD_HOMEPAGE_BANNER div.button-wrapper button.portalButton {
		margin-right: auto;
		margin-left: auto;
	}
}
 
.metismenu.mod-menu .metismenu-item>a, .metismenu.mod-menu .metismenu-item>button, .metismenu.mod-menu .metismenu-item>span {
	white-space: pre-wrap;
}

@media screen and (min-width: 1420px) {
  div.fullwidth-outer-wrapper,
  div.container-banner.full-width {
    width: var(--main-section-width);
    margin-left: auto;
    margin-right: auto;
  }

  div.grid-child.container-nav {
	margin: auto;
	max-width: 1320px;
  }
  
  div.grid-child.container-nav nav.navbar {
	margin-left: auto;
	margin-right: 0;
  }
  
  div.fullwidth-inner-wrapper {
      width: 99.55vw;
      margin-left: -50vw;
      position: relative;
      left: 50%;
  }
  div.container-banner   div.MOD_HOMEPAGE_BANNER div.fullwidth-inner-wrapper {
  	  height: 19.42rem;
  	  background: url(/images/HPCImages/hpc_homepage_background_black.jpg);
      color: white;
  }
}

div.MOD_HOMEPAGE_BANNER div.fullwidth-inner-wrapper,
div.MOD_WHO_WE_ARE div.fullwidth-inner-wrapper {
  padding-top: 2.618rem;
  padding-bottom: 2.618rem;
}

div.site-grid > div.fullwidth-outer-wrapper div.fullwidth-inner-wrapper {
  padding: 0;
}

/* TODO: delete? */
div.container-banner div.outerWrapper {
  position: absolute;
  top: 0;
  height: 29.03rem;
  background: url(/images/HPCImages/new-blue-background.jpg);
  background-size: contain;
  background-position-x: left;
  margin: auto;
  width: 99.55vw;
  background-color: black;
  left: 50%;
  margin-left: -50vw;
  color: white;
  padding-left: 2.618rem;
  padding-right: 2.618rem;
}


div.container-banner div.outerWrapper div.wrapper {
  margin-top: 6.85rem;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

/*****************************						************************************/


/****************		mod who we are				  ***********/

div.MOD_WHO_WE_ARE a {
    color: black;
    text-decoration: none;
}

div.MOD_WHO_WE_ARE .solutionItemsHeading {
	text-align: center;
	margin-top: 0 !important;
    margin-bottom: 1.618rem;
}


div.MOD_WHO_WE_ARE .solutionAreaItem {
	display: block;
    height: 11.09rem;
    width: 11.09rem;
    vertical-align: top;
    margin-left: auto;
	margin-right: auto;
	font-size: 2.618rem;
}
	
div.MOD_WHO_WE_ARE .solutionAreaItem span {
    display: block;
    font-weight: bold;
    margin-top: -35px;
    text-align: center;
    width: min-content;
    margin-left: auto;
    margin-right: auto;
	font-size: 1.5rem;
    line-height: 1.5rem;
}

div.MOD_WHO_WE_ARE .solutionAreaItem a {
	text-decoration: none;
}

div.solutionAreaItem:not(:hover) img {
    box-shadow: 0px 5px 5px 1px lightgray;
    border: 1px solid lightgray;
}

div.MOD_WHO_WE_ARE .container {
	display: flex;
	flex-wrap: wrap;
	padding-left: 2.618rem;
	padding-right: 2.618rem;
}	

div.MOD_WHO_WE_ARE .container {
    display: flex;
    flex-wrap: wrap;
    padding-left: 2.618rem;
    padding-right: 2.618rem;
}

@media screen and (max-width: 615px) {
  div.MOD_WHO_WE_ARE .container {
      padding-left: 8px;
      padding-right: 8px;
  }
}
  
div.MOD_WHO_WE_ARE div.container div.wrapper {
	flex: 2 0;
	margin-bottom: 1.618rem;
	margin-top: 1.618rem;
}

div.MOD_WHO_WE_ARE .summary {
	font-size: 1.5rem;
	margin-left: auto;
	margin-right: auto;
    text-align: center;
}

p.summary.primary {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.618rem;
}

p.summary.secondary {
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.3rem;
}

p.summary.secondary {
  margin-bottom: 1.618rem;
}

p.summary.tertiary {
    margin-bottom: 0;
    font-size: 1.2rem;
    line-height: 1.3rem;
}

div.MOD_WHO_WE_ARE > div.wrapper {
	width: 99.55vw;
    margin-left: -50vw;
    left: 50%;
    position: relative;
	padding-top: 2.618rem;
	padding-bottom: 2.618rem;
}

div.MOD_WHO_WE_ARE div.row {
	width: 100%;
}

div.MOD_WHO_WE_ARE p.summary.tertiary {
    padding-bottom: 1.3rem;
    display: block;
}

/****************		mod bottom links				  ***********/

div.bottomLinksModule div.linksSection > div div.custom_col {
	display: inline-block;
}

div.bottomLinksModule div.linksSection > div div.custom_col:nth-child(2) {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

div.bottomLinksModule div.linksSection div div.custom_col div {
    display: inline-block;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

@media screen and (max-width: 1000px) {
  div.bottomLinksModule div.linksSection div div.custom_col:last-child {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
    
/****************		mod solution areas				  ***********/

div.MOD_SOLUTION_AREAS {
    padding-top: 1.618rem;
    padding-bottom: 1.618rem;
}

div.MOD_SOLUTION_AREAS .solutionAreaItem {
    display: block;
	height: 6.85rem;
	width: 6.85rem;
	vertical-align: top;
	background-color: white;
	margin-left: auto;
	margin-right: 3rem;
	font-size: 1.3rem;
}

div.MOD_SOLUTION_AREAS > div.container > div.wrapper:first-child > div.solutionAreaItem {
	font-size: 1rem;
}

div.MOD_SOLUTION_AREAS > div.container > div.wrapper:nth-child(2) > div.solutionAreaItem {
	font-size: 1rem;
}

div.MOD_SOLUTION_AREAS .solutionAreaItem span {
    display: block;
    font-weight: bold;
    margin-top: -1rem;
    text-align: center;
    width: min-content;
    margin-left: auto;
    margin-right: auto;
}

div.MOD_SOLUTION_AREAS div.container {
	flex-wrap: wrap;
	display: flex;
	align-items: center;
	justify-content: center;
}

div.MOD_SOLUTION_AREAS .wrapper {
	display: inline-block;
	vertical-align: top;
}

div.MOD_SOLUTION_AREAS div.container div.solutionAreaItem {
	margin: 1rem;
}

div.MOD_SOLUTION_AREAS div.container div.solutionAreaItem a {
	text-decoration: none;
    display: block;
    height: 100px;
}

/****************		breadcrumbs				  ***********/

@media screen and (max-width: 1420px) {
  ol.mod-breadcrumbs {
	width: 100vw;
  }
}
  
.mod-breadcrumbs a,
.mod-breadcrumbs span {
    font-size: 1rem;
    color: black;
  	text-decoration: none;
}

.mod-breadcrumbs a:hover span {
	color: red;
  	text-decoration: underline;
}

.breadcrumb-item+.breadcrumb-item:before {
    font-size: 1.3rem;
    color: lightgray;
}

.mod-breadcrumbs span.divider {
  margin-top: 5px;
}

button.mm-toggler:hover::after {
    color: red;
}

/*****************			main content and carousel				********/

@media screen and (max-width: 1420px) {
	div.news-preview {
  		padding-left: 2rem;
    	padding-right: 2rem;
  }
}

div.news-preview {
  padding-top: 1.618rem;
  padding-bottom: 1.618rem;
}

div.news-preview .news-preview-header {
  display: inline-block;
}

.news-preview-header.more-news {
  float: right;
}

.news-preview-header.more-news a {
  color: black;
  text-decoration: none;
}

div.gallery-item img {
  max-height: 200px;
  max-width: 300px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

div.gallery-item a,
div.gallery-item a:hover,
.news-preview-header.more-news a:not(:hover) {
  text-decoration: none;
}

div.article-preview-item a:hover {
    color: red;
}

div.gallery-item a:hover,
div.gallery-item a:hover div {
  color: red;
}

div.gallery-item a:not(:hover) div.description-wrapper {
  color: black;
}

div.description-wrapper {
  text-align: center;
  padding: 1rem;
}

div.gallery-item {
  width: 300px;
  margin: auto;
}

.heading-underline-bar {
  background-color: red;
  width: 65px;
  height: 8px;
  margin-top: 1rem;
  margin-bottom: 2.618rem;
}
	
/* *****************************************/

:root {
  --main-section-width: 1320px;
}


body {
  background-size: initial;
}

div.followUsSection a:hover div p {
  color: black;
}

div.followUsSection a:hover img.divider {
	content: url("/images/HPCImages/red-line-black.png");
}

div.followUsSection a:hover div.linkedinWrapper img {
	content: url("/images/HPCImages/HCP icons_linkedin_black_letters_only.png");
}

@media screen and (min-width: 1420px) and (max-width: 2700px) {
  #news-carousel {
	  max-width: 1415px;    
  }
}

div.container-banner {
  margin-bottom: 0 !important;
  margin-left: auto;
  margin-right: auto;
}

.container-header {
    padding-top: 2px;
    padding-bottom: 2px;
    box-shadow: 2px 3px 3px #00000015;
}

.container-header .metismenu>li.level-1>ul {
    min-width: 20rem;
}

div.container-banner   div.MOD_HOMEPAGE_BANNER div div p:first-child {
	font-size: 2rem;
}
  
div.container-banner   div.MOD_HOMEPAGE_BANNER div div p {
   margin-left: auto;
   margin-right: auto;
   width: fit-content;
   font-size: 2.618rem;
   margin-top: 0.618rem;
   margin-bottom: 0.618rem;
   line-height: 2.618rem;
}
   

@media screen and (min-width: 1000px) {
  div.container-banner div.wrapper span {
    font-size: 4.24rem !important;
  }
}

@media screen and (min-width: 950px) {
  div.carousel-header {
      color: white;
      position: absolute;
      z-index: 100;
      font-size: 6.85rem;
      margin-left: 11.09rem;
      margin-top: 1.618rem;
  }
}

@media screen and (max-width: 949px) {
  div.carousel-header {
      position: absolute;
      color: white;
      z-index: 100;
      font-size: 4.24rem;
      margin-left: 6.85rem;
      margin-top: 0.618rem;
  }
}
  
@media screen and (max-width: 999px) {
  div.container-banner div.wrapper span {
      font-size: 3.24rem !important;
  }
  #news-carousel div.ticker-wrapper div.wrapper {
    max-width: 90vw;
    text-align: center;    
  }
}

@media screen and (max-width: 672px) {
  div.container-banner div.outerWrapper div.wrapper {
     margin-top: 3.85rem;
  }
}
  
.contentSection {
  position: absolute;
}
/*
canvas {
  margin-top: -800px;
}
*/
.mod-custom.banner-overlay {
	display: inline-block;  
}

/*canvas {
  height: 144px !important;
}*/

.metismenu.mod-menu .metismenu-item.active>a,
.metismenu>li.level-1.active>button {
	text-decoration: none;
}

li.active.current > a,
.metismenu.mod-menu .metismenu-item.active>a {
   border-bottom: 2px solid red;
}

@media screen and (max-width: 991.98px) {
  .container-header.position-sticky {
      position: sticky !important;
  }
}
 
div.grid-child.container-below-top {
  	padding-top: 2px;
  	padding-bottom: 2px;
}

@media screen and (min-width: 441px) {
  div.grid-child.container-below-top {
   /*   box-shadow: 2px 3px 3px #00000015; */
  }
}
  
.container-header ul.metismenu.mod-menu li.metismenu-item a {
  	color: black;
}

.container-header .metismenu>li.active>a:after,
.container-header .metismenu>li.active>button:before {
  display: none;
}

.container-header .mod-menu > li:first-child {
	margin-left: auto;
}

.container-header .mod-menu > li {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  padding-bottom: 5px !important;
}
 
div.grid-child.container-nav {
  padding: 0 !important;
}

div.grid-child.container-nav nav.navbar button.navbar-toggler {
	right: 0;
}

div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse > li.deeper.parent > a,
div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse > li ul li.deeper.parent > a {
  	max-width: 75%;
}

div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse > li a,
div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse > li ul li a {
	margin-left: 0;
	text-align: left;
  	max-width: 100%;
	text-wrap: balance !important;
}

@media screen and (max-width: 1420px) {
  div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse > li a,
  div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse > li ul li a {
      margin-left: auto;
      text-align: right;
  }
  
  div.grid-child.container-nav {
    width: 100%;
    margin-top: -4.6rem;
    margin-right: 0;
  }
  
  div.container-topbar nav.navbar div.navbar-collapse ul.mod-menu li.metismenu-item a {
    margin-left: auto;
    text-align: right;
  }
  
  .container-header ul.metismenu.mod-menu li.metismenu-item a {
    margin-right: 0;
    margin-left: auto;
  }
}

@media screen and (max-width: 1420px) and (min-width: 616px) {
  div.navbar-collapse ul.mod-menu li.metismenu-item button {
    margin-left: 2rem;
  	margin-right: 2rem;
  }
}

@media screen and (max-width: 615px) {
  div.navbar-collapse ul.mod-menu li.metismenu-item button {
      margin-left: auto;
      margin-right: 2rem;
      height: 100px;
    }
}


div.container-topbar nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse {
	width: 50rem;
  
}

@media screen and (max-width: 1420px) {
  div.container-nav nav.navbar div.collapse ul.metismenu.mod-menu {
      width: 85vw;
  }
  div.container-nav nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse {
      width: 100%;
  }
}

header {
  background-color: white !important;
}

header, div.container-topbar, div.container-banner {
  background-color: white;
}

header, div.container-topbar {
  background: white !important;
}

div.container-topbar,
div.footer,
div.mod-custom111 div.container {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--main-section-width);
}

div.container-topbar {
  height: 4.85rem;
  max-width: var(--main-section-width);
}


@media screen and (max-width: 440px) {
	header div.grid-child.container-nav {
		/* margin-top: -120px;*/
	}
	div.container-topbar form.mod-finder {
		display: none;
		clear: both;
	}
	div.grid-child.container-below-top {
		box-shadow: 0;
	}
}

@media screen and (max-width: 615px) {
	button.navbar-toggler.navbar-toggler-right {
		margin-right: -35px;
	}
}

@media screen and (min-width: 441px) {
  header div.grid-child.container-nav {
      display: block;
  }
}

@media screen and (min-width: 441px) {
  div.container-topbar nav.navbar,
  div.container-topbar form.mod-finder {
      margin-top: 22px;
  }
}
    
div.container-topbar nav.navbar,
div.container-topbar form.mod-finder {
	float: right;
}

div.container-topbar nav.navbar {
	display: inline-block;
}

div.container-topbar nav.navbar {
	display: inline-block;
	margin-top: 22px;
	float: right;
}

@media screen and (max-width: 1420px) and (min-width: 615px) {
  div.container-topbar form.mod-finder {
    margin-right: 70px;
  }
}

div.container-topbar div.mod-custom {
	height: 6rem;
}

nav.navbar ul.mod-menu a {
    font-size: 1rem;
}


.mod-menu .metismenu-item {
  color: black;
}

@media screen and (max-width: 1420px) {
  li.metismenu-item {
    min-height: 8.236rem !important;
  }
}

@media screen and (max-width: 1420px) and (min-width: 615px) {
  div.container-topbar {
    margin-right: 3.236rem;
    margin-left: 3.236rem;
  }
}

@media screen and (max-width: 615px) {
  div.container-topbar {
    margin-right: 1rem;
    margin-left: 1rem;
  }
}

div.container-topbar nav.navbar-expand-md {
    margin-top: 2.618rem !important;
}

div.container-topbar div.mod-custom img {
	width: 121px;
	height: auto;
    margin-top: 1rem;
}

@media screen and (max-width: 540px) {
  div.container-topbar div.mod-custom img {
    width: 60px;
  	margin-top: 1.618rem;
  }
}

.mod-finder.form-search .awesomplete input {
	width: 17.94rem;
    height: 2.618rem;
}

div.container-topbar form.mod-finder div.awesomplete input {
    border-radius: 0.25rem 0 0 0.25rem;
}

.mod-finder.form-search .awesomplete input,
.mod-finder button, .com-finder__search button[type="submit"] {
	border: 2px solid #00000035;
}

div.sidebar-left div.mod-finder__search button {
  margin-top: 1rem;
}


nav.navbar div.navbar-collapse ul.mod-menu {
/*	margin-right: 2rem; */
}

.container {
  padding-right: 0;
  max-width: var(--main-section-width);
}

/* override */
/*@media (max-width: 1575px) {
  .navbar-expand-md .navbar-toggler, .navbar-expand-md .offcanvas-header {
      display: block !important;
  }
  
  .navbar-expand-md .navbar-collapse.collapse:not(.show) {
  	  display: none !important;
  }
}*/

@media screen and (max-width: 1420px) and (min-width: 400px) {
  div.container-topbar div.banner-overlay {
    margin-right: 3.296rem;
  }
}

@media screen and (max-width: 400px) {
  div.container-topbar div.banner-overlay {
    margin-right: 0;
  }
}

@media screen and (max-width: 1420px) {
  div.container-topbar nav.navbar button.navbar-toggler {
  	  margin-left: auto;
      display: block !important;
  }
  div.container-topbar div.banner-overlay {
    float: left;
  }
  div.container-topbar nav.navbar div.navbar-collapse:not(.show) {
    display: none !important;
  }
 
  header.container-header ul.mod-menu {
    display: block;
  }  
  
  div.container-topbar ul.mod-menu li.metismenu-item ul {
    right: 0;
    width: 90vw;
  }
  div.container-topbar ul.mod-menu li.metismenu-item ul a {
    white-space: normal;
  }
  div.container-topbar ul.mod-menu li.metismenu-item {
  	padding-top: 1.618rem;
  	padding-bottom: 1.618rem;
  }
  div.container-topbar ul.mod-menu li.metismenu-item button {
  	width: 5.236rem;
    text-align: center;
    height: 5.236rem;
  }
  div.container-topbar ul.mod-menu li.metismenu-item button:after {
  	margin-left: auto;
    margin-right: auto;
  }

  button.navbar-toggler.navbar-toggler-right {
    display: block;
    top: 0;
    position: absolute;
    height: fit-content;
  }
  
  div.grid-child.container-nav,
  div.grid-child.container-nav nav.navbar {
    right: 0;
    position: absolute;
    margin-right: 1.618rem;
  }

}

/* added for mobile */ 
@media screen and (max-width: 615px) {
  header {
    /*height: 160px; */
    height: 80px;
  }
}

/* added for mobile */ 
@media screen and (max-width: 615px) and (min-width: 441px) {
  header div.grid-child.container-nav {
  /*  margin-top: 15px; */
    height: 40px;
  }
  /* for showing the search bar only when menu opened on mobile */
  header form.mod-finder.js-finder-searchform.form-search {
    display: none;
  }
  .container-header .navbar-collapse.show {
    margin-top: 120px; 
  }
}


header.container-header.mobile-nav-open-for-searchbar {
  height: 160px;
}

header form.mod-finder.js-finder-searchform.form-search.mobile-nav-open-for-searchbar {
    float: left;
    margin-top: 70px;
    position: absolute;
    z-index: 10000;
    display: block !important;
    right: 4rem;
}

.container-header .container-nav nav {
  margin-top: 0;
}
/*  */

.connectionItem a {
   /* color: black !important;*/
}

/*
.connectionItem {
    font-size: 18px;
}
*/

@media screen and (min-width: 441px) {
  .connectionItem img {
	width: 51px;
  }
}
  
@media screen and (max-width: 440px) {
  .connectionItem img {
	width: 36px;
  }
}
  
.connectionItem img {
    margin-top: -8px;
}

.phoneNumWrapper img {
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}

div.phoneNumWrapper, div.emailWrapper {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

@media screen and (min-width: 440px) {
  .followUsLabelWrapper * {
      padding: 1rem;
  }
}
    
@media screen and (max-width: 440px) {
  .followUsLabelWrapper * {
      padding-top: 1rem;
      padding-bottom: 1rem;
      padding-left: 8px;
      padding-right: 0;
  }
}

.followUsLabelWrapper * {
	font-size: 1.3em;
	color: white;
}

div.getConnectedSection h2 {
    margin-bottom: 2rem;
}

.MOD_GET_CONNECTED.largescreen .getConnectedSection h2,
.MOD_GET_CONNECTED.largescreen .getConnectedSection .followUsSection {
	display: inline-block;
}

.MOD_GET_CONNECTED.largescreen .getConnectedSection .followUsSection {
	float: right;
}

.visitProceduresWrapper {
	text-decoration: underline;
}

.MOD_GET_CONNECTED th {
    font-size: 1.5rem;
}

.MOD_GET_CONNECTED tr {
    height: 1rem;
}

.MOD_GET_CONNECTED tr td {
    background-color: white !important;
    padding: 0;
    height: 1rem;
}


@media screen and (max-width: 999px) {
	.MOD_GET_CONNECTED.largescreen {
	  display: none;
	}
	.MOD_GET_CONNECTED.smallsscreen {
	  display: block;
	}
}

@media screen and (min-width: 1000px) {
	.MOD_GET_CONNECTED.smallscreen {
	  display: none;
	}
	.MOD_GET_CONNECTED.largescreen {
	  display: block;
	}
}

@Media screen and (max-width: 600px) {
	.smallscreen .followUsSection {
		margin-left: auto;
		display: block;
		margin-right: auto;
		max-width: 381px;
		min-width: 381px;
	}

	.smallscreen .followUsLabelWrapper {
		width: auto;
	}
}

.smallscreen .get_connected_table div.contact p{
	margin-top: 1.5rem;
}

.smallscreen .get_connected_table div.contact {
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center;
    margin-bottom: 6rem;
}

.smallscreen .visitProceduresWrapper {
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 2rem;
	display: block;
}

.smallscreen .followUsSection {
    margin-left: auto;
    display: block;
    clear: both;
    width: 100px;
    margin-top: 1rem;
}

.MOD_GET_CONNECTED .get_connected_table {
	width: 100%;
	margin-top: 2rem;
}

.MOD_GET_CONNECTED .get_connected_table table {
	width: 100%;
}

.MOD_GET_CONNECTED .get_connected_table img {
    width: 3rem;
}

img.website-icon {
  width: 2rem !important;
}

@media screen and (min-width: 441px) {
  div.MOD_GET_CONNECTED {
    padding-left: 2.618rem;
    padding-right: 2.618rem;
  }
}
      
@media screen and (max-width: 440px) {
  div.MOD_GET_CONNECTED {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

div.MOD_GET_CONNECTED {
  padding-top: 1.618rem;
  margin: auto;
  max-width: var(--main-section-width);
  display: flex;
  flex-wrap: wrap;  
}

div.getConnectedSection {
	flex: 1 0 0;
}

@media screen and (max-width: 810px) {
	div.followUsSection {
	  margin-top: 2.618rem;
  }
}

@media screen and (min-width: 441px) {
	div.followUsSection {
    	min-width: 508px;
        max-width: 508px;
        margin-right: 100px;
  	}
}
  
div.followUsSection {
    flex: 1 0 0;
    background-color: #bf3825;
    height: max-content;
}


@media screen and (min-width: 441px) {
  div.followUsSection img.divider {
      margin-top: -8px;
  }
}

@media screen and (max-width: 441px) {
  div.followUsSection {
    min-width: 100%;
  }
}

div.followUsSection img.divider {
    display: inline-block;
	margin-top: -8px;
    display: inline-block;
}

div.MOD_GET_CONNECTED BUTTON.visitProceduresWrapper {
	border: 1px solid gray;
    background-color: white;
    text-align: center;
    width: 17.94rem;
    border-radius: 10px;
    text-decoration: none;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    margin-top: 1.618rem;
}
  
div.MOD_GET_CONNECTED p {
  margin-bottom: 0;
}

div.followUsLabelWrapper, div.linkedinWrapper, div.twitterWrapper {
    display: inline-block;
}

div.followUsLabelWrapper {
    width: 380px;
}

div.linkedinWrapper.connectionItem {
    margin-left: 35px;
}

/*********************			finder		*/


.mod-finder button, .com-finder__search button[type="submit"] {
    width: 2.618rem;
    background-color: #0F5c90;
  	border: 2px solid #00000035;
    background-image: url("/images/HPCImages/HCP hourglass_icon_image_red.png");
    background-size: cover;
    color: #0F5c90;
    height: 2.618rem;
    font-size: 0px;
    cursor: pointer;
}

.mod-finder button {
	float: right;
}

.mod-finder button:hover {
  background-blend-mode: screen;
}

/* Finder button for search screen. need to hide because filter does not work */
div#finder-filter-window {
  display: none;
}

/*************************					*/

div.container-banner div.mod-custom {
    color: black;
}


/************************		main content			*/

button.navbar-toggler {
  color: black !important;
  border-color: black !important;
}

div.grid-child.container-top-b div.top-b.no-card {
	width: 100%;
}

@media screen and (min-width: 1420px) {
  div.site-grid {
    width: var(--main-section-width);
  }
}

@media screen and (min-width: 1420px) {
  div.site-grid {
    margin-left: auto;
    margin-right: auto;
  }
   
  div.container-top-a {
	grid-area: initial; 
  }
}

div.grid-child.container-top-a div.top-a {
  margin-top: 0;
}

div.grid-child.container-top-b {
    background-color: #efefef;
    text-align: center;
}

div.bottom-a h3 {
  margin-top: 1.618rem;
  margin-bottom: 2.618rem;
}

div.grid-child.container-top-a h3 {
  margin-top: 4.296rem;
  margin-bottom: 1.618rem;
}

div.container-bottom-a h4 {
  margin-bottom: 1.618rem !important;
  margin-top: 4.296rem !important;
}

div.grid-child.container-top-a h3 {
  font-size: 2.618rem;
}

div.grid-child.container-top-a div.top-a h3 {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
}

div.bottom-a ul.mod-articlescategory,
.MOD_WHO_WE_ARE .container,
.MOD_SOLUTION_AREAS .container {
  max-width: 76rem;
}

@media screen and (max-width: 880px) {
  div.MOD_WHO_WE_ARE div.container div.wrapper {
      flex: 45%;
      margin-bottom: 2.618rem;  
  }
  
  div.MOD_WHO_WE_ARE div.wrapper div.container div.row div.container {
      max-width: 37rem;  
  }
}

div.container-bottom-a {
  margin-bottom: 3.296rem;  
}

div.container-bottom-a a {
  color: black;
  text-decoration: none;
}

@media screen and (max-width: 768px) {
	div.container-component {
		grid-area: comp;
	}
}

@media screen and (max-width: 1420px) {
	nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse {
		background-color: white;
      	border: 1px solid black;
        position: absolute;
	}
  
    nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse li ul.mm-collapse,
  	div.sidebar-left div.card-body nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse.mm-show {
        margin-left: -1rem;
    }
   nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse li ul.mm-collapse {
  	    margin-top: 150px;
    }
    div.sidebar-left div.card-body nav.navbar div.collapse ul.metismenu.mod-menu li ul.mm-collapse.mm-show {
        margin-top: 200px;
    }
}

@media screen and (max-width: 1420px) {
  div.sidebar-left ul.mod-menu li.metismenu-item {
      padding-top: 1.618rem;
      padding-bottom: 1.618rem;
  }

  div.sidebar-left ul.mod-menu li.metismenu-item button {
      width: 5.236rem;
      text-align: center;
      height: 5.236rem;
  }
  
  div.sidebar-left ul.mod-menu li.metismenu-item button:after {
    margin-left: auto;
    margin-right: auto;
  }
  
  div.sidebar-left > div > nav > div > ul.mod-menu > li.metismenu-item {
    padding-right: 0;
	padding-left: 0;
  }
  
  .collapse:not(.show) {
    display: none !important;
  }
    
  div.navbar-collapse.show {
    margin-top: 2.618rem;
    display: block !important;
    background-color: white;
  }
  
  div.sidebar-left div.card-body nav.navbar.navbar-expand-md {
    -webkit-box-align: start;
    display: block;
  }
}

/* Fix for the side menu overlapping the logo */
.metismenu.mod-menu .metismenu-item>ul {
  z-index: 9;
}

@media screen and (max-width: 1420px) {
  .site-grid {
      grid-template-areas:
          ". banner banner banner banner ."
          ". top-a top-a top-a top-a ."
          ". top-b top-b top-b top-b ."
          ". side-l side-l side-l side-l ."
          ". comp comp comp comp ."
          ". bot-a bot-a bot-a bot-a ."
          ". bot-b bot-b bot-b bot-b ." !important;
  }
}
  
/* articles pages */

div.com-content-article div.page-header {
    margin-bottom: 2.618rem;
    margin-top: 1rem;
}

@media screen and (max-width: 1420px) {
  .com-content-article__body ul li {
      margin-top: 1rem;
      margin-bottom: 1rem;
  }
}

@media screen and (max-width: 1420px) {
  .com-content-article__body ul li {
      line-height: 2.618rem;
  }
  
  .com-content-article__body p {
      line-height: 2.618rem;
  }
}

/************************		site links/footer		*/


@media screen and (max-width: 1230px) {
  div.bottomLinksModule div.linksSection > div div.custom_col span.divider {
      display: none;
  }
}

footer.container-footer div.grid-child > div.mod-custom div.logos {
	max-height: 225px;
}

@media screen and (max-width: 1050px) {
	footer.container-footer div.grid-child > div.mod-custom {
		flex-direction: column;
	}
}

footer.container-footer.footer .grid-child {
   background-color: white;
   padding-top: 0;
   padding-bottom: 0;
}

footer.container-footer.footer .grid-child .footer {
  color: black;
  background-color: white;
  flex: 1;
}

.footer {
  background-color: black;
  background-image: none;
}

@media screen (min-width: 875px) {
	footer.container-footer div.grid-child > div.mod-custom {
		margin-top: 29rem;
	}
}

@media screen (min-width: 737px) and (max-width: 874px) {
	footer.container-footer div.grid-child > div.mod-custom {
		margin-top: 31rem;
	}
}

@media screen and (max-width: 736px) {
	footer.container-footer div.grid-child > div.mod-custom {
		margin-top: 33rem;
	}
}

@media screen and (min-width: 441px) {
  footer.container-footer div.grid-child > div.mod-custom p {
      display: inline-block;
  }
}

@media screen and (max-width: 440px) {
  body.wrapper-fluid footer > .grid-child {
      padding-left: 0;
      padding-right: 0;
  }
}

@media screen and (max-width: 440px) {
  footer {
	padding-left: 1rem;
	padding-right: 1rem;
  }
  footer.container-footer div.grid-child > div.mod-custom p {
      display: block;
      max-width: max-content;
      margin: auto;
  }
}
  
footer.container-footer div.grid-child > div.mod-custom p.disclaimer {
    vertical-align: middle;
}

footer.container-footer div.grid-child > div.mod-custom {
    max-width: var(--main-section-width);
    margin: auto;
    padding-top: 1.618rem;
    display: flex;
}

@media screen and (min-width: 1048px) {
  footer.container-footer div.grid-child > div.mod-custom div.logos {
      flex: 0 0 315px;
  }
}

footer.container-footer div.grid-child {
	display: block;
}

div.bottomLinksModule div.fullwidth-inner-wrapper {
    background-color: #efefef;
  	color: black;
    width: 99.55vw;
    margin-left: -50vw;
    position: relative;
    left: 50%;
}

@media screen and (max-width: 1420px) {
  div.bottomLinksModule div.fullwidth-inner-wrapper {
      padding-left: 1.618rem;
      padding-right: 1.618rem;
  }
}

.linksSection {
    font-size: 1.3rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

div.fullwidth-inner-wrapper div.dividerLine {
  border-top: 1px solid gray;
}

.linksSection a {
    padding-left: 1rem;
    padding-right: 1rem;
  	text-decoration: none;
}

div.linksSection, div.contact-info {
  max-width: var(--main-section-width);
  margin: auto;
}

div.container-bottom-b {
  color: white;
  background-color: black;
}

div.container-bottom-b a {
	color: white; 
}

/*************************		Footer/disclaimer/contact			*/


@media screen and (max-width: 1000px) {
	div.mod-custom div.contact-info {
    	display: block;
      	margin-bottom: 1.618rem;
	}
  	div.mod-custom div.contact-info,
  	div.mod-custom div.logo-disclaimer {
      max-width: 100%;
	}
  
    div.logo-disclaimer div.wrapper {
		width: 335px;
		height: 115px;
        margin: auto;
	}

	div.logo-disclaimer div.wrapper img:first-child {
		margin-right: 60px;
	}
}

div.mod-custom div.contact-info span,
div.mod-custom div.contact-info span a,
div.mod-custom div.logo-disclaimer span,
div.mod-custom div.logo-disclaimer span a {
  color: white !important;
}

@media screen and (max-width: 440px) {
  body > :last-child {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 1rem;
  }  
}

body > :last-child {
  background-color: white;
  display: flex;
}

body > :last-child .logo-disclaimer, body > :last-child .contact-info {
  /* display: inline-block; */
  flex: 1;
}

.contact-info {
      padding-top: 1rem;
    padding-bottom: 1rem;
}

div.contact-info p:first-child {
	font-weight: bold; 
}

body > :last-child .contact-info span {
  font-size: 1rem !important;
}

.contact-info, .logo-disclaimer {
  /* max-width: 49%;
  width: 100%; */
}

/****************************			success stories page  ***************************/

div.com-content-category-blog__item.blog-item figure.left.item-image {
    width: 100%;
}

@media screen and (max-width: 585px) {
  div.com-content-category-blog.blog h1 {
      text-align: center;
  }

  div.com-content-category-blog.blog div.com-content-category-blog__items.blog-items {
      margin: auto;
      width:247px;
  }
}
  
div.blog-item figure.item-image img {
  height: 152px;
}

div.blog-item div.item-content {
  display: block;
  height: 130px;
  position: absolute;
  bottom: 0;
}

div.blog div.blog-items {
  display: block !important;
}

div.blog-item {
    display: inline-block;
    margin: 0.5em;
    width: 231px;
    height: 295px;
    border: 1px solid black;
	box-shadow: 1px 1px 10px 0px #909090;
  padding-top: 0;
  vertical-align: top;
  position: relative;
}

div.blog-item figure {
	margin-top: 0 !important;
}

div.blog-item figure.item-image a img {
	min-width: 100%;
    min-height: 149px;
    margin-bottom: 1em;
}

div.blog-item figure.item-image {
	margin-bottom: -10px;
}

/*
div.blog-item figure.item-image a {
    min-width: 100%;
    min-height: 149px;
	margin-bottom: 1em;
}
*/

div.blog-item div.item-content div.page-header h2 {
    padding-left: 1rem;
    padding-right: 1rem;
	font-weight: bold;
	font-size: 1rem;
  	color: black;
  width: 100%;
  display: block;
}

div.blog-item div.item-content p {
    font-size: 0.81rem;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-bottom: 0 !important;
}

/****************** success stories preview *******************/

@media screen and (max-width: 1000px) {
	ul.mod-articlescategory {
	  max-width: 31rem !important;
      flex-wrap: wrap;
	}

	.mod-articlescategory > div {
		flex: 45% !important;
	}

	ul.mod-articlescategory li {
		display: block !important;
	}
}

.mod-articlescategory > div {
  margin-right: auto;
  margin-left: auto;
}

div.bottom-a ul.mod-articlescategory {
  margin: auto;
}

div.bottom-a ul.mod-articlescategory img.image_intro {
    height: 152px;
    max-width: 100%;
    width: 100%;
}

div.bottom-a ul.mod-articlescategory div.item-content > a.mod-articles-category-title {
	font-weight: bold;
    font-size: 1rem;
    line-height: 1.2 !important;
    text-decoration: none;
}

div.bottom-a ul.mod-articlescategory p.mod-articles-category-introtext,
div.bottom-a ul.mod-articlescategory p.mod-articles-category-readmore {
	font-size: 0.81rem;
}

div.bottom-a ul.mod-articlescategory p.mod-articles-category-readmore > a {
	text-decoration: none;
}

div.bottom-a ul.mod-articlescategory div.item-content {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.4rem;
}

div.blog-item, div.bottom-a ul.mod-articlescategory li {
    display: inline-block;
    margin: 0.5em;
    width: 231px;
    height: 295px;
    border: 1px solid black;
	box-shadow: 1px 1px 10px 0px #909090;
  padding-top: 0;
  vertical-align: top;
  position: relative;
}

div.bottom-a ul.mod-articlescategory li {
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 1420px) {
  div.grid-child.container-sidebar-left ul.mod-menu {
    margin-left: -3rem;
  }
}
  
.sidebar-left.card {
  border: 0;
}

.sidebar-left.card div.card-body {
  padding: 0;
}

div.sidebar-left ul.mod-menu li.metismenu-item a {
	max-width: 90%;
  	min-width: 125px;
}

@media screen and (max-width: 1420px) {
  ul.mod-menu li.metismenu-item a {
      font-size: 1.3rem;
  }
}


div.sidebar-left .metismenu.mod-menu .metismenu-item > button {
	color: rgb(34, 79, 170)
}

.metismenu.mod-menu .metismenu-item {
     max-width: 95vw;
}

.sidebar-left .metismenu .metismenu-item>a {
    color: black;
}

/**** tables for content , expecially the restricted site *****/

div.com-content-article table {
    width: auto !important;
}

/********************				newsroom page			****************/

/* HPC Insights - Magazines INLINE */
#hpc-insights {
	display: inline-block;
    padding: 0;
}

#hpc-insights li {
  display: inherit;
  margin-left: 10px;
  margin-right: 10px;
}

table.magLatest tbody tr td:nth-child(2) {
  padding: 1.618rem;
}

/********************							****************/

@media screen and (max-width: 440px) {
  .osmap-items ul {
      margin: 0 0 9px 3px !important;
  }  
}

/* For jumping to sections of the page */

a[name="Part1"],
a[name="Part2"],
a[name="Part3"],
a[name="Part4"],
a[name="Part5"],
a[name="Part51"],
a[name="Part52"],
a[name="Part6"],
a[name="Part7"],
a[name="Part8"],
a[name="p1"],
a[name="p2"],
a[name="p3"],
a[name="p4"], 
a[name="p5"],
a[name="p6"],
a[name="p7"],
a[name="p8"],
a[name="p9"],
#one,
#two,
#three,
#four,
#five,
a[name="one.1"],
a[name="one.2"],
a[name="one.3"],
a[name="one.4"],
a[name="one.5"],
a[name="one.6"],
a[name="one.7"],
a[name="one.8"],
a[name="one.9"],
a[name="one.10"],
a[name="one.11"],
#c1,
#c2,
#c3,
#c4,
#c5,
#c6,
#c7,
a[name="s1"],
a[name="s2"],
a[name="s3"],
a[name="s4"],
a[name="s5"],
a[name="s6"],
a[name="s7"],
a[name="s8"],
#part21,
#part22,
#part23,
#part24,
#part25,
#part26,
a[name="part1"],
a[name="part2"],
a[name="part3"],
a[name="part4"],
a[name="part5"],
#part51,
#part52,
a[name="part6"],
a[name="part7"],
a[name="one"],
a[name="two"],
a[name="three"],
a[name="four"],
a[name="five"],
a[name="six"],
#s1,
#s11,
#s12,
#s13,
#s14,
#s141,
#s142,
#s143,
#s14,
#s2,
#s3,
#s4,
#s5,
#s6,
#s7,
#s71,
#s72,
#s73,
#s74,
#s75,
#s8
{
    padding-top: 126px;
    margin-top: -126px;
    display: block;
}

/*******************************    For a specific article, custom styles */

.container.responsive-within-article {
	max-width: 100%;
	margin: 0 auto;
	padding: 0px;
}

.responsive-within-article .lists-wrapper {
	display: flex;
	gap: 40px;
}

.responsive-within-article .list-column {
	flex: 1;
}

.responsive-within-article .lists-wrapper {
	flex-direction: row;
}

/* media query style logic inside of js */

.responsive-within-article ul {
	list-style-type: disc;
	padding-left: 20px;
}

.responsive-within-article li {
	margin-bottom: 8px;
}