@font-face{
      font-family: "Fractual";
      src: 
      url('https://futurebuildaustralia.com.au/carbon/assets/0007e9/00000a/Fractul-Regular.woff2') format('woff2'),
      url('https://futurebuildaustralia.com.au/carbon/assets/0007e9/00000a/Fractul-Regular.woff') format('woff');
      font-weight: normal;
      font-style: normal;
      font-display: block;
    }
  

    @font-face{
      font-family: "Fractual";
      src: 
      url('https://futurebuildaustralia.com.au/carbon/assets/0007e9/00000a/Fractul-SemiBold.woff2') format('woff2'),
      url('https://futurebuildaustralia.com.au/carbon/assets/0007e9/00000a/Fractul-SemiBold.woff') format('woff');
      font-weight: 600;
      font-style: normal;
      font-display: block;
    }
  

body {font-family: Fractual; font-size:16px; line-height: 24px;}
.large {font-family: Fractual; font-size:20px; line-height: 27px;}
.small {font-family: Fractual; font-size:12px; line-height: 18px;}
h1, .h1 {font-family: Fractual; font-size:60px; line-height: 65px;}
h2, .h2 {font-family: Fractual; font-size:40px; line-height: 45px;}
h3, .h3 {font-family: Fractual; font-size:30px; line-height: 35px;}
h4, .h4 {font-family: Fractual; font-size:20px; line-height: 26px;}
h5, .h5 {font-family: Fractual; font-size:16px; line-height: 24px;}
h6, .h6 {font-family: Fractual; font-size:14px; line-height: 18px;}
strong {font-family: Fractual; font-size:16px; line-height: 24px;}
.large strong, strong .large, strong.large {font-family: Fractual; font-size:20px; line-height: 27px;}
.small strong, strong .small, strong.small {font-family: Fractual; font-size:12px; line-height: 18px;}
.action, button, .button {font-family: Fractual; font-size:16px; line-height: 24px;}
.action-large, .button-large {font-family: Fractual; font-size:18px; line-height: 24px;}
.action-small, .button-small {font-family: Fractual; font-size:12px; line-height: 16px;}


@media (max-width: 1200px){
body {font-family: Fractual; font-size:14px; line-height: 22px;}
.large {font-family: Fractual; font-size:18px; line-height: 25px;}
.small {font-family: Fractual; font-size:11px; line-height: 17px;}
h1, .h1 {font-family: Fractual; font-size:58px; line-height: 63px;}
h2, .h2 {font-family: Fractual; font-size:38px; line-height: 43px;}
h3, .h3 {font-family: Fractual; font-size:28px; line-height: 33px;}
h4, .h4 {font-family: Fractual; font-size:18px; line-height: 24px;}
h5, .h5 {font-family: Fractual; font-size:14px; line-height: 22px;}
h6, .h6 {font-family: Fractual; font-size:12px; line-height: 16px;}
strong {font-family: Fractual; font-size:14px; line-height: 22px;}
.large strong, strong .large, strong.large {font-family: Fractual; font-size:18px; line-height: 25px;}
.small strong, strong .small, strong.small {font-family: Fractual; font-size:11px; line-height: 17px;}
.action, button, .button {font-family: Fractual; font-size:14px; line-height: 22px;}
.action-large, .button-large {font-family: Fractual; font-size:16px; line-height: 22px;}
.action-small, .button-small {font-family: Fractual; font-size:11px; line-height: 15px;}
}


@media (max-width: 768px){
body {font-family: Fractual; font-size:12px; line-height: 20px;}
.large {font-family: Fractual; font-size:16px; line-height: 23px;}
.small {font-family: Fractual; font-size:10px; line-height: 16px;}
h1, .h1 {font-family: Fractual; font-size:56px; line-height: 62px;}
h2, .h2 {font-family: Fractual; font-size:36px; line-height: 41px;}
h3, .h3 {font-family: Fractual; font-size:26px; line-height: 31px;}
h4, .h4 {font-family: Fractual; font-size:16px; line-height: 22px;}
h5, .h5 {font-family: Fractual; font-size:12px; line-height: 20px;}
h6, .h6 {font-family: Fractual; font-size:10px; line-height: 14px;}
strong {font-family: Fractual; font-size:12px; line-height: 20px;}
.large strong, strong .large, strong.large {font-family: Fractual; font-size:16px; line-height: 23px;}
.small strong, strong .small, strong.small {font-family: Fractual; font-size:10px; line-height: 16px;}
.action, button, .button {font-family: Fractual; font-size:12px; line-height: 20px;}
.action-large, .button-large {font-family: Fractual; font-size:14px; line-height: 20px;}
.action-small, .button-small {font-family: Fractual; font-size:10px; line-height: 14px;}
}

:root {
--primary-light: #e7edf0;
--primary-light-10: #e7edf01a;
.back-primary-light-10 {background-color: #e7edf01a;}
.text-primary-light-10 {color: #e7edf01a;}
--primary-light-20: #e7edf033;
.back-primary-light-20 {background-color: #e7edf033;}
.text-primary-light-20 {color: #e7edf033;}
--primary-light-30: #e7edf04d;
.back-primary-light-30 {background-color: #e7edf04d;}
.text-primary-light-30 {color: #e7edf04d;}
--primary-light-40: #e7edf066;
.back-primary-light-40 {background-color: #e7edf066;}
.text-primary-light-40 {color: #e7edf066;}
--primary-light-50: #e7edf080;
.back-primary-light-50 {background-color: #e7edf080;}
.text-primary-light-50 {color: #e7edf080;}
--primary-light-60: #e7edf099;
.back-primary-light-60 {background-color: #e7edf099;}
.text-primary-light-60 {color: #e7edf099;}
--primary-light-70: #e7edf0b3;
.back-primary-light-70 {background-color: #e7edf0b3;}
.text-primary-light-70 {color: #e7edf0b3;}
--primary-light-80: #e7edf0cc;
.back-primary-light-80 {background-color: #e7edf0cc;}
.text-primary-light-80 {color: #e7edf0cc;}
--primary-light-90: #e7edf0e6;
.back-primary-light-90 {background-color: #e7edf0e6;}
.text-primary-light-90 {color: #e7edf0e6;}
--primary-base: #e0fc00;
--primary-base-10: #e0fc001a;
.back-primary-base-10 {background-color: #e0fc001a;}
.text-primary-base-10 {color: #e0fc001a;}
--primary-base-20: #e0fc0033;
.back-primary-base-20 {background-color: #e0fc0033;}
.text-primary-base-20 {color: #e0fc0033;}
--primary-base-30: #e0fc004d;
.back-primary-base-30 {background-color: #e0fc004d;}
.text-primary-base-30 {color: #e0fc004d;}
--primary-base-40: #e0fc0066;
.back-primary-base-40 {background-color: #e0fc0066;}
.text-primary-base-40 {color: #e0fc0066;}
--primary-base-50: #e0fc0080;
.back-primary-base-50 {background-color: #e0fc0080;}
.text-primary-base-50 {color: #e0fc0080;}
--primary-base-60: #e0fc0099;
.back-primary-base-60 {background-color: #e0fc0099;}
.text-primary-base-60 {color: #e0fc0099;}
--primary-base-70: #e0fc00b3;
.back-primary-base-70 {background-color: #e0fc00b3;}
.text-primary-base-70 {color: #e0fc00b3;}
--primary-base-80: #e0fc00cc;
.back-primary-base-80 {background-color: #e0fc00cc;}
.text-primary-base-80 {color: #e0fc00cc;}
--primary-base-90: #e0fc00e6;
.back-primary-base-90 {background-color: #e0fc00e6;}
.text-primary-base-90 {color: #e0fc00e6;}
--primary-dark: #ff5f1f;
--primary-dark-10: #ff5f1f1a;
.back-primary-dark-10 {background-color: #ff5f1f1a;}
.text-primary-dark-10 {color: #ff5f1f1a;}
--primary-dark-20: #ff5f1f33;
.back-primary-dark-20 {background-color: #ff5f1f33;}
.text-primary-dark-20 {color: #ff5f1f33;}
--primary-dark-30: #ff5f1f4d;
.back-primary-dark-30 {background-color: #ff5f1f4d;}
.text-primary-dark-30 {color: #ff5f1f4d;}
--primary-dark-40: #ff5f1f66;
.back-primary-dark-40 {background-color: #ff5f1f66;}
.text-primary-dark-40 {color: #ff5f1f66;}
--primary-dark-50: #ff5f1f80;
.back-primary-dark-50 {background-color: #ff5f1f80;}
.text-primary-dark-50 {color: #ff5f1f80;}
--primary-dark-60: #ff5f1f99;
.back-primary-dark-60 {background-color: #ff5f1f99;}
.text-primary-dark-60 {color: #ff5f1f99;}
--primary-dark-70: #ff5f1fb3;
.back-primary-dark-70 {background-color: #ff5f1fb3;}
.text-primary-dark-70 {color: #ff5f1fb3;}
--primary-dark-80: #ff5f1fcc;
.back-primary-dark-80 {background-color: #ff5f1fcc;}
.text-primary-dark-80 {color: #ff5f1fcc;}
--primary-dark-90: #ff5f1fe6;
.back-primary-dark-90 {background-color: #ff5f1fe6;}
.text-primary-dark-90 {color: #ff5f1fe6;}
--secondary-light: #e7edf0;
--secondary-light-10: #e7edf01a;
.back-secondary-light-10 {background-color: #e7edf01a;}
.text-secondary-light-10 {color: #e7edf01a;}
--secondary-light-20: #e7edf033;
.back-secondary-light-20 {background-color: #e7edf033;}
.text-secondary-light-20 {color: #e7edf033;}
--secondary-light-30: #e7edf04d;
.back-secondary-light-30 {background-color: #e7edf04d;}
.text-secondary-light-30 {color: #e7edf04d;}
--secondary-light-40: #e7edf066;
.back-secondary-light-40 {background-color: #e7edf066;}
.text-secondary-light-40 {color: #e7edf066;}
--secondary-light-50: #e7edf080;
.back-secondary-light-50 {background-color: #e7edf080;}
.text-secondary-light-50 {color: #e7edf080;}
--secondary-light-60: #e7edf099;
.back-secondary-light-60 {background-color: #e7edf099;}
.text-secondary-light-60 {color: #e7edf099;}
--secondary-light-70: #e7edf0b3;
.back-secondary-light-70 {background-color: #e7edf0b3;}
.text-secondary-light-70 {color: #e7edf0b3;}
--secondary-light-80: #e7edf0cc;
.back-secondary-light-80 {background-color: #e7edf0cc;}
.text-secondary-light-80 {color: #e7edf0cc;}
--secondary-light-90: #e7edf0e6;
.back-secondary-light-90 {background-color: #e7edf0e6;}
.text-secondary-light-90 {color: #e7edf0e6;}
--secondary-base: #115572;
--secondary-base-10: #1155721a;
.back-secondary-base-10 {background-color: #1155721a;}
.text-secondary-base-10 {color: #1155721a;}
--secondary-base-20: #11557233;
.back-secondary-base-20 {background-color: #11557233;}
.text-secondary-base-20 {color: #11557233;}
--secondary-base-30: #1155724d;
.back-secondary-base-30 {background-color: #1155724d;}
.text-secondary-base-30 {color: #1155724d;}
--secondary-base-40: #11557266;
.back-secondary-base-40 {background-color: #11557266;}
.text-secondary-base-40 {color: #11557266;}
--secondary-base-50: #11557280;
.back-secondary-base-50 {background-color: #11557280;}
.text-secondary-base-50 {color: #11557280;}
--secondary-base-60: #11557299;
.back-secondary-base-60 {background-color: #11557299;}
.text-secondary-base-60 {color: #11557299;}
--secondary-base-70: #115572b3;
.back-secondary-base-70 {background-color: #115572b3;}
.text-secondary-base-70 {color: #115572b3;}
--secondary-base-80: #115572cc;
.back-secondary-base-80 {background-color: #115572cc;}
.text-secondary-base-80 {color: #115572cc;}
--secondary-base-90: #115572e6;
.back-secondary-base-90 {background-color: #115572e6;}
.text-secondary-base-90 {color: #115572e6;}
--secondary-dark: #115572;
--secondary-dark-10: #1155721a;
.back-secondary-dark-10 {background-color: #1155721a;}
.text-secondary-dark-10 {color: #1155721a;}
--secondary-dark-20: #11557233;
.back-secondary-dark-20 {background-color: #11557233;}
.text-secondary-dark-20 {color: #11557233;}
--secondary-dark-30: #1155724d;
.back-secondary-dark-30 {background-color: #1155724d;}
.text-secondary-dark-30 {color: #1155724d;}
--secondary-dark-40: #11557266;
.back-secondary-dark-40 {background-color: #11557266;}
.text-secondary-dark-40 {color: #11557266;}
--secondary-dark-50: #11557280;
.back-secondary-dark-50 {background-color: #11557280;}
.text-secondary-dark-50 {color: #11557280;}
--secondary-dark-60: #11557299;
.back-secondary-dark-60 {background-color: #11557299;}
.text-secondary-dark-60 {color: #11557299;}
--secondary-dark-70: #115572b3;
.back-secondary-dark-70 {background-color: #115572b3;}
.text-secondary-dark-70 {color: #115572b3;}
--secondary-dark-80: #115572cc;
.back-secondary-dark-80 {background-color: #115572cc;}
.text-secondary-dark-80 {color: #115572cc;}
--secondary-dark-90: #115572e6;
.back-secondary-dark-90 {background-color: #115572e6;}
.text-secondary-dark-90 {color: #115572e6;}
--neutral-light: #115572;
--neutral-light-10: #1155721a;
.back-neutral-light-10 {background-color: #1155721a;}
.text-neutral-light-10 {color: #1155721a;}
--neutral-light-20: #11557233;
.back-neutral-light-20 {background-color: #11557233;}
.text-neutral-light-20 {color: #11557233;}
--neutral-light-30: #1155724d;
.back-neutral-light-30 {background-color: #1155724d;}
.text-neutral-light-30 {color: #1155724d;}
--neutral-light-40: #11557266;
.back-neutral-light-40 {background-color: #11557266;}
.text-neutral-light-40 {color: #11557266;}
--neutral-light-50: #11557280;
.back-neutral-light-50 {background-color: #11557280;}
.text-neutral-light-50 {color: #11557280;}
--neutral-light-60: #11557299;
.back-neutral-light-60 {background-color: #11557299;}
.text-neutral-light-60 {color: #11557299;}
--neutral-light-70: #115572b3;
.back-neutral-light-70 {background-color: #115572b3;}
.text-neutral-light-70 {color: #115572b3;}
--neutral-light-80: #115572cc;
.back-neutral-light-80 {background-color: #115572cc;}
.text-neutral-light-80 {color: #115572cc;}
--neutral-light-90: #115572e6;
.back-neutral-light-90 {background-color: #115572e6;}
.text-neutral-light-90 {color: #115572e6;}
--neutral-base: #cfdbe2;
--neutral-base-10: #cfdbe21a;
.back-neutral-base-10 {background-color: #cfdbe21a;}
.text-neutral-base-10 {color: #cfdbe21a;}
--neutral-base-20: #cfdbe233;
.back-neutral-base-20 {background-color: #cfdbe233;}
.text-neutral-base-20 {color: #cfdbe233;}
--neutral-base-30: #cfdbe24d;
.back-neutral-base-30 {background-color: #cfdbe24d;}
.text-neutral-base-30 {color: #cfdbe24d;}
--neutral-base-40: #cfdbe266;
.back-neutral-base-40 {background-color: #cfdbe266;}
.text-neutral-base-40 {color: #cfdbe266;}
--neutral-base-50: #cfdbe280;
.back-neutral-base-50 {background-color: #cfdbe280;}
.text-neutral-base-50 {color: #cfdbe280;}
--neutral-base-60: #cfdbe299;
.back-neutral-base-60 {background-color: #cfdbe299;}
.text-neutral-base-60 {color: #cfdbe299;}
--neutral-base-70: #cfdbe2b3;
.back-neutral-base-70 {background-color: #cfdbe2b3;}
.text-neutral-base-70 {color: #cfdbe2b3;}
--neutral-base-80: #cfdbe2cc;
.back-neutral-base-80 {background-color: #cfdbe2cc;}
.text-neutral-base-80 {color: #cfdbe2cc;}
--neutral-base-90: #cfdbe2e6;
.back-neutral-base-90 {background-color: #cfdbe2e6;}
.text-neutral-base-90 {color: #cfdbe2e6;}
--neutral-dark: #353b41;
--neutral-dark-10: #353b411a;
.back-neutral-dark-10 {background-color: #353b411a;}
.text-neutral-dark-10 {color: #353b411a;}
--neutral-dark-20: #353b4133;
.back-neutral-dark-20 {background-color: #353b4133;}
.text-neutral-dark-20 {color: #353b4133;}
--neutral-dark-30: #353b414d;
.back-neutral-dark-30 {background-color: #353b414d;}
.text-neutral-dark-30 {color: #353b414d;}
--neutral-dark-40: #353b4166;
.back-neutral-dark-40 {background-color: #353b4166;}
.text-neutral-dark-40 {color: #353b4166;}
--neutral-dark-50: #353b4180;
.back-neutral-dark-50 {background-color: #353b4180;}
.text-neutral-dark-50 {color: #353b4180;}
--neutral-dark-60: #353b4199;
.back-neutral-dark-60 {background-color: #353b4199;}
.text-neutral-dark-60 {color: #353b4199;}
--neutral-dark-70: #353b41b3;
.back-neutral-dark-70 {background-color: #353b41b3;}
.text-neutral-dark-70 {color: #353b41b3;}
--neutral-dark-80: #353b41cc;
.back-neutral-dark-80 {background-color: #353b41cc;}
.text-neutral-dark-80 {color: #353b41cc;}
--neutral-dark-90: #353b41e6;
.back-neutral-dark-90 {background-color: #353b41e6;}
.text-neutral-dark-90 {color: #353b41e6;}
--white: #ffffff;
--white-10: #ffffff1a;
.back-white-10 {background-color: #ffffff1a;}
.text-white-10 {color: #ffffff1a;}
--white-20: #ffffff33;
.back-white-20 {background-color: #ffffff33;}
.text-white-20 {color: #ffffff33;}
--white-30: #ffffff4d;
.back-white-30 {background-color: #ffffff4d;}
.text-white-30 {color: #ffffff4d;}
--white-40: #ffffff66;
.back-white-40 {background-color: #ffffff66;}
.text-white-40 {color: #ffffff66;}
--white-50: #ffffff80;
.back-white-50 {background-color: #ffffff80;}
.text-white-50 {color: #ffffff80;}
--white-60: #ffffff99;
.back-white-60 {background-color: #ffffff99;}
.text-white-60 {color: #ffffff99;}
--white-70: #ffffffb3;
.back-white-70 {background-color: #ffffffb3;}
.text-white-70 {color: #ffffffb3;}
--white-80: #ffffffcc;
.back-white-80 {background-color: #ffffffcc;}
.text-white-80 {color: #ffffffcc;}
--white-90: #ffffffe6;
.back-white-90 {background-color: #ffffffe6;}
.text-white-90 {color: #ffffffe6;}
--black: #000000;
--black-10: #0000001a;
.back-black-10 {background-color: #0000001a;}
.text-black-10 {color: #0000001a;}
--black-20: #00000033;
.back-black-20 {background-color: #00000033;}
.text-black-20 {color: #00000033;}
--black-30: #0000004d;
.back-black-30 {background-color: #0000004d;}
.text-black-30 {color: #0000004d;}
--black-40: #00000066;
.back-black-40 {background-color: #00000066;}
.text-black-40 {color: #00000066;}
--black-50: #00000080;
.back-black-50 {background-color: #00000080;}
.text-black-50 {color: #00000080;}
--black-60: #00000099;
.back-black-60 {background-color: #00000099;}
.text-black-60 {color: #00000099;}
--black-70: #000000b3;
.back-black-70 {background-color: #000000b3;}
.text-black-70 {color: #000000b3;}
--black-80: #000000cc;
.back-black-80 {background-color: #000000cc;}
.text-black-80 {color: #000000cc;}
--black-90: #000000e6;
.back-black-90 {background-color: #000000e6;}
.text-black-90 {color: #000000e6;}
--gradient-left-right: linear-gradient(to right, #e0fc00, #89d957);
--gradient-right-left: linear-gradient(to left, #e0fc00, #89d957);
.background--gradient-left-right { background: var(--gradient-left-right); }
.background--gradient-right-left { background: var(--gradient-right-left); }
.color--gradient-left-right { color: var(--gradient-left-right); }
.color--gradient-right-left { color: var(--gradient-right-left); }
.border--gradient-left-right { border: 1px solid var(--gradient-left-right); border-color: var(--gradient-left-right) !important; }
.border--gradient-right-left { border: 1px solid var(--gradient-right-left); border-color: var(--gradient-right-left) !important; }
}
.hidden {display: none !important}