/* NORMALIZE v8.01 */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type="button"],[type="reset"],[type="submit"],button{-webkit-appearance:button}[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/* CUSTOM PROPERTIES  & FONTS*/
  :root {
    /* --cl-white: #fdffff; */
    --cl-grey-light: #FFFDFE;
    --cl-white: #FFFDFE;
    /* used in form */
    --cl-white-off: #DFE8EA;
    --cl-black: #03080a;
    --cl-grey: #808080;
    --cl-grey-light: #999999;
    --cl-grey-dark: #333333;
    --cl-pri: #56cbf9;
    --cl-pri-light: #66dbff;
    --cl-pri-dark1: #2D6A82;
    --cl-pri-dark2: #183946;
    --cl-sec: #f757a4;
    --cl-sec-light: #ff66b6;
    --cl-ter: #f7e057;
    --cl-ter-light: #ffe566;
    /* code 300 500 */
    --ft-code: 'Fira Code', 'Courier New', Courier, monospace;
    /* sans 400 600 800 */
    --ft-sans: 'Open Sans', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --ft-mark: 'handelsontwo', Impact, 'Arial Narrow Bold', sans-serif;
    --line-height-mark: 0.62;
    --section-margin: 6.2%;
    --max-sm: 960px;
    --max-md: 1440px;
    --max-lg: 1620px;
    --space-sm: 12px;
    --space-md: 24px;
    --space-lg: 48px;
  
    --border-radius: 4px;
    --gradient-angle: 150deg;
  }
  @media screen and (min-width: 680px) {
    :root {
      --space-sm: calc(12px + (20 - 12) * (100vw - 680 * 1px) / (1040 - 680));
      --space-md: calc(24px + (36 - 24) * (100vw - 680 * 1px) / (1040 - 680));
      --space-lg: calc(48px + (64 - 48) * (100vw - 680 * 1px) / (1040 - 680));
    }
  }
  @media screen and (min-width: 1040px) {
    :root {
      --space-sm: 20px;
      --space-md: 36px;
      --space-lg: 64px;
    }
  }

  *:focus {
    /* outline: 1px solid var(--cl-pri); */
  }

  html {
  scroll-behavior: smooth;
  max-width: 100vw;
  min-width: 320px;
  overflow-x: hidden;
}
  body {
  max-width: 100vw;
  min-width: 320px;
  overflow-x: hidden;
  font-family: Arial, Helvetica, sans-serif;
}

@font-face {
  font-family: 'handelsontwo';
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  unicode-range: U+000-5FF;
  src: url('./handelson-two-webfont.woff2') format('woff2'),
      url('./handelson-two-webfont.woff') format('woff');
}

  .shadow {
    box-shadow: 7px 11px 23px -4px rgba(0,0,0,0.77);
  }
  .shadow-inset {
    box-shadow: inset 7px 11px 23px -4px rgba(0,0,0,0.77);
  }

  .gradient-text {
  /* standard gradient background */
  background: linear-gradient(
    var(--gradient-angle),  
    var(--cl-pri-dark1) 0%,
    var(--cl-pri) 10%,
    var(--cl-pri-light) 50%,
    var(--cl-pri) 60%,
    var(--cl-pri-dark1) 100%
    /* var(--cl-pri-dark2) 78.8% */
    );
  /* gradient clip hack */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  }

.page-transition {
  position: absolute;
}

.transition {
  transition: all 0.6s ease;
}
.transition-delay {
  transition-delay: 400ms;
}
.transitionL--off {
  opacity: 0;
  transform: translateX(-20%);
}
.transitionR--off {
  opacity: 0;
  transform: translateX(20%);
}
.transitionY--off {
  opacity: 0;
  transform: translateY(20px);
}
.transition--on {
  visibility: visible;
  opacity: 1;
  transform: translateX(0px);
}