/*-- STICKY HEADER STYLES --*/

header .navbar{
  padding:0;
  justify-content: right;
  align-items: center;
  display: grid;
}

.maxw {
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
}

.maxw-smaller {
  max-width: 1080px; 
}

.grid-2 {
  display: grid;
  grid-template: "col1 col2" auto / 1fr 1fr;
  grid-gap: 0px;
}

.header-columns {
  display: grid;
  grid-template-columns:1fr max-content;
}

.header {
  position: relative;
  width: 100%;
  box-shadow: 0 0 10px -4px;
  top:0;
  background:#fff; /*#014195*/
  transition: all .15s ease-out;
  padding: 0 20px;
}

.logo-flex-col{flex: 0 0 220px;}

body {
  font-weight: 400;
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color:#414141;
  background:#fff;
  font-size: 1.8rem;
}

a, a:hover, a:visited,a:hover {color:#4b8ad6;text-decoration:none;}
a:hover {color:#539de6;}

h1,h2,h3,h4 {
  font-family: 'Cabin', sans-serif;;
  font-weight: normal;
}

h1 {font-size: 4.7rem;margin: 1rem 0 2rem 0;}
h2 {font-size: 3.8rem;margin: 1rem 0 2rem 0;}
h3 {font-size: 3.0rem;margin: 1rem 0 2rem 0;}

p{color: #2d2d2d;}
footer p{color:#b9b9b9;}

main {
  padding:0;
  min-height: 87vh;
  max-width:1280px;
  margin:20px auto 30px auto;
  padding:50px 20px;
}


footer {
  color:#fff;
  background:#001A3C;
  position:relative;
}

footer.footer-big .navbar {padding:10rem 20px 5rem 20px;}
footer .navbar {padding:20px;}
.footer-bg{
  background:url(../jpg/footer-bg30f4.jpg) no-repeat center;
  background-size:cover;
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0;
}
.footer-bg-overlay{
  background:#004AABA8;
  color: #fff;
  width: 100%;
  position: relative;
  z-index: 100;
}
.footer-logo-row{
  width:100%;
  display:block;
  padding:5rem 20px 10rem 20px;
}

.logo
{
  display: block;
  min-height:80px;
  background:url(../svg/integra-logo-2020-site.svg) center left no-repeat;
}

.logo-flex-col a
{
  text-align: left;
  font-size: 3rem;
  padding-left: 10px;
  color:#fff;
}

footer .logo-flex-col a
{
  text-align: right;
  font-size: 3rem;
  padding-left: 10px;
  color:#fff;
}
footer .footer-grid-col{padding: 100px 20px;}
.sticky-header .logo-flex-col a{color:#242424;}

.logo img {
  height: 45px;
  opacity: 1;
  width: auto;
  object-position: center center;
  display: block;
  padding: 20px 20px;
  will-change: size;
  transition: all .15s ease-out;
}

.tagline
{
  color:#929292;
  text-align:center;
  padding:8px;
}

/*Basic 2 column (flex based) layout
Must go after the flex column structure*/
.main_col_small {flex: 0 0 375px;min-width:375px;flex-basis:375px;}
.main_col_large {flex-basis: -webkit-fill-available;flex-basis: -moz-available;flex-basis: fill;}
.main_col_large.large_col_right {padding-left:40px;}
.main_col_large.large_col_left {padding-right:40px;}

.grid-center{
  display: grid;
  justify-items: center;
  align-items: center
}
.grid-2 {
  display: grid;
  grid-template: "col1 col2" auto / 1fr 1fr;
  grid-gap: 0px;
}
.grid-2-r {
  display: grid;
  grid-template: "col1 col2" auto / 1fr 1.5fr;
  grid-gap: 70px;
  padding: 5rem 10px;
}
.grid-2-l {
  display: grid;
  grid-template: "col1 col2" auto / 1.5fr 1fr;
  grid-gap: 70px;
  padding: 5rem 10px;
}
.grid-3{
  display: grid;
  grid-template: "col1 col2 col3" auto / 1fr 1fr 1fr;
  grid-gap: 20px;
}
.grid-4{
  display: grid;
  grid-template: "col1 col2 col3 col4" auto / 1fr 1fr 1fr 1fr;
  grid-gap: 20px;
}


@media (max-width: 960px){
  main {padding: 0 20px;}
  .grid-2 {grid-template: "col1" auto / 1fr;}
  .grid-2-r {grid-template: "col1" auto / 1fr;grid-gap:0px;padding: 30px 10px;}
  .grid-2-l {grid-template: "col1" auto / 1fr;grid-gap:0px;padding: 30px 10px;}
  .grid-3 {grid-template: "col1" auto / 1fr;}
  .grid-4 {grid-template: "col1" auto / 1fr;}
  .main_col_small {padding:0;flex: 1 1 auto;-webkit-box-flex: 1 1 auto;min-width:100px;order:2; /*small columns should go after large columns in mobile*/}
  .main_col_large,.main_col_large.large_col_left,.main_col_large.large_col_right {padding:0;}
  /* Mobile devices breakpoint */
  header {padding-top: 0;}
  .header {padding: 0 10px;}
  .header-columns {grid-template-columns: 1fr 60px;}
  .logo-flex-col a {max-width: 350px;}
  h1 {font-size: 4rem;}
  h2 {font-size: 3.5rem;}

  footer .footer-grid-col .text-align-right{text-align: center !important;}
}