madstuff-website/css/styles.css
2026-04-12 13:12:22 +01:00

94 lines
1.9 KiB
CSS

/*
* *** My horrible colour naming scheme ***
* p=primary
* s=secondary
* bg=background
* a=accent
*/
:root {
--colour-p: rgb(204, 153, 255);
--colour-pbg: rgba(51, 0, 102, 0.3);
--colour-pbga: rgba(204, 153, 255, 0.3);
--colour-s: rgb(255, 153, 255);
--colour-sbg: rgba(102, 0, 102, 0.3);
--colour-sbga: rgba(255, 153, 255, 0.3);
}
body {
color: white;
font-family: 'Courier New';
margin-left: 20%;
margin-right: 20%;
background-image: url(/third-party/media/images/stars.gif);
}
header, main, footer {
margin-top: 2%;
border-style: solid;
}
header, footer, h1, h2, h3, h4, h5, h6 {
text-align: center;
}
header, footer {
background-color: var(--colour-sbg);
border-color: var(--colour-sbga);
}
main {
text-align: justify;
background-color: var(--colour-pbg);
border-color: var(--colour-pbga);
}
section, article, nav, div.section-like {
background-color: rgba(0, 0, 0, 0.3);
border-style: solid;
border-width: 2px;
margin-bottom: 1%;
}
header, footer, main, section, article, nav, div.section-like {
padding: 1%;
}
header section, header nav, footer section, footer nav, header div.section-like, footer div.section-like {
border-color: var(--colour-sbga);
}
main section, main article, main nav, main div.section-like {
border-color: var(--colour-pbga);
}
p.subtitle {
font-size: 18.72px;
}
.fit-container, .even-container {
display: flex;
}
.fit-container {
gap: 1%;
}
.even-container {
justify-content: space-evenly;
}
.fit-container .fit-item {
flex-grow: 1;
}
a:link, a:visited, a:hover, a:active {
color: rgb(179, 255, 255);
text-decoration: none;
}
.inline-block {
display: inline-block;
}
ul.no-style, ul.inline {
list-style: none;
margin: 0;
padding: 0;
}
ul.inline li {
display: inline-block;
}
pre {
color: white;
font-family: 'Courier New';
}
.centred-text {
text-align: center;
}
.centred-image {
display: block;
margin: auto;
}