.grid {
    display: grid;
    grid-template-columns: 15% auto;
    grid-gap: 0.1em;
}


@media all and (max-width: 700px) {

    .grid {
        grid-template-rows: 30vh 90vh;       
    }
    .article {
        grid-column: 1 / 4;
        
    }
    .aside1 {
        grid-column: 1 / 4;
        
    }
    .brand-logo{
        display:none;
    }
    .formdiv {
        /*background: #eaeaea;*/
        display: flex;
        grid-gap: 2em;
        align-items: center;
        justify-content: center;
        margin: 0px;
        padding: 0px;
    }
    #map {
    }
    }


/* Demo Specific Styles */



.aside1 {
    /*background: #eaeaea;*/
    height: 90vh;
    border-style: double;  
    overflow:auto;
}

.article {
    /*display: flex;
    align-items: center;
    justify-content: center;*/
    display: grid;
    grid-template-columns:auto;
    grid-gap: 0.1em;
    border-style: groove;
    height: 90vh;
}

.trml-list li {
    font-size: 1.5em;
    font-weight: bold;
    color: #999186;
}

#chartElt {
    width: 100%;
    height: 25vh;
}
.reporttitle {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #00796b;
    color: #fff3e0;
    width: auto;
    height:4vh;
}

.datechange {
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: .5em;
    padding: 2px;
    width: auto;
    height: 7vh;
    background-color: #e0f2f1;
}
.form-btn {
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 1em;
    border: 1px solid #E4E4E7;
    width: auto;
    height: 5vh;
}
#map {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 53vh;
}
#trackingmap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 78vh;
}
.formdiv {
    /*background: #eaeaea;*/
    display: flex;
    grid-row-gap:10px;
    align-items: center;
    justify-content: center;
    /*margin: 30px;
    padding: 40px;*/
}
.trml-list a {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: large;
}
.article a {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5em;
    color: #999186;
}

.map a {
    display: inline-flex;
    font-size: .7em;
    color: #00796b;
}
    .map a:hover {
        background-color: #b2dfdb;
        color: #00796b;
    }

a {
    font-size: large;
    /*background-color: #00796b;*/
    /*color: #fff3e0;*/
}

    a:hover {
        background-color: #b2dfdb;
        color: #00796b;
    }

.flex_center_items {
    display: flex;
    align-items: center;   
    /*justify-content: center;*/
    justify-content:space-between;
    text-align:center;
    
    margin: 5px;
}
.pageHeight {
    width: 100%;
    height: 80vh;
}
.CreateForm{
    background-color: #ffffff;
    margin: 20px auto;
    /*background-color: #e0f2f1;*/
    padding: 10px;
    width: 90%;
    min-width: 300px;
    /*border:1px solid gray;*/
}

.formttitle {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #00796b;
    color: #fff3e0;
    width: auto;
    height: 5vh;
}