
/* ## Site Header ## */
.site-header {position:relative; z-index:1000; margin:0; border-bottom: 1px dashed #686C6D;}
.site-header > .inner {padding:30px 0 10px; background:#fff; position:relative;}
/* static containers to account for header buttons on mobile - allows absolute positioning to the header */
.site-header .container, .site-header [class*="grid-"] {position:static;}

.site-header  a.site-logo {display:block; text-align:center; width:64px; margin-left:10px;}

.header-links {text-align: right;}
.header-links a {  margin: 0 3px; text-decoration: none; display:none;}
.header-links .sep {display:none;}
.header-links a:hover, .header-links a:focus, .header-links a:active {}

.site-search {margin:0 -10px;}
.site-search .search-trigger {position:absolute; top:44px; right:148px; font-size:1.6em; padding:6px 0 0; border:0px; width:48px; height:48px; background:#fff; color:#08A3DB; z-index:2; text-align:center; cursor:pointer;}
.site-search .search-trigger:hover, .site-search .search-trigger:focus, .search-active .site-search .search-trigger {background:#fff;}
.site-search .search-trigger > * {padding-top:0; display:inline-block; width:24px; height:24px;}

.search-active .site-search .search-trigger {background:#08A3DB;}
.search-active .site-search .search-trigger .icon {display:none;}
.search-active .site-search .search-trigger:before,
.search-active .site-search .search-trigger:after {
    content:" ";
    position:absolute;
    left:25%;
    border-radius:0;
    width:50%; height:3px;
    background:#fff;
	top:22px;	
}
.search-active .site-search .search-trigger:before {
	-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);	
}
.search-active .site-search .search-trigger:after {
	-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);	
}

.site-search .inner {display:none; position:absolute; background:#fff; top:100%; margin-top:1px; left:0px; padding:15px 20px; width:100%; }
.search-active .site-search .inner {display:block;}
.site-search .formee input[type="text"] {margin:0px; padding-right:45px;}
/* .site-search .btn {position:absolute; right:0px; top:0px; height:100%;} */

.site-search .btn {position:absolute; right:20px; top:42px; height:40px; padding:0; min-width:45px; border:none;
	background:none;
	color: transparent;
	background-image: url(/cms/images/svg/search-1.svg);
	background-size: 24px 24px;
	background-repeat:no-repeat;
	background-position:50% 50%;
}


.select-metric .settings-trigger {position:absolute; top:44px; right:85px; padding:0; border:0px; width:48px; height:48px; background:#fff; z-index:2; text-align:center; cursor:pointer;}

.metric-active .select-metric .settings-trigger {background:#01305D;}
.metric-active .select-metric .settings-trigger .icon {display:none;}
.metric-active .select-metric .settings-trigger:before,
.metric-active .select-metric .settings-trigger:after {
    content:" ";
    position:absolute;
    left:25%;
    border-radius:0;
    width:50%; height:3px;
    background:#fff;
	top:22px;	
}
.metric-active .select-metric .settings-trigger:before {
	-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);	
}
.metric-active .select-metric .settings-trigger:after {
	-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);	
}


.select-metric .inner {display:none; position:absolute; background:#fff; top:100%; margin-top:1px; left:0px; padding:15px 20px; width:100%; }
.metric-active .select-metric .inner {display:block;}
.select-metric .formee select {margin-bottom:0;}


.cookies-wrpr {background:#F2F2F2;}
.cookies {position:relative; padding:12px 40px 12px 10px;}
button.close-cookies {background:none; border:none; padding:10px; color:#686C6E; font-size:11px; position:absolute; top:0; right:0;}


.header-right {position:absolute; top:10px; right:20px;}
.header-right .account-toggle {text-decoration:none; text-transform:uppercase; color:#01305D;  font-size:13px; font-family: 'Lato', sans-serif; padding-left:20px;}
.header-right .account-toggle:hover,
.header-right .account-toggle:focus {text-decoration:underline; outline:0;}
.header-right .account-toggle img {margin-left:3px; position:relative; top:-2px;}

.header-right .account-toggle:after {
    content:" ";
    display:inline-block;
    position:absolute; top:50%; left:4px;
	width:12px;
	height:12px;
	/* background: transparent url(/cms/images/layout/arrow-triangle.png) no-repeat 0 0; */
	background: transparent url(/cms/images/svg/Triangle-1.svg) no-repeat 0 0;
	margin-top:3px;

    -wekbit-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
    -webkit-transform: scale(0.98) translateY(-50%);
        -ms-transform: scale(0.98) translateY(-50%);
            transform: scale(0.98) translateY(-50%);
}

.account-active .header-right .account-toggle:after{
    -webkit-transform: scale(0.98) translateY(-75%) rotate(-180deg);
        -ms-transform: scale(0.98) translateY(-75%) rotate(-180deg);
            transform: scale(0.98) translateY(-75%) rotate(-180deg);
	margin-top:2px;
	margin-left:-2px;		
}



.header-right .account {
	display: none;
	position: absolute;
	top: 100%;
	width: 100%;
	right:0;
	z-index: 9;
	background: #fff;
	border: 1px solid #e0e0e0;
	margin-top:5px;
}
.header-right .account ul {list-style:none; margin:0; padding:0;}
.header-right .account ul li {border-bottom:1px solid #e0e0e0;}
.header-right .account ul li:last-child {border-bottom:none;}
.header-right .account ul li a {
    display: block;
    font-size: 14px;
    padding: 7px 15px;
    font-weight: 500;
	text-decoration:none;
	color:#01305D;
}
.header-right .account ul li a:hover,
.header-right .account ul li a:focus {background:#E2EEF3;}

.account-active .header-right .account {
	display:block;
}

/* =================================================================
                        Media Queries
===================================================================*/


@media only screen and (min-width:48em){

	.site-header .container, .site-header [class*="grid-"] {position:relative;}
	.site-header > .inner {padding:15px 0 0;}
	.site-header a.site-logo {text-align:left; width:74px; float:left; margin-right:40px; margin-left:0;}
	
	.cookies {padding:12px 40px 12px 0;}
	
	.header-links {margin:0 0 10px;}
	.header-links a {display:inline-block;}
	.header-links .sep {display:inline-block;}
	
	.site-search {margin:5px 20px 0 0; float:left; width:400px;}
	.site-search .inner {display:block; background:none; position:relative; bottom:auto; padding:0px;}
	.site-search .btn {right:0px; top: 23px;}
	.site-search .search-trigger {display:none;}
	
	.select-metric {margin:5px 0 0; float:left; width:180px;}
	.select-metric .inner {display:block; background:none; position:relative; bottom:auto; padding:0px;}	
	.select-metric .settings-trigger {display:none;}	

	.header-right {top:-10px; right:10px;}

}

@media only screen and (min-width:60em){
	.site-search {width:460px;}
}	