MediaWiki:Common.css
Jump to navigation
Jump to search
Note: After saving, 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: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will be applied to all skins */
@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700);
/* Typography */
/* Makes site-wide what has been implemented on a page-by-page basis */
.firstHeading {
font-weight:600;
border-bottom: none;
margin-bottom:10px;
padding-top:10px !important;
padding-left:0;
font-size: 2.4em !important;
width:100%;
margin:auto;
border-collapse:collapse;
vertical-align:top;
line-height:100%;
}
body {
font-family:'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
div#content h1, div#content h2, div#content, #firstHeading {
font-family:'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
@media screen and (min-width:750px) {
div#bodyContent {
font-size:1.05em; padding:0;
}
p {
margin-bottom:1em;
}
}
/* Main Page Banner */
.banner-image {
position: relative;
overflow: hidden;
max-width: 65em;
width: 100%;
height: auto;
margin-bottom: .6em;
text-align: center;
padding-left: 0 !important;
}
.banner-image img {
width: 100%;
height: auto;
width: auto\9;
margin:0 auto;
}
.page-2015_Main_Page #firstHeading, .page-2015_Main_Page #yearline {
display: none;
}
/* Copied from Wikivoyage for scalable-width images */
@media screen and (max-width:799px) {
.banner-image {
position: relative;
overflow: hidden;
max-width: 1125px;
width: 100%;
height: auto;
margin-bottom: .6em;
text-align: center;
padding-left: 0 !important;
}
.banner-image img {
width: 100%;
height: auto;
width: auto\9;
margin:0 auto;
}
#main-subhead {
display:none;
}
}
@media screen and (min-width:800px) {
.banner-image {
float: right;
position: relative;
overflow: hidden;
max-width: 1125px;
height: auto;
margin-bottom: .6em;
}
.banner-image img {
float: right;
width: 100%;
height: auto;
width: auto\9;
}
.banner-image-left {
float: left !important;
}
.banner-image-left img {
float: left !important;
}
.banner-image-none {
float: none !important;
}
.banner-image-none img {
float: none !important;
}
.banner-image-center {
padding-left: none !important;
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
}
.banner-image-center img {
float: none !important;
}
}
/* Arrow button formatting */
.arrowbutton {
color:#ffffff;
width:100px;
padding:0.4em;
line-height:1.5em;
}
.arrowbutton::before {
content:"⇒ ";
font-weight:bold;
}
.arrowbutton-red {
background:#7e322c;
}
.arrowbutton-green {
background:#53946b;
}
.arrowbutton-blue {
background:#4f79a2;
}
.arrowbutton-gold {
background:#E5B921;
}
.arrowbutton-red:hover {
background: #EDDEDE !important;
color: #000000 !important;
}
.arrowbutton-green:hover {
background: #DEEDE6 !important;
color: #000000 !important;
}
.arrowbutton-blue:hover {
background: #DEE7ED !important;
color: #000000 !important;
}
.arrowbutton-gold:hover {
background: #faefcb !important;
color: #000000 !important;
}
@media screen and (min-width:800px) {
#megaheader {
height:500px;
}
}
@media screen and (max-width:799px) {
#megaheader {
height:auto;
}
}
#megaheader img {
opacity:0;
-moz-transition: opacity 2s; /* Firefox 4 */
-webkit-transition: opacity 2s; /* Safari and Chrome */
-o-transition: opacity 2s;
transition: opacity 2s;
}