body {
    margin: 0;
    line-height: normal;
  }
  
  :root {
    /* fonts */
    --font-lato: Lato;
    --font-rock-salt: "Rock Salt";
    --font-playfair-display: "Playfair Display";
    --font-lora: Lora;
    --font-montserrat: Montserrat;
    --font-roboto: Roboto;
  
    /* font sizes */
    --font-size-3xs: 10px;
    --font-size-base: 16px;
    --font-size-lg: 18px;
    --font-size-mini: 15px;
    --font-size-xl: 20px;
    --font-size-11xl: 30px;
    --font-size-8xl: 27px;
    --font-size-13xl: 32px;
  
    /* Colors */
    --foreground: #5c5c5c;
    --color-dimgray-100: rgba(92, 92, 92, 0.25);
    --color-white: #fff;
    --color-black: #000;
    --color-gray-100: #939191;
    --color-gray-300: rgba(147, 145, 145, 0.9);
    --color-gray-200: rgba(0, 0, 0, 0.66);
    --color-goldenrod: #e29323;
    --color-gold: #ffe300;
    --color-blue: #000aff;
  
    /* Gaps */
    --gap-11xl: 30px;
    --gap-mini: 15px;
    --gap-3xs: 10px;
    --gap-31xl: 50px;
    --gap-8xs: 5px;
    --gap-xl: 20px;
  
    /* Paddings */
    --padding-xl: 20px;
    --padding-31xl: 50px;
    --padding-15xl: 34px;
    --padding-8xs: 5px;
    --padding-3xs: 10px;
    --padding-18xl: 37px;
    --padding-6xl: 25px;
    --padding-8xl: 27px;
    --padding-xs: 12px;
    --padding-21xl: 40px;
    --padding-11xl: 30px;
  
    /* Border radiuses */
    --br-235xl: 254px;
  }