|
|
|
@ -5,7 +5,20 @@
|
|
|
|
|
body{
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
/* Add media queries for different screen sizes */
|
|
|
|
|
@media screen and (max-width: 600px) {
|
|
|
|
|
/* Adjust styles for screens smaller than 600px wide */
|
|
|
|
|
.buttoncontainer {
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.fullcontainer {
|
|
|
|
|
max-width: 100%;
|
|
|
|
|
padding: 0 20px;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
}
|
|
|
|
|
#welcomepage{
|
|
|
|
|
/* background: linear-gradient(90deg, rgba(153,150,244,1) 0%, rgba(128,205,229,1) 50%, rgba(147,102,237,1) 100%); */
|
|
|
|
|
background-color: #050725;
|
|
|
|
@ -44,6 +57,7 @@ p{
|
|
|
|
|
transform: translate(-50%,-50%);
|
|
|
|
|
font-family: monospace;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#description_color{
|
|
|
|
|
color:#87b5e7;
|
|
|
|
|
}
|
|
|
|
@ -63,6 +77,8 @@ p{
|
|
|
|
|
left: 50%;
|
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
|
position: absolute;
|
|
|
|
|
max-width: 100%;
|
|
|
|
|
height: auto;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -125,7 +141,24 @@ p{
|
|
|
|
|
left:52%;
|
|
|
|
|
top:450%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#happymanhat{
|
|
|
|
|
left: 14%;
|
|
|
|
|
top: 1600%;
|
|
|
|
|
}
|
|
|
|
|
#girldance{
|
|
|
|
|
left: 76%;
|
|
|
|
|
top: 1590%;
|
|
|
|
|
}
|
|
|
|
|
#heartjump{
|
|
|
|
|
left: 0%;
|
|
|
|
|
top: 1390%;
|
|
|
|
|
width: 15em;
|
|
|
|
|
height: 15em;
|
|
|
|
|
}
|
|
|
|
|
#takemymoney{
|
|
|
|
|
left: 47%;
|
|
|
|
|
top: 1800%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.buttonback {
|
|
|
|
|
background-color: #050725;
|
|
|
|
@ -170,9 +203,8 @@ p{
|
|
|
|
|
.buttoncontainer {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
margin-top: 31em;
|
|
|
|
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -302,15 +334,30 @@ a:link {
|
|
|
|
|
display: grid;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
grid-template-columns: auto auto auto auto auto;
|
|
|
|
|
row-gap: 90px;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-items: center;
|
|
|
|
|
margin-left:2.5em;
|
|
|
|
|
margin-right: 2.5em;
|
|
|
|
|
margin-bottom: 8em;
|
|
|
|
|
margin-top: 38em;
|
|
|
|
|
gap: 110px;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Styles for medium-sized screens */
|
|
|
|
|
@media (max-width: 768px) {
|
|
|
|
|
.grid {
|
|
|
|
|
grid-template-columns: repeat(3, 1fr);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Styles for smaller screens */
|
|
|
|
|
@media (max-width: 480px) {
|
|
|
|
|
.grid {
|
|
|
|
|
grid-template-columns: repeat(2, 1fr);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.overviewimage{
|
|
|
|
|
object-fit: contain;
|
|
|
|
|
width: 250px;
|
|
|
|
@ -319,6 +366,7 @@ a:link {
|
|
|
|
|
background-image: url(/assets/glitter-stars.gif);
|
|
|
|
|
height:250px;
|
|
|
|
|
padding:10px;
|
|
|
|
|
max-width: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|