Base Css Root fileexample

root.css

:root {
  --header-height: 3rem;

  /*========== Colors ==========*/
  /* Change favorite color to match images */
  --hue-color: ;

  /* HSL color mode */
  --color: hsl(var(--hue-color), 64%, 22%);
 
  /*========== Font and typography ==========*/
  --body-font: 'Open Sans', sans-serif;
  --title-font:  sans-serif;
  --biggest-font-size: 2.5rem;


  /*========== Font weight ==========*/
  --font-medium: 500;
  --font-semi-bold: 600;

  /*========== Margins ==========*/


  /*========== z index ==========*/


  /*========== Hover overlay ==========*/

}
 /*========== Example Media ==========*/
@media screen and (min-width: 968px) {
  :root {
    --size: 4rem;
  }
}