/* Could use Silly-CSS but it is not supported everywhere */
/* Do not use !important unless really needed or ask Amine */

/***
 *       ▄▄▄▄███▄▄▄▄      ▄████████  ▄█  ███▄▄▄▄        ▄████████    ▄████████    ▄████████ 
 *     ▄██▀▀▀███▀▀▀██▄   ███    ███ ███  ███▀▀▀██▄     ███    ███   ███    ███   ███    ███ 
 *     ███   ███   ███   ███    ███ ███▌ ███   ███     ███    █▀    ███    █▀    ███    █▀  
 *     ███   ███   ███   ███    ███ ███▌ ███   ███     ███          ███          ███        
 *     ███   ███   ███ ▀███████████ ███▌ ███   ███     ███        ▀███████████ ▀███████████ 
 *     ███   ███   ███   ███    ███ ███  ███   ███     ███    █▄           ███          ███ 
 *     ███   ███   ███   ███    ███ ███  ███   ███     ███    ███    ▄█    ███    ▄█    ███ 
 *      ▀█   ███   █▀    ███    █▀  █▀    ▀█   █▀      ████████▀   ▄████████▀   ▄████████▀  
 *                                                                                          
 */
#oneida_form form {
    width: 100%;
}

 #oneida_form input {
    display: block;
    margin: 6px 0;
    padding: 0 12px;
    width: 100%;
    height: 40px;
    box-sizing: border-box;
    border: 1px solid #31254c;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
}

#oneida_form #loading-gif {
    position: relative;
    display: none;
    max-width: 10%;
}

#oneida_form .loading-gif {
    content: "";
    background: url("img/loading-logo.gif");
    background-size: 120px;
    background-repeat: no-repeat;
    background-position: left;
    height: 16vw;
    width: 100%;
}

#oneida_form #loading-gif::after {
    content: "Loading...";
    display: block;
    position: absolute;
    bottom: -30px;
    left: 0;
    font-family: Arial, sans-serif;
    font-size: 16px;
    color: #333;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

#oneida_form #loading-gif:not([style*="display: none"]) {
    display: block;
}

#oneida_form #loading-gif:not([style*="display: none"])::after {
    opacity: 1;
}

#oneida_form .update-oneida-banner {
    content: "";
    background: url("img/update-oneida-banner.png");
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: left;
    height: 18vw;
}

#oneida_form #hea_sct1 input, #oneida_form #hea_sct2 input {
    text-transform: capitalize;
}

#oneida_form button {
    border-radius: 5px;
    box-shadow: 1px 2px #000000ed;
}

#oneida_form textarea {
    display: block;
    margin: 6px 0;
    padding: 12px 12px;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #31254c;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
}

#oneida_form .instruction-block {
    background-color: white;
    color: black;
    border: 1px solid #31254c;
    border-radius: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
}

#oneida_form .instruction-table td, #oneida_form .instruction-table th {
    background-color: white;
}

#oneida_form .instruction-table.grid-table td, #oneida_form .instruction-table.grid-table th {
    border-collapse: collapse;
    border: 2px solid #31254c;
    background-color: white;
}

#oneida_form input[type="date"],
input[type="month"],
input[type="tel"],
input[type="email"] {
    line-height: 40px;
    font-size: 14px;
    font-family: 'lato-regular';
    text-transform: none !important;
}

#oneida_form label {
    width: 100%;
    margin: 6px 6px;
    margin-right: 15px;
    display: block;
}

#oneida_form .field-description {
    font-family: 'lato-regular';
    width: 100%;
    margin: 6px 6px;
    height: 20px;
    font-size: 12px;
    display: contents;
}

#oneida_form .disabled-calculated-number{
    background-color: white;
    border: 2px solid #31254c;
    cursor: no-drop;
    box-shadow: none;
}

#oneida_form select {
    display: block;
    margin: 6px 2px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    padding: 0 12px;
    font-family: 'lato-regular';
    box-sizing: border-box;
    color: black;
    border: 1px solid #31254c;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
}

#oneida_form select option {
    color: black;
}

#oneida_form select option:first-child {
    color: #565656;
}

/***
 *     ▄████████ ███    █▄     ▄████████     ███      ▄██████▄    ▄▄▄▄███▄▄▄▄        ▄████████    ▄████████    ▄████████ 
 *    ███    ███ ███    ███   ███    ███ ▀█████████▄ ███    ███ ▄██▀▀▀███▀▀▀██▄     ███    ███   ███    ███   ███    ███ 
 *    ███    █▀  ███    ███   ███    █▀     ▀███▀▀██ ███    ███ ███   ███   ███     ███    █▀    ███    █▀    ███    █▀  
 *    ███        ███    ███   ███            ███   ▀ ███    ███ ███   ███   ███     ███          ███          ███        
 *    ███        ███    ███ ▀███████████     ███     ███    ███ ███   ███   ███     ███        ▀███████████ ▀███████████ 
 *    ███    █▄  ███    ███          ███     ███     ███    ███ ███   ███   ███     ███    █▄           ███          ███ 
 *    ███    ███ ███    ███    ▄█    ███     ███     ███    ███ ███   ███   ███     ███    ███    ▄█    ███    ▄█    ███ 
 *    ████████▀  ████████▀   ▄████████▀     ▄████▀    ▀██████▀   ▀█   ███   █▀      ████████▀   ▄████████▀   ▄████████▀  
 *                                                                                                                       
 */
/* start select2 css */
/* Main select2 container */
#oneida_form .select2-container--myOneidaFormsTheme .select2-container {
    width: 100%;
}
  
/* Single select box */
#oneida_form .select2-container--myOneidaFormsTheme .select2-selection--single {
    display: block;
    width: 100%; 
    height: 40px;
    line-height: 40px;
    padding: 0 12px;
    
    border: 1px solid #31254c;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
    
    font-size: 14px;
    font-family: 'lato-regular';
    
    background: white;
    color: black;  
}

/* Single select search/loop icon **/
#oneida_form .select2-container--myOneidaFormsTheme .select2-selection--single::after {
    content: "";
    background: url("img/searchIcon.png");
    background-size: 15px 15px;
    background-repeat: no-repeat;
    background-position: center;
  
    width: 20px;
    height: 34px;
    position: absolute; 
    right: 10px;
    top: 3px;
}

/* Style of clear selection option */ 
#oneida_form .select2-container--myOneidaFormsTheme .select2-selection__clear {
    color: red;
    position: absolute;
    left: 8px;
    font-weight: bolder;
    font-size: 17px;
}
  
/* Text of selected option */ 
#oneida_form .select2-container--myOneidaFormsTheme .select2-selection__rendered {
    color: #565656;
    width: 100%;
}
  
/* Dropdown options */
#oneida_form .select2-container--myOneidaFormsTheme .select2-results__option {
    color: black;
    width: 100%;
    padding: 6px;
}

/* cannot use oneida forms tag here */
.select2-container--myOneidaFormsTheme .select2-results__option--highlighted {
    background: rgba(234, 141, 30, 0.5);
    font-weight: bolder;
}

/* Limit Select2 dropdown height */
.select2-results__options {
    max-height: 300px !important;
    overflow-y: auto !important;
}
/* end select2 css */

#oneida_form button {
    margin: 8px 3px;
}

#oneida_form .input-header {
    margin-top: 3vw;
}

#oneida_form .input-narrow-header {
    margin-top: 2vw;
}

#oneida_form hr {
    width: 90%;
    margin: 1rem auto;
}

#oneida_form ul {
    margin-bottom: 0px;
}

#oneida_form .no-disk-list {
    list-style: none;
}

#oneida_form .full-table {
    overflow-wrap: anywhere;
    width: -webkit-fill-available;
    margin-bottom: 10px;
}

#oneida_form .vertLine {
    border-left: 2px solid rgba(80, 127, 74, 0.5);
   
    /* 0.5 opacity */
}

#oneida_form .masked-ssn {
    display: block;
    margin: 6px 0;
    padding: 0 12px;
    width: 100%;
    height: 40px;
    box-sizing: border-box;
    border: 1px solid #31254c;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
    background-color: #ebebeb;
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 38px;
    cursor: pointer;
}

#oneida_form .subheader-vertline { 
    /* works well with H3 headers that are subsections in a section with a vertLine */
    margin-top: 20px;
    margin-left: 10px;
}

#oneida_form .clear-field-button {
    max-width: 25px;
    max-height: 25px;
    padding: 0px 5px;
    line-height: normal;
    background-color: darkred;
}

#oneida_form .remove-field-block {
    left: 87%;
    top: 27%;
    position: absolute;
}

#oneida_form .signature {
    width: -webkit-fill-available;
    background-color: white;
    color: black;
    border: 1px solid #31254c;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
    touch-action: none;
    max-width: 400px;
    min-width: 200px;
    max-height: 200px;
    min-height: 100px;
}

#oneida_form .signatureBlock {
    position: relative;
}

#oneida_form .single-signature-row {
    position: relative;
    width: min-content;
    margin-left: 15px;
}

#oneida_form .remove-signature-block {
    left: 2%;
    top: 2%;
    position: absolute;
}

#oneida_form .remove-signature-block.labeled-signature-button {
    top: 23%;
}

#oneida_form .remove-signature-button {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    background-color: darkred;
    color: white;
    height: 30px;
    width: 30px;
    margin: auto;
}

#oneida_form .remove-signature-icon {
    color: white;
    position: absolute;
    top: 20%;
    left: 28.78%;
}

#oneida_form .signature-placeholder  {
    font-family: "Lucida Handwriting", "Brush Script MT", cursive;
    color: #939393;
    position: absolute;
    top: 50%;
    left: 50%;
    font-style:  italic;
    pointer-events: none;
    transform: translate(-50%, -50%);
    /* click through the placeholder text */
}

#oneida_form .signature-placeholder.labeled-signature{
    top: 47%;
}

/* the background color of the filepond drop area */
#oneida_form .filepond--panel-root {
    background-color: whitesmoke;
}

#oneida_form .radio-row {
    word-wrap: normal;
    display: flex;
    width: fit-content;
}

#oneida_form .signature-placeholder.labeled-signature{
    top: 47%;
}

#oneida_form .radio-row-reverse {
    word-wrap: normal;
    display: flex;
    flex-direction: row-reverse;
}

#oneida_form .upload {
    padding: 7px 12px;
    background-color: whitesmoke;
}

#oneida_form .filepond--item {
    list-style: none;
    margin-left: 0px;
}

#oneida_form .center {
    display: flex;
    justify-content: center;
    align-items: center;
}

#oneida_form #addPrevCollegeRow,
#oneida_form .add-repeating-table-row {
    background-color: #507f4a;
    margin-top: 1px;
}

#oneida_form .oneida-form-row {
    padding: 0%;
    padding-bottom: 10px;
}

#oneida_form .flex-table {
    display: flex;
}

#oneida_form .remove-repeating-table-row {
    background-color: darkred;
    margin-top: 1px;
}

#oneida_form .remove-row {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    background-color: darkred;
    color: white;
}

#oneida_form .form-navigation {
    display: flex;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box;
    padding: 10px;
}

#oneida_form .oneida-form-navigation-button {
    margin-top: 15px;
    margin-left: 12.5px;
}

/* #oneida_form #btnSubmit { Could we move this from ID level if it is still needed?
    margin: 25px 3px;
} */

#oneida_form .oneida-form-submit-button {
    margin-top: 15px; 
    margin-right: 3px;
    margin-bottom: 8px; 
    margin-left: 12.5px;
    background-color: #507f4a;
}

#oneida_form .btn-default:focus {
    background: #d98119;
    color:black;
}

#oneida_form .oneida-form-submit-button:focus {
    background: #30522c;
    color:black;
}

#oneida_form .popup-accept:focus {
    background-color: #30522c;
    color:black;
}

#oneida_form .warning-text {
    color:rgba(234, 141, 30, 1);
}

#oneida_form .warning-text u{
    text-decoration-color:#31254c;
}

#oneida_form .warning-text a{
    color:rgba(70, 145, 210, 1);
}

#oneida_form .error {
    color: red !important;
}

#oneida_form #btnError.success {
    color: #507f4a !important;
}

#oneida_form #btnError.error {
    color: red !important;
}

#oneida_form #display_none {
    display: none;
}

#oneida_form #recaptcha {
    margin-top: 13px;
}

#oneida_form .checkbox-container,
#oneida_form .radio-container {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 10px;
    margin: 5px;
    background-color: whitesmoke;
    border-radius: 5px;
    box-shadow: 1px 2px 5px rgba(234, 141, 30, 0.5);
}

#oneida_form .nobg-checkbox-container,
#oneida_form .nobg-radio-container {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 10px;
    padding-top: 0px;
    margin: 5px;
}

#oneida_form .narrow, .nobg-radio-container {
    padding: 2px;
    margin: 2px;
}

#oneida_form .inline-container {
    display: inline-flex;
}

#oneida_form .inline-container-wrap {
    display: inline-flex;
    flex-wrap: wrap;
}

#oneida_form .inline-checkboxes {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    text-wrap: nowrap;
    column-gap: 5px;
    width: 49%;
}

#oneida_form .checkbox-array-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    column-gap: 5px;
    row-gap: 10px;
}

#oneida_form .checkbox-list-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    column-gap: 5px;
    row-gap: 10px;
    margin-top:10px;  
    margin-bottom: 10px;  
}

#oneida_form .psuedo-label {
    display: block;
    margin: 6px;
    margin-bottom: 3px;
    font-size: 14px;
    font-family: 'lato-bold';
    color: #333 !important;
}

#oneida_form .label-and-tooltip {
    vertical-align: bottom;
}

/*
Slider Details
*/
#oneida_form.slidecontainer {
    width: 100%; /* Width of the outside container */
}
  
/* The slider itself */
#oneida_form .slider {
-webkit-appearance: none;  /* Override default CSS styles */
appearance: none;
width: 100%; /* Full-width */
height: 20px; /* Specified height */
border-radius: 10px; 
background: white; /* Grey background */
border: 1px solid #31254c;
-webkit-transition: .2s; /* 0.2 seconds transition on hover */
transition: 0.025s all linear;
}

/* Mouse-over effects */
#oneida_form .slider:hover {
opacity: 1; /* Fully shown on mouse-over */
}

#oneida_form .slider::-webkit-slider-thumb:hover {
-webkit-appearance: none; /* Override default look */
appearance: none;
width: 30px; /* Set a specific slider handle width */
height: 30px; /* Slider handle height */
background: #31254c;
cursor: pointer; /* Cursor on hover */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
#oneida_form .slider::-webkit-slider-thumb {
-webkit-appearance: none; /* Override default look */
appearance: none;
width: 25px; /* Set a specific slider handle width */
height: 25px; /* Slider handle height */
border-radius: 50%; 
background: #31254c;
cursor: pointer; /* Cursor on hover */
-webkit-transition: .2s; /* 0.2 seconds transition on hover */
transition: 0.025s all linear;
}

#oneida_form .slider::-moz-range-thumb {
width: 30px; /* Set a specific slider handle width */
height: 30px; /* Slider handle height */
background: #31254c;
cursor: pointer; /* Cursor on hover */
}

/* progress bar  */
.progress-bar {
    display: flex;
    font-family: lato-bold;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 20px;
    background-color: whitesmoke;
}

.step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.step .icon-container {
    width: 40px;
    height: 40px;
    margin-bottom: 20px;
}

.step .icon-container svg {
    fill: #888;
}

.step.active .icon-container svg {
    fill: #31254c;
}

.step span {
    font-size: 14px;
    color: #888;
}

.step.active span {
    color: #31254c;
}

.connector {
    flex-grow: 1;
    height: 16px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.connector:before,
.connector:after,
.connector .middle-line {
    content: "";
    position: absolute;
    height: 3px;
    background-color: #ccc;
}

.connector:before {
    top: 0;
    left: 0;
    right: 0;
}

.connector:after {
    bottom: 0;
    left: 0;
    right: 0;
}

.connector .middle-line {
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
}

.step.active + .connector:before,
.step.active + .connector:after,
.step.active + .connector .middle-line {
    background-color: #31254c;
}

.step.active ~ .connector:before,
.step.active ~ .connector:after,
.step.active ~ .connector .middle-line {
    background-color: #ccc;
}


/* Chrome, Safari, Edge, Opera */
#oneida_form .arrowless_number_input::-webkit-outer-spin-button,
#oneida_form .arrowless_number_input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
#oneida_form .arrowless_number_input input[type=number] {
    -moz-appearance: textfield;
}

#oneida_form .slider-row {
    display: flex; 
    align-items: center;
}

#oneida_form .slider-value-display {
    font-size: large;
    width: 75px;
    margin-right: 10px;
}

/*End of Slider Details*/

/*
Tooltips
*/
/* Tooltip container */
#oneida_form .tooltip {
    position: relative;
    display: inline-block;
    opacity: 1;
    z-index: inherit;
  }
  
  /* Tooltip text */
#oneida_form .tooltip .tooltiptext {
    visibility: hidden;
    width: 220px;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
  
    /* Position the tooltip text */
    position: absolute;
    bottom: 125%;
    left: 50%;
    margin-left: -110px;
  
    /* Fade in tooltip */
    opacity: 0;
    transition: opacity 0.3s;
  }

#oneida_form .tooltiptext { 
    /* Add layering for the tooltip text without forcing the tooltip button on top of everything else. */
    z-index: 1070;
  }
  
  /* Tooltip arrow */
#oneida_form .tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
  }
  
  /* Show the tooltip text when you mouse over the tooltip container */
#oneida_form .tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
  }
  /*End of Tooltip Details*/

#oneida_form #agree,
#oneida_form #ferpa,
#oneida_form #popup {
    width: 20px;
    margin-right: 8px;
    box-shadow: none;
}

#oneida_form .popup-hidden {
    display: none;
}

#oneida_form .popup-visible {
    display: block;
    position: fixed;
    top: 50%;
    /* 50% from the top of the window */
    left: 50%;
    /* 50% from the left of the window */
    transform: translate(-50%, -50%);
    /* to perfectly center the popup */
    width: 1100px;
    height: fit-content;
    max-width: 95%;
    max-height: 90%;
    background-color: white;
    border: 2px solid #31254c;
    padding: 20px;
    z-index: 10000;
}

/* CSS-only overlay using html pseudo-element */
html:has(#oneida_form .popup-visible)::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(3px);
    z-index: 9998;
}

/* Commented out for issues with Higher Ed Scrollbars 
 #oneida_form .popup-visible p {
    max-height: 37vh;
    margin-bottom: 15px;
    overflow: auto;
} */

#oneida_form .popup-visible #BusinessTypeDetails {
    max-height: 37vh;
    margin-bottom: 15px;
    overflow: auto;
}

/* Formerly called .popup-content */
#oneida_form .popup-visible .content {
    max-height: 37vh;
    margin-bottom: 15px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 10px;
}

#oneida_form .popup-visible .statements {
    display: block;
    color: darkred;
    margin-bottom: 2px;
    font-weight: 600;
    overflow: auto;
}

#oneida_form .popup-container {
    display: inline-block;
    margin-right: 10px;
    max-width: 25%;
}

#oneida_form .popup-accept {
    background-color: #507f4a;
}

#oneida_form .popup-close {
    position: absolute;
    color: white;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-weight: 700;
    right: 10px;
    top: 10px;
    background-color: darkred;
    border: none;
    font-size: 1.2em;
}

/* Add this CSS to style the modal */
#oneida_form .modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
    padding-top: 60px;
}

#oneida_form .modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

#oneida_form .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

#oneida_form .close:hover,
#oneida_form .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}  

#oneida_form input[id$='_initials'] {
    text-transform: uppercase;
}

#oneida_form .row input[type="checkbox"] {
    height: 1.6rem;
    width: 1.6rem;
    min-width: 26px;
}

#oneida_form .form-header-information {
    display: flex;
    justify-content: center;
}

/* 
Replace Radio Button Styling 
*/

#oneida_form .row input[type="radio"] {
    appearance: none;
    background-color: white;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    cursor: pointer;
    border: 0px solid #31254c;
    outline: 1px solid #31254c;
    outline-offset: -1px;
    transition: 0.025s all linear;
    margin-right: 1px;
    position: relative;
/*     top: 4px; */
}

#oneida_form .row input[type="radio"]:checked {
    outline: 8px solid #31254c;
    outline-offset: -8px;
    box-shadow: none;
}

#oneida_form .row input[type="radio"]:hover {
    box-shadow: -.1em -.1em #31254c, .1em .1em #31254c, .1em -.1em #31254c, -.1em .1em #31254c !important;
}

#oneida_form .row input[type="radio"]:active {
    background-color: white;
    outline: 11px solid #31254c;
    outline-offset: -11px;
}

/* Tooltip header visibility */
#oneida_form .tooltip .tooltiptext h3 {
    color: white;
    text-decoration-line: underline;
}   

/* Tooltip text for instructions*/
#oneida_form .tooltip .tooltiptext.instruction {
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    text-align: left;
    width: 330px;
}

#oneida_form .mobile-close-tooltip {
    visibility: hidden;
}

/***
 *       ▄▄▄▄███▄▄▄▄    ▄██████▄  ▀█████████▄   ▄█   ▄█          ▄████████      ▄████████    ▄████████    ▄████████ 
 *     ▄██▀▀▀███▀▀▀██▄ ███    ███   ███    ███ ███  ███         ███    ███     ███    ███   ███    ███   ███    ███ 
 *     ███   ███   ███ ███    ███   ███    ███ ███▌ ███         ███    █▀      ███    █▀    ███    █▀    ███    █▀  
 *     ███   ███   ███ ███    ███  ▄███▄▄▄██▀  ███▌ ███        ▄███▄▄▄         ███          ███          ███        
 *     ███   ███   ███ ███    ███ ▀▀███▀▀▀██▄  ███▌ ███       ▀▀███▀▀▀         ███        ▀███████████ ▀███████████ 
 *     ███   ███   ███ ███    ███   ███    ██▄ ███  ███         ███    █▄      ███    █▄           ███          ███ 
 *     ███   ███   ███ ███    ███   ███    ███ ███  ███▌    ▄   ███    ███     ███    ███    ▄█    ███    ▄█    ███ 
 *      ▀█   ███   █▀   ▀██████▀  ▄█████████▀  █▀   █████▄▄██   ██████████     ████████▀   ▄████████▀   ▄████████▀  
 *                                                  ▀                                                               
 */
/* Used for shrinking tables on narrow screens to behave like divs that line up vertically */
@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {

    /* Force table to not be like tables anymore */
    #oneida_form table,
    #oneida_form thead,
    #oneida_form tbody,
    #oneida_form th,
    #oneida_form td,
    #oneida_form tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
        #oneida_form thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

        #oneida_form tr {
        margin: 0 0 1rem 0;
    }

        #oneida_form tr:nth-child(odd) {
        background: #ccc;
    }

    #oneida_form td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
    }

    #oneida_form td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: -10px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }

    #oneida_form .radio-container {
        flex-wrap: wrap;
        flex-direction : column-reverse;
    }

    /*
    Label the data
    Each of the tds must have a Name attribute in the HTML for them to be labeled in Mobile
    */
    #oneida_form td::before {
        content: attr(name);
    }

    #oneida_form .checkbox-container {
        flex-direction: column-reverse;
    }

    #oneida_form .tooltip .tooltiptext.instruction {
        width: 80%;
        height:fit-content;
        /* Position the tooltip text */
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-25%, -50%);
      }
      
      /* Tooltip arrow */
    #oneida_form .tooltip .tooltiptext::after {
        display: none;
    }

    #oneida_form .mobile-close-tooltip {
        visibility: visible;
        float:right;
    }
}

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

    #oneida_form .inline-container {
        display: inline-flex;
        flex-direction: column;
        flex-wrap: wrap;
    }
}