select.credentials-select {  width:auto; vertical-align: top; }
div.credentials-select-content-inactive { display:none; }
div#credentialsDialog {overflow-y: scroll;}
body.masked {overflow-y: hidden;}
div.include-user-credentials { padding: 0.2em; }
/* adapted from Jenkins' style.css */
.help-content {
    position: relative;
    padding: 1rem;
    margin: 1rem 0;
    word-break: break-word;
    border-radius: 6px;
    z-index: 0;
}

.help-content::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     background: var(--text-color);
     opacity: 0.05;
     z-index: -1;
     border-radius: inherit;
}

.help-content p:first-of-type {
    margin-top: 0;
}

.help-content p:last-of-type {
    margin-bottom: 0;
}

.help-content .from-plugin {
    text-align: right;
    color: #666;
}

.help-content a {
    text-decoration: underline;
}

@media (min-width: 1600px) {
    select.credentials-select {
        max-width: 90%;
    }
}

@media (max-width: 1600px) {
    select.credentials-select {
        max-width: 85%;
    }
}

@media (max-width: 1400px) {
    select.credentials-select {
        max-width: 80%;
    }
}

@media (max-width: 1200px) {
    select.credentials-select {
        max-width: 70%;
    }
}

@media (max-width: 800px) {
    select.credentials-select {
        max-width: 60%;
    }
}

@media (max-width: 767px) {
    select.credentials-select {
        max-width: 75%;
    }
}

@media (max-width: 700px) {
    select.credentials-select {
        max-width: 70%;
    }
}

@media (max-width: 600px) {
    select.credentials-select {
        max-width: 100%; /* force new line */
    }
}