MediaWiki:Timeless.css

/* All CSS here will be loaded for users of the Timeless skin */ /* Body changes */ border-bottom: solid 4px #9e8364; background: url(https://acmods.org/images/7/7e/ACMods_Background.png); font-family: 'Open Sans',sans-serif !important; background-size: 350px; }   padding: 1em 2em 3em; background-color: #ECE6CC; border: none; border-right-width: 0; box-shadow: 0 0.22em 0.9em 0.1em #805216; }   margin-top: 14px; }
 * 1) mw-content-container {
 * 1) mw-content {
 * 1) mw-content-wrapper {

/* Header changes */ .mw-body h1.firstHeading { margin: 0.25em 0 0.5em; border-bottom: 2px dashed #805216; font-family: 'Varela Round',sans-serif; font-size: 1.8em; color: #805216; } .mw-body h2 { font-family: 'Open Sans',sans-serif; line-height: 1.125; } .mw-body h3, .mw-body h4, .mw-body h5, .mw-body h6, .mw-body dt { font-weight: bold; font-family: 'Open Sans',sans-serif; line-height: 1.125; }   background: #93ceae; } .color-middle, .color-left, .color-right { background-color: #beffdc !important; } /* Sidebar changes */ background:#fff1d7; color:#524434; display: contents; }   list-style: none; margin: 0 auto; padding: 0; width: 12em; } .mw-portlet-body a { text-align: center; padding: 0.25em 0; display: block; color: #000; cursor: pointer !important; font-family: 'Varela Round', sans-serif; }	font-family: 'Varela Round',sans-serif; }   border:none !important; border-radius: 2em; background-color: #ECE6CC; }   font-weight: normal; font-size: 1em; margin: 0.25em 0 0.75em 0; padding-bottom: 0.15em; border-bottom: 2px dashed #805216; font-family: 'Varela Round',sans-serif; line-height: 1em; }	padding: 0.25em 0; background-color: #DAC783; border-radius: 10em; margin-bottom: 5px; box-shadow: rgb(162, 144, 115) 0px 3px 0px 0px; }   background: #FFF1C3; transition: background-color 0.3s cubic-bezier(0.25,0.8,0.5,1),opacity 0.4s cubic-bezier(0.25,0.8,0.5,1); }   background: #B3A163; transition: background-color 0.3s cubic-bezier(0.25,0.8,0.5,1),opacity 0.4s cubic-bezier(0.25,0.8,0.5,1); } font-weight:normal; font-size:1em; background-color: #805216; justify-content: center; display: flex; padding: 0.5em 0; text-align: center; transition: color 0.3s,background-color 0.3s; box-sizing: inherit; color: #fff !important; margin: 0; border-radius: 10em; font-family: 'Varela Round', sans-serif; margin-top:1em; box-shadow: rgb(89, 75, 62) 0px 3px 0px 0px; margin-bottom: 5px; border-bottom: none; } /* Prefernces & button stylizing */ .mw-prefs-buttons { background-color: #ECE6CC; } .oo-ui-buttonElement-framed.oo-ui-labelElement > .oo-ui-buttonElement-button, button { padding: 0.35em 1em; border-radius: 5em; font-family: 'Varela Round', sans-serif !important; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { color: #fff; background-color: #03B2AB; border-color: #03B2AB; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button { color: #fff; background-color: #216663; border-color: #216663; box-shadow: none; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { background-color: #0D9B95; border-color: #0D9B95; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus { border-color: #03B2AB; box-shadow: inset 0 0 0 1px #03B2AB,inset 0 0 0 2px #fff; outline: 1px solid transparent; } .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { background-color: #f5f7e1; color: #f49800; } .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { background-color: #fff; color: #f49800; border-radius: 5em; } .oo-ui-tabSelectWidget-framed { background-color: #f5f7e1; font-family: 'Varela Round', sans-serif !important; border-radius: 5em; } .oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label { line-height: 1.42857143em; font-family: 'Varela Round', sans-serif !important; } .mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed, .mw-prefs-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout { border-color: transparent; } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: #FF4548; background-color: #D4CA82; border-radius: 5em; } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { color: #FF4548; background-color: #FFFDED; }
 * 1) mw-header-container {
 * 1) mw-site-navigation .sidebar-chunk,
 * 2) mw-related-navigation .sidebar-chunk {
 * 1) mw-site-navigation .sidebar-chunk ul, #mw-site-navigation .sidebar-chunk li, #mw-related-navigation .sidebar-chunk ul, #mw-related-navigation .sidebar-chunk li, #p-personal .mw-portlet-body li {
 * 1) personal h2 span {
 * 1) personal .dropdown {
 * 1) personal .dropdown h3 {
 * 1) mw-site-navigation .sidebar-chunk li, #mw-related-navigation .sidebar-chunk .mw-portlet-body li, #p-personal .mw-portlet-body li {
 * 1) mw-site-navigation .sidebar-chunk li:hover, #mw-related-navigation .sidebar-chunk .mw-portlet-body li:hover, #p-personal .mw-portlet-body li:hover {
 * 1) mw-site-navigation .sidebar-chunk li:active, #mw-related-navigation .sidebar-chunk .mw-portlet-body li:active, #p-personal .mw-portlet-body li:active {
 * 1) mw-site-navigation .sidebar-chunk h3, #mw-related-navigation .sidebar-chunk h3 {

/* Search bar changes */ background-color: #fdfbe6; border-radius: 2em; border: none; }   color: #7c7056; border-radius: 2em; font-family: 'Varela Round',sans-serif; border: none; }
 * 1) simpleSearch {
 * 1) searchInput {

/* Screen width changes */ @media screen and (min-width:1099px) { #mw-content { border-radius: 2em; } } @media screen and (max-width:1099px) and (min-width:850px) { #mw-site-navigation .sidebar-inner, #mw-wrapper .dropdown-active .sidebar-inner { border-width: 1px 1px 0.2em; word-wrap: break-word; font-size: 0.95em; background: #ECE6CC; box-shadow: 0 2px 3px 1px rgba(0,0,0,0.05); position: absolute; min-width: 9.153em; top: 3.25em; z-index: 100; border-radius: 1em; }	#mw-site-navigation h2, #mw-related-navigation h2, #mw-site-navigation h2, #mw-related-navigation h2 { font-family: 'Varela Round', sans-serif !important; } } /* Mobile sidebar */ @media screen and (max-width:850px) { .sidebar-inner, .dropdown { border-width: 1px 1px 0.2em; line-height: 0.5; word-wrap: break-word; font-size: 0.95em; background: #ECE6CC; box-shadow: 0 2px 3px 1px rgba(0,0,0,0.05); position: absolute; padding: 2em 2.5em 1em; min-width: 9.153em; max-width: 80%; top: 3.25em; right: 0; overflow: visible; z-index: 100; border-radius: 1em; margin: auto; left: 0px; right: 0px; width: 100%; }	#mw-site-navigation .sidebar-chunk ul, #mw-site-navigation .sidebar-chunk li, #mw-related-navigation .sidebar-chunk ul, #mw-related-navigation .sidebar-chunk li, #p-personal .mw-portlet-body li { list-style: none; margin: 0 auto; width: auto; padding: 0.5em 0; width: auto; margin-bottom: 5px; } /* Make the buttons a bit bigger on mobile */ .sidebar-inner li, .dropdown li { font-size: 20px; }	#mw-site-navigation .sidebar-chunk h3, #mw-related-navigation .sidebar-chunk h3 { font-size: 2em; } }