@font-face {
    font-family: "Quicksand-Bold";
    src: url(../Fonts/Quicksand-Bold.woff2);
}

@font-face {
    font-family: "Quicksand-Regular";
    src: url(../Fonts/Quicksand-Regular.woff2);
}

@font-face {
    font-family: "Quicksand-Medium";
    src: url(../Fonts/Quicksand-Medium.woff2);
}

body {
    font-family: "Quicksand-Regular", Arial, Helvetica, sans-serif !important;
    color: #121212;
    background-color: #F4F4F4;
}

h3 {
    font-family: "Quicksand-Bold", Arial, Helvetica, sans-serif !important;
    color: #005596 !important;
}

.section {
    background-color: #FFFFFF !important;
}

.ContentTable-Account {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0px;
    background-color: #F4F4F4;
}

.account-label { padding-left:0px; padding-top: 10px; }

html a {
    color: #005596 !important;
    text-decoration: none !important;
    font-family: "Quicksand-Regular", Arial, Helvetica, sans-serif !important;
}

.account-box { padding: 15px; }

p {
    word-break: break-word;
    font-family: "Quicksand-Regular", Arial, Helvetica, sans-serif !important;
    font-weight:300 !important;
    font-size:12pt !important;
    line-height:1;
}

.section-label-group li { font-size:9pt !important; list-style-type:disc !important;}

ul li::marker {
    color: black !important;
}

.section-subheader {
    color:black !important;
    font-size:11pt !important;
}

.required-indicator {
    color: #666666 !important;
}

.bar:before, .bar:after {
    background: #005596 !important;
}

.statusMessage-error {
    background-color: #f7911d !important;
}

.statusMessage-success {
    background-color: #74B23B !important;    
}

    .statusMessage-success span {
        color: white !important;
        font-weight:normal;
    }

.helpRequestTitle {
    font-size: 15px !important;
    color: white !important;
    margin-top: 15px !important;
    display: inline-block !important;
    font-family:Arial !important;
}

#btnCloseHelp {
    font-size: 15px !important;
    color: white !important;
}

.btn, .appButton, .appButton:hover {
    width: 220px;
    color: #FFFFFF !important;
    background-color: #005596 !important;
    font-weight: 400 !important;
    font-family: "Quicksand-Bold", Arial, Helvetica, sans-serif !important;
    font-size: 13pt !important;
    clip-path: none !important;
    letter-spacing: normal !important;
}

.btn {
    padding: 0px !important;
}

.appButton, .appButton:hover {
    margin: 0px 3px 0px 3px !important;
    background-image: none !important;
    border-radius: 0px !important;
    border:none !important;
    height: unset !important;
    padding: 12px 24px !important;
}




    .btn span, .btnLarge span {
        font-weight: 400;
        font-family: "Quicksand-Bold", Arial, Helvetica, sans-serif !important;
        text-shadow: 0px 0px #4B7426;
    }

.btn:hover, .btn:focus {
  background-color: #0175CC;
}

div.passwordOnly div { display:none; }
div.passwordOnly div.divPassword, div.passwordOnly div.divPassword div { display:block; }

div.passwordOnly div.divPassword div.section-label-group { margin-top:0px; }

div.divPassword p, div.divPassword ul { font-size:10pt; }

#divHelpRequestFormHeader { background-color: #005596; }

#footer { background-color: #005596 !important; }

input.hasError, textarea.hasError, select.hasError {
    border-bottom: 1px solid #F7921E !important;
} 

span.error {    
    color:#F7921E;    
}

label {
    color:#444 !important;
}

input[type='file'] ~ label, input[type='file']:valid ~ label, input[type='file']:empty ~ label {    
    color:#005596 !important; 
    font-weight:normal !important;    
}

/* active state */
input:focus ~ label, input:valid ~ label, select:focus ~ label, select.hasValue ~label, textarea:focus ~ label, textarea:valid ~ label, span.staticValue ~label {    
    color:#005596 !important;    
    font-weight:normal !important;    
}

#divLoginBox { height:545px; }
#divLoginLeft { float:left;width:50%;border-right:1px solid lightgrey; }
#divLoginRight {float:left;width:45%;margin-left:10px;}

/* Track */
::-webkit-scrollbar-track {
    background-color: silver;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background-color: #005596;
    border-radius: 33px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background-color: #005596;
    }

#footer {
    color: white !important;
    font-family: Roboto, Arial, "Helvetica Neue", sans-serif !important;
}

@media only screen and (max-width: 960px) 
{
    #divLoginBox { height:600px; } 
}

@media only screen and (max-width: 767px) and (min-width: 480px) 
{
    #divLoginBox { height:100%; }
    #divLoginLeft { float:none;width:100%;border-right:none; }
    #divLoginRight {float:none;width:100%;margin-left:0px;margin-top:25px;}
}

@media only screen and (max-width: 479px)
{
    #divLoginBox { height:100%; }
    #divLoginLeft { float:none;width:100%;border-right:none; }
    #divLoginRight {float:none;width:100%;margin-left:0px;margin-top:25px;}
}

@media only screen and (max-width:400px) {
    
    #divLoginBox { height:100%; }
    #divLoginLeft { float:none;width:100%;border-right:none; }
    #divLoginRight {float:none;width:100%;margin-left:0px;margin-top:25px;}
 
}

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

    #divLoginBox { height:100%; }
    #divLoginLeft { float:none;width:100%;border-right:none; }
    #divLoginRight {float:none;width:100%;margin-left:0px;margin-top:25px;}
    .section { padding: 10px 5px 10px 10px; }
 
}