@font-face {
  font-family: artDeco;
src:  url('fonts/sltfroguerebellion.woff2') format('woff2'),
}

@font-face {
  font-family: RobotoFlex;
src:  url('fonts/RobotoFlex.woff2') format('woff2'),
}

@font-face {
  font-family: Cormorant-Light;
src:  url('fonts/Cormorant-Light.woff2') format('woff2'),
}


h1 {
   font-family: artDeco;
   font-size: 4rem;
}
h2 {
   font-family: Cormorant-Light;
   font-size: 2.5rem;
}

h3{
   font-family: artDeco;
}

a {
  font-family: Cormorant-Light;
  color: black;
}




body {
  font-family: "RobotoFlex", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "GRAD" -200,
    "XOPQ" 96,
    "XTRA" 468,
    "YOPQ" 79,
    "YTAS" 750,
    "YTDE" -203,
    "YTFI" 738,
    "YTLC" 514,
    "YTUC" 712;
}





.menuEntry {
  margin: 5px;
  padding: 5px;
  color: black;
   font-family: Cormorant-Light;
   font-size: 2.5rem;
}


.menuContainer {
  list-style-type: none;

  display: flex;
}

.coolLink {
  text-decoration: none;
  font-family: artDeco  ;
  overflow: hidden;
  position: relative;
  transition: color 1s ;
  color: black
}


.coolLink:hover::before {
  content: none;
  color: red;
  position:absolute;
  left:0;
  top:0;
} 

.coolLink:hover{
  content: none;
  color: blue; 
   font-family: Cormorant-Light;
   font-size: 2.5rem;
}
.coolLink:hover::after {
  color: green
}