@font-face {
    font-family: 'Work Sans';
    src: url('fonts/WorkSans/WorkSans-VariableFont_wght.woff2') format('woff2 supports variations'),
    url('fonts/WorkSans/WorkSans-VariableFont_wght.woff2') format('woff2-variations'),
        url('fonts/WorkSans/WorkSans-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('fonts/WorkSans/WorkSans-Italic-VariableFont_wght.woff2') format('woff2 supports variations'),
    url('fonts/WorkSans/WorkSans-Italic-VariableFont_wght.woff2') format('woff2-variations'),
        url('fonts/WorkSans/WorkSans-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('fonts/PublicSans/PublicSans-VariableFont_wght.woff2') format('woff2 supports variations'),
    url('fonts/PublicSans/PublicSans-VariableFont_wght.woff2') format('woff2-variations'),
        url('fonts/PublicSans/PublicSans-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('fonts/PublicSans/PublicSans-Italic-VariableFont_wght.woff2') format('woff2 supports variations'),
    url('fonts/PublicSans/PublicSans-Italic-VariableFont_wght.woff2') format('woff2-variations'),
        url('fonts/PublicSans/PublicSans-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}

body {background: #fafafa; color:#000; font-family:"Public Sans",Arial, sans-serif; font-weight: 400;}



#header {background:#707070; height:55px;}

p, a {font-family:"Public Sans", Arial, sans-serif;}
p {font-size: 0.875rem;}

a {font-weight:800; color: #992a28;}

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

a.skip-to-content-link {
  background: #992a28;
  color:#fff;
  height: 40px;
  left: 0%;
  padding: 8px 8px 12px;
  position: absolute;
  transform: translateY(-100%);
  transition: transform 0.3s;
}

.skip-to-content-link:focus {
  transform: translateY(0%);
}

h1, h2, h3, h4, h5, h6, nav {font-family:"Work Sans",Arial, sans-serif;}
h1 {font-weight: 800; font-size: clamp(2.75rem, 6vw, 4rem);}
h1, h2 {text-align: center;}
h2 {font-size: clamp(1.25rem, 3vw, 1.75rem);}
h3 {font-weight: 800; font-size: clamp(1.25rem, 2vw, 1.7rem);}

  .spacer-20 {margin-top:20px;}
  .spacer-40 {margin-top:40px;}
  .spacer-60 {margin-top:60px;}
  .spacer-80 {margin-top:80px;}
  .spacer-100 {margin-top:100px;}
  .spacer-150 {margin-top:150px;}
  .spacer-200 {margin-top:200px;}
  .spacer-250 {margin-top:250px;}

.search-callout {
    border: 5px dotted #992a28;
    padding: 1rem 1rem 0;
}


.button, .button:disabled, .button:disabled:hover {
  color:#ffffff; background-color: #992a28;
}

.button:hover, .button:focus {
  text-decoration: underline; background-color: #770825;
}

.nav-container {display:flex; justify-content: space-between; padding:15px 40px;}

nav a {
/*    margin: 17px 20px 5px 5px;*/
font-family:"Work Sans",Arial, sans-serif;
text-decoration: none;
border-bottom: 1px dotted transparent;
padding-bottom:1px;
    color: #fff;
    background: transparent;
    text-transform: uppercase;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.5px;
    box-sizing: border-box;

}

nav a:hover, nav a:focus {
	color:#fff;

}
nav.logo {display:flex; justify-content: flex-start; color: #fff; font-weight: bold; font-size: 16px;
  text-transform: uppercase;     letter-spacing: 0.5px;
    box-sizing: border-box;

}
nav.menus {display:flex; justify-content: flex-end;}

nav.menus a {justify-content: space-between; margin-left:25px;}

.b-logo {max-width:65px; margin:-10px 10px 0 0; }


#footer {background:#000; width:100%; height:35px; position:fixed; bottom:0; color:#fff; font-size: 12px; font-weight:bold; padding-top:8px;text-align:center; box-sizing:border-box; }



label#formLabel {color: #000; font-weight: 800;}
label#filterLabel {color: #000; font-weight: 800;}

.flex-input {display: flex; justify-items: space-between;}

[type=text] {
  background-color: #fff;
}
	table {width:100%; table-layout: fixed; max-width: 1200px;  margin-bottom:80px;}
	
  


  thead {
 background:#f0ead2; color:#000;
}

thead th {text-align:center; padding:1% 2%; line-height: 1.4; border-right: 2px solid #fff; font-weight: 800; font-size:0.8rem;}

thead th:last-child {border-right: none;}
tbody {
  background-color: #fff;
}
tbody td {color:#000; padding:1% 2%; line-height: 1.4; font-weight: 400;}

tbody tr:nth-child(even) {
    border-bottom: 0;
    background-color: #e8f0;
}

ul li span {font-weight: 400;}

input#user-input{
    display: block;
    -webkit-box-sizing: border-box;
    width: 100%;
    height: 2.4375rem;
    margin: 0 0.3rem 1rem;
    padding: 0.5rem;
    border: 1px solid #cacaca;
    border-radius: 0;
    background-color: #fff;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
    font-family: inherit;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.5;
    color: #000;
    -webkit-transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


input#user-input:focus {
        outline: none;
    border: 1px solid #8a8a8a;
    background-color: #fefefe;
    -webkit-box-shadow: 0 0 5px #cacaca;
    box-shadow: 0 0 5px #cacaca;
    -webkit-transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
}

    .desktop-hide {display:none;}
.mobile-hide {display:block;}


@media screen and (max-width:600px) {
    .mobile-hide {display:none;}
        .desktop-hide {display:block;}



}