html, body {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    text-size-adjust: auto;
}

body {
    background: #F2F3F4 !important;
}

.hide{
    display:none;
}

.containerBoxEnrollment{
    display:flex;
    
}

#credentialSelectBox{
    
}

.pinBox {
width: -webkit-fill-available;

}

@font-face {
    font-family: "OpenSans600";
    src: url('../fonts/OpenSans-SemiBold.ttf');
    font-display:swap;
}

@font-face {
    font-family: "OpenSans700";
    src: url('../fonts/OpenSans-Bold.ttf');
    font-display:swap;
}

@font-face {
    font-family: "OpenSans400";
    src: url('../fonts/OpenSans-Regular.ttf');
    font-display:swap;
}

@font-face {
    font-family: "OpenSansItalic400";
    src: url('../fonts/OpenSans-Italic.ttf');
    font-display:swap;
    
}

.topFlex {
    display: flex;
    flex-direction: column;
}

div#headermain {
    background-image: linear-gradient(to right, #2980b9 45%, #2c3e50);
    flex: none;
    min-height: 6vh;
    display: flex;
    padding-bottom: 5px;
}

div#headermainindex {
    background-color: #222222;
    flex: none;
    display: inline-table;
    min-height: 4vh;
    
}

div#headermaindashboard {
    background-image: linear-gradient(to right, #2980b9 45%, #2c3e50);
    display: flex;
    flex-direction: row;
    min-height: 6vh;
    padding-bottom: 5px;
}
  

.linksBox {
    display: flex;
    flex-direction: row;
    font-family: "OpenSans600";
    font-size: 14px;
    color: white;
    font-weight: 500;
}

#prettyModal {
    font-family: OpenSans400;
    font-size: 15px;
}

#nbislogomaindashboard {
    background: url(../images/dcsalogo.png) no-repeat;
    background-size: contain;
    color: white;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: unset;
}

.dodImage {
    background: url(../images/dcsalogo.png) no-repeat;
    height: fit-content;
    background-size: contain;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: unset;
    color:white;
}

.dcsaImage {
    background: url(../images/DCSALogo.png) no-repeat;
    height: fit-content;
    background-size: contain;
    color: white;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: none;
    pointer-events: none;
}

.applicationBox{
        min-width: 75vw;
    padding: 30px 0 30px;
    min-height: 50vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.applicationLogo {
    
    height: fit-content;
    background-size: contain;
    color: white;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: none;
    pointer-events: none;
}

#dcsalogomain {
    background: url(../images/DCSALogo.png) no-repeat;
    height: fit-content;
    background-size: contain;
    color: white;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: unset;
    pointer-events: none;
}

#dcsalogomainsmall {
    background: url(../images/DCSALogo.png) no-repeat;
    height: fit-content;
    background-size: contain;
    color: white;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: unset;
    pointer-events: none;
    display: none;
}

#nbislogomain {
    background: url(../images/dcsalogo.png) no-repeat;
    height: 100%;
    background-size: contain;
    color: white;
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 20px;
    text-align: left;
    padding-left: 60px;
    text-decoration: unset;
}

.card-category-5 .per-card-1 .card-content .card-btn button {
    
    background: linear-gradient(to right, #2980b9 45%, #2c3e50);
}

.pageHelp {
    color: white;
    font-family: OpenSans400;
    font-size: 15px;
}

.pageHelpWithHelp {
    color: white;
    font-family: OpenSans400;
    font-size: 15px;
    padding: 25px;
}

.pageHelp:Hover {
    color: white;
    opacity: 75%;
    cursor: pointer;
}

.pageHelpWithHelp:Hover {
    color: white;
    opacity: 75%;
    cursor: pointer;
}

.align-center {
    align-self: center;
}

#img-fluid-custom {
    max-width: 75%;
    height: auto;
    padding-left: 25%;
}

.mainContainer {
    flex: auto;
    
    background-color: #FFFFFF;
}

.mainContainerDashboard {
    flex: auto;
    
    background-color: #FFFFFF;
}

div#mainContainerIndex {
    margin: 0;
}

div#contentContainerIndex {
    background-color: #022B46;
    color: white;
    padding-bottom: 25px;
    padding-left: 25px;
    padding-top: 0px;
    padding-right: 25px;
    min-height: 40vh;
    min-width: 60vw;
}

.errorBanner {
    display: flex;
    flex-direction: row;
    height: 40px;
    padding: 11px 0px 11px 0px;
    background-color: #F5C5C8;
    border: 1px solid #A6020D;
    font-family: OpenSans700;
    font-size: 13px;
    color: #A6020D;
    align-items: center;
    justify-content: center;
}

span#errorBannerText {
    padding-left: 10px;
    font-family: OpenSans400;
}

.successBanner {
    display: flex;
    flex-direction: row;
    height: 40px;
    padding: 11px 0px 11px 0px;
    background-color: #D4EBD9;
    border: 1px solid #D4EBD9;
    font-family: OpenSans700;
    font-size: 13px;
    color: #246534;
    align-items: center;
    justify-content: center;
}

span#successBannerText {
    padding-left: 10px;
    font-family: OpenSans400;
}

.infoBanner {
    display: flex;
    flex-direction: row;
    height: 40px;
    padding: 11px 0px 11px 0px;
    background-color: #C9E1E8;
    border: 1px solid #C9E1E8;
    font-family: OpenSans700;
    font-size: 13px;
    color: #246253;
    align-items: center;
    justify-content: center;
}

a#profileLink.nav-link {
    color: #FFFFFF;
    font-size: 14px;
    font-family: OpenSans400;
    font-weight: 400;
    text-decoration: underline;
}

a#logoutLink.nav-link {
    color: #FFFFFF;
    font-size: 14px;
    font-family: OpenSans400;
    font-weight: 400;
    text-decoration: underline;
}

a#usernameLink.nav-link {
    color: #FFFFFF;
    font-size: 14px;
    font-family: OpenSans400;
    font-weight: 400;
    text-decoration: none !important;
}

span#infoBannerText {
    padding-left: 10px;
    font-family: OpenSans400;
    word-break: break-word;
}

.headerBannerText {
    font-family: OpenSans400;
    font-size: 24px;
    padding-bottom: 10px;
}

.headerBannerTextMedium {
    font-family: OpenSans700;
    font-size: 19px;
    padding-bottom: 10px;
}

.headerBannerTextSmall {
    font-family: OpenSans700;
    font-size: 14px;
}

.headerBannerTextSmallest {
    font-family: OpenSans700;
    font-size: 14px;
}

.contentContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: -webkit-fill-available;
}

.contentContainerDashboard {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 0 25px;
}

.contentContainerTwo {
    background-color: #FFFFFF;
    display: flex;
    flex-direction: column;
    align-items: left;
    font-family: OpenSans600;
    font-size: 16px;
    color: #222222;
    padding-top: 75px;
    padding-left: 400px;
    padding-right: 400px;
    overflow-y: scroll;
    max-height: 400px;
    line-height: 2;
}

.tosContainer {
    display: flex;
    flex-direction: column;
    font-size: 15px;
}

.bannerText ul {
    list-style: none;
    margin: 0; 
    padding: 0;
}
.bannerText li {
    margin: 0.25rem 0;
    padding-left: 0;
}
.bannerText li::before {
    content: "";
}
.bannerText > ul > li {
    padding-left: 0;
}
.bannerText > ul > li::before {
    content: "";
}
.bannerText ul ul > li {
    margin-left: 1.5rem;
}
.bannerText ul ul > li::before {
    content: "-";
}
.bannerText ul ul ul > li {
    padding-left: 3rem;
}
.bannerText ul ul ul > li::before {
    content: "--";
}
.bannerText li + li {
    margin-top: 0.15rem;
}
div#tos {
    width: 80vw;
    align-self: center;
    margin-top: 2em;
    line-height: 2;
    overflow-y: auto;
    font-family: 'OpenSans600';
}

.contentContainerThree {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 50px;
}

.logoImageBox {
    display: flex;
    

    padding-bottom: 5px;
}

.dcsalogolarge {
    background: url(../images/DCSALogo.png) no-repeat;
    background-size: contain;
    height: 175px;
    width: 175px;
    margin-top: 5vh;
}

.dodlogolarge {
    background: url(../images/dcsalogo.png) no-repeat;
    background-size: contain;
    height: 175px;
    width: 175px;
    margin-top: 5vh;
}

.availableSessions{
    
    width:100%;
    max-width:800px;
    text-align-last:center;
    padding-top:50px;
    
}

.nbislogolarge {
    background: url(../images/dcsalogo.png) no-repeat;
    background-size: contain;
    height: 175px;
    width: 175px;
    margin-top: 5vh;
}

.nbislogolargeprocess {
    background: url(../images/dcsalogo.png) no-repeat;
    background-size: contain;
    height: 175px;
    width: 175px;
    margin-top: 5vh;
}

.dcsalogolargeprocess {
    background: url(../images/DCSALogo.png) no-repeat;
    background-size: contain;
    height: 175px;
    width: 175px;
    margin-top: 5vh;
}

#indentTextSmall {
    display: none;
}

.pageBodyText {
    color: #222222;
    font-family: "OpenSans400";
    font-size: 24px;
    margin-top: 15px;
}

.pageBodyTextDashboard {
    color: #172F55;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height:1.375rem;
    margin-bottom:1.25rem;
}

.col {
    font-family: OpenSans700;
    font-weight: 700;
    font-size: 13px;
    color: #555555;
}

div.cardContainer {
    cursor: pointer;
    background-color: #FFFFFF;
    border-radius: 4px;
    padding: 15px 0px 0px 15px;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
    width: 100%;
    min-height: 60px;
    margin-bottom: 10px;
    overflow-x: auto;
}
div.cardContainerDashboard {
    cursor: pointer;
    color: transparent;
      background-image: linear-gradient(to right, #4B79A1 45%, #4B79A1);
    border-radius: 4px;
    padding: 2px 2px 2px 2px;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
    
    margin-right: 100px;
    
    overflow-x: auto;
}
div.cardContainerDashboard:hover {
    background-image: linear-gradient(to right, red 45%, blue);
    
    padding: 2px 2px 2px 2px;
    
}

div.cardContainerNonOwned {
    pointer-events: none;
    background-color: #FFFFFF;
    border-radius: 4px;
    padding: 15px 0px 0px 15px;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
    width: 100%;
    min-height: 60px;
    margin-bottom: 10px;
    overflow-x: auto;
}

#userProfileCard {
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
    padding-bottom: 50px;
    border-radius: 4px;
    margin-top: 25px;
    padding-left: 50px;
    padding-top: 25px;
}

div.cardContainer:hover {
    background-color: #FFFFFF;
    border-radius: 4px;
    padding: 15px 0px 0px 15px;
    box-shadow: 0px 2px 4px 0px black;
    width: 100%;
    min-height: 60px;
}

div#pageBodyTextItalics {
    font-family: "OpenSansItalic400";
    font-size: 13px;
}

div#pageBodyTextItalicsAuthentication {
    font-family: "OpenSansItalic400";
    font-size: 13px;
    padding-bottom: 25px;
    text-align: -webkit-center;
}

div#pageBodyTextItalicsCertEnroll {
    font-family: "OpenSansItalic400";
    font-size: 13px;
}

div#pageBodyTextItalicsForgot {
    font-family: "OpenSansItalic400";
    font-size: 13px;
    text-align-last: center;
}

div#pageBodyTextItalicsForgotShort {
    font-family: "OpenSansItalic400";
    font-size: 13px;
    text-align-last: center;
}

div#pageBodyTextItalicsDashboard {
    font-family: "OpenSansItalic400";
    font-size: 13px;
    margin-bottom: 15px;
}
div#pageBodyTextItalicsDashboardSmall {
    font-family: "OpenSansItalic400";
    font-size: 13px;
    
}
div#pageBodyTextItalicsDashboardHeader{
    font-family: "OpenSansItalic400";
    font-size: 16px;
    padding:30px,0,30px,0;
    
    
}

div#footermain {
    background-color: #FFFFFF;
    flex: none;
    padding-top: 15px;
    padding-bottom: 20px;
}

div#footermainprofile {
    background-color: #FFFFFF;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    padding-top: 15px;
    padding-bottom: 20px;
}

button.primaryButton {
    min-width: 60px;
    height: 38px;
    border: none;
    border-radius: 4px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #357698;
    font-family: OpenSans600;
    font-size: 14px;
    font-weight: 600;
    color: #FFFFFF;
}

button.primaryButton:hover {
    background-color: #264253;
}

button.primaryButton:disabled {
    background-color: #757575;
}

input.secondaryButton {
    border: solid;
    border-width: 2px;
    border-radius: 4px;
    border-color: #357698;
    min-width: 60px;
    height: 38px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #FFFFFF;
    font-family: OpenSans600;
    font-size: 14px;
    font-weight: 600;
    color: #3D4C5F;
}

button.secondaryButton {
    border: solid;
    border-width: 2px;
    border-radius: 4px;
    border-color: #357698;
    min-width: 60px;
    height: 38px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #FFFFFF;
    font-family: OpenSans600;
    font-size: 14px;
    font-weight: 600;
    color: #3D4C5F;
}

button.secondaryButton:hover {
    border-color: #264253;
    color: #207988;
}

button.secondaryButton:disabled {
    border-color: #757575;
    color: #757575;
}

button#selectButtonPrimary {
    margin-top: 35px;
}

button#backButton {
    margin-left: 10px;
}

button#continueButton {
    margin-right: 10px;
}

button#selectCertificateForAuthentication {
    margin-right: 10px;
}

button#loginButton {
    margin-top: 2rem;
    min-width: 10vw;
}

button#removeSession {
    margin-top: 50px;
    margin-left: 125px;
}

div#customFormCheck {
    line-height: normal;
    align-self: center;
    padding-top: 2vh;
}

form#tosForm {
    align-self: center;
}

input#indexCheckBox {
    width: 21px;
    height: 21px;
    margin-right: 7px;
    padding-right: 10px;
    background-color: #FFFFFF;
    border: 1px solid #9194A1;
    border-radius: 2px;
}

input#indexCheckBox:checked {
    width: 21px;
    height: 21px;
    margin-right: 7px;
    background-color: #357698;
}

label#indexCheckBoxLabel {
    padding-left: 10px;
    padding-top: 6px;
}

.userInputTextBox {
    margin-top: 0px;
    border: 1px solid #9194A1;
    border-radius: 4px;
    font-size: 14px;
    font-family: "OpenSans400";
    color: #222222;
    padding: 0px 7px;
    line-height: 38px;
    
    
    
}
.textarea{
        word-break: break-word
}

form#passcodeInputForm{
    width:25%;
}

.userInputTextBoxProfile {
    margin-top: 0px;
    border: 1px solid #9194A1;
    border-radius: 4px;
    font-size: 14px;
    font-family: "OpenSans400";
    color: #222222;
    padding: 0px 7px;
    line-height: 38px;
    width: 400px;
}

.userInputTextBoxReadOnly {
    border: 0;
    margin-top: 0px;
    font-size: 14px;
    font-family: "OpenSans400";
    color: #222222;
    padding: 0px 7px;
    line-height: 38px;
    width: 400px;
}

.userInputBox {
    display: flex;
    flex-direction: column;
}
label#systemPinLab{
    display:inline-flex;
}

div#licensePlate{

    
}
div#driversLicense{

    
    
}
.two-col {
    overflow: hidden;/* Makes this div contain its floats */
}

.two-col .col1,
.two-col .col2 {
    width: 49%;
}

.two-col .col1 {
    float: left;
}

.two-col .col2 {
    float: right;
}

.two-col label {
    display: block;
}

label#userInputTextBoxLabel {
    font-size: 13px;
    font-family: "OpenSans700";
    color: #555555;
    margin-top: 25px;
    display:flex;
    font-weight: normal;
}
label#userInputTextBoxLabelPIN {
    font-size: 13px;
    font-family: "OpenSans700";
    color: #555555;
    margin-top: 25px;
    display:flex;
    font-weight: normal;
    
}


label#userProfileDatatextBoxLabel {
    font-size: 13px;
    font-family: "OpenSans700";
    color: #555555;
    margin-top: 25px;
}

label#passwordInputTextBoxLabel {
    font-size: 13px;
    font-family: "OpenSans700";
    color: #555555;
    font-weight: normal;
}

.userInputTextBox:focus {
    border: 1px solid #03293F;
}

.thisBox{
    display: flex;
    flex-direction:row;
}

.userInputTextBox:hover {
    border: 1px solid #357698;
}

.userInputTextBox:disabled {
    border: 1px solid #9194A1;
}

label#userInputTextBoxReadOnlyLabel {
    margin-top: 15px;
    font-size: 13px;
    font-family: "OpenSans700";
    color: #555555;
}

input#userInputTextBoxReadOnly {
    border: 0;
    pointer-events: none;
    user-select: none;
    font-size: 14px;
    font-family: "OpenSans400";
    font-weight: 400;
    color: #222222;
}

.linkBox {
    display: flex;
    flex-direction: row-reverse;
    width: 25%;
}

.linkBoxSelfServices {
    display: flex;
    flex-direction: row-reverse;
    justify-content:center;
    padding-top: 25px;
}

.linkBoxCert {
    padding-top: 20px;
    width: 200px;
}

.linkBoxCertSelf {
    padding-top:5px;
    
    text-align:-webkit-center;
}

a#link {
    font-family: "OpenSans600";
    font-size: 14px;
    line-height: 4;
    color: #357698;
    font-weight: 500;
    text-decoration: underline;
}

a#linkselfservice {
    font-family: "OpenSans600";
    font-size: 14px;
    line-height: 3;
    color: #357698;
    font-weight: 500;
    text-decoration: underline;
}

a#link:hover {
    font-family: "OpenSans600";
    font-size: 14px;
    line-height: 4;
    color: #357698;
    font-weight: 500;
    text-decoration: underline;
}

a#link:disabled {
    font-family: "OpenSans600";
    font-size: 14px;
    margin-left: 250px;
    line-height: 4;
    color: #757575;
    opacity: 1;
    font-weight: 500;
    text-decoration: underline;
}

#toolTipText {
    color: #A6020D;
    font-family: "OpenSans400";
    font-weight: 400;
    font-size: 11px;
    margin-left: 3px;
    padding-top: 5px;
    max-width: 400px;
}

#toolTipText1 {
    color: #A6020D;
    font-family: "OpenSans400";
    font-weight: 400;
    font-size: 11px;
    margin-left: 3px;
    padding-top: 5px;
    max-width: 400px;
}

#toolTipText2 {
    color: #A6020D;
    font-family: "OpenSans400";
    font-weight: 400;
    font-size: 11px;
    margin-left: 3px;
    padding-top: 5px;
    max-width: 400px;
}

.passwordPolicyTextBox {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    font-family: "OpenSans400";
    font-weight: 400;
    color: #222222;
}

.passwordPolicyTextBoxText {
    font-size: 14px;
    font-family: "OpenSans400";
    font-weight: 400;
    color: #222222;
    max-width: 400px;
}

.headerContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    height: 90px;
    background-color: white;
    padding-left: 20px;
    padding-right: 25px;
    padding-top: 25px;
}

h1#headerContainerText {
    font-size: 24px;
    font-family: OpenSans400;
    font-weight: 400;
    color: #222222;
}

h2 {
    font-size: 20px;
    font-family: OpenSans400;
    font-weight: 400;
    color: #222222;
}

h3 {
     margin: 0px !important;
    font-size: 18px;
    font-family: OpenSans400;
    font-weight: 400;
    color: #222222;
}

#dashboardWelcomeHeader{
        padding: 20px 20px 0 0;
    font-size: 2rem;
     font-weight: 600;
      color: transparent;
      background-image: linear-gradient(to right, #4B79A1 45%, #4B79A1);
       background-clip: text;
       -webkit-background-clip: text;
     
}

.dashboardWelcomeHeader{
    font-size: 2rem;
     font-weight: 600;
      color: transparent;
      background-image: linear-gradient(to right, #4B79A1 45%, #4B79A1);
       background-clip: text;
       -webkit-background-clip: text;
     
}

.flexyBox{
    display:flex;
    flex-direction:row;
}

h3#myForms {
      font-size: 40px;
      padding:20px;
  font-weight: 600;
  background-image: linear-gradient(to right, #2980b9 45%, #2c3e50);
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}

hr#greyLine {
    margin-top: 1rem;
    width: 100%;
    margin-bottom: 1rem;
    border: 0;
    z-index: 1;
    border-top: 2px solid #CED4DB;
    margin-left: 0;
    margin-right: 0;
}

hr#greyLineAuthentication{
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    width: 45%;
    margin-bottom: 1rem;
    border: 0;
    z-index: 1;
    border-top: 2px solid #CED4DB;
    margin-left: 0;
    margin-right: 0;
}

.toolTipBox {
    display: flex;
    flex-direction: row;
}

i#iconTip {
    padding-top: 25px;
}

.tooltip {
    font-size: 6rem;
}

form#submitEntitlementForm {
    width: 100%;
    min-width: 40vw;
    max-height: 350px;
    overflow-y: auto;
}

    
  .grid-stack { background: #FAFAD2; }
  .grid-stack-item-content { background-color: #18BC9C; }

div#nonOwnedEntitlementsDashboard {
    width: 100%;
    min-width: 700px;
    max-height: 50vh;
    overflow-y: auto;
}

form#submitEntitlementFormMultiPersona {
    min-width: 400px;
    min-height: 250px;
    overflow-y: scroll;
    max-height: 350px;
}

.content-table {
    background-color: #FFFFFF;
    padding: 15px 0px 0px 15px;
    border-collapse: collapse;
    border-radius: 4px;
    min-width: 400px;
    width: 100%;
    min-height: 50px;
}

.content-table-agency {
    background-color: #FFFFFF;
    padding: 15px 0px 0px 15px;
    border-collapse: collapse;
    border-radius: 4px;

    width: 100%;
    height:100%;
    min-height: 12vh;
    margin-left:auto;
    margin-right:auto;
}

.content-table-agency thead tr {
    color: #555555;
    text-align: left;
    font-weight: 700;
    font-family: OpenSans700;
    font-size: 13px;
    padding-left: 10px;
    padding-right: 10px;
}

.content-table thead tr {
    color: #555555;
    text-align: left;
    font-weight: 700;
    font-family: OpenSans700;
    font-size: 13px;
    padding-left: 10px;
    padding-right: 10px;
}

.content-table tr td {
    color: #222222;
    text-align: left;
    font-weight: 400;
    font-family: OpenSans400;
    font-size: 14px;
}

.content-table-agency tr td {
    color: navy;
    text-align: left;
    font-weight: 400;
    font-family: OpenSans400;
    font-size: 0.9rem;
    
}

.content-table-agency th {
    padding: 5px;
}

.formNameHead {
    width: 30%;
}

.content-table td:not(.formName) {
    width: 30%;
    word-break: break-word;
    padding-right: 20px;
}

.content-table-agency td:not(.formName) {
    width: 45%;
    word-break: keep-all;
}

#uk-search-default-custom{
    min-width: 30vw;
    
}

.content-table tr td.formName {
    width: 30%;
    font-family: OpenSans400;
    font-weight: 500;
    color: #357698;
    text-decoration: underline;
}

.content-table-agency tr td.formName {
    width: 20%;
    font-family: OpenSans400;
    font-weight: 500;
    color: #357698;
    text-decoration: underline;
}

.content-table th.hiddenTableHeader {
    display: none;
}

.content-table tr td.entitlementSelectionHidden {
    display: none;
}

.content-table-agency th.hiddenTableHeader {
    display: none;
}

.content-table-agency tr td.entitlementSelectionHidden {
    display: none;
}

p.entitlementSelectionHidden {
    display: none!important;
}

form#helpModal {
    padding-top: 25px;
}

.userProfileDataContainer {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-evenly;
}

.passwordPolicyList {
    font-family: OpenSans400;
    font-weight: 400;
    font-size: 15px;
    padding-inline-start: 0px;
    margin-top: 10px;
}

.passwordPolicyListPage {
    font-family: OpenSans400;
    font-weight: 400;
    font-size: 15px;
    padding-inline-start: 40px;
    margin-top: 10px;
}

.passwordPolicyListItem {
    padding-top: 25px;
}

#noApplicationsContainer{
    background-color:aliceblue;
}

@media screen and (min-height: 1200px) {
    .linkBoxCertSelf{
        padding-top:2vh;
        font-size:larger;
    }
    
    div#pageBodyTextItalicsAuthentication {
        font-size:16px;
    }
    
    div#pageBodyText{
        font-size:30px;
    
    }
    .dcsalogolarge{
        height:225px;
        width:225px;
        
    }
    .dodlogolarge{
        height:225px;
        width:225px;
        
    }
    
    button#selectCertificateForAuthentication {
    height: 5vh;
}
    
}

@media(max-width:500px){
    .col-md-4{flex-basis: 100%!important;max-width: 100%!important;}
    #pageBodyTextItalicsDashboard{display: none;}
    .applicationLogo{background-size:25vw!important;}
    .flexyBox{flex-direction:column;}
    #appSearchBox{width:90vw;}
    #dashboardWelcomeHeader{font-size:1.2rem;}
    #appsNavHeader{font-size:1rem!important;}
    .uk-card-title{font-size:1rem!important;}
}


@media(min-width:501px) and (max-width:1366px){
    .col-md-4{
        flex-basis: 33%!important;
        max-width: 33%!important;
        
    }
    #pageBodyTextItalicsDashboard{
        display: none;
    }
    
    
    .applicationLogo{
        background-size:8vw!important;
    }
    
    .cardContainerDashboard{
        margin-right: 50px!important;
        margin-left: 100px!important;
    }
    #appSearchBox{width:50vw;}
    
    
}
@media(min-width:1367px){
    .col-md-4{
        flex-basis: 25%!important;
        max-width: 25%!important;
        
        
    }
    .applicationLogo{
        background-size:7vw!important;
    }
    #appSearchBox{width:60vw;}

.cardContainerDashboard{
    margin-right: 50px!important;
        margin-left: 100px!important;
}   
}

@media screen and (min-width: 2560px) and (min-height:1440px){
    .content-table-agency{
        min-height:14vh;
        
    }
    
}

@media screen and (max-width: 768px) {
    #nbislogomain {
        font-size: 14px;
    }
    #dcsalogomain {
        font-size: 14px;
    }
    #nbislogomaindashboard {
        font-size: 14px;
    }
    h1#headerContainerText {
        font-size: 17px;
    }
    #lastLoginDate {
        font-size: 13px;
    }
    .contentContainerDashboard {
        padding: 5px;
    }
    .userInputTextBoxProfile {
        width: 300px;
    }
    .passwordPolicyList {
        padding-inline-start: 15px;
    }
    #h4header {
        margin-top: 20px;
    }
    #colShrink {
        display: none;
    }
    form#submitEntitlementForm {
        min-width: 300px;
    }
    form#submitEntitlementFormDashboard {
        min-width: 300px;
    }
    .errorBanner {
        padding: 30px;
    }
    .successBanner {
        padding: 30px;
    }
    .infoBanner {
        padding: 30px;
    }
    
    
form#passcodeInputForm{
    width:50%;
}
    
}

@media screen and (max-height: 1000px) {
    .tosContainer {
        font-size: 12px;
    }
    #processPBT {
        padding-bottom: 10px;
    }
    .nbislogolarge {
        margin-top: 3vh;
    }
    .dodlogolarge {
        height: 125px;
        width: 125px;
    }
    .dcsalogolarge {
        height: 125px;
        width: 125px;
    }
    .dodImage {
        font-size: 16px;
    }
    .dcsaImage {
        font-size: 16px;
    }
    .nbislogolargeprocess {
        margin-top: 3vh;
    }
    .dcsalogolargeprocess {
        margin-top: 3vh;
    }
    form#submitEntitlementForm {
        max-height: 150px;
    }
    form#submitEntitlementFormDashboard {
        max-height: 50vh;
    }
    #tos {
        margin-top: 1em;
        line-height: inherit;
    }
    .headerBannerText {
        display: none;
    }
    #contentContainerIndex {
        min-height: 30vh;
    }
    #customFormCheck {
        padding-top: 1vh;
    }
    button#loginButton {
        margin-top: 0.5em;
    }
    .bannerText {
        font-size: 12px;
    }

}

@media screen and (max-height: 800px) {
    .dashboardWelcomeHeader{
        font-size:1.5rem;
        }
        
        #dashboardWelcomeHeader{
        font-size:1.5rem;
            
        }
    
    .nbislogolargeprocess {
        display: none;
    }
    .dcsalogolargeprocess {
        display: none;
    }
    .pageBodyText {
        font-size: 20px;
    }
    div#tos {
        width: 99vw;
    }
    div#tos {
        padding-left: 5vw;
    }
    div#tos {
        max-height: 100vh;
    }
    .content-table tr td {
        font-size:11px;
        font-weight:bold;
        word-break: normal;
        padding-top:1vh;
        text-align:center;
    }
    .content-table td:not(.formName) {
    word-break:normal;
    }
    form#submitEntitlementForm{
        min-width:60vw;
    }
}

@media screen and (max-width: 833px) {
    div#headermainindex {
        display: none;
    }
    .dodlogolarge {
        height: 100px;
        width: 100px;
    }
    .dcsalogolarge {
        height: 100px;
        width: 100px;
    }
    .logoImageBox {
        align-self: center;
    
    }
    .headerImage {
        display: none;
    }
    #dcsalogomainsmall {
        display: block;
    }
    div#headermain {
        justify-content: center;
    }
    .headerBannerTextMedium {
        font-size: 25px;
    }
    .headerBannerTextSmall {
        font-size: smaller;
    }
    .tosContainer {
        font-size: 16px;
    }
    div#tos {
        padding-left: 10vw;
    }
    #indentText {
        display: none;
    }
    #indentTextSmall {
        display: block;
    }
    button#loginButton {
        margin-top: 10vh;
        min-height: 8vh;
        min-width: 50vw;
    }
    .headerBannerTextSmallest {
        display: none;
    }
    .content-table tr td {
        font-size:11px;
        font-weight:bold;
        word-break: normal;
        padding-top:1vh;
        text-align:center;
    }
    .content-table td:not(.formName) {
    word-break:normal;
    }
    form#submitEntitlementForm{
        min-width:60vw;
    }
    .applicationLogo{
        background-size:10vw;
    }
    .bannerText {
        font-size: 16px;
    }
    
    
form#passcodeInputForm{
    width:45%;
}
    
}

@media screen and (max-width: 414px) {
    
form#passcodeInputForm{
    width:75%;
}
    
    hr#greyLineAuthentication{
        width: 90%;
    }
    #indentTextSmall {
        font-size: 20px;
    }
    div#pageBodyTextItalicsForgot {
        font-size: 11px;
    }
    div#pageBodyTextItalicsForgotShort {
        font-size: 11px;
    }
    .pageBodyText {
        font-size: 15px;
    }
    form#submitEntitlementForm {
        max-width: 10vw;
        padding-top: 10vw;
    }
    div#pageBodyTextItalicsForgotShort{
    display:none;
    
}
    .linkBox{
    width:75%;
    }
    .pageBodyText{
        padding-left:5vw;
    }
    .dcsalogolargeprocess{
    display:none;
    }
    .card-category-5 .per-card-1{
    width:60vw;
    }
    .content-table-agency {
    min-width:50vw;
    
    }
    .applicationLogo{
        background-size:40vw;
    }
    .dashboardWelcomeHeader{
        font-size:1.5rem;
    }
}

/* iPhone 6 in portrait & landscape */
@media only screen and (min-device-width : 375px) and (max-device-width
    : 667px) {
}

/* iPhone 6 in landscape */
@media only screen and (min-device-width : 375px) and (max-device-width
    : 667px) and (orientation : landscape) {
}

/* iPhone 6 in portrait */
@media only screen and (min-device-width : 375px) and (max-device-width
    : 667px) and (orientation : portrait) {
}

/* iPhone 6 Plus in portrait & landscape */
@media only screen and (min-device-width : 414px) and (max-device-width
    : 736px) {
}

/* iPhone 6 Plus in landscape */
@media only screen and (min-device-width : 414px) and (max-device-width
    : 736px) and (orientation : landscape) {
}

/* iPhone 6 Plus in portrait */
@media only screen and (min-device-width : 414px) and (max-device-width
    : 736px) and (orientation : portrait) {
}

/* iPhone 5 & 5S in portrait & landscape */
@media only screen and (min-device-width : 320px) and (max-device-width
    : 568px) {
}

/* iPhone 5 & 5S in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width
    : 568px) and (orientation : landscape) {
}

/* iPhone 5 & 5S in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width
    : 568px) and (orientation : portrait) {
}

/* 
  iPhone 2G, 3G, 4, 4S Media Queries
  It's noteworthy that these media queries are also the same for iPod Touch generations 1-4.
*/

/* iPhone 2G-4S in portrait & landscape */
@media only screen and (min-device-width : 320px) and (max-device-width
    : 480px) {
}

/* iPhone 2G-4S in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width
    : 480px) and (orientation : landscape) {
}

/* iPhone 2G-4S in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width
    : 480px) and (orientation : portrait) {
}

/* iPad in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) {
}

/* iPad in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : landscape) {
}

/* iPad in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : portrait) {
}

/* Galaxy S3 portrait and landscape */
@media screen and (device-width: 320px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 2) {
}

/* Galaxy S3 portrait */
@media screen and (device-width: 320px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 2) and (orientation: portrait) {
}

/* Galaxy S3 landscape */
@media screen and (device-width: 320px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 2) and (orientation: landscape) {
}

/* Galaxy S4 portrait and landscape */
@media screen and (device-width: 320px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) {
}

/* Galaxy S4 portrait */
@media screen and (device-width: 320px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
}

/* Galaxy S4 landscape */
@media screen and (device-width: 320px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
}

/* Galaxy S5 portrait and landscape */
@media screen and (device-width: 360px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) {
}

/* Galaxy S5 portrait */
@media screen and (device-width: 360px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
}

/* Galaxy S5 landscape */
@media screen and (device-width: 360px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
}

/* HTC One portrait and landscape */
@media screen and (device-width: 360px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) {
}

/* HTC One portrait */
@media screen and (device-width: 360px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
}

/* HTC One landscape */
@media screen and (device-width: 360px) and (device-height: 640px) and
    (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
}

/*
  iPad 3 & 4 Media Queries
  If you're looking to target only 3rd and 4th generation Retina iPads 
  (or tablets with similar resolution) to add @2x graphics,
  or other features for the tablet's Retina display, use the following media queries.
*/

/* Retina iPad in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (-webkit-min-device-pixel-ratio: 2) {
}

/* Retina iPad in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : landscape) and
    (-webkit-min-device-pixel-ratio: 2) {
}

/* Retina iPad in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : portrait) and
    (-webkit-min-device-pixel-ratio: 2) {
}

/*
  iPad 1 & 2 Media Queries
  If you're looking to supply different graphics or choose different typography 
  for the lower resolution iPad display, the media queries below will work 
  like a charm in your responsive design!
*/

/* iPad 1 & 2 in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (-webkit-min-device-pixel-ratio: 1) {
}

/* iPad 1 & 2 in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : landscape) and
    (-webkit-min-device-pixel-ratio: 1) {
}

/* iPad 1 & 2 in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : portrait) and
    (-webkit-min-device-pixel-ratio: 1) {
}

/* iPad mini in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (-webkit-min-device-pixel-ratio: 1) {
}

/* iPad mini in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : landscape) and
    (-webkit-min-device-pixel-ratio: 1) {
}

/* iPad mini in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width
    : 1024px) and (orientation : portrait) and
    (-webkit-min-device-pixel-ratio: 1) {
}

/* Galaxy Tab 10.1 portrait and landscape */
@media ( min-device-width : 800px) and (max-device-width: 1280px) {
}

/* Galaxy Tab 10.1 portrait */
@media ( max-device-width : 800px) and (orientation: portrait) {
}

/* Galaxy Tab 10.1 landscape */
@media ( max-device-width : 1280px) and (orientation: landscape) {
}

/* Asus Nexus 7 portrait and landscape */
@media screen and (device-width: 601px) and (device-height: 906px) and
    (-webkit-min-device-pixel-ratio: 1.331) and
    (-webkit-max-device-pixel-ratio: 1.332) {
}

/* Asus Nexus 7 portrait */
@media screen and (device-width: 601px) and (device-height: 906px) and
    (-webkit-min-device-pixel-ratio: 1.331) and
    (-webkit-max-device-pixel-ratio: 1.332) and (orientation: portrait) {
}

/* Asus Nexus 7 landscape */
@media screen and (device-width: 601px) and (device-height: 906px) and
    (-webkit-min-device-pixel-ratio: 1.331) and
    (-webkit-max-device-pixel-ratio: 1.332) and (orientation: landscape) {
}

/* Kindle Fire HD 7" portrait and landscape */
@media only screen and (min-device-width: 800px) and (max-device-width:
    1280px) and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* Kindle Fire HD 7" portrait */
@media only screen and (min-device-width: 800px) and (max-device-width:
    1280px) and (-webkit-min-device-pixel-ratio: 1.5) and (orientation:
    portrait) {
}

/* Kindle Fire HD 7" landscape */
@media only screen and (min-device-width: 800px) and (max-device-width:
    1280px) and (-webkit-min-device-pixel-ratio: 1.5) and (orientation:
    landscape) {
}

/* Kindle Fire HD 8.9" portrait and landscape */
@media only screen and (min-device-width: 1200px) and (max-device-width:
    1600px) and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* Kindle Fire HD 8.9" portrait */
@media only screen and (min-device-width: 1200px) and (max-device-width:
    1600px) and (-webkit-min-device-pixel-ratio: 1.5) and (orientation:
    portrait) {
}

/* Kindle Fire HD 8.9" landscape */
@media only screen and (min-device-width: 1200px) and (max-device-width:
    1600px) and (-webkit-min-device-pixel-ratio: 1.5) and (orientation:
    landscape) {
}

/* Laptops non-retina screens */
@media screen and (min-device-width: 1200px) and (max-device-width:
    1600px) and (-webkit-min-device-pixel-ratio: 1) {
}

/* Laptops retina screens */
@media screen and (min-device-width: 1200px) and (max-device-width:
    1600px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution:
    192dpi) {
}

/* Apple Watch */
@media ( max-device-width : 42mm) and (min-device-width: 38mm) {
}

/* Moto 360 Watch */
@media ( max-device-width : 218px) and (max-device-height: 281px) {
}