@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100;500&display=swap');


/*.top-nav {
    background: rgb(231,45,92);
    background: linear-gradient(45deg, rgba(231,45,92,1) 30%, rgba(0,35,57,1) 100%);
}*/

/*
html {
    background-image: url(/images/optimised-bg.jpg);
    background-repeat: no-repeat;
}*/

body {
    height: 100vh;
    background: var(--Cloud-Contracts-365-BG, linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.85) 100%), linear-gradient(116deg, #76E085 0%, #E8F3B5 54.35%, #00DBC2 108.71%));
}

.center-panel {
    background-color: #fff;
}

.registration-panel {
    max-width: 700px;
}

/* for some reason this stops all of the annoying "we have scrollbars" issues */
.mud-main-content {
    overflow: hidden;
}

.top-nav {
    background: #fff;
}

.page-banner-container {
    width: 100%;
    top: 60px;
    left: 0;
    margin-left: 0; margin-right: auto; 
    padding-left: 20%; padding-right: 10%;
}

.page-banner {
    
}

.grid-container {
    height: 70vh;
    overflow: auto;
    padding: 0;
}


.bottom-toolbar-container {
    position: fixed;
    bottom: 0;
    width: 100vw;
    box-sizing: border-box;
    background: #fff;
    margin-right: 200px;
}

.bottom-toolbar-container h6 {
    word-wrap: break-word;
}

.bottom-toolbar {
    /* width: 100%; */
    /* height: 20vh; */
    margin-right: 200px;
    padding-right: 200px;
    margin-bottom: 8px;
}

.page-content {
    
}

.page-content.mt-2 {}

.list-of-stuff li {
    list-style-type: disc;
    margin-left: 25px;
}

.cc365-registration .mud-input-control {
    width: 100%;
}

.cc365-plans {
    max-width: 330px;
}

    .document-panel .mud-switch-button {
        color: var(--mud-palette-primary);
    }

.cc365-plans-previous {
    opacity: 0.5;
    background: var(--White, #FFF);
}
.cc365-plans-terms {
    max-width: 330px;
    padding: 15px;
}
.mud-tab {
    background: #E9EAED;
}

.mud-tab-active {
    background: #fff;
    border-bottom: 2px solid var(--mud-palette-primary);
    border-top: 1px solid var(--mud-palette-tertiary);
}

.grid-container {
    height: 70vh;
    overflow: auto;
    padding: 0;
}


.bottom-toolbar-container {
    position: absolute;
    bottom: 0;
    left: 120px;
    right: 100px;
    box-sizing: border-box;
    background: transparent;
    text-align: center;
}

    .mud-drawer-open-mini-md-left .bottom-toolbar-container {
        left: 300px;
    }

    .bottom-toolbar-container h6 {
        word-wrap: break-word;
    }

    .bottom-toolbar {
        max-width: 1920px;
        min-height: 45px;
        margin: auto;
        margin-bottom: 8px;
    }

@media only screen and (max-width: 1350px) {
    .grid-container {
        height: 68vh;
        
    }
}

    .bottom-toolbar-container-2nd {
        background: transparent;
    }

    .bottom-toolbar-2nd {
        z-index: 20;
    }

    /* Header Banner and Page content are used on Questionnaire pages */

    .header-banner {
        padding-left: 56px;
        margin-top: -25px;
        position: absolute;
        left: 0px;
        width: 100%;
        max-height: 170px;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    .mud-drawer-open-mini-md-left .header-banner {
        padding-left: 470px;
    }

    .tooltips {
        max-width: 300px;
        padding: 20px;
        text-align: left;
    }

        .tooltips ul {
            list-style: disc;
            list-style-position: inside;
            text-align: left;
            padding-left: 25px;
        }

    .question-hints {
        margin-left: 32px !important;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

        .question-hints .mud-list-item {
            padding-left: 0px;
        }

        .question-hints :first-child {
            padding-top: 0px !important;
        }



    .document-panel {
        min-height: 600px;
    }

        .document-panel .mud-typography-h3,
        .document-panel .mud-typography-h4,
        .document-panel .mud-typography-h5,
        .document-panel .mud-typography-caption {
            color: #afafb2;
        }

        .document-panel .mud-typography-caption {
            text-transform: uppercase;
            margin-bottom: -9px;
        }

    .pin-bottom {
        position: absolute;
        bottom: 35px;
    }

    .pin-bottom-right {
        position: absolute;
        bottom: 35px;
        margin-left: 210px;
    }

    .questionnaire-progress {
        min-height: 35px;
        max-width: 500px;
        margin: 8px;
    }

        .questionnaire-progress .mud-typography {
            color: #fff !important;
        }

        .questionnaire-progress .mud-progress-linear-bars {
            background-color: #ccc;
        }

    .bottom-toolbar > .mud-typography {
        color: #afafb2;
    }

    .background-image {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        max-width: 100%;
        z-index: -100;
        overflow-x: hidden;
        overflow-y: hidden;
    }

    .lb-bottom-nav {
        position: absolute;
        bottom: 0;
    }

    .bump {
        margin-right: 0.5em;
    }

    .lb-action {
        min-width: 200px;
        max-width: 400px;
    }

    #components-reconnect-modal {
        display: none;
    }

        #components-reconnect-modal.components-reconnect-show,
        #components-reconnect-modal.components-reconnect-failed,
        #components-reconnect-modal.components-reconnect-rejected {
            display: block;
        }

    .clickable-mudItem:hover {
        cursor: pointer;
        background-color: #D9F6F844;
    }

    .selected-panel .mud-expand-panel-header {
        background-color: #DFF7CB;
    }

    .selected-panel .mud-divider {
        display: none;
    }

    .selected-panel .mud-expand-panel-content {
        margin-top: 15px;
    }

    .selected-panel .mud-button-icon-start {
        color: #FFBE41;
    }

    .selected-panel h5 {
        margin-bottom: 7px;
    }

    .panel-buttons .mud-button {
        min-width: 16px;
        margin-right: 7px;
    }

    .cc365-gray {
        color: #707072;
    }