.bgImg {
  width: 100%;
  height: 100vh;
  position: relative;
  /*z-index: -1;*/
  background: url("/assets/img/photo-1501691223387-dd0500403074.webp?h=5142155a1fdc2f078b586db18ba99f92") center / contain repeat-x;
  backdrop-filter: blur(0px) hue-rotate(-Infinitydeg);
  -webkit-backdrop-filter: blur(0px) hue-rotate(-Infinitydeg);
}

.bgImg2 {
  width: 100%;
  height: 100vh;
  position: relative;
  /*z-index: -1;*/
  background: url("/assets/img/avernus_effected.webp?h=c6562af5d08e3441968c2c33ab3891b0") center / 40% no-repeat;
  background-color: white;
}

@media (max-width: 6px) {
  .bgImg, .bgImg2 {
    height: calc(var(--vh) * 100);
  }
}

.bgImg::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url("/assets/img/avernus.webp?h=7f85f5a7d96b42b852dafb4ec0b5d1f9");
  background-position: center;
  background-size: 90%;
  background-color: #fff;
  background-repeat: no-repeat;
  mix-blend-mode: lighten;
  transition: filter 1s ease;
}

.bgImg.green::after {
  filter: hue-rotate(131deg) brightness(1) contrast(1);
}

.bgImg.blue::after {
  filter: hue-rotate(160deg) brightness(1) contrast(1);
}

.container.welcome {
  z-index: 1;
  position: relative;
}

@keyframes scroll {
  0% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(100px);
  }
}

svg #wheel {
  animation: scroll ease 1.5s infinite;
}

#scroll_down {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 1;
}

#scroll_down {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

#scroll_down.fade-in {
  opacity: 1;
  transform: translateY(0);
}

#scroll_down.fade-out {
  opacity: 0;
  transform: translateY(20px);
}

.full-height {
  height: calc(var(--vh) * 100);
}

#progress-container {
  width: 100%;
  height: 20px;
  border-radius: 10px;
  overflow: hidden;
}

#progress-bar {
  width: 0%;
  height: 100%;
  transition: width 0.2s;
}

::selection {
  color: #fff;
  background: var(--bs-link-hover-color);
  text-shadow: none;
}

#stage.loading:before {
  content: "";
  width: 100%;
  height: 100vh;
  display: block;
  background: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

#loader_block {
  z-index: 1;
  position: relative;
}

#lang_select_btn {
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  z-index: 10;
}

.underline-animation {
  text-decoration: none;
  position: relative;
  white-space: nowrap;
  margin-bottom: 15px;
}

.underline-animation svg {
  position: absolute;
  top: 80%;
  left: 0;
  width: 100%;
  height: auto;
}

.underline-animation .stroke {
  stroke: #0f7393d4;
  stroke-width: 0.12em;
  stroke-dasharray: 822;
  stroke-dashoffset: 822;
  /*animation: underlineAnimation 1.8s 2.2s linear forwards;*/
  animation: underlineAnimation 1s 2.2s linear forwards;
}

@keyframes underlineAnimation {
  from {
    stroke-dashoffset: 822;
  }
  to {
    stroke-dashoffset: 0;
  }
}

.link-primary:hover, .link-primary:focus {
  color: RGBA(var(--bs-primary-rgb), var(--bs-link-opacity, 0.8)) !important;
  text-decoration-color: RGBA(255, 127, 220, var(--bs-link-underline-opacity, 1)) !important;
}

#header-modal {
  width: 40vw;
  height: 40vh;
  border: 1px solid black;
  position: absolute;
  right: 0;
  top: 3rem;
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(4.9px);
  -webkit-backdrop-filter: blur(4.9px);
  opacity: 0;
  transform: scale(0.5);
  display: none;
}

#header-modal.show {
  display: block;
  animation: fadeIn 0.3s ease-in-out forwards, zoomIn 0.3s ease-in-out forwards;
}

#header-modal.close {
  display: block;
  animation: fadeOut 0.3s ease-in-out forwards, zoomOut 0.3s ease-in-out forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes zoomIn {
  from {
    transform: scale(0.5);
  }
  to {
    transform: scale(1);
  }
}

@keyframes zoomOut {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0.5);
  }
}

.link_hover {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  position: relative;
  color: inherit;
}

.link_hover:hover:before, .link_hover.link-hovered:before {
  position: absolute;
  content: "";
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M1.47 4.97a0.75 0.75 0 0 1 1.06 0L8 10.44l5.47-5.47a0.75 0.75 0 1 1 1.06 1.06l-6 6a0.75 0.75 0 0 1-1.06 0l-6-6a0.75 0.75 0 0 1 0-1.06z'/%3E%3C/svg%3E");
  mask-size: contain;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  background-color: currentColor;
  width: 16px;
  height: 14px;
  left: 0.4rem;
  top: 50%;
  transform: translateY(-50%) rotate(90deg) scaleY(-1);
}

@media (max-width: 768px) {
  #welcome_left_text {
    position: absolute !important;
    bottom: 11rem;
    width: 100%;
    text-align: center;
    height: 150px;
  }
}

#cv_block {
  position: relative;
}

#cv_block:before {
  content: "CV";
  color: var(--bs-secondary);
  font-size: 2.5rem;
  font-style: italic;
  position: absolute;
  left: 50%;
  top: -81px;
  transform: translateX(-50%);
}

#actual_block .decor {
  background: url("/assets/img/actual.webp?h=aef9298fb40db8c4e5a94bb2cc5aae53") center / cover no-repeat;
  width: 100%;
  height: 100%;
}

#cv_block .info_block > div {
  padding-left: 1rem;
  padding-right: 1rem;
}

#work_block .decor {
  background: url("/assets/img/work_large.webp?h=1f80b78e6467f29d52f96ebc61ce27d9") center / cover no-repeat;
  width: 100%;
  height: 100%;
}

@media (max-width: 992px) {
  #work_block .order-first {
    min-height: 150px;
    margin-bottom: 1rem;
  }
}

@media (max-width: 768px) {
  #actual_block .row > div:first-child {
    min-height: 150px;
    width: 100%;
    margin-bottom: 1rem;
  }
}

@media (max-width: 768px) {
  .container.welcome .welcome_text {
    margin-top: 4rem !important;
  }
}

@media (max-width: 768px) {
  #lang_select_btn {
    top: 1rem;
    right: 1rem;
  }
}

@media (max-width: 768px) {
  .bgImg::after {
    background-position: center 35%;
  }
}

@media (max-width: 992px) {
  #work_block .decor {
    background: url("/assets/img/work.webp?h=e9914a88365120c9cd6ba9e5484e5841") center / cover no-repeat;
  }
}

@media (max-width: 375px) {
  #welcome_left_text {
    bottom: 10rem;
  }
}

@media (max-width: 768px) {
  #welcome_left_text .link_hover {
    /*padding-top: 1rem !important;*/
    /*padding-bottom: 1rem !important;*/
    display: inline-block;
  }
}

.pdf-mode .not_pdf {
  display: none;
}

.only_pdf {
  display: none;
}

.pdf-mode .only_pdf {
  display: block;
}

.pdf-mode [data-aos] {
  visibility: visible;
  opacity: 1 !important;
  transform: none !important;
}

.pdf-mode #cv_block {
  margin-top: 6rem !important;
}

.pdf-mode #cv_block:before {
  content: "Molnár-Trencsér András";
  min-width: 600px;
  top: -75px;
}

li a:hover, li a:focus.link-secondary:hover, .link-secondary:focus {
  color: RGBA(40, 50, 131, var(--bs-link-opacity, 1)) !important;
  text-decoration-color: RGBA(40, 50, 131, var(--bs-link-underline-opacity, 1)) !important;
}

li a, .link-secondary {
  color: RGBA(var(--bs-secondary-rgb), var(--bs-link-opacity, 1)) !important;
  text-decoration-color: RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}