/* Fonts *|
font-family: 'Allison', cursive;
font-family: 'Outfit', sans-serif;
|*========================*/
nav{
  display: flex;
  width: 100%;
  z-index: 997;
  background: var(--MPSZ-Color_purple);
  position: absolute;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.27);
}

.logo-a{
  z-index: 999;
  padding: 0.5rem 0;
  align-self: flex-end;
}

.nav-btn01{
  z-index: 999;
  margin: 0.25rem 0.5rem;
  padding: 0.5rem 1.5rem;
  text-decoration: none;
  color: var(--MPSZ-Color_purple);
  font-family: 'Outfit', sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  background: var(--MPSZ-Color_white);
  border-radius: 4rem;
  box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
}

/*======*/
.main-menu.hidden{display: none}

.main-menu{
  position: absolute;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: 998;
  background: url('../images/background/nav.jpg');
  background-size: cover;
  background-position: 70% 20%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  align-items: center;
  width: 100%;
  display: flex;
  /*Split*/
  display: grid;
  grid-template-columns: 5% 1fr 5%;
  grid-template-areas:
    ". . ."
    ". . ."
    ". items ."
    ". . ."
}

@media all and (max-width: 700px){
  /*Responsive*/
  .logo{height: 3rem}
  .main-menu{grid-template-rows: 96px 1rem 1fr 1rem}
  .div-main-menu_items > li{margin: 0.5rem}
  .div-main-menu_items > li > a{font-size: 1.25rem; padding: 0.5rem 0}
}

@media all and (min-width: 700px){
  /*Desktop*/
  .logo{height: 3rem}
  .main-menu{grid-template-rows: 6rem 1rem 1fr 1rem}
  .div-main-menu_items > li{margin: 0.75rem}
  .div-main-menu_items > li > a{font-size: 2.25rem; padding: 0.75rem 0}
}

/*------*/
/* test du jour 29/29/2023 -- ori -- .div-main-menu_items{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  grid-area: items;
}*/

.div-main-menu_items{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  grid-area: items;
  transform: translateY(-20%);
}

.div-main-menu_items > li > a{
  text-decoration: none;
  color: #fff;
  font-weight: 400;
  font-family: 'Outfit', sans-serif;
}

/*------*/
.MPSZ_socials{display: flex; flex-direction: row-reverse; justify-content: center; margin: 0.75rem 0}
.MPSZ_socials a{margin: 0 0.5rem;padding: 0.5rem}
.MPSZ_socials svg{height: 2rem}
.svg-sn-header{fill: var(--MPSZ-Color_white)}
.svg-sn-header:hover{fill: var(--MPSZ-Color_3rd) !important}

/*______________________*/
/*_Burger_(like_a_King)*_/
/*______________________*/
.burger-bars{
  cursor: pointer;
  z-index: 999;
  align-self: center;
  padding: 5px;
}

.burger-bar{
  height: 3px;
  width: 35px;
  margin: 5px;
  background: var(--MPSZ-Color_white);
  border-radius: 5px;
}

.burger-bar:first-child{transform: translateY(10px) rotateZ(45deg)}
.burger-bar:nth-child(2n){background: rgba(255, 255, 255, 0.0)}
.burger-bar:last-child{transform: translateY(-6px) rotateZ(-45deg)}

.burger-bars.hidden .burger-bar:first-child,
.burger-bars.hidden .burger-bar:last-child{transform: none}
.burger-bars.hidden .burger-bar:nth-child(2n){background: var(--MPSZ-Color_white)}