.novus-menu{
  position: fixed;
  background: black;
  z-index: 999998;
  height: 100vh;
  width: 100%;
  right: -100%;
  top: 0;
  padding: clamp(10px, 2vw, 32px);
  transition: 0.2s ease all;
}

.novus-menu.active{
  right: 0;
  /*   animation: bounceInUp; /* referring directly to the animation's @keyframe declaration */ */
  animation-duration: 5s; /* don't forget to set a duration! */ 
}

.novus-menu .novus-menu__top{
  width: min(1400px, 100%);
  margin: auto;
  padding: 20px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}


.novus-menu nav{
  width: min(1200px, 100%);
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
/*
.nav-photos{
flex-basis: 45%; 
}

.nav-photo{
display: none;

}

.nav-photo.active{
display: block;
}

.nav-photo img{
width: min(400px, 100%);
aspect-ratio: 400 / 515;
object-fit: cover;
}
*/

.nav-items{
  flex-basis: 100%;
  list-style-type: unset;
  list-style-type: none;
  margin-left: -40px;
}

.nav-item,
.nav-item__child-menu {
  list-style-type: unset;
  list-style-type: none;
  margin: 20px 0px; 
  position: relative;
}
.nav-item__child-menu.hide {
  display: none;
}
li.nav-item__child-menu-item a {
  font-size: 25px;
}
.nav-item {
  position: relative;
  max-width: fit-content;
}
.nav-item-caret {
  position: absolute;
  right: -45px;
  top: 20px;
/*   transform: translateY(-50%); */
  cursor: pointer;
  transition: 0.25s ease-out;
}
.nav-item-caret.flip {
  transform: scaleY(-1) translateY(6px);
}
.nav-item-caret svg {
  fill: #fff;
  width: 20px;
}

.grey-out:after{
  content: "";
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(10, 22, 29, 0.5);
}

#novus-logo{
  background: transparent; 
}

.novus-menu a{
  position: relative;
  color: white;
  border: 0px !important;
  font-family: "DM Serif Display",serif;
  font-size: 40px;
  align-items: center;
  letter-spacing: 1px;
  transition: 0.2 ease all;
  width: fit-content;
  display: block;
}

.novus-menu a:hover{
  background: none !important;
  letter-spacing: 2px;
}

.novus-menu a:after {
  display:block;
  content: '';
  background: #C79C79;  
  /*   transform: scaleX(0);   */
  transition: width 250ms ease-in-out;
  height: 2px;
  width: 0px;
}

.novus-menu a:hover:after{  
  width: 100%;
}

@media (max-width: 900px) {
  .novus-menu nav{
    display: block;
    padding-top: clamp(40px, 5vw, 80px);
    position: relative;
    top: unset;
    left: unset;
    transform: unset;
  }
  .nav-photos{
    display: none;
  }
}


.header-menu-close{
  display: flex;
  align-items: center;
  cursor: pointer;
}

.header-menu-close .menu{
  margin-right: 10px; 
  color: white;
}

.header-menu-close .lines span{
  width: 42px;
  height: 2.25px;
  background: white;
  display: block;
  position: relative;
  transition: all .2s ease;
  position: relative;
}

.header-menu-close .lines span:first-child{
  transform: rotate(-45deg);
  transform-origin: center;
}

.header-menu-close .lines span:last-child{
  transform: rotate(45deg); 
  transform-origin: center;
  top: -2px;
}

@media screen and (min-width: 768px) {
  .novus-menu{
    width: 30vw;
  }
  .novus-menu nav {
    width: unset;
  }
  .novus-menu.active {
    /*     position: relative; */
  }
  .novus-menu.active:before {
    content: '';
    width: 100vw;
    top: 0;
    left: 0%;
    height: 100%;
    width: 100%;
    background-color: rgb(0,0,0,0.5);
    position: fixed;
  }
}