/* Set the background colours for the nav buttons */
.neutral.contribute {
background-color: #f6f5f3;
box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
border-radius: 15px;
border-bottom: 2px solid #3d3d3f;
}
html.skin-theme-clientpref-night .neutral.contribute {
background-color: #161a24;
border-bottom: 2px solid #f6f5f3;
box-shadow: -4px 4px 8px 0px rgba(225, 225, 225, 0.1);
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .neutral.contribute {
background-color: #161a24;
border-bottom: 2px solid #f6f5f3;
box-shadow: -4px 4px 8px 0px rgba(225, 225, 225, 0.1);
}
}
/* Set the text colours */
.white-p.contribute {
color: white;
font-size: 100%;
}
.white-p.contribute a {
color: white;
text-decoration: none;
}
.black-p.contribute {
color: #3d3d3f;
font-size: 100%;
margin: 15px;
}
html.skin-theme-clientpref-night .black-p.contribute {
color: white;
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .black-p.contribute {
color: white;
}
}
.black-p.contribute a {
color: #3d3d3f;
text-decoration: none;
}
html.skin-theme-clientpref-night .black-p.contribute a {
color: white;
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .black-p.contribute a {
color: white;
}
}
.black-h2.contribute {
color: #3d3d3f;
font-size: 150%;
font-weight: bold;
text-align: center;
margin: 15px;
}
html.skin-theme-clientpref-night .black-h2.contribute {
color: white;
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .black-h2.contribute {
color: white;
}
}
.black-h2.contribute a {
color: #3d3d3f;
text-decoration: none;
}
html.skin-theme-clientpref-night .black-h2.contribute a {
color: white;
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .black-h2.contribute a {
color: white;
}
}
/* Flexbox styles for the nav container */
.contribute-nav-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
/* Set each button to cover a third of the screen on desktop */
@media all and (min-width: 720px) {
.contribute {
flex-basis: 45%;
box-sizing: border-box;
padding: 3px;
color: white;
text-decoration: none;
justify-content: space-between;
}
}
@media all and (max-width: 720px) {
.contribute {
flex-basis: 100%;
box-sizing: border-box;
color: white;
text-decoration: none;
justify-content: space-between;
margin-bottom: 20px;
}
}