/*CSS Reset*/
html, body, div, span, applet, object, iframe,
p, pre, abbr, acronym, address, cite, code,
del, dfn, img, ins, kbd, q, s, samp,
tt, var, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

h1, h2, h3{margin: 0; padding: 0; font-weight: normal;}

img.centered, .aligncenter, div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}

.alignright {
float: right;
}

.alignleft {
float: left;
}
h1 a, h2 a, h3 a, h4 a{color: #0a9907}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover{color: #000}
a{color: #015985; text-decoration: none}
a:hover {color: #000; text-decoration: none;}
a:hover, input#searchsubmit:hover{cursor: pointer;}

input[type="text"], input[type="email"], input[type="password"], textarea, select{
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   outline: none
}

p{
margin: 0 0 20px 0;
}

.imageright {
text-align: right;
}

img{max-width: 100%; height: auto}

.clear{clear: both}

/*End of Reset*/
html, body{padding: 0; margin: 0;}
body{font-size: 16px; line-height: 1.3; background-color: rgb(221, 221, 221);}
.wrap{width: 92%; max-width: 1096px; margin: 0 auto; padding: 0 4%; position: relative; clear: both; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif}

@media only screen and (min-width: 1125px){
	.wrap{width: 100%; padding: 0;}
}

.padded-body, .secondary-nav-wrap{width: 92%; margin: 0 auto; max-width: 1096px; border-left: 1px solid #fff; border-right: 1px solid #fff; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif}

.top{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c8d1d9+0,ffffff+100 */
background: rgb(200,209,217); /* Old browsers */
background: -moz-linear-gradient(top, rgba(200,209,217,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(200,209,217,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(200,209,217,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c8d1d9', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
padding-top: 15px;
}


.search{padding: 0 2%; padding-top: 20px; overflow: hidden; color: #000}
#logo{float: left; width: 20%;}
#search{float: right; width: 75%; padding-top: 23px;}
#search form{position: relative; padding: 0;}
#search .form-group{width: 100%; padding: 0; margin: 0}
#search form label{display: none}
#search form input[type="search"]{border-radius: 0; margin: 7px 0; width: 100%; font-size: 1em; height: 68px;}
#search-options{padding: 20px 0}
#search-options label{margin-right: 100px; font-size: 1.2em; margin-left: 0; padding: 0 5px}
#search input[type="submit"]{background-color: #000; color: #fff; border-radius: 0; margin: 0; position: absolute; right: 10px; top: 19px; font-size: 1.3em; height: 45px;}
#search input[type="submit"]:hover{background-color: #000}
#search h3{color: #000; text-align: right; font-size: 1.5em; padding-top: 4px;}

#search form input[type="search"]{-webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important; outline: none;}


@media only screen and (max-width: 1330px){
	#logo{width: 25%}
	#search{width: 75%; padding-top: 27px;}
	#search form{padding: 5px 0}	
	#search input[type="submit"]{top: 24px}
}

@media only screen and (max-width: 1120px){
	#logo{width: 30%}
	#search{width: 70%}
  #search-options label{margin-right: 75px;}
}

@media only screen and (max-width: 1020px){
	#logo{width: 35%}
	#search{width: 65%}
  #search-options label{margin-right: 50px;}
}

@media only screen and (max-width: 920px){
	.search{padding-top: 50px;}
	#logo{float: none; width: 100%; text-align: center; margin-bottom: 30px;}
	#search{float: none; width: 100%;}
	#search h3{text-align: center;}
	
}

@media only screen and (max-width: 520px){
	#search-options label{ margin: 0; font-size: .875em}
}

#resource-overlay{background-color: transparent; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; display: none;}

#primary-menu{display: table;padding: 0 2%; position: relative; margin: 0; margin: 0 auto; max-width: 100%; width: 100%;}
#primary-menu li{display: table-cell;}
#primary-menu .mega-menu{display: none}
#primary-menu li.opened .mega-menu{display: block; position: absolute; left: 16.5% !important; width: 66%; 
	background-color: #fff; z-index: 12; padding: 10px; margin-top: -3px;}

#primary-menu li.events{position: static;}
#primary-menu li.opened .mega-events{width: 66%}
#primary-menu li.opened .mega-resources{right: 0; left: auto}
#primary-menu li.resources{border: 0; padding: 0}

#primary-menu .col-2 .col{float: left; width: 50%;}
#primary-menu .col-2 .col:nth-child(2){float: right;}
#primary-menu .col-3 .col{float: left; width: 29%;}
#primary-menu .col-3 .col:nth-child(2){margin: 0 6%}
#primary-menu .resources .col:nth-child(2){float: left}
#primary-menu .resources .col:nth-child(3){float: right}

#primary-menu .item{overflow: hidden; margin-bottom: 10px;}
#primary-menu .item a{font-size: .875em; text-transform: uppercase; margin-bottom: 5px !important; display: block; width: 90%; float: right;}
#primary-menu .item .description{font-size: .875em; float: right; width: 90%; padding: 0 0 0 30px}
#primary-menu .item .description p{padding: 0 !important; margin: 0 0 5px 0 !important}
#primary-menu .item .description a{text-transform: none; float: none; display: inline; font-size: 1em}
#primary-menu .item .icon{width: 50px; max-width: 10%; float: left;}
#primary-menu .item .icon img{max-width: 80%}
#primary-menu .resources{border-bottom: 5px solid #000; margin-bottom: 30px; padding-bottom: 30px}
#primary-menu .resources h5{display: block; font-weight: bold; font-size: 1em; margin-right: 10px;}
#primary-menu .resources a{display: inline-block; margin: 0 5px;}
#primary-menu .featured-event h1{font-size: 1.2em; font-weight: bold; text-transform: uppercase; margin-bottom: 10px;}
#primary-menu .featured-event .item h3 a{font-size: 1em; text-transform: none !important; color: #015985}
#primary-menu .featured-event .item{margin: 20px 0; overflow: hidden;}
#primary-menu .featured-event img{max-height: 250px; width: auto}
#primary-menu .owl-dots{display: none}
#primary-menu .owl-stage-outer{border: 0;}

@media only screen and (max-width: 980px){
	
  #primary-menu .col-3 .col{float: left; width: 45%;}
  #primary-menu .col-3 .col:nth-child(2){margin: 0;}
	#primary-menu .col-3 .col:nth-child(3){}
}

@media only screen and (max-width: 780px){
	#primary-menu .item{font-size: .875em}	
  #primary-menu .col-3 .col{float: left; width: 48%;}
  #primary-menu .col-2 .col{float: left; width: 48%;}
}

@media only screen and (max-width: 640px){
  #primary-menu .col-3 .col{float: none; width: 100%;}
  #primary-menu .col-2 .col{float: none; width: 100%;}
  #primary-menu li.opened .mega-events,
  #primary-menu li.opened .mega-resources{left: 3%; width: 94%; right: auto}
}


#primary-menu a.primary-block{display: block; width: 94%; color: #fff; 
background-color: #4d738a; text-transform: uppercase; 
font-size: 1em; font-weight: bold; padding: 10px 3% !important; border: 3px solid #fff;
  margin: 0 !important;
	text-align: center;
	font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
	text-decoration: none
}
#primary-menu a.primary-block:hover{background-color: #DC8C18}
#primary-menu a..primary-block span{font-size: 2em; position: relative; top: 8px; line-height: 0}

@media only screen and (max-width: 945px){
	#primary-menu a.primary-block{font-size: 1em}
	
}

@media only screen and (max-width: 720px){
	#primary-menu{max-width: 100%}
	#primary-menu a.primary-block{font-size: 1em}
}


@media only screen and (max-width: 620px){
	
  #primary-menu{display: block; padding: 0; margin: 0}
  #primary-menu li{display: block; position: relative; width: 100%;}
	#primary-menu a.primary-block{font-size: 1em; width: 100%;}
	
#primary-menu li.opened .mega-menu{left: 3% !important; width: 94% !important;}
}

.orange{background-color: #DC8C18; text-align: left; margin-top: 10px;}
.orange.white{margin-top: 0; background-color: #fff;}
.orange ul{list-style-type: none; margin: 0; padding: 0;}
.orange ul li{display: inline-block; margin: 0;}
.orange ul li:first-child{border-left: 0; padding-left: 0;}
.orange ul li:last-child{margin-right: 0}
.orange ul li a{display: block; padding: 5px 10px; color: rgb(66, 78, 93); text-transform: normal; font-weight: bold; font-size: .813em}
.orange ul li a:hover{color: #fff; background-color: rgb(66, 78, 93) !important;}
.secondary-nav-wrap .wrap{ padding: 0; width: 100%;}
#secondary-menu{position: absolute; right: 0; top: 20px; background-color: #fff; width: 74%; text-align: left;}
#secondary-menu li a{font-size: .965em; color: #DC8C18; padding: 5px 0; padding-left: 10%; padding-right: 10%}
#secondary-menu ul{display: none}
#secondary-menu li:hover a{background-color: transparent; color: #fff}
#secondary-menu li:hover{background-color: rgb(66, 78, 93)}
#secondary-menu li{position: relative; display: inline-block !important; float: none !important}
#secondary-menu li:hover ul{display: block; border-top: 1px solid #fff; position: absolute; top: 27px; left: 0px; padding-top: 10px; padding-bottom: 10px; width: 250px; background-color: rgb(66, 78, 93); color: #fff; z-index: 100}
#secondary-menu ul li{text-align: left; width: 100%; border: 0; padding: 0; margin: 0}
#secondary-menu ul li a{text-align: left; display: block; width: 100%; padding: 5px 10px; color: #fff; font-weight: normal }
#secondary-menu ul li a:hover{text-decoration: underline}
#secondary-menu li:hover ul li ul, #secondary-menu li:hover ul li:hover ul li ul{display: none}
#menu-item-13662{width: 110px}
#menu-item-13669{width: 160px}
#menu-item-13668{width: 195px}
#menu-item-13670{width: 195px}
#menu-item-13671{width: 90px}

@media only screen and (max-width: 1145px){
	#secondary-menu li a{padding-left: 3px; padding-right: 3px}
	#menu-item-13662{width: 100px}
	#menu-item-13669{width: 150px}
	#menu-item-13668{width: 185px}
	#menu-item-13670{width: 185px}
	#menu-item-13671{width: 80px}
}


@media only screen and (max-width: 1020px){
	#secondary-menu{min-width: 712px;}
}

@media only screen and (max-width: 1020px){
	.top{padding-top: 0}
	#secondary-menu{min-width: 0; position: relative; top: 0; text-align: center; width: 100%;}
}

.middle{margin-top: 20px;}
.white-bar{width: 100%; height: 20px; background-color: rgb(221, 221, 221); margin: 0 0 30px 0}
.white-bar.footer-grey{margin: 0}

.elibrary{overflow: hidden; padding: 30px 2% 30px 2%}
.elibrary h1{margin-bottom: 40px; position: relative; padding-left: 50px; color: #231f20; font-size: 1.7em}
.elibrary h1 img{position: absolute; top: 0; left: 0; max-width: 30px;}
.elibrary .eicons{display: table; width: 100%;}
.elibrary .eicon{display: table-cell; width: 16.66%}
.elibrary .eicon span{display: block; text-align: center; color: #231f20; font-size: 1.2em;}
.elibrary img{margin-bottom: 10px; max-width: 80px;}
.elibrary .eicon:hover span{color: #fff}

@media only screen and (max-width: 920px){
	
.elibrary .eicons{display: block; width: 100%;}
.elibrary .eicon{display: block; float: left; width: 33.33%; margin-bottom: 30px; font-size: .765em}
	
}

@media only screen and (max-width: 620px){
	
.elibrary .eicons{display: block; width: 100%;}
.elibrary .eicon{display: block; float: left; width: 50%; margin-bottom: 30px;}
	.elibrary .eicon:nth-child(2n+1){clear: both}
}

#owl-carousel{clear: both}
.slide{padding: 20px 2%; overflow: hidden;}
.slide h2{color: #231f20; font-size: 2em; margin-bottom: 30px;}
.slide .description{float: left; width: 48%; padding-bottom: 30px; overflow: hidden}
.slide .content{font-size: 1em; color: #231f20}
.slide .image{float: right; width: 48%;}
.slide .more, #more{float: right; display: block; color: #00aeef; font-size: 1.2em}
.slide .more:hover{color: #000}

#owl-carousel .owl-dots{position: absolute; width: 100%; max-width: 1380px; margin: 0 auto; padding: 0 4%; text-align: right; z-index: 100; bottom: 5px; width: 100%; overflow: hidden;}
.owl-dot span{background-color: #fff !important; display: inline-block; width: 10px; height: 10px; border-radius: 100px;}
.owl-dot{display: inline-block; margin: 0 5px;}
.owl-stage-outer{border-bottom: 30px solid #DC8C18;}
.owl-dot.active span, .owl-dot:hover span{background-color: #000 !important}

@media only screen and (max-width: 920px){
  .slide h2{color: #231f20; font-size: 2.5em; margin-bottom: 30px;}
  .slide .content{font-size: 1em; color: #231f20}
  .slide .more, #more{font-size: 1.5em}
}

@media only screen and (max-width: 620px){
  .slide .description{float: none; width: 100%; padding-bottom: 20px; overflow: hidden}
  .slide .image{float: none; width: 100%;}
}




/* books rotator */
#books-rotator {
	background-color:rgba(0, 0, 0, 0.8);
	width:100%;
	padding:30px 2%;
	overflow: hidden;
	margin-top: 20px;
}

#books-rotator .title{color: #fff; font-size: 1.7em; float: left; margin-bottom: 30px;}

#books-rotator ul{list-style-type: none; margin: 0; float: right;}
#books-rotator li{float: left; margin: 0 0 0 20px;}

#books-wrapper, #book-wrapper {
	width:90%;
	margin:0 auto;
	background-color:#ddd;
	border-radius:15px;
	padding:10px 0;
	margin-bottom:10px;
}
#books-home {
	padding-right:40px;
	width:auto;
}
#books-wrapper {
	width:auto;
	margin:0;
	background:none;
	padding:0;
}
#books {
	position:relative;
	width:580px;
	margin:0 auto;
}
#books .carousel-inner {
	height:160px;
	overflow:hidden;
}


div.middle{background: transparent url('../images/elibrary-background.png') top center repeat-x;}



.callouts{margin-top: 0px; overflow: hidden; padding: 0 2%;}
.callouts .callout{width: 48%; float: left; margin-bottom: 50px;}
.callouts .callout:nth-child(2n+2){float: right;}
.callouts .callout:nth-child(2n+1){clear: both;}
.callouts h2{font-weight: bold; color: #000; font-size: 1.5em; margin-bottom: 10px;}
.callouts .content{color: #000; font-size: 1em}
.callouts img{max-width: 100%; width: 100%; height: auto; margin-bottom: 20px;}

@media only screen and (max-width: 720px){
	.callouts .callout{width: 100%; float: none; clear: both;}

}


/*footer*/
.bottom{background-color: #808080; padding-top: 50px;}
#footer {
	background-color:#808080;
	padding:10px 2%;
	font-size:11px;
}
#footer p {
	padding-left:25px;
	color:#cacaca;
}
#footer ul {
	padding-left:10px;
}
#footer ul li {
	list-style:none;
	padding:3px 0;
}
#footer ul li a {
	color:#fff;
	text-transform:uppercase;
}
#social-share img {
	margin-right:15px;
	float:left;
}

#footer{color: #000; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-size: .875em}
#footer p, #footer a, #footer hr{color: #000 !important;}
#footer a:hover{text-decoration: underline}
#footer hr{background-color: #000; border-color: #000}
#footer h4{color: #000; font-size: 1.2em;}
#footer .col-md-3:nth-child(3) hr{margin: 0}
#footer .col-md-3:nth-child(3){font-size: 1em}
#footer .col-md-3:nth-child(3) p{padding: 0}
#footer .col-md-3:nth-child(3) a{color: #fff}


#library-notice {
	padding:15px 0;
	margin-bottom:15px;
}
.home #library-notice {
	margin-top:15px;
	margin-bottom:0;
}
#notice-title h1 {
	font-size:22px;
	line-height:36px;
	margin:0;
	color:#fff;
	text-align:center;
}
#notice-content p {
	margin:0;
	color:#fff;
}
#library-notice.None {
	display:none;
}
#library-notice.Normal {
	background-color:#DC8C18;
}
#library-notice.Urgent {
	background-color:#990000;
}
#library-notice a{
	color:#fff;
	text-decoration:underline;
}