html, body {
    width: 100%;
    margin: 0;
    font-family: 'Open Sans', Arial, sans-serif !important;
    font-size: 1rem;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("/css/fontawesome6/images/angle-down-solid.png");
    background-repeat: no-repeat;
    background-position: right;
    background-size: 1rem 1rem;
    background-color: white;
    padding-right: 1rem;
    padding-left: 0.125rem;
    text-overflow: ellipsis;
    overflow: hidden;
}

input[type="text"],
input[type="number"],
input[type="password"],
select,
textarea {
    border: 1px solid black;
}

#toaster {
    font-family: Initial;
}

#sitewrap {
    margin: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    position: relative;
}

#sitewrap.home {
    background-color: rgb(16, 42, 88);
}

.template {
    padding-bottom: 30px;
    width: 100%;
    max-width: 2000px;
    margin: auto;
}

.home {
    background-color: rgb(16, 42, 88);
    color: white;
}

.padded {
    padding-left: 30px;
    padding-right: 30px;
    width: calc(100% - 60px);
}

.padded.template.small {
    padding-top: 30px; 
    width: 40%; 
    min-width: 300px; 
    max-width: 550px; 
    margin:1rem auto;
}

data-form.small {
    width:40%; 
    margin: 1rem auto;
}

#slideFrame {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

#slides {
    width: 100%;
    height: 630px;
    background-color: rgb(240, 240, 240);
    border-bottom: 1px solid black;
    position: relative;
    overflow: hidden;
}

.slide {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
    transition: all 0.5s;
    opacity: 1;
    visibility: visible;
    position: absolute;
    user-select: none;
    -webkit-user-select: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

.slide.transition {
    opacity: 0;
    visibility: hidden;
}

.slideCtrl {
    font-size: 40px;
    color: rgba(0, 0, 0, 0.3);
    position: absolute;
    z-index: 998;
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 40px;
    border: 1px solid rgba(255, 255, 255, 0.3)
}

.slideCtrl:hover {
    cursor: pointer;
    color: rgba(0, 0, 0, 1);
    background-color: rgba(255, 255, 255, 1);
}

.slideCtrl:first-of-type {
    left: 5px;
}

.slideCtrl:last-of-type {
    right: 5px;
}

.slideText {
    font-size: 60px;
    color: white;
    text-shadow: 1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black;
    text-align: center;
    max-width: calc(100% - 100px);
    margin: 0;
}

.slideLink {
    font-size: 30px;
    padding: 10px 15px;
    background-color: rgb(240, 240, 240);
    border: 2px solid #102a58;
    border-radius: 10px;
    color: #102a58;
    text-decoration: none;
    text-align: center;
    max-width: calc(100% - 150px);
    margin-top: 1.25rem;
}

.slideLink:hover {
    background-color: white;
    cursor: pointer;
}

.slideSubtext {
    font-size: 30px;
    color: white;
    text-shadow: 1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black;
    text-decoration: none;
}

.hide, .hidden {
    display: none !important;
}

#postFrame {
    width: 80%;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
}

#postHead {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#postTitle {
    font-size: 50px;
    margin: 5px 0;
    width: 100%;
    text-align: center;
}

#postSubHead {
    width: 60%;
    margin: 0 auto;
    text-align: left;
    display: flex;
    column-gap: 5px;
    align-items: center;
    justify-content: center;
}

#featuredImg {
    max-width: 100%;
}

#postBody meta-tag {
	display: none;
}

#contactUs {
    width: calc(100% - 2rem);
    max-width: 2000px;
    display: flex;
    align-items: flex-start;
    flex: 1;
    flex-wrap: wrap;
    margin: auto;
    padding: 0 1rem;
    gap: 1rem;
}

#contactUs h3 {
    margin-top: 0px;
}

#contactUs > div {
    flex-grow: 1;
}

#contactUs > div#contactForm {
    display: flex;
    flex-direction: column;
    row-gap: 0.5rem;
    font-size: 20px;
    max-width: 550px;
    width: calc(100% - 60px);
    margin: 0 auto;
}

#contactForm > div {
    display: flex;
    flex-direction: column;
    row-gap: 0.5rem;
    width: 100%;
}

#contactForm > div > .field {
    position: relative;
    display: flex;
    justify-content: stretch;
    width: 100%;
}

#contactForm > div input[type="text"] {
    font-size: 1rem;
    outline-width: 0px;
    height: 2rem;
    flex: 1 1 0%;
}

#contactForm textarea {
    font-size: 1rem;
    max-width: 100%;
    outline-width: 0px;
}

#contactForm > div#contactSubmit {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: flex-start;
    flex-direction: row;
}

#contactForm > #contactSubmit > #contactUsMsg {
    color: white;
    margin-top: 0;
    font-size: 1rem;
    flex: 1 1 auto;
}

#footer {
    width: 100%;
    position: relative;
    bottom: 0px;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background-color: rgb(16, 42, 88);
    padding-top: 1rem;
}

#footer a,
#consent-link {
    color: #2EA3F2;
}

#footerBar {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
    background-color: rgba(0, 0, 0, 0.9);
    color: rgba(255, 255, 255, 0.8);
    flex-wrap: wrap;
}

#footerBar a,
#consent-link {
    text-decoration: none;
    font-weight: bold;
}

#footerBar a:hover,
#consent-link:hover {
    color: #238acf;
    cursor: pointer;
}

#footerSCE {
    display: flex;
    align-items: center;
    column-gap: 1rem;
    flex-wrap: wrap;
    text-align: center;
}

#footerSCE p {
    display: inline-block;
    margin: 2px 0px;
    font-size: 20px;
    flex-grow: 1;
}

#footerSocials {
    font-size: 40px;
    width: 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#addrs {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background-color: rgb(35, 35, 35);
    flex-wrap: wrap;
    padding: 0.5rem 0;
    row-gap: 1rem;
}

#addrs > div {
    padding: 0 1rem;
}

#addrs p {
    margin: 4px 0;
}

#addrs p:last-of-type {
    margin-bottom: 0px;
}

#header {
    background-color: rgb(16, 42, 88);
    color: white;
    padding: 2rem 0.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: 0.25rem;
}

#header > div {
    flex-grow: 1;
}

#header .menuLink {
    text-decoration: none;
    color: white;
}

#header .menuLink:hover {
    color: rgb(230, 230, 230);
}

#top_menu {
    max-width: 100%;
    color: inherit;
    background-color: inherit;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 30px;
}

.menuFrame {
    background-color: inherit;
    color: inherit;
    user-select: none;
    -webkit-user-select: none;
}

.menuFrame img {
	max-width: 200px;
	max-height: 200px;
}

#top_menu > .menuFrame {
    display: flex;
    column-gap: 30px;
}

#head_social_menu {
    max-width: 100%;
    display: flex;
    align-items: center;
    color: inherit;
    background-color: inherit;
}

#head_social_menu > .menuFrame {
    display: flex;
    column-gap: 30px;
    align-items: center;
}

#head_social_menu > .menuFrame > *:first-child {
    margin-left: 30px;
}

#head_social_menu .fa-phone {
    font-size: 14px;
}

#head_social_menu .fa-brands {
    font-size: 1.5rem;
}

#pf_link {
    color: white;
    white-space: nowrap;
}

#head-search {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    column-gap: 3rem;
    row-gap: 1rem;
}

#siteSearchWrap {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 500px;
    margin-left: 50px;
    margin-right: 2px;
    flex-grow: 1;
}

#siteSearchWrap > #siteSearchBar {
    font-size: 18px;
    width: 100%;
    height: 2rem;
    padding: 2px 38px 2px 2px;
    outline-width: 0;
    border: 1px solid black;
}

#searchBtn {
    position: absolute;
    color: black;
    font-size: 20px;
    border-left: 1px solid black;
    right: 0;
    width: 35px;
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(230, 230, 230);
}

#searchBtn:hover {
    cursor: pointer;
    background-color: rgb(240, 240, 240);
}

#searchBtn:active {
    background-color: rgb(200, 200, 200);
}

#siteSearchBar:focus ~ #searchBtn {
    right: 2px;
    width: 33px;
    height: 34px;
}

#siteSearchBar:focus ~ #searchBtn > i {
    padding-left: 2px;
}

#docSearch {
    display: flex;
    flex-direction: column;
}

#docSearch > a {
    padding: 1rem 0;
    width: 100%;
    border-bottom: 1px solid black;
    text-decoration: none;
    color: black;
}

#docSearch > a:hover {
    background-color: rgb(245, 245, 245);
}

#vidResults {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(321px, 1fr));
    gap: 1rem;
}

#postResults {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}

#postResults > p {
    grid-column: 1 / -1;
}

#postResults > a {
    text-decoration: none;
}

#postResults > a > div {
    border: 1px solid black;
    border-radius: 0.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    text-align: center;
    height: 100%;
    overflow: hidden;
}

#postResults .img-search-wrap {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

#postResults img {
    max-width: 100%;
}

#postResults > a p {
    background-color: #102a58;
    color: white;
    width: 100%;
    margin: 0;
    padding: 1rem 0;
}

.showMore {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
    width: min-content;
    white-space: nowrap;
    padding: 1rem 0;
}

#head_banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid black;
    background-color: rgb(241, 241, 241);
    flex-wrap: wrap;
	position: relative;
}

#head_banner > #banner_background {
	position: absolute;
	z-index: 0;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-image: url("/images/amflag-fade-crop.jpg");
	background-repeat: no-repeat;
	background-size: 70%;
	background-position: 100%;
	mask-image: linear-gradient(to right, transparent, 70%, white);
}

#head_banner a {
    text-decoration: none;
    color: black;
}

#mainImgWrap {
    display: flex;
    padding: 30px;
    height: 90px;
    margin: auto;
	position: relative;
	z-index: 1;
}

#mainImgWrap a {
    display: contents;
}

#mainImgWrap img {
    height: 100%;
    width: auto;
}

.menu-icon {
    font-size: 1.75rem;
}

#head_banner > #main_menu {
    flex-grow: 1;
    color: black;
    max-width: 100%;
    min-width: 4rem;
    text-align: center;
    position: relative;
	z-index: 9998;
}

#main_menu > .menuFrame {
    display: flex;
    align-items: center;
    column-gap: 30px;
    color: black;
	background-color: rgba(0, 0, 0, 0);
}

#main_menu > .menuFrame > * {
    padding: 10px 0px;
}

#main_menu > .menuFrame > *:first-child {
    margin-left: auto;
}

#main_menu > .menuFrame > *:last-child {
    margin-right: 30px;
}

#main_menu > .mobile.menuFrame {
    flex-direction: column;
    align-items: flex-start;
    height: fit-content;
    background-color: rgb(250, 250, 250);
    color: inherit;
    position: absolute;
    padding: 1rem;
    z-index: 999;
    top: 74px;
    left: 10%;
    right: 10%;
    border: 1px solid black;
    border-radius: 0 0 1rem 1rem;
}

#main_menu > .mobile.menuFrame > *:first-child {
    margin-left: 0;
}

#main_menu .dropdownMenu {
	background-color: rgb(250, 250, 250);
	border-top: 1px solid black;
}

#mobile_main_menu,
#mobile_cust_menu {
    margin: 15px calc(50vw - 40px);
    padding: 0.5rem;
}

.menuLink {
    cursor: pointer;
    white-space: nowrap;
}

#prod_menu {
    max-width: 100%;
    color: black;
    background-color: white;
    border-bottom: 1px solid black;
    text-align: center;
}

#prod_menu > .menuFrame {
    display: flex;
    justify-content: space-around;
    align-items: center;
	max-width: 2000px;
	margin: auto;
}

#prod_menu > .menuFrame > a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    text-decoration: none;
    color: black;
    margin-bottom: 10px;
}

#prod_menu > .menuFrame > a > div {
    width: 200px;
}

#cust_menu {
    max-width: 100%;
    width: 100%;
    color: white;
    background-color: #102a58;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
}

#preview_menu {
    margin-bottom: 10rem;
}

#cust_menu > .menuFrame {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

#cust_menu > .mobile.menuFrame {
    flex-direction: column;
    align-items: center;
    height: fit-content;
    background-color: #102a58;
    position: absolute;
    padding: 1rem;
    z-index: 998;
    top: 74px;
    left: 10%;
    right: 10%;
    border: 1px solid black;
    border-top: none;
    border-radius: 0 0 1rem 1rem;
}

#cust_menu > .menuFrame > a,
#cust_menu > .menuFrame > div {
    color: white;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.25rem;
    padding: 1rem 0;
}

#cust_menu a.currentPage {
    color: #0ea3f2;
}

.menuSearch {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: relative;
}

.siteSearch {
    width: 250px;
    padding-right: 42px;
    height: 40px;
    outline-width: 0;
}

.searchWrap {
    position: absolute;
    display: flex;
    flex-wrap: nowrap;
    column-gap: 5px;
    padding: 0px 5px 5px;
    border: 1px solid black;
    border-top: none;
    border-radius: 0px 0px 5px 5px;
    background-color: white;
    top: 100%;
    right: -5px;
    align-items: center;
}

.menuSearchBtn {
    height: 44px;
    width: 43px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 6px;
    border-left: 1px solid black;
    background-color: white;
}

.menuSearchBtn:hover {
    background-color: rgb(240, 240, 240);
}

.menuSearchBtn:active {
    color: white;
    background-color: rgb(50, 50, 50);
}

.dropdown {
    cursor: pointer;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
    white-space: nowrap;
    background-color: inherit;
    color: inherit;
}

.dropdown > .fa-angle-down {
    margin-left: 10px;
}

.break {
    flex-basis: 100%;
    height: 0;
}

.dropdownMenu {
    position: absolute;
    background-color: inherit;
    color: inherit;
    top: 100%;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 999;
    border: 1px solid gray;
    border-top: none;
    text-align: left;
}

.dropdownMenu > .dropdownItem {
    color: inherit;
    font-weight: normal;
    display: block;
    white-space: nowrap;
    padding: 10px;
    width: calc(100% - 20px);
    border-bottom: 1px solid black;
}

.dropdownItem:last-child {
    border-bottom: none;
}

#contactUs > #facilities {
    display: grid;
    margin: 0 auto;
    grid-template-columns: 1fr;
    min-width: 320px;
    max-width: 640px;
}

#postLists {
    display: flex;
    flex-direction: column;
}

#postLists > div {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.postList {
    width: calc(100% - 60px);
    margin: auto 30px;
    padding: 30px 0px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 2px solid white;
    gap: 2rem;
}

.feedBottom {
    border-bottom: 2px solid white;
}

.post_blurb {
    width: 100%;
    min-width: 320px;
    font-size: 14px;
    cursor: pointer;
}

.post_blurb > div {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.post_blurb > div:first-child {
    overflow: hidden;
    height: 260px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(240, 240, 240);
}

.post_blurb > div:last-child {
    width: calc(100% - 40px);
    height: 250px;
    padding: 20px;
    background-color: white;
    color: black;
}

.post_blurb > div > img {
    max-height: 100%;
	max-width: 100%;
}

.post_title, .post_body {
    margin: 0;
}

.post_title {
    font-size: 24px;
}

.post_body {
    flex-grow: 1;
    overflow: hidden;
    line-height: 2em;
}

.srchSuggestions {
    width: calc(100% - 37px);
    position: absolute;
    top: 38px;
    left: 0;
    background-color: white;
    border: 1px solid black;
    border-top: none;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    color: black;
}

.srchSuggestions > .suggestRow {
    width: 100%;
    height: 50px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    cursor: pointer;
    border-bottom: 1px solid black;
    column-gap: 1px;
}

.suggestRow:last-child {
    border-bottom: 0px;
}

.srchSuggestions > .suggestRow:hover {
    background-color: rgb(240, 240, 240);
}

.srchSuggestions img {
    max-height: 100%;
    max-width: 100%;
}

.suggestRow > .imgWrap {
    height: 50px;
    width: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.suggestRow > p {
    user-select: none;
    -webkit-user-select: none;
    flex-grow: 1;
}

.srchSuggestions .cad-link {
    font-size: 30px;
    padding: 8px;
    color: black;
}

#searchResults,
#pl_items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 2rem;
    padding: 2rem;
    text-align: center;
}

#pl_items {
    padding: 2rem 0 0;
}

#searchResults > div,
#pl_items > div,
#pl_items > a {
    border: 1px solid black;
    border-radius: 4px;
    min-width: 250px;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
    transition: box-shadow 0.15s;
}

#searchResults > div:hover,
#pl_items > div:hover,
#pl_items > a:hover {
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.4);
}

#searchResults > div > a,
#pl_items > div > a,
#pl_items > a {
    text-decoration: none;
    font-size: 14px;
}

#pl_items > a > div {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#pl_items > a > div > img {
    max-width: calc(100% - 1rem);
    margin: 1rem;
}

#searchResults > div p.prod-pn,
#pl_items > div p.prod-pn,
#pl_items > a > div > p {
    margin: 0;
    padding: 16px 0px;
    color: white;
    background-color: #102a58;
    font-size: 16px;
}

#pl_items > a > div > p {
	padding: 16px 2px;
	height: 4rem;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

#searchResults > div p,
#pl_items > div p {
    margin: 12px 4px;
    color: black;
}

.breadcrumbs {
    width: calc(100% - 2rem);
    margin: 1rem;
    display: flex;
    flex-wrap: wrap;
    row-gap: 1rem;
}

.breadcrumbs > a,
.breadcrumbs > span {
    color: #102a58;
    white-space: nowrap;
    max-width: 240px;
    overflow-x: hidden;
    text-overflow: ellipsis;
}

.breadcrumbs > .spacer {
    margin: 0 1rem;
}

.prod-thumb-wrap {
    height: 200px;
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
}

.prod-thumb-wrap img {
	max-width: 100%;
	max-height: 100%;
}

#pageSlide {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    user-select: none;
    -webkit-user-select: none;
    padding: 0 10px;
}

.slideLabel {
    font-size: 24px;
    margin: 12px 5px;
    text-align: center;
}

#pageSlider {
    flex: 1;
    max-width: 300px;
    cursor: pointer;
    accent-color: #102a58;
}

.pageBtn {
    border: 2px solid #102a58;
    border-radius: 6px;
    display: flex;
    height: 36px;
    width: 36px;
    font-size: 24px;
    align-items: center;
    justify-content: center;
    margin: auto 0;
    color: #102a58;
    background-color: rgb(240, 240, 240);
}

.pageBtn:hover {
    cursor: pointer;
    background-color: white;
}

.pageBtn:active {
    border-width: 1px;
    margin: auto 1px;
    font-size: 22px;
}

#slideValue {
    text-align: center;
    width: 50px;
    font-size: 24px;
    margin: 10px calc(50% - 25px);
}

.noResultMsg {
    font-size: 20px;
    text-align: center;
}

.bold {
    font-weight: bold;
}

.altText {
    color: white;
    text-align: left;
    padding: 0px 8px;
    background-color: #102a58;
    margin-top: 4px;
}

.altText ul {
    list-style: none;
    margin: 0;
    padding: 0 0 4px;
}

.altText a {
    color: rgb(0, 175, 255);
    width: 100%;
    display: block;
    padding: 0.5rem 0;
}

.altText a:hover {
    color: white;
    background-color: #204991;
}

#titleWrap {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background-image: linear-gradient(to bottom, #ccc, #999);
}

#titleWrap > h1 {
    margin: 0.5rem auto 0.5rem 7.5%;
    padding: 0.5rem 32px; 
    max-width: 85%;
    min-width: 200px;
    background-color: #102a58;
    color: white;
    border-radius: 4px;
    font-weight: normal;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 24px;
    text-align: center;
}

#catalog-request {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    column-gap: 1rem;
    width: 100%;
}

#catalog-request > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 1rem;
    width: 45%;
}

#catalog-request input[type="text"] {
    height: 2rem;
    border: 1px solid black;
    border-radius: 0.5rem;
    width: calc(100% - 10px);
    font-size: 1.25rem;
    padding: 1px 0.25rem;
}

.form-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1rem;
}

.uni-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 1.5rem;
    padding: 1.5rem;
    text-align: center;
}

.lit-link {
    padding: 1rem;
    color: white;
    background-color: #102a58;
    text-decoration: none;
    overflow-x: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.lit-link:hover {
    background-color: #355386;
}

.bordered-text {
    color: black;
    text-shadow: 1px 1px rgba(255, 255, 255, 0.3), -1px 1px rgba(255, 255, 255, 0.3), 1px -1px rgba(255, 255, 255, 0.3), -1px -1px rgba(255, 255, 255, 0.3);
}

#colors-wrap {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    padding: 10px;
    display: flex;
    justify-content: center;
    width: calc(100% - 20px);
}

#colorNote {
    width: 100%;
    border: 1px solid rgb(255, 75, 55);
    background-color: rgb(255, 200, 194);
    color: darkred;
    font-size: 1.5rem;
}

#colors-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.colorOption {
    height: 9rem;
    width: 9rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border: 2px solid white;
}

.colorOption > p {
    margin: 0.25rem 0;
    padding-left: 0.125rem;
    font-size: 1rem;
    height: 1.5rem;
    user-select: none;
    -webkit-user-select: none;
    white-space: nowrap;
	font-weight: bold;
}

.colorOption:hover {
    cursor: pointer;
    transform: scale(1.2);
    border-radius: 4px;
}

.colorOption:active {
    background-image: url(/images/enc_swatch_w.png);
    background-size: cover;
}

.colorOption:active > p {
    color: transparent !important;
    text-shadow: none !important;
}

.section {
    width: 80%;
    margin: auto;
}

#guide-wrap {
    display: flex;
    align-items: center;
}

#guide-wrap > div {
    width: 50%;
}

#guide-wrap img {
    max-width: 100%;
    max-height: 100%;
}

div.form-input {
    padding: 0.25rem 0;
    width: 100%;
}

.form-input input[type="text"],
.form-input input[type="password"] {
    height: 2rem;
    border: 1px solid black;
    border-radius: 0.5rem;
    font-size: 1.25rem;
    padding: 2px 0.25rem;
    width: calc(100% - 10px);
}

.form-input select {
    padding: 5px 0;
    width: 100%;
    cursor: pointer;
    font-size: 1.25rem;
}

.form-input select#country {
    font-size: 1rem;
    width: 100%;
}

.form-input textarea {
    width: calc(100% - 6px);
    height: 5rem;
    font-size: 1.25rem;
}

.form-input.login-form {
    position: relative;
    width: 100%;
}

.form-input.login-form input[type="text"],
.form-input.login-form input[type="password"] {
    width: calc(100% - 10px);
}

.form-input.login-form input.icon-right,
.form-input.icon input.icon-right {
    padding-right: 42px;
    width: calc(100% - 48px);
}

.form-input.icon {
    position: relative;
}

.form-btns {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

#billToForm .form-input,
#newShipAddr .form-input {
    width: 310px;
}

#billToForm .form-input input[type="text"],
#newShipAddr .form-input input[type="text"] {
    width: calc(100% - 10px);
}

.pw-icon,
.pw-icon.fa-eye {
    font-size: 2rem;
    position: absolute;
    right: 4px;
    top: 4px;
    cursor: pointer;
    color: gray;
}

.pw-icon.fa-eye-slash {
    right: 2px;
}

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

.centered-text {
    text-align: center;
}

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

.strike {
    text-decoration: line-through;
    text-decoration-color: red;
}

.bold {
    font-weight: bold;
}

.italics {
    font-style: italic;
}

.underline {
    text-decoration: underline;
}

#indStand-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1rem;
    padding: 1rem 0;
}

.indstand-item {
    display: flex;
    flex-direction: column;
}

.indstand-item p {
    margin: 0;
    white-space: nowrap;
}

#manual-wrap {
    margin: 1rem auto;
}

accordion-div {
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
}

accordion-div:not(:defined) {
    height: 3.5rem;
    opacity: 0;
}

.loading {
    display: none;
}

#therm_calc_wrap {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.thermal_calc_block {
    width: 95%;
}

.therm_calc_form {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.therm_calc_form .form-input {
    margin: 0.25rem 0;
    width: fit-content;
}

#therm_calc_totals {
    display: flex;
    align-items: flex-start;
    justify-content: space-around;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

.thermal_calc_row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
}

.form-module {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.form-module p {
    margin: 0;
}

.form-module.gap {
    margin: 1rem;
}

.thermal_calc_centered {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#therm_calc_wrap input[type="number"] {
    height: 1.5rem;
    width: 4rem;
    padding: 2px;
}

#therm_calc_wrap select {
    height: 2rem;
    font-size: 1rem;
}

#therm_calc_wrap input[type="radio"],
#therm_calc_wrap input[type="checkbox"] {
    height: 1.5rem;
    width: 1.5rem;
    margin: 3px;
}

.checkDiv {
    display: flex;
    align-items: center;
}

.fixed_menu {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: white;
    border: 1px solid black;
    z-index: 999;
}

.bom-table {
    width: calc(100% - 1rem);
    border: 1px solid black;
    text-align: center;
    margin: auto;
    border-collapse: collapse;
}

.bom-table thead {
    background-color: #102a58;
    color: white;
    box-sizing: border-box;
}

.bom-message {
    text-align: center;
    padding: 1rem;
    width: calc(100% - 2rem);
}

.bom-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
}

.prod-btn {
    background-color: #102a58;
    color: white;
    padding: 1rem;
    white-space: nowrap;
    border-radius: 0.5rem;
}

.prod-btn:hover {
    background-color: #081734;
    cursor: pointer;
}

.prod-btn:active {
    background-color: #16366d;
}

#vid_library {
    border: 1px solid black;
    border-radius: 1rem;
    width: calc(100% - 4rem);
    gap: 1rem;
    padding: 1rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(321px, 1fr));
    margin: 1rem auto;
}

.vid_wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.career_header {
    color: rgb(26, 26, 26);
    padding-bottom: 1rem;
    border-bottom: 2px solid gray;
}

#career_list {
    max-width: 1000px;
    margin: auto;
}

#career_list .ck-content p {
    margin: 0;
}

#career_vid {
    max-width: 1080px;
    margin: auto;
	text-align: center;
}

#career_vid.show_vid {
	aspect-ratio: 2;
}

#career_vid > iframe {
    width: 100%;
    height: 100%;
}

.mobile-job-title {
    display: none;
}

.apply_link {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 3rem;
    margin-bottom: 1rem;
}

.nextWrap {
    height: 39px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    grid-column: 1 / -1;
}

.nextWrap.first {
    flex-direction: row-reverse;
}

#work_app {
    padding: 2rem 0;
}

#work-app-short-answer .work-app-form {
    grid-template-columns: 1fr;
}

#work-app-short-answer textarea {
    resize: vertical;
}

.work-app-form {
    display: grid;
    gap: 1rem;
    padding-top: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.work-app-form .field {
    width: 100%;
}

.work-app-form input[type="text"] {
    height: calc(2rem + 2px);
    width: calc(100% - 6px);
    padding: 1px 2px;
    line-height: 1rem;
}

.work-app-form select {
    width: 100%;
}

.work-app-form > h3 {
    text-align: center;
    grid-column: 1 / -1;
}

.work-app-form > div.input_wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
    gap: 0.5rem;
}

.work-app-form > div.input_wrap > p {
    margin: 0;
}

.work-app-form > div.input_wrap > input[type="date"] {
    height: 34px;
}

.work-app-form > div.input_wrap > input[type="checkbox"] {
    height: 2rem;
    width: 2rem;
}

.work-app-form #mil_duties_wrap {
    min-height: 4rem;
    grid-column: 1 / -1;
}

.work-app-form #mil_duties_wrap #mil_duties {
    height: calc(100% - 6px);
    width: calc(100% - 6px);
    font-size: 1rem;
    resize: vertical;
}

.work-app-form .field.short_answer {
    min-height: 8rem;
    font-size: 1rem;
    margin-top: 4rem;
}

.work-app-form .field.short_answer .short_answer{
    height: calc(100% - 6px);
    width: calc(100% - 6px);
}

input[type="file"] {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

#addWE-wrap {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    grid-column: 1 / -1;
    height: calc(66px + 1rem);
    gap: 1rem;
    flex-wrap: wrap;
}

#uploadResume + label {
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
}

.workExperience {
    border: 1px solid gray;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #102a58;
    color: white;
    border-radius: 2px;
    user-select: none;
    -webkit-user-select: none;
}

.workExperience > p {
    padding: 0 2px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.workExperience:hover {
    cursor: pointer;
    background-color: #224e99;
}

.app-terms {
    display: flex;
    flex-direction: column;
}

.app-terms > h3 {
    margin: 0.5rem 0;
    text-align: center;
    width: 100%;
}

.app-terms > p {
    margin-top: 0;
}

p.warning {
    background-color: rgb(255, 255, 185);
    border: 2px solid yellow;
    border-radius: 0.25rem;
    padding: 0.5rem;
}

.info-desc {
    margin-bottom: 1rem;
}

.info-text {
    white-space: pre-wrap;
}

.info-btn {
    width: fit-content;
    margin: auto;
    text-decoration: none;
}

#responseTbl {
    width: 100%;
    overflow-x: auto;
}

#infoTable {
    width: 100%;
    min-width: 300px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px auto;
    border: 1px solid black;
    border-radius: 1rem;
    overflow: hidden;
}

#infoTable > table {
    width: 100%;
    border-collapse: collapse;
}

#infoTable #PN {
    height: 22px; 
    font-weight: bold; 
    color: white; 
    background-color: #102a58;
}

#infoTable th {
    width: 50%;
    text-align: center;
    font-weight: bold;
    color: white;
    background-color: #102a58;
}

#infoTable td {
    text-align: center;
}

#inv-search-box {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 2rem;
    flex-wrap: wrap;
    margin: 2rem auto;
}

#inv-search {
    height: 2rem;
    border-radius: 0.5rem;
    font-size: 1.25rem;
}

.pgLimit {
    display: flex;
    font-size: 0.75rem;
    align-self: stretch;
    flex-direction: column;
}

.pgLimit > label {
    white-space: nowrap;
}

.pgLimit > select {
    font-size: 1.25rem;
    flex: 1;
    cursor: pointer;
}

.pg-ctrl {
    display: flex;
    justify-content: center;
    column-gap: 2rem;
    flex-wrap: wrap;
    align-items: center;
}

.pg-ctrl > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 0.25rem;
}

.pg-ctrl select {
    font-size: 1.25rem;
    cursor: pointer;
}

select#limit,
select#show {
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    padding-left: 0.125rem;
}

.link {
	color: blue;
	text-decoration: underline;
}

.btn-base {
    user-select: none;
    -webkit-user-select: none;
    padding: 1rem;
    border: 1px solid black;
    border-bottom-width: 3px;
    border-radius: 0.5rem;
    background-color: rgb(240, 240, 240);
}

a.btn-base {
    text-decoration: none;
    color: black;
}

.btn-base:hover {
    cursor: pointer;
    background-color: rgb(225, 225, 225);
}

.btn-base:active {
    border-bottom-width: 1px;
    background-color: rgb(155, 155, 155);
    color: white;
    margin-top: 2px;
}

.btn-base:disabled.selected {
    cursor: default;
    color: white;
    background-color: rgb(155, 155, 155);
    border-bottom-width: 3px;
    margin-top: 0;
}

.btn-base.btn-disabled, 
.btn-base.btn-disabled:hover, 
.btn-base.btn-disabled:active,
.btn-base:disabled {
    cursor: not-allowed;
    background-color: rgb(240, 240, 240);
    color: rgba(0, 0, 0, 0.3);
    border-bottom-width: 3px;
    margin-top: 0;
}

.btn-base.btn-short {
    padding: 0.5rem 1rem;
}

.btn-base.btn-mini {
    padding: 0.25rem 1rem;
    line-height: 1.5rem;
}

.btn-base.blue {
    background-color: #173f83;
    color: white;
}

.btn-base.blue:hover {
    background-color: #225ec7;
}

.btn-base.blue:active {
    background-color: #2773f7;
}

#search-categories {
    display: flex;
    align-items: flex-end;
    margin: 1rem 2rem;
    column-gap: 2rem;
    row-gap: 1rem;
}

#item-message {
    color: white;
    background-color: #102a58;
    margin: 30px 0;
    padding: 1rem 0;
}

#acknowledgment {
    width: 75%;
    margin: 30px auto;
    color: rgb(102, 102, 102);
}

#ack-head {
    display: flex;
    align-items: center;
}

#ack-head > div {
    flex: 1 1 50%;
}

#ack-head-left {
    display: grid;
    grid-template-columns: minmax(90px, 150px) auto;
}

#ack-head-left > p {
    margin: 0.25rem 0; 
}

#ack-head-right {
    display: flex;
    justify-content: flex-end;
}

#ack-thanks {
    display: flex;
    flex-direction: column;
    margin-top: 1rem;
}

#ack-thanks > p {
    margin-top: 0;
}

#ack-items {
    border-top: 1px solid black;
}

.addr-row {
    display: flex;
    align-items: flex-start;
    margin: 0.5rem 0rem;
}

.addr-row > .addr-label {
    font-weight: bold;
    margin: 0rem 1rem 0rem 0rem;
}

.addr-row > .ack-addr {
    flex: 1 1 30%;
    margin: 0;
}

#ack-items .data_table {
    grid-template-columns: minmax(6%, min-content) 
    minmax(15%, min-content) 
    1fr 
    minmax(5%, min-content)
    minmax(10%, min-content) 
    minmax(12%, min-content) 
    minmax(14%, min-content) 
    minmax(13%, min-content) 
    minmax(8%, min-content);
    border: 2px solid black;
    border-right: none;
    border-bottom: none;
}

#ack-items .data_table > .th {
    background-color: #C0C0C0;
    font-weight: 400;
    color: rgb(102, 102, 102);
}

#ack-items .data_table > .cell {
    border-right: 2px solid black;
    border-bottom: 2px solid black;
}

#ack-items .data_table > .cell.ps {
    grid-column: 2 / -1;
}

#ack-footer > p {
    margin-top: 0;
}

#ack-bottom {
    margin-top: 3rem;
}

#ack-numbers {
    display: grid;
    grid-template-columns: max-content 1rem max-content 3rem max-content;
}

#ack-numbers p {
    margin: 0 0 0.5rem 0;
}

#cert-links {
    display: flex;
    gap: 0.75rem;
}

#invoice {
    width: 75%;
    margin: 30px auto 0;
    color: rgb(102, 102, 102);
}

#invoice > div {
    width: 100%;
}

#inv-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

#inv-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#inv-id > div {
    display: grid;
    grid-template-columns: 1fr max-content;
    column-gap: 1rem;
    align-items: end;
    margin-top: 1rem;
}

#inv-id h2 {
    margin: 0.5rem 0;
}

#inv-num {
    margin: auto 0;
}

#inv-custID,
#inv-custID + p {
    margin: 0;
}

#inv-remittance {
    display: flex;
    border: 2px solid black;
    flex-direction: column;
    width: max-content;
    margin: 0.5rem 0 1rem;
}

#remitt-head {
    border-bottom: 2px solid black;
    margin: 0;
    padding: 2px 0;
    background-color: gray;
    color: black;
}

#remitt-body {
    display: flex;
    flex-direction: column;
}

#remitt-body > p {
    margin: 0;
    padding: 2px;
}

#inv-bill {
    align-self: flex-start;
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.5rem;
}

#inv-ship {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.5rem;
}

#inv-body {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

#inv-body > .data_table {
    min-width: 100%;
    border: 1px solid black;
    color: black;
}

#inv-ship-tbl {
    grid-template-columns: 1fr 2fr 1fr 1fr;
}

#invoice .th {
    background-color: #C0C0C0;
    color: black;
    font-weight: 400;
}

#inv-body > .data_table > .cell {
    border: 1px solid black;
}

#inv-body > .data_table .double-row {
    display: flex;
    align-items: center;
    justify-content: center;
}

#inv-order-tbl {
    grid-template-columns: 2fr 1fr 1fr 2fr;
}

#inv-item-tbl {
    grid-template-columns: 1fr 1fr 1fr 2fr 1fr 1fr;
}

#inv-thanks {
    display: grid;
    grid-template-columns: 3fr 2fr 1fr;
    color: black;
}

#inv-thanks p {
    margin: 0.25rem 0;
}

#inv-thanks .inv-label {
    grid-column: 2 / 3;
    font-weight: bold;
    text-align: right;
}

#inv-thanks #thanks {
    font-weight: bold;
    text-align: right;
}

#inv-item-total,
#inv-balance {
    text-align: center;
}

.print-wrap {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    margin: 2rem;
}

.print-wrap .btn-base {
    padding: 0.5rem;
}

.print-wrap i {
    font-size: 1.5rem;
}

.doc-wrap {
    width: 100%;
    overflow: auto;
}

#quote {
    width: 75%;
    margin: auto;
    font-size: 14px;
}

#quote > #quoteHead {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

#quoteHead #contact-info {
    margin: 0 0 1.5rem;
    display: grid;
    grid-template-columns: max-content auto;
    column-gap: 1rem;
}

#quote #contact-info > #quoteNum {
    font-weight: bold;
    font-size: 28px;
    margin: 0;
    width: 100%;
    grid-column: 1 / -1;
}

#quoteHead #contact-info > p {
    margin-bottom: 0;
    margin-top: 0.5rem;
}

#quoteHead #contact-info > #quo-company {
    grid-column: -2 / -1;
}

#quote #logo-wrap {
    width: 300px;
}

#quote #acct-addr {
    margin: 0.25rem 0 0.25rem 20%;
}

#quote #quo-subhead {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

#quote #quo-thanks {
    margin-top: 0;
    margin-bottom: 1.25rem;
}

#quote #quo-refer {
    margin-bottom: 0.5rem;
}

#quote #quo-id-wrap {
    display: grid;
    grid-template-columns: repeat(4, max-content);
    column-gap: 1rem;
}

#quote #quo-id-wrap > p {
    margin: 0;
}

#quote #quo-po-wrap {
    display: grid;
    grid-template-columns: max-content auto;
    max-width: 400px;
    column-gap: 1rem;
}

#quote #quo-po-wrap > p {
    margin-top: 0;
    margin-bottom: 0.25rem;
}

#quote #quo-items {
    margin-top: 1rem;
}

#quo-items .quote-item-standard {
    display: grid;
    grid-template-columns: minmax(min-content, 5%) 
    minmax(min-content, 18%) 
    minmax(min-content, 22%) 
    minmax(min-content, 5%) 
    minmax(min-content, 10%) 
    minmax(min-content, 8%) 
    minmax(min-content, 8%) 
    minmax(min-content, 12%) 
    minmax(min-content, 12%);
    border: 2px solid black;
    margin-bottom: 1rem;
}

#quo-items .quote-item-custom {
    display: grid;
    grid-template-columns: minmax(min-content, 5%) 
    minmax(min-content, 28%) 
    minmax(min-content, 28%) 
    minmax(min-content, 5%) 
    minmax(min-content, 10%) 
    minmax(min-content, 12%) 
    minmax(min-content, 12%);
    border: 2px solid black;
    margin-bottom: 1rem;
}

#quo-items .cust-notes {
    display: contents;
}

#quo-items .cust-notes > span {
    border-right: 2px solid black;
    grid-column: 1 / 4;
}

#quo-items .cust-notes > p {
    margin: 0;
    grid-column: 4 / -1;
    border-bottom: 3px solid black;
    border-right: 0px;
    font-weight: bold;
}

#quo-items .quote-item-standard > div:last-child {
    margin: 1rem 1rem 0.25rem;
    grid-column: 1 / -1;
    min-height: 1rem;
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
}

#quo-items .quote-item-custom > div:last-child {
    margin: 1rem 0 0.25rem;
    grid-column: 1 / -1;
    min-height: 1rem;
    display: flex;
    flex-direction: column;
}

#quo-items .quote-item-row {
    display: contents;
}

#quo-items .quote-item-row > .tbl-cell {
    white-space: nowrap;
}

#quo-items .quote-item-row > .tbl-cell:nth-child(3) {
    white-space: wrap;
}

#quo-items .tbl-cell {
    margin: 0;
    padding: 0.125rem 0.25rem;
    border-right: 2px solid black;
    border-bottom: 2px solid black;
}

#quo-items h4.tbl-cell {
    background-color: #C0C0C0;
    color: black;
}

#quo-items .quote-item-row > .tbl-cell:last-child {
    border-right: none;
}

#quo-items .quote-item-row:last-child > .tbl-cell {
    border-bottom: none;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell {
    grid-column: 4 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #F0F0F0;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell .spec-breakdown {
    display: grid;
    grid-template-columns: repeat(3, max-content) 1fr;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell .spec-breakdown > span:nth-child(4n + 2) {
    padding: 0 1rem;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell .spec-breakdown > .price,
#quo-items .quote-item-row > .tbl-cell.paint-spec-cell .spec-breakdown > .coating {
    margin-left: 2rem;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell .spec-breakdown > .price {
    text-align: right;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell > div {
    display: flex;
    gap: 2rem;
    justify-content: center;
    width: 100%;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell > div > span.applied {
    flex: 1 1 40%;
    text-align: center;
    display: block;
}

#quo-items .quote-item-row > .tbl-cell.paint-spec-cell > div > span {
    flex: 1 1 60%;
    display: flex;
    align-items: center;
}

#quo-items .spec-note {
    border: 2px solid black;
    min-width: 0;
}

#quo-items .spec-note > .tbl-cell {
    border: none;
}

#quo-items .spec-note > h4.tbl-cell {
    border-bottom: 2px solid black;
}

#quo-items .spec-note p {
    margin: 0;
}

#quo-items .spec-note.standard {
    grid-column: 1 / 2;
}

#quo-items .spec-note.custom {
    grid-column: 2 / 3;
}

#quo-items .spec-box {
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 0.25rem;
}

#quo-items .spec-box > h4.tbl-cell {
    border-top: none;
    border-right: none;
    padding-left: 10%;
    grid-column: 1 / -1;
}

#quo-items .spec-box > div {
    min-width: 100%;
    width: min-content;
}

#quo-items .spec-box ul {
    list-style: none;
    margin: 0.25rem 0 0.25rem 0.25rem;
    padding-left: 0;
}

#quo-items .spec-box li {
    padding-left: 1rem;
    text-indent: -1rem;
}

#quo-items .spec-box li::before {
    content: "+";
    padding-right: 0.5rem;
    font-weight: bold;
    color: black;
}

#quo-items .breakdown {
    display: grid;
    grid-template-columns: 1fr 1rem 1fr 1.5fr;
    width: max-content;
    border-top: 2px solid black;
    border-left: 2px solid black;
    align-self: flex-end;
}

#quo-items .breakdown > .bd-head {
    background-color: #C0C0C0;
    color: black;
    margin: 0;
}

#quo-items .breakdown > .bd-head.top {
    grid-column: 1 / -1;
}

#quo-items .breakdown > .bd-head.min {
    padding-left: 1rem;
    text-align: right;
}

#quo-items .breakdown > .bd-head.max {
    padding-right: 2rem;
}

#quo-items .breakdown > p {
    margin: 0;
    padding-bottom: 0.25rem;
    border-bottom: 2px solid black;
}

#quo-items .breakdown > p.min {
    text-align: right;
    padding-right: 0.25rem;
}

#quo-items .breakdown > p.divider {
    font-weight: bold;
    text-align: center;
}

#quo-items .breakdown > p.max {
    padding-left: 0.25rem;
}

#quote .quo-addr-row {
    display: grid;
    grid-template-columns: max-content 1fr max-content 1fr;
    column-gap: 1rem;
}

#quote .quo-addr-row.addrs {
    border-top: 1px solid #C0C0C0;
}

#quote .quo-addr-row > p {
    margin: 0;
}

#quote .quo-addr-row.addrs > p {
    margin: 1rem 0;
}

#quote #quo-paintFeeTbl {
    display: grid;
    margin: 0 10%;
    grid-template-columns: minmax(max-content, 4fr)
    minmax(max-content, 4fr)
    1fr
    1fr
    minmax(max-content, 2fr);
}

#quote #quo-paintFeeTbl > p {
    border: 1px solid black;
    border-right: none;
    padding: 0 0.25rem;
}

#quote #quo-paintFeeTbl > p:last-child {
    border-right: 1px solid black;
}

#quote #quo-resLG,
#quote #quo-notes {
    margin: 0 5%;
    font-weight: bold;
}

#quote #terms-wrap {
    margin-bottom: 2rem;
    font-size: 0.75rem;
}

#quote #terms-wrap > p {
    margin: 0.25rem 0;
}

#quote #quo-terms {
    font-size: 0.75rem;
}

#quote #quo-terms > span {
    font-size: 14px;
}

#quote #terms-wrap > #quo-term-msg {
    font-weight: bold;
}

p.error,
.red {
    color: red;
}

#custFile-portal {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 2rem;
}

#custFile-portal > div {
    flex: 1 1 30%;
    max-width: 500px;
    min-width: 316px;
}

#custFile-portal .form-input {
    width: 100%;
}

#custFile-portal input[type="text"]:not(.icon-right) {
    width: calc(100% - 10px);
}

#file-portal {
    display: flex;
    flex-wrap: wrap;
    column-gap: 3rem;
    row-gap: 1rem;
    padding-top: 1rem;
    justify-content: center;
}

#file-portal > div {
    border: 1px solid black;
    border-radius: 1rem;
    padding: 1rem;
    min-width: 282px;
}

#file-portal-form {
    min-width: 282px;
}

#file-portal-form > div {
    width: 100%;
}

#file-portal-form .form-input {
    margin: 0.5rem 0;
}

#file-portal #acct-info {
    display: grid;
    grid-template-columns: min-content 1fr;
    row-gap: 1rem;
    column-gap: 0.25rem;
}

#file-portal #acct-info p {
    margin: 0;
    overflow: auto;
}

#file-portal #file-notes,
#file-portal-form input[type="text"] {
    border-radius: 0.5rem;
    padding: 0.125rem 0.5rem;
    width: calc(100% - 18px);
}

#file-portal #file-notes {
    min-height: 4rem;
    font-size: 1rem;
}

#file-portal #files-grid {
    display: grid;
    grid-template-columns: 1fr repeat(4, max-content);
    column-gap: 1rem;
    row-gap: 0.5rem;
    overflow-x: auto;
    margin: 0 1rem;
}

#file-portal #files-grid h4,
#file-portal #files-grid p {
    margin: 0;
}   

#file-portal #upload + label {
    max-width: calc(100% - 1rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#bom {
    border: 1px solid black;
    border-radius: 1rem;
    margin: 2rem auto;
    overflow: hidden;
}

#bom > .bomItem {
    display: grid;
    grid-template-columns: 25% 1fr;
    margin: 0.5rem 1rem;
}

#bom .bomPartWrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    row-gap: 1rem;
}

#bom .bomCtrls {
    display: flex;
    align-items: center;
    column-gap: 2rem;
    font-size: 1.25rem;
    margin: 0 0 0 auto;
}

#bom .bomCtrls i:hover {
    cursor: pointer;
}

#bom img {
    width: 100%;
    max-width: 200px;
    margin: auto;
}

#bom a {
    text-decoration: none;
}

#bom input.bomQty {
    width: 3rem;
    text-align: center;
}

#bom p.bomQty {
    margin: 1rem 2rem 1rem 1rem;
}

#bom > h2 {
    color: white;
    background-color: #102a58;
    font-weight: 400;
    margin: 0;
    padding: 1rem 0 1rem 1rem;
}

input.bomQty::-webkit-inner-spin-button, 
input.bomQty::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}

#rfq-wrap {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

#related-wrap {
    display: flex;
    flex-direction: column;
    margin-top: 2rem;
}

#related-wrap > .label {
    padding: 0.5rem 1rem;
    font-size: 1.5rem;
    bottom: 100%;
    background-color: #102a58;
    color: white;
    width: fit-content;
    border-radius: 0.25rem 0.25rem 0 0;
}

#related-acc {
    border: 1px solid black;
    border-radius: 0 0.25rem 0.25rem 0.25rem;
    padding: 2rem 1rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

#related-acc > p {
    width: 100%;
}

#related-acc > .bom-acc {
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid black;
    border-radius: 1rem;
    padding: 1rem;
    margin: auto;
    width: calc(100% - 2rem);
    height: calc(100% - 2rem);
}

#related-acc > .bom-acc p {
    margin: 0.25rem 0;
}

#related-acc .acc-to-bom {
    text-decoration: none;
    color: white;
    background-color: #102a58;
    padding: 0.5rem;
    border-radius: 0.25rem;
    border: 2px solid #102a58;
    margin-top: auto;
}

#related-acc .acc-to-bom:hover,
#related-acc .acc-to-bom:active {
    background-color: white;
    color: #102a58;
}

.data-form-wrap {
    margin: 2rem auto 0;
    max-width: 75%;
    min-width: 316px;
}

#address-suggestions {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding-bottom: 1rem;
}

.suggested-addr {
    background-color: white;
    padding: 1rem;
    border-radius: 1rem;
    text-align: center;
    border: 1px solid gray;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 6.5rem;
}

.suggested-addr > .btn-base {
    margin-top: auto;
}

.suggested-addr > .btn-base:active {
    margin-top: auto;
}

.load-icon {
    font-size: 2rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

#part-filters {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: auto;
}

#part-filters > div {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#part-filters #filters {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-evenly;
}

#part-filters #filters > div {
    width: 320px;
    border-bottom: 1px solid black;
}

#part-filters #filters > div:last-child {
    border-bottom: none;
}

#part-filters #searchBar {
    width: 50%;
    min-width: 300px;
}

#part-filters h2 {
    text-align: center;
}

.line-wrapper {
    display: flex;
    align-items: center;
}

.line-wrapper > label,
.line-wrapper > input[type="checkbox"] {
    cursor: pointer;
}

#part-filters input[type="text"],
#part-filters input[type="number"] {
    height: 2rem;
}

#part-filters input[type="number"] {
    width: 138px;
}

#part-filters input[type="checkbox"] {
    width: 1.5rem;
    height: 1.5rem;
    margin: 0.5rem;
}

#part-filters > #filters {
    margin-bottom: 2rem;
}

#part-filters #part-materials,
#part-filters #ind-standards {
    max-height: 400px;
    overflow-y: auto;
}

#search-wrapper {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    position: relative;
}

#search-wrapper > #partSearch {
    width: calc(100% - 305px);
}

#search-wrapper > #search-filters {
    width: 305px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

#search-filters > .close {
    display: none;
}

#search-filters #ind-standards > p,
#search-filters #part-materials > p,
#search-filters #part-dimensions > p {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

#search-filters .filter-label {
    font-size: 0.75rem;
    margin-bottom: 0;
}

#search-filters input[type="checkbox"] {
    width: 1.5rem;
    height: 1.5rem;
}

#search-filters input[type="number"] {
    height: 2rem;
    width: 135px;
}

#search-filters #filter-btn-wrap {
    margin: 2rem 1rem;
    width: calc(100% - 2rem);
    display: flex;
    align-items: center;
    justify-content: center;
}

.required::placeholder {
    color: red;
}

input[type="text"].required,
textarea.required {
   border-color: red; 
}

.field {
    position: relative;
    width: fit-content;
    display: inline-block;
}

.form-input .field,
.full-width.field {
    width: 100%;
}

.field > label,
#siteSearchWrap > label {
    position: absolute;
    pointer-events: none;
    left: 0.25rem;
    top: 0.5rem;
    font-size: 1rem;
    background-color: white;
    color: black;
    padding: 0 2px;
}

.work-app-form .field.short_answer > label {
    max-width: calc(100% - 10px);
}

#billInfo #Notes {
    font-size: 1rem;
}

.field > select,
.field > input[type="text"],
.field > input[type="number"] {
    font-size: 1rem;
}

.field > select {
    height: 38px;
}

.field > select + label {
    display: none;
}

.field > .req-mark {
    position: absolute;
    font-size: 1rem;
    right: 0.3rem;
    top: 0rem;
    user-select: none;
    -webkit-user-select: none;
    pointer-events: none;
}

.field > input[type="text"]::placeholder,
.field > input[type="number"]::placeholder,
.field > input[type="password"]::placeholder,
.field > textarea::placeholder,
#siteSearchWrap > input[type="text"]::placeholder {
    opacity: 0;
}

.field > input[type="text"]:focus + label,
.field > input[type="number"]:focus + label,
.field > input[type="password"]:focus + label,
.field > textarea:focus + label,
.field > select:focus + label,
#siteSearchWrap > input[type="text"]:focus + label {
    bottom: 100%;
    top: unset;
    display: block !important;
    border: 1px solid black;
    border-bottom: none;
    max-width: calc(100% - 0.5rem - 6px);
}

.field > select:focus ~ .req-mark {
    display: none;
}

.field > input[type="text"]:not(:placeholder-shown) + label,
.field > input[type="number"]:not(:placeholder-shown) + label,
.field > input[type="password"]:not(:placeholder-shown) + label,
.field > textarea:not(:placeholder-shown) + label,
#siteSearchWrap > input[type="text"]:not(:placeholder-shown) + label {
    display: none;
}

#search-wrapper > .filter-toggle-wrap,
#search-wrapper > #filter-toggle {
    display: none;
}

.tbl-loading {
    font-size: 5rem;
    margin: 0 calc(50% - 2.5rem);
}

#validContact {
    display: none;
    visibility: hidden;
}

@media screen {
    @media (max-width: 1439px) {
        #header {
            row-gap: 1rem;
        }

        #head_social_menu {
            width: 100%;
            justify-content: center;
        }

        #head_social_menu > .menuFrame {
            width: 100%;
            justify-content: center;
        }

        #head_social_menu > .menuFrame > *:first-child {
            margin-left: 0;
        }

        #top_menu {
            width: 100%;
            justify-content: center;
            padding-right: 0px;
        }

		#head_banner > #banner_background {
			background-size: 120%;
		}

        .postList {
            grid-template-columns: repeat(2, 1fr);
        }

        #siteSearchWrap {
            justify-self: center;
            margin-left: 0;
        }

        #search-wrapper {
            justify-content: center;
        }

        #search-wrapper > #search-filters {
            display: none;
        }

        #search-wrapper > #search-filters.toggled {
            display: flex;
            position: absolute;
            left: -30px;
            right: 0;
            top: 0;
            background-color: white;
            width: 318px;
            border-bottom: 1px solid black;
            border-right: 1px solid black;
            padding-left: 2px;
            z-index: 1;
        }

        .category-search > #search-filters.toggled {
            border-top: 1px solid black;
        }

        #search-filters.toggled > .close {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            width: 100%;
            font-size: 2rem;
        }

        #search-filters.toggled > .close > i {
            user-select: none;
            -webkit-user-select: none;
            padding: 0 0.25rem;
        }

        #search-wrapper > .filter-toggle-wrap {
            margin-top: 2rem; 
            display: flex; 
            align-items: flex-end; 
            justify-content: center; 
            width: 100%;
        }

        #search-wrapper > #filter-toggle {
            display: block;
            margin-left: 2rem;
            margin-right: auto;
        }

        #search-wrapper > #partSearch {
            width: 100%;
        }

        .slideCtrl {
            color: rgba(0, 0, 0, 1);
            background-color: rgba(255, 255, 255, 1);
            border-color: rgba(255, 255, 255, 1);
        }
    }

    @media (max-width: 1023px) {
        .padded.template.small {
            min-width: none;
            max-width: none;
            width: 550px;
        }

		#head_banner > #banner_background {
			display: none;
		}
        
        #quote,
        #invoice,
        #acknowledgment {
            width: fit-content;
        }
    }

    @media (max-width: 767px) {
        #titleWrap > h1 {
            margin: 0.33rem auto;
            width: 100%;
            text-align: center;
        }

        #mainImgWrap {
            padding: 30px 25px;
        }
        
        .postList {
            width: 100%;
            margin: auto 0;
            grid-template-columns: 1fr;
        }

        #contactUs {
            padding: 0;
            width: 100%;
        }

        #contactForm > div {
            row-gap: 0.5rem;
        }

        #contactForm .field {
            width: 100%;
        }

        #contactForm > div input[type="text"] {
            width: calc(100% - 8px);
        }

        #search-wrapper > #search-filters {
            justify-content: flex-start;
        }

        #search-wrapper > #search-filters.toggled {
            left: -2px;
        }

        .padded {
            padding-left: 2px;
            padding-right: 2px;
            width: calc(100% - 4px);
        }

        #related-acc {
            justify-content: center;
        }

        #bom input.bomQty {
            height: 2rem;
        }

        #file-portal,
        #file-portal > div,
        #file-portal-form {
            width: 100%;
        }

        .padded.template.small {
            max-width: unset;
            width: calc(100% - 4px);
        }

        .mobile-job-title {
            display: block;
        }

        .work-app-form #mil_duties_wrap {
            grid-column: 1 / -1;
        }

        .work-app-form #mil_duties_wrap label {
            max-width: calc(100% - 10px);
        }

        #catalog-request > div {
            width: 100%;
        }

        #catalog-request > div:first-child {
            margin-bottom: 1rem;
        }

        #guide-wrap {
            flex-wrap: wrap;
            width: calc(100% - 4px);
        }

        #guide-wrap > div {
            width: 100%;
        }

        data-form.small {
            width: fit-content;
        }

        .bom-table {
            font-size: 10px;
        }

        #search-categories {
            flex-wrap: wrap;
            justify-content: center;
        }
    }

    @media (max-width: 425px) {
        .slideText {
            font-size: 2rem;
        }

        .slideLink {
            font-size: 1rem;
        }

        #related-acc > .bom-acc {
            width: calc(100% - 2rem);
        }

        #vid_library {
            border: none;
            border-radius: 0;
            margin-left: 0;
            margin-right: 0;
            padding: 0;
            width: 100%;
        }

        .work-app-form > div.input_wrap {
            justify-content: space-between;
        }

        .form-wrap {
            margin: 1rem 2px;
        }

        #ind-standards,
        #part-materials,
        #part-dimensions {
            width: 100%;
        }

        #search-wrapper > #search-filters > div .options {
            padding: 0 2px;
        }

        #search-wrapper > #filter-toggle {
            margin: auto;
        }

        #addrs > div {
            width: calc(80% - 2rem);
            margin: auto;
        }
    }

    @media (max-width: 320px) {
        #main_menu > .mobile.menuFrame,
        #cust_menu > .mobile.menuFrame {
            width: calc(100% - 2rem);
            border-left: none;
            border-right: none;
            left: 0;
        }

        data-form.small {
            width: calc(100% - 6px);
        }

        #searchResults, 
        #pl_items {
            padding: 2rem 2px;
        } 

        #search-wrapper > #search-filters.toggled {
            border-right: none;
        }

        #addrs > div {
            width: calc(90% - 2rem);
        }
    }
}

@media print {
    #header,
    #head_banner,
    #titleWrap,
    #cust_menu,
    .print-wrap,
    #invoice #thanks,
    #footer,
    .no-print {
        display: none !important;
    }

    .padded.template {
        padding: 0;
        width: 100%;
        font-size: 14px;
    }

    #acknowledgment {
        width: 100%;
        margin: 0 auto;
    }

    #invoice {
        width: 90%;
        margin: 0 auto;
    }

    #quote {
        width: 100%;
        margin: 0;
    }

    #quo-items .quote-item-standard {
        grid-template-columns: minmax(min-content, 5%) 
        minmax(min-content, 18%) 
        minmax(min-content, 22%) 
        minmax(min-content, 5%) 
        minmax(min-content, 10%) 
        minmax(min-content, 8%) 
        minmax(min-content, 8%) 
        minmax(min-content, 12%) 
        minmax(min-content, 12%);
        break-inside: avoid;
    }

    #quo-items .quote-item-custom {
        grid-template-columns: minmax(min-content, 5%) 
        minmax(min-content, 28%) 
        minmax(min-content, 28%) 
        minmax(min-content, 5%) 
        minmax(min-content, 10%) 
        minmax(min-content, 12%) 
        minmax(min-content, 12%);
        break-inside: avoid;
    }

    #ack-items > .addr-row,
    #ack-items > .data_table > p,
    #inv-item-tbl > p {
        break-inside: avoid;
    }

    #inv-item-tbl,
	div.data_table {
		overflow: unset;
    }

	.fixed_menu {
		position: unset;
	}
}