Template:Styles/mobile.css

/******************

THEMES



.theme-table { background-color: #eaecf0 !important; }

.mobilenav > * > tr > th { background-color: #f8f9fa; font-size: 110%; }

.mobilenav > * > tr > td { background-color: #d9eceb }

/******************

TOC / SECTION HEADERS



table h4 { font-size: 100%; padding: 0; margin: 0; }

/******************

MOBILE-ONLY

@media screen and (min-width: 600px) { .mobileresponsive, .mobiletable, .mobilecell { display: none; }	.desktoptable { display: table; }	.desktopgrid { display: grid; } }

@media screen and (max-width: 600px) { .desktoptable, .desktopgrid, .desktopcell { display: none; }	.mobileresponsive { display: block; }	.mobiletable { display: table; }	.mobilecell { display: table-cell; } }

@media screen and (max-width: 600px) { ul { margin: 0.2em 0.5em !important; padding-left: 0.4em; line-height: 1.4em; }	li { margin-bottom: 0.3em; }	.eventtable { text-align: right; margin-right: 10%; margin-top: -1.5em; padding-right: 1em; } }

@media screen and (min-width: 600px) { ul { margin: 0.1em 0 0 1.2em; }	.eventtable { text-align: right; } }

/******************

PADDING/MARGINS



/* Table padding */ table.padding-1em > tr > td, table.padding-1em > * > tr > td { padding: 0.7em 1em; }

table.padding-07em > tr > td, table.padding-07em > * > tr > td { padding: 0.5em 0.7em; }

table.padding-05em > tr > td, table.padding-05em > * > tr > td { padding: 0.3em 0.5em; }

table.padding-03em > tr > td, table.padding-03em > * > tr > td { padding: 0.1em 0.3em; }

/* Table Heading */ table.header-1em > tr > th, table.header-1em > * > tr > th { padding: 0.7em 1em; }

table.header-07em > tr > th, table.header-07em > * > tr > th { padding: 0.5em 0.7em; }

table.header-05em > tr > th, table.header-05em > * > tr > th { padding: 0.3em 0.5em; }

/* Floats */

.floatleft, .floatright { margin: 0 0.3em 0 0; }

/******************

BREAKS



hr { margin: 0.5em; height: 0.5px; background-color: darkgrey; }

/******************

TABS (ACCORDION)



.tabs.tabs-tabbox { max-width: 100% !important; float: none !important; }

.tabs-header { margin: 0 !important; border: 0 !important; text-align: center; }

.tabs-container { border: 0; }

.tabs-container div { width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; vertical-align: middle; }

.mobilecollapse-black .collapsible-heading { background-color: #BCBCBC !important; } .mobilecollapse-purple .collapsible-heading { background-color: #BF94E4 !important; } .mobilecollapse-blue .collapsible-heading { background-color: #7CB9EA !important; } .mobilecollapse-green .collapsible-heading { background-color: #75D986 !important; } .mobilecollapse-yellow .collapsible-heading { background-color: #F3E86C !important; } .mobilecollapse-orange .collapsible-heading { background-color: #F3BA6C !important; } .mobilecollapse-red .collapsible-heading { background-color: #F77377 !important; } .mobilecollapse-pink .collapsible-heading { background-color: #F99CD1 !important; } .mobilecollapse-light .collapsible-heading { background-color: #CFDBEB !important; }