nubes crd co menu !

<!-- by is4joon cr for the menu to resource.ju.mp admin jeje  -->


<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mali&display=swap" rel="stylesheet">
<style>

@font-face {
font-family: good-time;
src: url(https://dl.dropbox.com/s/ijxda4xb1cyjpe4/KGAlwaysAGoodTime.ttf);
}

a.ayud {
font-family: good-time;
font-size:1.6em;
text-shadow: -1px 0 #8a631b
, 0 1px #8a631b, 1px 0 #8a631b, 0 -1px #8a631b, 0 0;
color: #fccfcf;
}

.rotate {
animation: rotation 4s infinite linear;
}

@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
}

figure.blurfilter{
margin: 0;
padding: 0;
display: inline-block;
position: relative;
border-radius: 50%;
overflow: hidden; /
}

.figcaption img {
width: 10px;
}

figure.blurfilter img{
display: block;
width: 240px;
height: auto;
transition: all 0.4s 0.4s;
}

figure.blurfilter figcaption{
position: absolute;
display: block;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
background: white;
border-radius: 50%;
padding: 20px;
z-index: 100;
width: 90%;
height: 90%;
overflow: auto;
top: 5%;
left: 5%;
font-family: 'Mali', cursive;
font-size: 16px;
opacity: 0;
-moz-transition: all 0.4s;
-webkit-transition: all 0.4s;
transition: all .4s;
}

figure.blurfilter figcaption h3{
border-bottom: 1px solid red;
text-align: left;
width: 90%;
margin: 0;
}

figure.blurfilter figcaption p{
text-align: left;
margin-top: 10px;
line-height: 1.5;
}

figure.blurfilter figcaption a{
text-decoration: none;
}

figure.blurfilter:hover img{
-webkit-filter: blur(5px);
filter: blur(5px);
-webkit-transform: scale(1.3);
transform: scale(1.3);
-moz-transition: all 0.4s;
-webkit-transition: all 0.4s;
transition: all 0.4s;
}

figure.blurfilter:hover figcaption{
opacity: 1;
-moz-transition: all .4s .4s;
-webkit-transition: all .4s .4s;
transition: all .4s .4s;
}

figure.slidey figcaption{
-webkit-transform: rotateY(90deg);
transform: rotateY(90deg);
}

figure.slidey:hover figcaption{
-webkit-transform: rotateY(0);
transform: rotateY(0);
}
.pixel {
width: 1em !important;
filter: none !important;
display: inline-block;
}
figcaption {
overflow-y: scroll;
}
</style>
<figure class="blurfilter slidey">
<img src="https://64.media.tumblr.com/31262138748b2d1d12a2be77c7010a52/bd9ff758f6579532-7f/s1280x1920/a8fc014432622bbedba4f5dd6d4b965ad3e46769.png" class="rotate" />
<figcaption>
info info info info
<br>info info info
<br>info info info
<br></br>
<a class="ayud"> before you follow </a>
<br>info info info info info info info info info info info info info info info info info info info info info info info info info info info
<br></br>
<a class="ayud"> dont follow if </a>
<br>info info info info info info info info info info info info info info info info info info info info info info info info info info info
<br></br>
<a class="ayud"> music </a>
<br>info info info info info info info info info info info info info info info info info info info info info info info info info info info

</figure>