/* 1a. Containers */


  



    





  


/* 1b. Colors */







/* 1c. Typography */































.content-wrapper {
  max-width: 1280px;
}

.dnd-section {
  padding: 40px 20px;
}

.dnd-section > .row-fluid {
  max-width: 1280px;
}p, .be-module-richtext li, .text_shade--normal, .text_shade--normal p, .text_shade--normal li  {
  color: #64748B;
  font-size: 1.125rem; line-height: 1.75rem; 
}



.text_shade--light, .text_shade--light p, .text_shade--light li { color: #E2E8F0 }
.text_shade--light a {color: #F1F5F9  }
.text_shade--light a:hover {color: #CBD5E1  }
.text_shade--dark, .text_shade--dark p { color: #1E293B }

h1 {
  color: #1692FF;
  text-transform: none;
  font-size: 3rem; line-height: 1;
}

h2 {
  color: #64748B ;
  text-transform: none;
  font-size: 2.25rem; line-height: 2.5rem;
}

h3 {
  color:#64748B ;
  text-transform: none ;
  font-size: 1.875rem; line-height: 2.25rem;
}

h4 {
  color: #64748B ;
  text-transform: none ;
  font-size: 1.5rem; line-height: 2rem;
}

h5 {
  color: #64748B ;
  text-transform: none ;
  font-size: 1.125rem; line-height: 1.75rem; 
}

h6 {
  color: c ;
  text-transform: none ;
  font-size: 3rem; line-height: 1;
}

a {
  color: #1692FF ;
  text-transform: none ;
}

a:hover {
  color: #003C70;
  text-transform: none;
}

a:focus, a:active {
  color: #0075DB ;
  text-transform: none ;
}


@media (max-width: 767px) {
  p {
    font-size: 1rem; line-height: 1.5rem; 
  }
  
  h1 {
    font-size: 1.5rem; line-height: 2rem;
  }
  
  h2 {
    font-size: 1.5rem; line-height: 2rem;
  }
  
  h3 {
    font-size: 1.25rem; line-height: 1.75rem;
  }
  
  h4 {
    font-size: 1.125rem; line-height: 1.75rem; 
  }
  
  h5 {
    font-size: 1rem; line-height: 1.5rem; 
  }
  
  h6 {
    font-size: 1.5rem; line-height: 2rem;
  }
  
}




.brand--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text) { color: #1692FF; }
.gray--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text) { color: #64748B; }
.accent-alpha--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text)  { color: #43C9C9; }
.accent-beta--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text)  { color: #F0B429; }
.accent-gamma--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text)  { color: #653CAD; },
.accent-delta--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text)  { color: #E12D39; }
.accent-epsilon--500 :is(h1, h2, h3, h4, h5, h6, a, span.hs_cos_wrapper_type_text)  { color: #DA127D; }





:is(h1, h2, h3, h4, h5, h6).brand--500 {  color: #1692FF !important; }
:is(h1, h2, h3, h4, h5, h6).gray--500  { color: #64748B !important; }
:is(h1, h2, h3, h4, h5, h6).accent-alpha--500   { color: #43C9C9 !important; }
:is(h1, h2, h3, h4, h5, h6).accent-beta--500   { color: #F0B429 !important; }
:is(h1, h2, h3, h4, h5, h6).accent-gamma--500   { color: #653CAD !important; },
:is(h1, h2, h3, h4, h5, h6).accent-delta--500   { color: #E12D39 !important; }
:is(h1, h2, h3, h4, h5, h6).accent-epsilon--500   { color: #DA127D !important; }



.text-xs { font-size: 0.75rem;  line-height: 1rem;   }
.text-sm { font-size: 0.875rem;  line-height: 1.25rem; }
.text-base { font-size: 1rem; line-height: 1.5rem;  }
.text-lg { font-size: 1.125rem; line-height: 1.75rem;   }
.text-xl { font-size: 1.25rem; line-height: 1.75rem;  }
.text-2xl { font-size: 1.5rem; line-height: 2rem;  }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem;  }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem;  }
.text-5xl { font-size: 3rem; line-height: 1;  }
.text-6xl { font-size: 3.75rem; line-height: 1;  }
.text-7xl { font-size: 4.5rem; line-height: 1;  }
.text-8xl { font-size: 6rem; line-height: 1;  }
.text-9xl { font-size: 8rem; line-height: 1;  }

.font-thin {	font-weight: 100; }
.font-extralight {	font-weight: 200; }
.font-light {	font-weight: 300; }
.font-normal {	font-weight: 400; }
.font-medium {	font-weight: 500; }
.font-semibold {	font-weight: 600; }
.font-bold {	font-weight: 700; }
.font-extrabold {	font-weight: 800; }



.normal-case { text-transform: none; }
.uppercase { text-transform: uppercase;}
.lowercase { text-transform: lowercase; }
.capitalize { text-transform: capitalize; }








.button, .be-cta-wrapper a {
  border-style: solid;
  cursor: pointer;
  display: inline-flex;
  font-weight: 500;
  height: auto;
  margin: 0;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  width: auto;
  word-break: break-word;
  letter-spacing: normal;
  align-items: center;
  border-radius: 0.25rem;
}

.be-cta-wrapper a {
  column-gap: 1rem;
}

.button:hover, .button:focus, .button:active {
  text-decoration: none;
}

.button:hover, .button:focus,
.be-cta-wrapper a:hover,
.be-cta-wrapper a:focus {
  transform: translateY(-1px);
}

.button:active,
.be-cta-wrapper a:active {
  transform: translateY(0);  
}



.button.button--small,
.be-cta-wrapper .cta--small a {
  font-size: 0.75rem;  line-height: 1rem; 
  padding-top: 0.375rem;
padding-right: 0.625rem;
padding-bottom: 0.375rem;
padding-left: 0.625rem;

  font-weight: normal;
}
.button, .button.button--medium,
.be-cta-wrapper a,
.be-cta-wrapper .cta--medium a {
  font-size: 1rem; line-height: 1.5rem; 
  padding-top: 0.5rem;
padding-right: 1rem;
padding-bottom: 0.5rem;
padding-left: 1rem;
  
  font-weight: 500;
}
.button.button--large,
.be-cta-wrapper .cta--large a {
  font-size: 1rem; line-height: 1.5rem; 
  padding-top: 0.75rem;
padding-right: 2rem;
padding-bottom: 0.75rem;
padding-left: 2rem;
  
  font-weight: 500;
}

.button.button--full-width { width: 100%; }

.be-cta-wrapper .cta--full-width a { display: flex;}

/* Button icons */

.button .button__icon svg {
  display: block;
  fill: inherit;
  height: 1.25rem;
  margin-right: 1rem;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .button .button__icon svg {
    width: 1.25rem;
  }
}

.button--icon-right .button__icon {
  order: 1;
}

.button--icon-right .button__icon svg {
  margin-left: 1rem;
  margin-right: 0;
}


.button, .button.button--primary,
.be-cta-wrapper .cta--primary a {
  color: #FFFFFF;
  fill: #FFFFFF;
  background: #1692FF;
  border-width:  1px;
  border-color: #1692FF;
}

.button:hover, .button.button--primary:hover,
.be-cta-wrapper .cta--primary a:hover {
  color: #FFFFFF;
  fill: #FFFFFF;
  background: #0075DB;
  border-width:  1px;
  border-color: #0075DB;
  box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
}

.button:active, .button.button--primary:active, .button:focus, .button.button--primary:focus,
.be-cta-wrapper .cta--primary a:active, .be-cta-wrapper .cta--primary a:focus  {
  color: #FFFFFF;
  fill: #FFFFFF;
  background: #003C70;
  border-width:  1px;
  border-color: #003C70;

  box-shadow: rgba(0, 0, 0, .06) 0 2px 4px;
  
}


.button.button--secondary,
.be-cta-wrapper .cta--secondary a {
  color: #1692FF;
  fill: #1692FF;
  background: #FFFFFF;
  border-width:  1px;
  border-color: #1692FF;
}

.button.button--secondary:hover,
.be-cta-wrapper .cta--secondary a:hover {
  color: #1692FF;
  fill: #1692FF;
  background: #FFFFFF;
  border-width:  1px;
  border-color: #1692FF;
}

.button.button--secondary:active, .button:focus, .button.button--secondary:focus,
.be-cta-wrapper .cta--secondary a:active, .be-cta-wrapper .cta--secondary a:focus  {
  color: #FFFFFF;
  fill: #FFFFFF;
  background: #1692FF;
  border-width:  1px;
  border-color: #1692FF;
}





.button.button--accent-alpha--light,
.be-cta-wrapper .cta--accent-alpha--light a {color: #FFFFFF;
  fill: #FFFFFF;
  background: #30A6A6;
  border-width:  1px;
  border-color: #30A6A6;
}

.button.button--accent-alpha--light:hover,
.be-cta-wrapper .cta--accent-alpha--light a:hover{color: #FFFFFF;
  fill: #FFFFFF;
  background: #68D4D4;
  border-width:  1px;
  border-color: #68D4D4;  
}
  
.button.button--accent-alpha--light:active, .button.button--accent-alpha--light:focus,
.be-cta-wrapper .cta--accent-alpha--light a:active, .be-cta-wrapper .cta--accent-alpha--light a:focus {color: #FFFFFF;
  fill: #FFFFFF;
  background: #90DFDF;
  border-width:  1px;
  border-color: #90DFDF;  
}

.button.button--accent-alpha--dark,
.be-cta-wrapper .cta--accent-alpha--dark a {color: #247F7F;
  fill: #247F7F;
  background: #DBF5F5;
  border-width:  1px;
  border-color: #DBF5F5;
}

.button.button--accent-alpha--dark:hover,
.be-cta-wrapper .cta--accent-alpha--dark a:hover{color: #247F7F;
  fill: #247F7F;
  background: #B4E9E9;
  border-width:  1px;
  border-color: #B4E9E9;  
}
  
.button.button--accent-alpha--dark:active, .button.button--accent-alpha--dark:focus,
.be-cta-wrapper .cta--accent-alpha--dark a:active, .be-cta-wrapper .cta--accent-alpha--dark a:focus {color: #247F7F;
  fill: #247F7F;
  background: #90DFDF;
  border-width:  1px;
  border-color: #90DFDF;  
}





.button.button--accent-beta--light,
.be-cta-wrapper .cta--accent-beta--light a {color: #FFFFFF;
  fill: #FFFFFF;
  background: #DE911D;
  border-width:  1px;
  border-color: #DE911D;
}

.button.button--accent-beta--light:hover,
.be-cta-wrapper .cta--accent-beta--light a:hover{color: #FFFFFF;
  fill: #FFFFFF;
  background: #F7C948;
  border-width:  1px;
  border-color: #F7C948;  
}
  
.button.button--accent-beta--light:active, .button.button--accent-beta--light:focus,
.be-cta-wrapper .cta--accent-beta--light a:active, .be-cta-wrapper .cta--accent-beta--light a:focus {color: #FFFFFF;
  fill: #FFFFFF;
  background: #FADB5F;
  border-width:  1px;
  border-color: #FADB5F;  
}

.button.button--accent-beta--dark,
.be-cta-wrapper .cta--accent-beta--dark a {color: #CB6E17;
  fill: #CB6E17;
  background: #FFF3C4;
  border-width:  1px;
  border-color: #FFF3C4;
}

.button.button--accent-beta--dark:hover,
.be-cta-wrapper .cta--accent-beta--dark a:hover{color: #CB6E17;
  fill: #CB6E17;
  background: #FCE588;
  border-width:  1px;
  border-color: #FCE588;  
}
  
.button.button--accent-beta--dark:active, .button.button--accent-beta--dark:focus,
.be-cta-wrapper .cta--accent-beta--dark a:active, .be-cta-wrapper .cta--accent-beta--dark a:focus {color: #CB6E17;
  fill: #CB6E17;
  background: #FADB5F;
  border-width:  1px;
  border-color: #FADB5F;  
}




.button.button--accent-delta--light,
.be-cta-wrapper .cta--accent-delta--light a {color: #FFFFFF;
  fill: #FFFFFF;
  background: #CF1124;
  border-width:  1px;
  border-color: #CF1124;
}

.button.button--accent-delta--light:hover,
.be-cta-wrapper .cta--accent-delta--light a:hover{color: #FFFFFF;
  fill: #FFFFFF;
  background: #EF4E4E;
  border-width:  1px;
  border-color: #EF4E4E;  
}
  
.button.button--accent-delta--light:active, .button.button--accent-delta--light:focus,
.be-cta-wrapper .cta--accent-delta--light a:active, .be-cta-wrapper .cta--accent-delta--light a:focus {color: #FFFFFF;
  fill: #FFFFFF;
  background: #F86A6A;
  border-width:  1px;
  border-color: #F86A6A;  
}

.button.button--accent-delta--dark,
.be-cta-wrapper .cta--accent-delta--dark a {color: #AB091E;
  fill: #AB091E;
  background: #FFBDBD;
  border-width:  1px;
  border-color: #FFBDBD;
}

.button.button--accent-delta--dark:hover,
.be-cta-wrapper .cta--accent-delta--dark a:hover{color: #AB091E;
  fill: #AB091E;
  background: #FF9B9B;
  border-width:  1px;
  border-color: #FF9B9B;  
}
  
.button.button--accent-delta--dark:active, .button.button--accent-delta--dark:focus,
.be-cta-wrapper .cta--accent-delta--dark a:active, .be-cta-wrapper .cta--accent-delta--dark a:focus {color: #AB091E;
  fill: #AB091E;
  background: #F86A6A;
  border-width:  1px;
  border-color: #F86A6A;  
}




.button.button--accent-gamma--light,
.be-cta-wrapper .cta--accent-gamma--light a {color: #FFFFFF;
  fill: #FFFFFF;
  background: #51279B;
  border-width:  1px;
  border-color: #51279B;
}

.button.button--accent-gamma--light:hover,
.be-cta-wrapper .cta--accent-gamma--light a:hover{color: #FFFFFF;
  fill: #FFFFFF;
  background: #724BB7;
  border-width:  1px;
  border-color: #724BB7;  
}
  
.button.button--accent-gamma--light:active, .button.button--accent-gamma--light:focus,
.be-cta-wrapper .cta--accent-gamma--light a:active, .be-cta-wrapper .cta--accent-gamma--light a:focus {color: #FFFFFF;
  fill: #FFFFFF;
  background: #8662C7;
  border-width:  1px;
  border-color: #8662C7;  
}

.button.button--accent-gamma--dark,
.be-cta-wrapper .cta--accent-gamma--dark a {color: #421987;
  fill: #421987;
  background: #CFBCF2;
  border-width:  1px;
  border-color: #CFBCF2;
}

.button.button--accent-gamma--dark:hover,
.be-cta-wrapper .cta--accent-gamma--dark a:hover{color: #421987;
  fill: #421987;
  background: #A081D9;
  border-width:  1px;
  border-color: #A081D9;  
}
  
.button.button--accent-gamma--dark:active, .button.button--accent-gamma--dark:focus,
.be-cta-wrapper .cta--accent-gamma--dark a:active, .be-cta-wrapper .cta--accent-gamma--dark a:focus {color: #421987;
  fill: #421987;
  background: #8662C7;
  border-width:  1px;
  border-color: #8662C7;  
}




.button.button--accent-epsilon--light,
.be-cta-wrapper .cta--accent-epsilon--light a {color: #FFFFFF;
  fill: #FFFFFF;
  background: #BC0A6F;
  border-width:  1px;
  border-color: #BC0A6F;
}

.button.button--accent-epsilon--light:hover,
.be-cta-wrapper .cta--accent-epsilon--light a:hover{color: #FFFFFF;
  fill: #FFFFFF;
  background: #E8368F;
  border-width:  1px;
  border-color: #E8368F;  
}
  
.button.button--accent-epsilon--light:active, .button.button--accent-epsilon--light:focus,
.be-cta-wrapper .cta--accent-epsilon--light a:active, .be-cta-wrapper .cta--accent-epsilon--light a:focus {color: #FFFFFF;
  fill: #FFFFFF;
  background: #F364A2;
  border-width:  1px;
  border-color: #F364A2;  
}

.button.button--accent-epsilon--dark,
.be-cta-wrapper .cta--accent-epsilon--dark a {color: #A30664;
  fill: #A30664;
  background: #FFB8D2;
  border-width:  1px;
  border-color: #FFB8D2;
}

.button.button--accent-epsilon--dark:hover,
.be-cta-wrapper .cta--accent-epsilon--dark a:hover{color: #A30664;
  fill: #A30664;
  background: #FF8CBA;
  border-width:  1px;
  border-color: #FF8CBA;  
}
  
.button.button--accent-epsilon--dark:active, .button.button--accent-epsilon--dark:focus,
.be-cta-wrapper .cta--accent-epsilon--dark a:active, .be-cta-wrapper .cta--accent-epsilon--dark a:focus {color: #A30664;
  fill: #A30664;
  background: #F364A2;
  border-width:  1px;
  border-color: #F364A2;  
}


// do you even need all of these options?

.button.button--accent--dark {
  border-width:  1px;
  border-color: var(--accent-color-btn-border-dark);
  color: var(--accent-color-btn-dark);
  fill: var(--accent-color-btn-dark);
  background: var(--accent-color-btn-dark-bg);
}
.button.button--accent--dark:hover {
  border-width:  1px;
  border-color: var(--accent-color-btn-border-dark-hover);
  color: var(--accent-color-btn-dark-hover);
  fill: var(--accent-color-btn-dark-hover);
  background: var(--accent-color-btn-dark-bg-hover);  
}
.button.button--accent--dark:focus, .button.button--accent--dark:active  {
  border-width:  1px;
  border-color: var(--accent-color-btn-border-dark-active);
  color: var(--accent-color-btn-dark-active);
  fill: var(--accent-color-btn-dark-active);
  background: var(--accent-color-btn-dark-bg-active);
}



.abutton {
  border-width:  1px;
  border-color: var(--btn-border-color); /* make primary the default */
  color: var(--btn-color);
  fill: var(--btn-color);
  background: var(--btn-bg-color);
}
.abutton:hover {
  border-width:  1px;
  border-color: var(--btn-border-color-hover); /* make primary the default */
  color: var(--btn-color-hover);
  fill: var(--btn-color-hover);
  background: var(--btn-bg-color-hover);
}
.abutton.button--accent--dark:focus, .abutton.button--accent--dark:active  {
  border-width:  1px;
  border-color: var(--btn-border-color-active); /* make primary the default */
  color: var(--btn-color-active);
  fill: var(--btn-color-active);
  background: var(--btn-bg-color-active);
}


.pattern-section {
  position: relative;
}
.pattern-section div.row-fluid {
  position: relative;
  z-index:2;
}

.pattern-section:after {
  content:'';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0; 
  z-index: 1;
}

  .pattern-section--dots:after {
    background-size: 1rem 1rem;
    background-image: radial-gradient(circle, rgba(255, 255, 255, 10%) 1px, rgba(0, 0, 0, 0) 1px);
  }

  .pattern-section--graphpaper:after {
    background-size: 1rem 1rem;
    background-image:
      linear-gradient(to right, rgba(255, 255, 255, 10%) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255, 255, 255, 10%) 1px, transparent 1px);    

  }



  .grayscale {
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%);
  }


@media (max-width: 767px) {
  .section.be-lr-col > div.row-fluid {
    display:flex;
    flex-direction: column-reverse;
    row-gap: 1rem;
  }
}