76 lines
1.3 KiB
CSS
76 lines
1.3 KiB
CSS
.main {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.main > * {
|
|
margin-top: calc(65rem / 16);
|
|
margin-bottom: calc(65rem / 16);
|
|
}
|
|
|
|
.title {
|
|
position: relative;
|
|
width: 80vw;
|
|
height: 100vh;
|
|
}
|
|
|
|
.titleImage {
|
|
position: absolute;
|
|
top: 10vh;
|
|
left: 10vw;
|
|
}
|
|
|
|
.blurb {
|
|
position: absolute;
|
|
bottom: 0vh;
|
|
right: 7vw;
|
|
width: 43vw;
|
|
height: 33vh;
|
|
padding: calc(30rem / 16);
|
|
background-color: var(--translucent-accent);
|
|
border: calc(2rem / 16) solid var(--primary-text);
|
|
box-shadow: 0 calc(1rem / 16) calc(10rem / 16) var(--primary-accent);
|
|
border-radius: calc(50rem / 16);
|
|
z-index: 1;
|
|
}
|
|
|
|
.blurb h1 {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.classYear {
|
|
color: var(--primary-text);
|
|
}
|
|
|
|
.classProfile {
|
|
color: var(--primary-heading)
|
|
}
|
|
|
|
.blurb h3 {
|
|
color: var(--primary-accent-light);
|
|
}
|
|
|
|
.decoratorSolid {
|
|
position: absolute;
|
|
top: 2vh;
|
|
right: 13vw;
|
|
width: 16vw;
|
|
height: 24vh;
|
|
background-color: var(--primary-accent-lighter);
|
|
opacity: 50%;
|
|
border-radius: calc(50rem / 16);
|
|
}
|
|
|
|
.decoratorDots {
|
|
position: absolute;
|
|
top: 40vh;
|
|
right: 0.8vw;
|
|
width: 11vw;
|
|
height: 36vh;
|
|
background-image: radial-gradient(var(--link) 35%, transparent 35%);
|
|
background-position: 0 0;
|
|
background-size: calc(25rem / 16) calc(25rem / 16);
|
|
z-index: -1;
|
|
}
|