html, body {
    height: 100vh;
    width: 100vw;
    margin: 0;
    padding: 0;
}

    body.loading *,
    body.loading {
        visibility: hidden !important;
    }

    body.ready *,
    body.ready {
        visibility: visible !important;
    }

.container-foreside {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.toolbar-foreside {
    height: 60px;
    width: 100%;
    background: gainsboro;
}
.content-foreside {
    height: calc(100% - 60px);
    width: 100%;
    background: gainsboro;
    padding: 1rem;
    align-items: start;
}

.e-card.main-card {
    overflow: hidden;
    height: 100%;
    justify-content: start;
}

.main-card .e-card-header {
    height: 50px;
    min-height: 50px;
    width: 100%;
    background: whitesmoke !important;
    padding: .5rem;
}

.main-card .e-card-content {
    width: 100%;
    height: 100%;
}

.main-tab .e-item {
    height: 100%;
}

.sub-card {
    width: 100%;
    height: calc(100% - 1rem);
    justify-content: start;
}

    .sub-card .e-card-header {
        height: 50px;
        width: 100%;
        background: whitesmoke !important;
        padding: .5rem;
    }

    .sub-card .e-card-content {
        overflow-y: scroll !important;
    }

.components-reconnect-show,
.components-reconnect-failed,
.components-reconnect-rejected,
#components-reconnect-modal {
    display: none !important;
    visibility: hidden !important;
}