@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

  @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } }
  @keyframes slideInUp { from { transform: translateY(100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  @keyframes slideInDown { from { transform: translateY(-100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  @keyframes slideInLeft { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
  @keyframes slideInRight { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
  @keyframes zoomIn { from { transform: scale(0.5); opacity: 0; } to { transform: scale(1); opacity: 1; } }
  @keyframes zoomOut { from { transform: scale(1); opacity: 1; } to { transform: scale(0.5); opacity: 0; } }
  @keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(-30px); } 60% { transform: translateY(-15px); } }
  @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } }
  @keyframes flip { from { transform: rotateY(0); } to { transform: rotateY(180deg); } }


:root {

  /* Profit Jam Branded Colors */

  --color-white: #FFFFFF;
  --color-off-white: #F9F9F9;
  --color-spec-grey: #d8e4eb;
  --color-light-grey: #EEEEEE;
  --color-medium-grey: #D6D6D6;
  --color-dark-grey: #C3C3C3;

  --color-light-teal: #0CC0DF;
  --color-dark-teal: #0097B2;
  --color-ocean-blue: #005261;
  --color-midnight-blue: #021E30;

  --color-green: #00BF63;
  --color-yellow: #FFDE59;
  --color-orange: #FFBD59;
  --color-red: #FF5757;
  
  /* Colors for Default Themes */
  
  --primary-color: #0097B2; /* dark teal */
  --secondary-color: #005261; /* ocean blue */
  --accent-color: #0CC0DF; /* light teal */
  --text-color: #021E30; /* midnight blue */
  --background-color: transparent; /* off white */

  --color-success: #00BF63; /* green */
  --color-danger: #FF5757; /* red */

  --primary-font: 'Poppins', sans-serif;
  --secondary-font: 'Plus Jakarta Sans', sans-serif;

  --border-radius: 8px;
  --border-width: 1px;
  --border-style: solid;
  --border-color: #C3C3C3; /* dark grey */

  --font-size-h1: 42px;
  --font-size-h2: 36px;
  --font-size-h3: 30px;
  --font-size-h4: 24px;
  --font-size-h5: 22px;
  --font-size-h6: 18px;
  --font-size-normal: 18px;
  --font-size-small: 16px;

  --font-weight-bold: 700;

  --padding-section: 40px;
  --padding-button: 8px 12px;
  --padding-input: 10px;

  --gv-stack: flex;
  --gv-grid: grid;

  --gap-10: 10px;
  --gap-20: 20px;
  --gap-30: 30px;
  --gap-40: 40px;
  --gap-50: 50px;
  --gap-60: 60px;
  --gap-70: 70px;
  --gap-80: 80px;

  --padding-0: 0px;
  --padding-10: 10px;
  --padding-20: 20px;
  --padding-30: 30px;
  --padding-40: 40px;
  --padding-50: 50px;
  --padding-60: 60px;
  --padding-70: 70px;
  --padding-80: 80px;

  --margin-0: 0px;
  --margin-10: 10px;
  --margin-20: 20px;
  --margin-30: 30px;
  --margin-40: 40px;
  --margin-50: 50px;
  --margin-60: 60px;
  --margin-70: 70px;
  --margin-80: 80px;

  --width-max: 100%;
  --height-max: 100%;

  --min-height-500: 500px;

  --max-width-1200: 1200px;
  --max-width-1100: 1100px;
  --max-width-1000: 1000px;
  --max-width-900: 900px;
  --max-width-800: 800px;
  --max-width-700: 700px;
  --max-width-600: 600px;
  --max-width-500: 500px;
  --max-width-400: 400px;
  --max-width-300: 300px;
}