@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");
._bg_1xbyv_2 {
  top: 0;
  left: 0;
  position: fixed;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  background: var(--bg);
  flex-direction: column;
  gap: 10px;
  --bg: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 27, 59, 1) 100%);
}
._pfp_1xbyv_17 {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  user-select: none;
  -moz-user-select: none;
}
._username_1xbyv_25 {
  font-family: nunito;
  font-size: 30px;
  font-weight: bold;
  color: white;
}
._desc_1xbyv_32 {
  font-family: nunito;
  font-size: 1vw;
  color: rgb(153, 153, 153);
  text-align: center;
  width: 50%;
}
._sidebar_1xbyv_40 {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 21%;
  background: var(--sideBar-color);
  --sideBar-color: #00060c;
  z-index: 999;
  display: flex;
  justify-content: center;
  box-shadow: inset -15px 0px 0 rgb(0, 0, 0, 0.2);
}
._sideText_1xbyv_54 {
  width: 100%;
  text-align: center;
  color: white;
  position: absolute;
  top: 5%;
  font-family: "Nunito";
  font-weight: bold;
  font-size: 3vw;
}
._sideItems_1xbyv_65 {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 3vh;
}
._sideItem_1xbyv_65 {
  font-size: 2.4vw;
  text-decoration: none;
  color: #9d9d9d;
  font-family: "Nunito";
  font-weight: 700;
  width: calc(100% - 30px);
  text-align: center;
  transition: 0.2s;
  cursor: pointer;
}
._sideItem_1xbyv_65:hover {
  font-size: 3vw;
  background-color: #000b16;
  border-radius: 5px;
  color: white;
}
._transition_1xbyv_94 {
  width: 100%;
  position: absolute;
  bottom: 200%;
  height: 100%;
  left: 0;
  z-index: 999;
  background: black;
}
._animated_1xbyv_104 {
  animation: _transition_1xbyv_94 2.5s linear;
}
@keyframes _transition_1xbyv_94 {
  from {
    bottom: 200%;
  }
  to {
    bottom: 0;
  }
}
._mobileNav_1xbyv_117 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 55px;
  background: #00060c;
  z-index: 9999;
  display: none;
  justify-content: center;
  align-items: center;
  gap: 3vw;
  font-size: 25px;
  color: white;
  box-shadow: inset 0 -7px 0 rgb(0, 0, 0, 0.2);
}
._langs_1xbyv_134 {
  width: calc(100% - 21%);
  display: flex;
  gap: 5px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}
._lang_1xbyv_134{
  width: 35px;
  transition: 0.3s;
}
._lang_1xbyv_134:hover{
  transform: scale(1.13);
}
._lang_1xbyv_134:active{
  transform: scale(0.9);
}
@media screen and (max-width: 485px) {
  ._sidebar_1xbyv_40 {
    display: none;
  }
  ._mobileNav_1xbyv_117 {
    display: flex;
  }
  ._desc_1xbyv_32 {
    font-size: 2.5vw;
  }
}

._bg_1pnc1_2 {
  top: 0;
  left: 0;
  position: fixed;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  background: var(--bg);
  flex-direction: column;
  gap: 10px;
  --bg: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 27, 59, 1) 100%);
}
._sidebar_1pnc1_17 {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 21%;
  background: var(--sideBar-color);
  --sideBar-color: #00060c;
  z-index: 999;
  display: flex;
  justify-content: center;
  box-shadow: inset -15px 0px 0 rgb(0, 0, 0, 0.2);
}
._sideText_1pnc1_31 {
  width: 100%;
  text-align: center;
  color: white;
  position: absolute;
  top: 5%;
  font-family: "Nunito";
  font-weight: bold;
  font-size: 3vw;
}
._sideItems_1pnc1_42 {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 3vh;
}
._sideItem_1pnc1_42 {
  font-size: 2.4vw;
  text-decoration: none;
  color: #9d9d9d;
  font-family: "Nunito";
  font-weight: 700;
  width: calc(100% - 30px);
  text-align: center;
  transition: 0.2s;
  cursor: pointer;
}
._sideItem_1pnc1_42:hover {
  font-size: 3vw;
  background-color: #000b16;
  border-radius: 5px;
}
._transition_1pnc1_70 {
  width: 100%;
  position: absolute;
  bottom: 200%;
  height: 100%;
  left: 0;
  z-index: 999;
  background: black;
}
._animated_1pnc1_80 {
  animation: _transition_1pnc1_70 2.5s linear;
}
@keyframes _transition_1pnc1_70 {
  from {
    bottom: 200%;
  }
  to {
    bottom: 0;
  }
}
._projects_1pnc1_93 {
  width: 79%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: row;
  flex-wrap: wrap;
  gap: 5px;
  left: 21%;
  position: absolute;
  overflow: auto;
  max-height: 98%;
}
._project_1pnc1_93 {
  width: 35%;
  height: 20%;
  background: #001227;
  border-radius: 5px;
  box-shadow: inset 0 -10px 0 rgb(0, 0, 0, 0.2);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-decoration: none;
}
._projectName_1pnc1_121 {
  font-size: 2vw;
  font-weight: bold;
  font-family: "Nunito";
  color: white;
}
._projectImage_1pnc1_128 {
  width: 40px;
}
._mobileNav_1pnc1_132 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 55px;
  background: #00060c;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3vw;
  font-size: 25px;
  color: white;
  box-shadow: inset 0 -7px 0 rgb(0, 0, 0, 0.2);
}
._mobileNav_1pnc1_132 i {
  cursor: pointer;
}
._main_1pnc1_153 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  flex-direction: column;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
._projectImage2_1pnc1_164 {
  width: 10vw;
}
._name_1pnc1_168 {
  width: 100%;
  text-align: center;
  color: white;
  font-size: 3vw;
  font-family: nunito;
  font-weight: bold;
}
._desc_1pnc1_177 {
  width: 100%;
  text-align: center;
  color: rgb(85, 85, 85);
  font-size: 1vw;
  font-family: nunito;
  font-weight: bold;
}
._date_1pnc1_186 {
  width: 100%;
  text-align: center;
  color: rgb(122, 122, 122);
  font-family: nunito;
  font-weight: bold;
}
._url_1pnc1_194 {
  text-align: center;
  color: rgb(255, 255, 255);
  font-family: nunito;
  font-weight: bold;
  font-size: 14px;
  width: 125px;
  height: 55px;
  background-color: rgb(1 27 57);
  display: flex;
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  box-shadow: inset 0px -5px 0 rgb(0, 0, 0, 0.5);
}
@media screen and (max-width: 485px) {
  ._projects_1pnc1_93 {
    left: 0;
    width: 100%;
  }
}