

/* ******************************************************************************
*********************************************************************************
Use this file to override any of the CSS styles preset in the themed
stylesheets or you can add your own custom styles.
*********************************************************************************
****************************************************************************** */

/* Test */



























  
  














@media (min-width: 2000px){
.content-wrapper {
    max-width: 1860px!important;
    padding: 0!important;
}
}

.content-wrapper {
max-width: 100%;
/*padding: 0 8rem;*/
padding: 0 4rem;
}

@media (max-width: 1500px){
.content-wrapper {
    padding: 0 2.5rem;
}
}

@media(max-width:1024px){
.content-wrapper {
    padding: 0 20px;
}
}


:root{
  --base_color:#0C0C0C;
  --primary_color:#2B2D2E;
  --primary_color2:#1B1B1C;  
  --primary_color3:#F4F5F6;  
  --primary_color4:#FF96E0;  
  --secondary_color:#8EBBFF;  
  --secondary_color2:#ECE807;  
  --secondary_color3:#EA3C24;  
  --secondary_color4:#9A87FF;  
  --secondary_color5:#5400FE;  
  --white_color:#FFFFFF;
  --fourth_color:#f7f2eb;
  --body_two:15px;
}







body {
color: rgba(12, 12, 12, 1.0);
font-weight: 400;
font-family:HelveticaNowText-Regular;
font-size: 19px;
overflow-x:hidden; 
}
a {
color: rgba(12, 12, 12, 1.0);
}
a:hover,
a:focus {
color: rgba(12, 12, 12, 1.0);
}

.drakmode a:hover,
.drakmode a:focus {
color: var(--primary_color4);
}

h1,.h1 {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowDisplay-Bd;
font-size: 5rem;
font-weight: 700;
letter-spacing: -0.011rem;
text-transform: uppercase;
line-height: 4.4375rem;
margin-bottom:40px;
}

.heroh1 h1,.heroh1 .h1{
  font-size: 8.125rem;
  line-height: 6.75rem;
  letter-spacing: -0.16819rem;
  font-weight:800;
  font-family:HelveticaNowDisplay-Blk;
}

h2,.h2 {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Medium;
font-size:3.75rem;
font-weight: 500;
letter-spacing: -0.17625rem;
line-height: 4.0625rem;
 text-transform:none;
}



h3,.h3 {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Medium;
font-size:2.5rem;
font-weight: 500;
letter-spacing: -0.0805rem;
line-height: 2.6875rem;
text-transform:none;  
}

 
h4,.h4 {
color: rgba(12, 12, 12, 1.0);
font-family:HelveticaNowText-Medium;;
font-size: 1.8125rem;
font-weight: 500;
letter-spacing: -0.03081rem;
line-height: 2rem;
}
h5,.h5 {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Medium;
font-size: 1.4375rem;
font-weight: 500;
letter-spacing: -0.02575rem;
line-height: 1.75rem;
margin-bottom:25px;  
}
h6,.h6 {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Medium;
font-size: 1.125rem;
font-weight: 500;
letter-spacing: 0.00763rem;
line-height: 1.375rem;
}

p {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Regular;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: -0.0165rem;
line-height:1.688rem;
}
.secondary_paragraph p {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Regular;
font-size:0.9375rem;
font-weight: 400;
letter-spacing: -0.00313rem;
line-height:1.3125rem;
}

.small-quote p{margin-bottom:12px;}

.white-text h1,.darkmode h1,.lightmode h1,
.white-text h2,.darkmode h2,.lightmode h2,
.white-text h3,.darkmode h3,.lightmode h3,
.white-text h4,.darkmode h4,.lightmode h4,
.white-text h5,.darkmode h5,.lightmode h5,
.white-text h6,.darkmode h6,.lightmode h6,
.white-text p,.darkmode p,.lightmode p,
.white-text li,.darkmode li,.lightmode li,
.white-text span,.darkmode span,.lightmode span,
.white-text p a,.darkmode p a,.darkmode a,.white-text a.cta_button,.lightmode a.cta_button,.lightmode p a,.lightmode .primary-btn a{color:#FFFFFF;}

 

.darkmode a.cta_button,.darkmode .primary-btn a {color:#FFFFFF;}

.darkmode a.cta_button:before,.darkmode a.cta_button:after{border-color:#FFFFFF;}

 .white-text a.cta_button:before,.white-text a.cta_button:after{border-color:#FFFFFF;}
 .lightmode a.cta_button:before,.lightmode a.cta_button:after{border-color:#FFFFFF;}

 .darkmode .primary-btn a:before,.darkmode .primary-btn a:after{border-color:#FFFFFF;}


/********ROI Calculator*************/
#hs-roi-calculator-embed, #hs-roi-calculator-embed iframe {
    height: 3400px !important;
    border-radius: 20px !important;
}

/*******************Footer******************/
.footer-section{background-color:rgba(12, 12, 12, 1.0);font-family:HelveticaNowText-Regular;font-weight:300;}
.footer-section p,.foot-clt span,.footer-section p a,.footer-section ul li a,.fsoc-text{ color:#BABDC0;font-size:15px;font-family:HelveticaNowText-Regular;font-weight:300;line-height:19px;}
.footer-section ul li a:hover{color:var(--white_color);text-decoration:none;}

/*******************Header******************/

.trsnsparent-header.header-section{background-color:transparent}


.header-section .menus ul > li.hs-menu-depth-1 a:hover,.header-section .menus ul > li.hs-menu-depth-1.hs-item-has-children.active > a,.header-section .menus ul > li.hs-menu-depth-1.hs-item-has-children.actives > a{color:#0C0C0C; text-decoration:none;}
.header-section .menus ul > li.hs-menu-depth-1 a{white-space:normal; color:#0C0C0C; font-size:1.2rem; font-family:HelveticaNowText-Medium; font-weight:500;line-height:normal;}
.header-section .menus ul>li.hs-menu-depth-1 a:after,.header-section .mobile-trigger .line,.menu-ntext a:after{background-color:#0C0C0C;}


.darkmode .header-section{/*background-color:var(--base_color);*/}
.darkmode .header-section .menus ul > li.hs-menu-depth-1 > a{color:#FFFFFF; text-decoration:none;}
.darkmode .menu-ntext a,.darkmode .header-section .menus ul > li.hs-menu-depth-1 > a:hover,.darkmode .header-section .menus ul > li.hs-menu-depth-1.hs-item-has-children.active > a,.darkmode .header-section .menus ul > li.hs-menu-depth-1.hs-item-has-children.actives > a{color:var(--white_color);}


.white-header.header-section .menus ul > li.hs-menu-depth-1 a:hover,.white-header.header-section .menus ul > li.hs-menu-depth-1.hs-item-has-children.active > a,.white-header.header-section .menus ul > li.hs-menu-depth-1.hs-item-has-children.actives > a{color:var(--white_color)}
.white-header.header-section .menus ul > li.hs-menu-depth-1 a{color:var(--white_color)}


.darkmode .header-section .menus ul>li.hs-menu-depth-1 a:after,.white-header.header-section .menus ul>li.hs-menu-depth-1 a:after,.white-header.header-section.mobile-trigger .line,.white-header.header-section .menu-ntext a:after{background-color:var(--white_color)}




.darkmode .secondary-button a,.darkmode .secondary-button a.cta_button,.darkmode .secondary-button button.cta_button{background-color:var(--white_color);color:var(--base_color);}
.body-wrapper{margin-top:-1px;}
.header-section.trsnsparent-header .toggole-sec .tgl-flat+.tgl-btn {background: transparent;}

.darkmode form label span{color:var(--base_color);}
.darkmode form .hs-form-booleancheckbox span{color:var(--white_color)}
.darkmode  .menu-ntext a:after{background-color:var(--white_color)}




form,
.submitted-message {
color: rgba(12, 12, 12, 1.0);
font-family: HelveticaNowText-Medium;
font-size: 27px;
font-weight: 500;
line-height:1.2;
margin-bottom:14px;
}
h3.form-title {
margin:0;
}
a.cta_button,.primary-btn a {
background-color:transparent; 
color: rgba(12, 12, 12, 1.0);
padding:0;
text-align:center;
transition:0.3s all ease-in;
text-decoration:none !important;
display:inline-block;  
text-decoration:none !important;
display:inline-block;  
font-size: 1.25rem;
 line-height: 1.6875rem;
  font-weight: 500;
  letter-spacing: 0.0325rem; 
font-family:"HelveticaNowText-Medium";
  position:relative;
}
a.cta_button:before,a.cta_button:after,.primary-btn a:before,.primary-btn a:after{
  content: "";
  display: block;
  position: absolute;
  bottom: -0.275em;
  left: 0;
  right: 0;
  transition-delay: 0s; 
  -webkit-transform-origin: left;
  transform-origin: left;
  transition: -webkit-transform .75s cubic-bezier(.19,1,.22,1);
    transition: transform .75s cubic-bezier(.19,1,.22,1);
    transition: transform .75s cubic-bezier(.19,1,.22,1),-webkit-transform .75s cubic-bezier(.19,1,.22,1);
    border-bottom: 1.5px solid rgba(12, 12, 12, 1.0);;
}
a.cta_button:before,.primary-btn a:before{
transition-delay: 0s;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left;
}
a.cta_button:after,.primary-btn a:after{
transition-delay: .25s;
    -webkit-transform-origin: right;
    transform-origin: right;
}

a.cta_button:hover:before,.primary-btn a:hover:before{
transition-delay: .25s;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
a.cta_button:hover:after,.primary-btn a:hover:after{
      transition-delay: 0s;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);

}

a.nocta.cta_button:after{display:none;}

.white-text .white-button a.cta_button {color:#FFFFFF;}
.white-text .white-button a.cta_button:before,.white-text .white-button a.cta_button:after{border-color:#FFFFFF;}

.secondary-button a,.secondary-button a.cta_button,.secondary-button button.cta_button{
background-color: rgba(12, 12, 12, 1.0);
color: rgba(255, 255, 255, 1.0);
padding: 14.5px 25px;
    width: 100%;
border:2px solid rgba(12, 12, 12, 1.0);   
text-align:center;
transition:0.3s all ease-in;
text-decoration:none !important;
display:inline-block;  
font-size:18px;
 line-height: 18px;
 font-family:HelveticaNowDisplay-Md; 
  text-align: center; 
  position:relative;  
  border-radius: 25px; 
  margin:0;
}

form .hs-button, form input[type=submit]{
  background-color: transparent;
color: rgba(255, 255, 255, 1.0);
padding:0;
    width: 100%;
border:none;
text-align:center;
transition:0.3s all ease-in;
text-decoration:none !important;
display:inline-block;  
font-size:18px;
 line-height: 18px;
 font-family:HelveticaNowDisplay-Md; 
  text-align: center; 
  position:relative;  
    border-radius: 0; 
  margin:0;
}

form .actions{
  position:relative;
  cursor:pointer;
  max-width:202px;
  margin:0 auto;
  padding: 4px 15px 12.5px;
   border-radius: 3px; 
  border:2px solid rgba(12, 12, 12, 1.0);   
  background-color: rgba(12, 12, 12, 1.0);
  overflow:hidden;
  transform: translateZ(0);
    backface-visibility: inherit;
}
form .actions:after{
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translate3d(0,100%,0);
  color:rgba(255, 255, 255, 1.0);
  background-color: rgba(255, 255, 255, 1.0);
  transition: transform .3s ease-out;
  z-index: -1; 
}
form .actions:hover:after{transform: translateZ(0); bottom: 0px;}
form .actions:hover  input[type=submit]{color:var(--base_color);}
.darkmode form .actions{
background:#ffffff;
border:2px solid #ffffff;
}
.darkmode form .actions .hs-button{
color:#0c0c0c;
}
.darkmode form .actions:after{
background:#0c0c0c;
color:#0c0c0c;
}
.darkmode form .actions:hover .hs-button{
color:#ffffff!important;
}

.hs-form label {
font-family: HelveticaNowDisplay-Md;  
color: #0C0C0C;
font-weight: ;
font-size:14px;  
line-height:19px;  
}
.hs-form legend {
color: rgba(12, 12, 12, 1.0);
}

form input[type=checkbox],
form input[type=radio]{
border: 1px solid rgba(12, 12, 12, 1.0);
}
form .hs-form-booleancheckbox a{
color: rgba(12, 12, 12, 1.0);
text-decoration:underline;
}
form .actions{
text-align:left;
}
body form .hs-form-booleancheckbox{
margin: 10px 0 20px;
}
form .hs-button{
margin-top:10px;
}

.hs-form .field .input input[type="checkbox"]:checked:after,
.hs-form .field .input input[type="radio"]:checked:after{
content: '';
position: absolute;
width: 15px;
height: 9px;
top: 3px;
left: 3px;
border: 3px solid #191715;
border-top: 0;
border-right: 0;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
}
form input:focus,
form select:focus,
form textarea:focus,
.hs-input:focus,
.hs-search-field input.hs-search-field__input:focus,
input[type="password"]:focus {
outline:none;
}
.fn-date-picker .pika-table thead th {
color: rgba(1, 45, 141, 0.0);
}
.hs-input:-moz-placeholder,
.hs-input::-webkit-input-placeholder,
.hs-field-desc,
.hs-dateinput:before,
.hs-richtext {
color: #0C0C0C;
}
form select.is-placeholder option{color:#0C0C0C}
.hs-richtext {
font-size: 19;
}
.hs-default-font-element,
.hs-main-font-element {
font-family: HelveticaNowText-Regular;
}
.fn-date-picker td.is-today .pika-button {
color: #2B2D2E;
}
.fn-date-picker td.is-selected .pika-button {
background: #2B2D2E;
}
.fn-date-picker td .pika-button:hover {
background-color: #8EBBFF !important;
}

@media(max-width:767px){ 
a.cta_button,.primary-btn a {
font-size: 1.1875rem;
 line-height: 1.5625rem;
  font-weight: 500;
  letter-spacing: 0.01188rem; 

}
  }
  }




th,
td {
background-color: rgba(1, 45, 141, 0.0);
border: 1px solid rgba(1, 45, 141, 1.0);
color: rgba(1, 45, 141, 1.0);
}
thead th,
thead td {
background-color: rgba(12, 12, 12, 0.0);
color: rgba(1, 45, 141, 1.0);
}
tfoot td {
background-color: rgba(12, 12, 12, 0.0);
color: rgba(1, 45, 141, 1.0);
}
table,
tbody + tbody {
border-color: rgba(1, 45, 141, 1.0);
}


@media(max-width:1024px){
  .content-wrapper{padding:0 17px;}
}

@media(max-width:1024px){
.heroh2 h2{
  font-size: 3rem;
  line-height: 3rem;  
}
}

@media(max-width:767px){   
  h1,.h1{font-size: 41px;line-height: 39px;letter-spacing: 0.184px;}
  .heroh1 h1,.heroh1 .h1{font-size:3.3125rem;line-height: 2.875rem; letter-spacing: -0.13481rem;}
h2,.h2{font-size:2.375rem;line-height:2.625rem; letter-spacing: -0.08788rem;}
.heroh2 h2{font-size:2.5625rem;line-height: 2.4375rem; letter-spacing: 0.0115rem;}
h3,.h3{font-size:29px;line-height: 30px;letter-spacing: -0.902px;}
h4,.h4{font-size:23px;line-height: 27px; letter-spacing: -0.704px;}
h5,.h5{font-size: 21px;line-height: 25px; letter-spacing: -0.42px;}
h6,.h6{font-size:15px;line-height: 19px;letter-spacing: -0.065px;}
p{font-size: 1.1875rem;letter-spacing: -0.017rem;line-height: 1.813rem;}  
.secondary_paragraph p{font-size: 1rem; letter-spacing: -0.00313rem; line-height: 1.25rem;} 
}




.preloader {
    height: 101vh;
    background: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 100vw;
    z-index: 999;
    position: fixed;
    width: 100%;
}

.preloader img {
    margin: auto auto;
}

.preloader-logo {
    max-width:500px;
    width: 100%;
}

.logo-overley {
    height: 100vh;
    background: #000;
    opacity: 0.1;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

::selection {
  background: #FF5ECC;
}