Files
swaous.asuscomm.com/site/main.css
Lazy Hippopotamus 099bfceb7e
All checks were successful
Swaous.Asuscomm Build / Build-Docker-Image (push) Successful in 35s
slight updates
2025-02-24 16:46:32 -05:00

115 lines
1.9 KiB
CSS

[!][#config.stx]
@font-face {
font-family: milkyway;
src: url("[^config.baseurl]/milkyway.ttf");
}
@font-face {
font-family: cantarell;
src: url("[^config.baseurl]/Cantarell-VF.otf");
}
* {
font-family: cantarell, sans-serif;
}
body {
margin: 0px;
padding: 0px;
background-color: rgb(65, 48, 68);
}
body > div {
max-width: 800px;
width: 100%;
margin-left: auto;
margin-right: auto;
margin-top: 100px;
background-color: hsl(225, 30%, 26%);
border-radius: 100px;
box-shadow: 0px 0px 50px black;
flex: 2;
padding: 100px;
box-sizing: border-box;
color: white;
}
#toplogo {
text-align: center;
padding-bottom: 50px;
}
#toplogo > img {
height: 128px;
}
#nav {
position: sticky;
top: 0px;
display: flex;
width: max-content;
margin-left: auto;
margin-right: auto;
border-bottom: 1px solid white;
padding: 10px;
}
#nav > a {
text-decoration: none;
color: white;
transition: background-color 0.25s, color 0.25s;
background-color: rgb(22, 22, 22);
padding: 10px;
border-radius: 10px;
font-weight: bold;
margin-left: 10px;
margin-right: 10px;
height: 100%;
}
#nav > a > img {
height: calc(1em + 20px);
}
#nav > a:has(> img) {
padding: 0px;
background-color: transparent;
transition: margin 0.5s;
}
#nav > a:has(> img):hover {
margin-bottom: 10px;
margin-top: -10px;
background-color: transparent;
}
h1:not(.scrolly-visible)+#nav { /* sticky stuck! */
border-top: none;
}
#nav > a:hover {
background-color: rgb(199, 199, 199);
color: black;
}
h1, h2 {
font-family: milkyway;
text-align: center;
}
@media (max-width: 800px) {
body > div {
margin: 0px;
border-radius: 0px;
padding-left: 30px;
padding-right: 30px;
}
}
p {
line-height: 2em;
}