arcade-machine/ui/style.css
2023-02-23 13:39:06 +02:00

84 lines
No EOL
1.5 KiB
CSS

.container{
display: grid;
height: 100vw;
grid-template-columns: repeat(3,1fr);
grid-template-rows: repeat(2,1fr);
grid-gap: 15px;
margin-top: 10px;
}
body{
min-height: 100vh;
max-width: 85vw;
margin: 0 auto;
}
* {
box-sizing: border-box; /* ulehci zivot */
}
.move{
display: flex;
color:rgb(15, 12, 12, 0.88);
border: 3px solid black;
font-family:Verdana, Geneva, Tahoma, sans-serif;
justify-content: flex-end;
align-items: center;
flex-direction: column;
}
.sex{
}
#sdvx3-button{
position: relative ;
}
#sdvx3-button::after{
content: "";
background-image: url(sound-voltex-iii-gravity-wars-1.png);
background-size: cover;
opacity: 0.5;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
z-index: 0;
}
#sdvx4-button{
position: relative;
}
#sdvx4-button::after{
content: "";
background-image: url(maxresdefault3.jpg);
background-size: cover;
opacity: 0.5;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
z-index: 0
}
#sdvx5-button{
position: relative;
}
#sdvx5-button::after{
content: "";
background-image: url(SDVX5scaled.jpg);
background-size: cover;
opacity: 0.5;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
z-index: 0;
}
.sex:focus{
border:10px solid red;
}