@font-face {
    font-family: 'Avenir Regular';
    src: url('./font/Avenir-Regular.woff2') format('woff2'),
         url('./font/Avenir-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'Avenir Heavy';
    src: url('./font/Avenir-Heavy.woff2') format('woff2'),
         url('./font/Avenir-Heavy.ttf') format('truetype');
}
@font-face {
    font-family: 'Avenir Black';
    src: url('./font/Avenir-Black.woff2') format('woff2'),
         url('./font/Avenir-Black.ttf') format('truetype');
}

:root {
    --fontRegular: 'Avenir Regular';
    --fontHeavy: 'Avenir Heavy';
    --fontBlack: 'Avenir Black';

    --color1: #75D14C; /* button*/
    --color2: #97DC7925;
    --color3: #4FAD34;
    --color4: #0E0D0D;
    --color5: #005E00; /*button hover*/
    --color6: rgba(68, 68, 68, 0.5);
    --color7: #005E00;
    --color8: #FFFFFF;
    --color9: #75D14C;
    --color10: #212529;
    --color11: #ffffff;
    --color12: transparent;
    --color13: #FCFEFB;
    --color14: #75D14C;
    --color15: #005E00;
    --color16: #4FAD34;
    --color17: #0E0D0D;
    --color18: #75D14C;
    --color19: #FFFFFF;
    --color20: #97DC7925;
    --color21: #4FAD34;
    --color22: #D1F5C9;
    --color23: #000000;
    --color24: #4BD42D;
    --color25: #005E00;
    --color26: #005E00;
    --color27: #FFFFFF;
    --color28: #005E00;
    --color29: #005E00;
    --color30: #4BD42D;
    --color31: #005E00;
    --color32: #FFFFFF;
    --clientNameColor: #002A00;
    --clientDesignationColor: #005E00;
    --testimonialArrowColorActive: #005E00;
    --testimonialArrowColorDisabled: #D9D9D9;
    --accordionBorderColor: #B9D8B3;
    --accordionArrowColor: #0F1026;
    --homePageColor: #000000;
    --heroBackground: #F9F8F3;
    --heroItemBackground: #f7f7f71f;
    --buttonBackground: #005E00;
    --outlinedButtonColor: #ffffff;
    --outlinedButtonBorderColor: #ffffff;
    --accentColor1: #005E00;
    --accentColor2: #A1A1A1;
    --accentColor3: #FFFFFF;
    --bannerHeadingColor: #ffffff;
    --bannerBackground: #005E00;
    --categoryBodyColor: #5C5C5C;
    --categoryBackground: #F7F6F3;
    --keyBenefitsHeadingColor: #050202;
    --keyBenefitsBodyColor: #050202;
    --keyBenefitsBackground: #F8F7F3;
    --stepsHeadingColor: #FFFFFF;
    --stepsLabelBackground: #75d14c80;
    --stepsBodyColor: #FFFFFF;
    --stepsBackground: #005E00;
    --stepsImageBorderColor: #d5d5d5;
    --workflowItemBackground: #F7F7F2;
    --reviewTabItemColor: #A1A1A1;
    --reviewTabItemBorderColor: #A1A1A1;
    --reviewTabItemBorderActiveColor: #005E00;
    --reviewTabItemHoverColor: #005E00;
    --reviewTabItemActiveColor: #005E00;
    --reviewBackground: #F7F7F2;
    --faqBodyColor: #5C5C5C;
    --faqTriggerColor: #005E00;
    --faqTriggerActiveColor: #000000;
    --faqTriggerBackground: #F7F7F2;
    --faqItemBorderColor: #A1A1A1;
    --ctaHeadingColor: #FFFFFF;
    --ctaBodyColor: #FFFFFF;
    --ctaNoteColor: #FFFFFF;
    --ctaBackground: #005E00;
    --companyNameColor: #75D14C;
    --companyAddressColor: #005E00;
    --footerLinkColor: #005E00;
    --footerLinkHoverColor: #4FAD34;
    --statItemBackground: #FFFFFF;
    --statIconBackground: #005E00;
    --statItemBorderColor: #d1f5c9;
    --cookieButtonColor: #FFFFFF;
    --footerLinkColorMobile: #FFFFFF;
    --loginButtonColor: #005E00;
    --loginButtonColorHover: #75D14C;
    --testimonialColor: #FFFFFF;
    --authorColor: #FFFFFF;
    --formSubmitButtonBackground: #005E00;
    --formSubmitButtonBackgroundHover: #75D14C;

    --bg-color: #FFFFFF;

    --bg-gradient1: radial-gradient(ellipse 125% 80% at -10% 25%, rgba(151, 220, 121, 0.6), rgba(151, 220, 121, 0.0188) 50%, rgba(151, 220, 121, 0) 60%), radial-gradient(ellipse 135% 95% at 100% 110%, rgba(151, 220, 121, 0.6) 10%, rgba(151, 220, 121, 0.0188) 50%, rgba(151, 220, 121, 0) 60%);

    --bg-gradient2: radial-gradient(ellipse 65% 90% at -10% 50%, rgba(151, 220, 121, 0.6), rgba(151, 220, 121, 0.0188) 55%, rgba(151, 220, 121, 0) 60%), radial-gradient(ellipse 45% 90% at 105% 25%, rgba(151, 220, 121, 0.6), rgba(151, 220, 121, 0.0188) 60%, rgba(151, 220, 121, 0) 70%), radial-gradient(ellipse 65% 80% at 50% 110%, rgba(151, 220, 121, 0.6), rgba(151, 220, 121, 0.0188) 45%, rgba(151, 220, 121, 0) 60%);

    --landing-vertical-gradient: radial-gradient(at 100% 100%, hsla(66, 100%, 81%, 0.32) 0px, transparent 50%), radial-gradient(at 48% 99%, hsla(108, 39%, 40%, 0.4) 0px, transparent 50%), radial-gradient(at 0% 0%, hsla(66, 100%, 81%, 0.33) 0px, transparent 50%);
    --landing-horizontal-gradient: radial-gradient(at 100% 100%, hsla(66, 100%, 81%, 0.32) 0px, transparent 50%), radial-gradient(at 75% 96%, hsla(108, 39%, 40%, 0.4) 0px, transparent 50%), radial-gradient(at 0% 0%, hsla(66, 100%, 81%, 0.33) 0px, transparent 50%);

    --heroItemBorderGradient: linear-gradient(45deg, #666666 0%, #FFFFFF 49%, #75D14C 100%) border-box;
    --bannerGradient1: linear-gradient(to right, #005e00 0%, #005e00 72%, transparent 100%);
    --bannerGradient2: linear-gradient(to left, #005e00 0%, #005e00 72%, transparent 100%);
    --keyBenefitsItemBorderGradient: linear-gradient(#F8F7F3, #F8F7F3) padding-box, linear-gradient(to top, #A6C4B1, #75D14C) border-box;

    --fontSize11: 17px;
    --fontSize10: 14px;
    --fontSize9: 18px;
    --fontSize8: 52px; /*Large heading*/
    --fontSize7: 44px;
    --fontSize6: 36px;
    --fontSize5: 32px;
    --fontSize4: 28px;
    --fontSize3: 24px;
    --fontSize2: 20px;
    --fontSize1: 16px; /*small text*/
    --fontSize0: 14px;
    --mainHedingfontSize: 61px;
    --sectionHedingfontSize: 40px;
    --sectionHedingfontSize2: 32px;
    --contentHedingfontSize: 24px;
    --contentHedingfontSize2: 20px;
    --contentBodyfontSize: 20px;
    --buttonfontSize: 24px;
    --reviewTabItemFontSize: 24px;
    --reviewFontSize: 24px;
    --userDetailsFontSize: 24px;
    --categoryLabelFontSize: 36px;
    --stepsLabelFontSize: 24px;
    --ctaHeadingFontSize: 68px;
    --ctaBodyFontSize: 32px;
    --footerFontSize: 16px;
    --signupFormTitleFontSize: 30px;
    --testimonialFontSize: 23px;
    --authorFontSize: 18px;

    --buttonRadius: 2px;
    --borderRadius1: 4px;
    --borderRadius2: 4px;
    --borderRadius3: 4px;
    --borderRadius5: 44px;
    --borderRadius6: 4px;
    --borderRadius7: 12px;
    --borderRadius8: 20px;
    --chatRadius2: 20px;
    --borderRadius9: 8px;
    --borderRadius10: 12px;
    --borderRadius11: 16px;
    --borderRadius12: 20px;
    --borderRadius13: 24px;
    --borderRadius14: 32px;
    --borderRadius15: 50px;

    --textTransform1: uppercase;

    --height1: 34px;
}

@media (max-width: 991.98px) {
  :root {
    --mainHedingfontSize: 48px;
    --sectionHedingfontSize: 32px;
    --sectionHedingfontSize2: 28px;
    --contentHedingfontSize: 22px;
    --contentBodyfontSize: 18px;
    --buttonfontSize: 22px;
    --reviewTabItemFontSize: 22px;
    --reviewFontSize: 22px;
    --userDetailsFontSize: 22px;
    --categoryLabelFontSize: 32px;
    --stepsLabelFontSize: 22px;
    --ctaHeadingFontSize: 52px;
    --ctaBodyFontSize: 26px;
  }
}

@media (max-width: 767.98px) {
  :root {
    --mainHedingfontSize: 36px;
    --sectionHedingfontSize: 28px;
    --sectionHedingfontSize2: 24px;
    --contentHedingfontSize: 20px;
    --contentBodyfontSize: 16px;
    --buttonfontSize: 20px;
    --reviewTabItemFontSize: 20px;
    --reviewFontSize: 20px;
    --userDetailsFontSize: 20px;
    --categoryLabelFontSize: 28px;
    --ctaHeadingFontSize: 42px;
    --ctaBodyFontSize: 22px;
    --footerFontSize: 14px;
  }
}

@media (max-width: 575.98px) {
  :root {
    --mainHedingfontSize: 28px;
    --sectionHedingfontSize: 24px;
    --sectionHedingfontSize2: 20px;
    --contentHedingfontSize: 18px;
    --contentBodyfontSize: 15px;
    --buttonfontSize: 18px;
    --reviewTabItemFontSize: 18px;
    --reviewFontSize: 18px;
    --userDetailsFontSize: 18px;
    --categoryLabelFontSize: 24px;
    --ctaHeadingFontSize: 32px;
    --ctaBodyFontSize: 18px;
  }
}