body{
    height: 100vh;
    background: #f5f7f9;
    font-family: 'Figtree', sans-serif;
}
.logo img{
    mix-blend-mode: darken;
}
.login-form h2{
    font-size: 22px;
    font-weight: 800;
}
.login-form p{
    font-size: 16px;
    font-weight: 300;
    color: #8e8e8e;
}
.login-form p b{
    font-weight: 700;
}
.login-form hr{
    margin: 20px 0;
}
.login-form label{
    font-size: 13px;
    margin: 0;
    font-weight: 700;
}
.login-form input:focus{
    box-shadow: none;
    border-color: #1da5cf;
}
.login-form .recover{
    font-size: 13px;
    text-align: center;
    width: 90%;
    max-width: 250px;
    margin: 20px auto 0;
}
.login-form .recover a{
    font-weight: 700;
    color: #2e2e2e;
    text-decoration: none;
}
.home-image{
    min-width: 100%;
    height: 100%;
    display: block;
    border-radius: 15px;
    background: url('https://images.unsplash.com/photo-1499951360447-b19be8fe80f5?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    background-size: cover;
    position: relative;
    overflow: hidden;
}
.home-image:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(59,142,106);
    background: linear-gradient(120deg, rgba(59,142,106,1) 0%, rgba(38,252,6,1) 100%);
    opacity: 0.5;
}

.btn-primary{
    background: rgb(59,71,142);
    background: linear-gradient(90deg, rgba(59,71,142,1) 0%, rgba(6,237,252,1) 100%);
    border: none;
    font-weight: 300;
}

/* DASHBOARD */
.interior{
    padding: 0 20px 20px;
}
.interior header{
    border-bottom: 1px solid #dddddd;
    margin-bottom: 20px;
}
.interior header h1{
    font-size: 16px;
    font-weight: 600;
    color: #2e2e2e;
    margin-left: 10px;
}
.dashboard{
    background: #fff;
    padding: 20px;
    border-radius: 10px;
}
.dashboard p{
    margin: 0;
}
.user small{
    font-weight: 300;
    font-size: 12px;
}
.user p{
    font-weight: 700;
    font-size: 13px;
    line-height: 13px;
}
.logout{
    text-decoration: none;
    color: #2e2e2e;
    font-size: 14px;
    border-left: 1px solid #dddddd;
    margin-left: 10px;
    padding-left: 10px;
}
.login-page header{
    display: none;
}

/*NEW MENU*/

form #MyMenu {
    background: #f8f9fa;
    padding: 10px;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 10;
}

    form #MyMenu ul {
        min-width: 90%;
    }

    form #MyMenu a.popout {
        background: transparent;
        padding: 5px;
        margin: 0 10px 0 0;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        text-align: left;
        color: #585858;
        background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.343146 2.5251L4.29289 6.47484C4.68341 6.86536 5.31658 6.86536 5.7071 6.47484L9.65684 2.5251C10.2868 1.89513 9.84064 0.817993 8.94973 0.817993H1.05025C0.159348 0.817993 -0.286819 1.89513 0.343146 2.5251Z' fill='black'/%3E%3C/svg%3E%0A");
        background-repeat: no-repeat;
        background-position: center right 10px;
    }

    form #MyMenu ul li:hover a.level1 {
        color: #585858 !important;
        padding: 5px;
    }

    form #MyMenu ul.dynamic {
        background: #fff;
        border: 1px solid #dee2e6;
        padding: 5px;
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,.2);
        border-radius: 6px;
    }

    form #MyMenu .sub_menu {
        background: transparent;
        margin: 0;
        text-align: left;
        color: #585858;
        padding: 5px 10px;
        display: flex;
        border-radius: 3px;
        align-items: center;
    }

        form #MyMenu .sub_menu:hover {
            background: #dee2e6;
        }