TABLE 
	{
		color:inherit;
		border-collapse:collapse;
	}

img {border:0;}

html, body{
    margin: 0;

    padding: 0;

    min-width: 100%;
    width: 100%;
    max-width: 100%;

    min-height: 100%;
    height: 100%;
    max-height: 100%;
}

/*
    High level page layout
    ======================

    This section controls the high level page layout depending on
    whether we are running on desk-top/tablet or mobile.
    
    The desk-top/tablet layout is:
    
    H
    M C
    F
    
    The mobile layout is:
    
    H
    M
    C
    F
    
    where H is page header (full width), F is page footer (full width), M navigation menu, and each C is a page-specific content.
    
    For the desk-top lavout, some JS is used to set the width of the menu container.
    
*/
div.HEADER_REGION {
    border-width: 0;
    width: 100%;
    background-color: white;
    display: table;
    margin-bottom: 2px;
}

div.HEADER_LOGO {
    display: table-cell;
    padding: 4px;
}

div.HEADER_IMAGE_1 {
    display: table-cell;
    padding: 4px;
}

div.HEADER_IMAGE_2 {
    display: table-cell;
    padding: 4px;
}

div.HEADER_CONTACT {
    display: table-cell;
    vertical-align: middle;
    text-align: right;
    padding: 4px;
}

div.BODY_REGION {
    height: 82%;
    width: 100%;
    display: table;
}

div.BODY_ROW {
    height: 100%;
    width: 100%;
    display: table-row;
}

div.MENU_CONTAINER {
    height: 100%;
    display: table-cell;
    background-color: #4573B3;
}

table.MENU_CONTENT {
    background-color: #4573B3;
}

span.MENU_TOGGLE_BUTTON {
    display: none;
}

tr.MENU_HEADING {
    background-color: #0D1C5F;
}

span.MENU_HEADING_TEXT {
    padding: 4px;
    color: white;
}

tr.MENU_ITEM {
    padding: 4px;
    width: fit-content;
    display: block;
}

div.BODY_DIVIDER {
    display: table-cell;
    width: 10px;
}

div.CONTENT_REGION {
    display: table-cell;
    vertical-align: top;
    background-color: white;
}

div.BODY_BOTTOM_MARGIN {
    height: 10px;
}

div.PAGE_FOOTER {
    background-color: white;
    text-align: center;
    font-size: small;
}

.DATA_TABLE
{
    background-color: #EDB208;
}

/* mobile */
@media only screen and (max-width: 850px) {
    div.HEADER_LOGO {
        display: table-row;
    }

    img.HEADER_LOGO_IMAGE {
        display: block;
        margin: auto;
    }

    div.HEADER_IMAGE_1 {
        display: none;
    }

    div.HEADER_IMAGE_2 {
        display: none;
    }

    div.HEADER_CONTACT {
        display: table-row;
        text-align: center;
        padding: 4px;
    }

    div.BODY_REGION {
        height: auto;
        display: block;
    }

    div.BODY_ROW {
        height: auto;
        display: table;
    }

    div.MENU_CONTAINER {
        height: auto;
        display: table-row;
        background-color: white;
    }

    div.MENU_CONTENT {
        display: table-row;
        height: auto;
        background-color: #4573B3;
    }

    span.MENU_TOGGLE_BUTTON {
        display: inline;
    }

    tr.MENU_ITEM {
        display: none;
    }

    div.BODY_DIVIDER {
        display: table-row;
        height: 10px;
    }

    div.CONTENT_REGION {
        display: table-row;
        background-color: white;
        width: 100%;
    }

    div.BODY_BOTTOM_MARGIN {
        height: 10px;
        display: table-row;
    }
}

/*
    Content element layouts 
    =======================   
*/
div.table {display:block; }
div.row { display:block;}
div.cell {display:inline-block;}

div.SECTION_HEADING
	{
		font-size:12pt;
		font-weight:bold;
		text-decoration:underline;
		display:inline;
	}

TD.BUTTON
	{
		height:30px;
		background-color:rgb(0,43,153);
		color:white;
		vertical-align:middle;
		font-weight:bold;
		font-size:8pt;
		font-style:normal;
		text-decoration:none;
		border-collapse:collapse;
		border:0 0 0 0;
		padding:0 0 0 0;
		margin:0 0 0 0;
	}

TD.BUTTON_SHADOW
	{
		height:2px;
		background-color:rgb(207,207,207);
		border:0 0 0 0;
		padding:0 0 0 0;
		margin:0 0 0 0;
		border-collapse:collapse;
	}

TD.BUTTON_EXTENSION
	{
		height:32px;
		vertical-align:middle;
		border-collapse:collapse;
		border:0 0 0 0;
		padding:0 0 0 0;
		margin:0 0 0 0;
	}

IMG.BUTTON_EXTENSION
	{
		height:32px;
		vertical-align:middle;
		border-collapse:collapse;
		border:0 0 0 0;
		padding:0 0 0 0;
		margin:0 0 0 0;
	}

A.BUTTON {
		text-decoration:none;
		color:white;
    }

TR.DATA_ROW_COLLAPSIBLE
{
	display: table-row;
}

TR.DATA_ROW_COLLAPSED
{
	display:none;
}

INPUT:read-only 
{
		background-color:rgb(235,235,235);
}