@charset "utf-8";
/* CSS Document */


header, section, footer, aside, nav, main, article, figure {
	display: block;
}
body {
	font-size: 100%;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	/*background-image: url('/about/background/homepage/hb-homepage1.jpg');*/
	background-image: url('/about/background/homepage/hb-homepage1-bk.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
strong {
	font-size: 1em;
	color: #393838;
}
#pagewrap {
	width: 960px;
	margin: 0 auto;
}
#middle .myhb {
	display: none;
}
/* for google custom search engine*/
 
#header .search_icon {
	display: none;
}
#header .search {
	width: 250px;
	float: right;
}
#header .gsc-input-box {
	width: 250px;
	border-radius: 5px;
	height: 30px;
	text-align: center;
	margin-right: 0px;
}
#header .gsc-search-button {
	background: none;
	border: none;
	margin-left: -90px;
	width: 10px;
}
#header .gsc-search-button-v2 svg {
	fill: black;
}
#header .gsc-search-button-v2:hover, .gsc-search-button-v2:focus {
	background-color: white;
	cursor: pointer;
}
/*end of google search css*/



/* start basic color css*/

.green {
	color: green;
}
.blue {
	color: blue;
}
.red {
	color: #e70c0c;
}
.orange {	
	color:#ff8000;
}
.red_strong {
	color: red;
	font-weight: bold;
}
/*end basic color css*/

.anchor {
	display: block;
	height: 85px; /*same height as header*/
	margin-top: -85px; /*same height as header*/
	visibility: hidden;
}
#middle a[href^="tel"] {
	color: black;
	cursor: text;
	text-decoration: none;
}
.btn {
	background: rgba(22, 124, 197, 0.73);
	-webkit-border-radius: 28;
	-moz-border-radius: 28;
	border-radius: 28px;
	font-family: Arial;
	color: #ffffff;
	font-size: 15px;
	padding: 10px 20px 10px 20px;
	text-decoration: none;
}
.btn:hover {
	background: #3cb0fd;
	background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
	background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
	background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
	background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
	background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
	text-decoration: none;
}
a.btn {
	color: #fff;
}
#facility {
	height: 185px;
}
/*images css*/

#photogallery {
	float: right;
	margin-left: 60px;
	margin-right: 10px;
	bprder: 1px solid red;
	height: auto;
	padding-left: 1px;
}
#photogallery img {
	float: right;
	margin-left: 1px;
	margin-right: 1px;
	margin-bottom: 7px;
	padding: 3px;
	border: 1px solid #ccc;
}
#rightimg img {
	display: inline;
	float: right;
	margin-left: 12px;
	margin-right: 10px;
	margin-bottom: 4px;
	padding: 4px;
	border: 1px solid #ccc;
}
.rightimg2 img {
	display: inline;
	float: right;
	margin-left: 12px;
	margin-right: 10px;
	margin-bottom: 4px;
	padding: 4px;
	border: 1px solid #ccc;
	height: auto;
	max-width: 100%;
}
#centerimg img {
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 2px;
	padding: 4px;
	border: 1px solid #ccc;
}
.centerimg2 img {
	height: auto;
	padding: 3px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
}
.otherimg {
	padding: 4px;
	border: 1px solid #ccc;
}
#hb_logo img {
	margin-top: 0;
	margin-bottom: 15px;
	border: 0;
}
/* creates responsive images */

img {
	height: auto;
	max-width: 100%;
	border: 0;
}
/* end of creates responsive images */


/* end of images css*/



/* MyHB service reqest question title and button css */


#aside .myhb {
	display: block;
	border: none;
	float: left;
	margin: 0 7px 31px 0;
}
#aside .myhb h3 {
	margin: 0 0 9px 0;
	/*margin:0;
	padding:0;*/
	font-size: 1em;
}
#aside .myhb a {
	background-color: #e8dfce;
	color: #64696d !important;
	cursor: pointer;
	display: inline-block;
	font-size: 1em;
	font-weight: bold;
	padding: 10px 10px;
	width: 92%;
	text-align: center;
	text-decoration: none;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	transition: background-color 0.7s ease;
}
#aside .myhb a:hover {
	text-decoration: none;
	background: #b9b0a1;
}
/* End of MyHB service reqest question title and button css */








#middle .spm {
	display: none;
}
#middle .search_button2 {
	background: url('/images/mag5.gif') no-repeat center;
	height: 24px;
	width: 30px;
	padding: 0;
	border: 0;
	cursor: pointer;
	border: 2px solid #dcd2bd;
	cursor: pointer;
	transition: background-color 0.7s ease;
	cursor: pointer;
}
#middle .search_button2:hover {
	border: 2px solid #b3ab9a;
	background-color: #b9b0a1;
	height: 24px;
}
#middle .button_small {
	border: 1px solid #e3be79;
	background-color: #e8dfce;
	font-size: 11px;
	height: 22px;
	text-align: center;
	transition: background-color 0.7s ease;
	cursor: pointer;
}
#middle.button_small:hover {
	border: 1px solid #000;
	background: #b9b0a1;
	height: 22px;
}
#middle a.button3 {
	background-color: #e8dfce;
	color: #64696d !important;
	cursor: pointer;
	display: inline-block;
	font-size: .9375em;
	font-weight: bold;
	padding: 10px 10px;
	/*width: 215px;*/
	width: 135px;
	text-align: center;
	text-decoration: none;
	/*text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
	-webkit-border-radius: 5px;
	border-radius: 5px;
	transition: background-color 0.7s ease;
}
#middle .button3:hover {
	text-decoration: none;
	background: #b9b0a1;
}
#aside a.button3 {
	background-color: #e8dfce;
	color: #64696d !important;
	cursor: pointer;
	display: inline-block;
	font-size: .9375em;
	font-weight: bold;
	padding: 10px 10px;
	/*width: 215px;*/
	width: 81%;
	/*width: 115px;*/
	text-align: center;
	text-decoration: none;
	/*text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
	-webkit-border-radius: 5px;
	border-radius: 5px;
	transition: background-color 0.7s ease;
}
#aside .button3:hover {
	text-decoration: none;
	background: #b9b0a1;
}
.form_container {
	display: block;
	/*margin-left: 10px;*/
	height: 60px
}
.small {
	font-size: .8125em;
}
#header {
	padding: 0;
	margin-top: 30px;
	width: 960px;
}
#search {
	float: right;
	margin-top: 20px;
}
#top_navigation {
	height: 40px;
	width: 960px;
	background-color: #fff;
	margin: auto;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px;
	margin-bottom: 25px;
	position: -webkit-sticky;/*z-index: 9999;*/
}
.sticky {
	position: fixed;
	width: 960px;
	top: 0;
	z-index: 100;
	border-top: 0;
	margin: 0 auto;
	border-bottom: 1px solid #333;
}
.menu li a {
	display: table-cell;
	vertical-align: middle;
	width: 130px;
	border-right: 1px solid #ccc;
	height: 40px;
	text-decoration: none;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
}
.breadcrumb {
	float: left;
	display: inline-block;
	color: #333;
	font-size: .875em;
	padding-top: 0;
	margin-top: 0;
	margin-bottom: 7px;
	max-width: 90%;
	line-height: 14px;
}
.share {
	float: right;
	color: #00467C;
	margin-right: 5px;
	margin-top: -7px;
	padding-top: 0;
	font-size: .8125em;
	display:inline; width:100px
}
#leftnavigation {
	display: none;
}
#left_nav, #middle, #aside {
	margin-bottom: 25px;
}
#nav_display {
	display: none;
}
/* Left Navigation CSS */

#left_nav {
	width: 220px;
	float: left;
	padding: 0 0 5px 0;
	background: rgba(0, 77, 132, 0.73);
	border-top-left-radius: 9px;
	border-top-right-radius: 9px;
	border-bottom-left-radius: 9px;
	border-bottom-right-radius: 9px;
	box-sizing: border-box;
	min-height: 1750px;
}
#left_nav ul {
	margin: 0;
	padding: 0;
	padding-top: 10px;
	list-style: none;
}
#left_nav ul li {
	margin-left: 0;
	margin-bottom: 0;
	padding: 5px;
	padding-left: 5px; /* 03/05/20 changed from 0 to 5px to fix for long menu titles */
	list-style: none;
	text-align: left;
	font-size: .8125em;
	color: #FFF;
	border-bottom: 1px solid #CACACA;
}
#left_nav ul li:hover {
	background: #468abb;
}
#left_nav ul li a:hover {
	color: #000;
}
#left_nav ul li ul {
	margin-top: 5px;
	border-top: 1px solid #CACACA;
}
#left_nav ul li ul li {
	margin-left: 0px;
	margin-bottom: 0px;
	padding: 3px;
	padding-left: 10px;
	list-style: none;
	text-align: left;
	font-size: 11px;
	color: #FFF;
	border-bottom: 0px solid #CACACA;
}
#left_nav ul li a {
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #FFF;
	margin-left: 0; /* 03/05/20 Changed from 10px to 0 to handle long menu titles */
}
#left_nav ul li a:visited {
	color: #FFF;
}
#left_nav ul li a:hover {
	color: #f4dd61;
}
/* Left Navigation CSS */

#left_nav div.content_nav ul li a {
	margin-left: 0px;
	margin-bottom: 0px;
	padding: 3px;
	padding-left: 0; /* 03/05/20 Changed from 10px to 0 to handle long menu titles */
	list-style: none;
	text-align: left;
	font-size: 11px;
	color: #FFF;
	/*border-bottom: 0px solid #CACACA;*/
	/*font-size: .875em;*/
}

#left_nav div.content_nav ul li a:hover {
	color: #f4dd61;
}



#left_nav button.collapsible {
	background:none;
    border:none;
	margin-left: 2px;
	margin-bottom: -7px;
	margin-top: 0px;
	padding-top: 3px;
	padding-left:0; /* 03/05/20 Added for handling of long menu titles */
	text-align: left;
	color: #FFF;
    cursor: pointer;
	width: 100%;	
}

#left_nav button.collapsible:after {
	/*content: '\2795';   Heavy "plus" sign  */
	/*content: '\02C3';  /* Arrow right			 */
	transition: transform .5s;
	font-size: 25px;
	background:none;
    border:none;
    margin-top: -5px;
	color: #ccc;
    cursor: pointer;
	float: right;
}

#left_nav .right_arrow {
	width: 14px;
    height: 14px;
    background-image: url(/about/video/images/chevron-down-light-grey.svg);
    float: right;
    cursor: pointer;
    margin-top: 1px;
    margin-right: 2px;
	transform: rotate(-0.25turn);
	transition: transform .5s;
}

#left_nav .down_arrow {
	width: 14px;
    height: 14px;
    background-image: url(/about/video/images/chevron-down-light-grey.svg);
    float: right;
    cursor: pointer;
    margin-top: 1px;
    margin-right: 2px;
	transition: transform .5s;
	/*transform: rotate(-0.25turn);*/	
}



#left_nav button.collapsible:hover {
	color: #f4dd61;
}

#left_nav button.active {
	color: #f4dd61;
	
}

#left_nav button.collapsible:after:hover {
	color: #f4dd61;
}


#left_nav button.active:after {
	
	/*content: '\02C5';*/ /*down arrow*/
	font-size: 25px;
	color: #f4dd61;
	transform: rotate(0.25turn);
	transition: transform .5s;
	
	/*transform: rotate(0.5turn);
	trnsition: transform .5s;*/
	
	
}

#left_nav div.content_nav {
	margin-top: 0;
	padding: -1px 18px 5px;
	max-height: 0;
	width: 102%;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}


/* Left Navigation Expand/Collapse CSS */




#middle {
	width: 565px;
	float: left;
	background: rgba(255, 255, 255, 0.93);
	padding-top: 15px;
	padding-left: 20px;
	padding-right: 10px;
	padding-bottom: 0px;
	margin: 0 0 0 11px;
	min-height: 1750px;
	border-top-left-radius: 9px;
	border-bottom-left-radius: 9px;
	font-size: .875em;
	line-height: 20px;
	box-sizing: border-box;
}
#middle p {
	line-height: 1.5625em;
	margin-top: 0em;
	margin-bottom: 1.0625em;
}
#middle h1 {
	font-size: 1.25em;
	/*color: #4b4a4a;*/
	color: #393838;
	margin-top: 7px;
	padding-bottom: 7px;
}
#middle h2 {
	font-size: 1.0625em;
	/*color: #3b3a3a;*/
	color: #393838;
	margin-bottom: 4px;
	padding-bottom: 4px;
}
#middle h3, #aside h3 {
	font-size: 1.25em;
	color: #3b3a3a;
	margin-bottom: -2px;
}
#aside {
	width: 164px;
	background: #fff;
	border-left: 1px solid #b6b5b5;
	padding: 4px 10px 10px 10px;
	margin-bottom: 10px;
	float: left;
	min-height: 1750px;
	opacity: 0.91;
	filter: alpha(opacity=93);
	border-top-right-radius: 9px;
	border-bottom-right-radius: 9px;
	font-size: .75em;
	line-height: 17px;
	box-sizing: border-box;
}
#aside h2 {
	font-size: 1.125em;
}
#aside div {
	padding-bottom: 1px;
}
#footer {
	clear: both;
	background: #004d84;
	padding-top: 5px;
	width: 100%;
	height: 80px;
	opacity: 0.85;
	filter: alpha(opacity=85);
	left: 0;
	bottom: 0;
	z-index: 999;
	-webkit-box-shadow: 0px 0px 25px -3px rgba(33,33,33,1);
	-moz-box-shadow: 0px 0px 25px -3px rgba(33,33,33,1);
	box-shadow: 0px 0px 25px -3px rgba(33,33,33,1);
}
#footer .footer-table {
	width: 80%;
	margin: auto;
	margin-top: 10px;
}
#footer .footer-img {
	float: left;
	width: 16.66%;
	text-align: center;
	border: 0;
}
#footer2 {
	width: 100%;
	background: #48a1dc;
	opacity: 0.80;
	filter: alpha(opacity=80);
	height: 75px;
	margin-top: 0;
	padding: 0;
	text-align: center;
	clear: both;
}
#footer2 p {
	text-align: center;
	padding-top: 10px;
	font-size: .75em
}
#footer2 .copyright {
	padding-top: 10px;
	font-size: .75em
}
/*top search box*/

#tfnewsearch {
	float: right;
	padding: 0px;
}
.tftextinput4 {
	margin: 0;
	padding: 8px 10px;
	font-size: .8125em;
	color: #666;
	border: 1px solid #fff;
	border-top-left-radius: 5px 5px;
	border-bottom-left-radius: 5px 5px;
	background-color: #FFF;
}
.tfbutton4 {
	margin: 0;
	padding: 0;
	width: 33px;
	height: 33px;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: #fff;
	border: solid 1px #fff;
	border-left: none;
	border-top-right-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	background: url('/about/subpages/mag.png') center no-repeat;
	background-color: #FFF;
}
.clear {
	clear: both;
}
.tftextinput4a {
	margin: 0;
	padding: 4px 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #666;
	border: 1px solid #99ccff;
	border-right: 0px;
	border-top-left-radius: 5px 5px;
	border-bottom-left-radius: 5px 5px;
}
.tfbutton4a {
	margin: 0;
	padding: 0;
	width: 25px;
	height: 26px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: #fff;
	border: solid 1px #99ccff;
	border-left: 0px;
	border-top-right-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	background: url('/images/search-icon.png');
}
.tfselectinput4a {
	margin: 0;
	padding: 4px 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000;
	border: 1px solid #99ccff;
	border-top-left-radius: 5px 5px;
	border-bottom-left-radius: 5px 5px;
	border-top-right-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
}

	/* Fixes submit button height problem in Firefox */
.tfbutton4a::-moz-focus-inner {
 border: 0;
}
.tfcleara {
	clear: both;
}
.column1 {
	float: left;
	width: 52%;
	padding: 0;
	margin: 0;
}
.column2 {
	float: right;
	width: 48%;
	padding: 0;
	margin: 0;
}
a:link {
	color: #0354a5;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #0354a5;
}
a:hover {
	text-decoration: underline;
	color: #63a1de;
}
a:active {
	text-decoration: underline;
	color: #f4dd61;
}
/* Tables CSS */

table.table {
	border-width: 0;
	border-style: none;
	border-color: transparent;
	border-collapse: collapse;
	font-family: Arial, Helvetica;
	font-size: 1em;
}
table.table td {
	border-width: 1px;
	padding: 3px;
	border-style: solid;
	border-color: transparent;
}
table th {
	font-size: .9375em;
	text-align:left;
}
table.table th {
	border-width: 1px;
	padding: 3px;
	border-style: solid;
	border-color: #b2def6;
	font-family: Arial, Helvetica;
	font-size: .955em;
	background-color: #b2def6;
	text-align:left;
}
table.table tr:hover {
	background-color: #e0e6f3;
}
table.table2 {
	border-width: 1px;
	border-style: solid;
	border-color: #b2def6;
	border-collapse: collapse;
	font-family: Arial, Helvetica;
	font-size: 1em;
}
table.table2 td {
	border-width: 1px;
	padding: 5px;
	border-style: solid;
	border-color: #b2def6;
}
table th {
	font-size: .9375em;
}
table.table2 th {
	border-width: 1px;
	padding: 3px;
	border-style: solid;
	border-color: #b2def6;
	font-size: .955em;
	background-color: #b2def6;
	text-align:left;
}
table.table2 tr {
	transition: background-color 0.5s ease;
	background-color: transparent;
}
table.table2 tr:hover {
	background-color: #d4edfb;
}
table.table3 {
	border-width: 1px;
	border-style: solid;
	border-color: #b2def6;
	border-collapse: collapse;
	font-family: Arial, Helvetica;
	margin-bottom: 10px;
}
table.table3 td {
	border-width: 1px;
	padding: 3x;
	border-style: solid;
	border-color: #b2def6;
	background-color: #ffffff;
	font-family: Arial, Helvetica;
	text-align: center;
}
table.table3 td:hover {
	background-color: #f9f4ea;
}
/* End of Tables CSS */


/*CALENDAR FORMAT START*/

#calendar2 {
	width: 60%;
	float: left;
	margin: 0;
	padding: 0;
}
#calendar3 {
	width: 40%;
	float: right;
	margin: 0;
	padding: 0;
}
label {
	display: inline-block;
	width: 145px;
	font-size: .9375em;
	font-weight: bold;
	color: #393838;
}
.monthHeader {
	background-color: #FFFFCC;
	border-width: 1px;
	border-spacing: 2;
	border-style: solid;
	border-color: #666600;
	border-collapse: collapse;
	border-bottom-width: 0px;
}
.caltexthighlight {
	FONT-WEIGHT: bold;
	FONT-SIZE: 8pt;
	COLOR: #000000;
	FONT-STYLE: normal;
	FONT-FAMILY: verdana, arial, helvetica, sans-serif;
	TEXT-DECORATION: none;
	PADDING-BOTTOM: 5px;
	line-height: 25px;
}
.caltext {
	FONT-WEIGHT: normal;
	FONT-SIZE: 8pt;
	COLOR: #666666;
	FONT-STYLE: normal;
	FONT-FAMILY: verdana, arial, helvetica, sans-serif;
	TEXT-DECORATION: none;
	PADDING-BOTTOM: 5px
}
.calendarheader {
	FONT-WEIGHT: bold;
	FONT-SIZE: 8pt;
	COLOR: #000000;
	FONT-STYLE: normal;
	FONT-FAMILY: verdana, arial, helvetica, sans-serif;
	TEXT-DECORATION: none;
}
.calendar {
	FONT-WEIGHT: normal;
	FONT-SIZE: 8pt;
	COLOR: black;
	FONT-STYLE: normal;
	FONT-FAMILY: verdana, arial, helvetica, sans-serif;
	TEXT-DECORATION: none;
	line-height: 1.5;
}
.calendartoday {
	FONT-SIZE: 8pt;
	COLOR: black;
	FONT-STYLE: normal;
	FONT-FAMILY: verdana, arial, helvetica, sans-serif;
}
table.table_fire {
	border-width: 1px;
	border-style: solid;
	border-color: #b2def6;
	border-collapse: collapse;
	font-family: Arial, Helvetica;
	font-size: .875em;
	margin-left: 10px;
}
table.table_fire td {
	border-width: 1px;
	padding: 3px;
	border-style: solid;
	border-color: #b2def6;
}
table.table_fire td:hover {
	background-color: #f9f4ea;
}
table.calendar {
	border-width: 1px;
	border-spacing: 2;
	border-style: solid;
	border-color: #666600;
	border-collapse: collapse;
}
table.calendar td {
	border-width: 1px;
	padding: 3px;
	border-style: solid;
	border-color: #666600;
 -moz-border-radius:;
}
.button {
	border: 1px solid #e8dfce;
	background: #e8dfce;
	background-color: #e8dfce;
	padding: 2px 17px 2px 17px;
	height: 35px;
	font-size: .8555em;
	text-align: center;
	transition: background-color 0.6s ease;
	cursor: pointer;
}
.button:hover {
	background-color: #b9b0a1;
	background: #b9b0a1;/*padding: 2px 17px 2px 17px;
	height: 35px;*/
}
.button_open {
	height: 35px;
	padding: 9px 25px 9px 25px;
	color: #000;
	border: 1px solid #e8dfce;
	border-radius: 4px;
	font-size: .9375em;
	background: #e8dfce;
	text-align: center;
	cursor: pointer;
	transition: background-color 0.6s ease;
	cursor: pointer;
}
.button_open:hover {
	background-color: #b9b0a1;
	background: #b9b0a1;
}
.button_large {
	padding: 7px 24px 7px 24px;
	background: #e8dfce;
	background-color: #e8dfce;
	font-size: .9375em;
	height: 45px;
	text-align: center;
	border: 1px solid #e8dfce;
	transition: background-color 0.7s ease;
	cursor: pointer;
}
.button_large:hover {
	padding: 7px 24px 7px 24px;
	background: #e8dfce;
	background-color: #e8dfce;
	border: 1px solid #000;
	background: #b9b0a1;
	height: 45px;
}
.button_small {
	border: 1px solid #e3be79;
	background-color: #e8dfce;
	font-size: 11px;
	height: 22px;
	text-align: center;
	transition: background-color 0.7s ease;
	cursor: pointer;
}
.button_small:hover {
	border: 1px solid #000;
	background: #b9b0a1;
	height: 22px;
}
.button_small2 {
	border: none;
	background-color: #fff;
	color: #0354a5;
	font-size: 12px;
	height: 15px;
	text-decoration: none;
	padding-left: 0;
	transition: background-color 0.7s ease;
	cursor: pointer;
}
.button_small2:hover {
	text-decoration: underline;
	padding-left: 0;
}

.leftimg2 img {
	display: inline;
	float: left;
	margin-right: 10px;
	margin-bottom: 2px;
	padding: 5px;
	border: 1px solid #ccc;
}
.demo-with-image .expander.expanded {
	padding-left: 20px;
	margin-left: -20px;
	background-position: left center;
	background-repeat: no-repeat;
	background-image: url('/images/toggle-expand.png');
}
.demo-with-image .expander.collapsed {
	margin-left: -20px;
	padding-left: 20px;
	background-position: left center;
	background-repeat: no-repeat;
	background-image: url('/images/toggle-collapse.png');
}

.heading2 {
	font-size: .9375em;
	font-weight: bold;
}
.nodesktop {
	display: none;
}
#mobilenavigation {
	display: none;
}
#want1 {
	float: left;
	width: 44%;
	height: auto;
	display: block;
	margin-left: 10px;
}
#want2 {
	float: right;
	width: 54%;
	height: auto;
	display: block;
}
#want2 li {
	list-style: none;
	padding: 0 0 7px 0;
}
#want1 ul {
	margin-left: 10px;
	list-style: none;
	padding: 0;
}
#want1 li {
	padding: 0 0 7px 0;
}
#middle ul li {
	line-height: 20px;
	padding-bottom: 7px;
}
#library_search {
	float: right;
	margin-top: -100px;
	width: 250px
}
/*hide from PC devices*/

.mobile-view {
	display: none;
}
/* mobile search icon */
.search_icon {
	display: none;
}
/* end search icon */

#secondary_nav {
	display: none;
}
#back-to-top {
	display: none;
}
#leftnavigation {
	display: none;
}
/* Sands Guide CSS */

#sands {
	float: left;
	width: 45%;
}
#sands1 {
	float: left;
	width: 45%;
}
#sands2 {
	margin-right: 10px;
	float: right;
	width: 50%;
}
#sands-video {
	font-size: 15px;
	margin-bottom: 7px;
}
#sands-reg a {
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	background-color: #e8dfce;
	background-image: url('/images/header-background2.gif');
	background-repeat: repeat-x;
	color: #333333;
	padding: 12px 20px 12px 20px;
	border: none;
	margin-left: 1px;
	width: 200px;
}
#sands-reg-for-wide a {
	font-size: .9375em;
	font-weight: bold;
	text-align: center;
	background-color: #e8dfce;
	background-image: url('/images/header-background2.gif');
	background-repeat: repeat-x;
	color: #333333;
	padding: 10px 18px 10px 18px;
	border: none;
	margin-left: 10px;
	width: 150px;
}
/* End of Sands Guide CSS */






/*End of Hide from Mobile*/

/* media query width test */

/*.twelve-eighty, .nine_eighty, .nine_fifty, .nine_ten, .eight_eighty, .eight_fifty, .eight_hundred, .six_fifty, .seven_six_eight, .seven_hundred_fifty, .seven_hundred_twenty, .seven_hundred, .even_hundred_fifty, .six-eight, .six-hundred-fifty, .six-hundred-fifty-one, .five-hundred, .three-thirty {
	display: none;
}*/
/* for council presentations */

.row {
	display: block;
	min-height: 250;
	margin-left: 10px;
	margin-bottom: 10px;
	overflow: hidden;
}
#middle .content {
	margin-top: 17px;
}

/* end of for council presentations */


/* end of media query width test */


 @media screen and (max-width: 1280px) {
.twelve-eighty {
	display: block;
}
}



/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 980px or less */
@media screen and (max-width: 980px) {
#pagewrap {
	width: 99%;
}
.nine_eighty {
	display: block;
}
.menu li a {
	width: 127px
}
#header {
	padding: 0;
	margin-top: 30px;
	width: 100%;
}
#hb_logo {
	max-width: 350px;
}
#top_navigation {
	width: 100%;
}
.breadcrumb {
	max-width: 90%;
}
#left_nav {
	width: 25%;
	margin: 0;
	padding: 1% 1%;
	float: left;
}
#middle {
	width: 60%;
	padding: 1% 1%;
	margin: 0;
	float: left;
}
#aside {
	width: 15.0%;
	margin: 0;
	padding: 1% 1%;
	float: right;
}
#left_nav, #middle, #aside {
	margin-bottom: 25px;
}
#menu .menu .dropdown-5columns {
	width: 950px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
.button_open {
	height: 25px;
	padding: 5px 11px 5px 11px;
}
}
 @media screen and (max-width: 950px) {
.nine_fifty {
	display: block;
}
.share {
	margin-right: 2px;
}
#left_nav {
	width: 24.5%;
	margin: 0;
	padding: 1% 1%;
	float: left;
	margin-bottom: 25px;
}
#middle {
	width: 61.0%;
	padding: 1% 1%;
	margin: 0;
	float: left;
	margin-bottom: 25px;
}
#aside {
	width: 14.5%;
	margin: 0;
	padding: 1% 1%;
	float: right;
	margin-bottom: 25px;
}
.menu li a {
	width: 122px;
}
#menu .menu .dropdown-3columns {
	width: 820px;
	margin: -1px auto 0 -200px; /*goverment*/
}
}
 @media screen and (max-width: 910px) {
#middle .myhb {
	display: none;
}
#aside .myhb {
	display: none;
}
#middle .myhb {
	display: block;
	border: none;
	float: right;
	margin: 0 10px 10px 6px;
}
#middle .myhb h3 {
	margin: 0 0 6px 3px;
	font-size: .9375em;
}
#middle .myhb a {
	background-color: #e8dfce;
	color: #64696d !important;
	cursor: pointer;
	display: inline-block;
	font-size: .8125em;
	font-weight: bold;
	padding: 10px 10px;
	width: 87%;
	text-align: center;
	text-decoration: none;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	transition: background-color 0.7s ease;
}
#middle .myhb a:hover {
	text-decoration: none;
	background: #b9b0a1;
}
#left_nav {
	width: 28%;
	margin: 0;
	padding: 1% 1%;
	float: left;
	margin-bottom: 25px;
}
#middle {
	width: 72%;
	padding: 1% 1%;
	margin: 0;
	float: left;
	margin-bottom: 25px;
	border-top-right-radius: 9px;
	border-bottom-right-radius: 9px;
	border-bottom-left-radius: 9px;
}
#aside {
	display: none;
}
.menu li a {
	width: 118px;
}
#menu .menu .dropdown-5columns {
	width: 850px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
#menu .menu .dropdown-3columns {
	width: 820px;
	margin: -1px auto 0 -125px; /*goverment*/
}
#hb_logo {
	max-width: 320px;
}
}
 @media screen and (max-width: 880px) {
#left_nav {
	width: 28%;
	margin: 0;
	padding: 1% 1%;
	float: left;
	margin-bottom: 25px;
}
#middle {
	/*width: 60%;*/
	width: 72%;
	padding: 1% 1%;
	margin: 0;
	float: left;
	margin-bottom: 25px;
}
#aside {
	display: none;
}
#aside h3 {
	font-size: .9375em;
}
.menu li a {
	width: 121x;
}
#menu .menu .dropdown-5columns {
	width: 850px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
#menu .menu .dropdown-3columns {
	width: 820px;
	margin: -1px auto 0 -140px; /*goverment*/
}
.eight_eighty {
	display: block;
}
#hb_logo {
	max-width: 300px;
}
.menu li a {
	width: 110px;
}
}
 @media screen and (max-width: 850px) {
.eight_fifty {
	display: block;
}
#left_nav {
	width: 27%;
	margin-bottom: 25px;
}
#middle {
	width: 73%;
	margin-bottom: 25px;
}
.menu li a {
	width: 106px;
}
#menu .menu .dropdown-5columns {
	width: 800px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
#menu .menu .dropdown-3columns {
	width: 830px;
	margin: -1px auto 0 -120px; /*goverment*/
}
}
 @media screen and (max-width: 800px) {
#menu .menu .dropdown-5columns {
	width: 800px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
#menu .menu .dropdown-3columns {
	width: 795px;
	margin: -1px auto 0 -230px; /*goverment*/
}
.eight_hundred {
	display: block;
}
#pagewrap {
	width: 98%;
}
.menu li a {
	width: 101px;
}
#aside {
	display: none;
}
#left_nav {
	width: 27%;
	margin: 0;
	padding: 1% 1%;
	float: left;
	min-height: inhert;
}
#middle {
	width: 72%;
	padding: 1% 1%;
	margin: 0;
	float: left;
	border-top-right-radius: 9px;
	border-bottom-right-radius: 9px;
	border-bottom-left-radius: 9px;
}
#left_nav, #middle {
	margin-bottom: 25px;
}
}
 @media screen and (max-width: 768px) {
#left_nav {
	width: 24%;
}
#middle {
	width: 76%;
	border-top-right-radius: 9px;
	border-bottom-right-radius: 9px;
	border-bottom-left-radius: 9px;
}
#middle h2 {
	font-size: 1em;
}
.menu li a {
	width: 99px;
	font-size: .875em;
}
.seven_six_eight {
	display: block;
}
#menu .menu .dropdown-5columns {
	width: 800px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
#menu .menu .dropdown-3columns {
	width: 870px;
	margin: -1px auto 0 -210px; /*goverment*/
}
.button_open {
	height: 35px;
	padding: 9px 25px 9px 25px;
}
}
 @media screen and (max-width: 750px) {
.seven_hundred_fifty {
	display: block;
}
#left_nav {
	width: 23%;
	height: auto;
}
#middle {
	width: 77%;
	height: auto;
}
#menu .menu .dropdown-5columns {
	width: 765px;
	margin: -1px auto 0 -11px;  /*i want to*/
}
#menu .menu .dropdown-3columns {
	width: 820px;
	margin: -1px auto 0 -220px; /*goverment*/
}
.menu li a {
	width: 94px;
}
#footer .footer-img {
	float: left;
	width: 14%;
}
#footer .footer-img .tooltip {
	float: left;
	width: 100%;
}
/*#footer .footer-img .translate {
	float: left;
	width: 14%;
}*/



#footer .footer-connect-img {
	float: left;
	width: 29%;
}
}
 @media screen and (max-width: 736px) {
/*google search css*/
#header .search {
	display: none;
}
#header .search_icon {
	display: block;
	margin-top: -20px;/*padding-top: 12px;
	max-width: 35px;*/
}
/*end google search css*/

#middle .myhb h3 {
	margin: 0 0 6px 3px;
	font-size: .8125em;
}





#middle a[href^="tel"] {
	color: #0354a5;
	cursor: pointer;
}
#middle table th {
	font-size: .75em;
}
#middle table td {
	font-size: .875em;
}
.search_icon {
	padding-top: 12px;
	max-width: 35px;
}
#middle a.button3 {
	width: 110px;
	font-size: .75em;
}
#left_nav {
	display: none;
}
.column1 {
	float: none;
	width: 100%;
	padding: 0;
	margin-bottom: 10px;
}
.column2 {
	float: none;
	width: 100%;
	padding: 0;
	margin-bottom: 10px;
	margin-left: 0px;
}
.form_container {
	width: 100%;
	height: auto;
	padding: 0;
	margin-bottom: 10px;
}
/*Hide from Mobile*/

/* for photo park/events gallery */

.photo-thumbnails {
	display: none;
}
/* end */

.nodesktop {
	display: block;
}
.nomobile {
	display: none;
}
#top_navigation {
	display: none;
}
#search {
	display: none;
}
.pc-view {
	display: none;
}
/*End of Hide from Mobile*/


#sands-reg a {
	font-size: .8755em;
	font-weight: bold;
	text-align: center;
	background-color: #e8dfce;
	background-image: url('/images/header-background2.gif');
	background-repeat: repeat-x;
	color: #333333;
	padding: 12px 20px 12px 20px;
	border: none;
	margin-left: 1px;
	width: 150px;
}
#back_to_top {
	margin: auto;
	font-size: 14px;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 10px;
	margin-bottom: 50px;
	border-top: 1px solid #ccc;
	text-decoration: none;
}
#back_to_top a {
	text-decoration: none;
}
#header {
	background: #004d84;
	width: 100%;
	margin: auto;
	height: 55px;
	position: fixed;
	z-index: 9999;
	top: 0;
	-webkit-box-shadow: 0px 2px 5px 0px rgba(69,69,69,1);
	-moz-box-shadow: 0px 2px 5px 0px rgba(69,69,69,1);
	box-shadow: 0px 2px 5px 0px rgba(69,69,69,1);
	position: fixed;
	clear: both;
}
#calendar2 {
	float: none;
	width: 100%;
	padding: 0;
	margin: 0;
	height: auto;
	border: solid 1px #FFFFFF;
}
.mobile-view {
	display: block;
}
body {
	min-width: 10px;
	background-image: none;
}
.menu li a {
	width: 100px;
	font-size: .8125em;
}
.breadcrumb {
	margin-top: 0;
	margin-bottom: 4px;
	padding: 0;
	max-width: 100%;/*border:1px solid red;*/
}
.breadcrumb a {
	font-size: 1.125em
}
.share {
	margin-top: 1px;
	margin-bottom: 0;
	padding: 0;
	font-size: .6125em;
}
#back-to-top {
	border-top: 1px solid #999;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #fff;
	border-bottom: 1px solid #999;
	display: block;
	text-align: center;
}
#back-to-top a {
	text-decoration: none;
	font-size: 1em;
	color: #000;
}
#pagewrap {
	width: 100%;
}
#hb_logo {
	display: block;
	max-width: 220px;
	margin: auto;
	padding-top: 4px;
	margin-top: -20px;
}
.search_icon {
	padding-top: 4px;
	padding-right: 6px;
	float: right;
	display: block;
}
#middle {
	font-size: 1em;
	width: auto;
	min-height: auto;
	float: none;
	margin-top: 70px;
	margin-left: 0;
	margin-bottom: 0;
	padding: 1% 2%;
	border-top-right-radius: 9px;
	border-top-left-radius: 9px;
	clear: both;
}
#aside {
	display: block;
	width: auto;
	min-height: auto;
	float: none;
	margin-left: 0;
	margin-bottom: 0;
	padding: 1% 2%;
	border-top: solid 1px #ccc;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border-bottom-right-radius: 9px;
	border-bottom-left-radius: 9px;
	border-left: none;
	font-size: 1em;
	line-height: 18px;
	clear: both;
}
#aside h3 {
	font-weight: bold;
	font-size: 1em;
}
#aside p {
	line-height: 1.5em;
	/*margin-top: 0em;*/
	margin-bottom: 1.0625em;
}
#leftnavigation {
	margin-top: 27px;
	display: block;
	width: 100%;
	padding: 0;
	background-color: #fff;
}
.banner-title-leftnavigation {
	display: block;
	font-size: .9375em;
	font-weight: bold;
	color: #ebf1fc;
	height: 25px;
	padding-top: 7px;
	padding-left: 15px;
	background: #004d84;
}
#qm3 div {
	border-bottom: 2px dotted #ccc;
	background-color: #fffeef;
	width: auto;
	padding-top: 12px;
	padding-bottom: 12px;
	margin-bottom: 0;
}
#qm3 a div {
	font-size: .935em;
	padding-left: 12px;
}
#qm3 a {
	color: #333;
	text-decoration: none;
}
.banner-title {
	display: block;
	font-size: .9375em;
	font-weight: bold;
	color: #ebf1fc;
	height: 25px;
	padding-top: 7px;
	padding-left: 15px;
	background: #004d84;
}
#you-are-here {
	display: block;
	margin: 15px 15px;
}
#you-are-here a {
	color: #0354a5;
	text-decoration: none;
	font-size: .955em;
}
#nav_display {
	display: block;
	padding-top: 5px;
}
#nav {
	clear: both;
	position: absolute;
	top: 54px;
	width: 100%;
	z-index: 10000;
	padding: 0;
	background: #67a5cf;
	display: none;
}
#nav div {
	clear: both;
	float: none;
	margin: 1px 0 1px 0px;
	padding-left: 1px;
}
#nav a {
	font: inherit;
	background: none;
	display: inline;
	color: #fff;
	border: none;
	text-decoration: none;
}
#nav div {
	width: auto;
	position: static;
	display: block;
	border: none;
}
#nav a div {
	padding: 15px 15px;
	border-bottom: 2px groove #9dcfea;
}
/* dropdown top menu */
	
#nav-wrap {
	position: absolute;
	display: inline;
	padding-left: 0px
}
#menu-icon {
	background: url('/about/subpages/menu7.png') no-repeat 1px center;
	padding: 20px 30px 20px 30px;
	margin-left: 7px;
	margin-top: -10px;
	cursor: pointer;
	display: block;
}
#menu-icon:hover {
	background: url('/about/subpages/menu7.png') no-repeat 1px center;
	padding: 20px 30px 20px 30px;
	margin-left: 7px;
	margin-top: -10px;
	display: block;
}
#menu-icon.active {
	background: url('/about/subpages/menu7.png') no-repeat 1px center;
	padding: 20px 30px 20px 30px;
	display: block;
}
#footer {
	box-shadow: none;
	opacity: 1;
	filter: alpha(opacity=100);
	height: 90px;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}
#footer .footer-table {
	padding-top: 10px;
	width: 100%;
}
#footer .footer-img {
	float: left;
	width: 16%;
}
#footer .footer-connect-img {
	float: left;
	width: 30%;
}
#footer2 {
	height: 40px;
	margin-top: 0;
	padding: 0;
	opacity: 1;
	filter: alpha(opacity=100);
}
#footer2 .copyright {
	padding-top: 5px;
	font-size: .6125em
}
#want1 {
	float: none;
	width: 100%;
	padding: 0;
	margin: 0 0 0 0;
	height: auto;
}
#want1 ul {
	width: 100%;
	padding: 0px 0px 5px 0px;
	margin: 0 0 10px 0;
}
#want1 li {
	padding: 7px 0px 7px 10px;
	margin: 0;
	font-size: 1.1em;
	font-weight: normal;
}
/*#want1 a {
	color: #000;
}*/
#want2 {
	float: none;
	width: 100%;
	padding: 0;
	margin: 0;
	height: auto;
}
#want2 ul {
	width: auto;
	padding: 0px 0px 5px 0px;
	margin: 0 0 10px 0;
}
#want2 li {
	padding: 7px 0px 7px 10px;
	margin: 0;
	font-size: 1.1em;
	font-weight: normal;/*border-bottom: 2px dotted #ccc;
	background-color: #fffeef;*/
}
/*#want2 a {
	color: #000;
}*/
#calendar2 {
	float: none;
	width: 100%;
	padding: 0;
	margin: 0;
	height: auto;
	border: solid 1px #FFFFFF;
}
#calendar3 {
	float: none;
	width: 100%;
	padding: 0;
	margin: 0;
	height: auto;
	border: solid 1px #FFFFFF;
}
.rightimg2 img {
	width: 170px;
	height: auto;
	padding: 2px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
	margin-right: 3px;
}
.leftimg2 img {
	width: 130px;
	height: auto;
	padding: 4px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
}
.leftimg2 a img {
	width: 130px;
	height: auto;
	padding: 4px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
}
#leftimg img {
	width: 130px;
	height: auto;
	padding: 3px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
}
#facility img {
	width: 100px;
	height: auto;
	padding: 3px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
}
/* start mobile navigation expand collapse */

.content_nav ul li a {
	font-size: .875em;
}
.content_nav ul li {
	padding-bottom: 19px;
	padding-left: 1px;
}
.nocollapsible {
	background-color: #fffeef;
	color: #000;
	padding: 12px;
	/*width: 100%;*/
	width: auto;
	border-right: none;
	border-top: none;
	border-left: none;
	border-bottom: 2px dotted #ccc;
	text-align: left;
	font-size: .9375em;
}
.nocollapsible a div {
	color: #000;
	text-decoration: none;
}
button.collapsible {
	background-color: #fffeef;
	color: #000;
	cursor: pointer;
	padding: 12px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
	border-bottom: 2px dotted #ccc;
}
button.collapsible:after {
	/*content: '\002B';*/

	content: '\2795';
	font-size: 12px;
	color: 000;
	font-weight: bold;
	float: right;
	margin-left: 5px;
}
button.active:after {
	content: '\2796';
	font-size: 12px;
}
.active {
	background-color: #fff;
}
.content_nav {
	padding: 0 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	background-color: #fff;
}
/*  end mobile navigation expand collapse */

	





















}
 @media screen and (max-width: 500px) {
#middle h1 {
	font-size: 1.0625em;
	/*color: #4b4a4a;*/
	color: #393838;
	margin-top: 7px;
	padding-bottom: 7px;
}
#footer {
	height: 60px;
}
.rightimg2 img {
	width: 150px;
	height: auto;
	padding: 2px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
	margin-right: 3px;
}
}
 @media screen and (max-width: 400px) {
#footer {
	height: 55px;
}
#footer2 .copyright {
	font-size: .625em
}
#hb_logo {
	max-width: 210px;
	padding-top: 4px;
}
.rightimg2 img {
	width: 120px;
	height: auto;
	padding: 2px;
	border: 1px solid #ccc;
	margin-bottom: 1px;
	margin-right: 3px;
}
}
 @media screen and (max-width: 360px) {
/*for google search css*/

#header .search_icon {
	padding-top: 7px;
	max-width: 30px;
}
/*for end google search css*/


#hb_logo {
	display: block;
	max-width: 195px;
	padding-top: 6px;
	padding-left: 2px;
}
.search_icon {
	padding-top: 7px;
	max-width: 30px;
}
.share {
	display: none;
}
}
 @media screen and (max-width: 320px) {
#hb_logo {
	max-width: 185px;
	padding-left: 5px;
}
}

/* added to make embeddding of Vimeo videos responsive */
.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}