/* ****************************************************************************
 * basic formating for mvp pages                                              *
 *                                                                            *
 * Author: ETM                                                                *
 * Created: 20230113                                                          *
 *                                                                            *
 * *************************************************************************  */


 /* MVP component container */
.mvp_contain_all {
    background-color: WHITE;
    display: grid;
    justify-items: center; /* Aligns items along the row (horizontal) axis */
}

/* Basic mvp grid container */
.mvp_container {
    display: grid;
    grid-gap: 20px;
}

/* Three part button grid for mvp*/
.mvp_container_three{
    display: grid;
    grid-template-columns: 200px 200px 200px;
    grid-gap: 20px;
}

/* Two part button grid for mvp */
.mvp_container_two{
    display: grid;
    grid-template-columns: 200px 200px;
    grid-gap: 20px;
}

/* Split container in two for mvp*/
.mvp_container_two_split{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}

/* Basic grid item for mvp */
.mvp_item {
    /* Center the contents of the grid items. Making each grid item a Flex Container */
    display: flex;
              
    /* Horizontal and Vertical centering */
    justify-content: center;
    align-items: center;    
    border-radius: 3px;
    flex-direction: column;
}

/* Basic grid item for mvp left justified*/
.mvp_item_left {
    /* Center the contents of the grid items. Making each grid item a Flex Container */
    display: flex;
                  
    justify-content: left;
    align-items: start;    
    border-radius: 3px;
    flex-direction: column;
    padding-left:6px;
}

/* Basic grid item for mvp right justified*/
.mvp_item_right {
    /* Center the contents of the grid items. Making each grid item a Flex Container */
    display: flex;
                  
    justify-content: right;
    align-items: center;    
    border-radius: 3px;
    flex-direction: column;
}