/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/


/* Webfont: PowerGroteskTrial-Bold */@font-face {
    font-family: 'PowerGroteskTrial';
    /*src: url('PowerGroteskTrial-Bold.eot');*/  /* IE9 Compat Modes */
    /*src: url('PowerGroteskTrial-Bold.eot?#iefix') format('embedded-opentype'),*/ /* IE6-IE8 */
         url('/growth-dev/fonts/Power-Grotesk/woff/PowerGroteskTrial-Bold.woff') format('woff'), /* Modern Browsers */
         url('/growth-dev/fonts/Power-Grotesk/woff2/PowerGroteskTrial-Bold.woff2') format('woff2'), /* Modern Browsers */
         url('/growth-dev/fonts/Power-Grotesk/ttf/PowerGroteskTrial-Bold.ttf') format('truetype'); /* Safari, Android, iOS */
             font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}


h1,h2,h3 {
  font-family: "PowerGroteskTrial-Bold", Georgia;
}
h4,h5,h6,body,p, .button, .interactive-button {
  font-family: 'Space Grotesk', sans-serif;
}

/* h3 {
  font-family: 'Montserrat';
} */

.header {
    position: fixed;
    z-index: 9999999;
    width: 100%;
}

#hero1 {
  animation-name: hero1;
  animation-duration: 0.75s;
}

@keyframes hero1 {
  from {opacity: 0%;}
  to {opacity: 100%;}
}

#hero2 {
  animation-name: hero2;
  animation-duration: 1.5s;
}

@keyframes hero2 {
  from {opacity: 0%;}
  to {opacity: 100%;}
}

/* #hs_cos_wrapper_widget_1689789036240 > div > a {
    animation-name: wipe-enter;
    animation-duration: 1s;
} */

.herobutton {
  animation-name: wipe-enter;
  animation-duration: 1s;
}

#main-content > div > div > div > div > div.row-fluid-wrapper.row-depth-1.row-number-5.dnd_area-row-1-padding.dnd_area-row-1-background-color.dnd-section.dnd_area-row-1-force-full-width-section > div > div > div > div > div:nth-child(1) {
 animation-name: section2card;
  animation-duration: 1s;
}

#main-content > div > div > div > div > div.row-fluid-wrapper.row-depth-1.row-number-5.dnd_area-row-1-padding.dnd_area-row-1-background-color.dnd-section.dnd_area-row-1-force-full-width-section > div > div > div > div > div:nth-child(2) { 
 animation-name: section2card;
 animation-duration: 2s;
}

#main-content > div > div > div > div > div.row-fluid-wrapper.row-depth-1.row-number-5.dnd_area-row-1-padding.dnd_area-row-1-background-color.dnd-section.dnd_area-row-1-force-full-width-section > div > div > div > div > div:nth-child(3) { 
 animation-name: section2card;
 animation-duration: 3s;
}

@keyframes section2card {
  from {opacity: 0%;}
  to {opacity: 100%;}
}

@keyframes herobutton {
  from {opacity: 0%;}
  to {opacity: 100%;}
}

@keyframes wipe-enter {
	0% {
		transform: scale(0, .025);
	}
	50% {
		transform: scale(1, .025);
	}
}



.button {
    background-color: #b1fa63 !important;
    background-image: none !important;
    border-radius: 10px !important;
    color: #000000 !important;
/*     font-family: Tahoma, Geneva, sans-serif !important; */
    font-weight: bold !important;
    line-height: 39px !important;
    margin-top: 0px !important;
    padding-bottom: 5px !important;
    padding-left: 45px !important;
    padding-right: 45px !important;
    padding-top: 5px !important;
    text-align: left !important;
    text-transform: uppercase;
    border: 0px !important;
}
.button, .interactive-button {
  font-family: 'Space Grotesk', sans-serif !important;
}


.icon{
    background-color: #fff;
    padding: 10px;
}
.icon svg{
    fill: #000;
}