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;
}