/*
***********
HTML Styles
***********
*/

/* added to improve readability 7/8/2014 - mike  added margin-top to li 9/18/2014 -mike*/
li { margin-top:0px; line-height:20px; }
p { line-height:20px; }

/* added to insert bullets back in lists after biblioupgrade 1/31/2017 geoff */
article ul {list-style: initial;}

#sil-page-inner .breadcrumb { clear:both; width:100%; font-size:11px; background-color: #fff; overflow:auto; background-repeat:repeat-y; margin: 0;}


/* updated breadcrumbs 3/20/2017 geoff */
.sil-breadcrumb {
  padding: 0px 15px 10px;
  min-height: 44px;
}
.sil-breadcrumb .path {
  font-size: 11px;
  line-height: 21px;
}
.sil-breadcrumb .path, .sil-breadcrumb .google-translate, .sil-breadcrumb .share {
  padding-top: 10px;
}
.sil-breadcrumb .google-translate {
	min-width: 158px; /* prevents popping on page load */
	min-height: 34px;
}
.sil-breadcrumb .share {
  margin-left: 15px;
}
.fb-share-btn {
  margin-left:3px;
}
.pin-it-btn {
  display:inline-block;
}
.pin-it-btn a {
  background-image:url("//www.sno-isle.org/assets_global/smi/pinterest-icon.png") !important;
  background-size: 22px 22px !important;
  height:22px !important;
  width:22px !important;
}
.sil-share-btn {
  display:inline-block;
}
.sil-share-btn a{
  cursor:pointer;
}
/* end breadcrumbs */




/* BUTTONS */

.green-button, a.green-button, a.green-button:link, a.green-button:visited {
  display: block;
  width: 100%;
  border-radius: 8px;
  background-color: #758146;
  padding: 12px 0;
  text-align: center;

  color: #ffffff;
  text-decoration: none;
  margin-top: 15px;
  font-size: 18px
}
.green-button:hover, a.green-button:hover {
  background-color: #5f6938;
  text-decoration: none;
}



/* BLOGS 3/20/2017 geoff */
.post + .post {
  margin-top: 30px;
}
/* end BLOGS */


@media print { .breadcrumb, .sil-breadcrumb {display:none;} }










/* SIDEBAR NAVIGATION */
.sidebar-nav {
  border-top: 6px solid #42474c;
  margin-bottom: 25px;
}
.sidebar-nav-mobile {
  display: none;
}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
.sidebar-nav {
  display: none;
}
.sidebar-nav-mobile {
  display: block;
}
}


.sidebar-nav ul {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
}

.sidebar-nav .nav-header {
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
  padding: 20px;
}

.accordion-menu {
  width: 100%;
  max-width: 360px;
  margin: 30px auto 20px;
  background: #FFF;
  border: 1px solid #dadada;
  border-top: none;
  -webkit-box-shadow: 1px 2px 2px #dadada;
  box-shadow: 1px 2px 2px #dadada;
}

.accordion-menu .link {
  cursor: pointer;
  display: block;
  padding: 15px 20px;
  color: #333;
  font-size: 16px;
  font-family: "Open Sans",Arial,sans-serif;
  border-top: 1px solid #CCC;
  position: relative;
  -webkit-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.accordion-menu li:first-of-type .link {
  border-top: none;
}


.accordion-menu .link:hover {
  background-color: #f5f5f5;
  text-decoration: none;
}

.accordion-menu li i {
  position: absolute;
  top: 16px;
  left: 12px;
  font-size: 18px;
  color: #595959;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion-menu li i.icon-angle-right {
  right: 12px;
  left: auto;
  font-size: 16px;
}

.accordion-menu li.open .link {
  color: #000;
  background-color: #f1f1f1;
  font-weight: 600;
}

.accordion-menu li.open i { color: #000; }

.accordion-menu li.open i.icon-angle-right {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/**
 * Submenu
 -----------------------------*/


.submenu {
  display: none;
  background-color: #f5f5f5;
  font-size: 14px;
  border-top: 1px solid #CCC;
}

.submenu li { border-bottom: none; }

.submenu a, .submenu a:visited {
  display: block;
  text-decoration: none;
  color: #000;
  padding: 12px;
  padding-left: 40px;
  -webkit-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.submenu a:hover {
  text-decoration: none;
  background: #f1f1f1;
  color: #000;
}
/* END SIDEBAR NAV */












/* BIBLIO INTEGRATION */
div.cp_header .cp_header_biblio_bar {
	min-height: 35px; /* this prevents the top banner from popping on page load */
}
@media (max-width: 991px) {
.cp_header {
  margin-bottom: 25px;
}
}


/* bibliofix 4/24/2017 */
#bibliocommons_user_nav_trigger {
  padding: 9px 12px; /* Fixes blank space margin around login box */
  background-color: #758146; /* fixes blue background on page load */
  font-weight: 600;
}
.bibliocommons_embed_block .dropdown-menu.biblionav_my_account {
  right: -15px; /* fixes dropdown from floating off the right edge of the screen */
  left: auto;
}

.cp_header_nav, .cp_header_nav .container {
  background-color: #B7610B;
}
div.cp_header_wrapper_old div.cp_header_nav.navbar ul.nav.navbar-nav>li, div.cp_header_wrapper div.cp_header_nav.navbar ul.nav.navbar-nav>li {
  color: #fff;
}

.navbar-default .navbar-nav>li>a {
  color: #fff;
}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
  color: #FFF;
  background-color: rgb(97, 56, 26);
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus {
  color: #FFF;
  background-color: rgb(97, 56, 26);
}

@media (max-width: 991px) {
ul.dropdown-menu li label, ul.dropdown-menu li a:not(.btn), ul.dropdown-menu li fieldset {
  outline: none;
  color: #666 !important;
}
}











@media print { #catalog-search-form {display:none;} }

html {
	overflow-x : auto;
	overflow-y : scroll;
}

table {
	font-size : 100%;	
}

body {
	margin:0px;
}

.body {
	/*background:url(/images_global/layout/fern_2.jpg);*/
	background:#DCDFCC;
}

/* Border Style Class - zlewis */
.zBorder {
	border-top: 1px solid #eee;
	border-left: 1px solid #eee;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

/* sets images to be a max-width of their parent container, and force image height to be in original ratio*/
body img {
	border:none;
	max-width: 100%;
	height: auto;
}

input, select, textarea, button {
  max-width: 100%;
}



/* Embedded videos / iframes */
body iframe {
	border:none;
	margin:0px;
	max-width: 100%;
}

.video-object h3 {
	display: inline-block;
	position: relative;
	height: 3em;
	margin-bottom: 0px;
	width: 100%;
}

.video-object h3 span {
	position: absolute;
	bottom: 0px;
}

.video-object p {
	margin-top: 0px;
}

.video-container {
	position:relative;
	padding-bottom:46%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin-bottom: 20px;
}
/* Adjacent Sibling Selector to removes margin for caption of next occurring <p> */
.video-container.caption + p {
	margin-top: -20px;
}
.video-container iframe, .video-container object, .video-container embed, .video-container a {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.video-container a {
	display: block;
	background-size: 100% !important;
	border: none;
}

.video-container a span {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-indent: 140%;

	width: 20%;
	height: 21.5%;
	border-radius: 16% / 38%;
	margin: auto;
	background-color: rgba(33,33,33,0.8);


	position: relative;
	top: 56%;
	transform: perspective(1px) translateY(-62%);
	-webkit-transform: perspective(1px) translateY(-62%);
	-ms-transform: perspective(1px) translateY(-62%);
}

.video-container a:hover span {
	background-color: #c10712;	
}

.video-container a span::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    clear: both;
    background: url('/images_global/video-play-arrow.png') no-repeat center center;
    background-size: 100%;
}


/*h1 {
	font-size : 130%;
}
h2 {
	font-size : 120%;
}
h3 {
	font-size : 110%;
}*/

.h2-header {
padding: 5px 5px 5px 5px; background-color:#ffed87; font-size:18px; font-weight:bold;	
	
}

h1.page-header {
  margin:5px 0px 20px;
}

.header-image {
  width: 100%;
  margin-bottom: 10px;
}

.sil-anchor { padding-top:40px; }


.clearfix::after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */




/*
****************
Main Link Styles
****************
*/


a {
	color : #b7610b;
}
a:visited {
	color : #b7610b;
	/*color : #485E34;*/
/*		font-weight: bold; */
}
a:active {
	color : #485E34;
/*	font-weight: bold; */
}
a:hover {
	color : #B7610B;
/*	font-weight: bold; */
	text-decoration:underline;
}




.epn-white a:link, .epn-white a:visited, .epn-white a:active, .epn-white a:hover  { color:#FFFFFF; text-decoration:underline; }
.epn-red a:link, .epn-red a:visited, .epn-red a:active, .epn-red a:hover  { color:#FF0000; text-decoration:underline; }




.nolink a:link, a:visited, a:active { text-decoration:none; }
.nolink a:hover { text-decoration:underline; }



.kid-poll-result-wrapper table {
  width:auto !important;
}




/* Sidebar Styles*/

.sidebar-anchor, .rightsidebar-anchor { display:none; }
#sidebar, #qlrr { display:none; }

/*@media only screen and (max-width : 900px),
only screen and (max-device-width : 900px) {
*/
@media only screen and (max-width : 767px),
only screen and (max-device-width : 767px) {
	.sidebar-anchor, .rightsidebar-anchor {
		display:block;
		padding:10px 0px;
		text-align: center;
	}
	#sidebar, #qlrr { display:inline; }

	/* ::before element creates the 3-line menu icon */
	.sidebar-anchor a::before, .rightsidebar-anchor a::before {
		content: "";
		position: absolute;
		left: 12px;
		top: 15px;
		width: 16px;
		height: 3px;
		background: #636363;
		box-shadow: 
			0 4px 0 0 #636363,
			0 8px 0 0 #636363;
	}

  /* QUICK LINKS / RELATED RESOURCES BUTTON */
  .sidebar-anchor a, .rightsidebar-anchor a {
    position: relative;
    text-decoration: none;
    margin: auto;
    display:inline-block;

    background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
    background:-ms-linear-gradient( top, #dfdfdf 5%, #ededed 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
    background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #dfdfdf), color-stop(100%, #ededed) );
    background-color:#ededed;

    border-radius: 0;
    border:1px solid #dcdcdc;
    padding:9px 18px 9px 38px;

		font-size:16px;
		font-weight:normal;
    color: #636363;
    text-decoration:none;
	}
	.sidebar-anchor a:hover, .rightsidebar-anchor a:hover {
    color: #636363;
    text-decoration:none;
	}
	.sidebar-anchor a:active, .rightsidebar-anchor a:active {
		position:relative;
		top:1px;
	}



}

/*
*************
Homepage Styles
**************
*/



/*.home-content-column {
	float:left;
	overflow:auto;
	padding-top:5px;
	padding-left:10px;
}*/

/*.home-content-column-electronic-media { padding: 0 10px; }
.home-content-column-meetings { padding: 0 10px; }
.home-content-classes-events-new { padding: 0 10px; }
.home-content-column-library-news-new { padding: 0 10px; }*/

/*.home-content-column-promo { margin-top:25px; float:left; overflow:hidden; }*/
.home-content-column-sm { float:left; overflow:auto; }
/*.home-content-column-middle { float:left; }*/



.home-container {
	padding: 20px 0;
}


/* 3 column typography */

[class^="home-content-"] h3 {
	margin: 0;
}
[class^="home-content-"] h3 a {
	display: block;
	color:white;
	font-size:16px;
	text-decoration:none;
	margin: 0 0 10px 0;
	padding:6px;
	transition: all .2s ease-in-out;
}
[class^="home-content-column"] h3 a:hover {
	text-decoration: none;
}

/* COLORS */

/* Electronic Media */
.home-content-column h3 a {background-color: #668AA0;}
.home-content-column h3 a:hover {background-color: #496373;}

/* Meeting Notices*/
.home-content-column-meetings h3 a {background-color: #758146;}
.home-content-column-meetings h3 a:hover {background-color: #5F6938;}

/* Library News */
.home-content-column-library-news-new h3 a {background-color: #AE4148;}
.home-content-column-library-news-new h3 a:hover {background-color: #802F35;}

/* Classes & Events */
.home-content-classes-events-new h3 a {background-color: #89799E;}
.home-content-classes-events-new h3 a:hover {background-color: #625670;}




#sil-page-outer {
	width:100%; text-align:center;		
}


#sil-page-inner {
	margin-left:auto;
  margin-right:auto;
  text-align:left;
  width:1170px;
  max-width: 100%;
  background-color:#FFF;
}


#sil-home-content {
	clear:both; width:1170px; padding-left:7px;
}


@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {

#sil-page-inner {
	width:100%;
}

}



/* OLD HOME RESPONSIVE VIEWS */

/*@media only screen and (max-width : 940px),
only screen and (max-device-width : 940px) {
	
.home-content-column {
	width:24%;
}

.home-content-column-electronic-media {
	width:100%;
	padding-left:0px;
}

.home-content-column-meetings {
	width:100%;
	padding-left:0px;
}

.home-content-column-middle {
	width:36%;
}

.home-content-column-library-news-new {
	padding-right:5%;
	width:92%;
}

.home-content-classes-events-new {
	padding-right:5%;
	width:92%;
}

}

@media only screen and (max-width : 810px),
only screen and (max-device-width : 810px) {

.home-content-column {
	width:26%;
}

.home-content-column-middle {
	width:32%;
}

}

@media only screen and (max-wdith : 740px),
only screen and (max-device-width : 740px) {

.home-content-column {
	width:35%;
}

.home-content-column-middle {
	width:63%;
}

.home-content-column-promo {
	width:100%;
	text-align:center;
}

.home-content-column-promo div, .home-content-column-promo iframe{
	width:300px !important;
	overflow:hidden;
	display:inline-block;
}

}

@media only screen and (max-width : 500px),
only screen and (max-device-width : 500px) {

.home-content-column {
	width:100%;
	padding-left:0px !important;
}

.home-content-column-electronic-media {
	padding-bottom:0px;
}

.home-content-column-meetings {
	padding-bottom:0px;
}

.home-content-column-electronic-media div {
	padding-right:0px !important;
}

.home-content-column-meetings div {
	padding-right:0px !important;
}

.home-content-column-middle {
	width:100%;
}

.home-content-column-library-news-new {
	padding-right:0px;
	width:100%;
}

.home-content-classes-events-new {
	padding-right:0px;
	width:100%;
}

}*/
/*
@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px) {
	
#sil-page-outer { width:320px; }


#sil-page-inner { background-color:#FFF; margin-left:auto; margin-right:auto; text-align:left; width:320px; background-image:url(/images_global/layout/content_background_yellow_fade.gif); background-repeat:repeat-y; }
  
}
*/


@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	
#sil-home-content { clear:both; width:100%; }
  

  
}






/* RANDOM */

/* this hides the facebook widget on pageload, otherwise
starts 300x200 and momentarily adds extra space at bottom */
.fb_reset {
  max-width:1px;
  max-height:1px;
}




















/* TEDx STYLES*/





.bio-pic {
  float: right;
  width: 250px;
  height: auto;
  margin: 25px;
}
.partner-box {
  float:left;
  margin:23px;
  height:150px;
  width:27%;
  text-align:center;
}

















/*
*************
Topper Styles
*************
*/



#topper {
	margin-left:auto;
	margin-right:auto;
	background-color:#758146;
	height:29px;
	width:100%;
	
}

.topper-container {
	margin-left:auto;
	margin-right:auto;
	background-color:#758146;
	height:30px;
	width:100%;
}

@media print { #topper {display:none;} }

#topper-content {
	font-size:13px;
	margin-left:auto;
	margin-right:auto;
	padding-top:5px;
	width:960px;
}

#topper-content a:active {
	color:#fff;
	text-decoration:underline;
}

.topper-link {
	float:right;
	padding-left:30px;
}

.library-jump {
	display:inline;
	margin:0;
	padding-right:30px;
}
#library-jump select {
	font-size:1em;
	width:193px;
}
#library-jump input {
	font-size:1em;
}
#topper-content a:link, #topper-content a:visited {
	color:#fff;
}

.topper-var-button {
	display:none;
}

.topper-popup {
	background-color:#DCDFCC;
	height:auto;
	left:0;
	position:absolute;
	top:40px;
	visibility:hidden;
	width:210px;
	z-index:2;
}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {

#topper {
	width:100%;
}

#topper-inside {
	width:100%;
}

#topper-content {
	width:100%;
}

.library-jump input {
	display:none !important;
}

.topper-search {
	display:none;
}

}

@media only screen and (max-width : 800px),
only screen and (max-device-width : 800px) {
	
.topper-hdi {
	display:none;
}
	
.topper-flex {
	display:none;
}

#topper-content a img {
	display:none;
}

.library-jump {
	padding-right:0px;
}



.topper-container {
	height:40px;
}

.topper-button {
	height:30px;
	width:30px;
}

.topper-menu-button {
	display:inline-block;
	padding:0px 10px;
}

.topper-link-well a {
	padding-left:10px !important;
}

.topper-link-well {
	padding-top:12px !important;
}

.topper-var-button {
	display:inline-block;
}

.topper-var-link {
	display:none;
}

}

@media only screen and (max-width : 605px),
only screen and (max-device-width : 605px) {
	
.topper-link-well a {
	padding-left:10px !important;
}

.topper-link-well {
	padding-top:12px !important;
}
	
}

@media only screen and (max-width : 580px),
only screen and (max-device-width : 580px) {
	
.topper-var-button {
	display:inline-block;
}

.topper-var-link {
	display:none;
}


}

@media only screen and (max-width : 400px),
only screen and (max-device-width : 400px) {
.topper-extra-button {
	display:none;
}
}

/*
****************
Nameplate Styles
****************
*/

#nameplate {  width:100%; padding-top:20px;}
#nameplate-logo { /*width:225px;*/ float:right; padding-right:85px; padding-top:10px;  }
#nameplate-explore { width:296px; float:left; padding-left:20px; padding-top:10px; }

.nameplate-logo-imgsize {width:225px; height:auto; }
.nameplate-explore-imgsize {width:296px; height:auto; }

.catalog-input-box {
	border: none;
	height: 25px;
	border-style: solid;
	border-color: #000000;
	border-width: 0px;
	border-radius: 0px;
	width:220px;
	float:left;
	padding:1px;
}

.catalog-wrapper {
	background-color:#000000;
	padding:5px;
	float:right;
	width:258px;
	margin-top:50px;
	margin-right:50px;
}

.catalog-link {
	padding:1px;
}

.catalog-link a {
	text-decoration:none;
	color:white;
	font-size:14px;
	/*font-family:Georgia, 'Times New Roman', Times, serif;*/
}

.catalog-form {
	margin-top:3px;
	height:25px;
}

.catalog-image {
	padding-right:6px;
	padding-bottom:5px;
	background-color:#FFFFFF;
	border-radius:0px;
	float:left;
}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	


#nameplate-logo {
float:right; padding-top:0px; padding-right:0px; }

#nameplate-explore {
float:left; padding-top:10px; padding-left:0px;	
}

}

@media only screen and (max-width : 750px),
only screen and (max-device-width : 750px) {

.catalog-search {
	margin-right:5px;
}

}

@media only screen and (max-width : 675px),
only screen and (max-device-width : 675px) {

#nameplate {
	padding-top:30px;
}

.catalog-wrapper {
	width:96%;
	margin:0px 1%;
	padding:1%;
}

.catalog-input-box {
	width:90%;
}

}

@media only screen and (max-width : 550px),
only screen and (max-device-width : 550px) {




#nameplate-explore { width:148px; float:left; padding-top:10px; padding-left:0px; }	

#nameplate-explore img {width:148px; height:auto; }

	

}


@media only screen and (max-width : 450px),
only screen and (max-device-width : 450px) {



#nameplate-explore { display:none; }

#nameplate-logo { width:100%; padding:20px 0px !important; text-align:center; }
#nameplate-logo a img { width:60%; height:auto; }

.nameplate-logo-imgsize {width:225px; height:auto; }
.nameplate-explore-imgsize {display:none; }

}
	











/*
*************
Header Styles
*************
*/




.catalog {
	font:16px Georgia, "Times New Roman", Times, serif !important;
	padding-right:5px;
}

.catalog a:link {
	color : #FFF;
	font-weight:normal;
	text-decoration:none;
}
.catalog a:visited {
	color : #FFF;

	text-decoration:none;
}
.catalog a:active {
	color : #FFF;
	
	text-decoration:none;
}
.catalog a:hover {
	color : #FFF;
	
	text-decoration:underline;
}

#catalog-search {
	
float:left; background:#61381A; width:100%; height:37px; text-align:center;	
	
}

#catalog-search-text {
	
padding-top:10px; padding-left:10px; font-size:14px;	
		
	
}

#catalog-search-form {
	

clear:both; padding-top:5px; padding-left:10px; height:27px;
	
}


#catalog-search-input {
	
float:left; padding-top:3px; width:90%;	
	
	
}

#catalog-search-input input {
	
	width:80%; height:20px; border:0;
	
}

#catalog-search-button {
	
float:left;padding-left:5px;	
	
	
}


#ask-us-tell-us {
	
margin-left:1px;float:left; padding-top:22px; height:45px;	
	
	
}



@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	
	#catalog-search {
	
width:100%;	
	
}

#catalog-search-input {
	
width:84%;	
	
	
}

#catalog-search-input input {
	
	width:75%;
	
}	

#ask-us-tell-us {
	

display:none;
	
}



}




@media only screen and (max-width : 750px),
only screen and (max-device-width : 750px) {
	
#catalog-search-form {
	

padding-left:0px;
	
}

#catalog-search-text {
	
padding-left:0px;
		
	
}

#catalog-search-input {
	
width:80%;	
	
	
}

#catalog-search-input input {
	
	width:70%;
	
}	
	
	
}




@media only screen and (max-width : 500px),
only screen and (max-device-width : 500px) {
	
#catalog-search-input {
	
width:75%;	
	
	
}
	
#catalog-search-input input {
	
	width:150px; height:20px; border:0;
	
}	

}


@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px) {


	
	
#catalog-search-input input {
	
	width:150px; height:20px; border:0;
	
}	
	
	
}












/*
*************
Navbar Styles
*************
*/



.navbar {
	clear:both;
	padding-top:1px;
}
.navbar-button {
	float:left;
	height:35px;
	margin-left:1px;
	margin-bottom:1px;
	position:relative;
}
.navbar-button-home {
	float:left;
	height:35px;
	position:relative;
}
.navbar-popup {
	background-color:#DCDFCC;
	height:150px;
	left:0;
	position:absolute;
	top:35px;
	visibility:hidden;
	width:210px;
	z-index:2;
}

.navbar-popup2 {
	background-color:#DCDFCC;
	height:270px;
	left:-300px;
	position:absolute;
	top:35px;
	visibility:hidden;
	width:602px;
	z-index:2;
}


.navbar-popup-content {
	font-size:12px;
	line-height:18px;
	padding:10px;
}

.navbar-button-text {
	/*font:16px Georgia, "Times New Roman", Times, serif !important;*/
	font-size:16px;
	display:inline-block;
	padding:7px 0;
	color:#FFFFFF;
	text-decoration:none;
	box-sizing: border-box;
	height: 35px;
}


#home {
width:80px;
}

#books {
width:80px;
}

#research {
width:110px;
}

#movies-and-more {
width:130px;
}

#recently-added {
width:115px;
}

#business {
width:105px;
}

#kids {
width:87px;
}

#teens {
width:97px;
}

#ask-us-tell-us-test {
width:146px;
}

.navbar-button-menu {
	display:none;
	float:left;
	height:15px;
	margin-left:0px;
	position:relative;
	width:100%;
}

#main-menu-top {
	width:100%;
}


@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {

.navbar-button-text {
	/*font: 1.1em Georgia, "Times New Roman", Times, serif !important;*/
	font-size:1.0em;
	padding-top:8px;
}

.navbar-button {
	width:16%
}

#home {
width:8%;
}

#catalog {
width:100%;
}

#books {
width:8%;
}

#research {
width:10%;
}

#movies-and-more {
width:100%;
}

#recently-added {
width:12%;
}

#business {
width:10%;
}

#kids {
width:9%;
}



#teens {
width:9%;
border-bottom-right-radius:0px;
}
#ask-us-tell-us-test {
	display:block;
	width:16.85%;
}

}

@media only screen and (max-width : 810px),
only screen and (max-device-width : 810px) {

.navbar-button-text {
	/*font: 1.0em Georgia, "Times New Roman", Times, serif !important;*/
	font-size:1.0em;
	padding-top:8px;
}

}

@media only screen and (max-width : 800px),
only screen and (max-device-width : 800px) {

.navbar-button-text {
	/*font:1.25em Georgia, "Times New Roman", Times, serif !important;*/
	font-size:1.25em;
}

.navbar-button {
	display:none;
}

.navbar-button-home {
	display:none;
}

.navbar-button-menu {
	display:block;
}

#divmain-menu-top {
	display:block;
}

#ask-us-tell-us-test {
	display:none;
}

.navbar-popup-content {
	font-size:16px;
	line-height:24px;
	padding:10px;
}


.navbar-popup {
	height:auto;
}

}


/*
**************
RESEARCH NAVBAR
**************
*/
.research-menu p {
	display:inline-block;
	margin:6px 0;
}

.research-menu a {
	background-color:#758146;
	padding:7px;
	color:#FFFFFF;
	text-decoration:none;
	margin:3px;
	font-size:12px;
}

.research-menu a:hover {
	text-decoration:underline;
}

.research-nav a:hover {
color:#FFF;
text-decoration:underline;
}

.research-nav ul {
display:inline-block;
list-style:none;
padding-left:0px;
}

.research-nav li {
/*background-color:#758146;*/
float:left;
margin:8px 3px;
font-size:12px;
}

.research-nav li a {
background-color:#758146;
padding:7px;
}

.research-nav a:link,.research-nav a:visited,.research-nav a:active {
color:#FFF;
text-decoration:none;
}

.research-nav-heading {
	background-color:transparent !important;
	margin:3px !important;
	font-size:16px !important;
}

/*
***************
Dropdown Styles
***************
*/


#dropdown_home {
	clear:both;
	background:url(/images_global/layout/gold_bar.gif) no-repeat;
	width:960px;
	height:29px;
	padding-top:11px;

}

#dropdown_home2 {
	clear:both;
	background:url(/images_global/layout/gold_bar.gif) no-repeat;
	width:960px;

	padding-top:11px;

}

#dropdown_home div {

}

.dropdown_home_social {
	width:294px;
	text-align:right;
	float:left;
}

.dropdown_home_social img {
	
	width:20px;
	border:none;
}

.dropdown_home_form1 {
	
	float:left;
	width:220px;
	text-align:center;
}

.dropdown_home_form2 {
	float:left;
	width:200px;
	text-align:center;
}

.dropdown_home_form3 {
	float:left;
	width:205px;
	text-align:center;
}

.dropdown_home_form_select {
	width:184px;
	font-size:.9em;
	font-weight:bold;
}














/*
************
Quote Styles
************
*/

.quote-div {
		background:#CBD894;
    clear: both;
    color: #000000;
    /*font-family: Georgia,'Times New Roman',Times,serif;*/
    padding-bottom: 20px;
    padding-top: 20px;
    text-align: center;
    width: 100%;
	}



@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	
.quote-div {
	width:100%;
	
}

.quote {
	width:100%;
	
}



}







/*
*****************
Footer Styles
*****************
*/


/* GEOFFS NEW STYLES - compiled from Sass */
footer.site-footer {
  padding: 0; }

ul.footer-nav {
  margin: 0;
  padding: 0;
  text-align: center;
  position: relative;
  list-style-type: none !important; }
  ul.footer-nav li {
    padding: 0;
    margin: 0; }
    ul.footer-nav li a {
      display: block;
      width: 100%;
      padding: 8px 12px;
      background-color: #758146;
      font-size: 14px;
      line-height: 1.485;
      font-weight: normal;
      text-align: center;
      color: #FFF;
      text-decoration: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
    ul.footer-nav li:hover a {
      background-color: #5f6938; }


/* non-sass compiled */
.sub-footer {
	margin-bottom: 120px;
}

/* LEFT COLUMN */
.sub-footer .boilerplate {
	padding-top: 40px;
	text-align: right;
}
@media only screen and (max-width : 767px),
only screeen and (max-device-width : 767px) {
.sub-footer .boilerplate {
	text-align: center;
}
}

/* RIGHT COLUMN */
.sub-footer .social {
		padding-top: 40px;
}
@media only screen and (min-width : 1190px),
only screeen and (min-device-width : 1190px) {
/* 20px increased min-width to account for negative right margin which causes horizontal scroll from 1170-1189 */
/* removed right padding on .container and -10px margin on .social allows last item to sit flush */
.container.sub-footer {
	padding-right: 0;
  overflow: hidden;
}
.sub-footer .social {
	padding-right: 0;
	margin-right: -10px;
}
}

/* SHARING BUTTONS */
.sub-footer .social .grid-link {
  /*background-color: #758146; */
  margin: 0 0 20px 0;
  text-decoration: none;
}
.sub-footer .social .grid-link:hover {
  text-decoration: underline;
}
.sub-footer .social .grid-link img {
  width: 100%;
  background-color: #758146;
  padding: 10%;
}
.sub-footer .social .grid-link:hover img {
  background-color: #5f6938;
}
/* END GEOFFS NEW STYLES */












/* POSSIBLY NO LONGER IN USE: TODO */
.footer-new {
	overflow:auto;
	background:#DCDFCC;
	border-bottom:15px solid #758146;
	padding-bottom:0px;
	clear:both;
}

.fc-more {
	display:none;
	text-align:center;
	background-color:#DCDFCC;
	clear:both;
	border-right:1px solid #758146;
	border-left:1px solid #758146;
	border-top:none;
}

.fc-more a {
	font-size:13px;
	line-height:18px;
	display:inline-block;
	padding:4px 0px;
}

.fc-more a:link {
	color:#61381A;
}

.fc-more a:visited {
	color:#485E34;
}

.fc-more a:active {
	color:#485E34;
}

.fc-more a:hover {
	color:#B7610B;
}


.fc-standard {
	display:inline-block;
	zoom:1;
	*display:inline;
	width:159px;
	text-align:center;
	color:#FFFFFF;
	padding-top:7px;
	height:28px;
	vertical-align:top;
	/*font:16px Georgia, "Times New Roman", Times, serif !important;*/
	font-size:16px;
	float:left;
	border-bottom: thin solid #DCDFCC;
	border-right:none;
	margin-left:1px;
	position:relative;
	background-color:#758146;
}

.fc-standard a {
	color:#FFFFFF;
	font-weight:normal;
}

.fc-standard a:hover {
	text-decoration:none;
	color: #758146;
}

.fc-right-outer {
	border-right:none;
	width:160px;
}

.fc-left-outer {
	margin-left:0px;
	width:159px;
}

@media only screen and (max-width : 960px),
only screeen and (max-device-width : 960px) {

.fc-more {
	display:none !important;
}

.fc-standard {
	width:33%;
	margin-left:0px;
	margin-right:0px;
	border-right:thin solid #DCDFCC;
}

.footer-new {
	background-color:#758146;
}
}

@media only screen and (max-width : 500px),
only screen and (max-device-width : 500px) {

.fc-standard {
	width:49.5%;
}

}


/*
******************
Right Sidebar Styles
******************
*/


.rightsidebar-main {
	float:left;
	width:63%;
}

.rightsidebar-sidebar-container {
	float:left;
/*	width:300px;*/
	width:31%;
	margin:20px;
}

.rightsidebar-sidebar-container-locations {
	margin-top:0px;
}

.rightsidebar-sidebar-body {
	background-color:#fee4ba;
	padding:20px;
}

.kids-sidebar-color {
	background-color:#dce5b2 !important;
}

.sidebar-color-fern {
	background-color:#ebeddf !important;
}

@media only screen and (max-width	:	700px),
only screen and (max-device-width	:	700px) {

	.rightsidebar-main {
		width:100%;
	}

	.rightsidebar-sidebar-container {
		width:100%;
		margin:0px;
	}

}



/*
******************
SIL 2017 - Right Sidebar Styles - Geoff 3/21/2017
******************
*/

.sidebar {
  background-color:#fee4ba;
  padding:20px;
}









/*
***************************
Video Youtube Iframe Styles
***************************
*/

		.video-wrapper {
			width:100%;
			position:relative;
			overflow:hidden;
			height:0;
			padding-top:30px;
			padding-bottom:56.25%;
		}
		
		.video-wrapper iframe,
		.video-wrapper object,
		.video-wrapper embed {
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
		}
		
		.mini-video-wrapper {
			width:48%;
			margin:5px 1%;
			float:left;
		}
		
		@media only screen and (max-width:550px),
		only screen and (max-device-width:550px) {
			.mini-video-wrapper {
				width:100%;
				margin:5px 0;
			}
		}


/*
******************
Book Slider Styles
******************
*/



.jcarousel-control {
	margin-top: 1px;
	margin-bottom: 0px;
	margin-right:30px;
	text-align: right;
}
.jcarousel-control a {
	font-size: 100%;
	text-decoration: none;
	padding: 0 1px;
	margin: 0 0 1px 0;
	font-weight: bold;
}
.jcarousel-control a:hover {
	font-size: 100%;
	text-decoration: underline;
	padding: 0 1px;
	margin: 0 0 1px 0;
	font-weight: bold;
	outline: none;
}
.jcarousel-control a.active {
	font-size: 100%;
	text-decoration: underline;
	padding: 0 1px;
	margin: 0 0 1px 0;
	font-weight: bold;
	outline: none;
}
.jcarousel-scroll {
	margin-top: 10px;
}
.jcarousel-scroll form {
	margin: 0;
	padding: 0;
}
.jcarousel-scroll select {
	font-size: 75%;
}
#mycarousel-prev {
	cursor: pointer;
	margin-bottom: -10px;
	text-decoration: underline;
	font-size: 11px;
}
#mycarousel-next {
	cursor: pointer;
	margin-bottom: -10px;
	text-decoration: underline;
	font-size: 11px;
}





.hidden
{position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;}



/*

SPECIFIC PAGES

*/


.body-6789 {float:left; width:525px;}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	
.body-6789 {width:100%; }
}

/*
LIBRARY ON WHEELS:COMMUNITY STOP LOCATIONS
*/

.sil-low-syo {
	color:#F00000;
	font-style:italic;
	font-weight:bold;
}

.sil-low-rt-title {
	font-weight:bold;
	font-size:18px;
}

.sil-low-rt-days {
	font-style:italic;
	font-weight:bold;
	padding-bottom:10px;
}

.sil-low-rt-table {
	display:inline-block;
	vertical-align:top;
	margin:10px;
	width:45%;
	text-align:left;
}

.sil-low-rt-sep {
	border-bottom: solid medium;
}

@media only screen and (max-width:730px),
only screen and (max-device-width:730px) {
	.sil-low-rt-table-sep {
		border-top: solid medium;
	}
	
	.sil-low-rt-table {
		width:100%;
		margin:10px 0;
	}
}

/*
LOCATIONS AND HOURS GOOGLE MAP
*/

.google-iframe-wrapper {
	position:relative;
	padding-bottom:65.25%;
	padding-top:30px;
	height:0px;
	overflow:hidden;
}

.google-iframe-wrapper iframe {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.locations-library-well {
	display:inline-block;
	width:27%;
	vertical-align:top;
}

.locations-map-legend {
	display:inline-block;
	width:45%;
	vertical-align:top;
}

.locations-content-well {
	position:relative;
}

.locations-map-legend-addinfo {
	margin-top:20px;
	padding-left:20px;
	padding-right:20px;
	font-size:16px;
}

.locations-print-maps {
	padding-bottom:10px;
	padding-right:10px;
	text-align:right;
}

@media only screen and (max-width : 825px),
only screen and (max-device-width : 825px) {

.locations-map-legend {
	display:block;
	width:95%;
	position:absolute;
	top:0;
	left:4%;
}

.locations-library-well {
	margin-top:250px;
	width:45%;
	padding-left:20px;
}

}

@media only screen and (max-width : 450px),
only screen and (max-device-width : 450px) {

.google-iframe-wrapper {
	display:none;
	padding:0px;
}

.locations-map-legend {
	display:none;
}

.locations-print-maps {
	display:none;
}

.locations-library-well {
	width:100%;
	padding:0px;
	margin-top:0px;
	text-align:center;
}

.locations-library-well-right {
	margin-top:-3px;
	margin-bottom:10px;
}

.locations-library-well p {
	padding: 0px; 
	margin: 2px 5px 2px 5px;
}

.locations-library-well p a{
	display: block; 
	padding: 15px; 
	margin: 3px; 
	border-radius: 15px; 
	background-color: #758146; 
	text-decoration: none; 
	color: #ffffff; 
	font-weight: bold;
}

.locations-area-thmb {
	display:none;
}

.locations-map-legend-addinfo {
	margin:0px;
}

}

/*

RECENTLY ADDED/NEW ITEMS TO SNO-ISLE LIBRARIES

*/

.recentlyadded-menu {
	display:none;
}

@media only screen and (max-width : 700px),
only screen and (max-device-width : 700px) {

	.recentlyadded-menu {
		display:inline;
	}

}
/*

BOARD OF TRUSTEES

*/

.lead {
	width:140px;
	padding:5px 45px 5px 5px;
	float:left;
}

.member {
	height:210px;
}

.officer {
	height:260px;
}

@media only screen and (max-width:400px),
only screen and (max-device-width:400px) {
	.lead {
		padding:5px;
	}
	
	.member, .officer {
		height:280px;
	}
}

/*

CAMANO ISLAND VIDEO

*/

.camano-island-video {
	float:left;
	width:320px;
	padding-left:40px;
}

@media only screen and (max-width:600px),
only screen and (max-device-width:600px) {
	.camano-island-video {
		padding:0;
		width:100%;
	}
}

/*

COUPEVILLE WEBCAM

*/

.coupeville-webcam, .coupeville-webcam img {
	width:100%;
}

/*

CREATIVE TECH CENTER

*/

.ctc-div {
	display:inline-block;
	width:50%;
	vertical-align:top;
}

.ctc-div ul, .ctc-div ul li {
	margin-top:0px;
}

.ctc-div li {
	margin-bottom:5px;
}

.ctc-ul-nopad {
	padding-left:15px;
}

.ctc-video {
	display:inline-block;
	width:49%;
}

.ctc-img {
	display:inline-block;
	width:250px;
	vertical-align:top;
}

@media only screen and (max-width : 500px),
only screen and (max-device-width : 500px) {
	.ctc-div {
		width:100%;
	}
	
	.ctc-video {
		width:100%;
	}
	
	.ctc-div ul {
		margin-top:20px;
	}
	
	.ctc-img {
		width:100%;
	}
	
	.ctc-ul-nopad {
		padding-left:inherit;
	}
}

/*

RESPONSIVE DESIGN

*/

.grid-research { text-align:center; }

.grid-box-research { float:left; width:200px; background-color:#ebefd3; margin:15px; }
.grid-box-research .header {text-align:center; padding:10px; background-color:#cbd894; font-size:15px;}
.grid-box-research .content { padding:0px; }
.h145 { height:160px; }

.grid-box { float:left; width:170px; background-color:#ebefd3; margin:10px; }
.grid-box .header {display: block; text-align: center; padding: 10px; background-color:#cbd894; font-size:14px; }
.grid-box .content { padding:10px; font-size:12px; }
.h200 { height:200px; }
.h155 { height:155px; }

.grid-box-lg { float:left; width:280px; background-color:#ebefd3; margin:10px; }
.grid-box-lg .header {width:260px; text-align:center; padding:10px; background-color:#cbd894; font-size:14px; }
.grid-box-lg .content { padding:10px; font-size:12px; }
.h420 { height:460px; }


.teen-slider-wrapper-research {
	width:480px;
	float:left;
	padding-left:0px;
	padding-top:15px;
}

.teen-inside-content-research {
	float:left;
	margin-left:20px;
	margin-top:7px;
	padding-left:20px;
	width:750px;
}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	.teen-slider-wrapper-research {
		width:95% !important;
		padding-left:20px !important;
	}
	.teen-inside-content-research {
		margin-left:20px !important;
		width:95%;
	}
	.teen-homework-help-body {
		width:95% !important;
	}
}


@media only screen and (max-width : 700px),
only screen and (max-device-width : 700px) {
.grid-box { width:100%; margin:10px 0; }
.grid-box .header {width:auto; }
.grid-box .content { display:none; }
.h200 { height:auto; }
.h155 { height:auto; }


.grid-box-lg { width:100%; margin:0; }
.grid-box-lg .header {width:auto; }
.grid-box-lg .content { text-align: center; padding:0px; font-size:100%; }
.h420 { height:auto; }

.low-vid-cell {
	width:100% !important;
	margin:0 !important;
}

.teen-slider-wrapper-research {
	padding-left:0px !important;
}
.teen-inside-content-research {
	margin-left:0px !important;
	padding-left:10px;
	width:95%;
}

}

@media only screen and (max-width : 460px),
only screen and (max-device-width : 460px) {
/*.grid-box-research { margin-left:auto; margin-right:auto; float:none; }*/
.grid-box-research { display:inline-block; float:none; }
}

.view-mobile { display:none;  }
.view-desktop { display:block;  }

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {

.view-mobile { display:block; text-align:center; }
.view-desktop { display:none; }

}


.leadership-box { float:left; width:190px; margin:0px; font-size:12px; }
.leadership-break { clear:both; }

@media only screen and (max-width:400px),
only screen and (max-device-width:400px) {
	.leadership-box { width:135px; margin:5px; }
}

.content-box-225 {

float:left;
width:275px;
margin-right:10px;	
min-height:325px;
/*overflow:none;*/
}



.labels-list ol{
    list-style-type: none;
    list-style-type: decimal !ie; /*IE 7- hack*/
     
    margin: 0;
margin-top:20px;
    margin-left: 1em;
    padding: 0;
     
    counter-reset: li-counter;
}
.labels-list ol> li{
    position: relative;
    margin-bottom: 1.5em;
    padding: 10px;
	
    background-color: #e9ecd9;
}
.labels-list ol> li:before {
    position: absolute;
    top: -0.3em;
    left: -0.5em;
    width: 1.8em;
    height: 1.2em;
     
    font-size: 20px;
    line-height: 1.2;
    font-weight: bold;
    text-align: center;
    color: #FFFFFF;
    background-color: #b7610b;
     
    transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    z-index: 99;
    overflow: hidden;
     
    content: counter(li-counter);
    counter-increment: li-counter;
}




/* 

*****  KIDS STYLES *****

*/

.navbar-kids-rd {
	display: none;
}

.kids-active-img {
	width:320px;
	display:inline-block;
	float:right;
}

.kids-game-icon {
float:left; width:110px; height:146px; overflow:none; margin:10px; padding:5px; background-color:#F9C96F; text-align:center;  
}


.kids-header-wrapper {
  width:100%;
  height:0;
  padding-bottom:29.2%;
  overflow:hidden;
  position:relative;    
}
.kids-header-wrapper iframe {
  position:absolute;
  top:0;
  left:0;
  width:1px !important;
  min-width:100% !important;
  * width:100% !important;
  height:100% !important;
}
.kids-generic-wrapper {
  width:100%;
  height:0;
  padding-bottom:100%;
  overflow:hidden;
  position:relative;    
}
.kids-generic-wrapper iframe {
  position:absolute;
  top:0;
  left:0;
  width:1px !important;
  min-width:100% !important;
  * width:100% !important;
  height:100% !important;
}


.kids-home-green-box {


  min-height:332px;
  margin:25px 0px 10px 0px;
  padding:10px;
  background-color:#e7e9d6;
}


.libchat_btn_img {
  width:180px !important;
  height:160px !important;
}

 /* 
.kids-home-promo-box {
  float:left;
  width:350px;
   height:180px;
  margin:0px 0px 10px 0px;
  padding:0px;

}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
  .kids-home-promo-box {
    width:45%;
    height:auto;
  }
}

@media only screen and (max-width : 640px),
only screen and (max-device-width : 640px) {
  .kids-home-promo-box {
    width:100%;
    margin:0 0 10px 0;
    padding:0;
    height:auto;
  }
}*/







@media only screen and (max-width : 767px), only screen and (max-device-width : 767px) {
.kid-poll-result-wrapper {
	width:100%;
}
.kid-poll-result-wrapper img {
	width:100%;
}
.kid-poll-result-wrapper table {
	width:auto !important;
}
.navbar-kids {
	display: none;
}
.navbar-xtra {
	display: none;
}
.navbar-kids-rd {
	display: block;
}
}


.navbar-kids ul, .navbar-kids ol, .navbar-kids dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
	display: inline-block;
	list-style-type: none;
	/* [disabled]list-style-position: inside;
*/
}
.navbar-kids {
	/*background-color: #DCDCDC;*/
}
/* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
.navbar-kids ul {
	list-style: none; /* this removes the list marker */
	/*border-top: 1px solid #666;*/ /* this creates the top border for the links - all others are placed using a bottom border on the LI */
	margin-bottom: 10px; /* this creates the space between the navigation on the content below */
	display: inline-block;
  width: 100%;
}
.navbar-kids li {
	/*border-bottom: 1px solid #666;*/ /* this creates the button separation */
	/*color: #00AEEF;*/
	margin: 0px;
}
.navbar-kids a, .navbar-kids a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
	padding: 5px 5px 5px 15px;
	display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
	width: 100%;  /*this width makes the entire button clickable for IE6. If you don't need to support IE6, it can be removed. Calculate the proper width by subtracting the padding on this link from the width of your sidebar container. */
	text-decoration: none;
	/*background-color: #dcdcdc;*/
}
.navbar-kids a:hover, .navbar-kids a:active, .navbar-kids a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
/*	background-color: #00aeef;
	color: #FFF;*/
}

.navbar-kids li a.active, .navbar-kids-header a {
  background-color:#00aeef;
  color: white;
  font-weight: bold;
}

.navbar-kids-header a {
  background-color: #0096d6;  
  margin-top: 10px;
}

.navbar-kids li a.active:hover,
.navbar-kids-header a:hover,
.navbar-kids li a.active:active,
.navbar-kids-header a:active,
.navbar-kids li a.active:focus,
.navbar-kids-header a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
	color: white;
}



.kids-hh-button { background-color:#DEDEDE; padding:10px; }



@media only screen and (max-width:700px),
only screen and (max-device-width:700px) {
	img {
		max-width:100% !important;
		height:auto !important;
	}
	
	table {
		max-width:100% !important;
	}
	
	.sil-rss {
		max-width:16px !important;
	}
}

@media only screen and (max-width:355px),
only screen and (max-device-width:355px) {
	.kids-book-cover {
		display:block;
		text-align:center;
		margin:3px 0;
	}
	
	.kids-active-img {
	width:100%;
	display:block;
	float:none;
}

}
/*

***** GENERIC BOOKSLIDER WRAPPER *****

*/

@media only screen and (max-width:960px),
only screen and (max-device-width:960px) {
	.slider-wrapper {
		max-width:100% !important;
	}

	.slider-wrapper iframe {
		max-width:100% !important;
	}
}


/*

***** RECENTLY ADDED AND BOOKLIST *****

*/

.request-form {
	background-color:#DCDFCC;
}

.recentlyadded-info {
	vertical-align:top;
	padding:10px;
	float:left;
	width:47%;
}

.recentlyadded-buttons {
	vertical-align:top;
	padding:10px;
	float:left;
	width:130px;
	text-align:center;
}

.rambuttons {
	display:none;
}

@media only screen and (max-width:800px),
only screen and (max-device-width:800px) {
	.recentlyadded-info {
		width:65%;
	}
	.recentlyadded-buttons {
		padding:3px;
		clear:left;
		display:none;
	}
	.rambuttons {
		display:block;
		text-align:center;
	}
}

@media only screen and (max-width:640px),
only screen and (max-device-width:640px) {
	.recentlyadded-info {
		width:45%;
	}
}


/*

***** ARTWORK @ SNOISLE *****
*/

.library-artwork {
	clear:both;
	width:920px;
}

.library-artwork-image-wrapper {
	float:left;
	width:450px;
}

.library-artwork-image {
	border-color:#000;
	border-style:solid;
	width:100%;
}

.library-artwork-info {
	padding:10px;
	float:left;
	width:440px;
}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px) {
	.library-artwork {
		width:100%;
	}
	
	.library-artwork-info {
		width:45%;
	}
	
	.library-artwork-image-wrapper {
		width:48%;
	}
}

@media only screen and (max-width : 550px),
only screen and (max-device-width : 550px) {
	.library-artwork-info {
		width:100%;
		padding:10px 0px;
	}
	
	.library-artwork-image-wrapper {
		width:100%;
	}
	
	.library-artwork-image {
		border:none;
	}
}

/*

***** HISTORICAL PHOTO ARCHIVE *****

*/
.historical-random-photos {
	background-color:#DCDFCC;
	width:100%;
}

.hpa-instr {
	float:left;
	width:25%;
}

.hpa-desc {
	float:right;
	width:75%;
}

@media only screen and (max-width : 520px),
only screen and (max-device-width : 520px) {
	.hpa-instr {
		width:100%;
	}
	
	.hpa-desc {
		width:100%;
	}
}

/*

***** GENERIC CLASSES FOR RESPONSIVE DESIGN *****

*/

/*TABLE*/

.de-table td {
	border:1px solid #000000;
	border-collapse:collapse;
	padding:5px;
}

.de-table tbody {
	border:1px solid #000000;
	border-collapse:collapse;
}

@media only screen and (max-width:760px),
only screen and (max-device-width:760px) {
	.de-table, .de-table thead, .de-table tbody, .de-table th, .de-table tr, .de-table td {
		display:block;
	}

	.de-table thead tr {
		position:absolute;
		top:-9999px;
		left:-9999px;
	}
	
	.de-table td {
		border:none;
		position:relative;
		word-wrap:break-word;
		padding:5px 0;
		text-align:center;
		width:95%;
	}
	
	.de-table tr {
		border-bottom:1px solid #000000;
	}
}

/*HOMEWORK HELP*/

.homework-help-buttons {
	margin:10px 0;
	text-align:center;
}

@media only screen and (max-width:710px),
only screen and (max-device-width:710px) {
	.homework-help-buttons a {
		display:inline-block;
		width:24%;
	}
	
	.homework-help-buttons a img {
		width:100% !important;
		height:auto !important;
		margin:0 !important;
	}
}

@media only screen and (max-width:570px),
only screen and (max-device-width:570px) {
	.homework-help-buttons a {
		width:49%;
	}
	
	.homework-help-table, .homework-help-table thead, .homework-help-table tbody, .homework-help-table th, .homework-help-table tr, .homework-help-table td {
		display:block;
	}
	
	.homework-help-table thead tr {
		position:absolute;
		top:-9999px;
		left:-9999px;
	}
	
	.homework-help-table td {
		width:99%;
		clear:both;
	}

}