.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 950px;
    background: white;
    border-radius: 0px;
    /*border: solid 1px;*/
}


.divider:after,
.divider:before {
    content: "";
    flex: 1;
    height: 1px;
    background: #eee;
}

.h-custom {
    height: calc(100% - 73px);
}

@media (max-width: 450px) {
    .h-custom {
        height: 100%;
    }
}

.container {
    position: relative;
    width: 90vw;
    height: 90vh;
    margin: auto;
}

.element {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 50vw;
    height: 50vh;
    text-align: center;
    padding: 50vw 0;
    font-size: xx-large;
}

/* Fallback styling for sidebar nav */
.sps-nav-shell .mud-nav-link,
.sps-nav-shell .mud-nav-group .mud-nav-group-text,
.sps-nav-shell .mud-nav-group .mud-nav-link {
    border-radius: 12px;
    transition: all 0.22s ease;
}

.sps-nav-shell .mud-nav-link:hover,
.sps-nav-shell .mud-nav-group .mud-nav-group-text:hover,
.sps-nav-shell .mud-nav-group .mud-nav-link:hover {
    background: linear-gradient(90deg, rgba(30,136,229,0.16), rgba(74,20,140,0.16)) !important;
    transform: translateX(3px);
}

.sps-nav-shell ::deep .mud-nav-item:nth-of-type(6n+1) { --sps-icon-color: #1e88e5; }
.sps-nav-shell ::deep .mud-nav-item:nth-of-type(6n+2) { --sps-icon-color: #8e24aa; }
.sps-nav-shell ::deep .mud-nav-item:nth-of-type(6n+3) { --sps-icon-color: #00acc1; }
.sps-nav-shell ::deep .mud-nav-item:nth-of-type(6n+4) { --sps-icon-color: #311ef4; }
.sps-nav-shell ::deep .mud-nav-item:nth-of-type(6n+5) { --sps-icon-color: #397cc0; }
.sps-nav-shell ::deep .mud-nav-item:nth-of-type(6n+6) { --sps-icon-color: #132e6c; }

.sps-nav-shell .mud-nav-link-icon,
.sps-nav-shell .mud-icon-root {
    color: var(--sps-icon-color, #1e88e5) !important;
    fill: currentColor;
}

.sps-nav-shell .mud-nav-link.active,
.sps-nav-shell .mud-nav-group .mud-nav-link.active {
    background: linear-gradient(90deg, #1e88e5, #4a148c) !important;
    color: #fff !important;
}

.sps-nav-shell .mud-nav-link.active .mud-nav-link-icon,
.sps-nav-shell .mud-nav-link.active .mud-icon-root,
.sps-nav-shell .mud-nav-group .mud-nav-link.active .mud-nav-link-icon,
.sps-nav-shell .mud-nav-group .mud-nav-link.active .mud-icon-root {
    color: #fff !important;
}