User:Mopsgamer/global.css

.list { transition: 0.5s; line-height: 35px; width: fit-content; } .list:hover { transition: 0.5s; } .list ul { margin: 0; } .list>li { margin-top: -10px !important; list-style: none; background: linear-gradient(225deg,#5eb1ff 10px,#0000 10px),linear-gradient(200deg,#39f,#06f); box-shadow: inset 0 -6px 0 rgba(0,0,32,0.2), inset 0 6px 0 #5eb1ff, 0 4px 0 rgba(0,0,0,0.15); display: none; text-shadow: 0 0 1px black; font-size: 20px; border: 4px solid black; border-radius: 0 10px 10px 10px; color: white; font-family: Pusia Extra Bold; padding: 5px 10px 10px; position: absolute !important; animation: 0.2s linear slidein; transform-origin: 100% 0%; } .list:hover li { display: block; position: inherit; } .list a { background: linear-gradient(225deg,#5eb1ff 10px,#0000 10px),linear-gradient(200deg,#39f,#06f); box-shadow: inset 0 -6px 0 rgba(0,0,32,0.2), inset 0 6px 0 #5eb1ff, 0 4px 0 rgba(0,0,0,0.15); text-shadow: 0 0 1px black; font-size: 12px; border: 4px solid black; border-radius: 10px; color: white !important; font-family: Pusia Extra Bold; text-align: center; width: 150px; height: 35px; text-decoration: none !important; padding: 0 14px; display: block; } .list>p>a { font-size: 20px; padding: 0 14px; height: 40px; width: 160px; } .list>p>a:hover{ border-radius: 10px 10px 0 0; } .list:hover>li { display: block; margin: 10px auto; transition: 0.5s ease-out; opacity: 1; } .list a:hover { text-decoration: none !important; color: gold !important; }

@keyframes slidein { 0% {       transform: skewX(10deg); opacity: 0; }   70% {        transform: translateX(0) skewX(0); }   85% {        transform: skewX(-6deg); }   100% {        transform: translateX(0) skewX(0); opacity: 1; } }