/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* HEADER */
header {
  position: fixed;
  top: 0;
  left: 0;
  background: var(--white);
  z-index: 999;
  width: 100%;
}

#life.active,
#work.active,
#education.active,
#activity.active {
  border-bottom: 3px solid var(--red);
  padding-bottom: 5px;
}

header .logo {
  background-image: url("../Icons/logo.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
header ul.level-1 li.active {
  position: relative;
}
header ul.level-1 > li.active::before {
  content: "|";
  position: absolute;
  left: -15px;
  top: 0;
  color: white;
  pointer-events: none;
}
header ul.level-2 li.active {
  font-weight: 900;
  color: white;
  pointer-events: none;
}

header .dropdown > div > div {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

header .dropdown > div:hover {
  cursor: pointer;
}

header .logo-icon {
  background-image: url("../Icons/logo_ill.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.breadcrumb li:first-child span {
  display: none;
}
.breadcrumb li:last-child a {
  pointer-events: none;
  font-weight: 800;
}

.breadcrumb li a:hover {
  text-decoration: underline;
}
.breadcrumb li:last-child a:hover {
  text-decoration: unset;
}

header .life {
  background-image: url("../Icons/life.svg");
}

header .work {
  background-image: url("../Icons/work.svg");
}

header .education {
  background-image: url("../Icons/education.svg");
}

header .activity {
  background-image: url("../Icons/activity.svg");
}

header .dropdown-content .nav-icon > .nav-life,
header .dropdown-content .nav-icon > .nav-work,
header .dropdown-content .nav-icon > .nav-education,
header .dropdown-content .nav-icon > .nav-activity {
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}
header .dropdown-content .nav-icon path {
  fill: #fff;
}
header .dropdown-content .nav-icon > .nav-life {
  background-image: url("../Icons/nav_life.svg");
}
header .dropdown-content .nav-icon .nav-work {
  background-image: url("../Icons/nav_work.svg");
}
header .dropdown-content .nav-icon .nav-education {
  background-image: url("../Icons/nav_education.svg");
}
header .dropdown-content .nav-icon .nav-activity {
  background-image: url("../Icons/nav_activity.svg");
}

header .dropdown > div > span {
  color: var(--red);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 2px;
}

header .dropdown .dropdown-content.nav-open {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: fixed;
  left: 0;
  height: auto;
  padding: 3em 0em;
}
body.mobile header .dropdown .dropdown-content.nav-open {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: fixed;
  left: 0;
  height: 100%;
  padding: 4.6em 0em 6em 0em;
}

header .dropdown-content {
  background-color: var(--red);
  display: none;
  z-index: 20;
}

header .dropdown-content ul.level-1 .dropdown-level-2 > .wrapper {
  border-bottom: 1px solid var(--white);
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-transform: uppercase;

  justify-content: space-between;
}

header .dropdown-content ul.level-1 > li:not(:first-child) {
  margin-top: 1em;
}

header .dropdown-content a,
header .dropdown-content ul.level-1 > li > a > span {
  color: var(--white);
  width: auto;
}

header .dropdown-content ul.level-2 {
  display: none;
}

header .dropdown-content ul.level-2.nav-open {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

header .dropdown-content ul.level-2.nav-open {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media only screen and (max-width: 800px) {
  header .dropdown-content ul.level-2.nav-open {
    display: grid;
    grid-template-columns: 1fr;
  }
  .dropdown-content div.container {
    overflow-y: scroll;
    padding-bottom: 20px;
  }
}
@media only screen and (max-height: 600px) {
  .dropdown-content div.container {
    overflow-y: scroll;
    padding-bottom: 20px;
  }
}

header .dropdown-level-2.nav-open .closer {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

header .social-media {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

header .social-media a.element,
header .login a.element {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

header .social-media .element.search {
  background-image: url("../Icons/search.svg");
}

header .social-media .element.facebook {
  background-image: url("../Icons/facebook.svg");
}
header .social-media .element.linkedIn {
  background-image: url("../Icons/linkedin_2.svg");
}

header .social-media .element.instagram {
  background-image: url("../Icons/instagram.svg");
}

header .login {
  display: flex;
}

header .login a.element {
  background-image: url("../Icons/account.svg");
  display: none;
}

header .login span.line {
  width: 2px;
  height: auto;
  background: var(--black);
  /* display: block; */
  display: none;
}

header #language_menu {
  gap: 5px;
  display: flex;
}

header #language_menu li a {
  font-weight: 900;
  color: var(--gray-light);
}

header #language_menu li.active a {
  pointer-events: none;
}

header #language_menu li.active a {
  font-weight: 900;
  color: var(--black);
}

#milky {
  background: #000000b3;
  display: none;
}
.breadcrumb li {
  list-style-type: none;
}