@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
header {
  min-height: 80vh;
  position: relative;
  z-index: 30;
  display: flex;
  flex-direction: column;
  height: 100%;
}
@media (min-width: 20rem) {
  header {
    min-height: calc(80vh + 20 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header {
    min-height: 100vh;
  }
}
header::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgb(53, 53, 53) 8%, rgba(155, 155, 155, 0) 100%);
}
header > .container {
  height: 100%;
  flex-grow: 1;
  position: relative;
  z-index: 0;
  width: 100%;
}
header > .container::after {
  bottom: -3.75rem;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  z-index: -1;
  background-color: #2D2D2D;
  height: 3.125rem;
  border-top: solid 0.9375rem #F9F871;
  transform: rotate(3deg);
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}
@media (min-width: 20rem) {
  header > .container::after {
    height: calc(3.125rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header > .container::after {
    height: 6.25rem;
  }
}
header .header-wrapper {
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
}
header .header-top {
  position: relative;
  z-index: 30;
}
header .header-top::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
  background-color: #2D2D2D;
  opacity: 35%;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}
header .header-top .dropdown {
  padding-top: 1.875rem;
  padding-bottom: 1.875rem;
}
@media (min-width: 20rem) {
  header .header-top .dropdown {
    padding-top: calc(1.875rem + 0.375 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header .header-top .dropdown {
    padding-top: 2.25rem;
  }
}
@media (min-width: 20rem) {
  header .header-top .dropdown {
    padding-bottom: calc(1.875rem + 0.375 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header .header-top .dropdown {
    padding-bottom: 2.25rem;
  }
}
header .header-content {
  margin-top: 6.25rem;
  margin-bottom: 6.25rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  max-width: 100%;
  margin-left: 0rem;
}
@media (min-width: 20rem) {
  header .header-content {
    margin-top: calc(6.25rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header .header-content {
    margin-top: 12.5rem;
  }
}
@media (min-width: 20rem) {
  header .header-content {
    margin-bottom: calc(6.25rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header .header-content {
    margin-bottom: 12.5rem;
  }
}
@media (min-width: 20rem) {
  header .header-content {
    max-width: calc(100% + -50 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header .header-content {
    max-width: 50%;
  }
}
@media (min-width: 20rem) {
  header .header-content {
    margin-left: calc(0rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  header .header-content {
    margin-left: 6.25rem;
  }
}
@media (min-width: 93.75rem) {
  header .header-content {
    max-width: 40%;
  }
}
@media (min-width: 47.5rem) {
  header .header-content {
    justify-content: center;
  }
}
header .header-content h1,
header .header-content p {
  color: #ffffff;
}
header .header-content h1 {
  margin-top: 0;
}
header .header-content p.text {
  margin-bottom: 2.0625rem;
}
header .bg_image {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 60% 50%;
}
@media (min-width: 47.5rem) {
  header .bg_image {
    background-position: center;
  }
}

/* Google Font importieren */
/* body-Styling */
body {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  color: #2D2D2D;
  letter-spacing: calc((0.875rem + 0.25 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 0.875rem;
  line-height: 1.5;
}
@media (min-width: 20rem) {
  body {
    font-size: calc(0.875rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  body {
    font-size: 1.125rem;
  }
}

/* h1-Styling */
h1 {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 800;
  letter-spacing: calc((2.5rem + 5 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 2.5rem;
  text-transform: uppercase;
  margin-bottom: 0.625rem;
  line-height: 1.2;
}
@media (min-width: 20rem) {
  h1 {
    font-size: calc(2.5rem + 5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  h1 {
    font-size: 7.5rem;
  }
}
@media (min-width: 20rem) {
  h1 {
    margin-bottom: calc(0.625rem + 0.625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  h1 {
    margin-bottom: 1.25rem;
  }
}

/* h2-Styling */
h2 {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 800;
  letter-spacing: calc((1.875rem + 3.125 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 1.875rem;
  text-transform: uppercase;
  margin-bottom: 0.625rem;
  word-break: break-word;
  hyphens: auto;
}
@media (min-width: 20rem) {
  h2 {
    font-size: calc(1.875rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  h2 {
    font-size: 5rem;
  }
}
@media (min-width: 20rem) {
  h2 {
    margin-bottom: calc(0.625rem + 0.625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  h2 {
    margin-bottom: 1.25rem;
  }
}

/* h3-Styling */
h3,
.style_h3 {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 400;
  letter-spacing: calc((1.25rem + 0.625 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 1.25rem;
  text-transform: uppercase;
  line-height: 1.2;
}
@media (min-width: 20rem) {
  h3,
  .style_h3 {
    font-size: calc(1.25rem + 0.625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  h3,
  .style_h3 {
    font-size: 1.875rem;
  }
}

/* h4-Styling */
h4,
.style_h4 {
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  letter-spacing: calc((0.875rem + 0.25 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.125rem;
}
@media (min-width: 20rem) {
  h4,
  .style_h4 {
    font-size: calc(0.875rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  h4,
  .style_h4 {
    font-size: 1.125rem;
  }
}

/* Link-Styling */
a,
.link {
  font-family: "Catamaran", sans-serif;
  font-weight: 700;
  letter-spacing: calc((0.875rem + 0.25 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 0.875rem;
  text-decoration: none;
  color: #2D2D2D;
  cursor: pointer;
}
@media (min-width: 20rem) {
  a,
  .link {
    font-size: calc(0.875rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  a,
  .link {
    font-size: 1.125rem;
  }
}

strong {
  font-family: "Montserrat", sans-serif;
}

.dropdown {
  display: none;
}
@media (min-width: 47.5rem) {
  .dropdown {
    display: block;
  }
}
.dropdown .nav-list {
  list-style: none;
  display: flex;
  margin: 0;
  justify-content: center;
  gap: 5rem;
}
.dropdown .nav-list li {
  position: relative;
}
.dropdown .nav-list li:hover a::after {
  left: 0;
  right: 0;
  transition: all 300ms ease;
}
.dropdown .nav-list li:last-child {
  margin-right: 0;
}
.dropdown .nav-list li a {
  letter-spacing: calc((1.125rem + 0.25 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 500;
}
@media (min-width: 20rem) {
  .dropdown .nav-list li a {
    font-size: calc(1.125rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .dropdown .nav-list li a {
    font-size: 1.375rem;
  }
}
.dropdown .nav-list li a::after {
  position: absolute;
  z-index: 1;
  content: "";
  left: 50%;
  right: 50%;
  bottom: 0;
  height: 5px;
  background-color: #F9F871;
  transition: all 300ms ease;
}

/* Offcanvas-Menü offen */
.offcanvas-menu {
  display: flex;
  justify-content: flex-end;
}

.offcanvas-menu .toggle-wrapper {
  width: 2.5rem;
  height: 2.5rem;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99999;
}
@media (min-width: 47.5rem) {
  .offcanvas-menu .toggle-wrapper {
    display: none;
  }
}

.offcanvas-menu.open {
  right: 0;
}

.offcanvas-menu .nav-list-offcanvas {
  position: fixed;
  top: 0;
  left: 0;
  margin-top: 0;
  bottom: -6.25rem;
  padding: 2.5rem;
  padding-top: 1.25rem;
  width: 14.375rem;
  padding-left: 1.5em;
  transform: translateX(-110%);
  transform-origin: left;
  transition: all 300ms ease;
  z-index: 50;
}
.offcanvas-menu .nav-list-offcanvas li {
  margin-bottom: 1.5em;
}
.offcanvas-menu .nav-list-offcanvas li a {
  position: relative;
  z-index: 0;
}
.offcanvas-menu .nav-list-offcanvas li a::after {
  bottom: 0;
  content: "";
  left: 50%;
  position: absolute;
  right: 50%;
  z-index: -1;
  background-color: #F9F871;
  height: 0.1875rem;
  transition: all 300ms ease;
}
.offcanvas-menu .nav-list-offcanvas li a:hover::after, .offcanvas-menu .nav-list-offcanvas li a.active::after {
  left: 0;
  right: 0;
  transition: all 300ms ease;
}

.offcanvas-menu .nav-list-offcanvas.show {
  transform: translateX(0);
  transition: all 300ms ease;
}

@media (min-width: 47.5rem) {
  .offcanvas-menu .nav-list-offcanvas {
    display: none;
  }
}
.offcanvas-menu .nav-list-offcanvas::after {
  content: "";
  top: 0;
  background-color: #ffffff;
  position: absolute;
  right: 0;
  left: -18.75rem;
  bottom: 0;
  z-index: 0;
}

.offcanvas-menu .nav-list-offcanvas::before {
  content: "";
  top: 0;
  background-color: #2D2D2D;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -10;
  width: 100vw;
  opacity: 0%;
  transform: translateX(55%);
  pointer-events: none;
  user-select: none;
}

.offcanvas-menu .nav-list-offcanvas.show::before {
  opacity: 60%;
  transform: translateX(0);
}

.offcanvas-menu .nav-list-offcanvas li {
  list-style: none;
  z-index: 2;
  position: relative;
}

/* Menü schließen Button */
.close-menu {
  font-size: 2.5rem;
  background: none;
  border: none;
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  display: none;
}

.close-menu.show {
  display: block;
}

/* Hamburger Icon */
.menu-toggle {
  background: none;
  border: none;
  cursor: pointer;
  display: block;
  height: 1.25rem;
  width: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.3125rem;
}
@media (min-width: 47.5rem) {
  .menu-toggle {
    display: none;
  }
}
.menu-toggle .icon {
  display: none;
  height: 1.25rem;
  width: 2.5rem;
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
}
.menu-toggle .icon .line {
  background: #ffffff;
  display: block;
  height: 0.1875rem;
  position: absolute;
  width: 100%;
}
.menu-toggle .icon .line_1 {
  opacity: 1;
  top: 0;
  transition: top 300ms, transform 300ms;
  visibility: visible;
}
.menu-toggle .icon .line_2 {
  opacity: 1;
  top: calc(50% - 0.1875rem / 2);
  transition: opacity 300ms;
  visibility: visible;
}
.menu-toggle .icon .line_3 {
  bottom: 0;
  transition: bottom 300ms, transform 300ms;
}
.menu-toggle.show .icon .line.line_1 {
  top: calc(50% - 0.1875rem / 2);
  transform: rotate(45deg);
}
.menu-toggle.show .icon .line.line_2 {
  opacity: 0;
  visibility: hidden;
}
.menu-toggle.show .icon .line.line_3 {
  bottom: calc(50% - 0.1875rem / 2);
  transform: rotate(-45deg);
}

body {
  margin: 0;
}

.page_wrapper {
  overflow-x: hidden;
}

main {
  display: block;
  z-index: 1;
  position: relative;
}

* {
  -webkit-tap-highlight-color: rgba(249, 248, 113, 0.1);
  box-sizing: border-box;
}
@media (min-width: 61.875rem) {
  * {
    hyphens: none;
  }
}

html {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

::selection {
  background-color: #F9F871;
  /* Hintergrundfarbe */
  color: #2D2D2D;
  /* Textfarbe */
}

.container {
  margin: 0 auto;
  max-width: 112.5rem;
  min-width: 20rem;
  padding: 0 0.9375rem;
}
@media (min-width: 20rem) {
  .container {
    padding: 0 calc(0.9375rem + 2.1875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .container {
    padding: 0 3.125rem;
  }
}

.button {
  background-color: #2D2D2D;
  border: 0.0625rem solid #F9F871;
  color: #ffffff;
  padding: 0.625rem 1.25rem;
  text-decoration: none;
  display: flex;
  align-items: center;
  transition: all 300ms ease;
  max-height: 2.9375rem;
}
.button p {
  margin: 0;
}
.button .text {
  text-transform: uppercase;
  letter-spacing: calc((0.875rem + 0.25 * (100vw - 20rem) / (73.75)) / 1000 * 0);
  font-size: 0.875rem;
}
@media (min-width: 20rem) {
  .button .text {
    font-size: calc(0.875rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .button .text {
    font-size: 1.125rem;
  }
}
.button:hover, .button:focus {
  background-color: #F9F871;
  color: #2D2D2D;
  transition: all 300ms ease;
}
.button:hover .icon, .button:focus .icon {
  fill: #2D2D2D;
  transition: all 300ms ease;
}

.qualifications {
  position: relative;
  z-index: 0;
  padding-top: 4.375rem;
  padding-bottom: 4.375rem;
}
@media (min-width: 20rem) {
  .qualifications {
    padding-top: calc(4.375rem + 5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications {
    padding-top: 9.375rem;
  }
}
@media (min-width: 20rem) {
  .qualifications {
    padding-bottom: calc(4.375rem + 12.5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications {
    padding-bottom: 16.875rem;
  }
}
.qualifications::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
  background-color: #2D2D2D;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}
.qualifications::before {
  bottom: -0.0625rem;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  z-index: 1;
  height: 2.5rem;
  background-color: #fff;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
@media (min-width: 20rem) {
  .qualifications::before {
    height: calc(2.5rem + 2.5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications::before {
    height: 5rem;
  }
}
.qualifications .icon {
  display: block;
  fill: rgba(255, 255, 255, 0.1);
  position: absolute;
  right: 0;
  top: 6.25rem;
  width: 3.125rem;
  height: 9.375rem;
}
@media (min-width: 20rem) {
  .qualifications .icon {
    width: calc(3.125rem + 7.5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications .icon {
    width: 10.625rem;
  }
}
@media (min-width: 20rem) {
  .qualifications .icon {
    height: calc(9.375rem + 9.375 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications .icon {
    height: 18.75rem;
  }
}
.qualifications .intro-text {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 20rem) {
  .qualifications .intro-text {
    width: calc(100% + -20 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications .intro-text {
    width: 80%;
  }
}
@media (min-width: 93.75rem) {
  .qualifications .intro-text {
    width: 45%;
  }
}
.qualifications .intro-text p,
.qualifications .intro-text h2 {
  text-align: center;
  color: #ffffff;
}
.qualifications .intro-text h2 {
  margin-top: 0;
}
.qualifications .skills_overview {
  margin-left: auto;
  margin-right: auto;
  margin-top: 3.75rem;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
@media (min-width: 20rem) {
  .qualifications .skills_overview {
    margin-top: calc(3.75rem + 3.75 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications .skills_overview {
    margin-top: 7.5rem;
  }
}
@media (min-width: 61.875rem) {
  .qualifications .skills_overview {
    width: 100%;
  }
}
@media (min-width: 61.875rem) and (min-width: 20rem) {
  .qualifications .skills_overview {
    width: calc(100% + -40 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 61.875rem) and (min-width: 93.75rem) {
  .qualifications .skills_overview {
    width: 60%;
  }
}
.qualifications .skills_overview .skill {
  display: flex;
  justify-content: center;
  gap: 0;
  flex-direction: column;
  align-items: flex-start;
}
@media (min-width: 35rem) {
  .qualifications .skills_overview .skill {
    align-items: center;
    gap: 1.875rem;
    flex-direction: row;
  }
}
.qualifications .skills_overview .skill .skill-name,
.qualifications .skills_overview .skill .skill-percent {
  color: #ffffff;
}
.qualifications .skills_overview .skill .skill-name {
  flex-basis: 10%;
  min-width: 6.25rem;
}
@media (min-width: 20rem) {
  .qualifications .skills_overview .skill .skill-name {
    min-width: calc(6.25rem + 5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications .skills_overview .skill .skill-name {
    min-width: 11.25rem;
  }
}
@media (min-width: 35rem) {
  .qualifications .skills_overview .skill .skill-name {
    text-align: right;
  }
}
.qualifications .skills_overview .skill .right {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
@media (min-width: 61.875rem) {
  .qualifications .skills_overview .skill .right {
    gap: 1.875rem;
  }
}
.qualifications .skills_overview .skill .skill-percent {
  flex-basis: 10%;
}
.qualifications .skills_overview .skill .skill-bar {
  width: 100%;
  height: 0.3125rem;
  background-color: rgba(255, 255, 255, 0.2);
  position: relative;
  z-index: 0;
  flex-basis: 80%;
}
@media (min-width: 20rem) {
  .qualifications .skills_overview .skill .skill-bar {
    height: calc(0.3125rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .qualifications .skills_overview .skill .skill-bar {
    height: 0.5625rem;
  }
}
.qualifications .skills_overview .skill .skill-bar::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  background-color: #F9F871;
  transition: all 600ms ease;
  transition-delay: 600ms;
}
.qualifications .skills_overview .skill .skill-bar.procent_90::after {
  right: 10%;
}
.qualifications .skills_overview .skill .skill-bar.procent_85::after {
  right: 15%;
}
.qualifications .skills_overview .skill .skill-bar.procent_80::after {
  right: 20%;
}
.qualifications .skills_overview .skill .skill-bar.procent_75::after {
  right: 25%;
}
.qualifications .skills_overview .skill .skill-bar.procent_60::after {
  right: 40%;
}

.projects {
  margin-left: 0rem;
  margin-right: 0rem;
  margin-top: 6.25rem;
  padding-bottom: 12.5rem;
  position: relative;
}
@media (min-width: 20rem) {
  .projects {
    margin-left: calc(0rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects {
    margin-left: 6.25rem;
  }
}
@media (min-width: 20rem) {
  .projects {
    margin-right: calc(0rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects {
    margin-right: 6.25rem;
  }
}
@media (min-width: 20rem) {
  .projects {
    margin-top: calc(6.25rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects {
    margin-top: 12.5rem;
  }
}
@media (min-width: 20rem) {
  .projects {
    padding-bottom: calc(12.5rem + 12.5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects {
    padding-bottom: 25rem;
  }
}
.projects .icon:not(.arrow) {
  display: block;
  fill: rgba(45, 45, 45, 0.1);
  position: absolute;
  left: 0;
  bottom: 0;
  width: 3.125rem;
  height: 9.375rem;
  margin-left: calc(-50vw + 50%);
}
@media (min-width: 20rem) {
  .projects .icon:not(.arrow) {
    width: calc(3.125rem + 7.5 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects .icon:not(.arrow) {
    width: 10.625rem;
  }
}
@media (min-width: 20rem) {
  .projects .icon:not(.arrow) {
    height: calc(9.375rem + 9.375 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects .icon:not(.arrow) {
    height: 18.75rem;
  }
}
.projects .headline {
  position: relative;
}
.projects .headline .icon {
  width: 6.25rem;
  height: 4.375rem;
  top: -40%;
  left: -10%;
  margin-left: inherit;
}
@media (min-width: 20rem) {
  .projects .headline .icon {
    width: calc(6.25rem + 8.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects .headline .icon {
    width: 14.375rem;
  }
}
@media (min-width: 20rem) {
  .projects .headline .icon {
    height: calc(4.375rem + 4.375 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects .headline .icon {
    height: 8.75rem;
  }
}
.projects .teaser_wrapper {
  margin-top: 1.5625rem;
}
@media (min-width: 20rem) {
  .projects .teaser_wrapper {
    margin-top: calc(1.5625rem + 1.5625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects .teaser_wrapper {
    margin-top: 3.125rem;
  }
}
.projects .teaser_wrapper > h3 {
  margin-bottom: 0;
}
.projects .teaser_wrapper .teaser_grid {
  display: flex;
  gap: 1.875rem;
  flex-wrap: wrap;
  margin-top: 1rem;
  position: relative;
}
.projects .teaser_wrapper .teaser_grid .icon {
  right: 10%;
  top: -7.5rem;
  bottom: inherit;
  transform: rotate(90deg);
  left: inherit;
  margin-left: inherit;
  z-index: -1;
}
.projects .teaser_wrapper .teaser_grid .teaser {
  padding: 1.25rem;
  aspect-ratio: 1/1;
  position: relative;
  width: 100%;
}
@media (min-width: 20rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    padding: calc(1.25rem + 0.625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    padding: 1.875rem;
  }
}
@media (min-width: 35rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    width: 12.5rem;
    height: 12.5rem;
  }
}
@media (min-width: 35rem) and (min-width: 20rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    width: calc(12.5rem + 5.5625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 35rem) and (min-width: 93.75rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    width: 18.0625rem;
  }
}
@media (min-width: 35rem) and (min-width: 20rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    height: calc(12.5rem + 5.5625 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 35rem) and (min-width: 93.75rem) {
  .projects .teaser_wrapper .teaser_grid .teaser {
    height: 18.0625rem;
  }
}
.projects .teaser_wrapper .teaser_grid .teaser::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
  background-color: #F9F871;
  opacity: 0%;
  transition: all 300ms ease;
}
.projects .teaser_wrapper .teaser_grid .teaser:hover .content_wrapper {
  opacity: 1;
  transition: all 300ms ease;
}
.projects .teaser_wrapper .teaser_grid .teaser:hover .content_wrapper .icon {
  opacity: 1;
}
.projects .teaser_wrapper .teaser_grid .teaser:hover::after {
  opacity: 0.9;
  transition: all 300ms ease;
}
.projects .teaser_wrapper .teaser_grid .teaser .bg_image {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-position: center;
  z-index: -1;
  background-repeat: no-repeat;
  background-size: cover;
}
.projects .teaser_wrapper .teaser_grid .teaser .content_wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  opacity: 0;
  transition: all 300ms ease;
}
.projects .teaser_wrapper .teaser_grid .teaser .content_wrapper h4 {
  margin-bottom: 0;
  text-align: center;
}
.projects .teaser_wrapper .teaser_grid .teaser .content_wrapper p {
  word-break: break-word;
  hyphens: auto;
  margin-top: 0.625rem;
  text-align: center;
  font-weight: 400;
}
.projects .teaser_wrapper .teaser_grid .teaser .content_wrapper .icon {
  transform: rotate(0);
  z-index: 1;
}

.cv {
  position: relative;
  z-index: 0;
  padding-top: 6.25rem;
  padding-bottom: 6.25rem;
}
@media (min-width: 20rem) {
  .cv {
    padding-top: calc(6.25rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv {
    padding-top: 12.5rem;
  }
}
@media (min-width: 20rem) {
  .cv {
    padding-bottom: calc(6.25rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv {
    padding-bottom: 12.5rem;
  }
}
.cv .icon {
  display: block;
  fill: rgba(255, 255, 255, 0.1);
  position: absolute;
  right: 0;
  top: 6.25rem;
  width: 6.25rem;
  height: 4.375rem;
}
@media (min-width: 20rem) {
  .cv .icon {
    top: calc(6.25rem + 6.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .icon {
    top: 12.5rem;
  }
}
@media (min-width: 20rem) {
  .cv .icon {
    width: calc(6.25rem + 8.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .icon {
    width: 14.375rem;
  }
}
@media (min-width: 20rem) {
  .cv .icon {
    height: calc(4.375rem + 4.375 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .icon {
    height: 8.75rem;
  }
}
.cv::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
  background-color: #2D2D2D;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  transform: skewY(3deg);
}
.cv h2 {
  text-align: center;
  color: #ffffff;
}
.cv .cv_timeline {
  margin-right: 0rem;
  margin-left: 0rem;
  margin-top: 3.125rem;
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline {
    margin-right: calc(0rem + 18.75 * (100vw - 47.5rem) / (46.25));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline {
    margin-right: 18.75rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline {
    margin-left: calc(0rem + 18.75 * (100vw - 47.5rem) / (46.25));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline {
    margin-left: 18.75rem;
  }
}
@media (min-width: 20rem) {
  .cv .cv_timeline {
    margin-top: calc(3.125rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline {
    margin-top: 6.25rem;
  }
}
.cv .cv_timeline * {
  color: #ffffff;
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry {
    margin-left: 50%;
  }
}
.cv .cv_timeline .time_entry:last-child .wrapper {
  padding-bottom: 0;
}
.cv .cv_timeline .time_entry .wrapper {
  padding-left: 1.25rem;
  padding-bottom: 3em;
  position: relative;
  z-index: 0;
}
@media (min-width: 20rem) {
  .cv .cv_timeline .time_entry .wrapper {
    padding-left: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry .wrapper {
    padding-left: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry .wrapper {
    padding-bottom: 0;
  }
}
.cv .cv_timeline .time_entry .wrapper::after {
  bottom: -1.25rem;
  content: "";
  left: 0;
  position: absolute;
  top: 0;
  z-index: -1;
  width: 0.125rem;
  background-color: #F9F871;
}
.cv .cv_timeline .time_entry .wrapper::before {
  content: "";
  left: -0.25rem;
  position: absolute;
  top: 0;
  z-index: -1;
  width: 0.625rem;
  height: 0.625rem;
  background-color: #F9F871;
  border-radius: 50%;
}
@media (min-width: 20rem) {
  .cv .cv_timeline .time_entry .wrapper::before {
    left: calc(-0.25rem + -0.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry .wrapper::before {
    left: -0.375rem;
  }
}
@media (min-width: 20rem) {
  .cv .cv_timeline .time_entry .wrapper::before {
    width: calc(0.625rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry .wrapper::before {
    width: 0.875rem;
  }
}
@media (min-width: 20rem) {
  .cv .cv_timeline .time_entry .wrapper::before {
    height: calc(0.625rem + 0.25 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry .wrapper::before {
    height: 0.875rem;
  }
}
.cv .cv_timeline .time_entry .wrapper .style_h4 {
  margin-bottom: 0;
  color: #F9F871;
  margin-bottom: 0.3125rem;
}
.cv .cv_timeline .time_entry .wrapper h3 {
  margin-top: 0;
}
.cv .cv_timeline .time_entry .wrapper .content p {
  margin: 0;
}
.cv .cv_timeline .time_entry .wrapper .content .spacing_top {
  margin-top: 0.625rem;
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(2) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(2) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(4) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(4) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(6) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(6) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(8) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(8) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(10) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(10) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(12) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(12) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(14) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(14) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(16) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(16) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(18) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(18) .wrapper::before {
    right: -0.46875rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(20) {
    margin-right: 50%;
    margin-left: 0;
    text-align: right;
  }
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper {
    padding-left: 0;
    padding-right: 1.25rem;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper {
    padding-right: calc(1.25rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper {
    padding-right: 4.375rem;
  }
}
@media (min-width: 47.5rem) {
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper::after {
    right: -0.125rem;
    left: inherit;
  }
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper::before {
    right: -0.25rem;
    left: inherit;
  }
}
@media (min-width: 47.5rem) and (min-width: 20rem) {
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper::before {
    right: calc(-0.25rem + -0.21875 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 47.5rem) and (min-width: 93.75rem) {
  .cv .cv_timeline .time_entry:nth-child(20) .wrapper::before {
    right: -0.46875rem;
  }
}

footer {
  position: relative;
  z-index: 0;
  padding-bottom: 1.875rem;
}
@media (min-width: 20rem) {
  footer {
    padding-bottom: calc(1.875rem + 3.125 * (100vw - 20rem) / (73.75));
  }
}
@media (min-width: 93.75rem) {
  footer {
    padding-bottom: 5rem;
  }
}
footer .footer_content {
  position: relative;
  padding-bottom: 3em;
}
@media (min-width: 47.5rem) {
  footer .footer_content {
    padding-bottom: 0;
  }
}
footer .footer_content .copyright {
  position: absolute;
  bottom: 0;
  left: 0;
  font-size: 90%;
}
@media (min-width: 47.5rem) {
  footer .footer_content .copyright {
    right: 0;
    left: inherit;
  }
}
footer ::selection {
  background-color: #2D2D2D;
  color: #F9F871;
}
footer h2 {
  margin-bottom: 0;
}
footer p {
  margin-top: 0;
  margin-bottom: 1.875rem;
}
footer::after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: -18.75rem;
  z-index: -10;
  background-color: #F9F871;
}
footer .buttons {
  display: flex;
  gap: 0.625rem;
}
footer .buttons .button:hover, footer .buttons .button.active, footer .buttons .button:focus, footer .buttons .button:visited {
  background-color: #fff;
}

.animation.skill.not_in_viewport .skill-bar::after,
.animation.skill.not_in_viewport .skill-bar.procent_90::after,
.animation.skill.not_in_viewport .skill-bar.procent_85::after,
.animation.skill.not_in_viewport .skill-bar.procent_80::after,
.animation.skill.not_in_viewport .skill-bar.procent_75::after,
.animation.skill.not_in_viewport .skill-bar.procent_60::after,
[data-animation].skill.not_in_viewport .skill-bar::after,
[data-animation].skill.not_in_viewport .skill-bar.procent_90::after,
[data-animation].skill.not_in_viewport .skill-bar.procent_85::after,
[data-animation].skill.not_in_viewport .skill-bar.procent_80::after,
[data-animation].skill.not_in_viewport .skill-bar.procent_75::after,
[data-animation].skill.not_in_viewport .skill-bar.procent_60::after {
  right: 100%;
  transition: all 300ms ease;
}
.animation.cv_content,
[data-animation].cv_content {
  transition: opacity 600ms ease, transform 600ms ease;
  transition-delay: 300ms;
}
.animation.cv_content.not_in_viewport,
[data-animation].cv_content.not_in_viewport {
  opacity: 0;
  transform: translateX(1.875rem);
  transition: unset;
}
@media (min-width: 47.5rem) {
  .animation.cv_content.not_in_viewport,
  [data-animation].cv_content.not_in_viewport {
    transform: translateX(-1.875rem);
  }
}
.animation.cv_content.right.not_in_viewport,
[data-animation].cv_content.right.not_in_viewport {
  transform: translateX(1.875rem);
}

/*# sourceMappingURL=includes.css.map */