/*
Created by Jacobs Technology
*/
/* 
    Created on : May 12, 2021, 10:38:55 AM
    Author     : BrandJW
*/

/********************** specific layout styles ***************************/
#container {
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between    
}

#header-container {    
    background-color: #19559a;
    color: white;
    width: 100%; 
    
}

.title-button-container {
    display: flex; 
    flex-flow: row wrap;
    align-content: center;
    justify-content: space-between; 
    align-items: center; 
    margin:0 auto;
    width: 95%;
    height: 1.5rem;
}

#title-container {
    height: 100%;
    width:100%;
    display: flex; 
    flex-direction: column;   
}

#sitename {
    font-size: 2rem;
    color: white;
    padding-left: 1rem;
    padding-top: 1rem;
}

.page-title {
    padding-left: 4rem;
}

#top-divider {
    background-color: #aeceea;
    position: relative;
    width: 100%;
    height: 63px;
}

#content-container {
    width: 100%; 
    height: 100%;
}

#bottom-divider {
    /*background-color: #dac2e5;*/
    background-color: white;
    position: relative;
    width: 100%;
    height: 68px;
}

#footer-container {
    position: relative;
    background-color: #6c3d94;
    color: white;
    width: 100%; 
    bottom: 0; 
    font-weight: 600;
}

#footer-center {
    width: 100%;
    margin: 0 auto;
    position: relative;
}

.site-name { grid-area: site-name; }
.site-title { grid-area: site-title; }
.sign-out-button {
    grid-area: sign-out-button;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%
}

.header-grid {
    display: grid;
    grid-template-areas:
        'site-name sign-out-button'
        'site-title sign-out-button';
    padding: .5em;
}