/*
  Name: CIPFA AssetManager HTML5 Content Page Styles
  Date: February 2016
  Description: Layout for HTML5 and CSS3
  Version: 1.0
  Author: Ray Brown
*/

input[type=button], input[type=submit] {
    -webkit-appearance: none;
}

body {
    font-family: Verdana, Tahoma, "MS Sans Serif", Arial;  
}

.debugred {
    border: 1px solid red;
}

.debuggreen {
    border: 1px solid green;
}

hr {
    height: 2px;
    width: 100%;
    border: 0 none;
    color: #bbbbbb;
    background-color: #bbbbbb;
}

/*
    ********************************
    * Filter Pages
    ********************************
*/
.cpgMainDiv {
    width: 100%;
    border: none;
    float: left;
}

.cpgTitleDiv {
    width: 100%;
    font-family: Arial;
    color: #755990;
    font-size: 14pt;
    padding-bottom: 5px;
}
    .cpgTitleDiv a {        
        color: #755990;
        text-decoration: none;  
        padding: 2px;         
    }  
        .cpgTitleDiv a:hover { 
            color: #ffffff;
            background-color: #8a69aa;            
            border-radius: 4px;
        }  

.cpgTitleDivRight {
    width: 33%;
    float: left;
    text-align: right;
    padding-top: 4px;
    font-size: 11pt;
}

.cpgAdminSubTitleDiv {
    display:inline-block;
    width:30%;     
    font-family: Arial;
    color: #755990;
    font-size: 12pt;      
    padding-right:30px;
}

.cpgArchiveLabel {
    color:red;
}


.cpgFilterDivMain {
    width: 90%;
    float: left;
}

.sidenav {
    display: flex;
    flex-flow: row;
    height: 100%;
    width: 20px;
    position: fixed;
    background: #ffffff;
    z-index: 1;
    top: 0;
    right: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    transition: 0.5s;
    float: right;
    align-content: flex-end;
}

.sidenav.on {
    width: 10%;
}

#divMain.on {
    width: 90%;
}

.sideNavSelect {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    float: left;
    height: 100%;
}

.cpgsideNavClose {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    vertical-align: top;
}

.sideNavButtons {
    display: flex;
    flex-direction: column;
    height: 100%;
    align-content: flex-end;
    align-items: center;
    justify-content: center;
    padding-left: 10px;
}

.cpgNavigationDiv {
    width: 10%;
    float: right;
    display: flex;
    flex-flow: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    margin-top: 5px;
}

.cpgNavigationDivHigher {
    width: 10%;
    float: right;
    display: flex;
    flex-flow: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    margin-top: -5px;
}

.cpgMenuPageRightButtons {
    margin-right:10px;
}

.cpgAssocDataDiv {
    float: left;
    display: flex;
    flex-flow: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    padding-bottom: 10px;
}

.cpgFilterOptionsList {
    width: 400px;
    border-top:1px  dotted #755990;
}
    
.cpgFilterOptionsListWide {
    width: 480px;   
    border-top:1px  dotted #755990; 
}

.cpgFilterDivOption {
    width: 100%;
    float: left;
    padding-left: 5px;
    padding-bottom: 2px;
    padding-top: 2px;
    border-bottom:1px  dotted #755990;
}

.cpgFilterDivText {
    float: left;
    height: 100%;
    white-space: nowrap;
    padding-bottom: 2px;
    padding-top: 4px;
    font-size: 11pt;
    color: #755990;
    font-family: Arial;
}

.cpgFilterDivDots {
    float: right;
    width: 0px;
    display: none;
    vertical-align: top;
    color: #755990;
    font-family: Arial;
    font-weight: bold;
}

.cpgFilterDivRadioButtons {
    width: 100%;
    float: left;    
    padding-bottom: 15px;
    padding-top: 10px;
}

.cpgFilterDivButton {
    float: right;
}


/*
    ********************************
    * Diary Calendar Pages
    ********************************
*/

.cpgDiaryLoading {
    position: fixed;
    width: 300px;
    height: 150px;
    top: 150px;
    left: 50%;
    z-index: 1000;
    background-color: #f0f0f0;
    transform: translate(-50%, 0%);
    border: 2px solid purple;
    border-radius: 5px;
}

.cpgDiaryLoadingMessage {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 95%;
    width: 100%;
}

/* Not used */
.ZZZui-autocomplete {
    max-height: 70%;
    overflow-y: auto; /* prevent horizontal scrollbar */
    overflow-x: hidden; /* add padding to account for vertical scrollbar */
    padding-right: 20px;
}

#calendar {
    margin: 0 auto;
    vertical-align: top;
    font-size: 12px !important;
    font-family: Verdana, Arial, Sans-Serif;
}

/*slide out menu*/
.slideout-menu {
    position: fixed;
    top: 0;
    left: 0px;
    width: 100%;
    height: 300px;
    background: #fff;
    z-index: 100;
    color: #755990;
    font-size: .8em;
}

.slideout-menu h3 {
    position: relative;
    padding: 3px 3px;
    color: #755990;
    font-size: 1.2em;
    font-weight: 400;
    border-bottom: 2px solid #755990;
}

.slideout-menu .slideout-menu-toggle {
    position: absolute;
    top: 12px;
    right: 10px;
    display: inline-block;
    padding: 6px 9px 5px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    line-height: 1;
    background: #755990;
    color: #755990;
    text-decoration: none;
    vertical-align: top;
}

.slideout-menu .slideout-menu-toggle:hover {
    color: yellow;
}

.slideout-menu a {
    font-family: Arial, sans-serif;
    color: #755990;
    font-size: .8em;
}

.Dropdown {
    font-size: 1em;
    color: #755990;
}


/*
    ********************************
    * Asbestos Pages
    ********************************
*/

/* Gridlike items */
.cpgAsbestosGrid > div {
    font-size: 12px;
    font-family: Arial;
	display: inline-block;
    padding-top: 2px;
    padding-bottom: 2px;
}

.cpgAsbestosGrid > .bold {
	font-weight: bold;
}

/* General widths */
.cpgAsbestos10pc {
	width: 9%;
	min-width: 200px;
}

.cpgAsbestos15pc {
	width: 14%;
	min-width: 200px;
}

.cpgAsbestos25pc {
	width: 24%;
	min-width: 200px;
}

.cpgAsbestos50pc {
	width: 49%;
	min-width: 200px;
}

.cpgAsbestos75pc {
	width: 74%;
	min-width: 200px;
}

.cpgAsbestos100pc {
	width: 99%;
	min-width: 200px;
}

.cpgRollOver {
    font-size: 9px;
    text-align: right;
    color: #755990;
    font-weight: bold;
}

.cpgFieldSetFullWidth {
    width: 95%;
}

.verticalSpacer10px {
    height: 10px;
    clear: both;
}

.cpgInsideFieldsetBorder {
    padding: 10px;
}

.cpgBlockRoomFilterContainer {
	vertical-align: top;
    padding-top: 10px;
}

.cpgGridBlock {
	margin: 0px;
	min-width: 100px;
	display: inline-block;
	vertical-align: top;
}

.cpgGridBlockMoreWidth {
	min-width: 100px;
}

.cpgGridBlockExtraWidth {
	min-width: 400px;
}

.cpgNudgeUp {
    margin-top: -35px;
}

/*
    ********************************
    * Filter Results Pages
    ********************************
*/

.cpgSearchDivMain {
    width: 100%;
    float: left;
}

.cpgSearchTitle {
    padding-left: 5px;
    padding-bottom: 10px;
    padding-top: 4px;
    color: #755990;
    font-size: 12pt;
    font-family: Arial;    
}

.cpgSearchDivContent {
    float: left;
    position: relative;
    top: 0px;
    left: 0px;
}


.cpgSearchDivText {
    float: left;
    height: 100%;
    white-space: nowrap;
    width: 200px;
}

.cpgSearchDivFilter {
    float: left;
}

.cpgSearchDivButton {
    float: left;
    position:absolute;
    left: 100%;
}

.cpgSearchDivFilterButton {
    float: left;
}

.cpgSearchDivCriteria {
    float: left;
}


.width90 {
    width: 90%;
}

.width100 {
    width: 100%;
}

/* -----------------------------------------------------------------------------------*/
/* remove cpgNoRecordDiv once user control uc_grid_record_counter in use everywhere   */
.cpgNoRecordDiv {
    float: left;
    background-color: lightgray;
    padding-bottom: 5px;
    padding-top: 5px;
}  

/* remove cpgRecordDisplay once user control uc_grid_record_counter in use everywhere */
.cpgRecordDisplay {
    float: right;
    margin-right: 5px;
}
/* -----------------------------------------------------------------------------------*/

/* Start of uc_grid_record_counter styles */
.cpgDivRecordsFound {
    float: left;
    background-color: lightgray;
    padding-top: 5px;    
    width: 100%;
    font-family: Arial;
    font-size: 10pt;  
      
}
    .cpgDivRecordsFound input {
        font-size: 9pt;           
        width: 90%;    
    }

.cpgRecordCount {
    float: left;
    margin-left: 5px;   
    width: 25%;
    color: black;
}

.cpgRecordDisplayRight {
    float: left;
    width: 75%;
    text-align: right;
    margin-right: 5px;      
    color: black;
}

.cpgRecordDisplayCenter {    
    text-align: center;
    width: 50%;   
    min-width: 300px;
    color: black;
}

.cpgRecordPageSizeLit {
    float: left;
    text-align: right;
    width: 20%;
    padding-right: 4px;    
    color: black;
}

.cpgRecordPageSize {
    float: left;
    text-align: right;
    width: 5%;
    padding-right: 4px;    
    color: black;
}

.cpgRecordPageSizeWarning {
    float: left;
    width: 100%;
    font-size: 8pt;
    color: red;
    font-weight: bold;
    text-align: right;
    padding-top: 4px;
    padding-right: 8px;
    padding-bottom: 0px;
}

.cpgRecordFastNav {
    font-family: Arial;
    font-size: 10pt;
    float: right;
    padding-top: 3px;
    min-width: 240px;
    text-align: right;
    color: black;
}
/* End of uc_grid_record_counter styles */



/* Start of uc_AssociatedData styles */
.UCAssocData{
    border: 1px solid #888;
    border-collapse: collapse;
    border-spacing: 5px;
    margin-bottom: 5px;
    text-align: Left;
    vertical-align: top;
    font-family: Arial;
    font-size: 9pt;
}

.UCAssocDataTH {    
    font-weight: bold;
    color: #ffffff;
    border: 1px solid #888;
    background-color: #755990;
    background-repeat: repeat-x;
    height: 21px;
    vertical-align: middle;   
    padding-left: 3px;
}

    .UCAssocDataTH td {
        padding-left: 3px;
        border: 1px solid #888;
    }

    .UCAssocDataItem {
        font-size: 8pt;
        font-weight: normal;
        padding-left: 3px;  
        border: 1px solid #888;      
    }

    .UCAssocDataItem td {
        padding-left: 3px; 
        border: 1px solid #888;
    }


/* End of uc_AssociatedData styles */

/*
    ***************************************
    * Styles for the spell checker control
    ***************************************
*/
.cpgUCSpellCheckTextActive {
    font-family: Arial;
    font-size: 10pt;
    border: 1px solid red;
    padding: 2px 3px;    
    background-color: #f4f4f4;
}

.cpgUCSpellChecktWord {
    font-family: Arial;
    font-size: 11pt;
    font-style:italic;   
    color:red;
    text-decoration: underline;
}

.cpgUCSpellCheckText {
    font-family: Arial;
    font-size: 10pt;
    border: 1px solid gray;
    padding: 2px 3px;
    background-color: #f4f4f4;
}

.cpgDownloadFilter {
    width: 100%;
    float: left;
}

.cpgSearchDivGrid {
    width: 90%;
    float: left;
}

.cpgSearchDivGrid100 {
    width: 100%;
    float: left;
    overflow-y: hidden;
    overflow-x: auto;
}

.cpgDisabledText {
    color: #999;
}

/*
    ********************************
    * General Div Classes
    ********************************
*/

div {
    padding: 0px 0px 0px 0px;
}

.cpgDivUploadRetry {
    display: none;
    border-right: #0e7dca 2px solid;
    padding-right: 10px; 
    border-top: #0e7dca 2px solid; 
    padding-left: 10px;
    padding-bottom: 10px; 
    border-left: #0e7dca 2px solid; 
    padding-top: 10px;
    border-bottom: #0e7dca 2px solid
}

.cpgDivUploadBusyStatus {
    cursor: wait; 
    padding-right: 10px;
    display: none; 
    padding-left: 10px; 
    padding-bottom: 10px; 
    padding-top: 10px;
}
.cpgDivCentre {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cpgDivCentreRow {
    width: 75%;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.cpgDivTextLeft {
    text-align: left;
    padding: 10px 10px 10px 10px;
}

.cpgFSUpload {
    margin: auto auto;
    position: relative;
    border-radius: 10px;
    text-align: center;
}

.cpgFillerDiv10 {
    float: left;
    width: 10%;
}

.chkLabel {
    padding-left: 5px;
}

.cpgRightDiv40 {
    float: right;
    text-align: right;
    width: 40%;
}

.cpgRightDiv20 {
    float: right;
    text-align: right;
    width: 20%;
}

.cpgCentreDiv50 {
    width: 50%;
    float: left;
    text-align: center;
}

.cpgCentreDiv33 {
    width: 33%;
    float: left;
    text-align: center;
}

.cpgDiv35 {
    width: 35%;
    float: left;
}

.cpgDiv40 {
    float: left;
    text-align: left;
    width: 40%;
}

.cpgDivFloatLeft {
    float: left;
}

.cpgDiv60 {
    width: 60%;
    float: left;
}

.cpgDiv65 {
    width: 65%;
    float: left;
}

.cpgDiv63 {
    width: 63%;
    float: left;
}

.cpgDiv75 {
    width: 75%;
    float: left;
}

.cpgDiv80 {
    width: 80%;
    float: left;
}

.cpgDiv85 {
    width: 85%;
    float: left;
}
.cpgDiv90 {
    width: 90%;
    float: left;
}

cpgScroll {
    overflow-x: auto;
    overflow-y: hidden;
}

.cpgDiv100 {
    width: 100%;
    float: left;
}

.cpgDiv100flex {
    width: 100%;
    float: left;
    display: inline-flex;
    padding-bottom: 10px;
}

.cpgTabsDiv {
    width: 75%;
    float: left;
    padding-bottom: 5px;
}

.cpgTabsAsbestosWarnDiv {
    width: 25%;
    float: right;
    display: flex;
    flex-flow: row;
    flex-wrap: nowrap;
    align-items: baseline;
    justify-content: flex-end;
    padding-top: 0px;
}

.cpgTabsAsbestosWarnDivHigher {
    width: 25%;
    float: right;
    display: flex;
    flex-flow: row;
    flex-wrap: nowrap;
    align-items: baseline;
    justify-content: flex-end;
    padding-top: 15px;
    padding-bottom: 5px;
    margin-top: -15px;
    margin-right: -50px;
}

.cpgDiv90flex {
    width: 90%;
    float: left;
    display: inline-flex;
    padding-bottom: 5px;
}

.cpgDownloadsDivLeft {
    width: 50%;
    float: left;
}

.cpgDownloadsDivRight {
    width: 50%;
    float: left;
    display: flex;
    flex-flow: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.cpgContentDiv {
    width: 100%;
}

.cpgContentDivFlex {
    width: 100%;
    display: inline-flex;
    flex-flow: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.cpgContentDivLeft {
    float: left;
    width: 85%;
    display: flex;
    flex-direction: column;
}

.cpgContentDivRight {
    /*width: 200px;*/
    float: right;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cpgContentDivLeft70 {
    float: left;
    width: 70%;
    display: flex;
    flex-direction: column;
}

.cpgContentDivRight220 {
    width: 220px;
    float: left;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cpgContentDivRight20 {
    width: 20px;
    float: left;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cpgDivPadded {
    padding: 2px 2px 2px 2px;
}

.cpgDivLeft320px {
    width: 320px;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft5 {
    width: 5%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft10 {
    width: 10%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft25 {
    width: 25%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft33 {
    width: 33%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft35 {
    width: 35%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft40 {
    width: 40%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft45 {
    width: 45%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft60 {
    width: 60%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft75 {
    width: 75%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft85 {
    width: 85%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}


.cpgDivFloatRight12 {
    width: 12%;
    float: right;
    text-align: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivFloatRight20 {
    width: 20%;
    float: right;
    text-align: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivFloatRight25 {
    width: 25%;
    float: right;
    text-align: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivFloatRight50 {
    width: 50%;
    float: right;
    text-align: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivFloatRight75 {
    width: 75%;
    float: right;
    text-align: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivFloatRight100 {
    width: 100%;
    float: right;
    text-align: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft50Float {
    width: 50%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivRight50Float {
    width: 50%;
    float: right;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft12h {
    width: 12.5%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft37h {
    width: 37.5%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft87h {
    width: 87.5%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft16h {
    width: 16.6%;
    float: left;
    display: inline-block;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft15 {
    width: 15%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft20 {
    width: 20%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}


.cpgDivLeft30 {
    width: 30%;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgDivLeft50 {
    width: 50%;
    display: inline-flex;
    flex-flow: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.cpgDivLeft75Flex {
    width: 75%;
    display: inline-flex;
    flex-flow: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.cpgDivRight50 {
    width: 50%;
    display: inline-flex;
    flex-flow: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.cpgDivJustifyRight50 {
    width: 50%;
    display: inline-flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.cpgDivRight {
    float: right;    
}

.cpgDivLeft {
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
}

.cpgVerticalControlContainer {    
    display: flex; 
    align-items: center;
}

.cpgDivMiddle {
    padding-left:20px;
}

.cpgPageButtonsDiv {
    text-align: right;
}

.cpgPositionRelative {
    position: relative;
}

.cpgPadBottom0 {
    padding-bottom: 0px;
}

.cpgPadBottom2 {
    padding-bottom: 2px;
}

.cpgPadBottom5 {
    padding-bottom: 5px;
}

.cpgPadBottom10 {
    padding-bottom: 10px;
}

.cpgPadLeft4 {
    padding-left: 4px;
}

.cpgPadLeft6 {
    padding-left: 6px;
}

.cpgPadLeft10 {
    padding-left: 10px;
}

.cpgPadLeft13 {
    padding-left: 13px;
}

.cpgPadTop0 {
    padding-top: 0px;
}

.cpgPadTop1 {
    padding-top: 1px;
}

.cpgPadTop2 {
    padding-top: 2px;
}

.cpgPadTop3 {
    padding-top: 3px;
}

.cpgPadTop4 {
    padding-top: 4px;
}

.cpgPadTop5 {
    padding-top: 5px;
}

.cpgPadTop10 {
    padding-top: 10px;
}

.cpgPadTop20 {
    padding-top: 20px;
}

.cpgPadRight5 {
    padding-right: 5px;
}

.cpgPadRight22 {
    padding-right: 22px;
}

.cpgFieldsetInlineBlock {
    display: inline-block;
    border: 1px solid #888888;
    border-radius: 5px;
    margin-top: 10px;
}

.cpgDownloadLink {
    font-size: 15px;
    color: #755990;
    text-decoration: none;
    padding: 2px;
    border-radius: 4px;
}

    .cpgDownloadLink:hover {
        color: #ffffff;
        background-color: #8a69aa;
        padding: 2px;
        border-radius: 4px;
    }

.cpgRowHighlight
{
    color: #ffffff;
    background-color: #d9d0e2;
}

fieldset
{
    border: 1px solid #888888;
    border-radius: 5px;
    margin-top: 10px;
    min-width: inherit;
}

.reportmenufieldset
{
    border: 3px solid #755990;
    border-radius: 15px;
    margin-top: 10px;    
    text-align:center;
}

.reportmenuheaders{
    font-size:10pt !important;
}

.reportLifeCycleFieldset
{
    min-height: 120px;
}

legend {
    border: 1px solid #888888;
    background: #755990;
    /*border-radius: 4px;*/
    padding: 4px 6px 4px 6px;
    font-family: Verdana, Tahoma, 'MS Sans Serif', Arial;
    font-size: 12px;
    color: #ffffff;
    border-radius: 8px;
    margin-bottom: 5px;
}

fieldset > legend {
    float: left;
    margin-top: -20px;
}

div.general {
    font-size: 12px;
    font-family: Arial;
}

div.generalbold {
    font-size: 12px;
    font-family: Arial;
    font-weight: bold;
}

div.generalitalic {
    font-size: 12px;
    font-family: Arial;
    font-style: italic;
}

div.generalmessage {
    font-size: 14px;
    font-family: Arial;
}

span.general{
    font-size: 12px;
    font-family: Arial;
    font-weight: normal;
}

span.generalbold {
    font-size: 12px;
    font-family: Arial;
    font-weight: bold;
}

span.generalitalic {
    font-size: 12px;
    font-family: Arial;
    font-style: italic;
}

.flex-container-col {
    display: flex;
    flex-direction: column;
    width: 100%;
}


.flex-container-row {
    display: flex;
    flex-direction: row;
    width: 100%;
}


.flex-container-row-important {
    display: flex !important;
    flex-direction: row;
    width: 100%;
}


.flex-container-col-centre {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
}

.flex-container-row-centre {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
}

.flex-container {
    display: flex;
    justify-content: space-between;
    padding: 10px;
}

.cpgAccordionContent {
    margin-bottom: 10px !important;
}

.cpgDropDownList {
}

.cpgHSIndicatorLabel {
    margin-top: 6px;
    width: 50%;    
    text-align: center;    
    margin-left: auto;
    margin-right: auto;
}

.cpgMultiLineText8 {
    font-family: Arial;
    font-size: 8pt;
}

/* PopUp Box */
.modal-box {
    background-color: #FFF;
    width: 1000px !important;
    border: #000 solid 1px;
    border-radius: 10px;
    box-shadow: 0 8px 6px -6px #652d88;
    text-align: left;
    display: none;
}

.modal-box-scroll {
    background-color: #FFF;
    width: 1000px !important;
    border: #000 solid 1px;
    border-radius: 10px;
    box-shadow: 0 8px 6px -6px #652d88;
    text-align: left;
    display: none;
    overflow: auto;
}

.pop-up-title {
    padding: 10px 20px 15px 20px;
    line-height: 18px;
    font-size: 18px;
    border-bottom: #CCC solid 1px;
}

.pop-up-text {
    padding: 0 20px 20px 20px;
}

.pop-up-close {
    position: absolute;
    top: 15px;
    right: 15px;
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    text-shadow: 0px 1px 0px #fff;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0px, 0px, 0px, 0px);
    border: 0;
}

.pop-up-close:focus, .pop-up-close:hover {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

button.pop-up-close {
    -webkit-appearance: none;
    padding: 0;
    background: 0 0;
    border: 0;
}


.tblUpdatePasswordPanel {
    padding: 20px 15px 5px 15px;
    width: 100%;
}

.updatePasswordPanel {
    width: 100%;
    background-color: #faf1f8;
    border-radius: 20px;
    height: 100%;
    vertical-align: top;
    text-align: center;
    padding: 20px;
}
 
.PopupGridPanel{
    height:140px;
    overflow:auto;
}

.ImportantNotesIndicator
{
    font-family: Verdana, Arial, Helvetica;
    font-size: 12px;
    font-weight: bold;
    color: #ff6600; 
}

/* classes for uc_ObjectFilter and sub controls */
.cpgObjectFilterFieldCon {
    display: none;
    /*border: 1px solid #888888;*/
    /*border-radius: 5px;*/
    vertical-align: top;
    background-color: white;
    padding: 4px 4px 4px 4px;
}

.cpgUCsmallButton {
    font-family: Arial;
    color: white;
    background-color: #755990;
    border-top: 1px solid #c0c0c0;
    border-left: 1px solid #c0c0c0;
    border-right: 1px solid #777777;
    border-bottom: 1px solid #777777;
    padding: 4px 8px 4px 4px;
    margin: 1px 1px 1px 1px;
    border-radius: 4px 4px 4px 4px;
    font-size: 8pt;
    width: 20px;
}

    .cpgUCsmallButton:hover {
        background-color: #8a69aa;
    }

.cpgUCDivCentre28 {
    width: 46.5%;
    float: left;
    text-align: center;
}

.cpgUCDiv28 {
    width: 28%;
    float: left;
}

.cpgUCDiv45 {
    width: 45%;
    min-width: 200px;
    float:left;
}

.cpgUCDivCentre30px {
    display: flex;
    width: 30px;
    float: left;
    padding: 4px 8px 4px 4px;
    align-items: center;
    min-width: 30px;
}

.cpgUCDiv30px {
    width: 30px;
    float: left;
    padding: 4px 8px 4px 4px;
}

.cpgUCDiv20px {
    width: 20px;
    float: left;
}

.cpgUCHousingFilterLabel {
    width:250px;
}

.cpgDivListBoxOuter {
    padding-top: 8px;
    float:left;
}

.cpgDivListBoxCentre {
    display: flex;
    width: 30px;
    float: left;
    padding: 2px 6px 4px 4px;
    align-items: center;
}

.cpgMarginTop180px {
    margin-top: 180px;
}

#dropZone {
    background: gray;
    border: black dashed 3px;
    width: 200px;
    padding: 50px;
    text-align: center;
    color: white;
}


/*
    ********************************
    * User Control specific
    ********************************
*/
.tblComSubSel {
    table-layout: fixed;
    text-align: left;
    border: 0;
    margin-left: -3px;
    width: 100%;
}

    .tblComSubSel tr td {
        padding-top: 3px;
        padding-bottom: 3px;
    }

.tblCatDivSubSel {
    table-layout: fixed;
    text-align: left;
    border: 0;
    margin-left: -3px;
}

    .tblCatDivSubSel tr td {
        padding-top: 3px;
        padding-bottom: 3px;
    }

/*  Busy Status Control */
.ui-progressbar {
    height: 1em;
    text-align: left;
}

    .ui-progressbar .ui-progressbar-value {
        margin: -1px;
        height: 100%;
    }

#bardivs {
    width: 300px;
    position: relative;
    cursor: wait;
}

#progressbartext {
    position: absolute;
    width: 300px;
    top: 0;
    left: 0;
    margin-top: 4px;
    cursor: wait;
}

#progressbar {
    position: relative;
    top: 0;
    left: 0;
    cursor: wait;
    margin-left: 8px;
    margin-right: 8px;
    height: 27px;
}

.divTransBusy {
    position: absolute;
    filter: alpha(opacity=20);
    background-color: black;
    visibility: hidden;
}

.diviFrameBusy {
    z-index: 99;
    position: absolute;
    filter: alpha(opacity=20);
    background-color: transparent;
    visibility: hidden;
}

.divOverBusy {
    z-index: 100;
    position: absolute;
    visibility: hidden;
}

.flex-container-col-busy {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.flex-container-row-busy {
    display: flex;
    flex-direction: row;
    width: 100%;
    position: relative;
    padding: 0 0 50px 0;
}

.main-busy {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.cpgFilterLabel {
    color: #755990;
    text-decoration: none;
    font-size: 12px;
}

.box-busy {
    /*height: 300px;*/
    width: 300px;
    margin: auto auto;
    position: relative;
    border-radius: 10px;
    text-align: center;
    padding: 35px 40px 35px 40px;
    border: black thin solid;
}

.chkBoxMargin {
    margin-left: -4px;
}

.chkBoxMargin0px {
    margin-left: 0px;
}

.radiobuttonfix {
    margin-left:-3px;
    margin-right:3px;
}

/* Amp Report Layout Builder */
.AMP_Investment_Need {
    background: #dcff16;
    text-align: center;
}

.AMP_Investment_Need_Thumbnail {
    background-image: url(../images/imgAMP/AMP_Investment_Need_Thumbnail.jpg);
    width: 300px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 105px;
}

.AsbestosSample_NoAsbestos{
    color: #99cc66;
}

.AsbestosSample_Asbestos{
    color: #ff6633;
}

.Asbestos_Highlighted{
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: top;
    background-color: lightpink;
}

.Asset_Summary {
    background: #d6f4ff;
    text-align: center;
}

.Asset_Summary_Thumbnail {
    background-image: url(../images/imgAMP/Asset_Summary_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 140px;
}

.Available_Property_Data {
    background: #aab8d3;
    text-align: center;
}

.Available_Property_Data_Thumbnail {
    background-image: url(../images/imgAMP/Available_Property_Data_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 210px;
}

.Benchmarking_Spend {
    background: #ff9e44;
    text-align: center;
}

.Benchmarking_Spend_Thumbnail {
    background-image: url(../images/imgAMP/Benchmarking_Spend_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 175px;
}

.Buildings_Condition_PPI1 {
    background: #fffdc4;
    text-align: center;
}

.Buildings_Condition_PPI1_Thumbnail {
    background-image: url(../images/imgAMP/Buildings_Condition_PPI1_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 140px;
}

.CS_Element_Summary {
    background: #c5c4ff;
    text-align: center;
}

.CS_Element_Summary_Thumbnail {
    background-image: url(../images/imgAMP/CS_Element_Summary_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 140px;
}

.Contact_Details {
    background: #ffcbb5;
    text-align: center;
}

.Contact_Details_Thumbnail {
    background-image: url(../images/imgAMP/Contact_Details_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 105px;
}

.Fire_Risk_Assessment {
    background: #e5ffc4;
    text-align: center;
}

.Fire_Risk_Assessment_Thumbnail {
    background-image: url(../images/imgAMP/Fire_Risk_Assessment_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 70px;
}

.Five_Year_Investment {
    background: #ffb5fc;
    text-align: center;
}

.Five_Year_Investment_Thumbnail {
    background-image: url(../images/imgAMP/Five_Year_Investment_Thumbnail.jpg);
    width: 300px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 140px;
}

.Health_And_Safety {
    background: #c3ffad;
    text-align: center;
}

.Health_And_Safety_Thumbnail {
    background-image: url(../images/imgAMP/Health_And_Safety_Thumbnail.jpg);
    width: 300px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 210px;
}

.Investment_By_Element {
    background: #afffe7;
    text-align: center;
}

.Investment_By_Element_Thumbnail {
    background-image: url(../images/imgAMP/Investment_By_Element_Thumbnail.jpg);
    width: 300px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 175px;
}

.Property_Photo {
    background: #ff7fb6;
    text-align: center;
}

.Property_Photo_Thumbnail {
    background-image: url(../images/imgAMP/Property_Photo_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 175px;
}

.Property_Areas {
    background: #ff7fb6;
    text-align: center;
}

.Property_Areas_Thumbnail {
    background-image: url(../images/imgAMP/Property_Areas_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 105px;
}

.Property_Rating {
    background: #e4ffd1;
    text-align: center;
}

.Property_Rating_Thumbnail {
    background-image: url(../images/imgAMP/Property_Rating_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 35px;
}

.Rental_Income {
    background: #f0ff4c;
    text-align: center;
}

.Rental_Income_Thumbnail {
    background-image: url(../images/imgAMP/Rental_Income_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 35px;
}

.Restrictions_On_Use {
    background: #b2f0ff;
    text-align: center;
}

.Restrictions_On_Use_Thumbnail {
    background-image: url(../images/imgAMP/Restrictions_On_Use_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 70px;
}

.Valuation {
    background: #ffa55b;
    text-align: center;
}

.Valuation_Thumbnail {
    background-image: url(../images/imgAMP/Valuation_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 70px;
}

.Suitability_Summary {
    background: #A9BCC9;
    text-align: center;
}

.Suitability_Summary_Thumbnail {
    background-image: url(../images/imgAMP/Suitability_Summary_Thumbnail.jpg);
    width: 150px;
    cursor: pointer;
    background-repeat: no-repeat;
    height: 70px;
}

.Suitability_Highlighted {
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: top;
    background-color: lightblue;
}

.epim_Recordtype {
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: top;
    padding: 4px 6px 4px 6px;
    border-radius: 8px;
    font-weight: normal;    
    background-color: #d9d0e2;  
    color: #755990;
    text-align:center;
    border:solid;
    border-width:1px;
}

.epim_UnderConstruction {
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: middle;
    padding: 4px 6px 4px 6px;
    border-radius: 8px;
    font-weight: normal;        
    color: #755990;
    text-align:center;
    border:solid;
    border-width:1px;
    width: 100%;
    background-color: #ffcbb5
}

.Condition_Highlighted {
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: top;
    background-color: lightpink;
}

.Managed_Highlighted {
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: top;
    background-color: yellow;
}

.WorkOrder_Highlight {
    background-color: #f4f4f4;
}

.WorkOrder_Message {
    border: 1px solid #888;
    padding-left: 3px;
}

.WaterHygiene_Highlight {
    background-color: beige;
}

/*Change the background colour and border for the colour picker*/
.evo-pop {
    z-index: 10000;
    width: 204px;
    padding: 3px 3px 0;
    background-color: white;
    border: 1px solid #ccc;
}

.WorkOrder_ColourBox {
    border: 1px solid #ccc; 
    width: 16px; 
    height: 16px; 
    line-height: 0px;
}

.AMDiary_OverdueItem {
    background-color: #FF584F;  
    color: white;
}

.AMDiary_Item {
    background-color:white;  
    color: black;
}

.DAA_treeparent 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
.DAA_treeparent a:hover 
{
    color: #ffffff;
    background-color: #8a69aa;            
    border-radius: 4px;
    padding: 2px;
}

.DAA_TreeSectionHeader{
    color: #755990;
} 
.DAA_TreeSectionHeader a:hover 
{
    color: #ffffff;
    background-color: #8a69aa;            
    border-radius: 4px;
    padding: 2px;
}

.DAA_TreeSections{
    color: #755990;
} 
.DAA_TreeSections a:hover 
{
    color: #ffffff;
    background-color: #8a69aa;            
    border-radius: 4px;
    padding: 2px;
}

.DAA_TreeQuestions{
    color: #755990;
} 
.DAA_TreeQuestions a:hover 
{
    color: #ffffff; 
    background-color: #8a69aa;            
    border-radius: 4px;
    padding: 2px;
}


.DAA_TreeResponse{
    color: green;
} 
.DAA_TreeResponse a:hover{
    color: lightgreen;
    background-color: #8a69aa;            
    border-radius: 4px;
    padding: 2px;
} 

.ucAMPPISTableLayout {
    border: 2px solid black;
    width: 350px;
}

.ucAMPPISTableLayout tr {
    height: 25px;
    border: 1px solid black;
}

.ucAMPPISTableLayout tr td {
    width: 50%;
    border: 1px solid black;
}

.ucAMPPISTableLayout tr td p {
    text-align: center;
    padding: 10px;
}
/*
    ********************************
    * Old or unused to be looked at
    ********************************
*/
.cpgMainTable {
    width: 100%;
    border: 0;
}

.cpgMainTDLeft {
    width: 90%;
}

.cpgTabAsbestosTable {
    width: 100%;
}

.cpgTabTD {
    vertical-align: bottom;
    text-align: left;
    width: 65%;
}

.cpgAsbestosWarnTD {
    vertical-align: bottom;
    text-align: right;
    width: 25%;
}

.cpgContentTable {
    width: 100%;
    height: 100%;
    border: 0;
}

.cpgContentTD {
    width: 100%;
}

.cpgPageButtonsTD {
    text-align: right;
    vertical-align: bottom;
}

.cpgNavigationTD {
    text-align: center;
    vertical-align: top;
}

.cpgErrorTD {
    text-align: left;
}

.cpgLiteralTD {
    text-align: left;
}

.cpgContentFilterTable {
    border-spacing: 5px;
    padding: 0;
    text-align: left;
    border: 0;
    width: auto;
}

.cpgContentFilterTDDots {
    vertical-align: top;
    font-family: Arial;
    font-weight: bold;
}

.cpgContentTableTDTopLeftPos {
    vertical-align: top;
    text-align: left;
}

a.actionBar:link {
    font-weight: bolder;
    font-size: larger;
}

.boxTitle {
    font-weight: bold;
    font-size: 8pt;
    padding-bottom: 4px;
    color: white;
    padding-top: 4px;
    background-color: #016e00;
}

.PurchaseLink {
    font-weight: bold;
    font-size: 8pt;
    color: #000000;
}

a.purchaseLink:link {
    font-weight: bold;
    font-size: 8pt;
    color: #000000;
}

a.purchaseLink:visited {
    font-weight: bold;
    font-size: 8pt;
    color: #000000;
}

.globalnav1, a.globalnav1 {
    font-family: Tahoma;
    color: #000000;
    text-decoration: none;
    font-size: 10px;
    line-height: 12px;
}

    a.globalnav1:active {
        color: #FF6600;
    }

    a.globalnav1:hover {
        color: #FF6600;
    }

a.nav1:active {
    color: #FF6600;
}

a.nav1:hover {
    color: #FF6600;
}

.nav1h, a.nav1h {
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
    color: #FFCC66;
    text-decoration: none;
    font-size: 11px;
    font-weight: bold;
}

h3 {
    font-weight: bold;
    font-size: 8pt;
    margin-bottom: 2px;
    color: #000000;
    font-family: Verdana, Tahoma, 'MS Sans Serif', Arial;
}

.sidebar {
    border-right: #cccccc 1pt solid;
    margin-right: 1px;
}

h4 {
    font-weight: bold;
    font-size: 8pt;
    margin: 0px;
    color: #016e00;
    font-family: Verdana, Tahoma, 'MS Sans Serif', Arial;
}

table.form {
    background-color: #ffffff;
}

.formhead {
    font-weight: bold;
    font-size: 8pt;
    color: white;
    font-family: Tahoma, Verdana;
}

.font12pt {
    font-size: 12pt !important;
}

.button {
    font-family: Arial;
    color: white;
    background-color: #755990;
    border-top: 1px solid #c0c0c0;
    border-left: 1px solid #c0c0c0;
    border-right: 1px solid #777777;
    border-bottom: 1px solid #777777;
    padding: 4px 8px 4px 8px;
    margin: 1px 1px 1px 1px;
    border-radius: 4px 4px 4px 4px;
    font-size: 8pt;
    width: 100px;
}

    .button:hover {
        background-color: #8a69aa;
    }

    .button:disabled {
        background-color: #c0c0c0;
        box-shadow: inset 0 0 0 1px #c0c0c0, inset 0 3px 20px #333333;
    }

.buttontextsize {
    font-family: Arial;
    color: white;
    background-color: #755990;
    border-top: 1px solid #c0c0c0;
    border-left: 1px solid #c0c0c0;
    border-right: 1px solid #777777;
    border-bottom: 1px solid #777777;
    padding: 4px 8px 4px 8px;
    margin: 1px 1px 1px 1px;
    border-radius: 4px 4px 4px 4px;
    font-size: 8pt;
    display: inline-block;
    text-align: center;
}

    .buttontextsize:hover {
        background-color: #8a69aa;
    }

.buttonfilterselection {
    font-family: Arial;
    color: white;
    background-color: #755990;
    border-top: 1px solid #c0c0c0;
    border-left: 1px solid #c0c0c0;
    border-right: 1px solid #777777;
    border-bottom: 1px solid #777777;
    padding: 10px 4px 10px 4px;
    margin: 3px 1px 3px 1px;
    border-radius: 12px 12px 12px 12px;
    font-size: 10pt;
    width: 250px;
}

    .buttonfilterselection:hover {
        background-color: #8a69aa;
    }


.buttonScaleSize {
    max-width: 145px;
    width:95%;
}

.smallbuttonfont {
    font-size:7pt;
}



.aspectLink:hover {
    color: black !important;
    background-color: lightgray !important;
}

.aspectLink {
    background-color: green !important;
    color: white !important;
}

*:focus {
    outline: none;
}

input[type=submit]:disabled {
    background-color: #c0c0c0;
    box-shadow: inset 0 0 0 1px #c0c0c0, inset 0 3px 20px #333333;
}

input[type=button]:disabled {
    background-color: #c0c0c0;
    box-shadow: inset 0 0 0 1px #c0c0c0, inset 0 3px 20px #333333;
}

.buttonNarrow {
    font-family: Arial;
    color: white;
    background-color: #755990;
    border-top: 1px solid #c0c0c0;
    border-left: 1px solid #c0c0c0;
    border-right: 1px solid #777777;
    border-bottom: 1px solid #777777;
    padding: 4px 4px 4px 4px;
    margin: 1px 1px 1px 1px;
    border-radius: 4px 4px 4px 4px;
    font-size: 8pt;
}

    .buttonNarrow:hover {
        background-color: #8a69aa;
    }

.warning {
    font-family: Verdana, Tahoma, 'MS Sans Serif', Arial;
    font-weight: bold;
    font-size: 12px;
    color: white;
    background: #FF0710; /* Old browsers */
    border: 6px solid #FF0710;
    border-radius: 10px;
    padding: 2px;
    float: right;
}

.download_img {
    height: 24px;
    width: 24px;
    border: 0;
    vertical-align: bottom;
    text-decoration: none;
}

.myreadonlycontrol {
    font-family: Arial;
    font-size: 8pt;
}

.mymultilineboxRowHeight {
    width: 95%;
    border-radius: 5px;
    font-family: Arial;
    font-size: 10pt;
    background-color: #F4F4F4;
    /*Remember to add style="resize:none" to the control. It cannot be included in the css but is required for Chrome*/
}

.mymultilineboxRowHeight:read-only {
    background-color:white;
}

/*Same as mymultilineboxRowHeight but flips the background colour between white for edit and grey for readonly when used in a grid that we edit*/
.mymultilineboxGridEdit {
    width: 95%;
    border-radius: 5px;
    font-family: Arial;
    font-size: 10pt;
    background-color: white;
    /*Remember to add style="resize:none" to the control. It cannot be included in the css but is required for Chrome*/
}

.mymultilineboxGridEdit:read-only {
    background-color: #F4F4F4;
}

.mymultilinebox {
    height: 50px;
    width: 95%;
    border-radius: 5px;
    font-family: Arial;
    font-size: 10pt;
    background-color: #F4F4F4;
    /*Remember to add style="resize:none" to the control. It cannot be included in the css but is required for Chrome*/
}

.mymultilinebox:read-only {
    background-color:white;
}

.mymultilineboxlarge {
    height: 150px;
    width: 95%;
    border-radius: 5px;
    font-family: Arial;
    font-size: 10pt;
    background-color: #F4F4F4;
    /*Remember to add style="resize:none" to the control. It cannot be included in the css but is required for Chrome*/
}

.mymultilineboxlarge:read-only {
    background-color:white;
}

.mycontrol {
    font-family: Arial;
    font-size: 10pt;
    background-color: #F4F4F4;
}

.mycontrolgriddatepicker {
    font-family: Arial;
    font-size: 10pt;
    background-color: #FFFFFF;
}

.mycontrolcatcomplete {
    font-family: Arial;
    font-size: 8pt;
    background-color: #F4F4F4;
}

.myradiobuttons {
    font-family: Arial;
    font-size: 9pt;
    font-weight: bold;
}

.mychkbox {
    margin-left: -4px;
}

.myucListBox {
    font-family: Arial;
    font-size: 10pt;
    background-color: #F4F4F4;
    width:100%;    
    height:200px;
}

.myucMinWidth {
    min-width:410px;
}

.mylistbox {
    font-family: Courier New;
    font-size: 8pt;
    background-color: #b6c7e5;
}

.myinputbox {
    width:100%;
    font-family: Arial;
    font-size: 10pt;
    background-color: #F4F4F4;
}

.cpgSpanText {
    font-family: Arial;
    color: #755990;
    font-size: 11pt;
}

.cpgFastNav {
    float: right;
    padding-top: 2px;
}

.title {
    font-family: Arial;
    color: #755990;
    font-size: 14pt;
}

.titlered {
    font-family: Arial;
    color: red;
    font-size: 14pt;
}

.titlebold {
    font-family: Arial;
    color: #755990;
    font-weight: bold;
    font-size: 15px;
}
    /* DL: fix for strange bold text font issue */
    .titlebold b {
        font-weight: bold;
    }

.titleboldred {
    font-family: Arial;
    color: red;
    font-weight: bold;
    font-size: 11pt;
}

.titlehyperlink {
    color: #755990;
    text-decoration: none;
    padding: 2px;
    border-radius: 2px;
}

    .titlehyperlink:hover {
        color: #ffffff;
        background-color: #8a69aa;
        padding: 2px;
        border-radius: 2px;
    }

.onpageuserhelptext {
    font-family: Arial;
    font-size: 0.85em;
    color: darkgray;
}

.removepadding {
    padding: 0px;
}

.nowrap {
    white-space: nowrap;
}

.titlemedium {
    font-family: Arial;
    color: #755990;
    font-size: 12pt;
}

.title10pt {
    font-family: Arial;
    color: #755990;
    font-size: 10pt;
   }

.titlesmall {
    font-family: Arial;
    color: #755990;
    font-size: 10px;
    font-weight: bold;
}

.titlelink {
    font-family: Arial;
    color: #000000;
    font-size: 11pt;
    font-weight: bold;
}

.gridth {
    font-family: Arial;
    font-size: 9pt;
    font-weight: bold;
    color: #ffffff;
    background-color: #755990;
    background-repeat: repeat-x;
    height: 22px;
    vertical-align: top;
}

.gridthscrolling {
    font-family: Arial;
    font-size: 8pt;
    font-weight: bold;
    color: White;
    position: relative;
    top: expression(this.offsetParent.scrollTop-2);
    left: -2px;
    background-color: #ffffff;
    padding: 0px;
}

    .gridthscrolling td {
        background-color: #755990;
        padding: 2px;
    }

/* The default style for grid items */
.selectedgriditem {
    background-color: beige;
}


.griditem {
    font-family: Arial;
    font-size: 10pt;
    text-align: Left;
    vertical-align: top;
}

/* A centered version of griditm for use with selection radio and check boxes*/
.gridcenter {
    text-align: center;
}
/* A right align version of griditm for use with numbers and currencies */
.gridright {
    text-align: right;
}

.itemStyle {
    padding-left: 2px;
}
/* DL: Suppress borders appearing in tables within grid cells */
.griditem > table td {
    border: 1px solid #ffffff !important;
}

.griditem > tr {
    border: 2px solid #ffffff;
}

.griditem a {
    color: #755990;
}

.gridpager {
    font-family: Arial;
    font-size: smaller;
}

.gridfooter {
    color: #000066;
    background-color: White;
}

.gridth span table {
    border: 1px solid #000000 !important;
}

td.general {
    font-size: 12px;
    font-family: Arial;
}

td.general_bottomspace {
    font-size: 12px;
    font-family: Arial;
    padding-bottom: 3px;
}

.gridsortitem {
    font-family: Arial;
    font-size: smaller;
    font-weight: bold;
    color: red;
    background-color: #755990;
}

.imagecursor {
    cursor: default;
}

.imgReportCheckbox {
    width: 16px;
    height: 16px;
}


.dglink {
    cursor: pointer;
    text-decoration: underline;
}

table.pgbLayout {
    border-width: 0px;
    border-collapse: collapse;
    width: 100%;
}

.DataGridFixedHeader {
    background-color: white; 
    position:relative; 
    top:expression(this.offsetParent.scrollTop);
}


.aspxDataGridControl {
    border: 1px solid #888;
    margin-bottom: 5px;
    border-collapse: collapse;
    border-spacing: 5px;
}


    .aspxDataGridControl > td {
        border: 1px solid #888;
        padding: 3px;
    }

        .aspxDataGridControl td a {
            color: #755990;
            text-decoration: none;
            padding: 1px;
            border-radius: 1px;
        }

            .aspxDataGridControl td a:hover {
                color: #ffffff;
                background-color: #8a69aa;
            }

    .aspxDataGridControl .gridth td {
        border: 1px solid #888;
    }

    .aspxDataGridControl .gridth a {
        border: 0px;
        color: #ffffff;
    }

    .aspxDataGridControl .gridpager {
        font-family: Arial;
        font-size: smaller;
        text-align: center;
    }


        .aspxDataGridControl .gridpager span {
            color: #000000;
            border: 2px solid #755990;
            padding-left: 7px;
            padding-right: 7px;
            border-radius: 2px 2px 2px 2px;
        }

        .aspxDataGridControl .gridpager a {
            border: 1px solid #959495;
            padding-left: 7px;
            padding-right: 7px;
            text-decoration: none;
            border-radius: 2px 2px 2px 2px;
            color: #755990;
        }


.gridPagerControl {
    border: 0px;
}

    .gridPagerControl td button {
        border: 1px solid blue;
    }

.pgbLayout td {
    padding: 0px;
}

table.pgbMain {
    background-color: #FF6600;
    border-width: 0px;
    border-collapse: collapse;
    height: 11px;
}

.tblMain {
    behavior: url(ScrollTable.htc);
}

.tblHeader {
    color: highlighttext;
}

.tblBody {
    background-color: #EEEEEE;
    color: darkblue;
}

.downloadLinkButton {
    color: #755990;
    text-decoration: none;
    padding: 1px;
    border-radius: 1px;
}

.downloadLinkButton:hover {
    color: #ffffff;
    background-color: #8a69aa;
}

/* Used to display print instructions for Benechmarking Graphs*/
@media print
{
	.PrintInstructions
	{
		display : none;
	}
}
@media screen
{
	.PrintInstructions
	{
		font-family : Arial;
		color : #755990;
		font-size : 10pt;
	}
}
/* Calendar Styles */
a.calendar {
    position: absolute;
    display: block;
    right: 0;
    top: 1px;
    width: 18px;
    height: 17px;
    padding-left: 18px;
    line-height: 18px;
    overflow: hidden;
    background: transparent url(/portal/images/buttons/calendar.gif) no-repeat 0 0;
}
/* Size and style calendar container (usually a div) */
div.calendar {
    width: 150px;
    border-width: 2px;
    border-style: outset;
    color: #ffffff;
    text-align: center;
    font: normal 10px Verdana, Arial, Helvetica, sans-serif;
    padding: 5px;
    position: absolute;
    background-color: #000000;
    z-index: 100;
}
/* center align everything */
.calendar * {
    text-align: center;
}
/* previous/next month buttons */
.calendar .next, .calendar .previous {
    position: absolute;
    top: 5px;
    display: inline-block;
    width: 18px;
    height: 17px;
    text-indent: -99em;
    overflow: hidden;
}

.calendar .previous {
    left: 12px;
    background-image: url(/portal/images/buttons/calendar_prev.gif);
}

.calendar .next {
    right: 12px;
    background-image: url(/portal/images/buttons/calendar_next.gif);
}

.calendar a:focus, calendar a:active {
    outline: 0;
}
/* calendar dates */
.calendar table {
    text-align: center;
    /*border-top: 1px solid #36c;
    border-bottom: 1px solid #36c;*/
    /*margin:					5px auto;*/
    width: 100%;
    font: normal 10px Verdana, Arial, Helvetica, sans-serif;
    border-collapse: collapse;
}
/* column headings: S, M, T, W... */
.calendar th {
    font-weight: bold;
    color: #755990;
    background-color: #fff;
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
}
/* dates */

/*.calendar tbody { line-height: 1.4 }*/

.calendar td {
    color: #999;
    border: none !important;
}

    .calendar td a {
        display: block;
        text-decoration: none;
        font-weight: normal;
        color: #000 !important;
        height: 100%;
    }

        .calendar td a:hover {
            background-color: #755990;
            margin: -1px;
            border: 1px solid #755990;
            color: #ffffff !important;
        }

    .calendar td.weekend {
        color: #ff8888 !important;
    }

.calendar .today {
    color: #000;
    font-weight: bold;
}

.calendar .weekend {
    color: #dd0000 !important;
}

.calendar .today a:hover {
    color: #000;
    font-weight: bold;
}

.calendar .selected, .calendar .selected a {
    color: #fff;
    background-color: #755990;
}
/* close button */
.calendar .close {
    display: block;
    font-weight: bold;
    color: #755990;
    text-decoration: none;
    width: 100%;
    margin: 0 auto;
}

    .calendar .close:hover {
        color: #f00;
        text-decoration: underline;
    }

.calendar select {
    font: normal 10px 'MS Shell Dlg', Verdana, Arial, Helvetica, sans-serif;
    width: 80px;
    text-align: center;
}

.dgPager {
    border: 1px solid #B8B7B7;
    cursor: hand;
    background-color: white;
    font-family: Arial;
    font-size: 8pt;
    color: #000000;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 7px;
    padding-right: 7px;
    text-decoration: none;
}

.dgPagerSelected {
    border: 2px solid #3074e0;
    cursor: hand;
    background-color: white;
    font-family: Arial;
    color: #755990;
    font-weight: bold;
    padding-left: 7px;
    padding-right: 7px;
    text-decoration: none;
    padding-top: 1px;
    padding-bottom: 1px;
}

td.HeaderNav {
    font-size: 11px;
    color: #666666;
    background-color: #ffffff;
    text-align: center;
}

a.headerNav:link {
    color: #666666;
    text-align: center;
    text-decoration: none;
}

a.headerNav:visited {
    color: #666666;
    text-align: center;
    text-decoration: none;
}

a.headerNav:hover {
    color: #009900;
    text-align: center;
}

.PageHead {
    font-weight: bold;
    font-size: 10pt;
    color: #016e00;
    line-height: 15pt;
    font-family: Verdana, Tahoma, Arial;
}

p.footerNav {
    font-size: 10px;
    color: #000000;
}

.InvHead {
    font-size: 22px;
    color: #013d00;
    font-family: Arial, Verdana, Tahoma;
}

table.box {
    border-right: #009900 1pt solid;
    padding-right: 0px;
    border-top: #009900 1pt solid;
    padding-left: 0px;
    padding-bottom: 0px;
    border-left: #009900 1pt solid;
    padding-top: 0px;
    border-bottom: #009900 1pt solid;
    background-color: #eeeee0;
}

.tButton {
    border-right: #013d00 1px solid;
    border-top: #013d00 1px solid;
    font-size: 8pt;
    border-left: #013d00 1px solid;
    border-bottom: #013d00 1px solid;
    background-color: #e3e3e3;
    text-decoration: none;
}

p:not(#scrollText) {
    margin-top: 8px;
    font-size: 8pt;
    margin-bottom: 8px;
    color: #000000;
}
/*input {
	font-size: 8pt;
}
select {
	font-size: 8pt; 
}*/

td.tableLeft {
    border-right: #009900 1pt solid;
    font-size: 8pt;
}

.tab {
    font-size: 10pt;
    color: #ffffff;
    background-color: #009900;
}

.navHead {
    border-right: #5c5b59 1pt solid;
    border-top: #5c5b59 1pt solid;
    border-left: #5c5b59 1pt solid;
    border-bottom: #5c5b59 1pt solid;
    background-color: #ebe6d9;
}

.tableRow {
    font-size: 8pt;
    color: #666666;
}

.tableRowInv {
    font-size: 8pt;
    background-color: #eeeee0;
}

.background {
    font-size: 8pt;
    background-color: #eeeee0;
}

.border {
    border-right: #009900 1pt inset;
    border-top: #009900 1pt inset;
    border-left: #009900 1pt inset;
    border-bottom: #009900 1pt inset;
}

.tableRowAward {
    font-size: 8pt;
    color: #699cff;
    background-color: #efffff;
}

.tableRowAwardInv {
    font-size: 8pt;
    color: #000066;
    background-color: #afeeee;
}

.error {
    font-size: 8pt;
    color: red;
    font-weight: bold;
}

.normal8 {
    font-size: 8pt;
    color: #755990;
}

.adminmenu {
    font-size: 10pt;
    color: #755990;
    text-decoration: none;
    padding: 4px;
    border-radius: 4px;
}

    .adminmenu:hover {
        font-size: 10pt;
        text-decoration: none;
        color: #ffffff;
        background-color: #8a69aa;
        padding: 4px;
        border-radius: 4px;
    }

ol {
    margin-top: 8px;
    font-size: 8pt;
    margin-bottom: 8px;
}

    ol li {
        margin-top: 8px;
        font-size: 8pt;
        margin-bottom: 8px;
    }

h1 {
    margin-top: 0px;
    font-weight: bold;
    font-size: 12pt;
    margin-bottom: 2px;
    color: #016e00;
    line-height: 12pt;
}

h2 {
    font-weight: bold;
    font-size: 10pt;
    margin-bottom: 2px;
    color: #016e00;
    line-height: 8pt;
}

.hint {
    width: 100%;
    color: darkgray;
    font-size: 0.6em;
    padding-bottom: 2px;
    text-align: center;
}

/* Easy Query Styles */

.buildReportContent {
    width: 100%;
}

.entitiesPanelContentLeft {
    width: 30%;
    /*background-color: #faf1f8;*/
    border-radius: 20px;
    /*height: 360px;*/
    vertical-align: top;
    padding: 25px 25px 0px 25px;
}

.entitiesPanelContentRight {
    height: 1%;
    overflow: auto;
    border-radius: 20px;
    vertical-align: top;
    padding: 25px 25px 0px 25px;
}

.rptOutputContent {
    padding: 25px 25px 0px 25px;
}
.tblSelectColumns100h {
    /*height: 100%;*/
    width: 100%;
    border: solid 1px #652d88;
    border-radius: 5px;
}

.tblSelectColumns50h {
    height: 50%;
    width: 100%;
    border: solid 1px #652d88;
    border-radius: 5px;
    margin: 0 0 0 0;
}

.tblSelectColumnsTitleCell {
    padding: 0 0 0 0;
}

.reportModulesSelect {
    padding: 2px 5px 0px 5px;
}

.tdLeft {
    text-align: left;
}

.tdRight {
    text-align: right;
}

.tbl100perc {
    width: 100%;
}

.qp {
    width: 100% !important;
    height: auto !important;
    overflow: auto !important;
}

.wzdNavStyle {
    padding-right: 17px;
}

.HNATableOddRow {
    background-color: #b8d2f7;
}

.HNATableEvenRow {
    background-color: white;
}

.HNATableLabel {
    vertical-align: top;
    text-align: left;
    width: 200px;
    border: solid;
    border-collapse: collapse;
}

.HNATableData {
    vertical-align: top;
    text-align: right;
    width: 100px;
    border: solid;
    border-collapse: collapse;
}

.HNATableCVHeader {
    border: solid;
    border-collapse: collapse;
    width: 100px;
}

.HNATableHCHeader {
    border: solid;
    border-collapse: collapse;
    width: 100px;
}

.HNATableHeader {
    border: solid;
    border-collapse: collapse;
    text-align: center;
    width: 400px;
}

.unPublished {
    FONT-FAMILY: Arial;
    COLOR: red !important;
    font-size: 10pt;
}

.paddedTD {
    padding-left: 5px;
}

.divReport {
    display: inline-block;
    color: white;
    width: 248px;
    float: left;
    background: #755990; /* Old browsers */
    height: 50px;
    padding: 0px 0px 0px 0px;
    margin: 5px 5px 5px 5px;
    border-radius: 8px 8px 8px 8px;
    font-size: 12px;
    border: solid 1px #755990;
}

.whiteURL {
    display: table-cell;
    height: 50px;
    width: 248px;
    text-align: center;
    vertical-align: middle;
    border-radius: 8px 8px 8px 8px;
    color: white !important;
    text-decoration: none;
    border: solid 1px #755990;
}

    .whiteURL:hover {
        background: #d9d0e2;
        height: 48px;
        width: 248px;
        border-radius: 8px 8px 8px 8px;
        color:  #755990 !important;
        border:solid 1px #755990;
    }

.divReportunpublished {
    display: inline-block;
    color: white;
    width: 248px;
    float: left;
    background: red; /* Old browsers */
    height: 50px;
    padding: 0px 0px 0px 0px;
    margin: 5px 5px 5px 5px;
    border-radius: 8px 8px 8px 8px;
    font-size: 12px;
    border: solid 1px red;
}

.whiteURLunpublished {
    display: table-cell;
    height: 50px;
    width: 248px;
    text-align: center;
    vertical-align: middle;
    border-radius: 8px 8px 8px 8px;
    background: red !important;
    color: white !important;
    text-decoration: none;
    border: solid 1px red;
}

    .whiteURLunpublished:hover {
        background: white !important;
        height: 48px;
        width: 248px;
        border-radius: 8px 8px 8px 8px;
        color: red !important;
        border:solid 1px red;
    }

.treeview a:hover
{
    background-color:#CCCCCC;   
}
.treeparent 
{
    color:Blue;
    font-size:12px;
}
.treeparent a:hover 
{
    color:Blue;
    font-size:12px;
}
.treechild 
{
    color:Green;
    font-size:12px;
}
.treechild a:hover 
{
    color:Green;
    font-size:12px;
}
.s-treeview a:hover
{
    font-family: Verdana, Arial, Helvetica;
    background-color: #CCCCCC;   
}
.s-treeparent 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
.s-treeparent a:hover 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
.s-treechild 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
.s-treechild a:hover 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
.s-treesubchild 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
.s-treesubchild a:hover 
{
    color:Black;
    font-family: Verdana, Arial, Helvetica;
    font-size:12px;
}
/*
    ********************************
    * Accordion Styles
    ********************************
*/


.ui-accordion .ui-accordion-header {
    display: block;
    cursor: pointer;
    position: relative;
    margin-top: 2px;
    padding: .5em .5em .5em .7em;
    min-height: 0;
    outline: none;
}

.ui-accordion .ui-accordion-content {
    border-top: 0;
    overflow:auto;
    padding: 0px !important;
    margin-top: 0px !important;
}

.sidebar {
    width: 150px;
    height: 100%;
    right: 2.5%;
    position: absolute;
    transform: translate3d(200px, 0, 0);
    transition: transform .2s linear;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border: 0px solid #ecc5e7;
    background: #755990 50% 50% repeat-x; /*Default Accordion background colour*/
    font-size: 14px;
    font-weight: bold;
    color: white; /*Default Accordion text colour*/
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
    border: 0px solid #79b7e7;
    background: #8a69aa 50% 50% repeat-x; /*Hover over Accordion background colour*/
    font-weight: bold;
    color: white; /*Hover over Accordion text colour*/
}

.sidebar:hover {
    transform: translate(0);
}

    .sidebar:hover .label {
        opacity: 0;
    }

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 5px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 5px;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 5px;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 5px;
}

/*
    ********************************
    * Autocomplete Filters
    ********************************
*/
.autocomplete-filter-button {
    display: none;
}

.autocomplete-filter-box {
    width: 60%;
}

.clicktopin {
    cursor: pointer;
    color: #333;
    font-size: 15px;
}

.label {
    width: 10px;
    height: 100%;
    background: #444;
    position: absolute;
    right: 160px;
    top: 0;
    box-shadow: 3px 0 5px rgba(0, 0, 0, .5);
    transition: opacity .2s linear;
}


/*
    ********************************
    * Styles removed from pages
    ********************************
*/
.hiddenpanel {
    display: none;
}

/* From PCM */
.ui-accordion-header {
    outline: none;
}

#accGeneral .ui-state-focus {
    outline: none;
}


#accFilters .ui-state-focus {
    outline: none;
}

.ui-autocomplete-loading { 
    background: url(../images/jquery/ui-anim_basic_16x16.gif) #F4F4F4 no-repeat right center 
}

.ui-autocomplete {
    position: absolute;
    cursor: default;
    height: 210px;
    overflow: auto;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 100;
    width: 22% !important;
}

.ui-autocomplete-category {
    font-weight: bold;
    padding: 0px;
    margin: 0px;
    line-height: 1.5;
    border-bottom: #755990 3px solid;
}

.ui-menu {
    border-bottom: #dedede 1px solid;
    border-left: #dedede 1px solid;
    padding-bottom: 2px;
    background-color: #d3d3d3;
    list-style-type: none;
    margin: 0px;
    padding-left: 2px;
    padding-right: 2px;
    display: block;
    float: left;
    border-top: #dedede 1px solid;
    border-right: #dedede 1px solid;
    padding-top: 2px;
    color: #755990;
    font-size: 10pt;
}

    .ui-menu .ui-menu-item {
        border-bottom: #c0c0c0 1px solid;
        padding-bottom: 0px;
        background-color: #ededed;
        margin: 0px;
        padding-left: 0px;
        width: 100%;
        padding-right: 0px;
        zoom: 1;
        float: left;
        clear: left;
        padding-top: 0px;        
    }

        .ui-menu .ui-menu-item a {
            padding-bottom: 0.2em;
            line-height: 1.5;
            padding-left: 0.4em;
            padding-right: 0.4em;
            zoom: 1;
            display: block;
            text-decoration: none;
            padding-top: 0.2em;
            color: #755990;
        }

        .ui-menu .ui-menu-item a:hover {
            color: white;
        }


.ui-helper-hidden-accessible {
    display: none;
}

/* PPI Grid Classes */
.PPIGridSub {
    font-family: Arial;
    font-size: 10pt;   
    vertical-align: top;
    background-color: palegreen;
}

.PPIGridTotal {
    font-family: Arial;
    font-size: 10pt;   
    font-weight: bold;
    vertical-align: top;
    background-color: lightyellow;
}

.genericErrorBox
{    
    vertical-align: central;
    width: 550px;
    margin: 75px auto;
    position: relative;
    border-radius: 10px;
    text-align: center;
    padding: 35px 40px 35px 40px;
    box-shadow: 0 0 20px 0 rgba(0,0,0,0.2), 0 5px 5px 0 rgba(0,0,0,0.24);
}
.genericMessagePane 
{    
    font-family: Verdana, Arial, Helvetica;    
    height: 47px;
    text-align: left;
    font-family: Verdana, Arial, Helvetica;
    padding-left: 10px;
    font-size: 14px;
}

.GDPRDisplay {
    vertical-align: central;
    width: 750px;    
    margin: 75px auto;
    position: relative;
    border-radius: 10px;
    text-align: left;
    padding: 35px 40px 35px 40px;
    box-shadow: 0 0 20px 0 rgba(0,0,0,0.2), 0 5px 5px 0 rgba(0,0,0,0.24);
}

.no-close a.ui-dialog-titlebar-close.ui-corner-all {
    display: none;
}

.show-close a.ui-dialog-titlebar-close.ui-corner-all {
    display: block;
}

.imgGIS {
    height: 25px;
    width: 25px;
    border: 1px solid white;
}

.imgGISMarginL-5px {
    margin-left: -5px;
}

.imgGISMarginL-6px {
    margin-left: -6px;
}

.imgGISPadLeft118 {
    margin-left: 118px;
}

.imgWidth71 {
    width: 71%;
    float: left;
}

.imgGISArrowTopBotCentre {
    padding-left: 200px;
    padding-right: 200px;
}

.imgGISArrowMidLeftRight {
    padding-top: 200px;
}

.bodyGISCallBack {
	background-image: url(../images/imgGIS/mapinfo_watermark.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}

.divFilter300px {
    width: 300px;
}

.myautocompletecontrol
{
    height: 17px;	
	font-family : Arial;
	font-size : 8pt;
	background-color : #F4F4F4;
	background-image: url(../images/autocomplete_indicator.png);
	background-position: left top;
	background-repeat: no-repeat;
	padding-left: 8px;
	margin: 0px;
	padding-top: 0px;
	vertical-align:top;
    width: 95% !important;
}
.automcompleteDropdown 
{
    width: 20px;
    height: 20px;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 6px;
    border: 1px solid #d0d0d0;
	background-image: url(../images/autocomplete_downarrow.png);
    border-radius: 4px;
}

.asbestosClass {
    background: #ffb6c1;
}

.ui-datepicker {
    font-size: small;
}

/*.ui-widget-content a:hover {
    background: #755990 !important;
}*/

.ui-widget input {
    font-family: Arial;
    font-size: 8pt;
}

/*.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: Arial;
    font-size: 8pt;
}*/

.ui-dialog {
    top: 100px !important;
}

.multilineselect {
    font-size: 12px;
    font-family: Arial;
    background-color: #F4F4F4;
    border-radius: 5px;
}

.multilineselect li.selected {
    background-color: #755990;
    color: white;
}

.ui-widget-content {
    border: 0px !important;
}

/*************************************************************/
/* Schedule summary, Schedule and User Group - user controls */
/*************************************************************/
    .ucSchSumReportContainer {
        margin-left: 25px; 
        margin-right: 25px; 
        margin-top: 25px; 
        min-width: 862px;        
    }

    .ucSchSumRepeater {
        color: black;
        display: inline-block;
        width: 100%;
    }

    .ucSchSumRepeaterHeader {
        display: inline-block;
        width: 100%;
        color: #755990;
        font-size: 12pt;        
    }

    .ucSchSumRepeaterItem {
         display: inline-block;
         min-height: 27px;
         width: 100%;
         border-top: 1px solid silver;
         padding-top:3px;
         margin-bottom: -5px;
         font-size: 10pt;
    }

    .ucSchSumRepeaterItem a {
            color: #755990;
            text-decoration: none;
            padding: 1px;
            border-radius: 2px;
        }
            .ucSchSumRepeaterItem a:hover {
                color: #ffffff;
                background-color: #8a69aa;
            }

    .ucSchSumRepeaterFooter {
        border-Top: 1px solid silver;         
        width: 100%;
    }


    .ucSchSumActiveItem {
        background-color: #f3eff5;
        border: 1px solid silver;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        margin-top:2px;
        margin-bottom:2px;
    }

    .ucSchSumFieldSet {
        border: solid 1px #652d88;
        padding-bottom:20px;
    }

    .ucSchSumDescription {
        padding-top: 6px;
        font-family: Arial;
        font-size: 12px;
        font-weight: bold;
    }

    .ucSchSumUserNoteText {
        margin-left: 10px;
        font-family: Arial;
        font-size: 12px;
        font-weight: normal;
        color:#737373;
        float:left;
        padding-top: 6px;
    }

     .ucRaUUserGroup {        
        padding-top: 10px;
        padding-left: 4px;
    }

    .ucRaUUserGroup select {
        width: 260px;
    }

    .ucRaUUserGroup input[type=text] {
        width: 260px;
    }

    .ucRaUCreateGroup {
        padding-left: 3px;
        margin-right:3px;
    }

    .ucRaUHeader {
        width: 100%;
        font-size: 12pt;
        font-family: Arial;
        color: #755990;
        padding-top: 10px;
        padding-bottom: 5px;
        display: inline-block;        
    }

    .ucRaUCheckBoxListRoles {
        display: inline-block;
        padding-top: 10px;
        padding-bottom: 5px;       
        width: 100%;
        border-top: 1px solid silver;
    }    

    .ucRaUCheckBoxListRoles td{
        min-width: 150px;
    }

    .ucRaURoleRecipients {
        width: 100%;
        font-size: 10pt;
        font-family: Arial;
        font-weight: normal;
        color: #737373;
        display: inline-block;     
        padding-top: 5px;
        padding-bottom: 5px;   
    }

    .ucRaURoleRecipients div {
        display: inline-block;
    }

    .ucRaURole {
        min-width: 100px;
        width: 20%;
        float: left;
        padding-bottom: 2px;
        padding-top: 2px;   
        font-weight:bold;        
    }

    .ucRaUUserRepeater {
        color: black;
        padding-top: 5px;
        margin-top: 5px;
        display: inline-block;
        width: 100%;
        border-top: 0px solid silver;
        border-bottom: 0px solid silver;
        padding-bottom: 5px;
    }

    .ucRaUUserFilter {
        display: inline-block;
        width: 100%;
        font-size: 12px;
        font-family: Arial;
        font-weight: bold;
        padding-bottom: 5px;
    }

    .ucRaUUserFilter div {
        display: inline-block;        
    }

    .ucRaUUserFilter input {
        padding-left: 10px;     
    }

    .ucRaUUser {
        min-width: 100px;
        width: 33%;
        float: left;
        padding-bottom: 2px;
        padding-top: 2px;   
        display: inline-block;    
    }

    .ucRaUUser input {
        border: 1px solid rgb(0,102,204);
        border-radius: 3px;
        color: rgb(23,119,177);
        height:20px;
        margin-top: -3px;
        margin-bottom: 2px;
        vertical-align:text-top;
    }

    .ucRaUUser input[type=submit]:disabled {
        box-shadow: inset 0px 0px 0px 1px #c0c0c0, inset 0px 3px 20px #a6a6a6
    }

    .ucRaUUserRole {
        color: #737373;
    }

    .ucRaURoleUserPlusButton{
        background-color: #80d4ff !important;
    }

    .ucRaUIndUserPlusButton{
        background-color: #88e94e !important;
    }

    .ucRaUExcludeUserMinusButton {
        background-color: #ff6666 !important;
        color: white !important;
    }

    .ucRaURecipientNotIncluded{
        color: #737373;
    }

    .ucRaUKeyHolder {
        display:inline-block;        
        font-size: 10pt;
        font-family: Arial;
        font-weight: bold;
        vertical-align: text-bottom;
        padding-top: 5px;
        width: 100%;
        border-bottom: 1px solid silver;
    }

    .ucRaUKeyDesc {
        display:inline-block;        
        font-size:10pt;
        font-family: Arial;
        font-weight: normal;
        vertical-align: text-bottom;
        padding-top: 5px;        
    }

    .ucRaUKeyBlock {
        display:inline-block;
        border: 1px solid rgb(0,102,204);
        border-radius: 3px;
        color: rgb(23,119,177);
        height:10px;
        width: 5px;
        padding-top: 5px;
        padding-left: 5px;
        padding-right: 5px;
        margin-top: -1px;
        margin-bottom: 2px;
        vertical-align:text-top;
    }

    .ucRaUKeyRole {
        background-color: #80d4ff;
    }

    .ucRaUKeyInd { 
        background-color: #88e94e;
    }

    .ucRaUKeyExcluded{
        background-color: #ff6666;
    }

    .ucRaUShowRoleButton{
        background-color: #755990;
        font-size: 8pt;
        color: white;
        border-radius: 4px 4px 4px 4px;
        border-top: 1px solid #c0c0c0;
        border-left: 1px solid #c0c0c0;
        border-right: 1px solid #777777;
        border-bottom: 1px solid #777777;
    }

    .ucRaUGroupSaveButtons{
        padding-top: 5px;
        padding-bottom: 5px;
        display: inline-block;
        width: 100%;
    }

    .ucRaURecipientKey {
        display:inline-block;
        border-top: 1px solid silver;
        margin-top: 10px;
        padding-top: 5px;
        width: 100%;
        font-size:10pt;
        font-family: Arial;
        font-weight: normal;
        color: #737373;
    }

    .ucSchShedule {
        width: 100%;
    }

    .ucSchShedule .select {
        padding: 2px;
        border: 1px solid #755990;
        background: none; 
        padding: 0; 
        margin: .2em 0; 
        vertical-align: middle; 
        margin-left: .4em; 
        font-size: 100%;
    }
    .ucSchShedule .select-selected:after {
        position: absolute;
        content: "";
        top: 14px;
        right: 10px;
        width: 0;
        height: 0;
        border: 6px solid transparent;
        border-color: #fff transparent transparent transparent;
    }

    .ucSchShedule .select-items div,.select-selected {
        color: #ffffff;
        padding: 8px 16px;
        border: 1px solid transparent;
        border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
        cursor: pointer;
    }

    .ucSchShedule .ui-widget input {
        font-family: Verdana, Tahoma, "MS Sans Serif", Arial;
        font-size: 9pt;
    }

    .ucSchShedule .ui-widget-content {
        border: 1px solid #755990 !important;
        background-color: white;
    }

    .ucSchShedule .ui-spinner {
        position:relative; 
        display: inline-block; 
        overflow: hidden; 
        padding: 0; 
        vertical-align: middle;
    }

    .ucSchShedule .ui-spinner-input { 
        border: none; 
        background: none; 
        padding: 0; 
        margin: .2em 0; 
        vertical-align: middle; 
        margin-left: .4em; 
        font-size: 100%;
    }

    .ucSchShedule .ui-spinner-button { 
        width: 20px; 
        height: 50%; 
        font-size: .5em; 
        padding: 0; 
        margin: 0; 
        text-align: center; 
        position: absolute; 
        cursor: default; 
        display: block; 
        overflow: hidden; 
        right: 0;
    }

    .ucSchShedule .ui-spinner a.ui-spinner-button { 
        border-top: none; 
        border-bottom: none; 
        border-right: none; 
        border-top-right-radius: 0px;
        border-top-left-radius: 0px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;           
    }

    .ucSchShedule .ui-corner-all {
        border-top-right-radius: 0px;
        border-top-left-radius: 0px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;                
    }

    .ucSchShedule .ui-spinner .ui-icon { 
        position: absolute; 
        margin-top: -5px; 
        top: 50%; 
        left: 0; 
    }

    .ucSchShedule .ui-spinner-up { 
        top: 0px;
        margin-top: 2px;
        background: white;
        color:black;
    }

    .ucSchShedule .ui-spinner-down {
        bottom: 0px;
        background: white;
        color:black;
    }

    .ucSchShedule .ui-spinner .ui-icon-triangle-1-s {
        background: url(../images/ui-icons_ffffff_256x240.png) -64px -16px !important;
        left: 7px;
    }

    .ucSchShedule .ui-spinner .ui-icon-triangle-1-n {
        background: url(../images/ui-icons_ffffff_256x240.png) 0px -16px !important;
        left: 7px;
    }

    .ucSchSingleDate {
        float: left;
        display: inline-block;        
    }

    .ucSchSingleTime {
        float: left;
        display: inline-block;
        width: 200px;
    }

    .ucSchSingleTime .ui-spinner-input {
        border: none; 
        background: none; 
        padding: 0;
        margin: .2em 0; 
        vertical-align: middle; 
        margin-left: .4em; 
        font-size: 100%;
        width: 60px;
    }

    .ucSchSingleItem {
         display: inline-block;
         min-height: 27px;
         width: 100%;         
         padding-top:5px;
         margin-bottom: -5px;
         font-size: 10pt;
    }


/*******************************************/
/*     Schedule Queue Maintenance          */
/*******************************************/
    .SchQueueItemComplete {
        background-color:#88e94e; 
        min-height: 19px;       
    }

    .SchQueueItemPending {
        background-color:#80d4ff;    
        min-height: 19px;   
    }

    .SchQueueItemCancelled {
        background-color:#ff6666;       
        min-height: 19px;
    }
/*******************************************/

/*******************************************/
/*     User Defined Data (user control     */
/*******************************************/
    .UDCheckBox {
        padding-top: 0px;
        padding-bottom: 0px;
        height: 21px;
    }

    .UDRepeaterDisplay {
        height:17px;
        margin: 0px 0px 0px 2px;
    }

    .UDRepeaterEdit {
        height:22px;
    }

    .UDRepeaterTA {
        height:85px;
    }

    .UDRepeaterTA textarea{
        height:77px;
        overflow-x: auto;
        overflow-y: auto;
    }
    
    .UDRepeaterEditTA {
        height:85px;
    }

    .UDRepeaterEditTA textarea{
        height:77px;
        overflow-x: auto;
        overflow-y: auto;
    }

    .UDContents .ui-widget input {
        font-family: Arial;
        font-size: 10pt;
    }

    .UDContents hr {
        height: 1px;
    }

    .UDButtonDiv {
        text-align: right;
        display: inline-block;
        width: 100%;
        padding-top: 4px;
    }

    .UDGrid {
        font-size: 14px;
    }

    .UDField {
        width: 24%;
        float: left;
        padding-bottom: 2px;
        padding-top: 2px;
    }

/*******************************************/

/*.ui-helper-clearfix { display:block; }

.ui-helper-clearfix { zoom: 1; }

.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; }

.ui-dialog .ui-dialog-titlebar { padding: 0.7em 1em 0.6em 1em; position: relative; border: none; border-bottom: 1px solid #979797; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;  }

.ui-widget-content { border: 1px solid #B6B6B6; background: #ffffff; color: #4F4F4F; }

.ui-dialog {
	-webkit-box-shadow: 0 2px 12px rgba(0,0,0,0.6);
	-moz-box-shadow: 0 2px 12px rgba(0,0,0,0.6);
	box-shadow: 2px 2px 2px #C3C2C2;
	-webkit-border-radius: 6px; 
    -moz-border-radius: 6px; 
    border-radius: 6px;
}

.ui-corner-all { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }

.ui-widget { font-family: Arial,sans-serif;}

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 6px; -webkit-border-top-left-radius: 6px; -khtml-border-top-left-radius: 6px; border-top-left-radius: 6px; }
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 6px; -webkit-border-top-right-radius: 6px; -khtml-border-top-right-radius: 6px; border-top-right-radius: 6px; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 6px; -webkit-border-bottom-left-radius: 6px; -khtml-border-bottom-left-radius: 6px; border-bottom-left-radius: 6px; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 6px; -webkit-border-bottom-right-radius: 6px; -khtml-border-bottom-right-radius: 6px; border-bottom-right-radius: 6px; }

.ui-draggable .ui-dialog-titlebar { cursor: move; }

.ui-corner-all { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }

.ui-widget-header { border: 1px solid #B6B6B6; color: #4F4F4F; font-weight: bold; }

.ui-widget-header {
	background: #ededed url(../../images/skins/cipfabluewide/jquery/bg_fallback.png) 0 0 repeat-x;
		background: -moz-linear-gradient(top, #ededed 0%, #c4c4c4 100%); 
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#c4c4c4)); 
		background: -webkit-linear-gradient(top, #ededed 0%,#c4c4c4 100%); 
		background: -o-linear-gradient(top, #ededed 0%,#c4c4c4 100%); 
		background: -ms-linear-gradient(top, #ededed 0%,#c4c4c4 100%); 
		background: linear-gradient(top, #ededed 0%,#c4c4c4 100%); 
}*/

progress {
    background-color: whiteSmoke;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.5) inset;
    border: none;
    height: 20px;
    width: 100%;
    color: #755990;
}

progress::-webkit-progress-bar {
    background-color: whiteSmoke;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.5) inset;
    border: none;
    height: 20px;
    width: 100%;
}

progress::-webkit-progress-value {
    border: none;
    border-radius: 3px;
    height: 20px;
    background: #755990;
}

progress::-moz-progress-bar {
    background-color: whiteSmoke;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,.5) inset;
    border: none;
    height: 20px;
    width: 100%;
    background: #755990;
}

/*******************************************/
/*                WMS Viewer               */
/*******************************************/

.cpgWMSViewermain {
    height: 100%;
    width:100%;
    display: flex;
}

.cpgWMSTopNav {
    height: 16px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.cpgWMSTopLeftcontainer {
    height: 100%;
    width: 33%;
}

.cpgWMSTopMidcontainer {
    height: 100%;
    width: 33%;
    text-align: center;
}

.cpgWMSTopRightcontainer {
    height: 100%;
    width: 33%;
    text-align: right;
}

.cpgFlexitemLeft {
    align-self: flex-start;
}

.cpgFlexitemCentre {
    align-self: center;
}

.cpgFlexitemRight {
    align-self: flex-end;
}

.cpgWMSMiddleNav {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
}

.cpgWMSMidLeftcontainer {
    height: 100%;
    width: 16px;
    display: flex;
}

.cpgWMSMidCentrecontainer {
    height: 100%;
    width: 100%;
    display: flex;
}

.cpgWMSMiddleRightcontainer {
    height: 100%;
    width: 16px;
    display: flex;
}

.cpgWMSBotNav {
    height: 16px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.cpgWMSBotLeftcontainer {
    height: 100%;
    width: 33%;
}

.cpgWMSBotMidcontainer {
    height: 100%;
    width: 33%;
    text-align: center;
}

.cpgWMSBotRightcontainer {
    height: 100%;
    width: 33%;
    text-align: right;
}

.wopDateTimeAddedPanel {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    background-color: #f0f7fb;
    border-radius: 6px;
    line-height: 18px;
    overflow: hidden;
    padding: 15px 15px 15px 15px;
}

/*#region styles for the GridHelper grid */
/*#region styles for the GridHelper grid header info block*/
.gridContainer {
    font-family: Verdana, Tahoma, "MS Sans Serif", Arial;
    font-size: 1em;
}

.gridContainer .gridscroll {
    float: left;
    width: 100%;
    overflow: auto;
}

.gridContainer .gridheader {
    padding: 3px 6px 6px 6px;
    height: 20px;
    background-color: lightgray;
    color: #755990;
    width: calc(100% - 12px);
    float: left;
    display: inline-block;
    box-sizing: content-box;
}

.gridContainer .gridcounts {
    width: calc(25% - 12px);
    font-size: 0.9em;
    text-align: left;
    float: left;
    display: inline-block;
    box-sizing: content-box;
    padding-top: 3px;
}

.gridContainer .gridpager {
    text-align: center;
    background-color: lightgray;
    width: calc(48% - 12px);
    font-size: 0.9em;
    float: left;
    display: inline-block;
    box-sizing: content-box;
    padding-top: 3px;
}

    .gridContainer .gridpager span {
        color: #755990;
        border: 1px solid #755990;
        border-radius: 2px;
        padding-left: 3px;
        padding-right: 3px;
        margin-left: 3px;
        margin-right: 3px;
        font-size: 1em;
    }

    .gridContainer .gridpager a {
        border: 1px solid #959495;
        border-radius: 2px;
        text-decoration: none;
        padding-left: 4px;
        padding-right: 4px;
        margin-left: 3px;
        margin-right: 3px;
        font-size: 1em;
        color: #959495;
    }

        .gridContainer .gridpager a:hover {
            color: white;
            background-color: #8a69aa;
        }

.gridContainer .griddownload {
    text-align: right;
    background-color: lightgrey;
    padding-bottom: 0px;
    padding-top: 0px;
    padding-left: 5px;
    padding-right: 5px;
    width: calc(20% - 10px);
    height: 20px;
    font-size: 1em;
    float: left;
    display: inline-block;
    box-sizing: content-box;
}

    .gridContainer .griddownload > .downloadpage {
        text-decoration: none;
        font-size: 1em;
        background: url("../images/amgridhelper/download-page.png") no-repeat;
        width: 48px;
        height: 24px;
        margin-right: 10px;
        display: inline-block;
    }

        .gridContainer .griddownload > .downloadpage:hover {
            background: url("../images/amgridhelper/download-page-hover.png") no-repeat;
        }

    .gridContainer .griddownload > .downloadall {
        text-decoration: none;
        font-size: 1em;
        background: url("../images/amgridhelper/download-all.png") no-repeat;
        width: 48px;
        height: 24px;
        display: inline-block;
    }

        .gridContainer .griddownload > .downloadall:hover {
            background: url("../images/amgridhelper/download-all-hover.png") no-repeat;
        }

.gridContainer .gridpagelength {
    text-align: right;
    background-color: lightgrey;
    padding: 3px 3px 0px 3px;
    width: calc(7% - 12px);
    font-size: 1em;
    color: #755990;
    float: right;
    display: inline-block;
    box-sizing: content-box;
}

.gridContainer .gridpagelength a {
    border: 1px solid #959495;
    border-radius: 2px;
    margin-left: 2px;
    margin-right: 2px;
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 1px;
    text-decoration: none;
    font-family: monospace;
    font-size: 1em;
    color: #755990;
    vertical-align: top;
}

.gridContainer .gridpagelength a:hover {
    color: white;
    background-color: #8a69aa;
    }

.gridContainer .gridpagelength > .gridpagelengthdisabled {
    border: 1px solid #959495;
    border-radius: 2px;
    margin-left: 2px;
    margin-right: 2px;
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 1px;
    text-decoration: none;
    font-family: monospace;
    font-size: 1em;
    color: silver;
    vertical-align: top;
}
/*#endregion*/

.gridContainer .gridtable {
    border: 1px solid #888;
    margin-bottom: 5px;
    border-collapse: collapse;
    border-spacing: 5px;
    font-size: 0.9em;
    text-align: left;
}

.gridContainer .gridtable > .gridthead th {
    position: sticky;
    top: -1px;
}

.gridContainer .gridthead > .gridtr > .gridth {
    border: 1px solid #888;
    font-weight: normal;
    font-size: 1em;
    color: white;
    background-color: #755990;
    background-repeat: repeat-x;
    height: 24px;
    vertical-align: middle;
    text-align: left;
    padding-left: 1px;
}

.gridContainer .gridthead > .gridtr > .gridth.editrow {
    width: 150px;
    text-align: center;
}

.gridContainer .gridthead > .gridtr > .gridth.deleterow {
    width: 70px;
}

.gridContainer .gridtable > .gridthead > .gridtr > .gridth > .unboundcheckbox {
    text-align: center;
}

.gridContainer .gridtable > .gridthead > .gridtr > .gridth > a {
    font-weight: normal;
    color: white;
    background-color: #755990;
    text-decoration: none;
    border-radius: 2px 2px 2px 2px;
    padding: 2px 4px 2px 4px;
}

.gridContainer .gridtable > .gridthead > .gridtr > .gridth a:hover {
    font-weight: normal;
    color: white;
    background-color: #806f91;
    text-decoration: none;
    border-radius: 2px 2px 2px 2px;
    padding: 2px 4px 2px 4px;
}

.gridContainer .gridtable > .gridthead > .gridtr > .gridth > a > .sortorderasc {
    background: url("../images/amgridhelper/Sort-ASC.png") no-repeat;
    height: 12px;
    width: 12px;
    display: inline-block;
}

.gridContainer .gridthead > .gridtr > .gridth > a > .sortorderdesc {
    background: url("../images/amgridhelper/Sort-DESC.png") no-repeat;
    height: 12px;
    width: 12px;
    display: inline-block;
}

.gridContainer .gridtable > .gridthead > .gridtr > .gridth > a > .sortordernone {
    display: none;
}

.gridContainer .gridtable > .gridtbody {
}

.gridContainer .gridtable > .gridtbody > .gridtr:hover {
    background-color: #efefef;
    outline: 1px solid #888;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd {
    border: 1px solid #888;
    padding: 3px;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridreadonlytext{
    min-height: 18px;
    vertical-align:central;
}

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridreadonlytextlow {
        min-height: 18px;
        vertical-align: central;
        color: dimgray;
    }

/*#region styles for .gridtdtextbox textbox*/
    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdtextbox {
        border: 1px solid #888;
        padding: 3px;
        background-color: #f2eef6;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdtextbox div {
        width: calc(100% - 6px);
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdtextbox input {
        border-style: none;
        background-color: #f2eef6;
        color: #755990;
        width: 100%;
        font-size: 1em;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdtextbox input:focus {
        color: black;   
        width: 100%;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdtextbox > .gridvalidation {
        font-size: 0.8em;
        color: red;
    }
/*#endregion*/

/*#region calendar input*/
    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdcalendar {
        border: 1px solid #888;
        padding: 3px;
        background-color: #f2eef6;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdcalendar input {
        border-style: none;
        background-color: #f2eef6;
        color: #755990;
        width: 100%;
        font-family: inherit;
        font-size: inherit;
        text-align: center;
    }

        .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdcalendar input[type="date"]::-webkit-calendar-picker-indicator {
            color: rgba(0, 0, 0, 0);
            opacity: 1;
            background-image: url("./../images/SmallCalendar.gif");
            background-repeat: no-repeat;
            background-position: 100% center;
            background-size: 20px;
            cursor: pointer;
        }

    .gridContainer .gridtable > .gridtbody > .gridtr input[type="date"]:disabled {
        border-style: none;
        width: 100%;
        font-family: inherit;
        font-size: inherit;
        text-align: center;
        background: none;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdcalendar > .gridvalidation {
        font-size: 0.8em;
        color: red;
    }
 /*#endregion*/

/*#region styles for .gridselect dropdown*/

    /* For IE only */
    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdselect select::-ms-expand {
        display: none;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdselect {
        background-color: #f2eef6;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdselect select {
        width: 100%;
        -webkit-appearance: none;
        color: #755990;
        border-style: none;
        line-height: 1;
        outline: 0;
        background-color: #f2eef6;
        background: url("../images/amgridhelper/dropdownarrow.png") no-repeat;
        background-position: right;
        background-origin: content-box;
        padding-left: 2px;
        padding-right: 2px;
        padding-top: 2px;
        padding-bottom: 0px;
        font-size: 1em;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdselect select:hover {
        background: url("../images/amgridhelper/dropdownarrow-hover.png") no-repeat;
        background-position: right;
        background-origin: content-box;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdselect select:active {
        background: url("../images/amgridhelper/dropdownarrow.png") no-repeat;
        background-position: right;
        background-origin: content-box;
    }

    .gridContainer .gridtable > .gridtbody > .gridtr > .gridtdselect > .gridvalidation {
        font-size: 0.8em;
        color: red;
    }
/*#endregion*/

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .tdlink {
    text-decoration: none;
    color: black;
    width: 100%;
    display: block;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .tdlink:hover {
    color: black;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .tdtextlink {
    text-decoration: none;
    padding: 2px;
    color: #755990;
    display: block;
    width: calc(100%-4px);
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .tdtextlink:hover {
    color: white;
    background-color: #8a69aa;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridubcheckbox {
    text-align: center;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridcheckbox {
    text-align: center;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtdcheckbox > .gridcheckbox {
    text-align: center;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtdcheckbox {
    border: 1px solid #888;
    padding: 3px;
    background-color: #f2eef6;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridcellcentre {
    text-align: center;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridcellcentre > .gridlinkbutton {
        font-size: 1em;
        font-family: Arial;
        padding: 1px 7px;
        background-color: lightgrey;
        color: #755990;
        text-decoration: none;
        display: inline-block;
        border: none;
        border-radius: 2px;
        margin-left: 5px;
        margin-right: 5px;
        width: 65%;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridcellcentre > .gridlinkbutton:hover {
    background-color: #755990;
    color: white;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridcellcentre > .gridlinkbuttondisabled {
    font-size: 1em;
    font-family: Arial;
    padding: 1px 7px;
    background-color: #dcdcdc;
    color: #efefef;
    text-decoration: none;
    display: inline-block;
    border: none;
    border-radius: 2px;
    margin-left: 5px;
    margin-right: 5px;
    width: 65%;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd > .gridcellcentre > .gridlinkbuttondisabled:hover {
    background-color: #dcdcdc;
    color: white
}

/*#region styles for buttons (not the standard edit update delete buttons) */
.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowunboundbutton {
    font-size: 1em;
    padding: 1px 7px;
    background-color: lightgrey;
    color: #755990;
    text-decoration: none;
    display: inline-block;
    border: none;
    border-radius: 2px;
    margin-left: 5px;
    margin-right: 5px;
    width: 80%;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowunboundbutton:hover {
    background-color: #755990;
    color: white;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowunboundbutton:disabled {
    background-color: #dcdcdc;
    color: #efefef;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowunboundbutton:hover:disabled {
    background-color: #dcdcdc;
    color: white;
}
/*#endregion*/

/*#region styles for rowadd button*/
.gridContainer .gridtable > .gridthead > .gridtr > .gridth .gridrowadd {
    font-size: 1em;
    padding: 1px 7px;
    background-color: #806f91;
    color: lightgrey;
    text-decoration: none;
    display: inline-block;
    border: none;
    border-radius: 2px;
    margin-left: 5px;
    margin-right: 5px;
    width: 60px;
}

    .gridContainer .gridtable > .gridthead > .gridtr > .gridth .gridrowadd:hover {
        background-color: lightgray;
        color: #806f91;
    }

    .gridContainer .gridtable > .gridthead > .gridtr > .gridth .gridrowadd:disabled {
        background-color: #dcdcdc;
        color: #efefef;
    }

    .gridContainer .gridtable > .gridthead > .gridtr > .gridth .gridrowadd:hover:disabled {
        background-color: #dcdcdc;
        color: white;
    }
/*#endregion*/

/*#region styles for rowedit and delete buttons*/
.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowedit {
    font-size: 1em;
    padding: 1px 7px;
    background-color: lightgrey;
    color: #755990;
    text-decoration: none;
    display: inline-block;
    border: none;
    border-radius: 2px;
    margin-left: 5px;
    margin-right: 5px;
    width: 60px;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowedit:hover {
    background-color: #755990;
    color: white;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowedit:disabled {
    background-color: #dcdcdc;
    color: #efefef;
}

.gridContainer .gridtable > .gridtbody > .gridtr > .gridtd .gridrowedit:hover:disabled {
    background-color: #dcdcdc;
    color: white;
}
/*#endregion*/

/*#region styles for error boxes and messages*/

.gridContainer .gridmessageclose {
    border-style: none;
    background: url(../images/AMGridHelper/Close.png) no-repeat center;
    margin-right: 8px;
    width: 18px;
    height: 18px;
    float: right;
}

.gridContainer .gridmessageclose:hover {
    background: url(../images/AMGridHelper/Close-Hover.png) no-repeat center;
    background-color: #755990;
}

/*#region row messages*/
.gridContainer .gridtrmessageinfo {
    border-style: none;
    font-size: 1em;
    background-color: antiquewhite;
    color: darkgreen;
    text-align: center;
}

.gridContainer .gridtrmessageinfo .gridmessageinfo {
    padding-left: 10px;
    width: calc(100% - 12px);
    border-style: none;
}

.gridContainer .gridtrmessagewarning {
    border-style: none;
    font-size: 1em;
    background-color: antiquewhite;
    color: orangered;
    text-align: center;
}

.gridContainer .gridtrmessagewarning .gridmessagewarning {
    padding-left: 10px;
    width: calc(100% - 12px);
    border-style: none;
}

.gridContainer .gridtrmessageerror {
    border-style: none;
    font-size: 1em;
    background-color: white;
    color: red;
    text-align: center;
}

.gridContainer .gridtrmessageerror .gridmessageerror {
    padding-left: 10px;
    width: calc(100% - 12px);
    border-style: none;
}

/*#endregion*/

.gridContainer .gridmessagetopinfo {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 20px;
    float: left;
    border: 1px solid lightgray;
    border-bottom-style: none;
    width: calc(100% - 22px);
    font-size: 1em;
    background-color: antiquewhite;
    color: darkgreen;
}

.gridContainer .gridmessagetopwarning {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 20px;
    float: left;
    border: 1px solid lightgray;
    border-bottom-style: none;
    width: calc(100% - 22px);
    font-size: 1em;
    background-color: antiquewhite;
    color: orangered;
}

.gridContainer .gridmessagetoperror {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 20px;
    float: left;
    border: 1px solid lightgray;
    border-bottom-style: none;
    width: calc(100% - 22px);
    font-size: 1em;
    background-color: white;
    color: red;
}

.griderror {
    width: 98%;
    font-size: 0.8em;
    color: red;
    font-weight: bold;
    overflow-y: auto;
    overflow-x: auto;
}

/*#endregion*/

/*#region custom gridhelper styles that can be applied using a custom format class*/
.gridrowselected {
    box-shadow: 0px 0px 3px 1px grey inset;
}
/*#endregion*/

/*#endregion*/

/*#region styles for page tabs */

.tabsContainer {
    background-color: white;
    font-size: 10pt;
    font-family: Verdana, Tahoma, "MS Sans Serif", Arial;
}

.tabsContainer > .tabsTable {
    margin: 6px 0px 8px 0px;
    border-spacing: 0.5px 1.5px;
}

    .tabsContainer > table.tabsTable a.tabUnselected {
        background-color: #755990;
        color: white;
        text-decoration: none;
        border-radius: 6px 6px 0px 0px;
        padding: 6px 10px 4px 10px;
        white-space: nowrap;
    }

    .tabsContainer > table.tabsTable a.tabSelected {
        background-color: #AA6DCE;
        color: white;
        text-decoration: none;
        border-radius: 6px 6px 0px 0px;
        padding: 6px 10px 4px 10px;
        white-space: nowrap;
    }

    .tabsContainer > table.tabsTable span.tabUnselected {
        background-color: #7d6c8e;
        color: #ddd0d0;
        text-decoration: none;
        border-radius: 6px 6px 0px 0px;
        padding: 6px 10px 4px 10px;
        white-space: nowrap;
    }

    .tabsContainer > table.tabsTable span.tabSelected {
        background-color: #AA6DCE;
        color: white;
        text-decoration: none;
        border-radius: 6px 6px 0px 0px;
        padding: 6px 10px 4px 10px;
        white-space: nowrap;
    }

/*#endregion*/

/*#region Lease Liability Edit controls*/
.leaseLControl > input[type="date"] {
    font-family: Arial;
    font-size: 10pt;
    border: 1px solid rgb(118,118,118);
}

.leaseLControl > input[type="date"]::-webkit-calendar-picker-indicator {
    color: rgba(0, 0, 0, 0);
    opacity: 1;
    background-image: url("./../images/SmallCalendar.gif");
    background-repeat: no-repeat;
    background-position: 100% center;
    background-size: 20px;
    cursor: pointer;
}

.leaseLControl > input[type="date"]:read-only {
    font-family: Arial;
    font-size: 10pt;
    border: none;
    border: none;
}

.leaseLControl > input[type="text"] {
    font-family: Arial;
    font-size: 10pt;
    border: 1px solid rgb(118,118,118);
}

.leaseLControl > input[type="text"]:read-only {
    font-family: Arial;
    font-size: 10pt;
    border: none;
}

.leaseLControl > select {
    font-family: Arial;
    font-size: 10pt;
    border: 1px solid rgb(118,118,118);
}

.leaseLControl > textarea {
    font-family: Arial;
    font-size: 10pt;
    border: 1px solid rgb(118,118,118);
}

.leaseLControl > textarea:read-only {
    font-family: Arial;
    font-size: 10pt;
    border: none;
}

/*#endregion*/