*{
padding: 0;
margin: 0;


}
body{
    background: linear-gradient(#05053b ,#290413);
    height: 100vh;
    font-family: system-ui;
}
section{
    background: linear-gradient(#05053b ,#290413);
background-image:url(free.jpg) ;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;

}
ul{
    text-align: center;
}
ul:hover li a{
    opacity: 0;




}
ul li{
list-style: none;
margin: 14px 0;
}
ul li a{
    color: white;
    font-size: 25px;
    font-weight: 500px;
    letter-spacing: 2px;
    background: darkblue;
    padding: 5px;
    border-radius: 22px;
    display: inline-block;
    width: 130px;
}
ul li a:hover{
transform: scale(1.5);
background: #610f61;
opacity: 1;

}
ul li::after{
content: attr(data-text);
color: white;
position: absolute;
LEFT: 50%;
top: 12%;
transform: translate(-50%,-50%);
font-size: 20px;
font-weight: 600PX;
text-transform: uppercase;
opacity: 0;
pointer-events: none;
letter-spacing: 1px;
transition: 30%;

}
ul li:hover:after{
opacity: 0.5;
}