Library Homepage Style Guide: Special Scripts

Standard WC3 (see https://www.w3schools.com/w3css/w3css_dropdowns.asp)

.box
{
border: 3px solid #9590C6;  padding: 11px;  height: 85px; width: 20%; text-align: center; background-color: #F1EEF7;
}
	.box:hover
	{
		-moz-box-shadow: 0 0 10px #bad;
		-webkit-box-shadow: 0 0 10px #bad;
		box-shadow: 0 0 10px #bad;
background-color: #FFFFFF;
	}

use both ALT and TITLE:

 alt="bla bla bla"  title="bla bla bla"

inline to compensate for all browser types

Render in HTML only - special form coding gets lost in the basic editor

Appears on every page except for main page. Use the following style in an individual pages' jss/css setting to disable:

 
#kathy{display:none;}

@media screen and (min-width: 0px) and (max-width: 720px) { 
  .dblock {display: block;} 
  .mobile-hide{ display: none; }

special features blocked: faq, footer hours, address, chat icon

Add code into Header, for:

Service Disruption {

}

Databases Down ...:{

}

Network Experiencing Difficulties{

}

Closing Early{

}

 .s-lg-box-wrapper-25588599  {
  margin: auto;
  width: 75%;
  border-radius: 11px;
  border-style: solid;
  border-width: 2px;
border-size:  1px;
border-color: #CFCBE5;
  padding-top: 20px;
  padding-right: 20px;
  padding-bottom: 0px;
  padding-left: 20px;
-moz-box-shadow: 0 0 16px #87b;
-webkit-box-shadow: 0 0 16px #87b;
box-shadow: 0 0 16px #87b;
background-color: #FFFFFF;
}
.box
{
border: 3px solid #9590C6;  padding: 11px;  height: 85px; width: 20%; text-align: center; background-color: #F1EEF7;
}
	.box:hover
	{
		-moz-box-shadow: 0 0 10px #bad;
		-webkit-box-shadow: 0 0 10px #bad;
		box-shadow: 0 0 10px #bad;
background-color: #FFFFFF;
	}
.ui-widget-header {font-size: 104%; background-color:white; background-image: none; border: none; }
#random{
  width: 100%;
  height: 166px;
background-position: center center;
background-size: cover;
background-repeat: yes-repeat;  
}
#kathy{display:none;} 
 
function randombg(){	
  var random= Math.floor(Math.random() * 8) + 0;
  var bigSize = ["url('https://libapps.s3.amazonaws.com/accounts/7528/images/ehall4.jpg')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/campus-shadyside.jpg')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/Chatham_University_-_IMG_7653.jpeg')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/ehall6.jpg')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/vo3.jpg')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/food2.png')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/IMG_20180521_102702.jpg')",
"url('https://libapps.s3.amazonaws.com/accounts/7528/images/1010-amphitheater3.jpg')",
];
  document.getElementById("random").style.backgroundImage=bigSize[random];

for separate instances that require flexible external page(s) with JSQuery, PHP & SQL scripts