MediaWiki:Common.css
From OER in Education
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.
/* Slides */
.myslide {
border: 1px solid black;
height: 300px;
width: 400px;
margin: 5px;
padding: 5px;
}
div.myslide ul li {
border: solid 1px blue;
margin-bottom: 100px;
}
/* OER4Schools specific additions */
.showmenu:hover .hiddenmenu {
display : block;
}
div.hiddenmenu {
display: none;
}
.faq ul li {
display:block;
float:left;
padding:5px;
}
.faq ul li div {
display:none;
}
.faq ul li div:target {
display:block;
}
.expandmenu div div {
display:none;
}
.expandmenu div div:target {
display:block;
}
/* Speech bubbles */
/* <p class="bubble-right"> */
.speechbubble-left {
position:relative;
padding:15px;
margin:1em 0 3em;
color:#fff;
background:#075698; /* default background for browsers without gradient support */
/* css3 */
background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
background:-moz-linear-gradient(#2e88c4, #075698);
background:-o-linear-gradient(#2e88c4, #075698);
background:linear-gradient(#2e88c4, #075698);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
.speechbubble-left:after {
content:"";
position:absolute;
bottom:-20px; /* value = - border-top-width - border-bottom-width */
left:50px; /* controls horizontal position */
border-width: 20px 20px 0 0; /* vary these values to change the angle of the vertex */
border-style:solid;
border-color:#075698 transparent;
/* reduce the damage in FF3.0 */
display:block;
width:0;
}
.speechbubble-right {
position:relative;
padding:15px;
margin:1em 0 3em;
color:#fff;
background:#075698; /* default background for browsers without gradient support */
/* css3 */
background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
background:-moz-linear-gradient(#2e88c4, #075698);
background:-o-linear-gradient(#2e88c4, #075698);
background:linear-gradient(#2e88c4, #075698);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
.speechbubble-right:after {
content:"";
position:absolute;
bottom:-20px; /* value = - border-top-width - border-bottom-width */
right:50px; /* controls horizontal position */
border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */
border-style:solid;
border-color:#075698 transparent;
/* reduce the damage in FF3.0 */
display:block;
width:0;
}
.bubble-blue {
background:#075698; /* default background for browsers without gradient support */
/* css3 */
background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
background:-moz-linear-gradient(#2e88c4, #075698);
background:-o-linear-gradient(#2e88c4, #075698);
background:linear-gradient(#2e88c4, #075698);
}
.bubble-blue:after {
border-color:#075698 transparent;
}
.bubble-green {
background: darkgreen; /* default background for browsers without gradient support */
/* css3 */
background:-webkit-gradient(linear, 0 0, 0 100%, from(green), to(darkgreen));
background:-moz-linear-gradient(green, darkgreen);
background:-o-linear-gradient(green,darkgreen);
background:linear-gradient(green, darkgreen);
}
.bubble-green:after {
border-color: darkgreen transparent;
}
.bubble-purple {
background: indigo; /* default background for browsers without gradient support */
/* css3 */
background:-webkit-gradient(linear, 0 0, 0 100%, from(fuschia), to(indigo));
background:-moz-linear-gradient(fuschia, indigo);
background:-o-linear-gradient(fuschia, indigo);
background:linear-gradient(fuschia, indigo);
}
.bubble-purple:after {
border-color: indigo transparent;
}
.bubble-red {
background: darkred; /* default background for browsers without gradient support */
}
.bubble-red:after {
border-color: darkred transparent;
}
/* End of OER4Schools specific additions */
/* Extra white space */
h1 { margin-top: 2em; margin-bottom: 1em; line-height:110%}
h2 { margin-top: 2em; margin-bottom: 1em; line-height:110%}
p { margin-top: 1em; margin-bottom: 1em; }
/* Topcontent banner */
#topcontent{margin-top:-25px;margin-bottom:10px; margin-left: 205px; font-size:12px;font-size:1.2rem;}
#header .unicam{width:184px;}
#banner {background:#5c99c6; padding: 15px 0 38px; -moz-border-top-left-radius:15px;-webkit-border-top-left-radius:15px;border-top-left-radius:15px;}
#orbit-logo{float:right;margin:0px 20px 12px 20px;padding:3px 0 20px 0;}
#orbit-logo img{border:2px solid #fff;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;}
.mp-topbanner{padding:5px 0 28px 20px; }
.orbit-header{margin:5px 0 0 0;font-size:24px;font-size:2.4rem;color:#fff;padding:10px 0 5px 20px; line-height: 1em;}
.orbit-header a{color:#fff;mtext-decoration:none;}
.orbit-subheader{margin:0;font-size:14px;font-size:1.4rem;color:#fff;}
.orbit-subheader a{color:#fff;text-decoration:none;}
/* Background */
body {
background-color: #cde1ec;
}
#mw-page-base {
background-color: transparent;
background-image: none;
}
/* Custom tables */
table{background:#fff;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;margin:0 0 18px 0;border:1px solid #ddd;}
table thead, table tfoot{background:#f2f2f2;}
table thead tr th,table tfoot tr th,table tbody tr td,table tr td,table tfoot tr td,table tbody tr th{line-height:18px;text-align:left;}
table thead tr th,table tbody tr th,table tfoot tr td{padding:8px 10px 9px;font-size:14px;font-size:1.4rem;font-weight:bold;color:#222;}
table thead tr th:first-child,table tbody tr th:first-child,table tfoot tr td:first-child{border-left:none;}
table thead tr th:last-child,table tbody tr th:last-child,table tfoot tr td:last-child{border-right:none;}
table thead tr td,table tbody tr th{color:#181818;padding:9px 10px;vertical-align:top;border:none;font-size:14px;font-size:1.4rem;font-weight:bold;}
/*table tbody tr.even,table tbody tr.alt{background:#f2f2f2;}
table tbody tr:nth-child(even){background:#f2f2f2;}*/
table tbody tr td{padding:9px 20px;vertical-align:top;border:1px solid #ddd;}
table.alt-greywhite tbody tr:nth-child(odd){background:#f2f2f2;}
table.alt-greywhite tbody tr:nth-child(even){background:#fff;}
table.alt-whitegrey tbody tr:nth-child(odd){background:#fff;}
table.alt-whitegrey tbody tr:nth-child(even){background:#f2f2f2;}
table tbody tr.tr-highlight:hover{background:#cde1ec;}
table td.td-highlight:hover{background:#cde1ec;}
table.tablehighlight tbody tr:hover{background:#cde1ec;}
table.tablehighlightcell tbody tr td:hover{background:#cde1ec;}
table.noborder tbody tr td{border:none;}
table.nosideborder tbody tr td{border-top:1px solid #ddd;border-bottom:1px solid #ddd;border-left:none;border-right:none;}
table.wikitable{background:#fff;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;margin:0 0 18px 0;border:1px solid #ddd;}
table.wikitable thead, table.wikitable tfoot{background:#f2f2f2;}
table.wikitable thead tr th,table.wikitable tfoot tr th,table.wikitable tbody tr td,table tr td,table.wikitable tfoot tr td,table.wikitable tbody tr th{line-height:18px;text-align:left;}
table.wikitable thead tr th,table.wikitable tbody tr th,table.wikitable tfoot tr td{padding:8px 10px 9px 20px;font-size:14px;font-size:1.4rem;font-weight:bold;color:#222;}
table.wikitable thead tr th:first-child,table.wikitable tbody tr th:first-child,table.wikitable tfoot tr td:first-child{border-left:none;}
table.wikitable thead tr th:last-child,table.wikitable tbody tr th:last-child,table.wikitable tfoot tr td:last-child{border-right:none;}
table.wikitable thead tr td,table.wikitable tbody tr th{color:#181818;padding:9px 10px 9px 20px;vertical-align:top;border:none;font-size:14px;font-size:1.4rem;font-weight:bold;}
table.wikitable tbody tr:first-child{border-bottom:2px solid #ddd;}
table.wikitable tbody tr td{padding:9px 20px;border:1px solid #ddd;}
/*table.wikitable tbody tr:hover{background:#cde1ec;}*/
table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td{border:none;border-bottom:1px solid #ddd;}
#content p{margin:10px 0;}
#content ul,#content ol{margin:0 40px;}
#content ul li{list-style-type:square;padding:0;}
#content ol li{list-style-type:decimal;padding:0;}
#content .educator-notes{margin:5px 0 25px 50px;padding:8px 15px;border:solid 1px #a6d2ff;border-left:solid 3px #a6d2ff;background-color:#efefef;overflow:auto;}
#content .video-notes{margin:5px 0 25px 50px;padding:8px 15px;border:solid 1px #a6d2ff;border-left:solid 3px #a6d2ff;background-color:#efefef;overflow:auto;}
#content .subject{border:3px solid #0b65b1;background:#fff;padding:0;margin:0;}
#content .subject p{background:#fff;padding:0;margin:0;}
#content .subject p.description{background:#0b65b1;color:#fff;margin:0;padding:10px;width:320px;}
#content .subject p.description a{color:#fff;font-weight:normal;text-decoration:none;}
#content .subject p a img{margin:10px;display:block;margin-left:auto;margin-right:auto;}
#content .catlinks .mw-normal-catlinks{font-weight:bold;}
#content .catlinks .mw-normal-catlinks ul {margin:0;}
#content .catlinks .mw-normal-catlinks ul ul{margin:0;}
#content .catlinks .mw-normal-catlinks ul li{border:none;margin:0;}
#content .catlinks .mw-normal-catlinks ul ul li{border:1px solid #0b65b1;background:#fff;padding:3px;margin-right:5px;margin-bottom:5px;}
#content .catlinks .mw-normal-catlinks ul ul li:hover{background:#ebf1f6;}
#content .catlinks .mw-normal-catlinks ul ul li:hover a{background:#ebf1f6;}
#content .catlinks .mw-normal-catlinks ul ul li a:hover{text-decoration:none;}
#content .rh-menu{border:1px solid #aaa;padding:0;width:300px;margin:0 0 40px 10px;float:right;}
#content .rh-menu p:first-child{background:#ddd;display:block;padding:20px 0;margin:0;border-bottom:1px solid #aaa;}
#content .rh-menu p:second-child{margin:0 10px;}
#content .rh-menu ul{margin:10px 10px 0 10px;padding:0 0 10px 0;border-bottom:1px solid #aaa;}
#content .rh-menu ul li{margin:0;padding:0 10px 0 10px;list-style:none;}
#content .rh-menu ul li a{font-weight:normal;}
#content .rh-menu p a{margin:20px 10px 10px 15px;}
#content .cse .gsc-control-cse, #content .gsc-control-cse{padding:0;border:none;margin:20px 10px 0 0;}
#content .gsc-search-box{margin:0 0 0 0;float:right;width:300px;}
#content table.gsc-search-box{border:none;padding:0;margin:0;}
#content table.gsc-search-box tbody tr td{border:none;padding:2px 5px;}
#content table.gsc-search-box tbody tr td input[type=text]{border:none;padding:7px 10px;}
#content table.gsc-search-box tbody tr td input[type=text]:hover{border:none;}
.gsc-search-box-tools .gsc-search-box .gsc-input{padding:0;}
#content table.gsc-above-wrapper-area-container tbody tr td.gsc-result-info-container{border:1px solid #bbb;padding:2px 0;color:#000;}
#content .gsc-result{border-top:1px solid #ddd;}
#content .gsc-above-wrapper-area{padding:0;border:none;}
#content table.gsc-resultsHeader{display:none;border:none;}
#content table.gsc-resultsHeader tbody{border:none;}
#content table.gsc-resultsHeader tbody tr{border:none;}
#content table.gsc-resultsHeader tbody tr td{border:none;}
#content table.gsc-table-result{border:none;}
#content table.gsc-table-result tbody{border:none;}
#content table.gsc-table-result tbody tr{border:none;}
#content table.gsc-table-result tbody tr td{border:none;}
#content table.gsc-table-result tbody tr td .gs-snippet{padding:0 10px;}
#content #adBlock, #adBlock{display:none;}
/* Bigger menu sidebar */
@media screen and (min-width: 982px) {
div#content {
margin-left: 1em;
margin-right: 1em;
}
#bodyContent {
margin-left: 15em;
width: auto;
}
#mw-content-text {
min-height: 1200px;
}
#firstHeading {
margin-left: 7.2em;
}
#left-navigation {
margin-left: 15em;
margin-top: 2em;
}
#right-navigation {
margin-top: 2em;
}
div.vectorTabs span {
line-height: 0px;
height: 2em;
}
div.vectorTabs {
height: 2em;
}
#mw-head-base {
margin-left: 15em;
height: 4em;
}
#ca-unwatch.icon a, #ca-watch.icon a {
line-height: 1em;
padding-top: 2.3em;
}
div.vectorMenu {
height: 2em;
margin-top: -0.1em;
}
div.vectorMenu h3 a {
height: 1.5em;
}
div#simpleSearch {
margin-top: -0.2em;
}
div#simpleSearch button#searchButton {
padding-top: 0.1em;
}
div#mw-panel {
left: 0.4em;
width: 14em;
}
#p-personal {
top: 0.2em;
}
#p-logo {
width: 14em;
left: 13px;
top: -115px;
}
#p-logo a {
width: 14em;
}
}
/* Customize side menu item */
div#mw-panel div.portal div.body ul {
margin: -5px;
}
#mw-panel.collapsible-nav .portal {
background-image: none;
}
#mw-panel.collapsible-nav .portal .body {
margin: 0 0 0 8px;
}
#mw-panel.collapsible-nav .portal .body ul li {
padding: 0.5em;
}
div#mw-panel div.portal div.body ul li {
background: none repeat scroll 0 0 #ebf1f6;
border: 1px solid #bbb;
color: #0b65b1;
display: block;
font-weight: normal;
margin: 3px;
padding: 4px 10px;
}
#mw-panel.collapsible-nav div.portal h3 {
color: #0b65b1;
font-weight: bold;
margin: 10px -2px 9px 6px;
}
div#mw-panel div.portal h3 {
background-color: #ddd;
border: 1px solid #aaa;
font-size: 1.4rem;
padding: 4px 10px;
text-decoration: none;
}
/* Custom footer */
@media screen and (min-width: 982px) {
div#footer {
background: none repeat scroll 0 0 #0b65b1;
margin-left: 1em;
margin-right: 1em;
margin-top: 1em;
clear: both;
display: block;
}
div#footer #footer-info li {
color: #ffffff;
font-size: 0.8em;
line-height: 1em;
}
div#footer ul li a {
color: #FFFFFF;
font-weight: bold;
}
div#footer #footer-places li {
border: 1px solid #ffffff;
padding: 0 5px;
}
/* Visual Editor */
.ve-ce-surface {
margin-left: 210px;
min-height: 1200px;
}
.oo-ui-toolbar-bar {
margin-left: 230px;
}
}