@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* form group headline to title */
.form-title {
    display: flex;
    justify-content: space-between;
    align-items: end;
}

    .form-title > .title {
        white-space: nowrap;
        min-width: 100px;
        color: var(--pcms-blue);
    }

    .form-validation-modelonly > .validation-summary-errors > ul,
    .form-title > .validation-summary-errors > ul {
        padding: 0;
        margin: 0;
    }

        .form-validation-modelonly > .validation-summary-errors > ul > li,
        .form-title > .validation-summary-errors > ul > li {
            border: 1px solid;
            border-radius: 5px;
            padding: 4px 15px;
            background-color: #ec3b5e;
            color: white;
            font-weight: bold;
        }

/* form group validation field */
.form-group > .form-label {
    position: relative;
}

    .form-group > .form-label .field-validation-error {
        position: absolute;
        border: 1px solid;
        background-color: #e6002dc4;
        color: white !important;
        border-radius: 6px;
        font-weight: bold;
        padding: 4px 18px 4px 30px;
        z-index: 10;
        bottom: 3px;
        margin-left: 1rem;
        animation: fadein 0.5s;
        -moz-animation: fadein 0.5s; /* Firefox */
        -webkit-animation: fadein 0.5s; /* Safari and Chrome */
        -o-animation: fadein 0.5s; /* Opera */
    }

        .form-group > .form-label .field-validation-error:after {
            content: "";
            position: absolute;
            top: 9px;
            left: -10px;
            border-width: 5px;
            border-style: solid;
            border-color: transparent #e6002dc4 transparent transparent;
        }

        .form-group > .form-label .field-validation-error:before {
            content: url(../icons/warning0.png);
            transform: scale(0.08);
            width: 100px;
            height: 100px;
            display: inline-block;
            margin: -42px;
            position: absolute;
            top: 0;
            left: 0;
        }

form.form-md .form-group .form-label > label {
    font-size: 15px;
    font-weight: 600;
    color: var(--pcms-blue);
    opacity: 0.8;
}

form.form-md .form-group .form-control {
    height: 30px;
    font-size: 14px;
}