MediaWiki:Chameleon.css
From CSDMS
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.
/* page titles */
.PageTitle {
font-size: 36px;
margin-top: 20px;
margin-bottom: 0px;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
margin: 0.67em 0;
display: block;
-webkit-margin-before: 0.67em;
/* -webkit-margin-after: 0.67em;*/
-webkit-margin-start: 0;
-webkit-margin-end: 0;
/*font-weight: Bold;*/
}
/* front page adjustments */
#event-image-container{
position: relative;
}
#event-image-container img{
width: 100%;
height: auto;
}
#event-image-text{
z-index: 0;
position: absolute;
color: #0645AD;
font-size: 36px;
left: 10%;
top: 20%;
}
#event-image-text a:hover{
text-decoration: none;
}
.come-in {
transform: translateY(150px);
animation: come-in 0.8s ease forwards;
}
.banner-box-2 a:hover{
text-decoration: none;
}
.AutoScaleImage img {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}
/*grey-out images unless hover over; height scales automatic with width. NOT USED ANYMORE AT THIS POINT*/
#grey-image{
position: relative;
}
#grey-image img{
width:100%;
height:auto;
opacity: 0.9;
filter: alpha(opacity=90);
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
#grey-image img:hover{
opacity: 1.0;
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}
#grey-image .tag {
position: absolute;
left: 80px;
top: 30px;
color: #FFFFFF;
font-weight: bold;
}
/* Top banner image */
#mw-navigation {
background-image: url(skins/common/CSDMS_high_res1.png), url(skins/common/CSDMSbanner3.png);
background-color: #333333;
background-attachment: fixed;
text-indent:-9999px;
background-size: 241px 75px, 100%;
// background-position: 0% 0%, 50% -2em;
background-position: 0% 0%, 0% -0.5em;
background-repeat: no-repeat;
background-origin: content-box;
height:70px;
}
#mw-navigation:hover {
background-image: url(skins/common/CSDMS_high_res2.png), url(skins/common/CSDMSbanner3.png);
background-color: #333333;
background-attachment: fixed;
text-indent:-9999px;
background-size: 241px 75px, 100%;
/* background-position: 0% 0%, 50% -2em;*/
background-position: 0% 0%, 0% -0.5em;
background-repeat: no-repeat;
background-origin: content-box;
height:70px;
}
#p-logo {
background-position: 0.1em -0.1em;
background-repeat: no-repeat;
background-image: url(images/Home_icon2.png);
background-size: 35px 32px;
}
#p-logo:hover {
background-position: 0.1em -0.1em;
background-repeat: no-repeat;
background-image: url(skins/common/home_icon3.png);
background-size: 35px 32px;
}
/* Make it possible to click on logo upper left corner, using fake text in Mediawiki:Secondary-menu */
/*#text-logo{
height:30px;
width: 100%;
// background-color:#dddddd;
filter:alpha(opacity=60);
opacity:0.6;
} */
/* Setting color for the entire background & text area */
body {
background-color:#E9E9E9;
}
#content{
background-color:#FFF;
border-style: solid;
border-width: 1px;
border-color: #C0C0C0;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
/* Bottom of the Page / Footers */
.BottomPage {
background-color:#222;
width:100%;
position:relative;
bottom:0px;
left:0;
height:50%;
min-height:150px;
padding:20px;
padding-top:0px;
}
.BottomPage a:link, .BottomPage a:visited {
color:#B9BFBF;
}
.BottomPage a:hover, .BottomPage a:active {
color:#FFF;
}
/*#footer-icons, #footer-info, #footer-places {
// display:none;
//}*/
#footer-info{ display:none; }
#footer-icons img, #footer-icons img:link, #footer-icons img:visited {
opacity: 0.9;
/*filter: alpha(opacity=90);*/
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
#footer-icons img:hover, #footer-icons img:active {
opacity: 1.0;
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}
/* Remove padding from the front page edges */
body.page-Main_Page #content{
padding: 0px !important;
}
body.page-Main_Page .contentHeader{
margin: 0em 0 0em;
}
/* Set properties for 1st front page image */
#frontimage {
display:block;
width:100%;
height: 450px;
background-image: url(skins/common/test-image2.jpg);
background-size: 100% 100%;
background-position: 0% 0%;
background-attachment: fixed;
background-repeat: no-repeat;
background-origin:content-box;
text-align: center;
color: #FFF;
font-family:Georgia, serif;
font-size:1.25em;
font-style:italic;
text-decoration: none;
}
#frontimage a:hover {
text-decoration: none;
}
#frontimage-text a:hover {
text-decoration: none;
color: #FFF;
}
#frontimage-text a:link {
text-decoration: none;
color: #FFF;
}
#frontimage-text a:visited {
text-decoration: none;
color: #FFF;
}
ul, ol{
margin-bottom: 10px !important;
}
.stackem div {
width: 100%;
}
.pr_container{
# border: 3px solid black;
}
.pr_event_name{
text-align: right;
font-style: italic;
# border: 3px solid blue;
color: grey;
}
.pr_title{
# border: 3px solid green;
font-weight: bold;
color:#0084b4;
font-size: 36px;
}
.pr_author{
# border: 3px solid blue;
padding-bottom: 4px;
font-size: 1.5em;
}
.pr_coauthor{
# border: 3px solid red;
}
.pr_abstract{
# border: 3px solid yellow;
}
.pr_youtube{
# border: 3px solid red;
padding-top: 13px;
}
.pr_buttons{
padding-bottom: 2px;
}