/* CSS Document */

#applicationSaved {
    background: url("/include/system/tools/images/appSaved.png") no-repeat top
        left;
    padding-left: 8em;
    height: 8em;
}
#enrollmentCompleteContent {
    background: url("/images/createCompany.png") no-repeat top left;
    padding-left: 14em;
    height: 9em;
}
#problemsInAppImage {
    background: url("/images/appProblem.gif") no-repeat left top;
    padding-left: 8em;
    min-height: 7em;
}
#problemsInApp p {
    margin: 0.5em auto 1em 1.5em;
}
#problemsInApp {
    margin: 0 1em 1em 1em;
    overflow: hidden;
}
.fieldIsGood {
    color: #000;
}
/* .fieldIsGood span {visibility:hidden} */

form#application * li {
    vertical-align: middle;
    margin: 0px;
}

.fieldIsBad {
    color: #ff0000;
}
.fieldIsBad span {
    visibility: visible;
    margin-left: 1em;
    height: 1.2em;
    padding-left: 1.5em;
    float: none;
    background: transparent url("/images/mainsite/icon_err.gif") no-repeat;
}
/* Legacy app id's */
#basicInformation,
#secureInformation {
    float: left;
}

#basicInformation {
    background: url("/images/ssl-comodo.gif") no-repeat left top;
}

/* End legacy app id's */

/* Employment Information */
#employmentInfo {
    background: url("/images/ssl-comodo.gif") no-repeat left top;
}

#employmentInfo {
    float: left;
}

#employmentPreferences div ul label {
    width: 22em;
    margin-top: 0.25em;
}
#employmentPreferences div ul li input {
    width: 1em;
    margin: 2px 0 0 2em;
}
#employmentPreferences div ul li {
    display: inline-table;
    padding: 0.25em 0.15em 0.25em;
    vertical-align: middle;
    float: left;
}
#employmentPreferences div ul {
    clear: both;
}

#workConvictionExplain,
#additionalInfo {
    height: 6em;
}

.helpText {
    font-style: italic;
    vertical-align: middle;
    padding-top: 0.5em;
    padding-left: 1em;
    color: #999999;
}
.morehelpText {
    display: block;
    clear: both;
    font-style: italic;
    color: #999999;
    padding-top: 0.2em;
}
form#application * input,
form#application * label,
form#application * select,
.helpText {
    float: left;
    margin: 0 0.2em 0.8em;
    vertical-align: middle;
}
form#application * label,
form#application * select {
    height: 1.4em;
}
form#application * select {
    width: 10em;
    clear: none;
}
form#application * input {
    width: 30em;
}
form#application * label {
    width: 20em;
}
form#application * p {
    display: block;
    clear: both;
    vertical-align: middle;
}

form#application * .halfSized {
    width: 15em;
}
form#application * .thirdSized {
    width: 10em;
}

div#AuthType {
    clear: both;
}
div#AuthType ul li {
    display: block;
    clear: both;
    float: left;
}
#alienNumber {
    width: 20em;
}

/* skills selection */
#letsScrollMore,
#letsScroll {
    min-height: 50em; /* overflow:auto; */
}

div.selectskillsubgroup,
div.hideskillsubgroup div.subcategory,
div.selectskillgroup,
div.hideskillgroup div.category {
    margin-left: 0.8em;
    padding-left: 1em;
    clear: both;
    background: url("/images/plus.png") no-repeat;
    cursor: pointer;
    border-top: 1px solid #fcfcfc;
}

div.selectskillgroup,
div.selectskillsubgroup {
    background-position: 0px 12px;
}
div.selectskillgroup:hover,
div.selectskillsubgroup:hover {
    background-color: #ebf4fa;
}

div.hideskillgroup div.category,
div.hideskillsubgroup div.subcategory {
    background-position: 0px -60px;
    background-color: #f0ffff;
}
div.hideskillgroup div:hover,
div.hideskillsubgroup div:hover {
    background-color: #ebf4fa;
}

#employmentReferences div ul {
    clear: both;
}
#employmentReferences div ul li {
    display: inline;
    float: left;
}
#employmentReferences div ul label {
    width: 12em;
}
#employmentReferences div ul input {
    width: 16em;
}

#skillsInformation div p,
#skillsInformationTwo div p,
#skillsInformationMore div p {
    font-size: larger;
    font-weight: bold;
    padding: 1em 1.45em 0.5em;
}
#skillsInformation div ul,
#skillsInformationTwo div ul,
#skillsInformationMore div ul {
    clear: both;
    display: block;
    margin-left: 3em;
}
#skillsInformation div li,
#skillsInformationTwo div li > li,
#skillsInformationMore div li > li {
    display: block;
    float: left;
    width: 58em;
}

/* form w4 info */
table.w4 {
    margin-left: 2.4em;
}
table.w4 tr td {
    padding: 0.2em 1em 1em 0;
    vertical-align: middle;
    text-align: left;
}
table.w4 tr td.exemption input {
    float: none !important;
    clear: none;
    width: 3em !important;
}
table.w4 tr td.instruct {
    width: 66em;
}
table.w4 tr td.instruct ul li {
    margin-left: 2em;
    list-style: circle;
}

fieldset.w4info {
    border: none;
    margin: 2em 2em 1em;
}
fieldset.w4info legend {
    padding: 0 0.2em 0.6em;
    font-weight: bold;
}
fieldset#w4more input {
    width: 4em;
    float: left;
    clear: left;
}
fieldset#w4info input {
    width: 2em;
}

fieldset#w4oneandtwo input,
fieldset#w4oneandtwo label {
    width: 20em;
    clear: left;
}

fieldset#w4oneandtwo input {
    margin: 0 0 1em 2.2em;
}
fieldset#w4oneandtwo label {
    margin: 0 0 0 2.4em;
}

fieldset#w4oneandtwo input#middleinit {
    width: 5em;
}
fieldset#w4ssn input {
    width: 15em;
    margin: 0 0 1em 2.2em;
}

fieldset#w4sign input {
    margin: 0 0.1em 0 0;
    width: 1em;
}

fieldset#w4info label {
    width: 50em;
}
fieldset#w4more label {
    width: 50em;
    float: left;
}
fieldset#w4sign label {
    display: block;
    float: right;
    text-align: left;
    width: 55em;
    padding: 0 0 1.6em;
}

fieldset.w4info label {
    display: block;
    clear: right;
    text-align: left;
}

fieldset.w4info ol {
    margin: 0;
    padding: 0;
}
fieldset.w4info li {
    list-style: none;
    padding: 5px;
    margin: 0;
    clear: both;
}

fieldset#emergencycontact ul {
    width: 55em;
    display: block;
}
fieldset#emergencycontact li {
    width: 25em;
    height: 3em;
    display: inline;
    float: left;
    clear: right;
}

fieldset#emergencycontact input {
    width: 20em;
    clear: both;
    float: left;
}
fieldset#emergencycontact label {
    padding: 0;
    margin: 0;
    width: 10em;
    clear: both;
    float: left;
}

fieldset.applicationWorkHistory {
    border: none;
    margin: 1em;
    width: 60em;
    height: 33em;
}
fieldset.applicationWorkHistory legend {
    padding: 0 0.2em 0.6em;
    font-weight: bold;
}

#bottomAppNav {
    padding: 1em 1em 1em 1em;
    width: 62em;
}
#leftAppNav {
    float: left;
    width: 19em;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}
#rightAppNav {
    float: right;
    width: 16em;
}

#rightAppNav a.squarebutton {
    float: right;
}
table.w4whatifs tr td ul li {
    list-style: circle;
    margin: 0 0 0.4em;
}

fieldset.applicationWorkHistory li {
    width: 30em;
    height: 3.8em;
    display: inline;
    float: left;
    clear: right;
}

fieldset#applicationWorkHistoryOne input,
fieldset#applicationWorkHistoryTwo input,
fieldset#applicationWorkHistoryThree input {
    padding: 0;
    width: 25em;
}

fieldset#applicationWorkHistoryOne label,
fieldset#applicationWorkHistoryTwo label,
fieldset#applicationWorkHistoryThree label {
    padding: 0em;
    margin: 0;
    text-align: left;
    width: 28em;
}

li.JobDutiesAndEnd textarea {
    height: 7em;
    border: 1px inset;
    width: 25em;
}

form#application div#attachResume div.mb div ul li input {
    height: 2em !important;
}

div.applicationWorkHistory ul {
    clear: both;
}
div.applicationWorkHistory p input {
}
div.applicationWorkHistory ul li {
    display: inline;
    float: left;
}
div.applicationWorkHistory ul li input {
    width: 15em !important;
}
div.applicationWorkHistory ul li label {
    width: 15em !important;
}

div.notes {
    float: right;
    width: 12em;
    height: auto;
    margin: 1em 1em 1em 1em;
    padding: 5px;
    border: 1px solid #666666;
    background-color: #ffffe1;
    color: #666666;
    font-size: 88%;
}

div.notes h4 {
    background-image: url("/images/forms/icon_info.gif");
    background-repeat: no-repeat;
    background-position: top left;
    padding: 3px 0 3px 2.6em;
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: #666666;
    color: #666666;
    font-size: 110%;
}

div.notes p {
    margin: 0em 0em 1.2em 0em;
    color: #666666;
}

div.notes p.last {
    margin: 0em;
}

span.checkbox {
    width: 19px;
    height: 25px;
    padding: 0 5px 0 0;
    margin: -5px 0 0;
    background: url("/images/forms/checkbox.gif") no-repeat;
    display: block;
    clear: left;
    float: left;
}
span.radio {
    width: 19px;
    height: 25px;
    padding: 0 5px 0 0;
    margin: -5px 0 0;
    background: url("/images/forms/radio.gif") no-repeat;
    display: inline;
    clear: left;
    float: left;
}

span.select {
    position: absolute;
    width: 208px; /* With the padding included, the width is 190 pixels: the actual width of the image. */
    height: 21px;
    padding: 0 24px 0 8px;
    color: #fff;
    font: 12px/21px arial, sans-serif;
    background: url("/images/forms/select.gif") no-repeat;
    overflow: hidden;
}

#unemploymentLaw p,
#policesAndProcedures p {
    padding: 0 1.4em 1em 2.2em;
    text-align: left;
}
#unemploymentLaw h2 {
    font-size: 1.6em;
    font-weight: bold;
    background: none;
    color: #333333;
    width: 100%;
    padding: 0 0.8em 0.2em;
}
#unemploymentLaw ul li {
    margin: auto 4em;
}
#unemploymentLaw ul li li,
#unemploymentLaw ul li {
    list-style: none;
    list-style-type: none;
    margin-left: 1em;
    margin-bottom: 1em;
}

ol.policies {
    list-style-type: georgian;
}

div#unemploymentLaw div.mb ul li,
div#unemploymentLaw div.mb ul li ul li {
    display: inline;
}

div#unemploymentLaw div.mb ul li ul li {
    display: block;
    padding-left: 1.4em;
}
div#unemploymentLaw div.mb ul li ul li ul li {
    padding-left: 1.8em;
}

#agree2noncompete,
#agree2safety,
#agree2sexual,
#agree2applicant,
#agree2drug,
#agree2unemployment,
#agree2pandp {
    border: none;
    background: none;
}

ul.violation li {
    list-style: circle;
}
#unemploymentLaw * h2 {
    clear: both;
    margin: 1em 0 0 0;
}
.legalVerbiage {
    margin: 1em 2em 1em 1em;
    padding: 0.8em;
    overflow: auto;
    width: 58em;
    height: 200px;
    background-color: #fff8d1;
    border: 1px solid #a8a8a8;
}

.agree {
    width: 1.6em;
}

#empAppNav {
    display: block;
    clear: both;
    width: auto;
    height: 3.6em;
    padding: 0 0 0 1em;
}

#empAppNav ul {
    display: block;
}
#empAppNav li {
    border: 1px solid #0000cc;
    background: #0000ff;
    padding: 1px;
    margin: 0em 0.2em 1.2em;
    display: inline;
    float: left;
}
#empAppNav a {
    border: 1px solid #ffffff;
    width: 9.4em;
    display: block;
    height: 1.4em;
    color: #ffffff;
    vertical-align: middle;
    text-align: center;
    padding: 0.2em 0;
}
#empAppNav li:hover {
    background: #00cc00;
}

#empAppNav li.selected {
    border: 1px solid #0000cc;
    background: #00cc00;
    padding: 1px;
    margin: 0em 0.2em 1em;
    display: inline;
    float: left;
}

@media (max-width: 640px) {
    /* Radio groups: stack options vertically */
    form#application ul {
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }
    form#application ul li {
        display: block;
        float: none !important;
        clear: both;
        width: auto !important;
        height: auto !important;
    }
    form#application ul input[type="radio"] {
        float: none;
        width: auto;
        display: inline-block;
        vertical-align: middle;
        margin-right: 0.4em;
    }
    form#application ul label {
        float: none;
        width: auto;
        display: inline;
    }

    /* Skills preferences checkboxes: preserve wrapping inline layout */
    #employmentPreferences div ul {
        display: block;
        flex-direction: unset;
    }
    #employmentPreferences div ul li {
        display: inline-table !important;
        float: left !important;
        width: auto !important;
        height: auto;
    }

    /* Text/select inputs on <p> rows: full-width stacked */
    form#application p input:not([type="radio"]):not([type="checkbox"]),
    form#application p select,
    form#application p textarea {
        width: 100%;
        box-sizing: border-box;
        float: none;
    }
    form#application p label {
        display: block;
        float: none;
        width: 100%;
    }

    /* Work history fieldsets */
    fieldset.applicationWorkHistory {
        width: 100%;
        box-sizing: border-box;
        height: auto;
    }
    fieldset.applicationWorkHistory li {
        display: block !important;
        float: none !important;
        width: 100% !important;
        height: auto !important;
    }
    fieldset#applicationWorkHistoryOne input,
    fieldset#applicationWorkHistoryTwo input,
    fieldset#applicationWorkHistoryThree input,
    fieldset#applicationWorkHistoryOne label,
    fieldset#applicationWorkHistoryTwo label,
    fieldset#applicationWorkHistoryThree label {
        width: 100%;
        box-sizing: border-box;
    }

    /* Bottom navigation */
    #bottomAppNav {
        width: 100%;
        box-sizing: border-box;
    }
    #leftAppNav,
    #rightAppNav {
        float: none;
        width: 100%;
        text-align: left;
    }
    #rightAppNav a.squarebutton {
        float: none;
    }

    /* Step tabs: wrap instead of overflowing off-screen */
    #empAppNav {
        height: auto;
        overflow: visible;
    }
    #empAppNav ul {
        display: flex;
        flex-wrap: wrap;
        gap: 2px;
    }
    #empAppNav li,
    #empAppNav li.selected {
        float: none;
        margin: 0;
    }
    #empAppNav a {
        width: auto;
        font-size: 0.85em;
        padding: 0.2em 0.4em;
    }
}