.notice-card {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #f1b0b7;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.notice-header {
    padding: 14px 18px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    background: linear-gradient(135deg, #dc3545, #b02a37);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 15px;
}

.notice-header i {
    color: #fff;
}

/* POPUP BEAUTY */
.popover {
    border: 2px solid #dc3545 !important;
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.25);
    max-width: 420px;
}

.popover-header,
.popover-title {
    background: #dc3545;
    color: #fff;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: 8px 8px 0 0;
}

.popover-body {
    font-size: 13.5px;
    color: #333;
    line-height: 1.5;
}

.popover-body-text {
    padding: 6px;
}







.needs-validation .form-control:valid {
    background-image: none;
}
.img-responsive {
    #display: block;
    #width: 100%;
    #height: auto;
                }
                 .modal-dialog { /* Width */
                         max-width: 100%;
                         width: auto !important;
                         display: inline-block;
                }
                .modal {
                   text-align: center;
                }
                .action-link {
                   color: #007bff;
                   text-decoration: none;
                   font-weight: bold;
                 }

                .action-link:hover {
                      color: #0056b3;
                      text-decoration: underline;
                 }

                 .marquee {
                width: 100%;
                line-height: 20px;
                /*background-color: Pink;*/
                color: red;
                white-space: nowrap;
                overflow: hidden;
                box-sizing: border-box;
            }
            .marquee p {
                display: inline-block;
                padding-left: 100%;
                animation: marquee 20s linear infinite;
            }
            @keyframes marquee {
                0%   { transform: translate(0, 0); }
                100% { transform: translate(-100%, 0); }
            }

            .fakeimg {
                height: 200px;
                background: #aaa;
            }

            .header {
                /*padding: 10px;*/
                text-align: left;
                background: #003471;
                color: white;
                font-size: 25px;

            }