MediaWiki:Modern.css

/* All CSS here will be loaded for users of the Modern skin */
/* Type CSS rules here and they will be applied to
whatever page is loaded in that tab, as long as the pages
are from 'www.afropedia.world'
and you keep this window open. */

body {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-size: x-small;
	font-family: sans-serif;
	color: #000;
	background-color: #387f5e;
	direction: ltr;
	unicode-bidi: embed;
}

#mw_main,
#p-personal,
#mw_header,
.os-suggest {
	font-size: 130%;
}

#mw_header {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	border: 0;
	height: 2em;
	width: 100%;
	background-color: #387f5e;
	color: #000;
}

.mw-indicators {
	float: right;
}

.mw-indicator {
	display: inline-block;
}

#mw_header h1 {
	margin: 0 0 0 0.5em;
	padding: 0 0 0 0;
	text-decoration: none;
	font-size: 150%;
}

#p-personal {
	position: absolute;
	top: 2em;
	left: 0;
	height: 1.5em;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 100%;
  border-bottom: solid .5px #000;
  border-top: solid .5px #000;
}

#p-personal div.pBody {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	height: 1.5em;
	font-variant: small-caps;
}

#p-personal #pt-anonuserpage,
#p-personal h3 {
	display: none;
}

#p-personal ul {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	display: block;
	height: 1.5em;
	background-color: #387f5e;
}

#p-personal li {
	display: block;
	float: left;
	height: 1.5em;
	margin: 0 0 0 0;
	vertical-align: middle;
	font-weight: bold;
	text-transform: lowercase;
}

#p-personal li a {
	text-decoration: none;
	color: #000;
	padding: 0 1em 0 1em;
}

#p-personal li a:hover {
	text-decoration: none;
	color: #d19300;
}

#p-personal li:hover {
	background-color: #000;
}

#jump-to-nav {
	display: none;
}

#mw_contentwrapper {
	width: 100%;
	margin: 0 0 0 -15em;
	float: right;
}

#content {
	margin: 0 0 0 14.1em;
	background-color: #fff7cb;
	border-top: solid 1px #000;
	border-left: solid 0px #fff7cb;
	border-bottom: solid 1px #000;
	line-height: 1.5em;
	padding: 0 1em 1em 1em;
	/* Set a z-index for the content to group it away from any nav stuff (extensions) - T200148 */
	position: relative;
	z-index: 0;
}

#mw_portlets {
	width: 14em;
	border-right: solid .5px #000;
	background-color: #a23d3d;
	color: #d09300;
}

/* Hide, but keep accessible for screen-readers */
#mw_portlets h2 {
	position: absolute;
	top: -9999px;
}

#mw_main {
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	margin-top: 3.5em;
}

.portlet {
	padding: 0 0 0 0;
	margin: 0 0 0 0;

}

.portlet div.pBody {
	padding: 0 0 0.5em 0;

}

textarea {
	width: 100%;
	padding: 0.1em;
	display: block;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;

}

#searchBody {
	text-align: center;

}

#searchInput {
	width: 85%;
	margin-left: auto;
	margin-right: auto;
}

#p-search #searchform div div {
	margin-top: 0.4em;

}

.mw-portlet > label,
.portlet h3 {
	padding: 0.1em 0 0.3em 1em;
	margin: 0 0 0 0;
	background-color: #000;
	font-weight: bold;
	font-size: 0.83em;
	border-bottom: solid 3px #387f5e;
	border-top: solid 3px #387f5e;
        border-right: solid 3px #387f5e;
        border-left: solid 3px #387f5e;
	height: 1.1em;
	display: block;


}

.portlet ul {
	margin: 0 0 0 1.5em;
	padding: 0 0 0 0;

}

#mw_portlets .portlet ul {
	line-height: 1.4em;

}

ul {
	/* @embed */

	list-style-image: url( images/bullet.gif );
}

#p-cactions {

	height: 1.5em;
	padding: 0 0 0 0;
	margin: 0 0 0 13.69em;

}

#p-cactions div.pBody {

	margin: 0 0 0 0;
	padding: 0 0 0 0;

}

#p-cactions a,
#p-cactions a:hover {
	color: #000;
	text-decoration: none;

}

#p-cactions ul {
	display: inline;
	margin: 0 0 0 0;
	padding: 0 0 0 0;

}

#p-cactions li {

	margin: 0 0.5em 0 0.5em;
	padding: 0 0.2em 0 0.2em;
	display: block;
	float: left;
	height: 1.5em;
	text-transform: lowercase;

}

#p-cactions li.selected {

	background-color: #d09300;
  font-weight: bold;
}

#p-cactions li a,
#p-cactions li a:hover,
#p-cactions li a:visited {
	text-decoration: underline;
	color: #d09300;
}

#p-cactions li.selected a,
#p-cactions li.selected a:hover,
#p-cactions li.selected a:visited {
	text-decoration: none;
	color: #000;
}

#p-cactions h3 {

	display: none;
}

#p-cactions #ca-view,
#siteSub {
	display: none;
}

.mw-footer {
	/* @embed */
	background: #387f5e url( images/footer-grad.png ) repeat-x 0 0;
	padding: 10px 1em 1em 1em;
	clear: both;
	color: #000;
}

.mw-footer a,
.mw-footer a:hover,
.mw-footer a:visited {
	color: #000;
	text-decoration: underline;
}

img {
	border: 0;
}

.mw-footer li {
	display: inline;
	list-style-type: none;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

.mw-footer ul {
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

#footer-poweredbyico {
	display: block;
}

p {
	margin: 1em 0 1em 0;
}

hr {
	height: 1px;
	color: #aaa;
	background-color: #aaa;
	border: 0;
	margin: 0.2em 0 0.2em 0;
}

#contentSub {
	color: #545454;
	font-size: small;
	padding-left: 2em;
}

#mw_portlets form {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

a {
	text-decoration: underline;
	color: #000;
	background: none;
}

a:visited {
	color: #000;
}

a:active {
	color: #000;
}

a:hover {
	text-decoration: underline;
}

a.stub {
	color: #a23d3d;
}

a.new {
	color: #a23d3d;
}

a.new:visited {
	color: #a55858;
}

a.mw-selflink {
	color: inherit;
	font-weight: bold;
	text-decoration: inherit;
}

h1,
h2 {
	border-bottom: solid 0px #000;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	overflow: hidden;
}

.mw-parser-output a.external {
	/* @embed */
	background: url( images/external.png ) center right no-repeat;
	padding-right: 13px;
}

.mw-parser-output a.external[ href^='https://' ],
.link-https {
	/* @embed */
	background: url( images/lock_icon.gif ) center right no-repeat;
	padding-right: 16px;
}

.mw-parser-output a.external[ href^='mailto:' ],
.link-mailto {
	/* @embed */
	background: url( images/mail_icon.gif ) center right no-repeat;
	padding-right: 18px;
}

.mw-parser-output a.external[ href^='news:' ] {
	/* @embed */
	background: url( images/news_icon.png ) center right no-repeat;
	padding-right: 18px;
}

.mw-parser-output a.external[ href^='ftp://' ],
.link-ftp {
	/* @embed */
	background: url( images/file_icon.gif ) center right no-repeat;
	padding-right: 18px;
}

.mw-parser-output a.external[ href^='irc://' ],
.mw-parser-output a.external[ href^='ircs://' ],
.link-irc {
	/* @embed */
	background: url( images/discussionitem_icon.gif ) center right no-repeat;
	padding-right: 18px;
}

.mw-parser-output a.external[ href$='.ogg' ],
.mw-parser-output a.external[ href$='.OGG' ],
.mw-parser-output a.external[ href$='.mid' ],
.mw-parser-output a.external[ href$='.MID' ],
.mw-parser-output a.external[ href$='.midi' ],
.mw-parser-output a.external[ href$='.MIDI' ],
.mw-parser-output a.external[ href$='.mp3' ],
.mw-parser-output a.external[ href$='.MP3' ],
.mw-parser-output a.external[ href$='.wav' ],
.mw-parser-output a.external[ href$='.WAV' ],
.mw-parser-output a.external[ href$='.wma' ],
.mw-parser-output a.external[ href$='.WMA' ],
.link-audio {
	/* @embed */
	background: url( images/audio.png ) center right no-repeat;
	padding-right: 13px;
}

.mw-parser-output a.external[ href$='.ogm' ],
.mw-parser-output a.external[ href$='.OGM' ],
.mw-parser-output a.external[ href$='.avi' ],
.mw-parser-output a.external[ href$='.AVI' ],
.mw-parser-output a.external[ href$='.mpeg' ],
.mw-parser-output a.external[ href$='.MPEG' ],
.mw-parser-output a.external[ href$='.mpg' ],
.mw-parser-output a.external[ href$='.MPG' ],
.link-video {
	/* @embed */
	background: url( images/video.png ) center right no-repeat;
	padding-right: 13px;
}

.mw-parser-output a.external[ href$='.pdf' ],
.mw-parser-output a.external[ href$='.PDF' ],
.mw-parser-output a.external[ href*='.pdf#' ],
.mw-parser-output a.external[ href*='.PDF#' ],
.mw-parser-output a.external[ href*='.pdf?' ],
.mw-parser-output a.external[ href*='.PDF?' ],
.link-document {
	/* @embed */
	background: url( images/document.png ) center right no-repeat;
	padding-right: 12px;
}

/* images */
/* @noflip */
div.floatright,
table.floatright {
	margin: 0 0 0.5em 0.5em;
	border: 0;
}

div.floatright p {
	font-style: italic;
}

/* @noflip */
div.floatleft,
table.floatleft {
	margin: 0 0.5em 0.5em 0;
	border: 0;
}

div.floatleft p {
	font-style: italic;
}

/* thumbnails */
div.thumb {
	margin-bottom: 0.5em;
	width: auto;
}

div.thumbinner {
	border: 1px solid #ccc;
	padding: 3px !important;
	background-color: #f9f9f9;
	font-size: 94%;
	text-align: center;
	overflow: hidden;
}

html .thumbimage {
	border: 1px solid #ccc;
}

html .thumbcaption {
	border: 0;
	text-align: left;
	line-height: 1.4em;
	padding: 3px !important;
	font-size: 94%;
}

div.magnify {
	float: right;
	border: 0 !important;
	background: none !important;
	margin-left: 3px;
}

div.magnify a,
div.magnify img {
	display: block;
	border: 0 !important;
	background: none !important;
}

/* @noflip */
div.tright {
	margin: 0.5em 0 0.8em 1.4em;
}

/* @noflip */
div.tleft {
	margin: 0.5em 1.4em 0.8em 0;
}

img.thumbborder {
	border: 111px solid #ddd;
}

.mw-warning {
	border: 1px solid #aaa;
	background-color: #f9f9f9;
	padding: 5px;
	font-size: 95%;
}

#toc,
.toc {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	border-spacing: 0;
	background-color: #fff7cb;
	border: solid 3px #000;
	display: table;

}

/* CSS for backwards-compatibility with cached page renders and creative uses in wikitext */
table#toc,
table.toc {
	border-collapse: collapse;
}

/* Remove additional paddings inside table-cells that are not present in <div>s */
table#toc td,
table.toc td {
	padding: 0;
}

#toc tr,
#toc td {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

#toctitle {
	border-bottom: solid 1px #3c78b5;
	background-color: #ddd;
	margin: 0 0 0 0;
}

#toc h2,
.toc h2 {
	display: inline;
	border: 0;
	padding: 0;
	font-size: 100%;
	font-weight: bold;
}

#toc #toctitle,
.toc #toctitle,
#toc .toctitle,
.toc .toctitle {
	text-align: center;
}

#toc ul,
.toc ul {
	list-style-type: none;
	list-style-image: none;
	margin: 0 1em 0 1em;
	padding: 0;
	text-align: left;
}

#toc ul ul,
.toc ul ul {
	margin: 0 0 0 2em;
}

#toc .toctoggle,
.toc .toctoggle {
	font-size: 94%;
}

.mw-warning {
	margin-left: 50px;
	margin-right: 50px;
	text-align: center;
}

.catlinks {
	border: solid 1px #bbb;
	background-color: #f0f0f0;
	padding: 0.1em 0.3em 0.1em 0.3em;
	margin: 0 0 0 0;
}

#p-personal,
#p-cactions {
	overflow: hidden;
}

/* disable interwiki styling */
.mw-parser-output a.extiw,
.mw-parser-output a.extiw:active {
	color: #a23d3d;
}

.mw-parser-output a.external {
	color: #a23d3d;
}

.printfooter {
	display: none;
}

.sharedUploadNotice {
	font-style: italic;
}

.previewnote {
	padding-bottom: 1em;
	margin-bottom: 1em;
}

.previewnote p {
	margin: 0;
	padding: 0;
}

.toggle {
	margin-left: 2em;
	text-indent: -2em;
}

table.collapsed tr.collapsable {
	display: none;
}

input#wpSummary {
	width: 80%;
}

/* @bug 1714 */
input#wpSave,
input#wpDiff {
	margin-right: 0.33em;
}

#wpSave {
	font-weight: bold;
}

/* noarticletext */
div.noarticletext {
	border: 1px solid #ccc;
	background: #fff;
	padding: 0.2em 1em;
	color: #000;
}

div.multipageimagenavbox {
	border: solid 1px #c0c0c0;
	padding: 4px;
	margin: 1em;
	background: #f0f0f0;
}

div.multipageimagenavbox div.thumb {
	border: 0;
	margin-left: 2em;
	margin-right: 2em;
}

div.multipageimagenavbox hr {
	margin: 6px;
}

table.multipageimage td {
	text-align: center;
}

.templatesUsed {
	margin-top: 1.5em;
}

.mw-summary-preview {
	margin: 0.1em 0;
}

/* Friendlier replica lag warnings */
div.mw-lag-warn-normal,
div.mw-lag-warn-high {
	padding: 3px;
	text-align: center;
	margin: 3px auto;
}

div.mw-lag-warn-normal {
	border: 1px solid #fc6;
	background-color: #ffc;
}

div.mw-lag-warn-high {
	font-weight: bold;
	border: 2px solid #f03;
	background-color: #fcc;
}

.MediaTransformError {
	background-color: #ccc;
	padding: 0.1em;
}

.MediaTransformError td {
	text-align: center;
	vertical-align: middle;
	font-size: 90%;
}

ul {
	line-height: 1.5em;
	list-style-type: square;
	margin: 0.3em 0 0 1.5em;
	padding: 0;
	/* @embed */
	list-style-image: url( images/bullet.gif );
}

ol {
	line-height: 1.5em;
	margin: 0.3em 0 0 3.2em;
	padding: 0;
	list-style-image: none;
}

li {
	margin-bottom: 0.1em;
}

.mw-empty-elt {
	display: none;
}

dt {
	font-weight: bold;
	margin-bottom: 0.1em;
}

dl {
	margin-top: 0.2em;
	margin-bottom: 0.5em;
}

#p-cactions li.new a {
	color: #c20;
}

span.subpages {
	font-size: 80%;
	display: block;
}

pre,
.mw-code {
	border: solid 1px #3c78b5;
	padding: 0.4em;
	background-color: #f0f0f0;
}

.usermessage {
	background-color: #dadaff;
}

.mw-topboxes {
	border-collapse: collapse;
	margin: 0 -1em 1em -1em;
	padding: 0 0 8px 0;
	/* @embed */
	background: url( images/footer-grad.png ) repeat-x bottom left;
}

.usermessage p,
.mw-topbox p {
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

.usermessage,
.mw-topbox {
	color: #000;
	font-weight: bold;
	margin: 0 0 0 0;
	padding: 0 1em 0 1em;
	vertical-align: middle;
	border-collapse: collapse;
	border-bottom: solid 1px #bbb;
}

#siteSub {
	background-color: #ddd;
}

/* emulate center */
.center {
	width: 100%;
	text-align: center;
}

*.center * {
	margin-left: auto;
	margin-right: auto;
}

/* table standards */
.toccolours {
	border: 1px solid #bbb;
	background-color: #f0f0f0;
	border-spacing: 0;
	margin: 0;
	padding: 0;
}

/* Tooltips and OOUI windows are outside of the normal body code, so this helps
make the size of the text sensible */
.tipsy,
.oo-ui-windowManager {
	font-size: 130%;
}

/* Codemirror for visual editor doesn't need padding */
.ve-init-mw-desktopArticleTarget .CodeMirror {
	padding: 0 !important;
}

/* Header is absolute so body can't need to be relative */
.oo-ui-windowManager-modal-active {
	position: static !important;
}

/* Visual editor toolbar should be a wide as the body, including padding */
.ve-ui-toolbar {
	margin-left: -1em;
	margin-right: -0.5em;
}

/**
 * Lists:
 * The following lines don't have a visible effect on non-Gecko browsers
 * They fix a problem ith Gecko browsers rendering lists to the right of
 * left-floated objects in an RTL layout.
 */
/* @noflip */
html > body.rtl .mw-body ul {
	display: table;
}

/* @noflip */
html > body.rtl .mw-body #filetoc {
	display: block;
}

/* Copied from interface-edit-section-links */
.mw-editsection {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Display editsection links smaller and next to headings */
.mw-editsection,
.mw-editsection-like {
	font-size: small;
	font-weight: normal;
	margin-left: 1em;
	vertical-align: baseline;
	/* Reset line-height; headings tend to have it set to larger values */
	line-height: 1em;
}

/* Correct directionality when page dir is different from site/user dir */
.mw-content-ltr .mw-editsection,
.mw-content-rtl .mw-content-ltr .mw-editsection,
.mw-content-ltr .mw-editsection-like,
.mw-content-rtl .mw-content-ltr .mw-editsection-like {
	/* @noflip */
	margin-left: 1em;
	/* @noflip */
	margin-right: 0;
}

.mw-content-rtl .mw-editsection,
.mw-content-ltr .mw-content-rtl .mw-editsection,
.mw-content-rtl .mw-editsection-like,
.mw-content-ltr .mw-content-rtl .mw-editsection-like {
	/* @noflip */
	margin-right: 1em;
	/* @noflip */
	margin-left: 0;
}