:root{
  --rmd1:#7039A0;
  --rmd2:#e9e6db;
  --rmd3:#19705c;
  --rmd4:#0062FF;
  --rmd5:#ac673c;
  --rmd6:#6e806b;
  --rmd7:#ab185a;
  --rmd8:#c6d8e9;
  
}
body{
  background-color:var(--rmd2);
}
.fontm{
 font-family:"Figtree";
 font-weight:500;
 font-style:normal;
  letter-spacing:-0.05rem;
}
.fontm-m{
 font-family:"Bodoni Moda";
 font-weight:400;
 font-style:normal;
  letter-spacing:0.1rem;
  white-space:nowrap;
}
.scroll{
        position: relative;
        display:flex;
        margin-top:20%;
        background-color:transparent;
        height:50%;
        width:50%;
      }
.logo{
  position:absolute;
  display:flex;
  height:53.5px;
  width:180px;
  background-color:transparent;
  top:20px;
  left:2.5%;
  z-index:2;
}
.logoimg{
  position:absolute;
  display:flex;
  height:100%;
  width:30%;
  background-color:transparent;
  border-radius: 50%;
  overflow:hidden;
}
.logoimg img{
  height:100%;
  width:100%;
  object-fit:cover;
}
.logoname{
  position:absolute;
  display:flex;
  height:100%;
  width:105%;
  left:35%;
  background-color:transparent;
  justify-content:start;
  align-items:center;
}
.logoname h1{
  font-size:0.9em;
  line-height:1.4em;
  letter-spacing:normal;
}
.logoname h1 a{
  text-decoration:none;
  color:#1f1f1f;
}
.logoword1{
  position:absolute;
  display:flex;
  transform:translate(0,-100%);
    font-weight:600;
}
.logoword2{
  position:absolute;
  display:flex;
  transform:translate(0,00%);
  font-weight:400;
}
  .main-img-1{
position: fixed;
overflow-x:hidden;
display: block;
top: 0px;
left: 0%;
height: 100%;
width: 100%;
background-image: url("/imgs/nw/bg-2.PNG?v=1");
background-size: cover;
transition: 1s all ease-in-out;
      visibility:visible;
    transition:all 1s ease-in-out;

/*background:linear-gradient( rgb(111, 111, 111) ,rgb(245, 245, 245),rgb(153, 153, 153))*/
  }
  /*.main-img-1 img{
    height: 100%;
    width: 100%;
    
    transition: 1s all ease-in-out;
  }*/
  .main-img-1 video{
      height: 100%;
      width: 100%;
      object-fit: cover;
  }
.lines{
        display:flex;
        position:fixed;
        height:70px;
        width:30px;
        left:90%;
        top:38px;
        background-color:transparent;
        z-index:4;
        flex-direction:column;
    }
.line{
  position:absolute;
  display:flex;
  height:4.5%;
  width:90%;
  background-color:transparent;
  border-radius:60px;
  z-index:-2;
}
.line::before{
  content:"";
  position:absolute;
  display:flex;
  height:100%;
  width:100%;
  top:-50%;
  background-color:#e4e4e4;
  border-radius:60px;
  z-index:2
}
.line::after{
  content:"";
  position:absolute;
  display:flex;
  height:100%;
  width:100%;
  top:300%;
  background-color:#e4e4e4;
  border-radius:60px;
}
.linefunc{
}
.linefunc::before{
  top:-50%;
  animation:linefuncbe 0.3s;
  animation-fill-mode:forwards;
}
.linefunc::after{
  top:300%;
  animation:linefuncaf 0.3s;
  animation-fill-mode:forwards;
}
@keyframes linefuncbe{
  0%{
    display:flex;
    top:-50%;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    transform:rotate(0deg);
  }
  100%{
    top:-50%;
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    transform:rotate(0deg);
  }
}
@keyframes linefuncaf{
  0%{
    top:300%;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    transform:rotate(0deg);
  }
  100%{
    top:300%;
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    transform:rotate(0deg);
  }
}
  .menu{
          display: flex;
          position: fixed;
          height: 100%;
          width: 100%;
          left: 0%;
          top: 0%;
          background-color: rgba(0, 0, 0, 0.5);
          backdrop-filter:blur(10px);
	      -webkit-backdrop-filter:blur(10px);
          flex-direction: column;
          overflow:hidden;
          clip-path: circle(0px at 90% -20%);
          transition: all 0.4s ease-out;
          pointer-events: none;
          z-index:4;
          animation: menuactivere 0.4s;
          animation-fill-mode: forwards;
      }
.menuactive{
      animation: menuactive 0.4s;
      animation-fill-mode: forwards;
      animation-delay:0.1s;
      clip-path: circle(0px at 90% -20%);
      pointer-events: all;
      z-index:4;
      
}
@keyframes menuactive{
  0%{
  }
  100%{
    clip-path: circle(1000px at 90% -10%);
  }
}
@keyframes menuactivere{
  0%{
    clip-path: circle(1000px at 90% -10%);
  }
  100%{
    clip-path: circle(0px at 90% -20%);
  }
}
.menucross{
        display:flex;
        position:fixed;
        height:70px;
        width:30px;
        left:90%;
        top:38px;
        background-color:transparent;
        z-index:123;
        flex-direction:column;
}
.menucross::before{
  content:"";
  position:absolute;
  display:flex;
  height:4.5%;
  width:100%;
  top:10%;
  background-color:#e4e4e4;
  border-radius:60px;
  transform:rotate(-45deg);
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  animation:menucross 0.5s;
  animation-fill-mode:forwards;
}
.menucross::after{
  content:"";
  position:absolute;
  display:flex;
  height:4.5%;
  width:100%;
  top:10%;
  background-color:#e4e4e4;
  border-radius:60px;
  transform:rotate(45deg);
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  animation:menucross 0.5s;
  animation-fill-mode:forwards;
}
.menucrossactive{
}
.menucrossactive::before{
  transform:rotate(-45deg);
  animation:menucrossacbe 0.5s;
  animation-fill-mode:forwards;
  animation-delay:0.4s;
}
.menucrossactive::after{
  transform:rotate(45deg);
  animation:menucrossacaf 0.5s;
  animation-fill-mode:forwards;
  animation-delay:0.4s;
}
@keyframes menucrossacbe{
  0%{
  }
  100%{
    clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
  }
}
@keyframes menucrossacaf{
  0%{
  }
  100%{
    clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
  }
}
.menuitems{
    position:fixed;
    display:flex;
    top:0;
    left:0;
    height:100%;
    width:100%;
    background-color:#00000000;
    flex-items:column;
    z-index:4;
    
}
.itemdiv::before{
  content:"+";
  position:absolute;
  display:flex;
  height:100%;
  width:20%;
  left:10%auto;
  top:-10%;
  left:-20%;
  background-color:transparent;
  color:#e4e4e6;
  justify-content:flex-end;
  align-items:center;
  font-size:18px;
}
     .item1{
        position:absolute;
        display:flex;
        background-color:transparent;
        height:10%;
        width:100%;
        left:5%;
        top:15%;
        justify-content:start;
        align-items:center;
        animation: linksupitem1Reverse 0s ease-in-out;
        animation-fill-mode: forwards;
        }
        .item2{
        position:absolute;
        display:flex;
        background-color:transparent;
        height:10%;
        width:100%;
        left: 5%;
        top:30%;
        justify-content:start;
        align-items:center;
        animation: linksupitem2Reverse 0s ease-in-out;
        animation-fill-mode: forwards;
        }
        .item3{
          position:absolute;
          display:flex;
          background-color:transparent;
          height:10%;
          width: 100%;
          left: 5%;
          top:45%;
          justify-content:start;
          align-items:center;
          animation: linksupitem3Reverse 0s ease-in-out;
          animation-fill-mode: forwards;
          }
        .item4{
          position:absolute;
          display:flex;
          background-color:transparent;
          height:10%;
          width:100%;
          left: 5%;
          top:60%;
          justify-content:start;
          align-items:center;
          animation: linksupitem4Reverse 0s ease-in-out;
          animation-fill-mode: forwards;
          }
.item5{
          position:absolute;
          display:flex;
          background-color:transparent;
          height:10%;
          width: 100%;
          left: 5%;
          top:75%;
          justify-content:start;
          align-items:center;
          animation: linksupitem4Reverse 0s ease-in-out;
          animation-fill-mode: forwards;
          }
.item6{
          position:absolute;
          display:flex;
          background-color:transparent;
          height:10%;
          width: 100%;
          left: 5%;
          top:90%;
          justify-content:start;
          align-items:center;
          animation: linksupitem4Reverse 0s ease-in-out;
          animation-fill-mode: forwards;
          }
        .itemdiv a{
          text-decoration:none;
            transition:1s;
            color: #e4e4e6;
            visibility: visible;  
            font-weight:700;
            font-size: 36px;
            margin-left:0.5%;
            width:100%;
        }
.itemdiv a::before{
  content:"";
  position:absolute;
  display:flex;
  height:3%;
  width:90%;
  left:-2%;
  top:80%;
  background-color:#e4e4e6;
}
 a.itemsafter{
          color:#feedbd;
}
@keyframes after1Reverse{
  0%{
    width:100%;
  }
  100%{
    width:0%;
  }
}
@keyframes after1{
  0%{
    width:0%;
  }
  100%{
    width:100%;
  }
}

.lines:hover ~ .menuitems{
    display:flex;
}
      .lines:hover ~ .unhover{
      display: flex;
      position: fixed;
      background-color:transparent;
      height:6%;
        width:11%;
        left:88%;
        top:5%;
        z-index:11;
      transition: 0.4s all ease-in-out;
  }
  .menuafter{
      top: -100%;
  }
  .unhover{
      position: fixed;
      display: flex;
      background-color: transparent;
      height: 8%;
      width: 15%;
      z-index: 1;
      left: 10%;
      top: 5%;
      transition: 0.6s all ease-in-out;
  }
.unhover img{
    opacity:0;
    width:100%;
    height:100%;
}
.mform{
  display:flex;
  position:relative;
  top:200px;
  flex-direction:column;
}