/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Oct 19, 2021, 1:33:04 PM
    Author     : amireadm
*/
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700;
}

.block1 table{
    display: table-cell;
}
ol, ul {
    margin-top: 0;
    margin-bottom: 10px;
}
.inputTable{
    display: table-cell;
}
.pagerTD td table {
    width: auto;
    margin-bottom: 0px;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}
input {
    line-height: normal;
    height: 24px;
}
button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
/*Format for all ASP.net Button objects*/
.btnButtonFormat:hover {
    background-color: #186da3;
    border-color: #186da3;
    color: white;
    font-size: 15px;
}
/*Formatting for all ASP.net Gridview objects in the website*/
.gridviewpager {
    background-color: white;
}

    .gridviewpager span {
        color: black;
        font-size: 14pt;
        background-color: lightgray;
    }

    .gridviewpager td {
        padding-left: 10px;
        padding-right: 10px;
    }

.GridviewRow td {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 5px;
    padding-right: 5px

}

.GridviewRow th {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 5px;
    padding-right: 5px

}

.WordAllignment {
    vertical-align: middle;
    text-align: center;
}

.pagination {
    background-color: #9199a4;
}

    .pagination span {
        color: black;
        font-size: 12pt;
        background-color: lightgray;
    }


/*Formatting for all AutoComplete textbox flyout functionality*/
.completionList {
    border: solid 1px #444444;
    margin: 0px;
    padding: 2px;
    height: 500px;
    overflow: auto;
    background-color: #FFFFFF;
}

.listItem {
    color: #1C1C1C;
    font-size: 14px;
    /*border-bottom: 2px dotted blue;*/
    /*line-height: 22px;*/
}

.itemHighlighted {
    background-color: darkgray;
    font-size: 14px;
}
/*Added W3.CSS properties*/
.w3-button:hover {
    color: white !important;
}
.w3-dropdown-hover:hover > .w3-button:first-child,.w3-dropdown-click:hover > .w3-button:first-child{background-color:#3e84bd;color:#000}

.w3-container{
    margin: auto;}


w3-bar-item w3-button w3-hide-small w3-hide-medium::before{
content:none;}
/*These are to match bootstrap*/
@media (min-width: 768px){
    .w3-container{
        width:750px !important;
    }
}
@media (min-width: 993px){
    .w3-container{
        width:970px !important;
    }
}
@media (min-width: 1200px){
    .w3-container{
        width:1170px !important;
    }
}
* {
    margin: 0;}

/*Basic css for tags*/
html {
    /* Prevent font scaling in landscape while allowing user zoom */
    -webkit-text-size-adjust: 100%;
    overflow-y: scroll;
}

body {
    background: #ffffff !important; /*white*/
    margin: 0;
    font-family: "Source Sans Pro", Helvetica, sans-serif; /*google font pulled in*/
    color: #333; /*text color -- very dark gray*/
}

body a { /*links*/
    color: #3799e8; /*bright blue*/
    text-decoration: none; /*remove underline*/
}

body a:hover {
    color: #0b80e0;
    text-decoration: none; /*remove underline*/
}

body a:focus {
    text-decoration: none; /*remove underline*/
}
p {
    margin: 0 0 10px; /*bottom pargin below paragraph elements*/
}
ul {
    display: block;
    list-style-type: disc; /*circle bullet points*/
    padding-left: 12px;
}
/*headers*/
h1 {
    font-weight: 400;
    font-size: 36px;
    letter-spacing: .03em;
    color: #0f2d40;
    padding-bottom: 9px;
    margin-bottom: 15px;
    display: block;
    border-bottom: 1px solid #8a97ac;
    line-height: 1.1;
    margin-top: 20px;
}

h2 {
    font-weight: 400;
    font-size: 24px;
    display: inline-block;
    color: #0f2d40;
    padding-bottom: 8px;
    padding-right: 15px;
    margin-top: 10px;
    border-bottom: 1px solid #ebebeb;
    line-height: 1.1;
}

h3 {
    font-weight: 600;
    font-size: 17px;
    display: block;
    color: #0f2d40;
    padding: 0;
    margin-top: 8px;
}

h4 {
    font-weight: 400;
    font-size: 17px;
    display: inline-block;
    color: #0f2d40;
    padding-bottom: 8px;
    padding-right: 15px;
    margin-top: 10px;
    border-bottom: 1px solid #ebebeb;
}

h5 {
    font-weight: 600;
    font-size: 17px;
    display: block;
    color: #179ca3;
    padding: 0;
    margin-top: 8px;
}

h6 {
    font-weight: 400;
    font-size: 17px;
    display: inline-block;
    color: #179ca3;
    padding-bottom: 8px;
    padding-right: 15px;
    margin-top: 10px;
    border-bottom: 1px solid #ebebeb;
}
blockquote {
    padding: 10px 20px 10px 40px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border: 1px solid #179ca3;
    position: relative;
    margin-top: 20px;
    clear: both;
}
blockquote:before {
    content: "\f10d";
    font-family: FontAwesome;
    color: #d2d2d2;
    position: absolute;
    font-size: 24px;
    top: 8px;
    left: 11px;
}
/*table*/
table {
    border-collapse: collapse;
    border-spacing: 0;
    background-color: transparent;
    width: 100%;
    max-width: 100%;
    /*margin-bottom: 20px;*/
    /*display: table-cell;*/
}
.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}
@media (max-width: 767px) {
    .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td,  .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
        white-space: nowrap;
    }
}
td, th {
    padding: 0;
}
th {
    text-align: left;
}
.table > tbody > tr > td {
    padding: 8px;
    border-top: 1px solid #ebebeb;
    font-size: 16px;
    border-left: 1px solid #ebebeb; }
.table > tbody > tr > td:last-of-type {
    border-right: 1px solid #ebebeb; }
.table > tbody > tr > th {
    padding: 8px;
    border-top: 1px solid #ebebeb;
    font-size: 16px;
    border-left: 1px solid #ebebeb; }
.table > tbody > tr > th:last-of-type {
    border-right: 1px solid #ebebeb; }
.table > tbody > tr:last-of-type {
    border-bottom: 1px solid #ebebeb; }
.table > thead {
    background-color: #f8f8f8; }
.table > thead:first-child > tr:first-child > td {
    border-top: 1px solid #ebebeb; }
.table > thead > tr > td {
    padding: 8px;
    border-top: 1px solid #ebebeb;
    font-size: 16px;
    border-left: 1px solid #ebebeb; }
.table > thead > tr > td:last-of-type {
    border-right: 1px solid #ebebeb; }
.table > thead > tr > th {
    padding: 8px;
    border-top: 1px solid #ebebeb;
    font-size: 16px;
    border-left: 1px solid #ebebeb; }
.table > thead > tr > th:last-of-type {
    border-right: 1px solid #ebebeb; }
.table > thead > tr:last-of-type {
    border-bottom: 2px solid #ebebeb; }
.table > tfoot > tr > td {
    padding: 8px;
    border-top: 1px solid #ebebeb;
    font-size: 16px;
    border-left: 1px solid #ebebeb; }
.table > tfoot > tr > td:last-of-type {
    border-right: 1px solid #ebebeb; }
.table > tfoot > tr > th {
    padding: 8px;
    border-top: 1px solid #ebebeb;
    font-size: 16px;
    border-left: 1px solid #ebebeb; }
.table > tfoot > tr > th:last-of-type {
    border-right: 1px solid #ebebeb; }
.table > tfoot > tr:last-of-type {
    border-bottom: 1px solid #ebebeb; }

table ul {
    padding-left: 12px !important; }
table ol {
    padding-left: 27px !important; }

/*home -- section that contains all page content*/
#home.scs ul {
    padding-left: 15px;
    margin-top: 17px;
    margin-bottom: 17px;
}
#home.scs ul li { /*indents second line of a li*/
    margin-bottom: 5px;
    text-indent: -1.4em;
    padding-left: 1.4em;
    text-align: left;
}
/* #home.scs ul li::before {
    content: '\f0c8';
    font-family: FontAwesome;
    margin-right: 8px;
    color: #8a97ac;
    font-size: 8px;
    position: relative;
    top: -2px;
} */
#home.scs ul li ul {
    margin-top: 5px;
    margin-bottom: 5px;
}
/* #home.scs ul li ul li::before {
    content: '\f096';
} */
#header{
    font-family: "Source Sans Pro", Helvetica, sans-serif;
    padding:0;
    position: relative;
    /*dark blue background covering header*/
    background-position: top;
    background-repeat: no-repeat;
    background-color: #0e4161;
    background-size: cover;
}
#header.scs{
    width: 100%;
    height: auto;
    margin-bottom: 15px; 
}
#header.scs .logo-bar { /*holds logo inside*/
    min-height: 117px;
    padding-top: 20px;
}
#header.scs .logo-bar .w3-row{
    margin-right: -15px;
    margin-left: -15px;
}
#header-logo{
    float:left;
}
@media (max-width: 992px){
    #header.scs .logo-bar .logo-wrap .logo {
        width: 236px;
        padding-top: 4px;
        display: inline-block;
    }
}
/* The sticky class is added to the header with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%
}
#HamburgerMenuIcon{ /*for top navbar*/
    color:white; /*white lines*/
    border: 1px solid #179ca3; /*green/blue border*/
    border-radius: 0;
    font-size:14pt;
    padding: 4px 8px;
    margin-bottom: 5px;
    margin-right: 10px;
    float:right; /*to right of screen*/
}
@media (max-width:992px){ /*just hamburger menu at this width, make div 100%*/
 #LargeDisplayMenu .topNav{ 
    width:100%;}   
}
.topNav{
    font-family: "Source Sans Pro", Helvetica, sans-serif;
    margin-bottom: -4px;
}
.topNav button{
    color: #ffffff; /*white text*/
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 1px; /*will change to 0px depending on screen size w/ media tag*/
    font-size: 16px;
}
.topLinks{ /*Visible links in the top navbar*/
    color: #ffffff; /*white*/
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 1px; /*will change to 0px depending on screen size w/ media tag*/
    font-size: 16px;
    padding: 15px 15px !important;
    line-height: 20px;
}
#LargeDisplayMenu .topNav > .topLinks:hover{ /*links without sublinks*/
    background-color: #1663a3 !important; 
}
#LargeDisplayMenu .topNav button:hover{/*links with sublinks*/
    background-color: #3e84bd !important;
}
#SmallDisplayMenu > a:hover{/*links without sublinks*/
    background-color: #1663a3 !important;
}
#SmallDisplayMenu button:hover{/*links with sublinks*/
    background-color: #3e84bd !important;
}
#LargeDisplayMenu .topNav > #HamburgerMenuIcon:hover{
    background-color:none !important;
}
/*COVID-19 Link */
.COVIDLink{ /*different background color*/
    background-color: #337ab7; /*lighter-dull blue*/
}
#SmallDisplayMenu .COVIDLink{ /*have different background appear on smalll menu but not 100% of screen*/
    width: 25% !important; /*can change back to 100% if it looks better*/
    margin: auto; /*center left & right*/
    text-align: center;
    display: inline-block;
    float: none;
}
#LargeDisplayMenu #JobSeekersTile:hover {
    color: #00477B !important;
    background-color: white !important;
}

#LargeDisplayMenu .JobSeekersTile:hover {
    color: white !important;
    background-color: white !important;
}

#SmallDisplayMenu #JobSeekersTile2:hover {
    color: #00477B !important;
    background-color: white !important;
}

#SmallDisplayMenu .JobSeekersTile:hover {
    color: white !important;
    background-color: white !important;
}
.COVIDLink:hover{
    background-color: #1663a3; /*darker blue on hover*/
}
.firstLink{
    background-color: rgba(15, 45, 64, 0.4) !important; /*background color of first link in each dropdown menu*/
    background-clip: content-box;
}
.w3-dropdown-content ul li:hover{
    background-color: #0f2d40 !important; /*dark blue*/
    background-clip: content-box; /*Don't change*/
}
.w3-dropdown-content a{
   color: white;
}
@media (max-width: 1040px){ /*Shrink letter spacing of each sublink at 1040px*/
    .w3-panel li a{
        letter-spacing: 0px;
    }
}
/*Each sublink text is wrapped in the following way: li a div div h3 */
/*This is so the text displays in the center, etc.*/
.top-level { /*first div*/
    display: table; /*don't change*/
    text-align: center;
    padding: 10px;
    border: 1px solid #0f2d40; /*Dark blue border around each link*/
    min-height: 100px; /* AMIRE Changed from 90 px on 3-16-23 to accomodate for 'Learning, Performance, and Culture & CPTP' and make all boxes the same height  */
    line-height: 1.2;
    width: 100%;
}
#stateEmployeesDropdown .top-level {
    min-height: 120px;
}
#HRProfessionalsDropdown .top-level {
    min-height: 120px;
}
.second-level{
    display: table-cell; /*Don't Change*/
    vertical-align: middle; /*Needed to center content vertically inside each box*/
}
.second-level h3{
    margin: 0;
    font-size: 16px;
    color: #ffffff; /*white*/
}
/*For menus w/ 3 subitems*/
#LargeDisplayMenu .Dropdown3 .w3-dropdown-content ul li {
    width: 33.3% !important;
}
/*Media tag for 3 subitems not needed now*/
/*For menus w/ 8 subitems*/
#LargeDisplayMenu .Dropdown8 .w3-dropdown-content ul li {
    width: 12.5% !important;
}
@media (max-width: 1490px){
    #LargeDisplayMenu .Dropdown8 .w3-dropdown-content ul li {
    width: 25% !important;}
}
/*For menus w/ 9 subitems*/
#LargeDisplayMenu .Dropdown9 .w3-dropdown-content ul li {
    width: 11.11% !important;
}
@media (max-width: 1490px){
    #LargeDisplayMenu .Dropdown9 .w3-dropdown-content ul li {
    width: 33.33% !important;}
}
/*For menus w/ 10 subitems*/
#LargeDisplayMenu .Dropdown10 .w3-dropdown-content ul li {
    width: 20% !important;
}
@media (max-width: 1110px){
    #LargeDisplayMenu .Dropdown10 .w3-dropdown-content ul li {
    width: 50% !important;}
}

#LargeDisplayMenu .w3-dropdown-hover{ /*houses links and sublinks*/
    position:inherit;
    float:left;
    display:block;
    margin:0;
    box-sizing: border-box;
    list-style: none;
    text-align: center;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
}
#LargeDisplayMenu .w3-dropdown-hover > a{ /*STATE EMPLOYEES, HR PROFESSIONALS, ABOUT US*/
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 16px;
    padding: 15px 15px 15px 15px;
    line-height: 20px;
    position: relative;
    display: block;
    cursor: pointer;
    text-decoration: none; /*no underline*/
    margin:0;
    box-sizing: border-box;
    list-style: none;
    text-align: center;
    letter-spacing: 1px;
}
@media (max-width:1030px){ /*decrease spacing in top links in header*/
   #LargeDisplayMenu .w3-dropdown-hover > a{
       letter-spacing: 0px;} 
}
#LargeDisplayMenu .w3-dropdown-content{ /*div containing sublinks*/
    /*most of these properties are copied from old css files and bootstrap props*/
    margin-top: -1px;
    opacity: 1; 
    width: 100%;
    background-color: #216aa7;
    border-radius: 0;
    -webkit-box-shadow: 0px 10px 17px 0px rgba(0, 0, 0, 0.375); /*may need for some browsers*/
    box-shadow: 0px 10px 17px 0px rgba(0, 0, 0, 0.375); /*shadow below the box*/
    border: none;
    padding: 0px;
    background-clip: padding-box;
    position: absolute;
    left: 0;
    z-index: 900; /*appear on top of everything else*/
    float: left;
    min-width: 160px;
    padding: 5px 0;
    /*margin: 2px 0 0;*/
    margin-top: -1px;
    font-size: 14px;
    text-align: left;
    list-style: none;
    line-height: 1.42857143;
    color: #333;
    box-sizing: border-box;
}
#LargeDisplayMenu .w3-dropdown-content ul{
    list-style-type: none;
    padding-left: 0;
    display: table; /*must keep*/
    table-layout: fixed;
    height: 100%;
    width: 100%;
    margin:0;
}
#LargeDisplayMenu .w3-dropdown-content ul li{
    padding: 10px;
    height: 100%;
    position: inherit;
    margin:0;
    width: 20% !important; /*overwritten depending on class for # of subitemsitems (ex. Dropdown10 = 10 subitems) */
    float: left;
    max-height: 50%;
    padding: 8px 10px !important; /*overwrite W3.CSS property*/
}
#LargeDisplayMenu .w3-dropdown-content ul li a{
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 1px;
    font-size: 16px;
    margin:0;
    text-decoration: none;
}
#SmallDisplayMenu{
    background-color: #0f2d40; /*dark blue*/
}
#SmallDisplayMenu .w3-dropdown-content{
    position:static; /*must keep*/
}
#SmallDisplayMenu .w3-panel{
    list-style: none; /*no bullets*/
    margin:0;
    padding:0 !important; /*take up whole screen*/
}
#SmallDisplayMenu li a{
    text-transform: uppercase;
    font-size: 16px;
    padding-left: 6px;
    padding-right: 6px;
    font-weight: 600;
}
#SmallDisplayMenu > div > a{
    font-size: 16px;
    display: block;
    width: 100% !important;
}
#SmallDisplayMenu > a{
    font-size: 16px;
}
@media (max-width: 992px){ /*take up whole screen w/these elements*/
    #SmallDisplayMenu > a{
        width: 100% !important;
        text-align: center;
    }
    #SmallDisplayMenu > div{
        width: 100% !important;
        text-align: center;
    }
    #SmallDisplayMenu div button{
        width: 100% !important;
        text-align: center;
    }
}
/*Font-sizes of li in navbar depending on screen size*/
@media (max-width: 1030px) {
    #LargeDisplayMenu button {
        letter-spacing: 0px; } }
@media (max-width: 949px) {
    #LargeDisplayMenu button {
        font-size: 14px;} }
@media (max-width: 865px) {
    #LargeDisplayMenu button {
        font-size: 11px; } }
@media (max-width: 767px) {
    #LargeDisplayMenu button {
        font-size: 16px;
        display: block; } }
@media (max-width: 1030px) { /*decrease spacing in top links in header*/
    .topLinks{
        letter-spacing: 0px; } }
@media (max-width: 949px) {
    .topLinks {
        font-size: 14px;} }
@media (max-width: 865px) {
    .topLinks {
        font-size: 11px; } }
@media (max-width: 767px) {
    .topLinks {
        font-size: 16px;
        display: block; } }


/*Side Navbar*/
#SideHamburgerMenuIcon{ /*Side navbar hamburger icon*/
    color:white; /*white lines*/
    background-color: #0f2d40; /*dark blue*/
    margin: 0 0 10px;
    border-radius: 0;
    font-size:14pt;
    padding: 4px 8px;
    margin-bottom: 5px;
    margin-right: 10px;
    float:right; /*to right of screen*/
}
/* #SideHamburgerMenuIcon:hover{
    background-color: #186da3; /*lighter blue*/
} */
.sideNav{
    padding: 0;
    border: 0;
}
.sideNav ul{
    list-style-type: none; /*no underline*/
    padding-left: 0;
    margin-bottom: 0;
}
.sideNav ul li.w3-bar-item{ /*rectangle for each item*/
    padding: 0;
    position: relative;
    background-color: #ebebeb; /*light gray*/
    margin-bottom: 5px;
    font-size: 15px;
    box-shadow: inset 0 0 0 0 #179ca3;
}
@media (max-width: 993px) { /*ensure one item per line*/
    .sideNav ul li.w3-bar-item {
        clear: both; }
}
.sideNav ul li.w3-bar-item:hover {
    background-color: #186da3; /*blue for hover*/  }

.sideNav ul li.w3-bar-item:hover a{
    color: #ffffff; /*change text to white on hover*/
}
.sideNav ul li.w3-bar-item a{
    color: #0f2d40; /*dark blue text*/
    display: block;
    padding: 12px 8px;
    letter-spacing: .03em;
    line-height: 1.1;
}

.side-menu { /*commission actions*/
    float: right;
    margin: 0 5px 10px 10px;
        margin-bottom: 10px;
    padding: 5px 0 5px 0;
        padding-left: 0px;
    list-style-type: none;
    text-align: left;
    background-color: #ebebeb;
    font-weight: bold;
    font-size: 15px;
    color: #fff;
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 2px 2px;
    font-weight: 500;
    font-size: 15px;
    max-width: 250px;
    -moz-box-shadow: inset 0 6px 10px -1px #333;
    -webkit-box-shadow: inset 0 6px 6px 6px #333;
    box-shadow: inset 0 2px 2px -1px #333;
}
.side-menu a {
    color: #333;
}
.side-menu li {
    padding: 10px 50px 10px 50px;
    margin: 0;
    cursor: pointer;
    border-top: solid 3px #fff;
    text-align: left;
}
.side-menu li:hover { background-color: #186da3; color: #fff; }

/*footer*/
#footer {
    height: 350px;
    background-color: #0f2d40; /*dark blue*/
    margin-top: 30px; /*space between top of footer and page content*/
}
#footer .footer-top {
    color: #ffffff; /*white*/
    text-align: center;
    padding: 16px;
    background-color: #0f2d40; /*dark blue*/
}
#footer .footer-top .txt {
    font-weight: 300;
    letter-spacing: .06em;
}
#footer .footer-top .txt strong {
    font-weight: 600;
}
#footerLogo{
    float:left;
}
@media (max-width: 993px){ /*all footer content goes into one column at this point due to W3.CSS, so float the logo to left of its container*/
    #footerLogo{
        float: left; } 
}
.footerheader {
    color: #8a97ac;
    font-family: Source Sans Pro;
    font-size: 18px;
    font-weight: 600;
    text-align: left;
}
.footertd {
    font-size: 15px;
    text-align: left;
}

#news .page-title h1 { /*news section wraps content on most pages*/
    font-weight: 400;
    font-size: 36px;
    letter-spacing: .03em;
    color: #0f2d40;
    border-bottom: 1px solid #8a97ac;
    padding-bottom: 9px;
    margin-bottom: 15px;
    display: block; }
@media (max-width: 767px) {
    #news .page-title h1 {
        margin-top: 2px; } }
#news .page-title h3 {
    color: #8a97ac;
    font-size: 24px; }
#news .head {
    font-weight: 400;
    font-size: 36px;
    letter-spacing: .03em;
    color: #0f2d40;
    border-bottom: 1px solid #179ca3;
    padding-bottom: 9px;
    margin-bottom: 15px;
    display: block; }
@media (max-width: 767px) {
    #news .head {
        margin-top: 2px; } }
#news .news-block {
    margin: 15px 0 0;
    border-bottom: 1px solid #8a97ac;
    padding: 0 0 15px; }
#news .news-block:after {
    content: '';
    display: table;
    clear: both; }
#news .news-block a:hover h2 {
    color: #179ca3; }
#news .news-block .box-title h2 {
    color: #0f2d40;
    font-weight: 300;
    margin-top: 10px; }
#news .news-block .box-title h4 {
    color: #0f2d40;
    font-weight: 300;
    font-size: 20px; }
#news .news-block .blurb {
    color: #0f2d40;
    font-size: 16px; }        
/*News Slider*/
#news-slider {
    margin-bottom: 15px;
    font-size: 14px;
    overflow: hidden;
}
#home.scs #services-section {
    margin-bottom: 15px;
    padding: 20px;}

/*alert 'X' */
.dismissAlert{
    font-size:30px;
    color: darkslategray;
}
/*Homepage Slider*/  
.wrap-slider{ /*div that wraps homepage slider*/
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    max-width: 1200px;
    margin: 0px auto;
    position: relative;
    text-align: right;
    overflow: hidden;
}    
.mySlides { /*all slides default to non-display*/
    display:none;
    width:100%;}
.activeSlide{ /*javascript adds this class to the active slide*/
    display:block;
    width:100%;
}

.slideIndex{
    max-width: 100%;
}
.dot {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color .6s ease
}

.active,
.dot:hover {
    background-color: #717171;
}
 .w3-display-left{ /*left arrow and shadow box*/
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 15%;
    font-size: 40px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
    background-color: rgba(0,0,0,0);
    opacity: .5; 
    background-image: linear-gradient(to right,rgba(0,0,0,.9) 0,rgba(0,0,0,.025) 100%);
    background-repeat: repeat-x;
    transform: none;
    font-weight: 1000;
    transition: .6s ease;
    display: table;
    height: 100%;
}
 .w3-display-right{ /*right arrow and shadow box*/
    right: 0;
    left: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 15%;
    font-size: 40px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
    background-color: rgba(0,0,0,0);
    opacity: .5;
    background-image: linear-gradient(to right,rgba(0,0,0,.025) 0,rgba(0,0,0,.9) 100%);
    background-repeat: repeat-x;
    transform: none;
    font-weight: 1000;
    transition: .6s ease;
    display: table;
    height: 100%;
}
.w3-display-left:hover,
.w3-display-right:hover {
    color: #f2f2f2;
    background-color: rgba(0, 0, 0, 0.8)
}
#news-slider .sub {
    width: 20%;
    margin: 43% 0% 0 0%;
    margin-top: 43%;
    float: left;
    text-align: left;
    position: relative;
    z-index: 800;
    cursor: pointer;
    padding: 0 5px;
    height: 175px;
    overflow: hidden;
    margin-top: 10px;
}
#news-slider span.th {
    width: 100%;
    float: left;
    text-align: left;
    position: relative;
    z-index: 800;
    cursor: pointer;
}
#news-slider .th img {
    position: relative;
    max-width: 100%;
    height: 175px !important;
}
#news-slider img{
    vertical-align: middle;
    border: 0;
}
#news-slider span.th .overlay {
    background-color: rgba(15, 45, 64, 0.9);
    width: 100%;
    height: 101%;
    position: absolute;
    top: 0;
    left: 0;
}
#news-slider .th .overlay {
    filter: brightness(90%);
    transition: all 0.5s ease-in-out;
}
#news-slider .sub + .sub span.th .overlay, #news-slider .sub + .sub + .sub + .sub span.th .overlay {
    background-color: rgba(22, 99, 163, 0.9);
}
#news-slider .sub + .sub + .sub span.th .overlay, #news-slider .sub + .sub + .sub + .sub + .sub span.th .overlay {
    background-color: rgba(15, 45, 64, 0.9);
}
#news-slider .th:hover .overlay, #news-slider .th.active .overlay {
    -webkit-filter: brightness(140%);
    -moz-filter: brightness(140%);
    -ms-filter: brightness(140%);
    -o-filter: brightness(140%);
    filter: brightness(140%); }
#news-slider .th h2 a {
    color: #ffffff;
}
#news-slider .th > [class*="title-"] {
    position: absolute;
    top: 0em;
    left: 0em;
    text-align: left;
    padding: 20px;
    opacity: 1;
    line-height: normal;
    overflow: hidden;
    transition: all 0.5s ease-in-out;}
#news-slider .th h2 {
    border:0;
    font-size: 28px;
    font-weight: 300;
    margin: .1em 0;
    border: none;
}
@media(max-width: 1199px){
    #news-slider .sub {
        height: 128px;}
    #news-slider .th h2 {
        font-size: 1.65em;
        line-height: 1em;}
}
@media(max-width: 991px){
    #news-slider .sub {
        height: 97px;}
    #news-slider .th h2 {
        font-size: 1.2em;
        line-height: 1em; }
    #news-slider .th > [class*="title-"] {
    padding: 10px;}
}
@media(max-width: 723px){
    #news-slider .sub {
        padding: 0 3px;}
    #news-slider .th > [class*="title-"] {
        padding: 10px;}
}
@media only screen and (max-width: 640px) {
    #news-slider .slider [class*='title-'] {
        display: none; }

    #news-slider .sub, #news-slider .sub:first-of-type, #news-slider .sub + .sub + .sub {
        width: 100%;
        margin: 0;
        padding: 0; }

    #news-slider .slider {
        display: none; }

    #news-slider span.first {
        display: none; }

    #news-slider span.th img {
        float: left;
        width: 100%; }

    #news-slider span#b-2:focus {
        opacity: 1; }

    #news-slider span#b-3:focus {
        opacity: 1; }

    #news-slider span#b-4:focus {
        opacity: 1; }

    #news-slider span#b-5:focus {
        opacity: 1; }

    #news-slider #control {
        display: block; }

    #news-slider #main {
        padding: 1% 0;
        width: 100%;
        margin-top: 29.2%;
        z-index: 10;
        position: absolute;
        text-align: center;
        background: rgba(0, 0, 0, 0.71); }

    #news-slider label.first {
        display: inline-block;
        margin-bottom: 0; }

    #news-slider .th > [class*='title-'] {
        padding: 15px; }

    #news-slider .th .date {
        font-size: 14px;
        line-height: 16px; }

    #news-slider .th h2 {
        font-size: 3.2em; }

    #news-slider .sub {
        max-height: 170px;
        height: auto; } }
@media only screen and (max-width: 480px) {
    #news-slider .th h2 {
        font-size: 2.5em; } 
}
@media only screen and (max-width: 380px) {
    #news-slider .th h2 {
        font-size: 1.8em; } 
}
#news-slider .th h2 a:hover {
    color: #8a97ac; }

#news-slider .sub:nth-of-type(2) .th h2 a:hover {
    color: #8a97ac;
}

.embed-responsive-16by9 {
    padding-bottom: 56.25% !important;
}
.embed-responsive {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    padding-bottom: 0px;
    overflow: hidden;
}
.embed-responsive-item {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/*Drop down for testing information page*/
.h-drop { cursor: pointer; color: #0662a2; overflow: hidden;  padding: 3px 0 3px 15px; margin-top: 20px; background: url('../images/icons/toggle-up.png') left no-repeat; }
li.h-drop { text-indent: 5px; }
.h-dropped { background: url('../images/icons/toggle-down.png') left no-repeat;
            font-weight: bold;  color: #0662a2; font-size: 1.1em;  border-bottom: solid 1px #0662a2; padding-left: 20px; }
.xdrop {
    font-size: small;
    color: #238fe8;
    cursor: pointer;
}
.pagerTD td table{
    width:15%;
}

.force-wrapper {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto -232px; }
  @media (max-width: 664px) {
    .force-wrapper {
      margin: 0 auto -251px; } }
  @media (max-width: 608px) {
    .force-wrapper {
      margin: 0 auto -271px; } }
  @media (max-width: 592px) {
    .force-wrapper {
      margin: 0 auto -291px; } }
  @media (max-width: 372px) {
    .force-wrapper {
      margin: 0 auto -311px; } }
  @media (max-width: 332px) {
    .force-wrapper {
      margin: 0 auto -351px; } }

.push {
  height: 232px; }
  .push2 {
  height: 360px; }
  @media (max-width: 664px) {
    .push {
      height: 251px; } }
  @media (max-width: 608px) {
    .push {
      height: 271px; } }
  @media (max-width: 592px) {
    .push {
      height: 291px; } }
  @media (max-width: 372px) {
    .push {
      height: 311px; } }
  @media (max-width: 332px) {
    .push {
      height: 351px; } }