:root {
    --sg-primary: #037d36;
    --sg-secondary: #222222;
}

/* override bootstrap alert */
.sg-alert {
    background: var(--sg-primary);
    color: white;
    margin:8px auto;
}

.badge-sg {
    background: var(--sg-primary);
    color: white;
}

.sg-notification-unread {
    background: #f4f3ef;
}

.sg-notification-read {
    /**  **/
}

.sg-shake-bell {
    animation: shakeBell .5s infinite ease-in-out;
    color: #68B3C8;
}

.sg-scrollable ::-webkit-scrollbar {
    width: 12px;
}

.sg-scrollable ::-webkit-scrollbar-track {
    background:#f5f5f5;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}

.sg-scrollable ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px var(--sg-primary);;
}

#beamerSelector {
    background-color: var(--sg-primary) !important;
}

@keyframes shakeBell {
    0%,
    100% {
        transform: rotate(0deg);
    }
    10%,
    40% {
        transform: rotate(15deg);
    }
    40%,
    60% {
        transform: rotate(0deg);
    }
    60%,
    90% {
        transform: rotate(-15deg);
    }
}

footer .main-footer h3 {
    color:white !important; /** Important required to override general font styles from website editor tool **/
}

footer .main-footer a {
    color: white !important; /** Important required to override general font styles from website editor tool **/
    text-decoration:none;
}

footer .main-footer a:hover {
    color: white !important; /** Important required to override general font styles from website editor tool **/
    text-decoration:none;
}

footer .main-footer {
    padding: 3em;
}

@media(min-width: 768px) {
    footer .main-footer {
        padding: 3em 5em;
    }
}

footer #footerBottomSection {
    background: #0000004a;
}