Snake code

@import url('https://fonts.googleapis.com/css?family=Unica+One');

body{
background-color:#000;
overflow:hidden;
}

#overlay1{
width:10vw;
height:100vh;
background-color:#1E2422;
position:absolute;
right:0vw;
background-image:url(https://pre00.deviantart.net/76e9/th/pre/f/2010/186/1/a/camo_pattern_2_by_master_at_arms.png);

transition:2s;
}

#solidsnake{
background-image:url(http://i.picpar.com/PUVc.png);
background-size:100%;
height:100vh;
width:35vw;
background-repeat:no-repeat;
position:absolute;
left:0vw;

}

 .tab1 a{
width:5vh;
height:100vh;
background-color:#1E2422;
box-shadow:0px 0px 10px 0px #000;
display:block;
position:absolute;
right:7.5vw;
background-image:url(https://pre00.deviantart.net/76e9/th/pre/f/2010/186/1/a/camo_pattern_2_by_master_at_arms.png);
text-decoration:none;
}

#blanket1:target .tab1 a{
right:97.5vw;
transition:2s;
}

#blanket1:target .tab2 a{
right:5vw;
transition:2s;
z-index:98;
}

#blanket1:target .tab3 a{
right:2.5vw;
transition:2s;
z-index:97;
}

#blanket1:target .tab4 a{
right:0vw;
transition:2s;
z-index:96;
}
#blanket1:target #overlay1{
width:100vw;
}

#overlay2{
width:7.5vw;
height:100vh;
background-color:#6F0B0B;
position:absolute;
right:0vw;
background-image:url(https://pre00.deviantart.net/488b/th/pre/f/2010/186/a/d/camo_pattern_4_by_master_at_arms.png);
transition:2s;
}
 .tab2 a{
width:5vh;
height:100vh;
background-color:#6F0B0B;
box-shadow:0px 0px 10px 0px #000;
display:block;
position:absolute;
right:5vw;
background-image:url(https://pre00.deviantart.net/488b/th/pre/f/2010/186/a/d/camo_pattern_4_by_master_at_arms.png);

}

#blanket2:target .tab1 a{
right:97.5vw;
transition:2s;
z-index:99;
}

#blanket2:target .tab2 a{
right:95vw;
transition:2s;
z-index:98;
}

#blanket2:target .tab3 a{
right:2.5vw;
transition:2s;
z-index:97;
}

#blanket2:target .tab4 a{
right:0vw;
transition:2s;
z-index:96;
}

#blanket2:target #overlay1{
width:100vw;
}
#blanket2:target #overlay2{
width:97.5vw;

}

#blanket2:target #overlay3{
width:5vw;
}

#blanket2:target #overlay4{
width:2.5vw;

}



#overlay3{
width:5vw;
height:100vh;
background-color:#7a6246;
position:absolute;
right:0vw;
background-image:url(https://www.transparenttextures.com/patterns/subtle-carbon.png);
transition:2s;
}

 .tab3 a{
width:5vh;
height:100vh;
background-color:#7a6246;
box-shadow:0px 0px 10px 0px #000;
display:block;
position:absolute;
right:2.5vw;
background-image:url(https://www.transparenttextures.com/patterns/subtle-carbon.png);
}

#blanket3:target .tab1 a{
right:97.5vw;
transition:2s;
z-index:99;
}

#blanket3:target .tab2 a{
right:95vw;
transition:2s;
z-index:98
}

#blanket3:target .tab3 a{
right:92.5vw;
transition:2s;
z-index:97;
}


#blanket3:target .tab4 a{
right:0vw;
transition:2s;
z-index:96;
}

#blanket3:target #overlay1{
width:100vw;
}
#blanket3:target #overlay2{
width:97.5vw;

}

#blanket3:target #overlay3{
width:95vw;
}

#blanket3:target #overlay4{
width:2.5vw;

}

#overlay4{
width:2.5vw;
height:100vh;
background-color:#1F2630;
position:absolute;
right:0vw;
background-image:url(https://www.transparenttextures.com/patterns/subtle-carbon.png);
transition:2s;
}

 .tab4 a{
width:5vh;
height:100vh;
background-color:#1F2630;
box-shadow:0px 0px 10px 0px #000;
display:block;
position:absolute;
right:0vw;
background-image:url(https://www.transparenttextures.com/patterns/subtle-carbon.png);
}

#blanket4:target .tab1 a{
right:97.5vw;
transition:2s;
z-index:99;
}

#blanket4:target .tab2 a{
right:95vw;
transition:2s;
z-index:98
}

#blanket4:target .tab3 a{
right:92.5vw;
transition:2s;
z-index:97;
}

#blanket4:target .tab4 a{
right:90vw;
transition:2s;
z-index:96;
}

#blanket4:target #overlay1{
width:100vw;
}
#blanket4:target #overlay2{
width:97.5vw;

}

#blanket4:target #overlay3{
width:95vw;
}

#blanket4:target #overlay4{
width:92.5vw;

}

.text{
text-align:center;
font-size:3vw;
color:#fff;
font-family: 'Unica One', cursive;
text-decoration:none;
text-orientation: upright ;
position:absolute;
top:15vh;
transition:1s;
line-height:5vh;
}

.tab1 a:hover .text{
line-height:8vh;
}

.tab2 a:hover .text{
line-height:8vh;
}
.tab3 a:hover .text{
line-height:8vh;
}
.tab4 a:hover .text{
line-height:8vh;
}

<div id="blanket1"><div id="blanket2"><div id="blanket3"><div id="blanket4">
<div id="overlay1">

</div>

<div id="overlay2">

</div>

<div id="overlay3">
<div id="solidsnake">
</div>
</div>

<div id="overlay4">

</div>
<div class="tab1">
<a href="#blanket1">
<div class="text"> N A K E D S N A K E</div>
</a>
</div>
<div class="tab2">
<a href="#blanket2">
<div class="text"> V E N O M S N A K E </div>
</a>
</div>
<div class="tab3">
<a href="#blanket3">
<div class="text"> s o l <br> i d s n a k e </div>
</a>
</div>
<div class="tab4">
<a href="#blanket4">
<div class="text"> O L D S N A K E </div>
</a>
</div>