
// terminal window
.fakeButtons {
    height: .80rem;
    width: .80rem;
    border-radius: 50%;
    border: 1px solid #000;
    position: relative;
    top: 6px;


  }
  
  .fakeClose {
    left: 6px;
    background-color: #ff3b47;
    border-color: #9d252b;
    border-radius: 9999px;
    height: .80rem;
    width: .80rem;
  }
  .fakeMinimize {
    left: 11px;
    background-color: #ffc100;
    border-color: #9d802c;
    border-radius: 9999px;
    height: .80rem;
    width: .80rem;
  }
  
  .fakeZoom {
    left: 16px;
    background-color: #00d742;
    border-color: #049931;
    border-radius: 9999px;
    height: .80rem;
    width: .80rem;
  }
  
  .fakeMenu {
    width: 100%;
    box-sizing: border-box;
    background-color: #a0aec0;
    margin: 0 auto;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}
  
  .fakeScreen {
    background-color: #2d2e45;
    box-sizing: border-box;
    width: 100%;
    height: 300px;
    margin: 0 auto;
    padding: 20px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
  }
  
.fakeScreen p {
    position: relative;
    left: 50%;
    margin-left: -15.5em;
    text-align: left;
    font-size: 1.25em;
    font-family: monospace;
    white-space: normal;
    overflow: hidden;
    min-width: 420px;
}
  
  .fakeScreen span {
    color: #fff;
    font-weight: bold;
  }
  
  .line1 {
    color: #9CD9F0;
    -webkit-animation: type .5s 1s steps(20, end) forwards;
    -moz-animation: type .5s 1s steps(20, end) forwards;
    -o-animation: type .5s 1s steps(20, end) forwards;
    animation: type .5s 1s steps(20, end) forwards;
  }
  
  .cursor1 {
    -webkit-animation: blink 1s 2s 2 forwards;
    -moz-animation: blink 1s 2s 2 forwards;
    -o-animation: blink 1s 2s 2 forwards;
    animation: blink 1s 2s 2 forwards;
  }
  
  .line2 {
    color: #CDEE69;
    -webkit-animation: type .5s 4.25s steps(20, end) forwards;
    -moz-animation: type .5s 4.25s steps(20, end) forwards;
    -o-animation: type .5s 4.25s steps(20, end) forwards;
    animation: type .5s 4.25s steps(20, end) forwards;
  }
  
  .cursor2 {
    -webkit-animation: blink 1s 5.25s 2 forwards;
    -moz-animation: blink 1s 5.25s 2 forwards;
    -o-animation: blink 1s 5.25s 2 forwards;
    animation: blink 1s 5.25s 2 forwards;
  }
  
  .line3 {
    color: #E09690;
    -webkit-animation: type .5s 7.5s steps(20, end) forwards;
    -moz-animation: type .5s 7.5s steps(20, end) forwards;
    -o-animation: type .5s 7.5s steps(20, end) forwards;
    animation: type .5s 7.5s steps(20, end) forwards;
  }
  
  .cursor3 {
    -webkit-animation: blink 1s 8.5s 2 forwards;
    -moz-animation: blink 1s 8.5s 2 forwards;
    -o-animation: blink 1s 8.5s 2 forwards;
    animation: blink 1s 8.5s 2 forwards;
  }
  
  .line4 {
    color: #fff;
    -webkit-animation: type .5s 10.75s steps(20, end) forwards;
    -moz-animation: type .5s 10.75s steps(20, end) forwards;
    -o-animation: type .5s 10.75s steps(20, end) forwards;
    animation: type .5s 10.75s steps(20, end) forwards;
  }
  
  .cursor4 {
    -webkit-animation: blink 1s 11.5s infinite;
    -moz-animation: blink 1s 8.5s infinite;
    -o-animation: blink 1s 8.5s infinite;
    animation: blink 1s 8.5s infinite;
  }
  
  @-webkit-keyframes blink {
    0% {
      opacity: 0;
    }
    40% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    90% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  @-moz-keyframes blink {
    0% {
      opacity: 0;
    }
    40% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    90% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  @-o-keyframes blink {
    0% {
      opacity: 0;
    }
    40% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    90% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  @keyframes blink {
    0% {
      opacity: 0;
    }
    40% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    90% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  @-webkit-keyframes type {
    to {
      width: 17em;
    }
  }
  
  @-moz-keyframes type {
    to {
      width: 17em;
    }
  }
  
  @-o-keyframes type {
    to {
      width: 17em;
    }
  }
  
  @keyframes type {
    to {
      width: 17em;
    }
  }



  /*  tech icon positioning */
  .ml-1 {
    margin-left: .25rem;
}

.mr-3 {
  margin-right: .75rem;
}

.h-4 {
  height: 1rem;
}
.h-8 {
    height: 4rem;
}

.p-2 {
  padding: .5rem !important;
}

.ml-2 {
  margin-left: .5rem
}
.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
}

.border-r-2 {
  border-right-width: 2px !important;
}

.inline-flex {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex
}
