/* ---------------------------------------------------------------------
Original Author: Shawn Rickett
Contributors: blam

Target Browsers: All
Media Type: Screen, Projection
Width: All Sizes
------------------------------------------------------------------------ */

/* --------------------------------------------------------------------
RESET CSS (thanks Eric Meyer)
------------------------------------------------------------------------ */
html, body, div, span, applet, object, iframe, hr,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,  
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
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-weight: inherit;
    font-style: inherit;
    font-family: inherit;
    vertical-align: baseline;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

body:not(.show-focus-outlines) button:focus, 
body:not(.show-focus-outlines) [tabindex]:focus {
  outline: none;
}

/* Always show a vertical scrollbar, even when there is no scrolling */
html {
    overflow-y: scroll;
}

/* Don"t let iOS and WinMobile mobile-optimize text for you */
/* Turn this rule on for mobile sites or sites using mediaqueries */
/*
html {
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
}
*/

/* ---------------------------------------------------------------------
 HTML5 Block / Inline Block declarations
------------------------------------------------------------------------ */
article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section {
    display: block;
}

audio, canvas, video {
    display: inline-block;
}

/* ---------------------------------------------------------------------
 Form Reset Styles
------------------------------------------------------------------------ */
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
    -webkit-appearance: none;
}

input[type=search] {
    -webkit-appearance: none;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

textarea {
    overflow: auto;
    vertical-align: top;
    resize: vertical;
}

::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/* ---------------------------------------------------------------------
 Font Face Helvetica Neue Declarations
------------------------------------------------------------------------ */

/* removed... */


/* ---------------------------------------------------------------------
 Font Face Karen and Lao Declarations
------------------------------------------------------------------------ */

@font-face {
    font-family: 'Karen';
    src: url('/App_Themes/METC/fonts/knu.eot');
    src: url('/App_Themes/METC/fonts/knu.eot?') format('embedded-opentype'),
         url('/App_Themes/METC/fonts/knu.woff') format('woff'),
         url('/App_Themes/METC/fonts/knu.ttf') format('truetype'),
         url('/App_Themes/METC/fonts/knu.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'Noto Sans Lao';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url('/App_Themes/METC/fonts/NotoSansLao-Regular.ttf') format('truetype');
  unicode-range: U+0E81-0EDF, U+200C-200D, U+25CC;
}

/* ---------------------------------------------------------------------
Proxima Nova Styles
------------------------------------------------------------------------ */

@font-face {
font-family:"Bold";
src:url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:700;font-stretch:normal;
}

@font-face {
font-family:"Bold-Condensed";
src:url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:700;font-stretch:condensed;
}

@font-face {
font-family:"Medium";
src:url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff2"),url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff"),url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:600;font-stretch:normal;
}

@font-face {
font-family:"Medium-Condensed";
src:url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff2"),url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff"),url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:600;font-stretch:condensed;
}

@font-face {
font-family:"Roman";
src:url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:400;font-stretch:normal;
}

@font-face {
font-family:"normal";
src:url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:400;font-stretch:normal;
}

@font-face {
font-family:"Condensed";
src:url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:400;font-stretch:condensed;
}

@font-face {
font-family:"Light";
src:url("https://use.typekit.net/af/1be3c2/00000000000000007735e606/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff2"),url("https://use.typekit.net/af/1be3c2/00000000000000007735e606/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff"),url("https://use.typekit.net/af/1be3c2/00000000000000007735e606/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:300;font-stretch:normal;
}

@font-face {
font-family:"Light-Italic";
src:url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff2"),url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff"),url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("opentype");
font-display:auto;font-style:italic;font-weight:400;font-stretch:normal;
}

@font-face {
font-family:"Light-Italictrue";
src:url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff2"),url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff"),url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("opentype");
font-display:auto;font-style:italic;font-weight:400;font-stretch:normal;
}



/* ---------------------------------------------------------------------
 Base Styles
------------------------------------------------------------------------ */

.border-box-sizing *,
.border-box-sizing *::before,
.border-box-sizing *::after 
 {
  box-sizing: border-box; 
}

body {
    background-color: #ffffff;
    color: #252525;
    font: 14px/1 "Roman", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
}

.karen {
    color: #252525;
    font-size: 14px;
    line-height: 1;
    font-family: "Karen", "Karen", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.noto-sans-lao {
  font-family: "Noto Sans Lao", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

.noto-sans-lao links,
.noto-sans-lao .links,
.noto-sans-lao p a,
.noto-sans-lao .ff-light,
.noto-sans-lao .ff-light-italic,
.noto-sans-lao .ff-condensed,
.noto-sans-lao .ff-medium,
.noto-sans-lao .ff-medium-condensed,
.noto-sans-lao .ff-bold,
.noto-sans-lao .ff-bold-condensed,
.noto-sans-lao .text-block,
.noto-sans-lao .BlueDiv,
.noto-sans-lao .YellowDiv,
.noto-sans-lao .Bt-border,
.noto-sans-lao .Bt-border:hover,
.noto-sans-lao .Bt-borderwhite,
.noto-sans-lao .Bt-borderwhite:hover,
.noto-sans-lao .pull-quote,
.noto-sans-lao .readmore,
.noto-sans-lao .bold,
.noto-sans-lao .main strong, .main .noto-sans-lao strong,
.noto-sans-lao .side-block a,
.noto-sans-lao .tab,
.noto-sans-lao .text-strong,
.noto-sans-lao .caption,
.noto-sans-lao .caption-video,
.noto-sans-lao .image-title,
.noto-sans-lao .AccordionHeader720,
.noto-sans-lao .AccordionHeader720S,
.noto-sans-lao .AccordionHeader720s,
.noto-sans-lao .AccordionHeader470,
.noto-sans-lao .AccordionHeader470S,
.noto-sans-lao .AccordionHeader470s,
.noto-sans-lao .AccordionHeader470M,
.noto-sans-lao .AccordionHeader470MS,
.noto-sans-lao .ec_bar button,
.noto-sans-lao .mt-form {
  font-family: "Noto Sans Lao", "Roman", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}


a {
    color: #0054a4;
    text-decoration: none;
    -moz-transition:
        color 0.15s ease-in-out,
        border 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        opacity 0.15s ease-in-out 0s;
    -webkit-transition:
        color 0.15s ease-in-out,
        border 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        opacity 0.15s ease-in-out 0s;
    -ms-transition:
        color 0.15s ease-in-out,
        border 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        opacity 0.15s ease-in-out 0s;
    -o-transition:
        color 0.15s ease-in-out,
        border 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        opacity 0.15s ease-in-out 0s;
    transition:
        color 0.15s ease-in-out,
        border 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        opacity 0.15s ease-in-out 0s;
}

hr {	
  border-bottom: 1px solid #dddddd;	
  margin: 20px 0px 10px 0px;	
}

a:hover,
a:focus {
    text-decoration: underline;
    color: #0070e0;
}

links, .links {
    color: #0054a4;
    /* font-size: 13px; */ /* proxima-nova adjustment */
    font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    text-decoration: none;
    line-height:1.5;
  }

links:hover,
links:focus {
    text-decoration: underline;
    color: #0070e0;
}

img { max-width: 100%; }

.align-right { float: right; }

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.skip a {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    background: #e00000;
    color: #ffffff;
}

.skip a:focus { /* JD - 10/24/16 - make "skip to content" visible when using keyboard navigation */
    position: absolute;
    left: 0px;
    top: 0px;
    background: #e00000;
    outline: 0;
    z-index: 10999;
    height: auto;
    width: auto;
    padding: 7px;
    margin: 3px;
    color: #ffffff;
}

a {
    transition: color .22s ease;
}
  
a {
    background-color: transparent;
}
p a {
 color: #0054a4;
    /* font-size: 13px; */ /* proxima-nova adjustment */
    letter-spacing: .0px;
    font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    text-decoration: none;
    line-height:1.5;
}
/* ---------------------------------------------------------------------
 Font Family Utility Classes
------------------------------------------------------------------------ */

.ff-light { font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; }

.ff-light-italic { font-family: "Light-Italic", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; }

.ff-condensed { font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; }

.ff-medium { font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; }

.ff-medium-condensed { font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; }

.ff-bold { font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; }

.ff-bold-condensed { font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; }

/* ---------------------------------------------------------------------
 State Utility Classes
------------------------------------------------------------------------ */

.is-hidden {
    position: absolute;
    left: -9999px;
}

.hide-me {
    display: block;
    line-height: 0;
    text-indent: -9999px
}

/* ---------------------------------------------------------------------
 Wrapper
------------------------------------------------------------------------ */

.wrapper {
    margin: 0 auto;
    padding: 0 5px;
    /* overflow: hidden; */
    width: 950px;
}

.wrapper:after {
  content: "";
  display: table;
  clear: both;
}

.wrapper-main{
  width:965px;
 }

.wrappermobile {
    margin: 0 auto;
    padding: 0% 0 5%; /* J Dudley - 9/13/17 - fixed "0 %" to "0%" */
    overflow: hidden;
    width: 100%;
}

.wrapper-dropdown { padding: 24px 5px 0; }

.wrapper-carousel { 
    padding: 0; 
    position: relative;
    overflow: visible;
    width: 100%;
}

/* ---------------------------------------------------------------------
 Headings
------------------------------------------------------------------------ */

.hdg {
    display: block;
    line-height: 1;
    color: inherit;
}

.hdg-cap { text-transform: uppercase; }

.hdg-right { text-align: right; }

.hdg-white { color: #ffffff; }

.hdg-blue { color: #0054a4; }

.hdg-black { color: #000000; }

.hdg-grey { color: #252525; } /* #b2b2b2 */

.h1 { font-size: 36px; }

.h2 { font-size: 22px; }

.h3 { font-size: 26px; }

.h4 { font-size: 20px; }

.h5 { font-size: 16px; }

.h6 { font-size: 14px; }

/* ---------------------------------------------------------------------
 Horizontal Lists
------------------------------------------------------------------------ */

.h-list { overflow: hidden; }

.h-list > li { float: left; }

.h-list-std > li + li { margin-left: 10px; }

.h-list-piped > li + li {
    margin-left: 10px;
    border-left: 1px solid;
    padding-left: 10px;
}

.h-list-dropfoot {
    font-size: 20px;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.h-list-dropfoot > li + li {
    margin-left: 45px;
    padding-left: 45px;
    border-left: 2px solid #dfdfdf;
}

.h-list-pagination { padding: 10px 0; }

.h-list-pagination > li + li { margin-left: 9px; }

.h-list-pagination > li > a { padding: 2px 6px; }

.h-list-pager {
    margin-top: 13px;
    text-align: center;
}

.h-list-pager > li {
    display: inline;
    float: none;
}

.h-list-pager > li + li { margin-left: 20px; }

.h-list-pager a { display: inline-block; }

.carousel-nav-item .page {
    width: 14px;
    height: 14px;
    display: inline-block;
    white-space: nowrap;
    text-indent: 200%;
    overflow: hidden;
    cursor: pointer;
    background: transparent url('/App_Themes/METC/Images/function-sprite.png') 0 -163px scroll no-repeat;
}

.carousel-nav-item-active .page { background-position: -32px -163px; }

/* ---------------------------------------------------------------------
 Vertical Lists
------------------------------------------------------------------------ */
.v-list { overflow: hidden; }

.v-list > li { display: block; }

.v-list-std > li + li { margin-top: 1px; }

.v-list-piped > li + li {
    margin-top: 10px;
    border-top: 1px solid;
    padding-top: 10px;
}

.v-list-dropdown {
    font-size: 16px;
    line-height: 1.5;
}

.v-list-sideblock { font-size: 12px; }

.v-list-sideblock > li + li { margin-top: 15px; }


.CMSSiteMapList,
.v-list-bullet {
       list-style-type: disc;
}

.CMSSiteMapList,
.v-list-bullet li {
       margin-left: 15px;
}

/* ---------------------------------------------------------------------
 Buttons
------------------------------------------------------------------------ */
.btn { display: block; }

.icon {
    background: transparent url('/App_Themes/METC/Images/function-sprite.png') 0 0 scroll no-repeat;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-indent: 200%;
}

.arrow {
    display: block;
    position: relative;
    z-index: 1;
    white-space: nowrap;
    text-indent: 200%;
    overflow: hidden;
    background: transparent url('/App_Themes/METC/Images/arrow-sprite.png') 0 0 scroll no-repeat;
}

.btn-arrow-toggle {
    display: inline-block;
    width: 14px;
    height: 12px;
    background-position: 0 -109px;
}

.arrow-toggle-off { background-position: 0 0; }

.btn-sort {
    display: inline-block;
    width: 13px;
    height: 9px;
}

.sort-asc { background-position: -426px 0; }

.sort-desc { background-position: -426px -69px; }

.ImageLinkTint {  
    position: relative;  
    float: left;  
    cursor: pointer;  
}  
  
.ImageLinkTint:before {  
   background: none;    
}  
  
.ImageLinkTint:hover:before {  
    content: "";  
    display: block;  
    position: absolute; 
    top: 0;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    background: rgba(255,255,255, 0.2);  
    -moz-transition: background .2s linear;  
    -webkit-transition: background .2s linear;  
    -o-transition: background .2s linear;  
    transition: background .2s linear; 
}  

/* ---------------------------------------------------------------------
 cover image
------------------------------------------------------------------------ */
.img-container {
  width: 100%;
  height: 300px;
  min-height: 150px;
  overflow: hidden;
  margin: 0;
  position: relative;
}

.img-container img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  max-width: 100%;
}

.text-container {
  margin-right: auto;
  margin-left: auto;
  width: 960px;
  height: 100%;
}

.text-blockCW {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width:960px;
  text-align: center;
  font-size: 40px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  color: white;
}
  .text-blockMCblue {	
  position: absolute;	
  bottom:0%;	
  width:920px;	
  padding: 20px 15px 20px 30px;	
  background: rgba(0, 93, 170, 0.8);	
  /* Blue background with 0.5 opacity */	
  text-align: center;	
  font-size: 25px;	
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;	
  color: white;	
}	
.text-blockMCblueMobile{	
  position: absolute;	
  top: 75%;	
  left: 0%;	
  bottom:0%;	
  width:100%;	
  padding: 25px 15px 20px 30px;	
  background: rgba(0, 93, 170, 0.8);	
  /* Blue background with 0.5 opacity */	
  text-align: center;	
  font-size: 25px;	
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;	
  color: white;	
}

.text-blockES {
  position: absolute;
  bottom:0%;
  width:920px;
  padding: 20px 15px 20px 30px;
  background: rgba(0, 154, 199, 0.8);
  /* Blue background with 0.5 opacity */
  text-align: center;
  font-size: 25px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  color: white;
}

.text-block {
  position: absolute;
  bottom: 5%;
  max-width: 300px;
  padding: 20px 30px 10px 30px;
  background: rgba(0, 0, 0, 0.5);
  /* Black background with 0.5 opacity */
  font-size: 20px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  color: white;
}

/* ---------------------------------------------------------------------
 Media Object
------------------------------------------------------------------------ */

.media { overflow: hidden; }

.media-media {
    float: left;
    margin-right: 11px;
}

.media-bd { overflow: hidden; }

.media-stacked > .media-media {
    float: none;
    margin-right: 0;
    margin-bottom: 15px;
}

.media-dropdown > .media-media { margin-right: 3px; }

.media-mission > .media-media { margin-right: 25px; }

.media-tip { margin-top: 25px; }

.media-tip > .media-bd { line-height: 1.5; }

/* ---------------------------------------------------------------------
 Grid
------------------------------------------------------------------------ */
.grid-row-styleguide { margin-bottom: 20px; }

.grid-row-styleguide > .grid-col > .box {
    padding-top: 10px;
    padding-bottom: 10px;
}

.grid-row { /* overflow: hidden; */ }

.grid-row:after {
  content: "";
  display: table;
  clear: both;
}

.grid-row.space-plus-line {
  padding: 10px 0px 7px;
  border-bottom: 1px solid #dddddd;
}

.grid-col { float: left; margin-bottom: 1px; }

.grid-col + .grid-col { margin-left: 10px; }

.size1of24 { width: 30px; }
.size2of24 { width: 70px; }
.size3of24 { width: 110px; }
.size4of24 { width: 150px; }
.size4pointfiveof24{ width: 177.5px; }
.size5of24 { width: 190px; }
.size6of24 { width: 230px; }
.size7of24 { width: 270px; }
.size8of24 { width: 310px; }
.size9of24 { width: 350px; }
.size10of24 { width: 390px; }
.size11of24 { width: 430px; }
.size12of24 { width: 470px; }
.size13of24 { width: 510px; }
.size14of24 { width: 550px; }
.size15of24 { width: 590px; }
.size16of24 { width: 630px; }
.size17of24 { width: 670px; }
.size18of24 { width: 710px; }
.size19of24 { width: 750px; }
.size20of24 { width: 790px; }
.size21of24 { width: 830px; }
.size22of24 { width: 870px; }
.size23of24 { width: 910px; }
.size24of24 { width: 950px; }

/* ---------------------------------------------------------------------
 Suffix
------------------------------------------------------------------------ */

.suffix1of24 { padding-right: 40px; }
.suffix2of24 { padding-right: 80px; }
.suffix3of24 { padding-right: 120px; }
.suffix4of24 { padding-right: 160px; }
.suffix4pointfiveof24{ padding-right: 187.5px; }
.suffix5of24 { padding-right: 200px; }
.suffix6of24 { padding-right: 240px; }
.suffix7of24 { padding-right: 280px; }
.suffix8of24 { padding-right: 320px; }
.suffix9of24 { padding-right: 360px; }
.suffix10of24 { padding-right: 400px; }
.suffix11of24 { padding-right: 440px; }
.suffix12of24 { padding-right: 480px; }
.suffix13of24 { padding-right: 520px; }
.suffix14of24 { padding-right: 560px; }
.suffix15of24 { padding-right: 600px; }
.suffix16of24 { padding-right: 640px; }
.suffix17of24 { padding-right: 680px; }
.suffix18of24 { padding-right: 720px; }
.suffix19of24 { padding-right: 760px; }
.suffix20of24 { padding-right: 800px; }
.suffix21of24 { padding-right: 840px; }
.suffix22of24 { padding-right: 880px; }
.suffix23of24 { padding-right: 920px; }

/* ---------------------------------------------------------------------
 Prefix
------------------------------------------------------------------------ */

.prefix1of24 { padding-left: 40px; }
.prefix2of24 { padding-left: 80px; }
.prefix3of24 { padding-left: 120px; }
.prefix4of24 { padding-left: 160px; }
.prefix4pointfiveof24{ padding-left: 187.5px; }
.prefix5of24 { padding-left: 200px; }
.prefix6of24 { padding-left: 240px; }
.prefix7of24 { padding-left: 280px; }
.prefix8of24 { padding-left: 320px; }
.prefix9of24 { padding-left: 360px; }
.prefix10of24 { padding-left: 400px; }
.prefix11of24 { padding-left: 440px; }
.prefix12of24 { padding-left: 480px; }
.prefix13of24 { padding-left: 520px; }
.prefix14of24 { padding-left: 560px; }
.prefix15of24 { padding-left: 600px; }
.prefix16of24 { padding-left: 640px; }
.prefix17of24 { padding-left: 680px; }
.prefix18of24 { padding-left: 720px; }
.prefix19of24 { padding-left: 760px; }
.prefix20of24 { padding-left: 800px; }
.prefix21of24 { padding-left: 840px; }
.prefix22of24 { padding-left: 880px; }
.prefix23of24 { padding-left: 920px; }

_:-ms-input-placeholder, :root .grid-col.size5of24.prefix1of24 {
  overflow: hidden !important; /* Override inline style from generated code */
}

/* ---------------------------------------------------------------------
 Space 
------------------------------------------------------------------------ */
.topspace{margin-top: 8px;}
.topspace10{margin-top: 10px;}
.topspace15{margin-top: 15px;}
.topspace20{margin-top: 20px;}
.topspace30{margin-top: 30px;}
.topspace40{margin-top: 40px;}
.topspace50{margin-top: 50px;}

.bottomspace{margin-bottom: 8px;}
.bottomspace10{margin-bottom: 10px;}
.bottomspace15{margin-bottom: 15px;}
.bottomspace20{margin-bottom: 20px;}
.bottomspace30{margin-bottom: 30px;}
.bottomspace40{margin-bottom: 40px;}
.bottomspace50{margin-bottom: 50px;}

.toppad{padding-top: 8px;}
.toppad10{padding-top: 10px;}
.toppad15{padding-top: 15px;}
.toppad20{padding-top: 20px;}
.toppad30{padding-top: 30px;}
.toppad40{padding-top: 40px;}
.toppad50{padding-top: 50px;}

.bottompad{padding-bottom: 8px;}
.bottompad10{padding-bottom: 10px;}
.bottompad15{padding-bottom: 15px;}
.bottompad20{padding-bottom: 20px;}
.bottompad30{padding-bottom: 30px;}
.bottompad40{padding-bottom: 40px;}
.bottompad50{padding-bottom: 50px;}

.rightsidespace{margin-bottom: 10px;}

.paddingr{
  padding: 0px 10px 0px 0px;
}
.paddingl{
  padding: 0px 0px 0px 10px;
}
.paddingrl{
  padding: 0px 10px 0px 10px;
}
.imagespacerightbottom{
  margin: 0px 5px 5px 0px;
}
.imagespacerighttop{
  margin: 5px 5px 0px 0px;
}
.imagespaceleftbottom{
  margin: 0px 0px 5px 5px;
}
.imagespacelefttop{
  margin: 5px 0px 0px 5px;
}
.imagespaceleftrightbottom{
  margin: 0px 5px 5px 5px;
}
.imagespaceleftrighttop{
  margin: 5px 5px 0px 5px;
}
.imagespaceright{
  margin: 0px 10px 0px 0px;
}
.imagespaceallsides{
  margin: 5px;
}
.imagespacebottom{	
  margin: 0px 0px 5px 0px;	
}

div.parentcallout{ 
    display:table;
    width:100%;
    margin:5px 0; /* you can change/remove margin */
}
div.textcallout{ 
    vertical-align:middle;
    display:table-cell;
    text-align:right;
}
div .img{
    vertical-align:middle;
    display:table-cell;
    padding: 0px 0px 0px 0px ;
}

/* Slide */
.hoverslide figure img {
    margin-left: 0px;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.hoverslide figure:hover img {
    margin-left: 15px;
}

/* ---------------------------------------------------------------------
 Box Module
------------------------------------------------------------------------ */

.box { background-color: #ffffff; }

.box-grey { background-color: #f4f4f4; padding: 15px 25px 15px 25px; margin-bottom: 10px;}

.box-blue { background-color: #b4d5f0cc; padding: 15px 25px 15px 25px; margin-bottom: 10px; }

.box-darkblue { background-color: #002b5c; padding: 15px 25px 15px 25px; margin-bottom: 10px; }

/* --- colors for SOTR Only ---*/
.box-blue1 { background-color: #60C8E9; padding: 15px 25px 15px 25px; margin-bottom: 10px; }
.box-blue2 { background-color: #a4dbf0; padding: 15px 25px 15px 25px; margin-bottom: 10px; }
.box-blue3 { background-color: #c2e6f5; padding: 15px 25px 15px 25px; margin-bottom: 10px; }

.box-bordered { border: 1px solid #e3e3e3; }

.box-hd { padding: 7px 10px; }

.box-bordered > .box-hd { background: #777777; }

.box-bd { padding: 10px; }

.box-filters { background: #ededed; }

.box-filters > .box-hd { padding: 25px 25px 0; }

.box-filters > .box-bd {
    overflow: hidden;
    padding: 15px 0 25px 25px;
}

.box-tips { margin-top: 25px; }

/* ---------------------------------------------------------------------
 Global Header
------------------------------------------------------------------------ */

.global-header {
    position: relative;
    z-index: 5112;
}

.utility-header {
    border-bottom: 1px solid #ffffff;
    background-color: #0054a4;
    color: #ffffff;
    font-size: 14px;
}

.utility-header nav { /* new nav */
    display: inline-block;
    width: auto;
}


.utility-nav {
    padding: 11px 0 7px;
    display: inline-block;
    color: #ffffff;
}

.utility-nav-padright
{
    padding-right:10px;
} 

.utility-header a { color: #ffffff; }
.utility-nav a { color: #ffffff; }

.utility-nav a:hover {
    color: #76bcff;
    text-decoration: underline;
}

.search-form {
    margin: 6px 0 0 14px;
    position: relative;
    display: inline-block;
    vertical-align: top;
}

.search-form div > input {
    margin: 0;
    border: none;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    padding: 2px 10px 2px 20px;
    width: 76px;
    background: #ffffff url('/App_Themes/METC/Images/icon-search.png') 5px 5px scroll no-repeat;
}

.search-form label {
    display: block;
    position: absolute;
    top: -9999px;
    left: -9999px;
}

.search-form input[type="submit"] {
    display: none;
}

.search-highlight {
  background-color: yellow; 
}

.btn-delete {
    position: absolute;
    top: 4px;
    right: 5px;
    width: 14px;
    height: 14px;
    background-position: -25px -3px;
}

.navigation {
    position: relative;
    top: 2px;
    background-color: #ededed;
}

.navigation-main {
  position: relative;
}

.main-logo {
    margin: 10px 0 0 21px;
    float: left;
    position: relative;
    z-index: 1;
}

/* ---------------------------------------------------------------------
 Main Navigation
------------------------------------------------------------------------ */

.main-nav, nav-menu {
    margin-left: 30px;
    float: left;
}

.main-nav > li {
    float: left;
    font-size: 16px;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.main-nav > li + li { cursor: pointer; }

.main-nav > li > a {
    display: inline-block;
    border-style: solid;
    border-width: 10px 1px 2px;
    border-color: transparent;
    padding: 33px 9px 34px 36px;
    position: relative;
    z-index: 2;
    color: #005dab;
    background: transparent url('/App_Themes/METC/Images/arrow-sprite.png') 11px 34px scroll no-repeat;
    text-transform: uppercase;
}

.main-nav > li:hover a,
.main-nav > li > a.active {
    background: transparent url('/App_Themes/METC/Images/arrow-sprite.png') 11px 34px scroll no-repeat;
    text-decoration: none;
}
.BlueDivNoFont {
    display: block;
    background-color: #0054a4;
    color: #fff;
    padding: 5px;
    margin: 5px 5px 5px 5px;
    border: 0px;
    text-align: center;
}
.BlueDiv {
    display: block;
    background-color: #0054a4;
    color: #fff;
    padding: 5px;
    margin: 5px 5px 5px 5px;
    border: 0px;
    text-align: center;
    font-size: 16px;
    text-decoration: none;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}
.BlueDiv:hover, .BlueDivNoFont:hover{
    background: #002a5c;
    text-decoration: none;
    color: #fff;
  }
.BlueDiv:focus, .BlueDivNoFont:focus {
  display: block;
  background: #002a5c;
  text-decoration: none;
  color: #fff;
}

.YellowDiv {
    display: block;
    background-color: #FFd200;
    color: #0054a4;
    padding: 5px;
    margin: 5px 5px 5px 5px;
    border: 0px;
    text-align: center;
    font-size: 16px;
    text-decoration: none;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}
.YellowDiv:hover{
    background: #EEC500;
    text-decoration: none;
    color: #0054a4;
  }

.Bt-border{
  border: 1px solid #0054a4!important;
  padding:10px 30px 10px 30px;
  border-radius: 16px;
  margin-top:10px;
  font-size: 12px;
  line-height: 12px;
  text-decoration: none;
  color: #0054a4;
  font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  text-align: center;
}

.Bt-border:hover{
  border: 1px solid #0054a4!important;
  background-color:#0054a4!important;
  padding:10px 30px 10px 30px;
  border-radius: 16px;
  margin-top:10px;
  font-size: 12px;
  text-decoration: none;
  color: #fff;
  font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  text-align: center;
}

.Bt-borderwhite{
  border: 1px solid #fff!important;
  padding:10px 30px 10px 30px;
  border-radius: 16px;
  margin-top:10px;
  font-size: 12px;
  line-height: 12px;
  text-decoration: none;
  color: #fff;
  font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  text-align: center;
}

.Bt-borderwhite:hover{
  border: 1px solid #fff!important;
  background-color:#0054a4!important;
  padding:10px 30px 10px 30px;
  border-radius: 16px;
  width: fit-content;
  margin-top:10px;
  font-size: 12px;
  text-decoration: none;
  color: #fff;
  font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  text-align: center;
}
.center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.Bt-border {
   margin-bottom: 10px;
   display: inline-block;
}
.bottomspace30 .Bt-border {
   margin-bottom: 0px;
   display: inline;
}

/* ---------------------------------------------------------------------
 Mega Dropdown
Changed hover color from #76bcff to #0071da Oct 2014
Ed Lube
------------------------------------------------------------------------ */
.dropdown {
    border-top: 1px solid transparent;
    border-bottom: 8px solid transparent;
    position: absolute;
    top: 93px;
    left: -9999px;
    z-index: 1;
    width: 100%;
    background-color: #ffffff;
}

.main-nav > li:hover .dropdown { left: 0; }

.main-nav > li .dropdown a { background: none; }

.main-nav > li:hover .dropdown a:hover {
    color: #0071da;
    text-decoration: underline;
}

.dropdown-footer { padding: 20px 0; }

.dropdown-footer > .wrapper {
    padding-top: 20px;
    border-top: 1px solid #ededed;
}

.sub-link { color: #009ccc; }

/* ---------------------------------------------------------------------
 Skins / Colors
------------------------------------------------------------------------ */

.theme-red { color: #ee3124; }

a.theme-red:hover {
    color: #ee3124;
    text-decoration: underline;
}

.main-nav > li.theme-red:hover a,
.main-nav > li.theme-red > a.active { border-color: #ee3124 #ee3124 #ffffff #ee3124; }

.main-nav > li.theme-red > a.active:hover { border-color: #ee3124 #ee3124 #ffffff #ee3124; }

.main-nav > li.theme-red > .dropdown { border-color: #ee3124 #ee3124 #ededed #ee3124; }

.drawer-theme-red {
    position: relative;
    border-style: solid;
    border-width: 1px 0 0 0;
    border-color: #ee3124 transparent transparent transparent;
}

.theme-aqua { color: #009ac7; }

a.theme-aqua:hover {
    color: #009ac7;
    text-decoration: underline;
}

.main-nav > li.theme-aqua:hover a,
.main-nav > li.theme-aqua > a.active { border-color: #009ac7 #009ac7 #ffffff #009ac7; }

.main-nav > li.theme-aqua > a.active:hover { border-color: #009ac7 #009ac7 #ffffff #009ac7; }

.main-nav > li.theme-aqua > .dropdown { border-color: #009ac7 #009ac7 #ededed #009ac7; }

.drawer-theme-aqua {
    position: relative;
    border-style: solid;
    border-width: 1px 0 0 0;
    border-color: #009ac7 transparent transparent transparent;
}

.theme-green { color: #759E2E; } /* #78a22f */ 

a.theme-green:hover {
    color: #759E2E; /* #78a22f */ 
    text-decoration: underline;
}

.main-nav > li.theme-green:hover a,
.main-nav > li.theme-green > a.active { border-color: #759E2E #759E2E #ffffff #759E2E; } /* #78a22f */ 

.main-nav > li.theme-green > a.active:hover { border-color: #759E2E #759E2E #ffffff #759E2E; } /* #78a22f */ 

.main-nav > li.theme-green > .dropdown { border-color: #759E2E #759E2E #ededed #759E2E; } /* #78a22f */ 

.drawer-theme-green {
    position: relative;
    border-style: solid;
    border-width: 1px 0 0 0;
    border-color: #759E2E transparent transparent transparent; /* #78a22f */ 
}

.theme-dkblue { color: #002b5c; }

a.theme-dkblue:hover {
    color: #002b5c;
    text-decoration: underline;
}

.main-nav > li.theme-dkblue:hover a,
.main-nav > li.theme-dkblue > a.active { border-color: #002b5c #002b5c #ffffff #002b5c; }

.main-nav > li.theme-dkblue > a.active:hover { border-color: #002b5c #002b5c #ffffff #002b5c; }

.main-nav > li.theme-dkblue > .dropdown { border-color: #002b5c #002b5c #ededed #002b5c; }

.drawer-theme-dkblue {
    position: relative;
    border-style: solid;
    border-width: 1px 0 0 0;
    border-color: #002b5c transparent transparent transparent;
}


.main-nav > li > a.active.hide {
    background: transparent url('/App_Themes/METC/Images/arrow-sprite.png') 11px 34px scroll no-repeat;
    border-color: transparent;
}

/* ---------------------------------------------------------------------
 Hero Carousel
------------------------------------------------------------------------ */
.hero {
    border-top: 2px solid #ffffff;
    height: 360px;
    margin: 0 0 12px 0;
    position: relative;
    overflow: hidden;
}

.main-carousel {
    position: relative;
    overflow: hidden;
    width: 960px;
    height: 335px;
}

.slide {
    position: relative;
    height: 335px;
    display: inline-block;
}

.slide + .slide { margin-left: -4px; }

.slide-img {
    position: absolute;
    top: 0;
    left: 0;
}

.slide-info {
    position: absolute;
    bottom: 0;
    left: 40px;
    padding: 30px 0 30px 20px;
    width: 330px;
    height: 160px;
    color: white;
    z-index: 11;
    max-width: 80%;
}

.slide-text-box {
    position: absolute;
    bottom: 0;
    left: 40px;
    padding: 30px 0 30px 20px;
    width: 330px;
    height: 160px;
    background-color: #002b5c;
    background-color: rgba(0,43,92,0.8);
    z-index: 10;
}

.article-pull {
    padding-right: 20px;
    line-height: 1.5;
}

.learn-more {
    margin: 20px 0 0;
    padding: 10px 0 10px 10px;
    display: block;
    text-transform: uppercase;
    color: #ffffff;
    font-size: 16px;
    background-color: #4a6584;
    background: rgba(255,255,255,0.2) url('/App_Themes/METC/Images/arrow-sprite.png') 313px -262px scroll no-repeat;
}

a.learn-more:hover, a.learn-more:focus { /* J Dudley - 7/9/18 - added hover+focus */
    color: #ffffff;
    background-color: rgba(255,255,255,0.25);
}

/* ---------------------------------------------------------------------
 Carousel Dots Menu
------------------------------------------------------------------------ */

.carousel-pager {
    display: block;
    margin: 13px auto;
    width: 100px;
}

.arrow-right {
    width: 15px;
    height: 25px;
    background-position: 0 -341px;
    position: absolute;
    top: 156px;
    left: 929px;
}

.arrow-left {
    width: 15px;
    height: 25px;
    background-position: -140px -341px;
    position: absolute;
    top: 156px;
    left: 7px;
}

/* ---------------------------------------------------------------------
 Main Section
------------------------------------------------------------------------ */

.main { margin: 20px 0; }

.mainmobile{ margin: 20px 5% 0 5% ; }

.masthead { margin-top: 10px; }

.social-media-links {float: right; margin-bottom: 13px;}

.page-title {
    margin-bottom: 20px; /*5px*/
    border-bottom: 1px solid #dddddd;
    padding-bottom: 10px;
}

.page-title p { line-height: 1.5em; }

.title-date { margin-top: 25px; }

.subhead { margin-top: 5px; }

.subhead .h4 { line-height: 1.5; font-size: 16px; }  

/*** start home page updates ***/

.arrow-link:after {
    content: " >";
}

.feature-home-wrapper {
  position: relative;
}

.feature-home-wrapper img {
  width: 100%;
}

.feature-box {
  position: absolute;
  left: 0;
  bottom: 20px;
  width: 45%;
  text-align: right;
}

.feature-box-wrapper {
  background: rgba(0, 84, 164, 0.8);
  padding: 20px;
  overflow: auto;
}

.feature-box-text {
  float: right;
  max-width: 375px;
}

.feature-box-main {
  font-size: 28px;
  text-transform: uppercase;
  color: #ffffff;
  font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
}

.feature-box-sub {
  font-size: 16px;
  line-height: 19px;
  color: #cad3e0;
  margin-left: 30%;
  margin-top: 8px;
}

.feature-box-link a {
  display: inline-block;
  margin-top: 5px;
  padding: 10px 20px;
  background: rgba(224, 234, 244, 0.8);
  font-size: 15px;
  font-weight: bold;
}

.feature-box-link a::after {
  content: " >";
}

.home-features {
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding: 14px 0px 14px 0px;
    background-color: #efefef;
}

.home-features-light {
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding: 30px 0px 30px 0px;
    background-color: #fcfcfc;
}

.home-features-center {
    text-align: center;
}

.home-features-center h1 {
    line-height: 1.5;
    font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
}

.home-features-center div {
    font-size: 22px;
    color: #0054a4;
}

.home-features-center img {
    max-height: 250px;
    max-width: 250px;
    border-radius: 150px;
}

.home-features-center a {
  display: inline-block;
  margin-top: 5px;
  padding: 10px 0px;
  background: rgba(224, 234, 244, 0.8);
  font-size: 15px;
  font-weight: bold;
  width:100%;
}

.home-features-center .column-padding {
    padding: 30px 20px;
}

.round-image-bg-150 {
    overflow: hidden;
    background-size: cover;
    background-position: center;
    height: 150px;
    width: 150px;
    display: inline-block;
    border-radius: 75px;
}

.home-featured-link {
    float: right;
}

.home-featured-link a {
    background: rgba(224, 234, 244, 0.8);
    padding: 6px 13px;
    font-size: 4;
    display: inline-block;
    font-weight: bold;
    margin-top: 5px;
    margin-left: 20px;
}

.home-features-left {
    text-align: left;
}

.home-features-left img {
    margin: 30px;
    float: left;
}

.home-features-left-wrapper, .home-features-center .home-features-left-wrapper{
    display: table-cell;
    vertical-align: middle;
    height: 210px;
    font-size: 20px;
    color: #000000;
}

.feature-box-link a:hover, .feature-box-link a:focus, .home-features-center a:hover, .home-featured-link :hover {
  background: rgba(224, 234, 244, 1.0);
  }


/*** end home page updates ***/

.home-features-blue {
    border-top: 1px solid rgba(180,213,240,.8);
    border-bottom: 1px solid rgba(180,213,240,.8);
    padding: 20px 0px 20px 0px;
    background-color: rgba(180,213,240, 0.13);
}

.home-features-red {
    border-top: 1px solid rgba(238,49,36,.8);
    border-bottom: 1px solid  rgba(238,49,36,0.8);
    padding: 14px 0px 14px 0px;
    background-color: rgba(238,49,36, 0.03);
}

.home-features-yellow {
    border-top: 1px solid rgba(255,210,0,.8);
    border-bottom: 1px solid  rgba(255,210,0,.8);
    padding: 14px 0px 14px 0px;
    background-color: rgba(255,210,0, 0.05);
}

.home-features-green {
    border-top: 1px solid rgba(120,162,7,.8);
    border-bottom: 1px solid  rgba(120,162,7,0.8);
    padding: 14px 0px 14px 0px;
    background-color: rgba(120,162,7,0.05);
}

.home-features-blue-dark-noborder {
    padding: 14px 0px 14px 0px;
    background-color: rgba(180,213,240, 0.33);
}

.home-features-blue-noborder {
    padding: 14px 0px 14px 0px;
    background-color: rgba(180,213,240, 0.13);
}

.home-features-ES-natural{
    border-top: 1px solid rgba(180,213,240,.8);
    border-bottom: 1px solid rgba(180,213,240,.8);
    padding: 30px 0px 30px 0px;
    background-image:url('/Wastewater-Water/Projects/Metro-Plant-Solids-Management/Images/naturalenvironment-blue.aspx');background-size:cover;background-position:30%;}
}

/*** start home page updates ***/

.featured-news-list {
  overflow: auto;
}

.featured-news-item {
  float: left;
  width: calc(33.33% - 20px);
  margin: 15px 30px 15px 0px;
}

.featured-news-item-inner {
  overflow: hidden;
  background-size: cover;
  background-position: center;
  position: relative;
  height: 250px;
}

.featured-news-item:nth-child(3n+3) {
  margin-right: 0px;
}

.featured-news-text {
 background-color: #000000;
}



.featured-news-text a {
  display: block;
  position: absolute;
  bottom: 0;
  min-height: 63px;
  background: #000000;
  color: #ffffff;
  line-height: 1.5;
  font-size: 14px;
  padding: 0px 30px 0px 15px;
  background: url(/App_Themes/METC/images/blackoverlaywitharrow.png)center right;
  width: calc(100% - 40px);
}

.featured-news-text a:hover {
  /*opacity: 0.8;*/
  }
.featured-news-text a span {
  vertical-align: middle;
  display: table-cell;
  height: 63px;
}

.meeting-list {
  line-height: 1.2;
  overflow: auto;
  margin-top: 15px;
}

.meeting-item {
    overflow: auto;
    float: left;
    width: calc(33.33% - 20px);
    margin-right: 30px;
    margin-bottom: 15px;
    background-color: #eee;
}

.meeting-item:nth-child(3n+3) {
    margin-right: 0px;
}

.meeting-item-full {
    display: inline-block;
    width: 100%;
    margin-right: 30px;
    margin-bottom: 15px;
    background-color: #eee;
}

.meeting-date {
  float: left;
  padding: 5px;
  margin: 10px 15px 10px 10px;
  background-color: #757575;
  color: #ffffff;
  text-align: center;
  width: 31px;
}

.meeting-date .date-number {
  display: block;
  font-size: 26px;
  font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.meeting-date .date-month {
  display: block;
  font-size: 16px;
  font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.meeting-details {
  float: left;
  width: 230px;
  padding-top: 10px;
  font-weight: bold;
}

.meeting-name {
  margin-bottom: 5px;
  font-size: 15px;
}

/*** end home page updates ***/

.news-teaser {
    margin-bottom: 5px;
}

.wysiwyg .news-teaser p {
    margin-bottom: 5px;
}

.meeting-time {
    /*padding-bottom: 7px;*/
}

.internal-meeting-list .internal-meeting-list * {
  box-sizing: border-box;
}

.internal-meeting-list, .internal-event-list {
    overflow: auto;
    padding-bottom: 5px;
    border-bottom: 1px solid #dddddd;
    margin-bottom: 30px;
}

.internal-meeting-list .meeting-details {
  width: 64%;
  min-height: 75px;
  padding-bottom: 6px;
}

.internal-event-list .meeting-item {
    width: calc(50% - 15px);
}

.internal-event-list .meeting-item:nth-child(3n+3) {
    margin-right: 30px;
}

.internal-event-list .meeting-item:nth-child(2n+2) {
    margin-right: 0px;
}

.internal-event-list .meeting-details {
  width: 80%;
  min-height: 75px;
  padding-bottom: 6px;
}

.feature {
    position: relative;
    display: block;
}

.feature img { display: block; }

.feature-hd {
    padding: 15px 30px;
    position: absolute;
    bottom: 20px;
    left: 0;
    background-color: #21282b;
    background-color: rgba(33,40,43,0.6);
}

.article {
    margin-bottom: 20px;
    border-bottom: 1px solid #dddddd;
    padding-bottom: 20px;
    margin-top: 0px; /*20px*/
}

.article-media { padding-bottom: 0; }

.article-hd {
    padding-bottom: 10px;
    /*margin-bottom: 10px*/
}

.article-snippet .hdg {
    margin-bottom: 0px;
    display: block;
}

.article-see-full { /* 6-10-16 J Dudley added for MediaCoverage links */
    margin: 10px 0px;
}

.pull-quote {
    margin: 10px 0;
    padding: 5px 0;
    font-size: 18px;
    letter-spacing: 1.5px;
    font-family: "Light-Italic", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    color: #0054a4;
    line-height: 1;
}

.article-bd > p {
    margin-bottom: 25px;
    line-height: 1.5;
    font-size: 14px;
}

.article-bd > .hdg { margin-bottom: 15px; }

.article-ft > p { margin-bottom: 12px; }

.article-ft { /* 5-27-16 JD */
    padding-top: 15px; 
    margin-top: 15px; 
    border-top: solid 1px #dddddd;
}

.readmore {
    margin-top: 10px; /* 6-15-16 JD */
    display: block;
    font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.article-compact {
    overflow: auto;
    padding-bottom: 15px;
    margin-top: 15px;
    border-bottom: 1px solid #dddddd;
}

.article-compact .news-image-thumb {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    height: 100px;
    width: 100px;
    float: left;
    margin-right: 15px;
}

.article-compact .news-body {
    float: left;
    width: calc(100% - 115px);
}

.main strong,
.bold { font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif; }

.side-block { font-size: 12px ;}

.side-block + .side-block { margin-top: 25px; }

.side-block a {
    display: block;
    font-family: "medium-condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 14px;
}

.side-block p {
    margin: 10px 0;
    line-height: 1.35;
}

.icon-alert {
    margin-left: 10px;
    background-position: -48px 0;
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: bottom;
}

a[rel$="has-icon"] {
    display: block;
    background: transparent url('/App_Themes/METC/Images/function-sprite.png') -76px -1px scroll no-repeat;
    padding: 2px 0 0 20px;
}

.hor-rule {
    margin-bottom: 10px;
    margin-top: 10px;
    border-bottom: 1px solid #dddddd;
}

.hor-rule-green {
    margin-bottom: 10px;
    margin-top: 10px;
    border-bottom: 1px solid #759E2E; /* #78a22f */
}
.calloutBlueMed{
    color: #0054a4;
    font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    text-transform: uppercase;
    line-height: 40px
}
.calloutDarkBlueMedium{
    color: #002B5C;
    font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    line-height: 40px
}
.calloutRedMedium{
    color: #ee3124;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    line-height: 40px
}
.calloutGreenMedium{
    color: #759E2E; /* #78A22F */
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    line-height: 40px
}
.calloutBlueLarge{
    color: #0054a4;
    font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 40px;
    text-transform: uppercase;
    line-height: 50px
}
.calloutBlueMedLight{	
    color: #0054a4;	
    font-family: "light", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;	
    font-size: 25px;	
    text-transform: uppercase;	
    line-height: 50px	
    }
.calloutDarkBlueLarge{
    color: #002B5C;
    font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 30px;
    line-height: 50px
}
.calloutRedMed{
    color: #ee3124;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    text-transform: uppercase;
}
.calloutRedMed:hover{
    color: #911218;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    text-transform: uppercase;
}
sup {
    vertical-align: super;
    font-size: 10px;
}

/* --------
Image styling
----------- */

.imgCircle {
  border-radius: 50%;
}
.imgRounded {
  border-radius: 20px;
}

/* ---------------------------------------------------------------------
 Alerts Styles
------------------------------------------------------------------------ */

.alert-wrapper {
    background-color: rgba(120,162,7,0.05);
    padding: 0px;
    display: none;
}

.alert-full-width{
  margin: 0px;
}

.alerticon {
    float: left;
    width: calc(100% - 120px);
}

/*ALERT (Blue)*/
/*ALERT (red)*/
.alert-type-alert {
/*  border-top: 1px solid rgba(238,49,36,.8);
    border-bottom: 1px solid  rgba(238,49,36,0.8);
    padding: 4px 0px 4px 0px;
    background-color: rgba(238,49,36, 0.03);*/
}
.alert-type-alert .alerticon {
    min-height: 37px;
    background: url(/Files/UI/Alert37.aspx) no-repeat scroll 0px 2px;
    margin-top:10px;
}
.alert-type-alert .alert-title {
    color: #0054a4;
    font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    line-height: 20px;
    padding: 0px 0px 0px 50px;
}

/*CAUTION (yellow)*/
.alert-type-caution {
/*  border-top: 1px solid rgba(255,210,0,.8);
    border-bottom: 1px solid  rgba(255,210,0,.8);
    padding: 4px 0px 4px 0px;
    background-color: rgba(255,210,0, 0.05);*/
}
.alert-type-caution .alerticon, .warningicon {
    min-height: 37px;
    background: url(/Files/UI/Warning37.aspx) no-repeat scroll 0px 2px;
    margin-top:10px;
    
}
.alert-type-caution .alert-title {
    color: #0054a4;
    font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    line-height: 20px;
    padding: 0px 0px 0px 50px;
}

/*INFO (green)*/
.alert-type-info {
/*  border-top: 1px solid rgba(120,162,7,.8);
    border-bottom: 1px solid  rgba(120,162,7,0.8);
    padding: 4px 0px 4px 0px;
    background-color: rgba(120,162,7,0.05);*/
}
.alert-type-info .alerticon, .okicon {
    min-height: 37px;
    background: url(/Files/UI/Ok37.aspx) no-repeat scroll 0px 2px;
    margin-top:10px;
}
.alert-type-info .alert-title {
    color: #0054a4;
    font-family: "Light", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    line-height: 20px;
    padding: 0px 0px 0px 50px;
    margin-top:0px;
}

/*all alerts*/
.alert-full-width .alert-text {
     color: #252525;
     font-family: "normal", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
     font-size: 14px;
     line-height: 20px;
     padding: 0px 0px 0px 50px;
}

.alert-full-width {
    display: none;
}

.alert-full-width .hide-alert {
    /*text-align: right;*/
    width: 120px;
    float: left;
}

.alert-full-width .hide-alert button {
    text-decoration: none;
    font-size:12.5px;
    background-image: url(/App_Themes/METC/Images/arrow-sprite.png?date-2020);
    background-position-y: -531px;
    background-position-x: 6px;
    background-repeat: no-repeat;
    padding: 8px 10px 8px 25px;
    background-color: #78a22f;
    display: inline-block;
    margin-top: 0px;
    margin-left: 0px;
    color: white;
    opacity: 0;
    border: none;
}


.alert-full-width:not(.hidden-alert):first-child .hide-alert button {
    opacity: 1;
}

.alert-full-width.hidden-alert, .alert-full-width.hidden-alert .hide-alert button {
    display: none;
}

/*.alert-type-alert.hidden-alert .hide-alert a {
    background: url(/Files/UI/Alert14.aspx) no-repeat 0 0;
}

.alert-type-caution.hidden-alert .hide-alert a {
    background: url(/Files/UI/Warning14.aspx) no-repeat 0 0;
}

.alert-type-info.hidden-alert .hide-alert a {
    background: url(/Files/UI/Ok14.aspx) no-repeat 0 0;
}*/

.alert-full-width .hide-alert a:hover, .alert-full-width .hide-alert a:focus {
    text-decoration: underline;
}

.alert-full-width .hide-alert button:hover, .alert-full-width .hide-alert button:focus {
    text-decoration: underline;
}

.utility-header .alert-show {
    float: left;
    width: 120px;
}

.utility-header .alert-show button {
    color: white;
    display: inline-block;
    font-size:12.5px;
    background-image: url(/App_Themes/METC/Images/arrow-sprite.png?date-2020);
    background-position-y: -485px;
    background-position-x: 6px;
    background-repeat: no-repeat;
    background-color: #002a5c;
    padding: 9px 11px 8px 25px;
    margin-top: 0px;
    margin-left: 0px;
    display: inline-block;
    background-color: #002a5c;
    opacity: 0.6;
    transition: opacity 0.5s;
    border: none;
  }

.utility-header .alert-show button:focus, .utility-header .alert-show button:hover {
    opacity: 1.0;
}

/* ---------------------------------------------------------------------
 Carousel Styles
------------------------------------------------------------------------ */

.carousel-container,
.carousel-item {
    position: relative;
    overflow: hidden;
}

.carousel-item { float: left; }

.slide-image {
    position: absolute;
    top: 0;
    left: 0;
}

.slide-image-color {
    z-index: 2;
}

.slide-image-blue {
    z-index: 1;
}

.carousel-container > ul {
    height: 335px;
    overflow: hidden;
}

.hero-carousel .carousel-container,
.hero-carousel .carousel-item {
    width: 960px;
    height: 335px;
    overflow: visible;
    margin: 0 auto;
}

@media screen and (max-width: 765px) {
.carousel-internal .main {
  margin-top: -4px; /* J Dudley - 4/4/17 */  
  }
.carousel-internal .article-pull .h1 {
  font-size: 33px; /* J Dudley - 4/4/17 */
  }
.hero-carousel .carousel-container {
  width: 100%; /* J Dudley - 4/4/17 - was 960px; */
  }
}

.two-col-wide .carousel-container,
.two-col-wide .carousel-item {
    width: 870px;
    height: 220px; /* 6-9-16 JD */
}

.two-col-small .carousel-container,
.two-col-small .carousel-item {
    width: 630px;
    height: 285px; /* 6-9-16 JD */
}

.one-col .carousel-container,
.one-col .carousel-item {
    width: 525px;
    height: 285px; /* 6-9-16 JD */
}

/* ---------------------------------------------------------------------
 Carousel Articles
------------------------------------------------------------------------ */

.story-carousel { position: relative; }

.slide-item {
    margin-left: 15px;
    width: 45%;
    float: left;
}

.slide-item + .slide-item { margin-left: 6%; }

.two-col-wide .slide-item + .slide-item { margin-left: 4%; }

.one-col .slide-item {
    width: 78%;
    margin-left: 30px;
}

.slide-item .media-media { width: 49%; }

.slide-item > .box { min-height: 284px; }

.article-date {
    margin: 15px 0 0 -15px;
    padding: 15px 5px; /* 6-7-16 JD */
    float: left;
    width: 30px; /* 6-7-16 JD */
    text-align: center;
    background-color: #a1a1a1;   
    color: #ffffff;
}
.date-number { font-size: 26px; }

.date-month { font-size: 16px; }

.piped-snippet > .tag {
    margin-bottom: 5px;
    font-size: 10px;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.tag-cap { text-transform: uppercase; }

.slide-item .article-hd {
    margin: 15px 0px 0px 0px;
    border-top: 2px solid #dddddd;
    padding: 5px 0 0 0px;    
    width: 87%;
}

.slide-item .article-bd { 
    padding: 12px 15px 20px 35px; /* 5-27-16 JD */
    line-height: 1.45; /* 5-27-16 JD */
}

.story-hdg {
    font-size: 15px; /* 5-27-16 JD */
    margin-bottom: 10px; /* 5-27-16 JD */
    line-height: 1.45;
}

.article-bd > .media > .media-bd {
    line-height:19px;
    font-size: 14px;
    font-family: Roman, Helvetica, Tahoma, Geneva, Arial, sans-serif;
}

.story-left {
    width: 14px;
    height: 24px;
    position: absolute;
    left: -20px;
    top: 117px;
    z-index: 12;
    background-position: -140px -424px;
}

.story-right {
    width: 14px;
    height: 24px;
    position: absolute;
    right: -20px;
    top: 117px;
    z-index: 12;
    background-position: 0 -424px;
}

.one-col .story-left { left: 0; }

.one-col .story-right { right: 0; }

.hero .story-left {
    left: 10px;
    top: 155px;
    background-position: -140px -342px;
}

.hero .story-right {
    right: 10px;
    top: 155px;
    background-position: 0 -342px;
}

.is-inactive { height: 0; }

/* ---------------------------------------------------------------------
 Pagination Menu and Selected State
------------------------------------------------------------------------ */

.page-selected {
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    -o-border-radius: 25px;
    border-radius: 25px;
    background: #0054a4;
    color: #ffffff;
}

.pagination-right {
    width: 8px;
    height: 13px;
    background-position: -146px -308px;
    top: 0;
    left: 0;
}

.pagination-left {
    width: 8px;
    height: 13px;
    background-position: 0px -308px;
    top: 0;
    left: 0;
}

/* ---------------------------------------------------------------------
 Tabs
------------------------------------------------------------------------ */

.tabs {
    margin-bottom: 17px;
    border-bottom: 3px solid #0054a4;
    overflow: hidden;
}

.hide-tab-content {
    position: absolute;
    top: -9999px;
    left: -9999px;  
}

.h-list-tabs {
    display: inline-block;
    vertical-align: bottom;
}

.view-all {
    line-height: 46px;
    float: right;
}

.h-list-tabs > li + li { margin-left: 7px; } /* 6-2-16 JD */

.h-list-tabs a.tab:focus { /* 10-21-16 JD */
  color: #0054a4;
  background-color: #75b0ea;
  text-decoration: none;
} 

.h-list-tabs a.tab-active:focus { /* 10-21-16 JD */
  color: #ffffff;
  background-color: #0054a4;
} 

.tab {
    padding: 15px 10px 15px;
    display: block;
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    background-color: #6699cc;
    color: #0054a4;
}
.tab-small-text {
  
    font-size: 16px !important;
  
}

.tab-news {
    background: #6699cc url('/App_Themes/METC/Images/function-sprite.png') -109px -31px no-repeat scroll;
    padding-left: 47px;
}

.tab-event {
    background: #6699cc url('/App_Themes/METC/Images/EventsMeetings-SpriteWide.png') -320px 12px no-repeat scroll; /* 6-7-16 JD */
    padding-left: 50px;
    padding-right: 13px;
}

.tab-newsletter {
    background: #6699cc url('/App_Themes/METC/Images/newsletter-sprite.png') -142px 13px no-repeat scroll; /* 6-7-16 JD */
    padding-left: 49px; /* 6-7-16 JD */
}

.tab-mediacoverage {
    background: #6699cc url('/App_Themes/METC/Images/MediaCoverage-SpriteWide.png') -320px 13px no-repeat scroll; /* 6-7-16 JD */
    padding-left: 47px;
}
.tab-small {
    padding: 16px 12px 12px;
    margin: -3px;
    display: block;
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    background-color: #6699cc;
    color: #0054a4;
}

.tab:hover {
    color: #0054a4;
    text-decoration: none;
    background-color: #75b0ea;
}

.tab-active {
    color: #ffffff;
    background-color: #0054a4;
}

.tab-active.tab-news, .tab-active.tab-event, .tab-active.tab-newsletter, .tab-active.tab-mediacoverage { /* 6-2-16 JD */
    color: #ffffff;
    text-decoration: none;
}

.tab-active.tab-news { background-position: 19px -31px; }

.tab-active.tab-event { background-position: 15px 12px; } /* 6-7-16 JD */

.tab-active.tab-newsletter { background-position: 9px 13px; }

.tab-active.tab-mediacoverage { background-position: 9px 13px; }

.tab-active:hover {
    color: #ffffff;
    text-decoration: none;
    background-color: #0054a4;
}

.tab-small:hover {
    color: #0054a4;
    text-decoration: none;
    background-color: #75b0ea;
}

.tab-small-active {
    color: #ffffff;
    background-color: #0054a4;
}

.tab-small-active:hover {
    color: #ffffff;
    text-decoration: none;
    background-color: #0054a4;
}

/* ---------------------------------------------------------------------
 Sub Menu Sidebar Accordion
------------------------------------------------------------------------ */

.v-list-accordion + .v-list-accordion { margin-top: 2px; }

.v-list-accordion + .v-list-categories,
.accordion-footer,
.v-list-categories + .v-list-categories { margin-top: 50px; }

.parent {
    padding: 12px 10px;
    float: left;
    width: 134px;
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background-color: #0054a4;
}

.sub-parent { width: 100%; }

.accordion-button {
    margin-left: 1px;
    padding: 0;
    width: 35px;
    height: 42px;
    background: #0054a4 url('/App_Themes/METC/Images/arrow-sprite.png') -203px 10px no-repeat scroll;
}

.accordion-button-active { background-position: -203px -101px; }

.accordion-parent:hover,
.accordion-button:hover,
.sub-parent:hover,
.accordion-parent:focus,
.accordion-button:focus,
.sub-parent:focus {
    color: #ffffff;
    background-color: #00386e;
    text-decoration: none;
}

.double > .accordion-parent + .accordion-button { height: 60px; }

.double > .accordion-button {
    height: inherit;
    background-position: -203px 20px;
}

.double > .accordion-button-active {
    background-position: -203px -91px;
}
.v-list-accordion > li {
    width: 100%;
    clear: both;
}

.v-list-accordion li + li,
.v-list-categories li + li { border-top: 1px solid #dbdddd; }

.sub-menu { clear: both; margin-right: 2px;}

.sub-menu-baseline { border-bottom: 1px solid #0054a4; }

.sub-menu-categories {
    border-top: 1px solid #0054a4;
    border-bottom: 1px solid #0054a4;
}

.sub-menu > li > a {
    padding: 12px 10px 12px 20px;
    display: block;
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    background-color: #f0f0f0;
    color: #0054a4;
}

.sub-menu > li > a:hover,
.sub-menu > li > .selected {
    color: #002b5c;
    background-color: #ffffff;
    text-decoration: none;
}

.sub-menu > li > a.sub-indent { padding-left: 30px; }

.accordion-msg {
    padding: 10px;
    background-color: #f0f0f0;
}

#main-filter-list > li:first-child { /* 10-25-16 JD */
  width: 100%;
  padding: 0px;
}

#main-filter-list > li:first-child a { /* 10-25-16 JD */
  padding: 12px 10px;
  width: 100%;
  float: left;
}

#main-filter-list > li:first-child a:hover, #main-filter-list > li:first-child a:focus { /* 10-25-16 JD */
  color: #ffffff;
  background-color: #00386e;
  text-decoration: none;
}

.filter {
    padding: 12px 10px 12px 40px;
    display: block;
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    color: #0054a4;
    background: #f0f0f0 url('/App_Themes/METC/Images/function-sprite.png') 0 0 no-repeat scroll;
}

.filter-add { background-position: 5px -361px; }

.filter-selected { background-position: 5px -187px; }

.filter-selected:hover {
    color: #002b5c;
    background-color: #ffffff;
    text-decoration: none;
    background-position: 5px -263px;
}


/*********************************
 new left nav - Jim Dudley 
 *********************************/

.ancestry-menu, .sibling-menu, .child-menu {
    list-style-type: none;
    clear: both;
}

.ancestry-menu > li > .sibling-menu {
    border-top: 1px solid #dbdddd;
}
.ancestry-menu.menu-level-1 > li > .sibling-menu {
    border-top: none;
}

.ancestry-menu > li > a:focus, .ancestry-menu > li > a:hover {
    color: #ffffff;
    background-color: #00386e;
    text-decoration: none;
    /*background: #00386e url(/App_Themes/METC/Images/nav-current.png) 4px 14px no-repeat scroll;*/
}

@media screen and (min-width: 768px) {
    .sibling-menu > li > a:focus, .sibling-menu > li > a:hover,
    .child-menu > li > a:focus, .child-menu > li > a:hover {
        color: #002b5c;
        /*background-color: #ffffff;*/
        text-decoration: none;
        /*background: #ffffff url(/App_Themes/METC/Images/nav-current.png) 4px 14px no-repeat scroll;*/
    }
}

.ancestry-menu > li > a {
    padding: 12px 10px;
    /*float: left;*/
    /*width: 85%;*/
    display: block;
    width: 100%;
    color: #ffffff!important;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background: #0054a4 url('/App_Themes/METC/Images/nav-arrow.png') 3px -1px no-repeat scroll;
}

.menu-level-1 > li > a { 
    padding-left: 15px; 
    background-color: #ffffff; 
    border: 1px solid #0054a4; 
    border-top: 10px solid;
    /*border-bottom: none;*/
    /* margin-bottom: 1px; */    
    color: #0054a4;
    background-image: none;
}

.menu-level-1 > li > a:hover, .menu-level-1 > li > a:focus {
    color: #0054a4;
    background-color: #f0f0f0;
}

.menu-transportation > li > a { border-color: #ee3124; }
.menu-communities > li > a { border-color: #78a22f; }
.menu-parks > li > a { border-color: #78a22f; }
.menu-housing > li > a { border-color: #78a22f; }
.menu-wastewaterwater > li > a { border-color: #009ac7; }
.menu-planning > li > a { border-color: #002b5c; }

.menu-level-2 > li > a { padding-left: 15px; background-position-x: 5px;}
.menu-level-3 > li > a { padding-left: 25px; background-position-x: 15px; }
.menu-level-4 > li > a { padding-left: 35px; background-position-x: 25px; }
.menu-level-5 > li > a { padding-left: 45px; background-position-x: 35px; }
.menu-level-6 > li > a { padding-left: 55px; background-position-x: 45px; }
.menu-level-7 > li > a { padding-left: 65px; background-position-x: 55px; }
.menu-level-8 > li > a { padding-left: 75px; background-position-x: 65px; }
.menu-level-9 > li > a { padding-left: 85px; background-position-x: 75px; }
.menu-level-10 > li > a { padding-left: 95px; background-position-x: 85px; }

.sibling-menu li, .child-menu li {
    /*display: table;*/
    overflow: hidden;
    width: 100%;
}

.sibling-menu > li > a {
    padding: 12px 10px 12px 15px;
    display: block;
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    background-color: #f0f0f0;
    color: #0054a4;
    border-bottom: 1px solid #dbdddd;
}

.sibling-menu > li > a.current, .child-menu > li > a.current {
    color: #0054a4;
    background: #ffffff url(/App_Themes/METC/Images/nav-current.png) 4px 14px no-repeat scroll;
}

.sibling-menu > li > a.featured, .child-menu > li > a.featured {
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background: #0054a4;
    float: left;
    width: 100%;
}

.sibling-menu > li.expandable > a.featured, .child-menu > li.expandable > a.featured {
    width: calc(100% - 40px); /*85%;*/
}

.sibling-menu > li > a.menu-toggle, .child-menu > li > a.menu-toggle {
    padding: 0px;
    float: right;
    width: 40px; /*15%;*/
    margin-left: 0%;
    border-left: 1px solid #dbdddd;
    height: 43px;
    background: #0054a4 url(/App_Themes/METC/Images/arrow-sprite.png) -203px 10px no-repeat scroll;
}

.sibling-menu > li > a.menu-toggle.double, .child-menu > li > a.menu-toggle.double, .ancestry-menu > li > a.menu-toggle.double {
    height: 61px;
    background-position-y: 19px;
}

.sibling-menu > li > a.menu-toggle.triple, .child-menu > li > a.menu-toggle.triple {
    height: 79px;
    background-position-y: 28px;
}

.sibling-menu > li > a.menu-toggle.quad, .child-menu > li > a.menu-toggle.quad {
    height: 97px;
    background-position-y: 37px;
}

.sibling-menu > li > a.menu-toggle.quint, .child-menu > li > a.menu-toggle.quint {
    height: 97px;
    background-position-y: 46px;
}

.sibling-menu > li > a.menu-toggle.menu-open, .child-menu > li > a.menu-toggle.menu-open {
    background-position-y: -101px;
}

.sibling-menu > li > a.menu-toggle.menu-open.double, .child-menu > li > a.menu-toggle.menu-open.double {
    background-position-y: -92px;
}

.sibling-menu > li > a.menu-toggle.menu-open.triple, .child-menu > li > a.menu-toggle.menu-open.triple {
    background-position-y: -83px;
}

.sibling-menu > li > a.menu-toggle.menu-open.quad, .child-menu > li > a.menu-toggle.menu-open.quad {
    background-position-y: -74px;
}

.sibling-menu > li > a.menu-toggle.menu-open.quint, .child-menu > li > a.menu-toggle.menu-open.quint {
    background-position-y: -65px;
}

.sibling-menu > li > a.menu-toggle:focus, .child-menu > li > a.menu-toggle:focus,
.sibling-menu > li > a.menu-toggle:hover, .child-menu > li > a.menu-toggle:hover {
        background-color: #00386e;
}

.sibling-menu > li > a.featured.current, .child-menu > li > a.featured.current {
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background: #00386e;
    background: #00386e url(/App_Themes/METC/Images/nav-current.png) 4px 14px no-repeat scroll;
}

.child-menu > li > a {
    padding: 12px 10px 12px 30px;
    display: block;
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    background-color: #f0f0f0;
    color: #0054a4;
    border-bottom: 1px solid #dbdddd;
}

@media screen and (max-width: 991px) {
    .ancestry-menu > li > a {
        font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
        font-size: 15px;
        line-height: 18px;
    }
}

@media screen and (max-width: 767px) {
    .ancestry-menu > li > a {
        font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
        font-size: 18px;
        line-height: 18px;
    }
}

.test-nav-2 .ancestry-menu > li > a:first-child, 
.test-nav-2 .sibling-menu > li > a:first-child, 
.test-nav-2 .child-menu > li > a:first-child {
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    line-height: 18px;
    background-color: #f0f0f0;
    color: #0054a4;
    transition: color 0s;
}

.test-nav-2 .ancestry-menu > li > a {
    background-image: url('/App_Themes/METC/Images/nav-current-white.png');
    background-position-y: 14px;
}

.test-nav-2 .ancestry-menu > li > a:hover, 
.test-nav-2 .sibling-menu > li > a:hover, 
.test-nav-2 .child-menu > li > a:hover {
    /*opacity: 0.8;*/
}

.test-nav-2 .sibling-menu > li > a.menu-toggle:hover, .test-nav-2 .child-menu > li > a.menu-toggle:hover,
.test-nav-2 .sibling-menu > li > a.menu-toggle:focus, .test-nav-2 .child-menu > li > a.menu-toggle:focus { 
    background-color: #00386e; 
}

@keyframes not-ready-animate {
  from {background-color: #00386e;}
  to {background-color: #999;}
}

.test-nav-2 .sibling-menu > li > a.menu-toggle.not-ready, .test-nav-2 .child-menu > li > a.menu-toggle.not-ready { 
    animation: not-ready-animate 0.5s linear 0s infinite alternate;
}

.test-nav-2 .sibling-menu > li > a:first-child {
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
}
.test-nav-2 .menu-level-2.sibling-menu > li > a:first-child {
    font-size: 16px;
}
.test-nav-2 .child-menu > li > a:first-child {
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
}

@media screen and (min-width: 768px) {
    .test-nav-2 .ancestry-menu > li > a:first-child:hover,
    .test-nav-2 .child-menu > li > a:first-child:hover,
    .test-nav-2 .sibling-menu > li > a:first-child:hover
    {
        background-color: #00386e;
        color: #ffffff;
        background: #00386e url(/App_Themes/METC/Images/nav-current-line-arrow.png) 5px 14px no-repeat scroll;
    }
}

.test-nav-2 .ancestry-menu > li > a:first-child:focus,
.test-nav-2 .child-menu > li > a:first-child:focus,
.test-nav-2 .sibling-menu > li > a:first-child:focus
{
    background-color: #00386e;
    color: #ffffff;
    background: #00386e url(/App_Themes/METC/Images/nav-current-line-arrow.png) 5px 14px no-repeat scroll;
}

.test-nav-2 .sibling-menu > li > a.current, .test-nav-2 .child-menu > li > a.current {
    background-color: #00386e;
    color: #ffffff;
    background: #00386e url(/App_Themes/METC/Images/nav-current-line-arrow.png) 5px 14px no-repeat scroll;
}

.test-nav-2 .ancestry-menu.menu-level-1 > li > a:first-child, .test-nav-2 .sibling-menu.menu-level-1 > li > a:first-child {
    background-image: none;
    background-color: #ffffff;
    padding-left: 14px;
}
.test-nav-2 .ancestry-menu.menu-level-1 > li > a:first-child:hover, .ancestry-menu.menu-level-1 > li > a:first-child:focus,
.test-nav-2 .sibling-menu.menu-level-1 > li > a:first-child:hover, .sibling-menu.menu-level-1 > li > a:first-child:focus {
    color: #0054a4;
    background-color: #f0f0f0;
    background-image: url(/App_Themes/METC/Images/nav-current.png);
}

.test-nav-2 .sibling-menu.menu-level-1 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-1 > li > a.menu-toggle {
    
    padding: 0px;
    float: right;
    width: 40px; /*15%;*/
    margin-left: 0%;
    /*border-left: 1px solid;*/
    /*border-right: 1px solid;*/
    height: 53px;
    background: lime url(/App_Themes/METC/Images/arrow-sprite.png) -203px -146px no-repeat scroll;
    background-color: #ffffff;
}

.test-nav-2 .menu-level-1 > li > a { 
    padding-left: 15px; 
    background-color: #ffffff; 
    /*border-color: #0054a4; */
    /*border-top: 10px solid;*/
    border-bottom: 1px solid;
    /*border-left: 1px solid;*/
    /*border-right: 1px solid;*/
    /*border-bottom: none;*/
    /* margin-bottom: 1px; */    
    /*color: #0054a4!important;*/
    background-image: none;
}

.test-nav-2 .menu-level-1 > li.expandable > a:first-child {
    /*border-left: 1px solid;*/
    border-right: 0px solid;
}

.test-nav-2 .menu-transportation > li > a { border-color: #ee3124; }
.test-nav-2 .menu-communities > li > a { border-color: #78a22f; }
.test-nav-2 .menu-parks > li > a { border-color: #78a22f; }
.test-nav-2 .menu-housing > li > a { border-color: #78a22f; }
.test-nav-2 .menu-wastewaterwater > li > a { border-color: #009ac7; }
.test-nav-2 .menu-planning > li > a { border-color: #002b5c; }

.test-nav-2 .ancestor-hidden {
    display: none;
}

.test-nav-2 li.ancestor-show-more > a.menu-toggle {
    background-position-y: -191px;
}

.test-nav-2 .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.double, .test-nav-2 .child-menu > li.ancestor-show-more > a.menu-toggle.menu-open.double {
    background-position-y: -182px;
}

.test-nav-2 .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.triple, .test-nav-2 .child-menu > li.ancestor-show-more > a.menu-toggle.menu-open.triple {
    background-position-y: -173px;
}

.test-nav-2 .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quad, .test-nav-2 .child-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quad {
    background-position-y: -164px;
}

.test-nav-2 .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quint, .test-nav-2 .child-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quint {
    background-position-y: -155px;
}


.global-nav .menu-level-2 > li > a:first-child, .test-nav-2 .menu-level-2 > li > a.featured {background-color: #0054a4; color: #ffffff;}
.global-nav .menu-level-3 > li > a:first-child, .test-nav-2 .menu-level-3 > li > a.featured {background-color: #3e78b6; color: #ffffff;} /*3875ab*/
.global-nav .menu-level-4 > li > a:first-child, .test-nav-2 .menu-level-4 > li > a.featured {background-color: #6F96B8; color: #ffffff;} /*648db3*/
.global-nav .menu-level-5 > li > a:first-child, .test-nav-2 .menu-level-5 > li > a.featured {background-color: #9db5c9; color: #000000;}
.global-nav .menu-level-6 > li > a:first-child, .test-nav-2 .menu-level-6 > li > a.featured {background-color: #b0b9c2; color: #000000;}
.global-nav .menu-level-7 > li > a:first-child, .test-nav-2 .menu-level-7 > li > a.featured {background-color: #c7c7c7; color: #000000;}
.global-nav .menu-level-8 > li > a:first-child, .test-nav-2 .menu-level-8 > li > a.featured {background-color: #ffffff; color: #000000;}

.global-nav .sibling-menu.menu-level-2 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-2 > li > a.menu-toggle {background-color: #0054a4; color: #ffffff;}
.global-nav .sibling-menu.menu-level-3 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-3 > li > a.menu-toggle {background-color: #3e78b6; color: #ffffff;}
.global-nav .sibling-menu.menu-level-4 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-4 > li > a.menu-toggle {background-color: #6F96B8; color: #ffffff;}
.global-nav .sibling-menu.menu-level-5 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-5 > li > a.menu-toggle {background-color: #9db5c9; color: #000000;}
.global-nav .sibling-menu.menu-level-6 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-6 > li > a.menu-toggle {background-color: #b0b9c2; color: #000000;}
.global-nav .sibling-menu.menu-level-7 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-7 > li > a.menu-toggle {background-color: #c7c7c7; color: #000000;}
.global-nav .sibling-menu.menu-level-8 > li > a.menu-toggle, .test-nav-2 .child-menu.menu-level-8 > li > a.menu-toggle {background-color: #ffffff; color: #000000;}

.global-nav.menu-level-0 > li > a:first-child {
    background-color: #001d3d;
    padding-left: 15px;
    width: calc(100% - 40px);
    float: left;
    /*height: 43px;*/
    font-family: "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    background-image: none;
}


.global-nav .sibling-menu.menu-level-1 > li > a:first-child,
.global-nav .ancestry-menu.menu-level-1 > li > a:first-child {
    border: 1px solid #dbdddd;
    border-top: 0px solid;
    border-right: 0px solid;
    border-left: 0px solid;
    background-color: #00386e; /*#031f57;*/ /*#00386e;*/
    color: #ffffff!important;
    font-family: "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}
/*.global-nav .sibling-menu.menu-level-1 > li > a:menu-toggle {
    border-top: 0px solid;
    background-color: #00386e;
    color: #ffffff!important;
}*/

.global-nav.menu-level-0 > li > a.menu-toggle {
    width: 40px;
    float: left;
    background: #001d3d url(/App_Themes/METC/Images/arrow-sprite.png) -201px -191px no-repeat scroll;
    height: 42px;
    border-left: 1px solid #dbdddd;
    border-right: 0px solid;
}

.global-nav.menu-level-0 > li > a.menu-toggle.double {
    height: 60px;
}


.global-nav .sibling-menu.menu-level-1 > li > a.menu-toggle {
    height: 43px;
    border-top: 0px solid;
    border-left: 1px solid #dbdddd;
    border-bottom: 1px solid #dbdddd;
    border-right: 0px solid;
    background-color: #00386e; /*#031f57;*/ /*#00386e;*/
    color: #ffffff!important;
    background-position-y: -191px;
}

.global-nav.menu-level-0 > li > a.menu-toggle.menu-open, 
.global-nav .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open,
.global-nav .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open {
    background-position-y: 10px;
}

.global-nav .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.double,
.global-nav .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.double {
    background-position-y: 19px;
}
.global-nav .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.triple,
.global-nav .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.triple {
    background-position-y: 28px;
}
.global-nav .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quad,
.global-nav .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quad {
    background-position-y: 37px;
}

.global-nav.menu-level-0 > li > a.menu-toggle.menu-open.children-visible, 
.global-nav .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.children-visible,
.global-nav .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.children-visible {
    background-position-y: -101px;
}


.global-nav .sibling-menu.menu-level-1 > li.ancestor-hidden > a.menu-toggle {
    background-position-y: 10px;
    border-color: #dbdddd;
    border-right: 0px solid;
}

.global-nav .sibling-menu.menu-level-1 > li.ancestor-hidden > a.menu-toggle.menu-open {
    background-position-y: -101px;
}

.global-nav .sibling-menu.menu-level-1 > li > a:first-child:hover, .global-nav .sibling-menu.menu-level-1 > li > a:first-child:focus {
    background-color: #00386e;
}

.global-nav .menu-transportation > li > a { border-color: #dbdddd; }
.global-nav .menu-communities > li > a { border-color: #dbdddd; }
.global-nav .menu-parks > li > a { border-color: #dbdddd; }
.global-nav .menu-housing > li > a { border-color: #dbdddd; }
.global-nav .menu-wastewaterwater > li > a { border-color: #dbdddd; }
.global-nav .menu-planning > li > a { border-color: #dbdddd; }

.global-nav .sibling-menu.menu-level-1 > li > a.menu-toggle.double {
    height: 61px;
}

.global-nav .sibling-menu.menu-level-1 > li > a.menu-toggle.triple {
    height: 79px;
}

.global-nav .sibling-menu.menu-level-1 > li > a.menu-toggle.quad {
    height: 97px;
}

.global-nav .sibling-menu.menu-level-1 > li > a.menu-toggle.quint {
    height: 115px;
}

.global-nav .sibling-menu > li > a.current 
{
    color: #ffffff;
    background-color: #001d3d;
    background-position: 5px 14px;
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);
}

.global-nav .menu-level-1.sibling-menu > li > a:first-child {font-size: 18px; text-transform: uppercase; font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-2.sibling-menu > li > a:first-child {font-size: 18px; text-transform: uppercase; font-family: "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-3.sibling-menu > li > a:first-child {font-size: 18px; text-transform: unset; font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-4.sibling-menu > li > a:first-child {font-size: 16px; text-transform: unset; font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-5.sibling-menu > li > a:first-child {font-size: 16px; text-transform: unset; font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-6.sibling-menu > li > a:first-child {font-size: 16px; text-transform: unset; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-7.sibling-menu > li > a:first-child {font-size: 16px; text-transform: unset; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav .menu-level-8.sibling-menu > li > a:first-child {font-size: 16px; text-transform: unset; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}

.global-nav .ancestry-menu > li > a:first-child:hover,
.global-nav .child-menu > li > a:first-child:hover,
.global-nav .sibling-menu > li > a:first-child:hover,
.global-nav .ancestry-menu > li > a:first-child:focus,
.global-nav .child-menu > li > a:first-child:focus,
.global-nav .sibling-menu > li > a:first-child:focus
{
    /*opacity: 0.7;*/
    background-position: 5px 14px;
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);
    background-repeat: no-repeat;
}

.global-nav .sibling-menu > li > a.menu-toggle:hover, .test-nav-2 .global-nav > li > a.menu-toggle:hover,
.global-nav .sibling-menu > li > a.menu-toggle:focus, .test-nav-2 .global-nav > li > a.menu-toggle:focus { 
    background-color: #00386e; 
}


/*********** GLOBAL NAV NEW *******************/

.accordion-footer, #ChildNav {
    display: none;
}

.footer-left-column {
    display: none;
}

/*@media screen and (max-width: 765px) {
    .global-nav-new {
        display: none;
    }
    .footer-left-column, .footer-left-column .global-nav-new {
        display: block;
    }
    .footer-left-column {
        margin-bottom: 15px;
    }

    .main, .masthead {
        margin: 0px;
    }

    .masthead {
        margin-top: 15px;
    }
}
*/
.global-nav-new * {
    box-sizing: border-box;
}

.global-nav-new.no-top-level-nav {
    margin-bottom: 25px;
}

.global-nav-new.no-top-level-nav .menu-level-0 > li > a,
.global-nav-new.no-top-level-nav .menu-level-0 > li > button {
    display: none;
}

.global-nav-new.no-top-level-nav .menu-level-1 > li > a,
.global-nav-new.no-top-level-nav .menu-level-1 > li > button {
    display: none;
}

.global-nav-new.no-top-level-nav .menu-level-1 > li > a.current,
.global-nav-new.no-top-level-nav .menu-level-1 > li > a.current + a,
.global-nav-new.no-top-level-nav .menu-level-1 > li > a.current + button,
.global-nav-new.no-top-level-nav .menu-level-1 > li > a.on-current-path,
.global-nav-new.no-top-level-nav .menu-level-1 > li > a.on-current-path + a,
.global-nav-new.no-top-level-nav .menu-level-1 > li > a.on-current-path + button {
    display: block;
}

.global-nav-new ul {
    list-style-type: none;
    clear: both;
}

.global-nav-new ul li {
    overflow: hidden;
    width: 100%;
}

.global-nav-new ul ul ul li {
/*    border-left: 5px solid #ffffff;
*/}

.global-nav-new ul > li > a {
    padding: 12px 15px;
    display: block;
    border-bottom: 1px solid #ffffff; /*#dbdddd;*/
    border-top: 0px solid;
    border-right: 0px solid;
    border-left: 0px solid;
    line-height: 18px;
    transition: color 0s ease;
}

.global-nav-new ul li.expandable > a:first-child {
    padding-left: 15px;
    width: calc(100% - 40px);
    float: left;
}

.global-nav-new ul li > a.menu-toggle {
    width: 40px;
    height: 43px;
    float: left;
    border-left: 1px solid #ffffff; /*#dbdddd;*/
 }

.global-nav-new ul li > button.menu-toggle {
    width: 40px;
    height: 43px;
    float: left;
    border: none;
    border-left: 1px solid #ffffff; /*#dbdddd;*/
    border-bottom: 1px solid #ffffff; /*#dbdddd;*/
 }

.global-nav-new .menu-level-0 > li > a, .global-nav-new .menu-level-0 > li > a:first-child, .global-nav-new .menu-level-0 > li > a.menu-toggle, .global-nav-new .menu-level-0 > li > button.menu-toggle {background-color: #002b5c; color: #ffffff;}
.global-nav-new .menu-level-1 > li > a, .global-nav-new .menu-level-1 > li > a:first-child, .global-nav-new .menu-level-1 > li > a.menu-toggle, .global-nav-new .menu-level-1 > li > button.menu-toggle {background-color: #01408a; color: #ffffff;}
.global-nav-new .menu-level-2 > li > a, .global-nav-new .menu-level-2 > li > a:first-child, .global-nav-new .menu-level-2 > li > a.menu-toggle, .global-nav-new .menu-level-2 > li > button.menu-toggle {background-color: #0054a4; color: #ffffff;}
.global-nav-new .menu-level-3 > li > a, .global-nav-new .menu-level-3 > li > a:first-child, .global-nav-new .menu-level-3 > li > a.menu-toggle, .global-nav-new .menu-level-3 > li > button.menu-toggle {background-color: #3972b9; color: #ffffff;} /*3875ab*//*3e78b6*/
.global-nav-new .menu-level-4 > li > a, .global-nav-new .menu-level-4 > li > a:first-child, .global-nav-new .menu-level-4 > li > a.menu-toggle, .global-nav-new .menu-level-4 > li > button.menu-toggle {background-color: #98b1d0; color: #002b5c;} /*648db3*/
.global-nav-new .menu-level-5 > li > a, .global-nav-new .menu-level-5 > li > a:first-child, .global-nav-new .menu-level-5 > li > a.menu-toggle, .global-nav-new .menu-level-5 > li > button.menu-toggle {background-color: #cad3e0; color: #002b5c;}
.global-nav-new .menu-level-6 > li > a, .global-nav-new .menu-level-6 > li > a:first-child, .global-nav-new .menu-level-6 > li > a.menu-toggle, .global-nav-new .menu-level-6 > li > button.menu-toggle {background-color: #e0e3e8; color: #002b5c;}
.global-nav-new .menu-level-7 > li > a, .global-nav-new .menu-level-7 > li > a:first-child, .global-nav-new .menu-level-7 > li > a.menu-toggle, .global-nav-new .menu-level-7 > li > button.menu-toggle {background-color: #ededed; color: #002b5c;}
.global-nav-new .menu-level-8 > li > a, .global-nav-new .menu-level-8 > li > a:first-child, .global-nav-new .menu-level-8 > li > a.menu-toggle, .global-nav-new .menu-level-8 > li > button.menu-toggle {background-color: #ffffff; color: #002b5c;}

.global-nav-new .menu-level-0 > li > a, .global-nav-new .menu-level-0 > li > a:first-child, .global-nav-new .menu-level-0 > li > a.menu-toggle, .global-nav-new .menu-level-0 > li > button.menu-toggle {background-color: #002b5c; color: #ffffff;}
.global-nav-new .menu-level-0 > li > a, .global-nav-new .menu-level-0 > li > a:first-child, .global-nav-new .menu-level-0 > li > a.menu-toggle, .global-nav-new .menu-level-0 > li > button.menu-toggle {background-color: #01408a; color: #ffffff;}
.global-nav-new .menu-level-1 > li > a, .global-nav-new .menu-level-1 > li > a:first-child, .global-nav-new .menu-level-1 > li > a.menu-toggle, .global-nav-new .menu-level-1 > li > button.menu-toggle {background-color: #0054a4; color: #ffffff;}
.global-nav-new .menu-level-2 > li > a, .global-nav-new .menu-level-2 > li > a:first-child, .global-nav-new .menu-level-2 > li > a.menu-toggle, .global-nav-new .menu-level-2 > li > button.menu-toggle {background-color: #3972b9; color: #ffffff;} /*3875ab*//*3e78b6*/
.global-nav-new .menu-level-3 > li > a, .global-nav-new .menu-level-3 > li > a:first-child, .global-nav-new .menu-level-3 > li > a.menu-toggle, .global-nav-new .menu-level-3 > li > button.menu-toggle {background-color: #98b1d0; color: #002b5c;} /*648db3*/
.global-nav-new .menu-level-4 > li > a, .global-nav-new .menu-level-4 > li > a:first-child, .global-nav-new .menu-level-4 > li > a.menu-toggle, .global-nav-new .menu-level-4 > li > button.menu-toggle {background-color: #cad3e0; color: #002b5c;}
.global-nav-new .menu-level-5 > li > a, .global-nav-new .menu-level-5 > li > a:first-child, .global-nav-new .menu-level-5 > li > a.menu-toggle, .global-nav-new .menu-level-5 > li > button.menu-toggle {background-color: #e0e3e8; color: #002b5c;}
.global-nav-new .menu-level-6 > li > a, .global-nav-new .menu-level-6 > li > a:first-child, .global-nav-new .menu-level-6 > li > a.menu-toggle, .global-nav-new .menu-level-6 > li > button.menu-toggle {background-color: #ededed; color: #002b5c;}
.global-nav-new .menu-level-7 > li > a, .global-nav-new .menu-level-7 > li > a:first-child, .global-nav-new .menu-level-7 > li > a.menu-toggle, .global-nav-new .menu-level-7 > li > button.menu-toggle {background-color: #ffffff; color: #002b5c; border: 1px solid #ededed; border-top: none;}
.global-nav-new .menu-level-8 > li > a, .global-nav-new .menu-level-8 > li > a:first-child, .global-nav-new .menu-level-8 > li > a.menu-toggle, .global-nav-new .menu-level-8 > li > button.menu-toggle {background-color: #ffffff; color: #01408a; border: 1px solid #ededed; border-top: none;}

.global-nav-new .menu-level-0 > li > a, .global-nav-new .menu-level-0 > li > a:first-child, .global-nav-new .menu-level-0 > li > a.menu-toggle, .global-nav-new .menu-level-0 > li > button.menu-toggle {background-color: #002b5c; color: #ffffff;}
.global-nav-new .menu-level-0 > li > a, .global-nav-new .menu-level-0 > li > a:first-child, .global-nav-new .menu-level-0 > li > a.menu-toggle, .global-nav-new .menu-level-0 > li > button.menu-toggle {background-color: #01408a; color: #ffffff;}
.global-nav-new .menu-level-1 > li > a, .global-nav-new .menu-level-1 > li > a:first-child, .global-nav-new .menu-level-1 > li > a.menu-toggle, .global-nav-new .menu-level-1 > li > button.menu-toggle {background-color: #0054a4; color: #ffffff;}
.global-nav-new .menu-level-2 > li > a, .global-nav-new .menu-level-2 > li > a:first-child, .global-nav-new .menu-level-2 > li > a.menu-toggle, .global-nav-new .menu-level-2 > li > button.menu-toggle {background-color: #A5BAD5; color: #002b5c;} /*3875ab*//*3e78b6*/
.global-nav-new .menu-level-3 > li > a, .global-nav-new .menu-level-3 > li > a:first-child, .global-nav-new .menu-level-3 > li > a.menu-toggle, .global-nav-new .menu-level-3 > li > button.menu-toggle {background-color: #cad3e0; color: #002b5c;} /*648db3*/
.global-nav-new .menu-level-4 > li > a, .global-nav-new .menu-level-4 > li > a:first-child, .global-nav-new .menu-level-4 > li > a.menu-toggle, .global-nav-new .menu-level-4 > li > button.menu-toggle {background-color: #e0e3e8; color: #002b5c;}
.global-nav-new .menu-level-5 > li > a, .global-nav-new .menu-level-5 > li > a:first-child, .global-nav-new .menu-level-5 > li > a.menu-toggle, .global-nav-new .menu-level-5 > li > button.menu-toggle {background-color: #ededed; color: #002b5c;}
.global-nav-new .menu-level-6 > li > a, .global-nav-new .menu-level-6 > li > a:first-child, .global-nav-new .menu-level-6 > li > a.menu-toggle, .global-nav-new .menu-level-6 > li > button.menu-toggle {background-color: #f7f7f7; color: #002b5c;}
.global-nav-new .menu-level-7 > li > a, .global-nav-new .menu-level-7 > li > a:first-child, .global-nav-new .menu-level-7 > li > a.menu-toggle, .global-nav-new .menu-level-7 > li > button.menu-toggle {background-color: #ffffff; color: #002b5c; border: 1px solid #ededed; border-top: none;}
.global-nav-new .menu-level-8 > li > a, .global-nav-new .menu-level-8 > li > a:first-child, .global-nav-new .menu-level-8 > li > a.menu-toggle, .global-nav-new .menu-level-8 > li > button.menu-toggle {background-color: #ffffff; color: #01408a; border: 1px solid #ededed; border-top: none;}



.global-nav-new .menu-level-0 > li > a:first-child {font-size: 16px; text-transform: uppercase; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-1 > li > a:first-child {font-size: 16px; text-transform: uppercase; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-2 > li > a:first-child {font-size: 16px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-3 > li > a:first-child {font-size: 16px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-4 > li > a:first-child {font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-5 > li > a:first-child {font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-6 > li > a:first-child {font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-7 > li > a:first-child {font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new .menu-level-8 > li > a:first-child {font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}


/* Utility Menu styls for global nav */
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a, .global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child, .global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a.menu-toggle, .global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > button.menu-toggle {background-color: #ededed; color: #0054a4; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc;}
.global-nav-new.hidden-global-nav .secondary .menu-level-2 > li > a, .global-nav-new.hidden-global-nav .secondary .menu-level-2 > li > a:first-child, .global-nav-new.hidden-global-nav .secondary .menu-level-2 > li > a.menu-toggle, .global-nav-new.hidden-global-nav .secondary .menu-level-2 > li > button.menu-toggle {background-color: #ffffff; color: #0054a4; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc;}
.global-nav-new.hidden-global-nav .secondary .menu-level-3 > li > a, .global-nav-new.hidden-global-nav .secondary .menu-level-3 > li > a:first-child, .global-nav-new.hidden-global-nav .secondary .menu-level-3 > li > a.menu-toggle, .global-nav-new.hidden-global-nav .secondary .menu-level-3 > li > button.menu-toggle {background-color: #ffffff; color: #0054a4; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc;}
.global-nav-new.hidden-global-nav .secondary .menu-level-4 > li > a, .global-nav-new.hidden-global-nav .secondary .menu-level-4 > li > a:first-child, .global-nav-new.hidden-global-nav .secondary .menu-level-4 > li > a.menu-toggle, .global-nav-new.hidden-global-nav .secondary .menu-level-4 > li > button.menu-toggle {background-color: #ffffff; color: #0054a4; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc;}
.global-nav-new.hidden-global-nav .secondary .menu-level-5 > li > a, .global-nav-new.hidden-global-nav .secondary .menu-level-5 > li > a:first-child, .global-nav-new.hidden-global-nav .secondary .menu-level-5 > li > a.menu-toggle, .global-nav-new.hidden-global-nav .secondary .menu-level-5 > li > button.menu-toggle {background-color: #ffffff; color: #0054a4; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc;}
.global-nav-new.hidden-global-nav .secondary .menu-level-6 > li > a, .global-nav-new.hidden-global-nav .secondary .menu-level-6 > li > a:first-child, .global-nav-new.hidden-global-nav .secondary .menu-level-6 > li > a.menu-toggle, .global-nav-new.hidden-global-nav .secondary .menu-level-6 > li > button.menu-toggle {background-color: #ffffff; color: #0054a4; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc;}

.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child {padding-left: 15px; font-size: 16px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new.hidden-global-nav .secondary .menu-level-2 > li > a:first-child {padding-left: 15px; font-size: 16px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new.hidden-global-nav .secondary .menu-level-3 > li > a:first-child {padding-left: 15px; font-size: 16px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new.hidden-global-nav .secondary .menu-level-4 > li > a:first-child {padding-left: 25px; font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new.hidden-global-nav .secondary .menu-level-5 > li > a:first-child {padding-left: 35px; font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}
.global-nav-new.hidden-global-nav .secondary .menu-level-6 > li > a:first-child {padding-left: 45px; font-size: 14px; text-transform: none; font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;}


.global-nav-new .ancestor-hidden {
    display: none;
}

.global-nav-new ul > li > a.menu-toggle,
.global-nav-new ul > li.ancestor-show-more > a.menu-toggle,
.global-nav-new ul > li > button.menu-toggle,
.global-nav-new ul > li.ancestor-show-more > button.menu-toggle {
    background-image: url(/App_Themes/METC/Images/arrow-sprite.png?date=6-25-2020);
    background-position: -201px 10px;
    background-repeat: no-repeat;
}

.global-nav-new ul ul ul ul > li > a.menu-toggle,
.global-nav-new ul ul ul ul > li.ancestor-show-more > a.menu-toggle,
.global-nav-new ul ul ul ul > li > button.menu-toggle,
.global-nav-new ul ul ul ul > li.ancestor-show-more > button.menu-toggle {
    background-position-x: -251px;
}

.global-nav-new ul ul ul > li > a.menu-toggle,
.global-nav-new ul ul ul > li.ancestor-show-more > a.menu-toggle,
.global-nav-new ul ul ul > li > button.menu-toggle,
.global-nav-new ul ul ul > li.ancestor-show-more > button.menu-toggle {
    background-position-x: -251px;
}

.global-nav-new ul > li > a.menu-toggle.menu-open,
.global-nav-new ul > li > button.menu-toggle.menu-open {
    background-position-y: -101px;
}

.global-nav-new.hidden-global-nav .secondary a.menu-toggle,
.global-nav-new.hidden-global-nav .secondary button.menu-toggle {
    background-position-y: -214px;
}
.global-nav-new.hidden-global-nav .secondary a.menu-toggle.menu-open,
.global-nav-new.hidden-global-nav .secondary button.menu-toggle.menu-open {
    background-position-y: -328px;
}


.global-nav-new ul > li > a.menu-toggle.double, .global-nav-new ul > li > button.menu-toggle.double { height: 61px; background-position-y: 19px; }
.global-nav-new ul > li > a.menu-toggle.triple, .global-nav-new ul > li > button.menu-toggle.triple { height: 79px; background-position-y: 28px; }
.global-nav-new ul > li > a.menu-toggle.quad, .global-nav-new ul > li > button.menu-toggle.quad { height: 97px; background-position-y: 37px; }
.global-nav-new ul > li > a.menu-toggle.quint, .global-nav-new ul > li > button.menu-toggle.quint { height: 115px; background-position-y: 46px; }

.global-nav-new ul > li > a.menu-toggle.menu-open.double, .global-nav-new ul > li > button.menu-toggle.menu-open.double { background-position-y: -92px; }
.global-nav-new ul > li > a.menu-toggle.menu-open.triple, .global-nav-new ul > li > button.menu-toggle.menu-open.triple { background-position-y: -83px; }
.global-nav-new ul > li > a.menu-toggle.menu-open.quad, .global-nav-new ul > li > button.menu-toggle.menu-open.quad { background-position-y: -74px; }
.global-nav-new ul > li > a.menu-toggle.menu-open.quint, .global-nav-new ul > li > button.menu-toggle.menu-open.quint { background-position-y: -65px; }


.global-nav-new ul > li > a:first-child.current,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current
{
    background-position: -2px -6px;
    background-image: url(/App_Themes/METC/Images/nav-left-current1.png);/* TEST */
    background-repeat: no-repeat;
    text-decoration: none;
    font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    letter-spacing: -0.45px;
    padding-left: 15px;
}
.global-nav-new ul.menu-level-1 > li > a:first-child.current,
.global-nav-new ul.menu-level-0 > li > a:first-child.current,
.global-nav-new ul.menu-level-1 > li > a:first-child.current,
.global-nav-new ul.menu-level-0 > li > a:first-child.current
{
    background-position: 5px 14px;
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);/* TEST */
    border-left: none;/* TEST */
    padding-left: 15px;
}
a#nodeid-847 { padding-left: 10px; } /* TRANSPORTATION left nav adjustment */
a#nodeid-847.current { padding-left: 12px; }

/* highlight the +/- menu of the current page too... */
.global-nav-new ul > li > a:first-child.current + a.menu-toggle,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current + a.menu-toggle,
.global-nav-new ul > li > a:first-child.current + button.menu-toggle,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current + button.menu-toggle
{
/*    background-color: #001d3d;
    color: #ffffff;*//* TEST */
}

.global-nav-new ul > li > a:first-child.current + a.menu-toggle:hover,
.global-nav-new ul > li > a:first-child.current + a.menu-toggle:focus,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current + a.menu-toggle:hover,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current + a.menu-toggle:focus,
.global-nav-new ul > li > a:first-child.current + button.menu-toggle:hover,
.global-nav-new ul > li > a:first-child.current + button.menu-toggle:focus,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current + button.menu-toggle:hover,
.global-nav-new.hidden-global-nav .menu-level-1 > li.secondary > a:first-child.current + button.menu-toggle:focus
{
    font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    letter-spacing: -0.45px;
    text-decoration: underline;/* TEST */
}

.global-nav-new ul > li > a:first-child.current-path
{
    background-position: 5px 14px;
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow-black.png);/* TEST */
    background-repeat: no-repeat;
    text-decoration: none;
}

.global-nav-new ul.menu-level-1 > li > a:first-child.current-path
{
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);/* TEST */
}

.global-nav-new.hidden-global-nav ul > li.secondary > a:first-child.current-path,
.global-nav-new.hidden-global-nav li.secondary a:first-child.current
{
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow-gray.png);
}

.global-nav-new ul > li > a:first-child.on-current-path
{
    /*background-color: lime!important;*/
}

.global-nav-new ul.child-menu > li > a:first-child:hover,
.global-nav-new ul.sibling-menu > li > a:first-child:hover,
.global-nav-new ul > li > a:first-child:hover 
{
    text-decoration: none;
}

.global-nav-new ul.child-menu > li > a:first-child:focus,
.global-nav-new ul.sibling-menu > li > a:first-child:focus,
.global-nav-new ul > li > a:first-child:focus
{
    background-position: 5px 14px;
    /*background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);*/
    background-repeat: no-repeat;
    text-decoration: none;
    background-color: #00386e;
    color: #ffffff;
}

.global-nav-new ul > li > a.menu-toggle:focus,
.global-nav-new ul > li > button.menu-toggle:focus,
.global-nav-new ul > li > a.menu-toggle:hover,
.global-nav-new ul > li > button.menu-toggle:hover {
    background-color: #00386e;
    background-position-x: -201px!important;
}

.global-nav-new ul ul ul ul > li > a > span {
    display: block;
    padding-left: 0px;
}

.global-nav-new ul ul ul ul > li > a:focus > span {
    border-left-color: #ffffff;
}
.global-nav-new .menu-level-3 > li > a > span { margin-left: 6px; }
.global-nav-new .menu-level-4 > li > a > span { margin-left: 12px; }
.global-nav-new .menu-level-5 > li > a > span { margin-left: 18px; }
.global-nav-new .menu-level-6 > li > a > span { margin-left: 24px; }
.global-nav-new .menu-level-7 > li > a > span { margin-left: 30px; }

@media screen and (min-width: 768px) { 
    .global-nav-new ul li > a.menu-toggle:hover,
    .global-nav-new ul li > a.menu-toggle:active,
    .global-nav-new ul li > button.menu-toggle:hover,
    .global-nav-new ul li > button.menu-toggle:active
    {
        background-color: #00386e;/*TEST*/
        background-position-x: -201px;
    }
    .global-nav-new ul.child-menu > li > a:first-child:hover,
    .global-nav-new ul.sibling-menu > li > a:first-child:hover,
    .global-nav-new ul > li > a:first-child:hover,
    .global-nav-new ul.child-menu > li > a:first-child:active,
    .global-nav-new ul.sibling-menu > li > a:first-child:active,
    .global-nav-new ul > li > a:first-child:active
    { 
        background-position: 5px 14px;
        background-repeat: no-repeat;
        text-decoration: none;
        text-decoration: underline;/*TEST*/
    }
    .global-nav-new ul.menu-level-1 > li > a:first-child.current:hover,
    .global-nav-new ul.menu-level-0 > li > a:first-child.current:hover
    {
        background-position: 5px 14px;
        background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);        
    }
    .global-nav-new ul > li > a:first-child.current:hover
    {
        background-position: -2px -6px;
        background-image: url(/App_Themes/METC/Images/nav-left-current1.png);/* TEST */
        text-decoration: none;
    }
    .global-nav-new ul.child-menu > li > a:first-child:focus,
    .global-nav-new ul.sibling-menu > li > a:first-child:focus,
    .global-nav-new ul > li > a:first-child:focus
    {
        background-position: 5px 14px;
        /*background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);*/
        background-repeat: no-repeat;
        text-decoration: none;
        background-color: #00386e;
        color: #ffffff;
    }
}

.global-nav-new.menu-level-0 > li > a.menu-toggle.menu-open, 
.global-nav-new .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open,
.global-nav-new .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open,
.global-nav-new.menu-level-0 > li > button.menu-toggle.menu-open, 
.global-nav-new .sibling-menu > li.ancestor-show-more > button.menu-toggle.menu-open,
.global-nav-new .ancestry-menu > li.ancestor-show-more > button.menu-toggle.menu-open {
    background-position-y: 10px;
}

.global-nav-new .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.double,
.global-nav-new .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.double,
.global-nav-new .ancestry-menu > li.ancestor-show-more > button.menu-toggle.menu-open.double,
.global-nav-new .sibling-menu > li.ancestor-show-more > button.menu-toggle.menu-open.double {
    background-position-y: 19px;
}
.global-nav-new .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.triple,
.global-nav-new .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.triple,
.global-nav-new .ancestry-menu > li.ancestor-show-more > button.menu-toggle.menu-open.triple,
.global-nav-new .sibling-menu > li.ancestor-show-more > button.menu-toggle.menu-open.triple {
    background-position-y: 28px;
}
.global-nav-new .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quad,
.global-nav-new .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.quad,
.global-nav-new .ancestry-menu > li.ancestor-show-more > button.menu-toggle.menu-open.quad,
.global-nav-new .sibling-menu > li.ancestor-show-more > button.menu-toggle.menu-open.quad {
    background-position-y: 37px;
}

.global-nav-new.menu-level-0 > li > a.menu-toggle.menu-open.children-visible, 
.global-nav-new .sibling-menu > li.ancestor-show-more > a.menu-toggle.menu-open.children-visible,
.global-nav-new .ancestry-menu > li.ancestor-show-more > a.menu-toggle.menu-open.children-visible,
.global-nav-new.menu-level-0 > li > button.menu-toggle.menu-open.children-visible, 
.global-nav-new .sibling-menu > li.ancestor-show-more > button.menu-toggle.menu-open.children-visible,
.global-nav-new .ancestry-menu > li.ancestor-show-more > button.menu-toggle.menu-open.children-visible {
    background-position-y: -101px;
}


.global-nav-new .sibling-menu.menu-level-1 > li.ancestor-hidden > a.menu-toggle,
.global-nav-new .sibling-menu.menu-level-1 > li.ancestor-hidden > button.menu-toggle {
    background-position-y: 10px;
    border-color: #ffffff; /*#dbdddd;*/
    border-right: 0px solid;
}

.global-nav-new .sibling-menu.menu-level-1 > li.ancestor-hidden > a.menu-toggle.menu-open,
.global-nav-new .sibling-menu.menu-level-1 > li.ancestor-hidden > button.menu-toggle.menu-open {
    background-position-y: -101px;
}

.global-nav-new .sibling-menu.menu-level-1 > li > a:first-child:hover, .global-nav-new .sibling-menu.menu-level-1 > li > a:first-child:focus {
    background-color: #00386e;
}

.global-nav-new .menu-transportation > li > a { border-color: #ffffff; /*#dbdddd;*/ }
.global-nav-new .menu-communities > li > a { border-color: #ffffff; /*#dbdddd;*/ }
.global-nav-new .menu-parks > li > a { border-color: #ffffff; /*#dbdddd;*/ }
.global-nav-new .menu-housing > li > a { border-color: #ffffff; /*#dbdddd;*/ }
.global-nav-new .menu-wastewaterwater > li > a { border-color: #ffffff; /*#dbdddd;*/ }
.global-nav-new .menu-planning > li > a { border-color: #ffffff; /*#dbdddd;*/ }

.global-nav-new .sibling-menu.menu-level-1 > li > a.menu-toggle.double,
.global-nav-new .sibling-menu.menu-level-1 > li > button.menu-toggle.double {
    height: 61px;
}

.global-nav-new .sibling-menu.menu-level-1 > li > a.menu-toggle.triple,
.global-nav-new .sibling-menu.menu-level-1 > li > button.menu-toggle.triple {
    height: 79px;
}

.global-nav-new .sibling-menu.menu-level-1 > li > a.menu-toggle.quad,
.global-nav-new .sibling-menu.menu-level-1 > li > button.menu-toggle.quad {
    height: 97px;
}

.global-nav-new .sibling-menu.menu-level-1 > li > a.menu-toggle.quint,
.global-nav-new .sibling-menu.menu-level-1 > li > button.menu-toggle.quint {
    height: 115px;
}

.global-nav-new .sibling-menu > li > a.current {
    color: #ffffff;
    background-color: #001d3d;
    background-position: 5px 14px;
    background-image: url(/App_Themes/METC/Images/nav-current-line-arrow.png);
}
/*background: #00386e url(/App_Themes/METC/Images/nav-current-disc.png) 5px 14px no-repeat scroll;*/

.left-nav-loading {
    min-height: 300px;
    background-image: url(/App_Themes/METC/images/left-nav-loading.png);
    opacity: 0.7;
    animation: loading-pulse 2s infinite;
}

@keyframes loading-pulse
{
  0% {
    opacity: .7;
  }
  
  50% {
    opacity: .4;
  }
  
  100% {
    opacity: .7;
  }
}    

.touch-happened .global-nav-new {
    display: none;
}


/* ---------------------------------------------------------------------
 Footer
------------------------------------------------------------------------ */

.global-footer { margin-top: 20px; }

.footer-utility { background-color: #0054a4; }

.utility-list {
    padding: 18px 0;
    color: #ffffff;
    font-size: 14px;
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.utility-list > li + li {
    margin-left: 18px;
    padding-left: 18px;
}

.utility-list a { color: #ffffff; }

.utility-list a:hover {
    color: #76bcff;
    text-decoration: underline;
}

.footer-social {
    padding: 40px 0px 40px 0px;
    background-color: #043971;
}

.footer-social .h-list-std {
    max-width: 120px;
}

.footer-social .h-list-std > li:nth-child(4) {
    margin-left: 0px;
}

.footer-socialMobile {
    padding: 20px 10px 10px 10px;
    background-color: #043971;
}

.btn-social {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-indent: 200%;
    width: 30px;
    height: 30px;
    margin:0 0 10px 0;
    background: transparent url('/App_Themes/METC/Images/social-sprite.png?v=6-29-2020') 0 0 scroll no-repeat;
}

.email-icon {
    background-position: -180px 0;
}

.linkedin-icon {
    background-position: -150px 0;
}

.instagram-icon { background-position: -120px 0; }

.facebook-icon { background-position: -60px 0; }

.twitter-icon { background-position: -30px 0; }

.youtube-icon { background-position: 0 0; }

.social-icons { margin-top: 10px; }

.email-signup-wrapper {
   display: flex;
   align-items: center;
   padding: 10px 0px;
}

.email-signup-wrapper img {
   margin-right: 8px;
}

.mission-statement {
    color: #ffffff;
    font-size: 12px;
    line-height: 1.275;
}

.contact-list {
    margin-top: 10px;
    color: #ffffff;
    font-size: 12px;
    font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.footer-textblue {
    color: rgb(180,213,240);
    font-size: 14px;
    font-family: "Roman", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.footer-legal {
    padding: 18px 0;
    color: #ffffff;
    background-color: #001d3d;
}

.legal-links a { color: #ffffff; }

.legal-links a:hover {
    color: #76bcff;
    text-decoration: underline;
}

.copyright { float: right; }

.copyright { 
  float: left; 
  color: rgb(180,213,240);
}

.footer-columns {
    margin-top: 20px;
}

.footer-columns, .footer-columns a {
    color: white;
}

.footer-columns > div > div {
    width: 16%!important;
    padding-right: 4%;
    position: relative;
}

.footer-columns > div > div + div + div + div + div {
    width: 19%!important;
    padding-right: 0;
}

.footer-divider {
    position: absolute;
    left: -30px;
    height: 160px;
    border-right: 1px solid rgb(180,213,240);
}

.footer-divider-small {
    position: absolute;
    left: -30px;
    height: 70px;
    border-right: 1px solid rgb(180,213,240);
}
.footer-columns .heading {
    color: rgb(180,213,240);
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

.footer-columns ul {
    list-style-type: none!important;
    padding: 0px!important;
    margin: 0px!important;
}
/* changed list space not needed anymore 21182021
.footer-columns li {
    padding: 5px 0px!important;
}
*/

/* ---------------------------------------------------------------------
 Newsletter Form
------------------------------------------------------------------------ */

.signup {
    margin-top: 10px;
    overflow: hidden;
}

.email-input {
    margin-bottom: 5px;
    margin-top: 5px;
    border: none;
    padding: 10px;
    height: 10px;
    width: 210px;
}

.signup-block .email-input {
    margin-top: 5px;
    margin-bottom: 5px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    border: 1px solid #dcdcdc;
    padding: 7px 5px;
    height: 10px;
    width: 156px;
}

.btn-signup {
    float: right;
    background-color: #0054a4;
    color: #ffffff;
    padding: 10px 15px;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 14px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
}

.signup-block .btn-signup {
    margin-bottom: 3px;
    padding: 6px 15px;
    
}

.btn-signup:hover { background-color: #006cd2; }

.btn-signup:active { background-color: #00478b; }

.sidebar-newsletter > p { margin: -4px 0 1px; }

/* commented and changed per Ed Lube EA 2/22/2013 BEGINS */
.signup-block { margin: 0 0 -8px; }
/*.signup-block { margin: 0 0 5px; }*/
/* commented and changed per Ed Lube EA 2/22/2013 ENDS */

.styled-select-dropdown select {
   background: transparent;
   width: 100%;
   padding: 3px 5px 5px 5px;
   color: #0054a4;
   font-size: 14px;
   font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
   border: 0;
   border-radius: 0;
   height: 24px;
   }

  .styled-select-dropdown {
  width: 100%;
  height: 24px;
  margin-top: 8px;
  background: #ededed;
  }
  
  .styled-select-dropdown:hover {
  width: 100%;
  height: 24px;
  margin-top: 8px ;
  background: #cccccc;
  }

/* ---------------------------------------------------------------------
 Sortable Table
------------------------------------------------------------------------ */
.table-sort {
    width: 100%;
    margin: 5px 0 21px 0;
    position: relative;
    background: #FFF;
}

.sort-heading,
.sort-cell-first,
.sort-cell-left,
.sort-cell,
.sort-heading-middle,
.sort-heading-narrow,
.sort-cell-expander {
    border-top: 1px solid #dedede;
    text-align: left;
    
}

.sort-cell{ line-height: 1; }

.sort-cell-left { text-align: left; }

.sort-cell-expander { padding-left: 3px; } /* J Dudley - 4/7/2017 - adjusted to line up with 'expand all' icon in header */

.sort-heading,
.sort-heading-middle,
.sort-heading-narrow{
    background: #ededed;
    font: 400 13px/30px 'Bold'; 
    color: #2e2e2e;
    padding-left: 3px;
}

th.sort-heading { padding-left: 5px!important; }

.sort-heading-middle{ width: 150px;}

.sort-heading a:hover {
    text-decoration: none;
}

.sort-heading:first-child {
    /* width: 55%; */
    text-align: left;
}

.PresentationLink{
  padding-bottom: 7px;
}

.sort-heading-dec-1 {
  /* J Dudley - 9/13/17 - removed "background: ;" */
  color: #2e2e2e;
  text-align: left;
}

.sort-heading-dec-2 {
     color: #0054a4;
  text-align: left;
}

.sort-heading-cell {
    background: none;
  text-align: left;
}

.sort-cell-first,
.sort-cell-left,
.sort-cell {
    font: 400 13px/15px 'Roman';
    padding: 10px 5px 10px 5px;
    text-align: left;
}

/* Icons */
.sort-icon {
    display: inline-block;
    text-indent: -9999px;
    vertical-align: middle;  
}

/* Up Arrow Icon */
.sort-icon-1 {
    height: 9px;
    margin: 0 0 3px 0;
    width: 13px;
    background: url('/App_Themes/METC/Images/arrow-sprite.png') no-repeat -426px 0;
}

/* Down Arrow Icon */
.sort-icon-2 {
    background-position: -539px -69px;
}

/* Doc Icon */
.sort-icon-3 {
    margin: 0 8px 0 0;
    vertical-align: middle;
}

/* Download Icon */
.sort-icon-4 {
    height: 16px;
    margin: 0 auto;
    width: 24px;
    background: url('/App_Themes/METC/Images/arrow-sprite.png') no-repeat 0px -387px;
}

.downloadIconText{
    padding: 2px;
    color: #7aa036;
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    background-color: #0054a4;
    background: url('/App_Themes/METC/Images/arrow-sprite.png') no-repeat 0px -387px;
    padding-left: 30px;
}

.downloadIconText:hover{
    opacity: 0.7;
    filter: alpha(opacity=70); /* For IE8 and earlier */
}
/* Sort Dropdown */
.sort-dropdown,
.sort-label,
.sort-select {
    display: inline;
}

.sort-dropdown {
    float: right;
}

.sort-label {
    margin: 0 6px 0 0;
    text-align: right;
}

.sort-select {
    font: 400 10px/10px 'Roman';
    vertical-align: middle;
}

.TreeHeading{
    Font-family: 'medium-condensed', "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    color: #0054a4;
    padding-left: 10px;
    margin-left: 1px;
    vertical-align: 3px;
    line-height: 1.75;
}
.PDF-Headings{
    Font-family: 'bold', "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 14px;
    color: #0054a4;
    padding-left: 20px;
    line-height: 2.25;
}
.PDF-Headings {
    margin:  0 3px 0;
    width: 13px;
    background: url('/Files/UI/GeneralDocIcon.aspx') no-repeat ;
}

.table-sort td a { /* 5-26-2022 - J Dudley */
  font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

/* ---------------------------------------------------------------------
 Filters Module
------------------------------------------------------------------------ */
.filters-column {
    float: left;
    width: 155px;
}

.filters-column + .filters-column {
    margin-left: 10px;
    border-left: 1px solid #dedede;
    padding-left: 10px;
}

.v-list-filters > li {
    font-family: 'Condensed', "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
}

.v-list-filters > li + li { margin-top: 15px; }

.v-list-filters > li > a {
    display: block;
    overflow: hidden;
}

.filters-icon {
    height: 18px;
    width: 18px;
    float: left;
    background: url('/App_Themes/METC/Images/function-sprite.png') no-repeat -4px -372px;
}

.filter-label {
    float: left;
    margin: 1px 0 0 5px;
    width: 132px;
}

/* ---------------------------------------------------------------------
 Figures Module
------------------------------------------------------------------------ */
.mod-figures {
    clear: both;
    overflow: hidden;
}

.figures-item {
    margin: 0 20px 26px 0;
    width: 30%;
    float: left;
}

.figures-img {
    border: 1px solid #dedede;
    margin: 0 12px 0 0; 
}

.figures-cap { 
    margin: 14px 0 0 0;
    float: right;
    font-size: 14px;
    line-height: 17px;
}

/* ---------------------------------------------------------------------
 Contact Mod and Form
------------------------------------------------------------------------ */
.mod-contact {
    border-bottom: 1px solid #DDDDDD;
}

.form-simple {
    padding: 28px;
    float: left;
    background: #f4f4f4;
}

.simple-col {
    float: left;
}

.simple-col-1 {
    margin: 0 30px 0 0;
}

.form-simple li {
    margin: 0 0 15px 0;
}

.EditingFormLabel,
.simple-label,
.simple-input {
    font: 600 11px/16px helvetica;
}

.EditingFormLabel,
.simple-label {
    display: inline-block;
    margin: 10px 0px 0px 0px;
    width: auto;
    text-align: right;
    color: #0054a4;
    font-size: 16px;
    font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

.simple-input {
    border: 1px solid #cccccb;
    border-right-color: #f0f0f0;
    border-bottom-color: #f0f0f0;
    padding: 8px;
    width: 200px;
    font-weight: 400;
    font-size: 14px;
}

.simple-textarea {
    max-width: 285px;
    min-width: 285px;
}
.FormButton,
.simple-btn {
    border: none;
    padding: 8px 15px;
    background: #005dab;
    color: #FFF;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
}

.FormButton {
margin-right: 5px;
}

/* Button Hovers */
.FormButton:hover,
.simple-btn:hover,
.FormButton:focus,
.simple-btn:focus {
    color: #FFF;
    cursor: pointer;
    background: #6699cc;
    text-decoration: none
}

/* Wraps */
li.simple-wrap {
    display: inline-block;
    margin: 0 28px 0 60px;
}

.EditingFormControlNestedControl {
  display: inline-block;
  padding: 10px 0px 15px 0px;
  width:100%;
}

/* Checkboxes */
.simple-label-checkbox {
    margin: 0;
    width: 150px;
    font-size: 11px;
    font-weight: 400;
}

.simple-input-checkbox {
    border: none;
    padding: 0;
    width: auto;
}

.Safari .TextAreaField {
width: 470px !important;
height: 100px;
}

/* ---------------------------------------------------------------------
 Address Mod
------------------------------------------------------------------------ */
.mod-address {
    margin: 0 0 20px 0;
    line-height: 16px;
}

.mod-address li:nth-of-type(3),
.mod-address li:nth-of-type(4) {
    display: inline-block;
}

.mod-address li:nth-of-type(3) {
    border-right: 2px solid #999;
    margin:  0 6px 0 0;
    padding: 0 8px 0 0;
}

/* ---------------------------------------------------------------------
 Definition Mod
------------------------------------------------------------------------ */
.mod-def {
    margin: 0 0 20px 0;
    float: left;
}

.mod-def > dt,
.mod-def > dd {
    margin: 2px 2px 2px 0;
    float: left;
}

.mod-def dd dt {
    clear: left;
}

/* ---------------------------------------------------------------------
 Social Mod
------------------------------------------------------------------------ */
.mod-social {
    margin: 0 0 34px 0;
    clear: both;
}

.mod-social li {
    margin: 0 12px 0 0;
}

.social-icon {
    display: block;
    height: 30px;
    width: 30px;
    background: url('/App_Themes/METC/Images/social-sprite.png?v=6-29-2020') no-repeat 0 0;
}

.instagram-icon {
    background-position: -120px 0;
}

.flickr-icon {
    background-position: -90px 0;
}

.social-fb {
    background-position: -60px 0;
}

.social-tw {
    background-position: -30px 0;
}

.social-yt {
    background-position: 0 0;
}

/* ---------------------------------------------------------------------
 Question Mod
------------------------------------------------------------------------ */
.mod-question {
    width: 356px;
}

.mod-question .text-basic {
    margin: 0 0 4px 0;
}

/* ---------------------------------------------------------------------
 Callout Mod
------------------------------------------------------------------------ */
.mod-callout p {
    margin: 0 0 30px 0;
}

/* ---------------------------------------------------------------------
 Contact globals
------------------------------------------------------------------------ */
.text-basic {
    line-height: 16px;
}

.text-strong {
    font-family: "Bold","Helvetica","Tahoma","Geneva","Arial Narrow","Arial",sans-serif;
}

.heading-med {
    margin: 0 0 8px 0;
}

.heading-alt {
    color: #1A549A;
}

.mod-dec {
    border-top: 1px solid #DDDDDD;
    margin: 25px 0;
    padding: 25px 0;
    overflow: hidden;
}

/*styles for content feature*/
.CFHeader { display: block; font-size: 1.17em; font-weight: bold; margin: 1em 0;color: #0054a4; }
.CFImageTB { margin: 10px 0 10px 0 }
.CFImageLR { margin: 0 10px 0 10px }
.CFImageT { margin: 10px 0 0 0 }
.CFImageB { margin: 0 0 10px 0 }
.CFImageR { margin: 0 0 0 10px }
.CFImageL { margin: 0 10px 0 0 }
.CFTextLR { text-align: left; vertical-align: top; }
.CFTextTB { text-align: left; vertical-align: top; }
.CFTable { margin: 1px; vertical-align: top; }

    .cf-wrapper.left-right {display: table;}
    .cf-wrapper.left-right .cf-image {display: table-cell;}
    .cf-wrapper.left-right .cf-content {display: table-cell; vertical-align: top; padding-right: 15px; width: 100%;}

    .cf-wrapper.top-bottom {display: block;}
    .cf-wrapper.top-bottom .cf-image {display: block; width: 100%; text-align: center;}
    .cf-wrapper.top-bottom .cf-content {display: block; }

    .cf-wrapper p {line-height: 1.5em;}

.CItext {width: 508px}

.image-caption-wrapper { /* J Dudley - 4/24/17 added wrapper class to avoid duplication of image-caption divs */
  margin: 0px 10px 10px 10px; 
  }

img.image-caption{
  margin: 0px 10px 10px 10px; /* J Dudley - 4/11/17 adjusted caption alignment */
  vertical-align: bottom; /* J Dudley - 4/24/17 - to remove space between image and caption element below it */
  }

.caption{
  padding: 0 10px 10px 10px; /* J Dudley - 4/11/17 adjusted caption alignment */
  text-align: left;
  font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  font-size: 12px;
  line-height: 14px;
}

.highlight-video-right{
  margin: 0px 10px 10px 10px;
  float: right;
  width: 300px;
}
.caption-video{
  text-align: left;
  font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  font-size: 12px;
  line-height: 14px;
  color: #1A549A;
}

.highlight-text-right{
  padding: .7em;
  border:1px solid #ccc;
  background: #eee;
  margin: 0 0 1em 1em;
  float: right;
  width: 300px;
}

.blue-highlight-text-right{
  font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  font-size: 18px;
  letter-spacing: .5px;
  line-height: 30px;
  color: #0054a4;
  padding: 2em;
  border:none;
  background: rgba(180,213,240,.4);
  margin: 0 0 1em 1em;
  float: right;
  width: 300px;
}

.event-right-data { width:230px; }

.chair-message-dates { /* J Dudley - 5/31/17 - updated all parameters */
  float: right;
  text-align: center;
  width:133px; 
  background-color: #efefef;
  padding: 10px;
  margin: 0px 0px 10px 15px;
}


/* ---------------------------------------------------------------------
Original Author: Shawn Rickett
Contributors: N/A

Target Browsers: IE7, IE6
Media Type: Screen, Projection
Width: All Sizes
------------------------------------------------------------------------ */

.IE7 .h-list-pager a,
.IE7 .utility-nav,
.IE7 .search-form,
.IE7 .main-nav > li > a,
.IE7 .slide,
.IE7 .icon-alert,
.IE7 .h-list-tabs,
.IE7 .sort-icon,
.IE7 .simple-label,
.IE7 li.simple-wrap,
.IE7 .carousel-nav-item .page,
.IE7 .btn-arrow-toggle,
.IE7 .btn-sort{
    display: inline;
    zoom: 1;
}

.IE7 .utility-nav { margin-right: 15px; }

.IE7 .slide-text-box {
    background-color: #002b5c;
    z-index: 3;
    bottom: 40px;
}

.IE7 .slide-info {
    bottom: 40px;
}

.IE7 .main-nav > li > a {
    display: inline-block;
    border-top: 10px solid transparent;
    padding: 33px 10px 34px 36px;
    color: #005dab;
    background: transparent url('/App_Themes/METC/Images/arrow-sprite.png') 17px 37px scroll no-repeat;
    text-transform: uppercase;
}

.IE7 .view-all {
    line-height: normal;
    margin-top: -30px;
}

.IE7 .feature-hd { background-color: #21282B; }

.IE7 .home-features { position: relative; }

/* ---------------------------------------------------------------------
Image Gallery
------------------------------------------------------------------------ */
.image-gallery {
  min-height: 480px;
  width: 100%;
  padding: 10px 10px 10px 0px;
}

.image {
  min-height: 120px;
  max-height: 120px;
  overflow: hidden;
  margin: 0;
  border-color: #0054a4;
  border-style: solid;
  border-width: 1px;
  border-bottom: 0px;
  width: 100%;
}

.image-dis {
  padding: 10px 0px 10px 0px;
  margin:0px 0px 15px 0px;
  background-color: #ededed;
  border-color: #0054a4;
  border-style: solid;
  border-width: 1px;
  border-top: 0px;
  width: 100%;
  float: left;
}

.image-title {
  font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  line-height:15px;
  color: #0054a4;
  font-size: 12px;
  min-height: 30px;
  padding: 0px 10px 0px 10px;
  width: 70%;
  float: left;
  clear: right;

}

.image-download{
  width: 10%;
  padding: 5px 10px 0px 10px;
  float: left;
  clear: right
}

/* ---------------------------------------------------------------------
Original Author: Shawn Rickett
Contributors: N/A

Target Browsers: IE8, IE7, IE6
Media Type: Screen, Projection
Width: All Sizes
------------------------------------------------------------------------ */

.IE7 .wrapper-carousel, 
.IE8 .wrapper-carousel { width: auto; }

.IE7 .hero-carousel .carousel-item,
.IE8 .hero-carousel .carousel-item { margin: 0; }

.IE7 .hero-carousel .carousel-container,
.IE8 .hero-carousel .carousel-container { margin: 0 auto; }


.IE7 .btn-arrow-toggle {
    display: block;
    width: 14px;
    height: 9px;
    background-position: 0 -109px;
}

.IE7 .arrow-toggle-off { background-position: 0 0; }
/*--------------------------------------------------------

Added to allow wysiwyg editor to work.
RyaN Van Der Meide

------------------------------------------------------*/
.wysiwyg {line-height: 1.5;}
/* Strong and em */
.wysiwyg strong, .wysiwyg th { font-weight: normal; }
.wysiwyg em, .wysiwyg address, .wysiwyg caption, .wysiwyg cite { font-style: italic; }
/* Table */
.wysiwyg table{ display: table;  border-collapse: collapse; }
 .table-border td, .table-border th {   border-width: 1px;
   border-color: Black;
   border-collapse:collapse;
   border-style: Solid; }
.wysiwyg tr { display: table-row; vertical-align: inherit; }
.wysiwyg td { display: table-cell;  }
.wysiwyg th { display: table-cell; vertical-align: inherit; font-weight: bold; padding: 1px; }
/* Block Items */
.wysiwyg p { display: block; line-height: 1.5;margin-bottom: 20px; }
.wysiwyg blockquote { display: block; margin: 1em 20px; }
.wysiwyg address { display: block; font-style: italic; }
.wysiwyg center { display: block; text-align: center; }
/* Headers */
.wysiwyg h1 { display: block; font-size: 2em; font-weight: normal; line-height: 2;color: #0054a4; } /* 6-7-16 JD */
.wysiwyg h2 { display: block; font-size: 1.5em; font-weight: normal; line-height: 1.5;color: #0054a4; } /* 6-7-16 JD */
.wysiwyg h3 { display: block; font-size: 1.17em; font-weight: normal; line-height: 1.5;color: #0054a4; } /* 6-7-16 JD */
.wysiwyg h4 { display: block; font-size: 1.0em; font-weight: normal; line-height: 1.5; color: #0054a4; }
.wysiwyg h5 { display: block; font-size: 0.83em; font-weight: normal; line-height: 1.5;color: #0054a4; }
.wysiwyg h6 { display: block; font-size: 0.67em; font-weight: normal; line-height: 1.5;color: #0054a4; }
/* Lists */
.wysiwyg ul { display: block; list-style-type: disc; margin: 10px 0px 20px 0px; padding-left: 40px; }
.wysiwyg ul.social { display: block; list-style-type: none!important; margin: 1em 0; padding-left: 0px; }
.wysiwyg ol { display: block; list-style-type: decimal; margin: 0px 0px 20px 0px; padding-left: 40px; }
/* .wysiwyg ol ol { list-style-type: lower-alpha; margin: 0;} /* 3/27/18 JD */
/* .wysiwyg ol ol ol { list-style-type: lower-roman; margin: 0;} /* 3/27/18 JD */
.wysiwyg ol[type="a"] { display: block; list-style-type: lower-alpha; margin: 1em 0; padding-left: 40px; } /* 10-9-17 JD */
.wysiwyg li { display: list-item; margin: 0px 0px 10px 0px }
.wysiwyg p + ul, .wysiwyg p + ol { margin-top: -10px;}
/* Pre */
.wysiwyg pre, .wysiwyg code { display: block; font-family: Courier New; white-space: pre; margin: 1em 0; }

.wysiwyg .table-grey-border,
.wysiwyg .table-alt-lines 
{
    border: .11em solid #0054a4;
    color: #252525;
}

.table-alt-lines tr:nth-child(odd) {
   background-color: #e0eaf4;
}

.wysiwyg .table-grey-border  td,
.wysiwyg .table-alt-lines td
{
   padding: 6px;
}

.wysiwyg .table-grey-border tbody tr td
{
  border: .1em solid #cccccc;

}

.wysiwyg .table-grey-border thead,
.wysiwyg .table-alt-lines thead,
.wysiwyg .table-grey-border th,
.wysiwyg .table-alt-lines th
{
    background-color: #0054a4;
    color: white;
}

/*--------------------------------------------------------
Added to change the style on Accordion Layout.
Shawn Jacobson
------------------------------------------------------*/
.AccordionHeader720{
    padding: 12px 10px;
    margin-bottom: 2px;
    width: 653px;
    color: #0054a4;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background-color: #75b0ea;
    background: #75b0ea url('/App_Themes/METC/Images/WhiteArrow-Sprite.png') -149px 8px no-repeat scroll;
    padding-left: 47px;
}

.AccordionHeader720S, .AccordionHeader720s{
    padding: 12px 10px;
    margin-bottom: 2px;
    width: 653px;
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background-color: #0054a4;
    background: #0054a4 url('/App_Themes/METC/Images/WhiteArrow-Sprite.png') 13px 8px no-repeat scroll;
    padding-left: 47px;
}

.AccordionHeader720:hover, .AccordionHeader470:hover, .AccordionHeaderM:hover {
    color: #0054a4;
    background-color: #6699cc;
    text-decoration: none;
  }

.AccordionContent{
    border: 1px solid #e3e3e3;
    border-top: none;
    padding: 3%;
    width: 100%;
    box-sizing: border-box;
    display: none;
}

.AccordionHeader470 {
   padding: 12px 10px;
    margin-bottom: 2px;
    width: 413px;
    color: #0054a4;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background-color: #75b0ea;
    background: #75b0ea url('/App_Themes/METC/Images/WhiteArrow-Sprite.png') -149px 8px no-repeat scroll;
    padding-left: 47px;
}
.AccordionHeader470S, .AccordionHeader470s {
    padding: 12px 10px;
    margin-bottom: 2px;
    width: 413px;
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background-color: #0054a4;
    background: #0054a4 url('/App_Themes/METC/Images/WhiteArrow-Sprite.png') 13px 8px no-repeat scroll;
    padding-left: 47px;
}
acctext{
  font-family: "Normal", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  font-size: 12px;
  line-height: 200%;
}

.AccordionHeader470:focus, .AccordionHeader720:focus, .AccordionHeaderM:focus{
  background-color: #6699cc;
}

.AccordionHeaderM{
    padding: 20px 10px;
    margin-bottom: 2px;
    height: 20px;
    width: auto;
    color: #0054a4;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 24px;
    text-transform: uppercase;
    background-color: #75b0ea;
    background: #75b0ea url('/App_Themes/METC/Images/WhiteArrow-Sprite.png') -149px 18px no-repeat scroll;
    padding-left: 47px;
}
.AccordionHeaderMS{
    padding: 20px 10px;
    margin-bottom: 2px;
    height: 20px;
    width: auto;
    color: #ffffff;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 24px;
    text-transform: uppercase;
    background-color: #0054a4;
    background: #0054a4 url('/App_Themes/METC/Images/WhiteArrow-Sprite.png') 13px 18px no-repeat scroll;
    padding-left: 47px;
}
.AccordionContentM{
  width: 90%;
  margin: 5px 5px 5px 5px;
}

/*--------------------------------------------------------
CSS for Termometer $.
Shawn Jacobson
------------------------------------------------------*/
#content {
    /*height:300px;*/
    margin:0px 0px 0px 0px;
}

#thermometer {
    width:90px;
    height:300px;
    position: relative;
    background: rgba(0, 129, 67,0.5);
}

#thermometer .track {
    height:300px;
    margin:0 auto;
    background: #5abe8f;
}

#thermometer .progress {
    height:100%;
    width:100%;
    background: rgb(0, 129, 67);
    background: rgba(0, 129, 67,0.8);
    position: absolute;
    bottom:0;
    left:0;
}

#thermometer .goal {
    position:absolute;
    top:0;
}

#thermometer .amount {
    display: inline-block;
    padding:0 5px 0 100px;
    border-top:1px solid #008144;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    color:#008144;
}

#thermometer .progress .amount {
    display: inline-block;
    padding:0 5px 0 100px;
    border-top:1px solid #008144;
    color:#008144;
    right:0;
}
#thermometer .thermText {
    display: inline-block;
    padding:0 5px 0 100px;
    font-family: "Normal", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 12px;
    line-height: 1;
    width:120px;
}
#thermometer .thermText2 {
    display: inline-block;
    padding:5px 5px 0 100px;
    font-family: "Normal", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 12px;
    line-height: 1;
    width:120px;
}
/*--------------------------------------------------------
Metro GoTo Card.
Shawn Jacobson
------------------------------------------------------*/
.mt-form {
  font-family: Arial, sans-serif;
  font-size: 9pt;
  line-height: 1.5em;
  color: #525252;
  float: right;
  max-width: 345px;
  /* height: 215px; */ /* J Dudley - 6/5/17 - removed height */
  margin: 20px 0px 20px 20px;
  padding: 15px;
  border: 1px solid #49a048;
  background: #fff;
}

.mt-form label {
  font-weight: bold;
}

.mt-entry-section input {
  width: 14em;
  height:18px;
  margin-top: 5px;
  margin-bottom: 0em;
  padding: 4px 8px;
}

.mt-entry-error {
  padding-top: 2px;
}

.mt-buttonwrap {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
  z-index: 1;
}

.mt-button {
  display: block;
  float: left;
  background: url(/Files/UI/arrowright.aspx) no-repeat 100% 0%;
  background-color: #0054a4;
  height: 30px;
  margin: 0;
  padding: 0 30px 2px 15px;
  border: none;
  color: #ffffff;
  font-size: 14px;
  text-transform: uppercase;
  text-align: left;
  z-index: inherit;
  cursor: hand; 
}

.mt-button:hover, .mt-button:focus{
    color: #ffffff;
    background-color: #00386e;
    text-decoration: none;
}

.red {
  color: #ed1b2e !important;
}

/*--------------------------------------------------------
Woahbar - 
------------------------------------------------------*/
.woahbar {
    background-color: #ffd200;
    color: #002b5c;
    font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    left: 0;
    padding: 6px 0px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 100;
    box-shadow: 0px 0px 5px #888888;
    -moz-box-shadow:0px 0px 5px #888888;
    -webkit-box-shadow:0px 0px 5px #888888;
}
.woahbar-stub {
    height: 300;
    left: 0;
    padding: 7px 0 5px;
    position: absolute;
    text-align: center;
    top: -10px;
    width: 100%;
    z-index: 200;
}
 
.woahbar span
{
  float: left;
  width: 100%;
  text-align: center;
  padding-top: 4px;
}
 
.woahbar-link
{
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  
  background: #fcde53;
  box-shadow: 1px 1px 3px rgba(0,0,0,0.28);
  -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.28);
  -moz-box-shadow:1px 1px 3px rgba(0,0,0,0.28);
  color: #002b5c;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  padding: 4px 10px 3px 10px;
  margin-left: 10px;
}
 
.woahbar-down-arrow:hover {
  background-color: #ffd200; /* << set custom hover bar color here */
}
 
.woahbar-up-arrow:hover {
  background: url(/Files/UI/woahbar-up-arrow-hover.aspx);
}
 
.woahbar-link:hover
{
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
 
  background: #fbe476; /* Old browsers */
  box-shadow: 1px 1px 3px rgba(0,0,0,0.28);
  -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.28);
  -moz-box-shadow:1px 1px 3px rgba(0,0,0,0.28);
  color: #002b5c;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  padding: 4px 10px 3px 10px;
  margin-left: 10px;
  text-decoration: none;
}
 
.close-notify
{
  float: right;
  margin-right: 22px;
  color: #fff;
  width: 17px;
  height: 19px;
  text-decoration: none;
  background-color: #ffd200; /* << set custom bar color here */
  cursor:pointer;
}
 
.show-notify
{
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 0 0 5px rgba(0,0,0,0.35);
  -moz-box-shadow: 0 0 5px rgba(0,0,0,0.35);
  -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.35);
  float: right;
  margin-right: 15px;
  color: #fff;
  width: 35px;
  height: 33px;
  text-decoration: none;
  background-color: #ffd200; /* << set custom bar color here */
  cursor:pointer;
}
/*--------------------------------------------------------
Temp CSS for GREENLINE Count Down.
Shawn Jacobson
------------------------------------------------------*/
.cd-containter { width: 444px; height: 90px; background-color: #008144; padding: 24px 20px 24px 20px; float: left;
                         font-family: Helvetica, Arial, sans-serif; text-align: center; margin-top: 5px; }
.cd-number { font-size: 60px; font-weight: bold; line-height: 60px; color: #FFFFFF }
.cd-over { font-size: 30px; font-weight: bold; line-height: 30px; color: #FFFFFF }
.cd-label { font-size: 20px; font-weight: bold; line-height: 20px; color: #A1C7B2; letter-spacing: -1px; margin-top: 5px; }
.cd-item { min-width: 100px; text-align: center; margin: auto 5px; display: inline-block; }
.cd-image { float: top; height: 25px; }
.cd-image > img { width: 484px; height: 52px; margin-left: 0px; margin-right: 0px; }

/*--------------------------------------------------------
styles for file icons
--------------------------------------------------------*/

.icon-file-pdf:before { background-image: url("/App_Themes/METC/icon-file-pdf.gif"); background-size: 100% auto; content: " "; display: inline-block; height: 16px; width: 16px; margin-bottom: -2px; margin-right: 3px; }
.icon-file-jpeg:before, .icon-file-jpg:before { background-image: url("/App_Themes/METC/jpeg.gif"); background-size: 100% auto; content: " "; display: inline-block; height: 16px; width: 16px; margin-bottom: -2px; margin-right: 3px; }


/*--------------------------------------------------------
styles for meeting, agenda, business item lists
Jim Dudley
--------------------------------------------------------*/
.BusinessItemsDataTable {margin: 5px 5px 10px 20px;}
.BusinessItemsDataTable td {padding: 5px;}
.BusinessItemsDataTable td:first-child {white-space: nowrap;}


.agenda-video-wrapper {
  padding: 15px 0px;
}
.agenda-header {
  padding: 10px 0px;
  margin-top: 10px;
  border-top: 1px solid #dddddd;
}

/*--------------------------------------------------------
styles for business opportunity lists
Jim Dudley
--------------------------------------------------------*/
.new-business-opp {
    padding: 1px 4px;
    font-weight: bold;
    background-color: #e00000;
    color: white;
    border-radius: 3px;
    display: inline-block;
    font-size: 11px;
}

/*--------------------------------------------------------
styles for SolSmart solar resource list
Jim Dudley
--------------------------------------------------------*/
.SolSmartList {margin: 15px 0px;}
.SolSmartList select {padding: 5px;}
#SolSmartResults {margin-bottom: 25px;}
.SolSmartResourceTable {margin: 5px 5px 10px 20px;}
.SolSmartResourceTable tr th {text-align: left; font-weight: bold; padding: 7px; line-height: 1.5em; white-space: nowrap;}
.SolSmartResourceTable tr td {padding: 7px; line-height: 1.5em;}

/*--------------------------------------------------------
SWLRT construction alerts
--------------------------------------------------------*/
.constructionNote1, constructionNoteLocation {
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 24px;
    color: #0054a4;
    margin: 5px;
}
.constructionNote2 {
    font-family: "Medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    line-height: 1.5;
    color: #EE3124;
    Margin:5px;
}
.constructionNoteButton {
    background-color: #0054a4;
    color: #ffffff;
    padding: 10px 15px;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 14px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    Margin:5px;
    text-decoration: none;
}
.constructionNoteButton:hover { 
    background-color: #006cd2;
    color: #ffffff;
    padding: 10px 15px;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 14px;
    text-decoration: none;
 }
.constructionNoteImpact, .constructionNoteDateRange  {
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 20px;
    color: #ee3124;
}
.constructionNoteDateRange{
    padding-left:50px;
}
.constructionNote3 {
  display: block; 
  line-height: 1.5;
  margin-bottom: 10px;
  background-color: #ffffff;
  color: #252525;
  font: 13px/1 "Roman", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  padding:0px 5px 0px 5px;
}
.constructionNote4 {
  display: block; 
  line-height: 1.5;
  margin-bottom: 10px;
  background-color: #ffffff;
  color: #252525;
  font: 13px/1 "Roman", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  padding:0px 5px 0px 5px;
}
.constructionNote5 {
    padding:10px 0px 20px 0px;
}

/*--------------------------------------------------------
styles for Water Rates
Jim Dudley
--------------------------------------------------------*/
.water-rate-wrapper {
    margin-top: 15px;
}

.water-rate-wrapper:after {
  content: "";
  display: table;
  clear: both;
}

.water-rate-utility-wrapper {
    float:left;
    width: 30%;
    padding-right: 3%;
}

.water-rate-utility {
    font-size: 20px;
    font-weight: bold;
    padding: 10px 20px 10px 0px;
}

.water-rate-sector {
    font-weight: bold;
    padding: 5px 0px;
}

table.water-rates {
    min-width: 200px;
}

.water-rates tr td {
    padding: 5px 0px 5px 20px;
} 

.water-rates tr td + td {
    text-align: right;
} 

.water-rates tr td.rate-notes {
    font-size: 12px;
    font-style: italic;
    text-align: center;
    padding-bottom: 15px;
}

.water-rates tr td.rate-notes div{
    padding-bottom: 5px;
}

.water-rates-loading {
    display: block;
    padding: 25px 40px;
    background: url('/App_Themes/METC/images/loading.gif') no-repeat 0px 15px;
}

/*--------------------------------------------------------
styles for JobSearch web part
Jim Dudley
--------------------------------------------------------*/
  .job-search-wrapper {
        margin: 0px 0px 30px 0px;
        clear: both;
    }
    .search-jobs {
        margin: 12px 0px;
        padding: 12px;
        width: 97%;
        background-color: #fff;
        border: 1px solid rgba(0, 84, 163, 1);
    }
  
    a.find-open-jobs {
        padding: 8px;
        margin: 10px 0px;
        color: #fff;
        background-color: #002a5c;
        font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
        font-size: 16px;
        border: none;
        cursor: pointer;
        text-transform: uppercase;
        text-decoration: none;
    }
    a.find-open-jobs:hover {
        background-color: #0054a4;
    }

/*--------------------------------------------------------
styles for Scrolling Job List (VerticalTicker)
Jim Dudley
--------------------------------------------------------*/
#ticker-box {
    width: 99%;
    border: 1px solid rgba(0, 84, 163, 1);
}
#ticker {
    width: 100%;
    height: 170px;
    margin: 0 auto;
}
.tick-nav {
    width: 100%;
    height: 20px;
    margin: 0 auto;
    text-align: center;
}
.tick-nav a {
    display: inline-block;
    width: 100%;
    height: 100%;
    color: white;
    border: none 0px;
    text-indent: 110%; 
    white-space: nowrap; 
    overflow: hidden;
    background: url('/App_Themes/METC/Images/arrow-white-down.png') no-repeat rgba(0, 84, 163, 1) center;
}
#up-tick {
    background-image: url('/App_Themes/METC/Images/arrow-white-up.png');
}
#down-tick {
    background-image: url('/App_Themes/METC/Images/arrow-white-down.png');
}
.tick-nav a:hover, .tick-nav a:focus {
    background-color: #75b0ea;
}
#ticker-wrapper {
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
#ticker-wrapper ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    height: 800px;
    position: relative;
    transition: all 1500ms ease;
}
#ticker-wrapper li {
    display: block;
    width: 92%;
    margin-bottom: 0.3em;
    position: relative;
  clear: both;
  padding: 10px 4%;
}
#ticker-wrapper li:nth-child(even) {
    background: #fff;
}
#ticker-wrapper li figure {
    width: 80px;
    height: 80px;
    float: left;
    margin: 0;
    padding: 0;
}
#ticker-wrapper li figure img {
    display: block;
    width: 100%;
    height: 100%;
}
#ticker-wrapper li h3 {
    float: right;
    margin: 0;
    padding-top: 2em;
    padding-right: 0.5em;
    font-size: 1em;
}
.job-title {
  font-weight: bold;
}
.job-listing { 
  padding: 10px 0px 20px 0px; 
  margin: 10px 0px; 
  border-bottom: 1px solid #ccc; 
  line-height: 1.5 
}
.job-listing h2 a { 
  font-size: 1.5em; 
  line-height: 1.5em; 
  padding: 10px 0px;
}
.job-pub-date { 
  font-style: italic; 
  font-size: 0.85em;
  margin: 5px 0px; 
}
@media screen and (max-width: 765px) {
  .tick-nav {height: 30px;}
}

/*--------------------------------------------------------
styles for Expandable Content
Jim Dudley
--------------------------------------------------------*/
.ec_wrapper {
    margin-top: 5px;
    margin-bottom: 5px;
    position: relative;
}

.ec_bar {
    width: 100%;
}

.ec_bar button {
    display: block;
    border: 1px solid #75b0ea;
    color: #003D75; //#0054a4;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    background: #75b0ea url(/App_Themes/METC/Images/WhitePlusMinus-Sprite2.png) 14px -66px no-repeat scroll;
    padding: 9px 10px 8px 47px;
    transition: color 0s ease;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
}

.ec_bar button:hover, .ec_bar button:focus {
    text-decoration: none;
    background-color: #a7d3ff;
    color: #002A52;
}

.ec_compact .ec_bar button:hover, .ec_compact .ec_bar button:focus {
    text-decoration: none;
    background-color: #a7d3ff;
    color: #002A52;
}

.ec_bar button.ec_open
{
    color: #ffffff;
    background: #0054a4 url(/App_Themes/METC/Images/WhitePlusMinus-Sprite2.png) 14px 9px no-repeat scroll;
}

.ec_compact .ec_bar button.ec_open
{
    color: #ffffff;
    background: #0054a4 url(/App_Themes/METC/Images/WhitePlusMinus-Sprite2.png) 13px 4px no-repeat scroll;
}

.ec_content {
    border: 1px solid #e3e3e3;
    border-top: none;
    padding: 3%;
    width: 100%;
    box-sizing: border-box;
    position: absolute; left: -10000px; /* display: none; */
    overflow: auto;
}

.ec_compact .ec_bar button {
    font-size: 16px;
    text-transform: unset;
    background: #cad3e0 url(/App_Themes/METC/Images/WhitePlusMinus-Sprite2.png) 13px -71px no-repeat scroll;
    padding: 7px 10px 7px 47px; 
    border: none;
}

/*--------------------------------------------------------
styles for MapEmbed
Jim Dudley
--------------------------------------------------------*/

.esri-map-wrapper {
  margin: 20px 0px;
}

/* Mobile Resize  */

/* hide on desktop version*/
.hideOnDesktop {
display:none;
} 

nav ul, nav li { margin: 0; }
nav ul, ul { list-style:none; }

.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12, .span13, .span14, .span15, .span16, .span17, .span18, .span19, .span20, .span21, .span22, .span23, .span24{
    float:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.colpaddingL{
  padding-left: 0.625%;
}
.colpaddingR{
  padding-right: 0.625%;
}
.colL1{
  margin-left: 1%;
}
.colR1{
  margin-right: 1%;
}

.col{
  margin-left: 0.625%;
}
.colR{
  margin-left: 0.625%;
}
.col:first-child {
  margin-left:0;
}

.span1{
  width: 3.56770833333%;
  
}
.span2{
  width: 7.76041666667%;
  
}
.span3{
  width: 11.953125%;
  
}
.span4{
  width: 16.1458333333%;
  
}
.span5{
  width: 20.3385416667%;
  
}
.span6{
  width: 24.53125%;
  
}
.span7{
  width: 28.7239583333%;
  
}
.span8{
  width: 32.9166666667%;
  
}
.span9{
  width: 37.109375%;
  
}
.span10{
  width: 41.3020833333%;
  
}
.span11{
  width: 45.4947916667%;
  
}
.span12{
  width: 49.6875%;
  
}
.span13{
  width: 53.8802083333%;
  
}
.span14{
  width: 58.0729166667%;
  
}
.span15{
  width: 62.265625%;
  
}
.span16{
  width: 66.4583333333%;
  
}
.span17{
  width: 70.6510416667%;
  
}
.span18{
  width: 74.84375%;
  
}
.span19{
  width: 79.0364583333%;
  
}
.span20{
  width: 83.2291666667%;
  
}
.span21{
  width: 87.421875%;
  
}
.span22{
  width: 91.6145833333%;
  
}
.span23{
  width: 95.8072916667%;
  
}
.span24{
  width: 100%; /* 960px; */
  margin-left: 0;
}

.floatright{
    float: right;
}

#container,.inner{
 margin: 0 auto;
 padding: 0px ;
 overflow: hidden;
 width: 100%;
}

.inner{
 margin: 0 auto;
 padding: 0px ;
 overflow: hidden;
 width: 960px;
}

.navigation .inner {
    width: 975px;
}

#container{
  clear: both;
  padding-top: 0px;
}

#wrapper{
  clear: both;
  padding-top: 0px;
  background color: #ffffff;
}

.alt{
  color: #fff;
  color: rgba(255,255,255, 0.9);
  letter-spacing: 0.05em;
}

/* NAVIGATION */
/* Mobile navigation for LRT alerts*/

.utility-headerm {
    border-bottom: 1px solid #ffffff;
    background-color: #002b5c;
    color: #ffffff;
    font-size: 14px;
}

ul.topnavm {
  list-style-type: none;
  margin-left: 0px;
  margin: 0px 0px 20px 0px;
  float: left;
  width: 100%;
  overflow: hidden;
  background-color: #002b5c;
  border-style: solid;
  border-color: transparent;
  position: relative;
  z-index: 2;
}

ul.topnavm li {float: left;}

ul.topnavm li a {
  display: inline-block;
  color: #0045a4;
  z-index: 2;
  color: #fff;
 
  text-transform: uppercase;
  text-align: center;
  padding: 15px 15px 15px 15px;
  text-decoration: none;
  float: left;
  font-size: 16px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

ul.topnavm li a:hover {background-color: #0054a4;
    text-decoration: none;
}

ul.topnavm li.iconmobile {display: none;
    text-decoration: none;}

@media screen and (max-width:765px) {
  ul.topnavm.responsive {position: relative;}
  ul.topnavm.responsive li.iconmobile {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnavm.responsive li {
    float: none;
    display: inline;
  }
  ul.topnavm.responsive li a {
    display: block;
    text-align: left;
  }
}
 .centerImage{
  text-align: center;
  margin-bottom:25px;
}
  
/* MEDIA QUERIES */

/* Responsify Defaults */

@media screen and (max-width: 1024px){

  nav {
    width: 100%;
  }

  .span16, article{
    width: 100%;
  }

  #container, .inner{
    width: 100%;
  }
   .span8, .span6, aside{
    width: 50%;
    margin-left: 0;
  }
  
  .home-features {
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding: 14px 5% 14px 5%;
    background-color: #fcfcfc;
}
  
  .home-features-blue {
    border-top: 1px solid rgba(180,213,240,.8);
    border-bottom: 1px solid rgba(180,213,240,.8);
    padding: 14px 5% 14px 5%;
    background-color: rgba(180,213,240, 0.13);
  }
}

@media screen and (max-width: 768px){
  nav .span8{
    width: 100%;
  }

  .span16, article{
    width: 100%;
  }

  .span7, .span8, .span11, .span12, .span13, aside{
    width: 100%;
    margin-left: 0;
  }

  #container, .inner{
    width: 100%;
  }
  .span6, aside{
    width: 50%;
    margin-left: 0;
  }
}

@media screen and (max-width: 480px){
  nav ul li{
    width: 100%;
    margin: 0 0 5px 0;
  }

  nav a{
    margin: 0;
    padding: 14px 0 14px 0;
  }
  .span6, aside{
    width: 100%;
    margin-left: 0;
  }
}
  
@media screen and (max-width: 1024px) {
 /* Add your styles for devices with a maximum width of 1024 */
  
#navigationM {
/* display:none; */
 z-index: 10;
}
  .hideOnMobile {
display:none;
} 
  .hideOnDesktop {
display:block;
} 
  .footer-social {
    padding: 40px 5% 40px 5%;
    background-color: #043971;
}
  .footer-legal {
    padding: 18px 5% 18px 5%;
    color: #ffffff;
    background-color: #001d3d;
}
   .innerpadding {
    padding: 0px 5% 0px 5%;
    width: 90%;
    }
}
  
@media screen and (max-width: 765px) {
 /* Add your styles for devices with a maximum width of 768 */
  
  #navigationM {
/* display:none; */
 z-index: 10;
}
  .hideOnMobile {
display:none;
} 
  .hideOnDesktop {
display:block;
} 
  .footer-social {
    padding: 40px 5% 40px 5%;
    background-color: #043971;
}
  .footer-legal {
    padding: 18px 5% 18px 5%;
    color: #ffffff;
    background-color: #001d3d;
}
   .innerpadding {
    padding: 0px 5% 0px 5%;
    }
}  

@media screen and (max-width: 480px) {
 /* Add your styles for devices with a maximum width of 480 */
  
  .footer-social {
    padding: 40px 5% 40px 5%;
    background-color: #043971;
}
  .footer-legal {
    padding: 18px 5% 18px 5%;
    color: #ffffff;
    background-color: #001d3d;
}
  .innerpadding {
    padding: 0px 5% 0px 5%;
}
    
  .mt-form {
  font-family: Arial, sans-serif;
  font-size: 9pt;
  line-height: 1.5;
  color: #525252;
  float: right;
  /* height: 215px; */ /* J Dudley - 6/5/17 - removed height */
  margin: 20px 0px 20px 0px;
  padding: 15px;
  border: 1px solid #49a048;
  background: #fff;
}

}

/* Micro Clearfix */

/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:table;
}

.cf:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
/*.cf {
    *zoom:1;
}*/

/* J Dudley - 4/21/17 - auto-resize YouTube iframes by wrapping in these classes */

.video-wrapper-16x9 {
  height: 0px; 
  padding-bottom: 56.25%; /* 9/16 */
  margin-bottom: 25px;
  position: relative;

}

.video-wrapper-4x3 {
  height: 0px; 
  padding-bottom: 75%; /* 3/4 */
  margin-bottom: 25px;
  position: relative;

}

.video-wrapper-16x9 iframe, .video-wrapper-4x3 iframe {
  left: 0px; 
  top: 0px; 
  width: 100%; 
  height: 100%; 
  position: absolute;
}

/* J Dudley - 5/24/17 - scroll to top button styles */

.scroll-to-top {
    display: block;
    position: fixed;
    bottom: 10px;
    right: -200px;
}

.scroll-to-top.show {
    bottom: 10px;
    right: 18px;
}

.scroll-to-top a {
    color: white;
    line-height: 40px;
    padding: 10px 15px;
    background-color: #002a5c;
    opacity: 0;
    -webkit-transition: opacity 0.5s; /* Safari */
    transition: opacity 0.5s;
    border: 1px solid #999;
}

.scroll-to-top.show a {
    opacity: 0.7;
}

.scroll-to-top a:hover, .scroll-to-top a:focus {
    text-decoration: none;
    opacity: 1.0;  
    border-width: 2px;
    padding: 9px 14px;
}

/****************************************** 
Print Styles
J Dudley - 5/30/17
*******************************************/
.print-header {
  display: none;
}

@media print {
  .print-header {
    display: block!important;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
    font-size: 16px;
  }
  
  .no-print,
  #CMSHeaderDiv,
  .utility-header,
  #navigation,
  #drawer,
  #employment-menu-placeholder,
  .footer-utility,
  .footer-social,
  .footer-legal 
  {
    display: none;
  }
  
  .main > .wrapper > .grid-row > .grid-col.size5of24 {
    /*background-color: lime;*/
    display: none;
  }
  
  .main > .wrapper > .grid-row > .grid-col.size18of24 {
    /*background-color: yellow;*/
    /*width: 100%*/
  }

  .main > .wrapper > .grid-row > .grid-col.size18of24 > .size12of24 {
    /*background-color: red;*/
    /*width: 66%;*/
  }
}

/* J Dudley - 6/2/17 - Metro Mobility Provider Search styles */

#mmpSearch {
    font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    margin: 0px 0px 10px 0px;
}

#mmpSearch strong {
    font-weight: bold;
}

#mmpSearchLabel {
    margin: 10px 0px 0px 0px ;
    display: block;
}

#mmpSearchInput {
    margin-bottom: 10px;
    margin-top: 10px;
    border: none;
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #dcdcdc;
    font-family: "Roman", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
}

#mmpSearchButton {
    padding:10px 15px 10px 15px;
    margin: 10px 0px 0px 0px;
    color: #fff;
    background-color: #002a5c;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
}

#mmpSearchButton:hover, #mmpSearchButton:focus {
    background-color: #0054a4;
}

#mmpSearchAddress, #mmpSearchResult {
    padding:10px 0px 10px 15px;
    margin: 20px 0px 0px 0px;
    background-color: #FFF;
    border: 1px solid #dcdcdc;
    font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    color: #0054a4;
    display: none;
}

#mmpSearchResult {
    padding-top: 10px;
    margin: 1px 0px 0px 0px;
    font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    color: #ee3124;
}

/*--------------------------------------------------------
styles for Trip Planner for Metro Mobility
Jim Dudley
--------------------------------------------------------*/

.trip_settings {
    padding-left: 0px;
    max-width: 200px;
}

.trip_settings .optionDiv {
    display: block;
    margin: .3em 0;
}

.trip_settings .optionDiv > .mt-label {
    line-height: 22px;
    font-weight: bold;
    display: block;
    margin: .5em 0 .3em 0;
}

a.go-to-trip-planner {
    padding: 8px;
    margin: 10px 0px;
    color: #fff;
    background-color: #002a5c;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    border: none;
    display: inline-block;
    cursor: pointer;
    text-transform: uppercase;
    text-decoration: none;
}

a.go-to-trip-planner:hover, a.go-to-trip-planner:focus {
    background-color: #0054a4;
}

/*--------------------------------------------------------
styles for Feedback Incident Form for Metro Mobility
Jim Dudley
--------------------------------------------------------*/

.mm-form input {
  padding: 6px 10px;
  width: 100%;
  max-width: 85%;
}

.mm-form input[type="radio"] {
  width: 25px;
}

.mm-form label {
  text-align: left;
}

.mm-form .ErrorLabel, .mm-form .EditingFormErrorLabel, .mm-form .required-mark {
  color: #ff0000;
  margin-top: -5px;
}

.mm-form textarea {
  padding: 10px 10px;
  width: 100%;
  max-width: 85%;
}

.mm-form input[maxlength="3"] {
  width: 25px;
  margin: 0px 4px;
}

.mm-form input[maxlength="4"] {
  width: 30px;
  margin: 0px 4px;
}

.mm-form .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

.mm-form .required-mark {
  font: 600 11px/16px helvetica;
  color: #e00000;
}

.mm-form .ExplanationText.Error {
  color: #e00000;
}

.mm-form textarea.Error {
  background-color: lightyellow;
}

/*--------------------------------------------------------
styles for ESRI-based Service Map for Metro Mobility
Jim Dudley
--------------------------------------------------------*/

#mapContainer {
    line-height: 1.5em;
    width: 100%;
}

#mapTop {
    padding: 0;
    overflow: hidden;
    font-family: inherit;
    background-color: white;
    border: none;
    visibility: hidden;
}
#mapControl {
    margin: 10px 0px;
    overflow: hidden;
}
#mapSelection {
    float:left;
    padding-right: 30px;
    /*width:150px;*/
}
#mapLayerSelection
{
    width:100px;
    padding-left: 10px;
}
#mapSearchForm {
    float:left;
}
#mapSearchResults {
    float:left;
    font-weight: bold;
    clear: both;
}
#mapTitle {
    margin: 10px 0px;
    color: #E41F11;
    font-size: 18px;
    font-weight: bolder;
    overflow: hidden;
}
#map {
    position: relative;
    padding: 0;
    overflow: hidden;
    border-right: solid none;
    border-bottom: solid none;
    -moz-box-shadow: 5px #888;
    -webkit-box-shadow: 5px #888;
    box-shadow: inset 0 0 5px #888;
    background-color: #fff;
}
.dijitDialog {
    margin: 50px;
}
#mapSearchResult {
    padding: 5px;
    color: #0054a4;
    background-color: #ededed;
    visibility: hidden;
}
#mapSearchResult a {
    text-decoration: underline;
}
.searchInputFields {
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid #dcdcdc;
    padding: 7px 5px;
    width: 200px;
}
#mapSearching {
    padding: 6px;
    z-index: 100;
    visibility: hidden;
}
#mapSearchButton {
    margin-left: 69px;
    margin-top: 4px;
    width: 212px;
}
.searchButton {
    background-color: #002a5c;
    color: #ffffff;
    padding: 8px 15px;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
}
.searchButton:hover, .searchButton:focus {
    background-color: #0054a4;
}
.mapSearchHeadings {
    font-size: 16px;
    font-weight: bold;
    margin: 5px 0px;
}
.mapLegendPane {
    margin: 0 15px 0 10px;
    padding: 0 10px 0 10px;
    background-color: white;
    visibility: hidden;
}
.mapNotes {
    margin: 10px 0px;
}

.mapNotes em {
    font-style: italic;
}

.esriSimpleSlider {
    border: none !important;
    background-color: transparent !important;
    color: black !important;
    box-shadow: none !important;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}
.esriSimpleSlider div {
    margin-top: 3px;
    margin-bottom: 3px;
    font-weight: 700;
}

.esriSimpleSliderVertical .esriSimpleSliderIncrementButton,
.esriSimpleSliderVertical .esriSimpleSliderDecrementButton {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    box-shadow: 0 0 0.25em #BBB;
    background-color: white !important;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
}
.esriLegendLayer {
    font-weight: bold;
    font-size: 12px;
}

.mapLegendPane ul {
    padding-left: 50px;
}

table.esriLegendLayer tr:first-child td:first-child {
    width: 30px;
}

table.esriLegendLayer tr td {
    vertical-align: middle;
    font-size: 16px;
}

.esriLegendLayerLabel, .wysiwyg table.esriLegendLayerLabel {
    display: none;
}

.esriLegendService {
    padding: 20px 0px 0px 0px;
    padding-bottom: 0px!important;
}

.scalebar_bottom-left {
    left: 10px;
    bottom: 5px;
}

#mapInitLoader {
  display: none;
}

.loader {
    left: 50%;
    top: 60%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.loaderResults {
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -25%);
    transform: translate(-50%, -25%);
}
.loader .spinner, .loaderResults .spinner {
    box-sizing: border-box;
    stroke: #673AB7;
    stroke-width: 3px;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: line 1.6s cubic-bezier(0.4, 0, 0.2, 1) infinite, rotate 1.6s linear infinite;
    animation: line 1.6s cubic-bezier(0.4, 0, 0.2, 1) infinite, rotate 1.6s linear infinite;
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    to {
        -webkit-transform: rotate(450deg);
        transform: rotate(450deg);
    }
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    to {
        -webkit-transform: rotate(450deg);
        transform: rotate(450deg);
    }
}
@-webkit-keyframes line {
    0% {
        stroke-dasharray: 2, 85.964;
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    50% {
        stroke-dasharray: 65.973, 21.9911;
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dasharray: 2, 85.964;
        stroke-dashoffset: -65.973;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
}
@keyframes line {
    0% {
        stroke-dasharray: 2, 85.964;
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    50% {
        stroke-dasharray: 65.973, 21.9911;
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dasharray: 2, 85.964;
        stroke-dashoffset: -65.973;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
}

/*--------------------------------------------------------
styles for Map Gallery list
Jim Dudley
--------------------------------------------------------*/
#MapGalleryWrapper {margin: 15px 0px;}
#MapGalleryWrapper select {padding: 5px;}
#MapGalleryWrapper label {font-weight: bold;}
#MapGalleryResults {margin-bottom: 25px;}
.MapGalleryTable {margin: 15px 0px 10px 0px; width: 99%;}
.MapGalleryTable tr th {text-align: center; font-weight: bold; padding: 7px; line-height: 1.5em; border: 1px solid #ccc; background-color: #ccc;}
.MapGalleryTable tr td {padding: 7px; line-height: 1.5em; border: 1px solid #ccc; text-align: center;}
.MapGalleryTable tr th:nth-child(1), .MapGalleryTable tr td:nth-child(1), .MapGalleryTable tr th:nth-child(2), .MapGalleryTable tr td:nth-child(2) {text-align: left;}
.MapGalleryTable tr td:nth-child(2) {white-space: nowrap;}
@media screen and (max-width: 765px) { 
  .MapGalleryTable tr td:nth-child(2) {white-space: normal;} 
}

/*--------------------------------------------
styles for Dev and Test site banners
Jim Dudley
--------------------------------------------------------*/

.devtestsite {
  display: none;
  font-size: 16px;
  color: #fff;
  font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  text-decoration: none;
  text-align: center;
  line-height:1.5;
}

.devtestsite.devsite {
  display: block;
  background-color: darkorange;
}

.devtestsite.testsite {
  display: block;
  background-color: #ee3124;
}

.devtestsite.devsite:before {
   content: "YOU ARE ON THE DEV SITE";
}

.devtestsite.testsite:before {
   content: "YOU ARE ON THE TEST SITE";
}

.devtestsite.redosite:before {
   content: "YOU ARE ON THE REDO SITE";
}

/*--------------------------------------------------------
styles for Council Newsletter List
Jim Dudley
--------------------------------------------------------*/

ul.council-newsletters {
    list-style-type: none; 
    margin: 0; 
    padding-left: 0;  
}

ul.council-newsletters li {
    margin: 5px 0px;
}

/*--------------------------------------------------------
styles for HRA Rent Search 
Jim Dudley - 2/27/20
--------------------------------------------------------*/

#hraSearch {
    font-family: "medium", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    margin: 0px 0px 10px 0px;
}

#hraSearch strong {
    font-weight: bold;
}

#hraSearchLabel {
    margin: 10px 0px 0px 0px ;
    display: block;
}

#hraSearchInput {
    margin-bottom: 10px;
    margin-top: 10px;
    border: none;
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #dcdcdc;
    font-family: "Roman", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
}

#hraSearchButton {
    padding:10px 15px 10px 15px;
    margin: 0px 0px 0px 0px;
    color: #fff;
    background-color: #002a5c;
    font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
}

#hraSearchButton:hover, #hraSearchButton:focus {
    background-color: #0054a4;
}

#hraSearchAddress, #hraSearchResult {
    padding:10px 0px 10px 15px;
    margin: 20px 0px 0px 0px;
    background-color: #FFF;
    /*border: 1px solid #dcdcdc;*/
    font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
    color: #0054a4;
    display: none;
}

#hraSearchResult {
    padding-top: 10px;
    margin: 1px 0px 0px 0px;
    font-family: "Bold", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
    font-size: 16px;
}


#hraSearchResult table th {
    text-align: right;
    padding: 4px 12px;
    background-color: #efefef;
}

#hraSearchResult table td {
    text-align: right;
    padding: 4px 12px;
}

#hraSearchResult p {
    margin: 15px 0px;
    max-width: 400px;
}

/*--------------------------------------------------------
styles for mega nav
--------------------------------------------------------*/

.main-logo {
             margin-right: 30px;
       }

    .navigation {
         top: 0px;
    }

    .global-header {
        z-index: 5112;
    }

    .main-nav-new * {
        box-sizing: border-box;
    }

    .main-nav-new {
        font-size: 19px;
        font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
        padding-left: 0;
        display: flex;
        /* float: left; */
    } 
        
        .main-nav-new ul {
            padding: 10px 0px 0px 0px;
        }

        .main-nav-new > li {
            /* float: left; */
        }
        
        .main-nav-new > li > a {
            font-size: 17px;
            font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
            display: inline-block;
            border-style: solid;
            /* padding: 33px 9px 34px 36px; */
            padding: 36px 12px 37px 11px;
            border-color: transparent;
            margin-right:1px;
            position: relative;
            z-index: 5002;
            color: #0054a4;
            /*background: transparent url(/App_Themes/METC/Images/arrow-sprite.png) 14px 34px scroll no-repeat;*/
            text-transform: uppercase;
            text-decoration: none;
            height: 100%;
        }

        .main-nav-new > li > button {
            font-size: 17px;
            font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
            display: inline-block;
            border-style: solid;
            border-width: 0px;
            /* padding: 33px 9px 34px 36px; */
            padding: 36px 12px 37px 11px;
            border-color: transparent;
            margin-right:1px;
            position: relative;
            z-index: 5002;
            color: #0054a4;
            /*background: transparent url(/App_Themes/METC/Images/arrow-sprite.png) 14px 34px scroll no-repeat;*/
            background-color: transparent;
            text-transform: uppercase;
            text-decoration: none;
            height: 100%;
        }

        .main-nav-new > li > a.active, .main-nav-new > li > button.active {
            /*background: #ffffff url(/App_Themes/METC/Images/arrow-sprite.png) 14px -75px scroll no-repeat;*/
            border-bottom-color: #ffffff;
            border-bottom-width: 0px;
        }

        .main-nav-new > li:last-child > ul, .main-nav-new > li:nth-last-child(2) > ul {
            right: 0;
        }

    .main-subnav-new {
        border: 1px solid;
        display: none;
        position: absolute;
        background-color: #ffffff;
        z-index: 5001;
        box-shadow: 0px 40px 100px rgba(0,25,60,.32);
        overflow: hidden;
    }

        .main-subnav-new a {
            text-decoration: none;
            font-family: "Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
            color: #002a5c;
            font-size: 16px;
            padding-right: 35px;
        }

            .main-subnav-new a:hover, .main-subnav-new a:focus {
                text-decoration: underline;
            }

        .main-subnav-new li {
            position: relative;
        }

        .main-subnav-new > li > img {
            position: absolute;
            left: 20px;
            top: 8px;
            max-width: 35px;
        }

        .main-subnav-new > li {
             padding-top:8px;
             padding-bottom: 12px;
        }

        .main-subnav-new ul li {
            padding-left: 65px;
            font-size: 16px;
            padding-bottom: 4px;
        }

            .main-subnav-new ul li:first-child a {
                font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
                text-transform: uppercase;
                font-size: 18px;
                color: #0054a4;
            }


        ul.main-subnav-new-allcaps-blue li a{
            font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
            text-transform: uppercase;
            font-size: 18px;
            color: #0054a4;
        }

        .main-subnav-new > li:last-child {
            font-family: "Bold-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
            font-size: 16px;
            text-transform: uppercase;
            
            padding-bottom: 0px;
        }

            .main-subnav-new > li:last-child li {
                padding: 0px;
                overflow: hidden;
            }

                .main-subnav-new > li:last-child li a {
                    padding: 14px 20px 14px;
                    display: table;
                    box-sizing: border-box;
                    width: 101%;
                    color: #0054a4;
                }

                    .main-subnav-new > li:last-child li a:hover, .main-subnav-new > li:last-child li a:focus {
                        color: #002b5c;
                        text-decoration: underline;
                    }
/*
@media screen and (max-width: 1024px) {
    .main-nav-new {
        display: none;
    }
}
*/
    /* green */
    .theme-green > a.active, .theme-green > a:hover, .theme-green > a:focus, .theme-green > a.current-top-nav {
        border-color: #78a22f #78a22f #78a22f #78a22f;
        background-color: #78a22f;
        color: #ffffff;
    }
    .theme-green .main-subnav-new {
        border-color: #78a22f;
        border-width:2px;
        color: #ffffff;
    }
    .theme-green .main-subnav-new > li:last-child li a {
            background-color: #0054a4;

    }

    /* red */
    .theme-red > a.active, .theme-red > a:hover, .theme-red > a:focus, .theme-red > a.current-top-nav  {
        border-color: #ee3124;
        background-color: #ee3124;
        color: #ffffff;
    }
    .theme-red .main-subnav-new {
        border-color: #ee3124;
        color: #ffffff;
    }
    .theme-red .main-subnav-new > li:last-child li a {
            background-color: #ee3124;
    }

    /* aqua */
    .theme-aqua > a.active, .theme-aqua > a:hover, .theme-aqua > a:focus, .theme-aqua > a.current-top-nav  {
        border-color: #009ac7;
        background-color: #009ac7;
        color: #ffffff;
    }
    .theme-aqua .main-subnav-new {
        border-color: #009ac7;
        color: #ffffff;
    }
        .theme-aqua .main-subnav-new > li:last-child li a {
            background-color: #009ac7;
        }

    /* dkblue */
    .theme-dkblue > a.active, .theme-dkblue > a:hover, .theme-dkblue > a:focus, .theme-dkblue > a.current-top-nav  {
        border-color: #002b5c;
        background-color: #002b5c;
        color: #ffffff;
    }
    .theme-dkblue .main-subnav-new {
        border-color: #002b5c;
        border-width:2px;
        color: #ffffff;
    }

    .theme-dkblue .main-subnav-new > li:last-child li a {
            background-color: #002b5c;
    }

 /* dkgray */
   .theme-dkgray > a.current-top-nav,
   .theme-dkgray > button.current-top-nav {
        border-color: #fff;
        background-color: #fff;
        color: #0054a4;
    }
    .theme-dkgray > a.active, .theme-dkgray > a:hover, .theme-dkgray > a:focus,
    .theme-dkgray > button.active, .theme-dkgray > button:hover, .theme-dkgray > button:focus  {
        border-color: #d6d6d6;
        background-color: #d6d6d6;
        color: #0054a4;
    }
    .theme-dkgray .main-subnav-new {
        border-color: #d6d6d6;
        background-image: linear-gradient(to bottom, rgb(214, 214, 214),  rgba(255, 255, 255, 0));
        border-width:2px;
        color: #0054a4;
    }

    .theme-dkgray .main-subnav-new > li:last-child li a {
            background-color: #d6d6d6;
    }

/* Bootstrap elements before we add full Bootstrap */

.text-center, .text-center .WebPartContent {
  text-align: center;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;  
}

/*image with text below photo */
.phototext{
  background-color: rgba(180,213,240, 0.30);
  color: #0054a4;
  text-align: center;
  width: 100%;
  padding: 15px 0px 15px 0px;
  font-size: 16px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}

/*process boxes*/
.processboxes{
  background-color: #ffffff;
  position: relative;
  padding:10px;
  min-height: 160px;
}
.processboxes-lightBlue{
  background-color: rgba(180,213,240, 0.30);
  position: relative;
  padding:10px;
  min-height: 100px;
  height:100%;
}
.processboxes-vertical-lightBlue {
  background-color: rgba(180,213,240, 0.30);
  position: relative;
  padding:10px;
  margin-bottom:20px;
}
.processtext-Blue{
  background-color: rgba(0,93,170, 1.0);
  color: #fff;
  text-align: center;
  position: relative;
  padding: 10px;
  font-size: 16px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}
.processboxes-lightGray{
  background-color: rgba(204,204,204, 0.30);
  position: relative;
  padding:10px;
  min-height: 100px;
  height:100%;
}
.processtext-Gray{
  background-color: rgba(85,85,85, 1.0);
  color: #fff;
  text-align: center;
  position: relative;
  padding: 10px;
  font-size: 16px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}
.processboxes-lightGreen{
  background-color: rgb(0,130,68, 0.1);
  position: relative;
  padding:10px;
  min-height: 100px;
  height:100%;
} 
.processtext-Green{
  background-color: rgba(80,130,68, 1.0);
  color: #fff;
  text-align: center;
  position: relative;
  padding: 10px;
  font-size: 16px;
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
}
.process-arrow-img {
  border: 3px solid #fff;
  border-radius:50px;
  overflow: visible;
}
.vertical-center-right {
  position: absolute;
  top: 50%;
  bottom: 0%;
  margin-top:-13px;
  right: -6%;
}
.center-middle-bottom {
  position: absolute;
  left: 8%;
  top: 90%;
}
.rotated90{
  transform: rotate(90deg); /* Equal to rotateZ(90deg) */
}
.lightbluebox{
  background-color: rgba(180,213,240, 0.30);
  padding: 15px 5px 15px 5px;
}
.ESbluebox{
  background-color: rgba(0,154,199, 0.70);
  padding: 15px 5px 15px 5px;
}
/*image compare */
.img-comp-container {
  position: relative;
  height: 420px; /*should be the same height as the images*/
}
.img-comp-img {
  position: absolute;
  width: auto;
  height: auto;
  overflow: hidden;
}
.img-comp-img img {
  display: block;
  vertical-align: middle;
  max-width: unset;
}
.img-comp-slider {
  position: absolute;
  z-index: 9;
  cursor: ew-resize;
  /*set the appearance of the slider:*/
  width: 40px;
  height: 40px;
  background:url('/Files/UI/CircleLRArrow.aspx') no-repeat;
  opacity: 0.7;
  border-radius: 50%;
}

/*Timeline*/

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(26, 54, 126, 0.125);
    border-radius: .25rem
}

.card-body {
    flex: 1 1 auto;
    padding: 20px;
}

.vertical-timeline {
    width: 100%;
    position: relative;
    padding: 20px;
}

.vertical-timeline::before {
    content: '';
    position: absolute;
    top: 0;
    left: 153px;
    height: 100%;
    width: 4px;
    background: #66666640;
}

.vertical-timeline-element {
    position: relative;
    margin: 0 0 1rem
}

.vertical-timeline-element-icon {
    position: absolute;
    top:0;
    left: -35px;
}

.badge-dot-xl {
    width: 20px;
    height: 20px;
    position: relative
}

.badge-dot-image{
  width: 20px;
  height: 20px;
  background-color:#0054a4;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #fff;
}

.badge:empty {
    display: none
}

.vertical-timeline-element-content {
    position: relative;
    margin-left: 160px;
}

.vertical-timeline-element-content .timeline-title {
    text-transform: uppercase;
    margin: 0 0 10px;
    padding: 2px 0 0;
}

.vertical-timeline-element-content .vertical-timeline-element-date {
    display: block;
    font: 13px/1 "medium", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
    position: absolute;
    left: -150px;
    width: 100px;
    top: 0;
    margin: 3px 0 0 0;
    padding-right: 10px;
    text-align: right;
    color: #666666;
    white-space: nowrap;
}

.vertical-timeline-element-content:after {
    content: "";
    display: table;
    clear: both
}


/* Able Player */

.able-transcript-caption {
  display: block;
  line-height: 1.5;
  margin-bottom: 10px;
}

.able-swap-described {
  display: none;
}

.able-swapper {
  padding: 8px;
  margin: -12px 0px 0px;
  color: #0054a4;
  /* color: #fff; */
  /* background-color: #002a5c; */
  font-family: "Medium-Condensed", "Helvetica", "Tahoma", "Geneva", "Arial Narrow", "Arial", sans-serif;
  font-size: 16px;
  border: none;
  cursor: pointer;
  text-transform: uppercase;
  text-decoration: none;
  width: 100%;
}

.able-swapper:hover, .able-swapper:focus {
  color: #fff; 
  background-color: #002a5c; 
}

.able-transcript-caption {
  display: block;
  line-height: 1.5;
  margin-bottom: 10px;
}

.able-transcript-caption:after {
  content: " ";
}

/* Contacts */

.contacts {
    padding-left: 90px;
    background: url(https://metrocouncil.org/Files/UI/QuestionIcon.aspx) no-repeat;
}

.contacts:after {
  content: "";
  display: table;
  clear: both;
}

.contacts-heading {
    margin-bottom: 10px;
}

.contacts-heading-subtext {
    margin-bottom: 10px;
}

.contact-column {
    width:  45%;
    padding-right: 5%;
    float: left;
}

.contact {
    margin: 0px 0px 25px;
    padding: 0px 0px 0px 13px;
    border-left: 1px solid #ccc;
}

.contact:last-child {
    border-bottom: none;
}

.contact-heading {}

.contact-name {
    font-weight: bold;
}

.contact-title {}

.contact-phone {}

.contact-email {
    display: block;
}

.contact-link {
    display: block;
}

@media screen and (max-width: 480px){

    .contact-column {
        width:  95%;
        padding-right: 5%;
        float: left;
    }

}

/* Tobii Lightbox */

.lb-prompt {
    font-size: 1em;
    line-height: 1.5;
    margin: 8px 0px;
    font-weight: bold;
    color: #0054a4;
}

.lb-heading {
    font-size: 1em;
    line-height: 1.5;
    margin: 8px 0px;
    font-weight: bold;
}

.lb-text {
    font-size: 0.7em;
    margin: 8px 0px;
    line-height: 1.25em;
    font-weight: bold;
}

.lb-link {
    margin: 8px 0px;
    line-height: 1.25em;
    font-weight: bold;
}

    .lb-link a {
        color: white;
    }

/* Columns Flex */

.col-flex-container {
    display: flex;
    align-content: space-between;
    box-sizing: border-box;
}

.col-flex-space-10 {
    margin-left: -10px;
    /* margin-bottom: -10px; */
}

.col-flex-space-20 {
    margin-left: -20px;
    /* margin-bottom: -20px; */
}

.col-flex {
    box-sizing: border-box;
    flex: 1;
    /* background-color: lime; */
}

.col-flex-space-10 .col-flex {
    padding-left: 10px;
    padding-bottom: 10px;
}

.col-flex-space-20 .col-flex {
    padding-left: 20px;
    padding-bottom: 20px;
}

.col-flex-count-6.col-flex-container {
    flex-wrap: wrap;
}

.col-flex-count-6 .col-flex {
    flex: 33.3%
}

.col-flex-1 { flex: 1; }
.col-flex-2 { flex: 2; }
.col-flex-3 { flex: 3; }
.col-flex-4 { flex: 4; }
.col-flex-5 { flex: 5; }
.col-flex-6 { flex: 6; }
.col-flex-7 { flex: 7; }
.col-flex-8 { flex: 8; }
.col-flex-9 { flex: 9; }
.col-flex-10 { flex: 10; }
.col-flex-11 { flex: 11; }
.col-flex-12 { flex: 12; }
 
.col-flex > div {
    /* border: 1px solid lightgray; */
    /* padding: 10px; */
    /* box-shadow: #cdcdcd 3px 3px 10px; */
}

@media screen and (min-width: 768px) and (max-width: 991px){
    .col-flex-container {
        flex-wrap: wrap;
    }
  
    .col-flex:not(.col-flex-custom), .col-flex-count-6 .col-flex {
        flex: 50%;
        /* background-color: lime; */
    }
}


@media screen and (max-width: 767px){
    .col-flex-container {
        flex-wrap: wrap;
    }
  
    .col-flex, .col-flex-count-6 .col-flex {
        flex: 100%;
        /* background-color: yellow; */
    }
}