/*INTRO*/
.intro-path {
  width: calc(100vw - 3vw);
  height: 100%;
  position: fixed;
  top: 0;
  left: 1.5vw;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 99;
  transition: opacity 0.5s;
}

.intro-path.fade {
  opacity: 0;
  pointer-events: none;
}

.intro-path.hide {
	width: 0;
    height: 0;
    display: none;
}

 svg#w-box{
  width: 55%;
  margin-right: 3.75%;
  transform: scaleX(-1);
}

svg#n-box{
  width: 40%;
  margin-left: 1.25%;
}
    
.path-w {
  fill: none;
  stroke: #000000;
  stroke-width: 37.5;
  stroke-miterlimit: 10;
  stroke-dasharray: 4500;
  stroke-dashoffset: 4500;
}

.path-w.draw {
  animation: dash 1.25s normal forwards ease-in;
}

.path-n {
  fill: none;
  stroke: #000000;
  stroke-width: 18.75;
  stroke-miterlimit: 10;
  stroke-dasharray: 4500;
  stroke-dashoffset: 4500;
}

.path-n.draw {
  animation: dash 1.25s normal forwards cubic-bezier(0.5, 0.5, 0.25, 0.5);
}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}

/*TABLET*/
@media (max-width:1024px) {
}

/*MOBILE*/
@media (max-width:600px) {

.intro-path {
 	width: calc(100vw - 8vw);
  	height: calc(100%; - 14vw);
    left: 4vw;
    padding-top: 14vw;
  	align-items: flex-start;
}

}