75 lines
1.5 KiB
CSS
75 lines
1.5 KiB
CSS
|
|
.group {
|
|
display: grid;
|
|
grid-template-rows: 1fr;
|
|
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
|
grid-gap: 5%;
|
|
background-color: #35465a9f;
|
|
backdrop-filter: blur(10px);
|
|
padding: 20px;
|
|
margin: 20px;
|
|
border-radius: 20px;
|
|
|
|
}
|
|
|
|
body {
|
|
background-image: url('https://www.atlasandboots.com/wp-content/uploads/2019/05/ama-dablam2-most-beautiful-mountains-in-the-world.jpg');
|
|
background-size:cover
|
|
}
|
|
|
|
h1 {
|
|
background-color: rgba(61, 87, 105, 0.726);
|
|
color: #CCCCCC;
|
|
padding: 10px;
|
|
border-radius: 10px;
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
a {
|
|
size: 200px;
|
|
font: bold 11px Arial;
|
|
text-decoration: none;
|
|
background-color: #EEEEEE;
|
|
color: #333333;
|
|
padding: 10px 20px;
|
|
border-radius: 20px;
|
|
transition: all 0.3s ease;
|
|
transform: scale(1);
|
|
display: inline-block;
|
|
transform-origin: center;
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
|
|
a:hover {
|
|
transform: scale(1.5);
|
|
background-color: #CCCCCC;
|
|
}
|
|
h2 {
|
|
background-color: #35465a9f;
|
|
backdrop-filter: blur(10px);
|
|
color: #EEEEEE;
|
|
border-radius: 10px;
|
|
padding: 10px;
|
|
}
|
|
p {
|
|
color: #EEEEEE;
|
|
background-color: rgba(136, 136, 136, 0.555);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 10px;
|
|
padding: 5px;
|
|
|
|
}
|
|
|
|
h3 {
|
|
|
|
color: #EEEEEE;
|
|
background-color: rgba(146, 146, 146, 0.555);
|
|
backdrop-filter: blur(5px);
|
|
border-radius: 10px;
|
|
padding: 5px;
|
|
text-align: center;
|
|
} |