58 lines
1 KiB
CSS
58 lines
1 KiB
CSS
|
/* (removing the cube shadow) */
|
||
|
html { background: var(--gradient) fixed; }
|
||
|
|
||
|
body { display: unset; }
|
||
|
|
||
|
/* doesn't do anything without js */
|
||
|
#face-menu { display: none; }
|
||
|
|
||
|
#outer, #cube {
|
||
|
position: unset;
|
||
|
height: unset;
|
||
|
width: unset;
|
||
|
max-width: max(100%, 45em);
|
||
|
}
|
||
|
|
||
|
#outer::after {
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
#outer {
|
||
|
margin: 2em auto 5em;
|
||
|
padding: 0 1em;
|
||
|
}
|
||
|
|
||
|
#cube > section {
|
||
|
position: relative;
|
||
|
inset: unset;
|
||
|
overflow: unset;
|
||
|
}
|
||
|
#cube > section + section {
|
||
|
margin-top: 2em;
|
||
|
}
|
||
|
#cube > section::after {
|
||
|
content: ' ';
|
||
|
position: absolute;
|
||
|
inset: calc(0px - var(--border-thickness));
|
||
|
box-shadow: 0 0 40px hsl(var(--shadow-hsl) / 40%);
|
||
|
mix-blend-mode: multiply;
|
||
|
pointer-events: none;
|
||
|
}
|
||
|
|
||
|
#cube #hello {
|
||
|
background-size: auto 95%, auto, auto;
|
||
|
background-position: bottom right;
|
||
|
padding-right: 45%;
|
||
|
}
|
||
|
|
||
|
#cube #activities {
|
||
|
background-size: auto 5em, auto, auto;
|
||
|
background-position: bottom left;
|
||
|
padding-bottom: 6em;
|
||
|
}
|
||
|
|
||
|
#cube #six {
|
||
|
background-size: auto 100%, auto, auto;
|
||
|
background-position: bottom right;
|
||
|
}
|