@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

body {
  background-image: url(../images/stars.png);
}

.brand {
  background-image: url(../images/brand.jpg);
}

a {
  color: orangered;
  font-weight: 600;
  &:hover {
    color: red;
  }
}

a[target="_blank"]::after {
  font-family: "bootstrap-icons";
  content: " \F1C5";
  font-size: 0.7em;
  position: relative;
  top: -6px;
  left: 2px;
  margin-right: 2px;
}

ul {
  list-style: disc;
  li {
    margin-bottom: 5px;
  }
}

.skills {
  list-style: none;
  font-size: 0.9em;
  overflow: hidden;
  li {
    background-color: #151516;
    text-align: center;
    padding: 9px 5px;
    margin-bottom: 0;
    color: #fff;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%,0 calc(100% - 10px));
    &:hover {
      cursor: default;
    }
  }
}

/* .logo {
  clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 15px 100%,0 calc(100% - 15px));
} */

/* #app {
  clip-path: polygon(0 0, calc(100% - 45px) 0, 100% 45px, 100% 100%, 45px 100%,0 calc(100% - 45px));
} */