MediaWiki:Common.css
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.
/* CSS placed here will affect users of the Tweeki skin */
body.page-Welcome {
background-repeat: no-repeat;
background-size: 100% auto;
animation: fadeBackground 12s infinite;
/* Initial background image */
background-image: url(http://christianpedia.com/images/thumb/4/47/Image_%2810%29.png/1200px-Image_%2810%29.png);
}
@keyframes fadeBackground {
0%, 100% { opacity: 1; }
16.66%, 33.33% { opacity: 1; }
33.33%, 66.66% { opacity: 1; }
66.66%, 83.33% { opacity: 1; }
83.33%, 100% { opacity: 1; }
/* Background image changes */
0%, 16.66% { background-image: url(http://christianpedia.com/images/thumb/4/47/Image_%2810%29.png/1200px-Image_%2810%29.png); }
16.66%, 33.33% { background-image: url(http://christianpedia.com/images/thumb/4/4b/Image_%2811%29.png/1200px-Image_%2811%29.png); }
33.33%, 66.66% { background-image: url(http://christianpedia.com/images/thumb/4/4b/Image_%2811%29.png/1200px-Image_%2811%29.png); }
66.66%, 83.33% { background-image: url(http://christianpedia.com/images/thumb/f/f9/Image_%2812%29.png/1200px-Image_%2812%29.png); }
83.33%, 100% { background-image: url(http://christianpedia.com/images/thumb/4/47/Image_%2810%29.png/1200px-Image_%2810%29.png); }
}
/* Media query for mobile devices */
@media screen and (max-width: 767px) {
.page-Welcome {
background-size: auto 94vh; /* Ensure full coverage on mobile devices */
}
}
@media screen and (max-width: 767px) {
body.page-Welcome .overlay-enabled, body.page-Welcome .mw-body {
background-color: #ffffff;
background-image: url(https://christianpedia.site/images/3/37/Main_page_background.jpg);
background-repeat: no-repeat;
background-size: 100% auto;
animation: fadeBackground 12s infinite;
}
.hit {
position: relative; /* Ensure the div has a positioning context */
z-index: 1; /* Ensure the div is above the background */
}
}
#sitename {
font-family: Linux Libertine;
}
.minerva-header .branding-box a span {
line-height: 0;
font-size: inherit;
font-family: Linux Libertine;
}
/* Infobox template style */
.infobox {
border: 1px solid #a2a9b1;
border-spacing: 3px;
background-color: #f8f9fa;
color: black;
/* @noflip */
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
/* @noflip */
float: right;
/* @noflip */
clear: right;
font-size: 88%;
line-height: 1.5em;
width: 22em;
}
.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar,
/* Remove element selector when every .infobox thing is using the standard module/templates */
.infobox th,
.infobox td {
vertical-align: top;
}
.infobox-label,
.infobox-data,
/* Remove element selector when every .infobox thing is using the standard module/templates */
.infobox th,
.infobox td {
/* @noflip */
text-align: left;
}
/* Remove .infobox when element selectors above are removed */
.infobox .infobox-above,
.infobox .infobox-title,
/* Remove element selector when every .infobox thing is using the standard module/templates */
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}
.infobox-title,
/* Remove element selector when every .infobox thing is using the standard module/templates */
.infobox caption {
padding: 0.2em;
}
/* Remove .infobox when element selectors above are removed */
.infobox .infobox-header,
.infobox .infobox-subheader,
.infobox .infobox-image,
.infobox .infobox-full-data,
.infobox .infobox-below {
text-align: center;
}
/* Remove .infobox when element selectors above are removed */
.infobox .infobox-navbar {
/* @noflip */
text-align: right;
}
/* Default styles for both headings */
.titles,
.subtitles,
.sub-subtitles{
color: white;
text-align: center;
}
.titles {
text-transform: uppercase;
font-weight: 500;
font-size: 3.5vw; /* Set font size relative to viewport width */
}
.subtitles {
font-size: 2.3vw; /* Set font size relative to viewport width */
}
.sub-subtitles {
font-size: 2vw; /* Set font size relative to viewport width */
}
/* Media query for mobile devices */
@media screen and (max-width: 767px) {
.titles {
font-size: 20px; /* Set a fixed font size for mobile devices */
}
.subtitles {
font-size: 15px; /* Set a fixed font size for mobile devices */
}
.sub-subtitles {
font-size: 10px; /* Set a fixed font size for mobile devices */
}
}
.mw-content-ltr figure[typeof~="mw:File/Thumb"], .mw-content-ltr figure[typeof~="mw:File/Frame"] {
margin: 0.5em 0 1.3em 1.4em;
clear: right;
float: right;
}
figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"], .thumbinner {
min-width: 100px;
}
@media screen {
figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"] {
border: 1px solid #c8ccd1;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: rgb(200, 204, 209);
border-bottom: 0;
background-color: #f8f9fa;
}
}
figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"] {
display: table;
text-align: center;
border-collapse: collapse;
line-height: 0;
margin: 0.5em 0 1.3em 1.4em;
clear: right;
float: right;
}
.mw-content-ltr figure[typeof~="mw:File/Thumb"] > figcaption, .mw-content-ltr figure[typeof~="mw:File/Frame"] > figcaption {
text-align: left;
}
@media screen {
figure[typeof~="mw:File/Thumb"] > figcaption, figure[typeof~="mw:File/Frame"] > figcaption {
border: 1px solid #c8ccd1;
border-top-width: 1px;
border-top-style: solid;
border-top-color: rgb(200, 204, 209);
border-top: 0;
background-color: #f8f9fa;
font-size: 88.4%;
}
}
figure[typeof~="mw:File/Thumb"] > figcaption, figure[typeof~="mw:File/Frame"] > figcaption {
display: table-caption;
caption-side: bottom;
line-height: 1.4em;
word-break: break-word;
text-align: left;
padding: 0 6px 6px 6px;
}
figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"] {
text-align: center;
border-collapse: collapse;
line-height: 0;
}