﻿@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,600,600i,700,700i);
/** screen.css - compiled from screen.scss (SASS file)  */
/** _mixins.scss  */
/** _colors.scss  */
/** _variables.scss  */
[data-desktop="exclude"] { visibility: hidden; position: absolute; top: -10000px; }

#site-header nav { display: none; }

/* The #megamenu menu is a NAV element in the .main-content that is displayed when an link the main nav has a in-page pointer (#) to the id of a DIV.flyoutmenu element in the #megamenu. The global.js jQuery will, when the link is clicked, open (slide down) the flyout menu. Clicking anywhere outside the opened .flyout DIV will cause the menu top close (slide up). Pressing the ESC key will also close the .flyoutmenu. */
#megamenu { position: absolute; left: 0; right: 0; z-index: 5; color: white; background-color: #00446e; border-top: 0 solid white; -webkit-transition: border 0.2s ease-in-out; -moz-transition: border 0.2s ease-in-out; -ie-transition: border 0.2s ease-in-out; -o-transition: border 0.2s ease-in-out; transition: border 0.2s ease-in-out; }
#megamenu.open { border-top-width: 12px; }
#megamenu.open:after { content: ''; display: block; position: absolute; top: 100%; height: 10px; left: 0; right: 0; background: rgba(0, 0, 0, 0.1); }
#megamenu .flyout { display: none; padding: 20px 0; font-weight: 300; }
#megamenu .flyout:target { display: block; }
#megamenu .sub-flyout { padding: 20px 0; background-color: #33799e; }
#megamenu .sub-flyout p { margin-bottom: 15px; }
#megamenu .flyout-close { position: absolute; display: block; top: 0; right: 20px; padding-top: 2px; padding-left: 10px; padding-right: 35px; font-weight: 500; border: none; font-size: 1em; color: white; background-color: #b94000; cursor: pointer; -webkit-transition: background 0.2s ease-in-out; -moz-transition: background 0.2s ease-in-out; -ie-transition: background 0.2s ease-in-out; -o-transition: background 0.2s ease-in-out; transition: background 0.2s ease-in-out; }
#megamenu .flyout-close:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 25px; border-left: 1px solid #00446e; background-image: url("../images/icon-collapse.light.ie.png"); background-position: 50% 50%; background-repeat: no-repeat; }
#megamenu .flyout-close:hover, #megamenu .flyout-close:focus { background-color: #ec5200; }
#megamenu .flyout-pointer { display: block; position: absolute; top: -8px; margin-left: -8px; border-style: solid; border-width: 0 8px 8px 8px; border-color: transparent transparent #00446e transparent; }
#megamenu h2 a:focus {/* Reset focus state */outline:none}
#megamenu h3, #megamenu .heading {margin:0;padding:0;font-size:1em;font-weight: 600;line-height:21px;}
#megamenu p { width: 90%; }
#megamenu p.introduction { margin: 0; padding: 0; }
#megamenu a, #megamenu a:visited { color: white; }
#megamenu ul.links.bullets > li { background: none; }
#megamenu ul.links > li { background-image: url("../images/icon-list-arrow.right.light.png"); }
#megamenu .group { min-height: 400px; }
#megamenu .group img { float: left; width: 300px; }
#megamenu .group h2, #megamenu .group p, #megamenu .group ul { margin-left: 300px; }
#megamenu .group h2 { font-size: 1.8em; }
#megamenu .date { -webkit-appearance: none; -moz-appearance: none; -ie-appearance: none; -o-appearance: none; appearance: none; display: inline-block; height: 26px; line-height: 26px; padding: 0 10px; text-align: center; font-size: .85em; font-weight: 600; border: none; border-radius: 0; color: black; background-color: #c6d4e5; }
#megamenu .more-link { float: right; margin-right: 30px; }

.flyout .map-locations { margin: 20px 0; }
.flyout .map-locations ul { display: block; list-style: none; margin: 0; padding: 0; }
.flyout .map-locations ul li { display: inline-block; *display: inline; float: left; }
.flyout .map-locations ul li a { display: inline-block; *display: inline; }
.flyout .map-locations ol { margin: 0; padding: 0; /*	
.ui-collapsible {
	[data-collapse="control"] {
		height: inherit;
		min-height: inherit;
		line-height: inherit;
		padding: 1px 0;
		padding-left: $base;		
		background-color: lighten($clay, 3.75%);
		&:hover,
		&:focus {
			background-color: $clay;
		}
	}
	[aria-controls]:after {
		margin-top: -5px;
	}
}
.ui-collapsible [data-collapse="content"] {
	padding: 0;
}
*/ }
.flyout .map-locations ol li { display: block; float: none; }
.flyout .map-locations ol.level2 { margin-left: 35px; padding-bottom: 1.2em; }
.flyout .map-locations ol.level2 > li { padding-left: 5px; }
.flyout .map-locations ol.level2 > li:first-child { padding-top: .3em; }
.flyout .map-locations ol.level2 .ui-collapsible { padding-left: 0; }
.flyout .map-locations ol.level3 { margin-left: 20px; }
.flyout .map-locations a.alphabet_index { display: block; float: left; clear: both; width: 30px; height: 30px; line-height: 30px; margin: 0 0 5px; font-size: .85em; font-weight: 600; text-align: center; color: white; background-color: #266084; }
.flyout .map-locations a.alphabet_index:hover, .flyout .map-locations a.alphabet_index:focus { background-color: #3398bd; text-decoration: none; }
.flyout .map-locations a, .flyout .map-locations a:visited { color: white; }

/* .gallery is the DIV element that provides for displaying images in a gallery-type widget (via JS). */
.gallery { position: relative; margin: 30px auto; background: #ddd; }
.gallery .viewer { position: relative; height: 264px; overflow: hidden; }
.gallery .viewer figure { display: block; position: absolute; top: 0; left: 0; bottom: 0; margin: 0; width: 100%; }
.gallery .viewer figure img { display: block; width: 100%; }
.gallery .viewer figure figcaption { position: absolute; z-index: 1; bottom: 0; right: 0; left: 0; background-color: #29363f; }
.gallery button.gallery-control-prev, .gallery button.gallery-control-next { display: block; position: absolute; bottom: 30px; z-index: 1; margin: 0; padding: 0; overflow: hidden; width: 25px; height: 25px; text-indent: 26px; background-color: #b94000; border: none; border-radius: 0; cursor: pointer; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ie-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.gallery button.gallery-control-prev:hover, .gallery button.gallery-control-prev:focus, .gallery button.gallery-control-next:hover, .gallery button.gallery-control-next:focus { background-color: #ec5200; }
.gallery button.gallery-control-prev { left: 15px; background-image: url("../images/icon-prev.png"); background-position: 50% 50%; background-repeat: no-repeat; }
.gallery button.gallery-control-next { right: 15px; background-image: url("../images/icon-next.png"); background-position: 50% 50%; background-repeat: no-repeat; }

.gallery .tray { overflow: hidden; margin-left: 65px; margin-right: 65px; }
.gallery .tray a { display: block; }
.gallery .tray ul { position: relative; left: 0; display: table; border-collapse: collapse; margin: 14px 0; padding: 0; }
.gallery .tray ul li { display: table-cell; vertical-align: top; color: #fff; border-top: none; }
.gallery .tray ul li ~ li { padding-left: 5px; }

.gallery .tray ul .gallery .tray ul li:first-child { border-left: none; }

.gallery .tray ul li img { display: block; width: 110px; max-width: none; }

/* Trail of links to parent pages in 'landing' and 'subpages'. */
.breadcrumb { margin: 15px 0 15px 20px; line-height: 20px; font-size: .85em; color: #666666; }
.breadcrumb ul { display: block; list-style: none; margin: 0; padding: 0; }
.breadcrumb ul li { display: inline-block; *display: inline; float: left; }
.breadcrumb ul li a { display: inline-block; *display: inline; }
.breadcrumb ul li { padding-left: 12px; padding-right: 8px; float: none; background-image: url("../images/icon-list-arrow.right.dark.png"); background-position: 0 50%; background-repeat: no-repeat; }
.breadcrumb ul li:first-child { padding-left: 0; background: none; }
.breadcrumb ul li a, .breadcrumb ul li a:visited { color: #104486; }

/* #sidebar is the second-level NAV element located in the Left Content Area of a 'landingpage' or 'supage'. */
#sidebar h2 { margin: 0; padding: 15px 20px; font-weight: 400; color: #2a3640; background-color: #f1f1ef; }
#sidebar ul { list-style: none; margin-top: 0; padding: 0; }
#sidebar ul ul { border-bottom: none; }
#sidebar ul li { border-top: 2px solid white; }
#sidebar ul li.ui-collapsible [data-collapse="control"] { min-height: 30px; }
#sidebar ul li.ui-collapsible .ui-collapse-discrete { border-left: 2px solid #e2e2dd; width: 30px; text-indent: 30px; }
#sidebar ul li.ui-collapsible .ui-collapse-discrete:after { right: 10px; }
#sidebar ul li.active > a { color: white; background-color: #33799e; }
#sidebar ul li.active > a > span.ui-collapse-discrete { border-left-color: #3398bd; }
#sidebar ul li.active > a > span.ui-collapse-discrete[aria-controls]:after { background-image: url("../images/icon-expand.light.svg"); }
#sidebar ul li a { display: block; line-height: 1.2em; padding: 5px 20px; padding-right: 60px; text-decoration: none; color: #2a3640; background-color: #d7d7d1; }
#sidebar ul li a:visted { color: #2a3640; }
#sidebar ul li a:hover, #sidebar ul li a:focus { text-decoration: underline; }
#sidebar ul li li a { padding-left: 40px; background-color: #e0e0dc; }
#sidebar ul li li li a { padding-left: 60px; background-color: #eaeae7; }
#sidebar ul li li li li a { padding-left: 80px; background-color: #f3f3f2; }

#sidebar ul li a.activesite { background-color: rgb(0, 68, 110); color: #FFFFFF;}
#sidebar h2 a, #sidebar h2 a:visited, #sidebar h2 a:active {color: #2a3640; text-decoration: none;}

/* A elements in the DOM that are only displaed for smallscreens/mobiles in the CSS media query. */
#navsmallscreen, #searchsmallscreen { display: none; }
