@font-face {
    font-family: "monolisa";
    src: url("../fonts/Monolisa\ Font.ttf");
}
@font-face {
    font-family: "jetbrainsmono";
    src: url("../fonts/JetBrainsMono-Medium.ttf");
}
@font-face {
    font-family: "sourcecodepro";
    src: url("../fonts/SourceCodePro-Regular.ttf");
}
@font-face {
    font-family: "monoid";
    src: url("../fonts/Monoid-Regular.ttf");
}
body {
    color: white;
    background-size: cover;  
    background-color: #2c2c2c;
    font-family: "sourcecodepro";  
}

/* header */

header {
    z-index: 99;
    font-family: "jetbrainsmono";
    background-color: #1e1e1f;  
    position: fixed;  
    left: 0px;  
    right: 0px;  
    top: 0px;  
    height: 50px;  
    display: flex;  
    align-items: center;
}
header p {
    color: white;
    display: inline-block;
}
header h3  {
    position: relative;
    margin-right: 0px;
    margin-left: 0px;
    color: greenyellow;
}
header * { 
    position: relative;
    display: inline-block;
    margin-left: auto;
    margin-right: 15px;
}
header li a {  
    color: white;
    text-decoration: none;
}
  
/* header links */

header a::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    border-radius: 4px;
    background-color: greenyellow;
    bottom: 0;
    left: 0;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .3s ease-in-out;
}
  
header a:hover::before {
    transform-origin: left;
    transform: scaleX(1);
}

/* blink */
.blinking-cursor {
    color: white;
    -webkit-animation: 1s blink step-end infinite;
    -moz-animation: 1s blink step-end infinite;
    -ms-animation: 1s blink step-end infinite;
    -o-animation: 1s blink step-end infinite;
    animation: 1s blink step-end infinite;
  }
  
@keyframes blink {
    from, to {
      color: transparent;
    }
    50% {
      color: white;
    }
}
  
@-moz-keyframes blink {
    from, to {
      color: transparent;
    }
    50% {
      color: white;
    }
}
  
@-webkit-keyframes blink {
    from, to {
      color: transparent;
    }
    50% {
      color: white;
    }
}
  
@-ms-keyframes blink {
    from, to {
      color: transparent;
    }
    50% {
      color: white;
    }
}
  
@-o-keyframes blink {
    from, to {
      color: transparent;
    }
    50% {
      color: white;
    }
}