More actions
Content deleted Content added
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
Line 32: | Line 32: | ||
flex: 1 1 300px; |
flex: 1 1 300px; |
||
min-width: 300px; |
min-width: 300px; |
||
max-width: |
max-width: 420px; |
||
height: |
height: 340px; /* increased from 260px */ |
||
display: flex; |
display: flex; |
||
flex-direction: column; |
flex-direction: column; |
||
justify-content: center; |
justify-content: center; |
||
text-align: center; |
text-align: center; |
||
line-height: |
line-height: 2.2; /* more spacing for uppercase letters */ |
||
text-transform: uppercase; |
text-transform: uppercase; |
||
padding: |
padding: 1.5em; |
||
box-sizing: border-box; |
box-sizing: border-box; |
||
/* remove background and border if you don’t want the box look */ |
|||
background: none; |
background: none; |
||
border: none; |
border: none; |
||
overflow: hidden; /* make sure no scrollbars appear */ |
|||
} |
} |
Revision as of 17:40, 3 June 2025
.banner-container {
height: 30%;
overflow: hidden;
position: relative;
}
.banner-container img {
width: 100%;
position: relative;
top: -70%;
object-fit: cover;
border-radius: var(--border-radius-medium);
}
.card-patreon img {
filter: invert(32%) sepia(19%) saturate(5052%) hue-rotate(328deg) brightness(125%) contrast(110%); /* https://codepen.io/sosuke/pen/Pjoqqp */
}
.ritual-columns {
display: flex;
gap: 2em;
justify-content: center;
margin-top: 2em;
font-style: italic;
font-family: Georgia, serif;
color: #c2a8ff;
opacity: 0.85;
flex-wrap: wrap;
}
.ritual-block {
flex: 1 1 300px;
min-width: 300px;
max-width: 420px;
height: 340px; /* increased from 260px */
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
line-height: 2.2; /* more spacing for uppercase letters */
text-transform: uppercase;
padding: 1.5em;
box-sizing: border-box;
background: none;
border: none;
overflow: hidden; /* make sure no scrollbars appear */
}