MediaWiki:Common.css

From UBC Wiki

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* UBC HEADER styles */

#ubc7-logo, #ubc7-apom a, #ubc7-wordmark-block, #ubc7-global-utility button span, #ubc7-global-utility-no-script, #ubc7-okanagan-campus, #ubc7-vancouver-campus, #ubc7-signature a, .ubc7-carousel-control, #ubc7-ql-apom span, #ubc7-ql-mobile span, .ubc7-arrow {
    background-image: url(https://cdn.ubc.ca/clf/7.0.4/img/ubc7-clf-sprite-blue.png);
    background-repeat: no-repeat;
}

 .row-fluid [class*="span"] {
     display: block;
     float: left;
     width: 100%;
     min-height: 30px;
     margin-left: 2.127659574468085%;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
}
 .row-fluid:after {
     clear: both;
}
 .row-fluid:before, .row-fluid:after {
     display: table;
     line-height: 0;
     content: "";
}
 [class*="span"] {
     float: left;
     min-height: 1px;
     margin-left: 20px;
}
 .row-fluid [class*="span"]:first-child {
     margin-left: 0;
}
 .row-fluid .span1 {
     width: 6.382978723404255%;
     overflow: hidden;
}
 .row-fluid .span2 {
     width: 14.893617021276595%;
}
 .row-fluid .span9 {
     width: 74.46808510638297%;
     margin: 0 !important;
}
 div#mw-head, div#mw-panel {
     top: 148px !important;
}
 #ubc7-header {
     border-top: 3px solid #002145;
     background-color: #fff;
     width: 100%;
}
 #ubc7-logo {
     background-position: 25px -115px;
     background-repeat: no-repeat;
     margin: 0 auto;
     min-width: 95px;
}
 #ubc7-logo a, #ubc7-apom a, #ubc7-wordmark a, #ubc7-signature a, .ubc7-campus, .hide-text {
     overflow: hidden;
     text-indent: 200%;
     white-space: nowrap;
}
 #ubc7-header .span1, #ubc7-header .span9 {
     height: 95px;
}
 #ubc7-header .span1 {
     width: 95px;
}
 #ubc7-logo, #ubc7-apom, #ubc7-wordmark {
     height: 100%;
}
 #ubc7-logo a, #ubc7-apom a, #ubc7-wordmark a {
     display: block;
     height: 100%;
     width: 100%;
}
 #ubc7-apom a {
     background-position: -73px -115px;
     border-left: 1px solid #d7e0e7;
     min-width: 160px;
}
 #ubc7-wordmark-block {
     background-position: -72px -115px;
     border-left: 1px solid #d7e0e7;
     width: 91.48936170212765%;
     max-width: 800px;
     position: relative;
}
 #ubc7-global-utility {
     display: none;
}
 #ubc7-unit {
     background: #002145;
     height: 60px;
     box-shadow: inset 0 -10px 10px -10px #222;
     -moz-box-shadow: inset 0 -10px 10px -10px #222;
     -webkit-box-shadow: inset 0 -10px 10px -10px #222;
     height: 60px;
     overflow: hidden;
     width: 100%;
     font-family: Arial,Sans-Serif!important;
}
 #ubc7-unit-name a {
     display: block;
     line-height: 60px;
     padding-left: 15px;
}
 #ubc7-unit-name a, #ubc7-unit-name a:hover {
     color: #fff!important;
     text-decoration: none!important;
     text-shadow: 1px 1px #222;
}
 li#pt-login a {
     background-image: url(images/e/e3/Cwl_button.png);
     width: 83px;
     display: inline-block;
     height: 35px;
     text-indent: -9999px;
     overflow: hidden;
}
 #pt-userpage, #pt-anonuserpage {
     background-position: left .45rem;
}
 #p-personal li {
     line-height: 2.6;
}
 @media only screen and (-webkit-min-device-pixel-ratio: 1.5), not all, not all, not all {
     div#p-logo a {
         background-image: url(/images/d/d5/Ubcwiki_logo_2x.png);
         background-size: 115px 128px;
    }
} 
 @media screen and (min-width: 767px) {
     #ubc7-unit-name {
         font-size: 20px;
    }
     div#mw-head, div#mw-panel {
         top: 158px !important;
    }
}
 @media screen and (min-width: 1200px) {
     div#mw-panel, div#mw-head {
         top: 178px !important;
    }
     #ubc7-header, #ubc7-header .span1, #ubc7-header .span9 {
         height: 115px;
    }
     #ubc7-header .span1 {
         margin: 0;
         width: 115px;
    }
     #ubc7-logo {
         background-position: 46px 14px;
        margin-left: -15px;
        
        min-width: 115px;
         
    }
     #ubc7-apom a {
         background-position: -84px 14px;
         min-width: 200px;
    }
     #ubc7-wordmark-block {
         background-position: -83px 14px;
         width: 91.45299145299145%;
    }
     #ubc7-unit-name {
         font-size: 20px;
    }
}
 @media (min-width: 1200px) {
     .row-fluid [class*="span"] {
         margin-left: 2.564102564102564%;
    }
     .row-fluid .span1 {
         width: 5.982905982905983%;
    }
     .row-fluid [class*="span"] {
         display: block;
         float: left;
         width: 100%;
         min-height: 30px;
         margin-left: 2.564102564102564%;
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
    }
     .row-fluid .span9 {
         width: 74.35897435897436%;
    }
}
 @media screen and (max-width: 979px) {
     #ubc7-header .span1 {
         display: none;
    }
     #ubc7-wordmark-block {
         background-position: 20px -205px;
         border-left: 0;
         margin-left: 0;
    }
}
 @media screen and (max-width: 767px) {
     #ubc7-wordmark-block {
         background-position: 20px -276px;
    }
     #ubc7-unit {
         height: 50px;
    }
     #ubc7-unit-name {
         font-size: 18px;
    }
     #ubc7-unit-name a {
         line-height: 50px;
    }
}

@media only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: '3/2'), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
     #ubc7-logo, #ubc7-apom a, #ubc7-wordmark-block, #ubc7-global-utility button span, #ubc7-global-utility-no-script, #ubc7-okanagan-campus, #ubc7-vancouver-campus, #ubc7-signature a, .ubc7-carousel-control, #ubc7-ql-apom span, #ubc7-ql-mobile span, .ubc7-arrow {
         background-image: url(https://cdn.ubc.ca/clf/7.0.4/img/ubc7-clf-sprite-blue-2x.png)!important;
         background-size: 1500px!important;
    }
}
/* end UBC HEADER styles 
/* Remove Main Page title */
 body.page-Main_Page h1.firstHeading {
     display:none;
}
/* Photo of the day */
 #mp-pod #RSSMainBody {
     margin: auto;
}
/**********************************************************************/
/* Stuff below are copied from EN wikipedia. Should clean it up ASAP. */
/* Main page fixes */
 #interwiki-completelist {
     font-weight: bold;
}
 body.page-Main_Page #ca-delete {
     display: none !important;
}
 body.page-Main_Page #mp-topbanner {
     clear: both;
}
/* Edit window toolbar */
 #toolbar {
     height: 22px;
     margin-bottom: 6px;
}
/* Margins for <ol> and <ul> */
 #content ol, #content ul, #mw_content ol, #mw_content ul {
     margin-bottom: 0.5em;
}
/* Make the list of references in [[Template:Reflist]] smaller */
 .references-small {
     font-size: 90%;
}
/* VALIDATOR NOTICE: the following is correct, but the W3C validator doesn't accept it */
/* -moz-* is a vendor-specific extension (CSS 2.1 4.1.2.1) */
/* column-count is from the CSS3 module "CSS Multi-column Layout" */
/* Please ignore any validator errors caused by these two lines */
 .references-2column {
     font-size: 90%;
     -moz-column-count: 2;
     column-count: 2;
}
/* Highlight clicked reference in blue to help navigation */
 ol.references > li:target, sup.reference:target, cite:target {
     background-color: #DEF;
}
/* Ensure refs in table headers and the like aren't bold or italic */
 sup.reference {
     font-weight: normal;
     font-style: normal;
}
/* Styling for citations */
 cite {
     font-style: normal;
     word-wrap: break-word;
}
/* For linked citation numbers and document IDs, where the number need not be shown on a screen or a handheld, but should be included in the printed version */
 @media screen, handheld, projection {
     cite *.printonly {
         display: none;
    }
}
/* wikitable/prettytable class for skinning normal tables */
 table.wikitable, table.prettytable {
     margin: 1em 1em 1em 0;
     background: #f9f9f9;
     border: 1px #aaa solid;
     border-collapse: collapse;
}
 .wikitable th, .wikitable td, .prettytable th, .prettytable td {
     border: 1px #aaa solid;
     padding: 0.2em;
}
 .wikitable th, .prettytable th {
     background: #f2f2f2;
     text-align: center;
}
 .wikitable caption, .prettytable caption {
     font-weight: bold;
}
/* Default skin for navigation boxes */
 table.navbox {
    /* Navbox container style */
     border: 1px solid #aaa;
     width: 100%;
     margin: auto;
     clear: both;
     font-size: 88%;
     text-align: center;
     padding: 1px;
}
 table.navbox + table.navbox {
    /* Single pixel border between adjacent navboxes */
     margin-top: -1px;
    /* (doesn't work for IE6, but that's okay) */
}
 .navbox-title, .navbox-abovebelow, table.navbox th {
     text-align: center;
    /* Title and above/below styles */
     padding-left: 1em;
     padding-right: 1em;
}
 .navbox-group {
    /* Group style */
     white-space: nowrap;
     text-align: right;
     font-weight: bold;
     padding-left: 1em;
     padding-right: 1em;
}
 .navbox, .navbox-subgroup {
     background: #fdfdfd;
    /* Background color */
}
 .navbox-list {
     border-color: #fdfdfd;
    /* Must match background color */
}
 .navbox-title, table.navbox th {
     background: #ccccff;
    /* Level 1 color */
}
 .navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title {
     background: #ddddff;
    /* Level 2 color */
}
 .navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
     background: #e6e6ff;
    /* Level 3 color */
}
 .navbox-even {
     background: #f7f7f7;
    /* Even row striping */
}
 .navbox-odd {
     background: transparent;
    /* Odd row striping */
}
 .collapseButton {
    /* 'show'/'hide' buttons created dynamically */
     float: right;
    /* by the CollapsibleTables javascript in */
     font-weight: normal;
    /* [[MediaWiki:Common.js]]are styled here */
     text-align: right;
    /* so they can be customised. */
     width: auto;
}
 .navbox .collapseButton {
    /* In navboxes, the show/hide button balances */
     width: 6em;
    /* the vde links from [[Template:Tnavbar]], */
}
/* so they need to be the same width. */
/* Infobox template style */
 .infobox {
     border: 1px solid #aaa;
     background-color: #f9f9f9;
     color: black;
     margin: 0.5em 0 0.5em 1em;
     padding: 0.2em;
     float: right;
     clear: right;
}
 .infobox td, .infobox th {
     vertical-align: top;
}
 .infobox caption {
     font-size: larger;
}
 .infobox.bordered {
     border-collapse: collapse;
}
 .infobox.bordered td, .infobox.bordered th {
     border: 1px solid #aaa;
}
 .infobox.bordered .borderless td, .infobox.bordered .borderless th {
     border: 0;
}
 .infobox.sisterproject {
     width: 20em;
     font-size: 90%;
}
 .infobox.standard-talk {
     border: 1px solid #c0c090;
     background-color: #f8eaba;
}
 .infobox.standard-talk.bordered td, .infobox.standard-talk.bordered th {
     border: 1px solid #c0c090;
}
/* styles for bordered infobox with merged rows */
 .infobox.bordered .mergedtoprow td, .infobox.bordered .mergedtoprow th {
     border: 0;
     border-top: 1px solid #aaa;
     border-right: 1px solid #aaa;
}
 .infobox.bordered .mergedrow td, .infobox.bordered .mergedrow th {
     border: 0;
     border-right: 1px solid #aaa;
}
/* Styles for geography infoboxes, eg countries, country subdivisions, cities, etc. */
 .infobox.geography {
     text-align: left;
     border-collapse: collapse;
     line-height: 1.2em;
     font-size: 90%;
}
 .infobox.geography td, .infobox.geography th {
     border-top: solid 1px #aaa;
     padding: 0.4em 0.6em 0.4em 0.6em;
}
 .infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th {
     border-top: solid 1px #aaa;
     padding: 0.4em 0.6em 0.2em 0.6em;
}
 .infobox.geography .mergedrow td, .infobox.geography .mergedrow th {
     border: 0;
     padding: 0 0.6em 0.2em 0.6em;
}
 .infobox.geography .mergedbottomrow td, .infobox.geography .mergedbottomrow th {
     border-top: 0;
     border-bottom: solid 1px #aaa;
     padding: 0 0.6em 0.4em 0.6em;
}
 .infobox.geography .maptable td, .infobox.geography .maptable th {
     border: 0;
     padding: 0;
}
/* Makes redirects appear in italics in categories and on [[Special:Allpages]] */
 .redirect-in-category, .allpagesredirect {
     font-style: italic;
}
/* Icons for medialist templates [[Template:Listen]], [[Template:Multi-listen_start]], [[Template:Video]], [[Template:Multi-video_start]] */
 div.listenlist {
     background: url("http://upload.wikimedia.org/wikipedia/commons/thumb/a/a6/Gnome-speakernotes.png/30px-Gnome-speakernotes.png");
     padding-left: 40px;
}
/* Style rules for media list templates */
 div.medialist {
     min-height: 50px;
     margin: 1em;
     background-position: top left;
     background-repeat: no-repeat;
}
 div.medialist ul {
     list-style-type: none;
     list-style-image: none;
     margin: 0;
}
 div.medialist ul li {
     padding-bottom: 0.5em;
}
 div.medialist ul li li {
     font-size: 91%;
     padding-bottom: 0;
}
/* Change the external link icon to an Adobe icon for all PDF files in browsers that support these CSS selectors, like Mozilla and Opera */
 #content a[href$=".pdf"].external, #content a[href*=".pdf?"].external, #content a[href*=".pdf#"].external, #content a[href$=".PDF"].external, #content a[href*=".PDF?"].external, #content a[href*=".PDF#"].external, #mw_content a[href$=".pdf"].external, #mw_content a[href*=".pdf?"].external, #mw_content a[href*=".pdf#"].external, #mw_content a[href$=".PDF"].external, #mw_content a[href*=".PDF?"].external, #mw_content a[href*=".PDF#"].external {
     background: url("http://upload.wikimedia.org/wikipedia/commons/thumb/2/23/Icons-mini-file_acrobat.gif/15px-Icons-mini-file_acrobat.gif") center right no-repeat;
     padding-right: 16px;
}
/* Change the external link icon to an Adobe icon anywhere the PDFlink class is used (notably Template:PDFlink). This works in IE, unlike the above. */
 #content span.PDFlink a, #mw_content span.PDFlink a {
     background: url("http://upload.wikimedia.org/wikipedia/commons/thumb/2/23/Icons-mini-file_acrobat.gif/15px-Icons-mini-file_acrobat.gif") center right no-repeat;
     padding-right: 17px;
}
/* Remove link styling. Already defined in monobook and modern, but not defined in the other skins. Bug 18708 */
 #content .plainlinks a, #mw_content .plainlinks a {
     background: none !important;
     padding: 0 !important;

}
/*Used only for MER Wiki*/
.plainlink .android a{
color: white; 
}
/* Content in columns with CSS instead of tables [[Template:Columns]] */
 div.columns-2 div.column {
     float: left;
     width: 50%;
     min-width: 300px;
}
 div.columns-3 div.column {
     float: left;
     width: 33.3%;
     min-width: 200px;
}
 div.columns-4 div.column {
     float: left;
     width: 25%;
     min-width: 150px;
}
 div.columns-5 div.column {
     float: left;
     width: 20%;
     min-width: 120px;
}
/* Make sure that "external references" from templates like [[Template:Ref]] do not get URL expansion, not even when printed. The anchor itself has class "external autonumber" and the url expansion is inserted when printing (see [http://en.wikipedia.org/skins-1.5/common/commonPrint.css]) using the ":after" pseudo-element. */

 .nourlexpansion a.external.text:after, .nourlexpansion a.external.autonumber:after {
     display: none !important;
}
/* Messagebox templates */
 .messagebox {
     border: 1px solid #aaa;
     background-color: #f9f9f9;
     width: 80%;
     margin: 0 auto 1em auto;
     padding: .2em;
}
 .messagebox.merge {
     border: 1px solid #c0b8cc;
     background-color: #f0e5ff;
     text-align: center;
}
 .messagebox.cleanup {
     border: 1px solid #9f9fff;
     background-color: #efefff;
     text-align: center;
}
 .messagebox.standard-talk {
     border: 1px solid #c0c090;
     background-color: #f8eaba;
     margin: 4px auto;
}
/* For old WikiProject banners inside banner shells. */
 .mbox-inside .standard-talk, .messagebox.nested-talk {
     border: 1px solid #c0c090;
     background-color: #f8eaba;
     width: 100%;
     margin: 2px 0;
     padding: 2px;
}
 .messagebox.small {
     width: 238px;
     font-size: 85%;
     float: right;
     clear: both;
     margin: 0 0 1em 1em;
     line-height: 1.25em;
}
 .messagebox.small-talk {
     width: 238px;
     font-size: 85%;
     float: right;
     clear: both;
     margin: 0 0 1em 1em;
     line-height: 1.25em;
     background: #F8EABA;
}
/* Cell sizes for ambox/tmbox/imbox/cmbox/ombox/fmbox/dmbox message boxes */
 th.mbox-text, td.mbox-text {
    /* The message body cell(s) */
     border: none;
     padding: 0.25em 0.9em;
    /* 0.9em left/right */
     width: 100%;
    /* Make all mboxes the same width regardless of text length */
}
 td.mbox-image {
    /* The left image cell */
     border: none;
     padding: 2px 0 2px 0.9em;
    /* 0.9em left, 0px right */
     text-align: center;
}
 td.mbox-imageright {
    /* The right image cell */
     border: none;
     padding: 2px 0.9em 2px 0;
    /* 0px left, 0.9em right */
     text-align: center;
}
 td.mbox-empty-cell {
    /* An empty narrow cell */
     border: none;
     padding: 0px;
     width: 1px;
}
/* Article message box styles */
 table.ambox {
     margin: 0px 10%;
    /* 10% = Will not overlap with other elements */
     border: 1px solid #aaa;
     border-left: 10px solid #1e90ff;
    /* Default "notice" blue */
     background: #fbfbfb;
}
 table.ambox + table.ambox {
    /* Single border between stacked boxes. */
     margin-top: -1px;
}
 .ambox th.mbox-text, .ambox td.mbox-text {
    /* The message body cell(s) */
     padding: 0.25em 0.5em;
    /* 0.5em left/right */
}
 .ambox td.mbox-image {
    /* The left image cell */
     padding: 2px 0 2px 0.5em;
    /* 0.5em left, 0px right */
}
 .ambox td.mbox-imageright {
    /* The right image cell */
     padding: 2px 0.5em 2px 0;
    /* 0px left, 0.5em right */
}
 table.ambox-notice {
     border-left: 10px solid #1e90ff;
    /* Blue */
}
 table.ambox-speedy {
     border-left: 10px solid #b22222;
    /* Red */
     background: #fee;
    /* Pink */
}
 table.ambox-delete {
     border-left: 10px solid #b22222;
    /* Red */
}
 table.ambox-content {
     border-left: 10px solid #f28500;
    /* Orange */
}
 table.ambox-style {
     border-left: 10px solid #f4c430;
    /* Yellow */
}
 table.ambox-move {
     border-left: 10px solid #9932cc;
    /* Purple */
}
 table.ambox-protection {
     border-left: 10px solid #bba;
    /* Gray-gold */
}
/* Image message box styles */
 table.imbox {
     margin: 4px 10%;
     border-collapse: collapse;
     border: 3px solid #1e90ff;
    /* Default "notice" blue */
     background: #fbfbfb;
}
 .imbox .mbox-text .imbox {
    /* For imboxes inside imbox-text cells. */
     margin: 0 -0.5em;
    /* 0.9 - 0.5 = 0.4em left/right. */
}
 .mbox-inside .imbox {
    /* For imboxes inside other templates. */
     margin: 4px;
}
 table.imbox-notice {
     border: 3px solid #1e90ff;
    /* Blue */
}
 table.imbox-speedy {
     border: 3px solid #b22222;
    /* Red */
     background: #fee;
    /* Pink */
}
 table.imbox-delete {
     border: 3px solid #b22222;
    /* Red */
}
 table.imbox-content {
     border: 3px solid #f28500;
    /* Orange */
}
 table.imbox-style {
     border: 3px solid #f4c430;
    /* Yellow */
}
 table.imbox-move {
     border: 3px solid #9932cc;
    /* Purple */
}
 table.imbox-protection {
     border: 3px solid #bba;
    /* Gray-gold */
}
 table.imbox-license {
     border: 3px solid #88a;
    /* Dark gray */
     background: #f7f8ff;
    /* Light gray */
}
 table.imbox-featured {
     border: 3px solid #cba135;
    /* Brown-gold */
}
/* Category message box styles */
 table.cmbox {
     margin: 3px 10%;
     border-collapse: collapse;
     border: 1px solid #aaa;
     background: #DFE8FF;
    /* Default "notice" blue */
}
 table.cmbox-notice {
     background: #D8E8FF;
    /* Blue */
}
 table.cmbox-speedy {
     margin-top: 4px;
     margin-bottom: 4px;
     border: 4px solid #b22222;
    /* Red */
     background: #FFDBDB;
    /* Pink */
}
 table.cmbox-delete {
     background: #FFDBDB;
    /* Red */
}
 table.cmbox-content {
     background: #FFE7CE;
    /* Orange */
}
 table.cmbox-style {
     background: #FFF9DB;
    /* Yellow */
}
 table.cmbox-move {
     background: #E4D8FF;
    /* Purple */
}
 table.cmbox-protection {
     background: #EFEFE1;
    /* Gray-gold */
}
/* Other pages message box styles */
 table.ombox {
     margin: 4px 10%;
     border-collapse: collapse;
     border: 1px solid #aaa;
    /* Default "notice" gray */
     background: #f9f9f9;
}
 table.ombox-notice {
     border: 1px solid #aaa;
    /* Gray */
}
 table.ombox-speedy {
     border: 2px solid #b22222;
    /* Red */
     background: #fee;
    /* Pink */
}
 table.ombox-delete {
     border: 2px solid #b22222;
    /* Red */
}
 table.ombox-content {
     border: 1px solid #f28500;
    /* Orange */
}
 table.ombox-style {
     border: 1px solid #f4c430;
    /* Yellow */
}
 table.ombox-move {
     border: 1px solid #9932cc;
    /* Purple */
}
 table.ombox-protection {
     border: 2px solid #bba;
    /* Gray-gold */
}
/* Talk page message box styles */
 table.tmbox {
     margin: 4px 10%;
     border-collapse: collapse;
     border: 1px solid #c0c090;
    /* Default "notice" gray-brown */
     background: #f8eaba;
}
 .mediawiki .mbox-inside .tmbox {
    /* For tmboxes inside other templates. The "mediawiki" */
     margin: 2px 0;
    /* class ensures that this declaration overrides other */
     width: 100%;
    /* For Safari and Opera */
    /* styles (including mbox-small above) */
}
 .mbox-inside .tmbox.mbox-small {
    /* "small" tmboxes should not be small when */
     line-height: 1.5em;
    /* also "nested", so reset styles that are */
     font-size: 100%;
    /* set in "mbox-small" above. */
}
 table.tmbox-speedy {
     border: 2px solid #b22222;
    /* Red */
     background: #fee;
    /* Pink */
}
 table.tmbox-delete {
     border: 2px solid #b22222;
    /* Red */
}
 table.tmbox-content {
     border: 2px solid #f28500;
    /* Orange */
}
 table.tmbox-style {
     border: 2px solid #f4c430;
    /* Yellow */
}
 table.tmbox-move {
     border: 2px solid #9932cc;
    /* Purple */
}
 table.tmbox-protection, table.tmbox-notice {
     border: 1px solid #c0c090;
    /* Gray-brown */
}
/* Disambig and set index box styles */
 table.dmbox {
     clear: both;
     margin: 0.9em 1em;
     border-top: 1px solid #ccc;
     border-bottom: 1px solid #ccc;
     background: transparent;
}
/* Footer and header message box styles */
 table.fmbox {
     clear: both;
     margin: 0.2em 0;
     width: 100%;
     border: 1px solid #aaa;
     background: #f9f9f9;
    /* Default "system" gray */
}
 table.fmbox-system {
     background: #f9f9f9;
}
 table.fmbox-warning {
     border: 1px solid #bb7070;
    /* Dark pink */
     background: #ffdbdb;
    /* Pink */
}
 table.fmbox-editnotice {
     background: transparent;
}
/* Div based "warning" style fmbox messages. */
 div.mw-warning-with-logexcerpt, div.mw-lag-warn-high, div.mw-cascadeprotectedwarning, div#mw-protect-cascadeon {
     clear: both;
     margin: 0.2em 0;
     border: 1px solid #bb7070;
     background: #ffdbdb;
     padding: 0.25em 0.9em;
}
/* Div based "system" style fmbox messages. Used in [[MediaWiki:Noarticletext]] and [[MediaWiki:Readonly lag]]. */
 div.mw-lag-warn-normal, div.noarticletext, div.fmbox-system {
     clear: both;
     margin: 0.2em 0;
     border: 1px solid #aaa;
     background: #f9f9f9;
     padding: 0.25em 0.9em;
}
/* These mbox-small classes must be placed after all other ambox/tmbox/ombox etc classes. "body.mediawiki" is so they override "table.ambox + table.ambox" above. */
 body.mediawiki table.mbox-small {
    /* For the "small=yes" option. */
     clear: right;
     float: right;
     margin: 4px 0 4px 1em;
     width: 238px;
     font-size: 88%;
     line-height: 1.25em;
}
 body.mediawiki table.mbox-small-left {
    /* For the "small=left" option. */
     margin: 4px 1em 4px 0;
     width: 238px;
     border-collapse: collapse;
     font-size: 88%;
     line-height: 1.25em;
}
/* Support for Template:IPA, Template:Unicode and Template:Polytonic. The second declarations reset the styles for all browsers except IE6, which chokes on the empty comment tags. Please copy any changes to [[Template:IPA fonts]] and [[Template:Unicode fonts]]. */
 .IPA {
     font-family: "Charis SIL", "Doulos SIL", Gentium, GentiumAlt, "DejaVu Sans", Code2000, "TITUS Cyberbit Basic", "Arial Unicode MS", "Lucida Sans Unicode", "Chrysanthi Unicode";
     font-family 
    /**/
     : inherit;
}
 .Unicode {
     font-family: Code2000, Code2001, "Free Serif", "TITUS Cyberbit Basic", "Doulos SIL", "Chrysanthi Unicode", "Bitstream Cyberbit", "Bitstream CyberBase", Thryomanes, Gentium, GentiumAlt, "Lucida Grande", "Free Sans", "Arial Unicode MS", "Microsoft Sans Serif", "Lucida Sans Unicode";
     font-family 
    /**/
     : inherit;
}
 .latinx {
     font-family: Code2000, Code2001, "TITUS Cyberbit Basic", "Microsoft Sans Serif";
     font-family 
    /**/
     : inherit;
}
 .polytonic {
     font-family: "Athena Unicode", Gentium, "Palatino Linotype", "Arial Unicode MS", "Lucida Sans Unicode", "Lucida Grande", Code2000;
     font-family 
    /**/
     : inherit;
}
 #wpSave {
     font-weight: bold;
}
/* class hiddenStructure is defunct. See [[Wikipedia:hiddenStructure]] */
 .hiddenStructure {
     display: inline ! important;
     color: #f00;
     background-color: #0f0;
}
/* suppress missing interwiki image links where #ifexist cannot be used due to high number of requests see .hidden-redlink on http://meta.wikimedia.org/wiki/MediaWiki:Common.css */
 .check-icon a.new {
     display: none;
     speak: none;
}
/* Removes underlines from links */
 .nounderlines a {
     text-decoration: none;
}
/* Remove underline from IPA links */
 .IPA a:link, .IPA a:visited {
     text-decoration: none;
}
/* Standard Navigationsleisten, aka box hiding thingy from .de. Documentation at [[Wikipedia:NavFrame]]. */
 div.NavFrame {
     margin: 0;
     padding: 4px;
     border: 1px solid #aaa;
     text-align: center;
     border-collapse: collapse;
     font-size: 95%;
}
 div.NavFrame + div.NavFrame {
     border-top-style: none;
     border-top-style: hidden;
}
 div.NavPic {
     background-color: #fff;
     margin: 0;
     padding: 2px;
     float: left;
}
 div.NavFrame div.NavHead {
     height: 1.6em;
     font-weight: bold;
     background-color: #ccf;
     position: relative;
}
 div.NavFrame p {
     font-size: 100%;
}
 div.NavFrame div.NavContent {
     font-size: 100%;
}
 div.NavFrame div.NavContent p {
     font-size: 100%;
}
 div.NavEnd {
     margin: 0;
     padding: 0;
     line-height: 1px;
     clear: both;
}
 a.NavToggle {
     position: absolute;
     top: 0;
     right: 3px;
     font-weight: normal;
     font-size: 90%;
}
/* Coloured watchlist numbers */
 .mw-plusminus-pos {
     color: #006400;
}
/* dark green */
 .mw-plusminus-neg {
     color: #8B0000;
}
/* dark red */
/* Hatnotes and disambiguation notices */
 .rellink, .dablink {
     font-style: italic;
     padding-left: 2em;
     margin-bottom: 0.5em;
}
 .rellink i, .dablink i {
     font-style: normal;
}
/* Style for horizontal UL lists */
 .horizontal ul {
     padding: 0;
     margin: 0;
}
 .horizontal li {
     padding: 0 0.6em 0 0.4em;
     display: inline;
     border-right: 1px solid;
}
 .horizontal li:last-child {
     border-right: none;
     padding-right: 0;
}
/* Allow transcluded pages to display in lists rather than a table. Compatible in Firefox;
 incompatible in IE6. */
 .listify td {
     display: list-item;
}
 .listify tr {
     display: block;
}
 .listify table {
     display: block;
}
/* Geographical coordinates defaults. See [[Template:Coord/link]] for how these are used. The classes "geo", "longitude", and "latitude" are used by the [[Geo microformat]]. */
 .geo-default, .geo-dms, .geo-dec {
     display: inline;
}
 .geo-nondefault, .geo-multi-punct {
     display: none;
}
 .longitude, .latitude {
     white-space: nowrap;
}
/* When <div class="nonumtoc"> is used on the table of contents, the ToC will display without numbers */
 .nonumtoc .tocnumber {
     display: none;
}
 .nonumtoc #toc ul, .nonumtoc .toc ul {
     line-height: 1.5em;
     list-style: none;
     margin: .3em 0 0;
     padding: 0;
}
 .nonumtoc #toc ul ul, .nonumtoc .toc ul ul {
     margin: 0 0 0 2em;
}
/* Allow limiting of which header levels are shown in a TOC;
 <div class="toclimit-3">, for instance, will limit to showing ==headings== and ===headings=== but no further (as long as there are no =headings= on the page, which there shouldn't be according to the MoS). */
 .toclimit-2 .toclevel-2, .toclimit-3 .toclevel-3, .toclimit-4 .toclevel-4, .toclimit-5 .toclevel-5, .toclimit-6 .toclevel-6, .toclimit-7 .toclevel-7 {
     display: none;
}
/* Styling for Template:Quote */
 blockquote.templatequote {
     margin-top: 0;
}
 blockquote.templatequote div.templatequotecite {
     line-height: 1em;
     text-align: left;
     padding-left: 2em;
     margin-top: 0;
}
 blockquote.templatequote div.templatequotecite cite {
     font-size: 85%;
}
 div.user-block {
     padding: 5px;
     border: 1px solid #A9A9A9;
     background-color: #FFEFD5;
}
/* Prevent line breaks in silly places: 1) links when we don't want them to 2) HTML formulae 3) Ref tags with group names <ref group="Note"> --> "[Note 1]" */
 .nowraplinks a, span.texhtml, sup.reference a {
     white-space: nowrap;
}
/* For template documentation */
 .template-documentation {
     clear: both;
     margin: 1em 0 0 0;
     border: 1px solid #aaa;
     background-color: #ecfcf4;
     padding: 5px;
}
 .thumbinner {
     min-width: 100px;
}
/* Inline divs in ImageMaps (code borrowed from de.wiki) */
 .imagemap-inline div {
     display: inline;
}
/* Increase the height of the image upload box */
 #wpUploadDescription {
     height: 13em;
}
/* Reduce line-height for <sup> and <sub> */
 sup, sub {
     line-height: 1em;
}
/* The backgrounds for galleries. */
 #content .gallerybox div.thumb {
     background-color: #F9F9F9;
    /* Light gray padding */
}
/* Put a chequered background behind images, only visible if they have transparency */
 .gallerybox .thumb img, #file img {
     background: white url("http://upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png") repeat;
}
/* But no chequered background on articles, user pages or portals. */
 .ns-0 .gallerybox .thumb img, .ns-2 .gallerybox .thumb img, .ns-100 .gallerybox .thumb img {
     background: white;
}
/* Prevent floating boxes from overlapping any category listings, file histories, edit previews, and edit [Show changes] views */
 #mw-subcategories, #mw-pages, #mw-category-media, #filehistory, #wikiPreview, #wikiDiff {
     clear: both;
}
 table.collapsed tr.collapsable {
     display: none;
}
 .collapseButton {
    /* 'show'/'hide' buttons created dynamically by the */
     float: right;
    /* CollapsibleTables JavaScript in [[MediaWiki:Common.js]] */
     font-weight: normal;
    /* are styled here so they can be customised. */
     text-align: right;
     width: auto;
}
/* Selectively hide headers in WikiProject banners */
 .wpb .wpb-header {
     display: none;
}
 .wpbs-inner .wpb .wpb-header {
     display: block;
}
/* for IE */
 .wpbs-inner .wpb .wpb-header {
     display: table-row;
}
/* for real browsers */
 .wpbs-inner .wpb-outside {
     display: none;
}
/* hide things that should only display outside shells */
 #p-coll-create_a_book {
     display: none;
}
/* hidden */
 .hidden {
     display:none 
}

/** Notification center comment out after notification deleted
 .top-header-notify {
     height: 100px;
     padding: 10px;
     border: 1px solid #008000;
     text-align: center;
     font-size: 85%;
     background: #d2f8d2;
}
.top-header-notify h1 {
    text-transform: uppercase;
}
 div#mw-head, div#mw-panel {
     top: 270px !important;
}
 @media screen and (min-width: 767px) {
     div#mw-head, div#mw-panel {
         top: 280px !important;
    }
}
 @media screen and (min-width: 1200px) {
     div#mw-panel, div#mw-head {
         top: 300px !important;
    }
}

end Notification center comment out after notification deleted **/


/** change media upload message 
.oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-padded.oo-ui-panelLayout-expanded.oo-ui-pageLayout.oo-ui-pageLayout-active {
    color: #fff;
    text-indent: -9000px;
}

.oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-scrollable.oo-ui-panelLayout-padded.oo-ui-panelLayout-expanded.oo-ui-pageLayout.oo-ui-pageLayout-active:after {
    content: 'Please go to this url to upload: https://wiki.ubc.ca/Special:UploadWizard';
    display: block;
    color: #222!important;
    text-indent: initial;
}
/*Wrap long citation URL */

span.reference-text {
    overflow-wrap: break-word;
}


/** change media upload message end **/

/*Suppress Citation error*/
.cs1-visible-error.error.citation-comment,.error.mw-ext-cite-error{
display:none;
}

/*Wrap citation line*/

.mw-parser-output span.cs1-visible-error {
display: none;
}

.cs1-maint.citation-comment{
display:none;
}

/*legend CSS*/
/* {{pp-template}} */

.legend {
	page-break-inside: avoid;
	break-inside: avoid-column;
}

.legend-color {
	display: inline-block;
	min-width: 1.25em;
	height: 1.25em;
	line-height: 1.25;
	margin: 1px 0;
	text-align: center;
	border: 1px solid black;
	background-color: transparent;
	color: black;
}

.legend-text {/*empty for now, but part of the design!*/}

/** Notification center DELETE after notification deleted
 .top-header-notify {
     height: 100px;
     padding: 10px;
     border: 1px solid #008000;
     text-align: center;
     font-size: 85%;
     background: #d2f8d2;
}
.top-header-notify h1 {
    text-transform: uppercase;
}
 div#mw-head, div#mw-panel {
     top: 270px !important;
}
 @media screen and (min-width: 767px) {
     div#mw-head, div#mw-panel {
         top: 280px !important;
    }
}
 @media screen and (min-width: 1200px) {
     div#mw-panel, div#mw-head {
         top: 300px !important;
    }
}
end Notification center DELETE after notification deleted **/

/** Homepage **/

body .homepage-title{
  font-size: 3rem;
}

.color-navy-blue, .color-navy-blue a{
  color: #002145;
}

.wiki-clf-home :where(h1,h2,h3,h4,h5,h6) {
  color: #002145;
}

.wiki-clf-home .mw-ui-button.mw-ui-progressive:not(:disabled){
  background-color: #fff;
  color: #002145;
  border-color: #002145;
  font-weight: normal;
}

.wiki-clf-home .mw-inputbox-createbox:required:invalid ~ .mw-ui-button{
  background-color: #c8ccd1;
  border-color: #c8ccd1;
  color: #fff;
}

.wiki-clf-home .mw-ui-button.mw-ui-progressive:not(:disabled):hover {
   background-color: #002145;
   border-color: #002145;
   color:#fff;
}

.clf-section{
  padding: 1.5rem 1rem;
}

.clf-section :where(h1,h2,h3,h4,h5,h6){
  margin-top: 0 !important;
  border-bottom: 0;
}

.bg-dark {
  background: #F9F9F9;
}

.wiki-clf-home ul{
  margin-left: 0;
  padding-left: 12px;
}

.wiki-clf-home li{
  padding-left: 8px;
}

.wiki-clf-home .intro{
  display: grid;
  grid-template-columns: 130px 1fr;
  grid-gap: 30px;
}

.wiki-clf-home #home-logo img{
  width: 100%;
  height: auto;
}

#homepage-actions{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 15px;
}

@media (max-width: 1000px) {
  #homepage-actions{
    grid-template-columns: repeat(2, 1fr);
  }
}

#homepage-guides{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 30px;
}

#how-to-use-wiki{
  margin-top: 1rem;
}

.homepage-wiki-spaces-boxes{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 4rem;
}

.homepage-wiki-spaces-boxes .mw-inputbox-input {
   display: block;
   width: 100%;
   margin-bottom: 1.2rem;
}

.homepage-wiki-spaces-boxes .mw-inputbox-input+br{
   display: none;
}

.homepage-wiki-spaces-box{
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}
/** End Homepage **/