Template:Main page/header/styles.css

.home-header { margin-top: 1.6rem; }

.home-header__title { margin-top: 0; font-size: 1.5rem; font-family: var(--font-family-monospace); text-align: center; }

.home-header .home-header__subtitle { margin-top: 0.4rem; color: var( --color-base--subtle ); font-size: 0.875rem; font-family: var(--font-family-monospace); text-align: center; }

.home-header__search, .mw-ui-button, .mw-searchInput, .searchboxInput, .mw-ui-input, .mw-ui-input-inline { padding: 0.6rem 0.8rem; border: 1px solid; border-color: var( --border-color-base ); margin: 0.8rem auto 0 auto; background: var( --background-color-dp-04 ); border-radius: 100px; box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 ); color: var( --color-base--subtle ); font-size: 0.875rem; font-family: var(--font-family-monospace); }

.mw-ui-button { background-color: var(--color-primary); display: inline-block; position: absolute; right: 0; cursor: pointer; color: white; font-family: var(--font-family-monospace); }

.mw-ui-button:hover { background-color: var(--background-color-dp-04); border: none; cursor: pointer; }

.mw-searchInput, .searchboxInput, .mw-ui-input, .mw-ui-input-inline{ width: 100%; display: inline-block; }

.searchbox, position: relative; white-space: nowrap; overflow-x: auto; width: 50%; margin: 0 auto; }
 * 1) header-content{

font-family: var(--font-family-monospace); font-size: 0.875rem; margin-left: 4px; }
 * 1) language-text,
 * 2) article-count{

.keyboard-text { padding: 0 5px; border: 1px solid; margin: 0 2px; border-radius: 4px; }

/* Smartphones (portrait) --- */ @media (max-width: 800px) { .searchbox, #header-content{ width: 90%; } }

@media ( hover: none ) { .desktoponly { display: none; } }

content: 'cryptocurrencies'; animation: animate infinite 60s; }
 * 1) subtitle-variable:before {

@keyframes animate { 0% {		content: 'community'; }	10% {		content: 'blockchains'; }	20% {		content: 'NFTs'; }	30% {		content: 'DAOs'; }	40% {		content: 'altcoins'; }	50% {		content: 'bitcoin'; }	60% {		content: 'play to earn'; }	70% {		content: 'mining'; }	80% {		content: 'open source'; }	90% {		content: 'free'; }	100% {		content: 'ethereum'; } }