Files
BRB-History/Version - 37/css/shop.css
2023-11-29 22:29:18 +01:00

156 lines
2.5 KiB
CSS

*{
margin: 0;
padding: 0;
user-select: none;
box-sizing: border-box;
scroll-behavior: smooth;
}
body {
font-size: 15pt;
/*background: linear-gradient(#009000, black);*/
background-color: #ccc;
}
.main{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
#links{
position: relative;
width: 100%;
margin: 1rem auto;
padding: 10px;
display: flex;
justify-content: space-around;
}
.link{
position: relative;
display: flex;
justify-content: center;
align-items: center;
background-color: var(--color);
width: 200px;
height: 50px;
margin: 1rem auto;
border: 3.69px none #333333;
filter: drop-shadow(10px 8px 6px #333);
border-radius: 69px;
}
/* By MrEidam */
.item{
background-color: papayawhip/*var(--color)*/;
/*border: 2px solid #333;*/
border: none;
top: 5px;
margin: 2rem 3vw 2rem 3vw;
padding: 1rem;
border-radius: 6.9px;
display: flex;
flex-direction: column;
justify-content: space-evenly;
align-items: center;
width: 500px;
height: 340px;
filter: drop-shadow(0px 20px 14px #444);
}
.item img{
width: 100px;
aspect-ratio: 1/1;
margin: 0.5rem;
object-fit: contain;
filter: drop-shadow(10px 8px 6px #333);
pointer-events: none
}
.buttons{
display: flex;
justify-content: space-around;
}
/* By MrEidam */
.buttons button{
background-color: var(--Bcolor);
border-radius: 8px;
margin: 1rem;
}
.buyone{
width: 200px;
height: 50px;
}
.buymax{
width: 50px;
height: 50px;
}
main{
position: relative;
}
/* Clisks */
#logclick{
background-color: papayawhip;
display: flex;
align-items: center;
justify-content: center;
gap: 5ch;
margin: 0 5vw 0 5vw;
padding: 1rem;
border: 5px dashed blue;
border-radius: 1rem;
}
#imgcli{
width: 40px;
height: 40px;
margin: 0.1rem;
}
/* By MrEidam */
.clickbtn{
display: flex;
justify-content: space-around;
}
.clickbtn button{
background-color: var(--Bcolor);
border-radius: 8px;
margin: 0 1rem 0.5rem 1rem;
}
.row{
display: flex;
flex-direction: row;
justify-content: center;
}
/*@media only screen and (max-width: 1100px){
.row .item{
display: flex;
flex-direction: column;
justify-content: center;
left: 50%;
transform: translateXyy(-50%);
}
}*/
button{
border: none;
filter: drop-shadow(8px 6px 4px #555);
}
@media only screen and (max-width: 800px){
.row{
flex-direction: column;
justify-content: center;
}
.item{
width: auto;
margin: 2rem 10vw 2rem 10vw;
}
}