hubl/src/styles/layout/events/events.scss

#events, #circle-events {
    width: 100%;
    font-family: "Facit";
    font-weight: 400;
    color: #7A7F85;
    solid-event {
        .red-button,
        .event-type {
            background-color: #C4262E;
        }
        .black-button {
            background-color: #3A3A3A;
            margin-left: 10%;
        }
        .event-type,
        .event-place-name {
            font-weight: 700;
        }
        #listevents, #circle-listevents {
            [name="name"],
        solid-display-link-event .mdi::before {
            color:  #C4262E;
        }
    }
        .event-place-name,
        .nextevent-startdate,
        solid-display-link-event {
            color: #3A3A3A;
        }
        .sib-event {
            font-family: "Facit";
            font-weight: 400;
            .page-title {
                font-family: "RefrigeratorDelxW01Bold";
                font-size: 3.2rem;
                line-height: 3.8rem;
                color: #063B5C;
            }
        }
        #listevents,
        #circle-listevents {
            .newtype .button{
                font-size: 1.2rem;
                width: max-content;
                height: max-content;
                padding: 5px 20px;
                color: #063B5C;
            }
            solid-form solid-form-dropdown{
                label div {
                    height: 2.5rem;
                }
                &::before {
                    font-family: "RefrigeratorDelxW01Bold";
                    font-size: 2.4rem;
                    line-height: 29px;
                    color: #063B5C;
                    top: -40px;
                    content: "Research an event";
                }
            }
            [name="name"] {
                font-family: "RefrigeratorDelxW01Bold";
                font-size: 2.2rem;
                line-height: 2.6rem;
                letter-spacing: 0.32px;
                color: #063B5C;
                padding: 5px;
                max-width: 250px;
                margin: 5px auto;
            }
            .event-type {
                font-size: 1.1rem;
                padding: 5px 20px;
                width: max-content;
                height: max-content;
            }
            solid-display-location-events {
                padding: 5px;
            }
        }
        #eventdetail {
            [name="name"] {
                font-family: "RefrigeratorDelxW01Bold";
                font-size: 3.2rem;
                line-height: 3.8rem;
            }
                color: #063B5C;
            solid-display div .event-type {
                width: max-content;
                padding: 5px 20px; 
            }
            [name="longDescription"] p {
                font-size: 1.6rem;
                line-height: 2.6rem;
            }
            solid-display-link-event a {
                font-size: 1.6rem;
            }
        }
        #newevent input[type="submit"], 
        #newtype input[type="submit"],
        button {
            width: max-content;
            padding: 5px 20px; 
        }
    }
    @media (max-width: 991px) {
        #listevents {
            margin-top: 65px;
        }
    }
}
.with-sidebar nav > solid-router > ul [name="circle-events"]{
    li::before {
        content: '';
        height: 40px;
        width: 40px;
        mask: url('/images/appointment.svg') center no-repeat;
        mask-size: contain;
        -webkit-mask: url('/images/appointment.svg') center no-repeat;
        -webkit-mask-size: contain;
        background-color: var(--color-right-menu-text);
    }
    &[active] li::before {
        background-color: var(--color-right-menu-active-text);
    }
}