﻿.alert.alert-danger.alert-dismissible {
    position: relative; /* Set the position of the alert container to relative */
}

    .alert.alert-danger.alert-dismissible .close.btn {
        color: black; /* Set the color of the close button to black */
        font-size: 12px;
        position: absolute; /* Position the button absolutely */
        top: 0; /* Align the button to the top of the alert container */
        right: 0; /* Align the button to the right of the alert container */
        padding: 2px; /* Add padding for better visibility and clickability */
        padding-right:8px;
    }
.login-save-button {
    background-color: lightgray;
    width: 100%;
    transition: background-color 0.3s; /* Add a smooth transition effect */
    font-size:16px;
    color:black;
}

.login-save-button:hover {
    background-color: #f0f0f0; /* Lighter color on hover */
}

.form-control {
    border-color: black !important;
}

.card-body-no-border {
    border:none;
}

.card-no-border {
    border: none;
}

.card-no-border {
    border: none;
}

.five-hundred-width{
    max-width:500px;
}

.form-full-width{
    width: 100%;
}

.headerColumn {
    flex-direction: row;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

@media (max-width: 576px) {
    .headerColumn {
        flex-direction: row;
        max-width: 100%;
        text-wrap: nowrap;    
    }
    #linkPadding {
     display:none
    }
}

body {
    background-color: #f2f2f2 !important;
}

.main-panel {
    max-width: 1400px;
    margin: 0 auto;
    background-color: white;
    border: 1px solid #ddd; /* Border color */
    padding: 20px !important;
    overflow-y: hidden; /* Enable vertical scrollbar if content exceeds the height */
    margin-bottom: 0px;
    height: auto;
}

.header-panel {
    max-width: 1400px;
    margin: 0 auto;
    background-color: #f2f2f2;
    padding: 20px !important;
}

.footer-panel {
    max-width: 1400px;
    margin: 0 auto;
    background-color: #f2f2f2;
    text-align: center;
    padding: 0px;
}

.header-text-extra-large-grey {
    font-family: Verdana;
    font-size: 28px;
    font-weight: normal;
    font-style: normal;
    color: rgb(96, 96, 96);
    white-space: nowrap;
}

.header-text-large-plus-grey {
    font-family: Verdana;
    font-size: 24px;
    font-weight: normal;
    font-style: normal;
    color: #CC0000;
    white-space: nowrap;
}

.header-text-large-grey {
    color: rgb(96, 96, 96);
    font-family: Verdana;
    font-size: 18px;
    line-height: 22px;
    text-align: left;
    vertical-align: text-top;
    white-space: nowrap;
}

.highlight-ivory {
    background-color: ivory;
    padding: 10px;
}

.logo {
    margin-right: 10px;
}

.padding-div {
    height: 15px;
}
.normal-links,
.normal-links a {
    color: #0645AD;
    font-family: Verdana;
    font-weight: normal;
    font-size: 14px;
    text-decoration: none; /* Remove the default underline */
}

    .normal-links a:hover {
        color: #000000 !important;
        text-decoration: underline !important; /* Add underline on hover */
    }

.top-links {
    color: #333333;
    font-family: Verdana;
    font-weight: normal;
    font-size: 12px;
    float: right;
}

    .top-links a {
        color: #333333;
        font-family: Verdana;
        font-weight: normal;
        font-size: 12px
    }

        .top-links a:hover {
            color: #000000;
            font-family: Verdana;
            font-weight: normal;
            font-size: 12px;
            text-decoration:underline !important;
        }

.small-text {
    font-family: Verdana;
    font-size: 10px;
    font-weight: normal;
    font-style: normal;
    color: #333333;
}

.normal-text {
    font-family: Verdana;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    color: #333333;
}

.normal-text-plus {
    font-family: Verdana;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    color: #333333;
}

label.required:after {
    content: " *";
    color: red;
}

label.required.requirementSatisfied:after {
    content: " ✓"; /* Display a checkmark or any other symbol for requirement satisfied */
    color: green; /* Change the color for requirement satisfied */
}

.characterCountSpan {
    font-size: xx-small;
    font-style: italic;
}

