.system-notification.row {
    margin-right: 0;
}

.tal-css {
    display: flex; /* or display: grid */
    gap: 8px;
}

    .tal-css .row {
        min-width: 0; /* critical for flex/grid */
        white-space: normal;
        overflow-wrap: anywhere;
        margin-right: -15px;
        margin-left: -15px;
    }

    .tal-css .container, .tal-css .container-fluid {
        margin-right: auto;
        margin-left: auto;
        padding-right: 15px;
        padding-left: 15px;
        width: 100%;
    }

.system-notification {
    background-color: #2fb3b6;
    box-shadow: 0 2px 3px 0 #dedede;
    border: 1px solid #f3f3f3;
    min-height: 72px;
    padding-top: 20px;
}

.tal-css b, .tal-css strong {
    font-weight: 700;
}

.system-notification .width-50 {
    width: 50px;
}

.system-notification .no-padding {
    padding-right: 0;
    padding-left: 0;
}

.tal-css .col-xs-1 {
    width: 8.33333333%;
}

.tal-css .text-right {
    text-align: right;
}

.tal-css .btn-group > .btn-group, .tal-css .btn-toolbar .btn, .tal-css .btn-toolbar .btn-group, .tal-css .btn-toolbar .input-group, .tal-css .col-xs-1, .tal-css .col-xs-10, .tal-css .col-xs-11, .tal-css .col-xs-12, .tal-css .col-xs-2, .tal-css .col-xs-3, .tal-css .col-xs-4, .tal-css .col-xs-5, .tal-css .col-xs-6, .tal-css .col-xs-7, .tal-css .col-xs-8, .tal-css .col-xs-9, .tal-css .dropdown-menu {
    float: left;
}

b, strong {
    font-weight: bold;
    font-family: "Pluto Sans", Arial, Helvetica, sans-serif;
    font-weight: 700;
}

.system-notification .padding-bottom-10 {
    padding-bottom: 10px;
}

.system-notification .padding-top-4 {
    padding-top: 4px;
}

.system-notification .notification-text {
    font-size: 16px;
    letter-spacing: -.2px;
    text-align: left;
    color: #fff;
    padding-left: 10px;
}

.notification-text a {
    color: white !important; /* Default link color */
}

    .notification-text a:hover {
        color: rgb(128, 195, 66); /* Color on hover */
        background-color: white;
    }


.main-settings .listings .listing h4, .main-settings .listings .listing pre, .main-settings h1, .system-notification .close-notification, .system-notification .notification-text {
    font-family: "Pluto Sans",Arial,Helvetica,sans-serif;
}

.system-notification .close-icon {
    width: 20px;
    height: 20px;
    margin-top: 8px;
    cursor: pointer;
}

.tal-css img {
    border: 0;
    vertical-align: middle;
}

.tal-css *, .tal-css :after, .tal-css :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@media (max-width: 600px) {

    .system-notification .notification-text {
        font-size: 12px;
        letter-spacing: -.2px;
        text-align: left;
        color: #fff;
        padding-left: 5px;
    }

    .notification-text a {
        font-size: 12px; /* Adjust to your preferred size */
    }
}


@media (max-width: 440px) {
    .system-notification .notification-text {
        font-size: 10px;
        letter-spacing: -.2px;
        text-align: left;
        color: #fff;
        padding-left: 3px;
    }

    .notification-text a {
        font-size: 12px; /* Adjust to your preferred size */
    }
}