body{
  background-color:black;
}

nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:2vw;
    font-size:2vw;
    margin-top:2vw;
    text-decoration:none;
    font-family:"kapakana";
}

@media(min-width:1000px){nav{
  height:9vw;
  width:65vw;
  margin-bottom:-5vw;
  margin-top:-4vw;
  margin-left:15vw;
}
}
  

.navhome,.navshortfilms, .navcomics, .navsketches, .navmisc, .navabout{
  height:15vw;
  width:15vw;
  border-style:none;
   background-position:center;
  background-size:cover;
}

.navhome{
  background-image:url(https://azart6311.neocities.org/jpgs/home2active.jpg);
}
.navhome:hover{
  background-image:url(https://azart6311.neocities.org/jpgs/home2hover.jpg);
}

.navshortfilms{
  background-image:url(https://azart6311.neocities.org/jpgs/shortfilmactive.jpg);
}
.navshortfilms:hover{
  background-image:url(https://azart6311.neocities.org/jpgs/shortfilmhover.jpg);
}

.navcomics{
  background-image:url(https://azart6311.neocities.org/jpgs/comicsactive.jpg);
}
.navcomics:hover{
  background-image:url(https://azart6311.neocities.org/jpgs/comicshover.jpg);
}

.navsketches{
 background-image:url(https://azart6311.neocities.org/jpgs/sketchesactive.jpg)
}
.navsketches:hover{
 background-image:url(https://azart6311.neocities.org/jpgs/sketcheshover.jpg)
}
.navmisc{
  background-image:url(https://azart6311.neocities.org/jpgs/otheractive.jpg)
}
  
.navmisc:hover{
  background-image:url(https://azart6311.neocities.org/jpgs/otherhover.jpg)
}
.navabout{
  background-image:url(https://azart6311.neocities.org/jpgs/aboutactive.jpg)
}
.navabout:hover{
  background-image:url(https://azart6311.neocities.org/jpgs/abouthover.jpg)
}

@media(min-width:700px){.navhome, .navshortfilms, .navcomics, .navsketches, .navmisc, .navabout{
  height:12vw;
  width:12vw;
  ;
}
}
  @media(min-width:1000px){.navhome, .navshortfilms, .navcomics, .navsketches, .navmisc, .navabout{
  height:9vw;
  width:9vw;
 margin-top:2vw;
}
}

.intro{
  color:#f705c7;
  font-family:courier;
  text-align:left;
width:700px;
display:flex;
  justify-content:center;
  align-items:center;
  margin:auto;
  border-style:dashed;
  border-color:white;
 padding:1vw;
}

@media(min-width:700px){.intro{
margin-top:3vw;
}
}

@media(min-width:1000px){.intro{
margin-top:6vw;
}
}

.CLARA{
  top:75vw;
  display:flex;
  justify-content:center;
  align-items:center;
  position:absolute;
  width:20vw;
  height:10vw;
  margin-left:40vw;
  font-family:"Shadows Into Light", cursive;
  font-style: normal; 
  font-weight:bold;
  z-index:3; 
  font-size:8vw;
  color:white;
  background:#f705c7;
  text-decoration: none;
  padding-right:2vw;
  padding-left:2vw;
  border-style:dashed;
  border-width: .5vw;
  }
  
  @media(min-width:900px){.CLARA{
    width:8vw;
    height:5vw;
    font-size:4vw;
    top:55vw;
    margin-left:45vw;

  }
  }
  
  @media(min-width:1000px){.CLARA{
    width:8vw;
    height:5vw;
    font-size:4vw;
    top:43vw;
    margin-left:44vw;
  }
  }
  
  .NAMI{
    top:157vw;
    margin-left:40vw;
  display:flex;
  justify-content:center;
  align-items:center;
  position:absolute;
  width:20vw;
  height:10vw;
  font-family:"Charm", cursive;
  font-style: normal; 
  font-weight:bold;
  z-index:3; 
  font-size:8vw;
  color:white;
  background:#fc3912;
  text-decoration: none;
  padding-right:15px;
  padding-left:15px;
  border-style:dotted;
  border-width:1vw;
  }
  a:hover{color:#0d00fc;}
  
    @media(min-width:900px){.NAMI{
    width:8vw;
    height:5vw;
    font-size:4vw;
    top:115vw;
    margin-left:45vw;
    border-width:.5vw;
  }
  }
  
  @media(min-width:1000px){
  .NAMI{
   top:100vw;
 }
 }

.claracover{
    display:flex;
  justify-content:center;
  align-items:center;
  position:relative;
  margin:auto;
  height:80vw;
 width:100vw;
  z-index:1;
  object-fit:cover;
  }
  
   @media(min-width:900px){
  .claracover{
    width:90vw;
  height:50vw;
  margin-left:4vw;
  margin-bottom:5vw;
  }
   }
  
.namisticker{
   display:flex;
  justify-content:center;
  align-items:center;
  position:relative;
  margin:auto;
  height:80vw;
 width:100vw;
  z-index:1;
  object-fit:cover;
}

 @media(min-width:900px){
  .namisticker{
    width:90vw;
  height:50vw;
  margin-left:4vw;
  margin-top:5vw;
  margin-bottom:5vw;
 }
 }