body { font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; font-size: .80em; color: #000; margin: 0 0 0 0; padding: 0 0 0 0; /* Centers the page content container in older browsers. */ }
body textarea { font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; font-size: 1em; }
a:hover { text-decoration: none; }
/* PRIMARY COLOUR FORMATTING   
----------------------------------------------------------*/
.gridvrow { background: #F8FAFC; }
.gridvpager a:link, .gridvpager a:visited { color: #A8BBD7; }
.fmsajaxcalendar .ajax__calendar_header { background-color: #A8BBD7; }
.fmsajaxcalendar .ajax__calendar_active { background-color: #A8BBD7; border-color: #A8BBD7 }
.fmsajaxcalendar .ajax__calendar_hover { background-color: #A8BBD7 }
/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/
.page { margin: 0 auto 0 auto; text-align: left;}
.pagewidth { width: 1015px; }
.ModalPopup { margin-left: -20px; width: 1000px; }
.pagecontent { border: solid 4px #FFF; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background-color: #FFF; }
.header { text-align: left; min-height: 45px; padding-left: 10px; overflow: auto; }
.header h1 { font-weight: 700; margin: 0; padding: 0; margin-left: 5px; color: #FFFFFF; border: none; line-height: 26px; font-size: 26px; }
.main { padding: 0; margin: 10px; padding-left: 3px; min-height: 25vh; }
.footer { text-align: left; line-height: normal; min-height: 48px; padding: 15px 10px 10px 30px; clear: both; border-bottom: solid 4px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; color: #FCFCFC; }
.footer a, .footer a:link, .footer a:visited, .footer a:active { color: #FCFCFC; text-decoration: underline; }
.footer p { text-align: center; }
.footer a:hover { color: #FFF; }
/* TAB MENU   
----------------------------------------------------------*/
.navcontainer { display: block; overflow: auto; position: relative; text-transform: uppercase; padding: 10px 20px 10px 20px; font-weight: bold; clear: both; border-top: solid 4px; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.navmenu ul li a { color: #FCFCFC; }
.navmenu ul { margin: 0; padding:0; list-style-type: none; }
.navmenu ul li { display: inline; /* margin:0;  Corrected validation warning 25/05/16 */ padding-right: 20px; /* width: auto; Corrected validation warning 25/05/16 */ }
.navmenu ul li a { text-decoration: none; }
.navmenu ul li a:hover { color: #FFF; }
.navmenu { font-size: 1em; color: #FCFCFC; }
.menumainimg { height: 40px }
.panelmenusmall { width: 100%; padding-bottom: 5px; }
.menusmall { height: 32px; padding: 2px;}
.menusmallboxed { height: 32px; padding: 2px; border: 1px solid #8b8b8b; -moz-box-shadow: 2px 2px 2px #4a4a4a; -webkit-box-shadow: 2px 2px 2px #4a4a4a; box-shadow: 2px 2px 2px #4a4a4a; margin-right: 8px; }
.checklisticon { height: 20px }
/* SCREEN PROGRESS FUNCTIONS  
----------------------------------------------------------*/
.ProgressBlackout { position: fixed; z-index: 2147483646; top: 0px; bottom: 0px; left: 0px; right: 0px; overflow: hidden; padding: 0; margin: 0; background-color: #000000; filter: alpha(opacity=50); opacity: 0.5; }
#ProgressBox { position: absolute; z-index: 2147483647; height: 138px; margin-top: -69px; width: 214px; margin-left: -107px; background-image: url(../images/structure/ajax-loader.gif); background-position: center center; border: solid 2px #828282; border-radius: 10px; left: 50%; position: absolute; top: 40%; }

/* SCREEN LAYOUT AND SCALING FOR CONTROLS
----------------------------------------------------------*/
.screenformview { background-color:#FFF; }
.containerformview { background-color: #fff; }
.screenformviewdisabled { filter: grayscale(50%); -webkit-filter: grayscale(50%) }
.screenformviewdisabled .buttoniconsmall, screenformviewdisabled .buttonicontiny, screenformviewdisabled .buttoniconmedium, .screenformviewdisabled .menumain, .screenformviewdisabled .menusmall { filter: grayscale(100%); -webkit-filter: grayscale(100%) }
.controldisabled { filter: grayscale(100%); -webkit-filter: grayscale(100%) }
.screenpaneltwoleft { clear: left; float: left; }
.screenpaneltworight { float: right; }
.screenpaneltwoleftwide { float: left; }
.screenpaneltworightwide { float: right; }
.screenpaneltwoleftextrawide { float: left; }
.screenpaneltworightextrawide { float: right; }
.screenpaneltwoleftnarrow { float: left; }
.screenpaneltworightnarrow { float: right; }
.screenpaneltwoleftextranarrow { float: left; }
.screenpaneltworightextranarrow { float: right; }
.screenpanelthree {float: left;}
.screenpanelfour { float: left; }
.screenpanelone { clear: both; }
.screenfieldfinancial { margin-right: 2px; }
.screenfieldfinancialwide { margin-right: 2px; }
.screenfieldtime { margin-left: 1px; }
.screenlabelfinancialwide { float: left; display: block; }
.screenlabelstd, .screenlabelmedium, .screenlabelwide, .screenlabelextrawide, .screenlabel50, .screenlabel60, .screenlabel65, .screenlabel75 { float: left; display: block; clear: left; }
.screenlabellegend { float: left; display: block; padding:5px;margin-right:5px;}
.screenlabelunrestricted { display: inline; padding-right: 10px; }
.screenimagewide { border-width: 1px; border-style: solid; border-color: #999; -moz-box-shadow: 4px 4px 5px #999; -webkit-box-shadow: 4px 4px 5px #999; box-shadow: 4px 4px 5px #999; }
.textcenter {text-align:center;}
.pagewidth { width: 1008px; }
.ModalPopup { width: 983px; }
body { font-size: .80em; }
.datalisttext { font-size: 0.70em; }
.navcontainer { font-size: 11px; }
.screenformview { }
.gridvformviewdata { margin: 0; border: solid 1px darkgrey; background-color: #F8FAFC; }
.gridvformviewrow td { padding:2px 6px; }
.gridvformviewempty td {padding:0 3px 0 3px}
.screenpaneltwoleft { width: 49.5%; }
.screenpaneltworight { width: 49.5%; }
.screenpaneltwoleftwide { width: 51%; }
.screenpaneltworightwide { width: 51%; }
.screenpaneltwoleftnarrow { width: 47.5%; }
.screenpaneltworightnarrow { width: 47.5%; }
.screenpaneltwoleftextrawide { width: 63.5% }
.screenpaneltworightextranarrow { width: 34%; }
.screenpanelthree {width: 33%;}
.screenpanelfour { width: 24%; }
.screenfieldstd { width: 265px; height: 22px;}
.lookupfieldstd { width:271px; }
.lookupfieldwide { width: 301px; }
.lookupfieldmid { width: 186px; }
.screenfieldmid { width: 180px; height: 22px; }
.screenfieldwide { width: 295px; height: 22px; }
.screenfielddate { width: 265px; height: 22px; }
.screenfielddatenarrow { width: 194px; height: 22px; }
.screenfielddateextranarrow { width: 210px; height: 22px; }
.screenfielddateshortnarrow { width: 75px; height: 22px; }
.screenfieldfinancial { width: 80px; height: 22px; }
.screenfieldnumber { width: 30px; height: 22px; }
.screenfieldfinancialwide { width: 105px; height: 22px; }
.screenimagewide { max-width: 295px; height: auto; }
.screenlabelfinancialwide { width: 113px; height: 22px; }
.screenfieldtime { width: 63px; height: 22px; }
.screenfielddateextranarrow { width: 155px; height: 22px; }
.screenfieldnarrow { width: 150px; height: 22px; }
.screenfieldextranarrow { width: 100px; height: 22px; }
.screenfieldsupernarrow { width: 55px; height: 22px; }
.screenlabellegend { min-width: 120px; height: 22px; }
.screenlabelstd { width: 100px; height: 22px; }
.screenlabelmedium { width: 120px; height: 22px; }
.screenlabelwide { width: 140px; height: 22px; }
.screenlabelextrawide { width: 170px; height: 22px; }
.screenlabel50 { width: 50%; height: 22px; }
.screenlabel60 { width: 60%; height: 22px; }
.screenlabel65 { width: 65%; height: 22px; }
.screenlabel75 { width: 75%; height: 22px; }
.buttonicontiny { height: 18px; }
.buttoniconsmall { height: 22px; }
.buttoniconmedium { height: 32px; }
.lookupfield { height: 22px; }
.buttonauto { height: 32px;padding-left:20px;padding-right:20px;}
.buttonstd { width: 80px; height: 32px; }
.buttonwide { width: 125px; height: 32px; }
.buttonxwide { width: 150px; height: 32px; }
p { line-height: 22px; }

@media only screen and (min-width: 1390px)  {
    /* WIDE DESKTOP DEVICES OVER 1023PX ONLY */
    .ModalPopup { width: 1365px; }
    .checklisticon { height: 24px }
}
@media only screen and (min-width: 1390px), (min-width:600px) and (max-width:1023px) {
    /* WIDE DESKTOP DEVICES OVER 1023PX AND MOBILE TABLET SCREENS 600-1023 */
    .pagewidth { width: 1390px; }
    body { font-size: 1em; }
    input { font-size: 1em; }
    input[type=time] {font-size:1.2em;}
    select { font-size: 1em; }
    .datalisttext { font-size: 0.9em; }
    .menumainimg { height: 60px }
    .navmenu { font-size: 1.2em; }
    .menusmall { height: 40px; }
    .gridvformviewdata { width: 420px; }
    .lookupfieldstd { width: 326px; }
    .lookupfieldwide { width: 360px; }
    .lookupfieldmid { width: 276px; }
    .screenfieldstd { width: 320px; height: 24px; }
    .screenfieldmid { width: 270px; height: 24px; }
    .screenfieldwide { width: 354px; height: 24px; }
    .screenfielddate { width: 320px; height: 24px; }
    .screenfieldfinancial { width: 96px; height: 24px; }
    .screenfieldnumber { width: 40px; height: 22px; }
    .screenfieldfinancialwide { width: 110px; height: 24px; }
    .screenlabelfinancialwide { width: 118px; height: 24px; }
    .screenfieldtime { width: 81px; height: 24px; }
    .screenfielddatenarrow { width: 230px; height: 24px; }
    .screenfielddateextranarrow { width: 190px; height: 24px; }
    .screenfielddateshortnarrow { width: 100px; height: 24px; }
    .screenfieldnarrow { width: 180px; height: 24px; }
    .screenfieldextranarrow { width: 120px; height: 24px; }
    .screenfieldsupernarrow { width: 66px; height: 24px; }
    .screenlabellegend { min-width: 120px; height: 22px; }
    .screenlabelstd { width: 160px; height: 24px; }
    .screenlabelmedium { width: 170px; height: 24px; }
    .screenlabelwide { width: 180px; height: 24px; }
    .screenlabelextrawide { width: 204px; height: 24px; }
    .screenimagewide { max-width: 354px; height: auto; }
    .screenlabel50 { width: 50%; height: 24px; }
    .screenlabel60 { width: 60%; height: 24px; }
    .screenlabel65 { width: 65%; height: 24px; }
    .screenlabel75 { width: 75%; height: 24px; }
    .buttonicontiny { height: 22px; }
    .buttoniconsmall { height: 26px; }
    .buttoniconmedium { height: 32px; }
    .buttonauto { height: 36px; }
    .buttonstd { width: 90px; height: 36px; }
    .buttonwide { width: 140px; height: 36px; }
    .buttonxwide { width: 160px; height: 36px; }
    .lookupfield { height: 24px; }
}

@media only screen and (max-width: 1023px) {
    /* MOBILE DEVICES TABLETS AND TELEPHONES - Screen Less than 1023px - Split to single columns*/
    .menumainimg { height: 40px }
    .pagewidth { width: 100% }
    .ModalPopup { margin: 0; left: 0; width:95%; }
    .navmenu { font-size: 1.2em; line-height: 3em; }
    .screenpaneltwoleft { width: 100%; }
    .screenpaneltworight { width: 100%; }
    .screenpaneltwoleftwide { width: 100%; }
    .screenpaneltworightwide { width: 100%; }
    .screenpaneltwoleftnarrow { width: 100%; }
    .screenpaneltworightnarrow { width: 100%; }
    .screenpaneltwoleftextrawide { width: 100%; }
    .screenpaneltworightextranarrow { width: 100%; }
    .screenpanelthree {width: 100%;}
    .screenpanelfour { width: 100%; }
    .screenpaneltwoleft { float: none; clear: left; }
    .screenpaneltworight { float: none; clear: left; }
    .screenpaneltwoleftwide { float: none; }
    .screenpaneltworightwide { float: none; }
    .screenpaneltwoleftextrawide { float: none; }
    .screenpaneltworightextrawide { float: none; }
    .screenpaneltwoleftnarrow { float: none }
    .screenpaneltworightnarrow { float: none; }
    .screenpaneltwoleftextranarrow { float: none; }
    .screenpaneltworightextranarrow { float: none; }
    .screenpanelthree {float: none; }
    .screenpanelfour { float: none; }
    .navmenu { font-size: 1.2em; line-height: 3em; }
    .mobilehide { display: none; }
}

@media only screen and (max-width: 500px) {
    /* MOBILE TELEPHONES - Screen Less than 500px */
    body { font-size: 0.9em; }
    input { font-size: 0.9em; }
    input[type=time] { font-size: 1.0em; }
    select { font-size: 0.9em; }
    .datalisttext { font-size: 0.7em; }
    .ModalPopup { margin: 0; left: 0; width: 90%; }
    .gridv { font-size: 0.9em; }
    .header { text-align: left; min-height: unset; padding: 0; overflow: auto; }
    .header h1 { font-weight: 700; margin: 0; padding: 0; line-height: 1.2em; font-size: 1.2em; }
    .menumainimg { height: 40px }
    .navmenu { font-size: 1.2em; line-height: 2em; }
    .gridvformviewdata { width: 255px; }
    .lookupfieldstd { width: 186px; }
    .lookupfieldwide { width: 251px; }
    .lookupfieldmid { width: 156px; }
    .screenfieldstd { width: 180px; }
    .screenfieldmid { width: 150px; }
    .screenfieldwide { width: 245px; }
    .screenfielddate { width: 185px; }
    .screenfielddatenarrow { width: 180px; }
    .screenfielddateshortnarrow { width: 55px; }
    .screenfielddateextranarrow { width: 135px; }
    .screenfieldfinancial { width: 67px; }
    .screenfieldnumber { width: 25px; }
    .screenfieldfinancialwide { width: 90px; }
    .screenfieldtime { width: 65px; }
    .screenfieldnarrow { width: 130px; }
    .screenfieldextranarrow { width: 80px; }
    .screenfieldsupernarrow { width: 45px; }
    .screenimagewide { max-width:245px; height:auto; }
}

@media only screen and (min-width: 91110px) {
    /* Set Weird Colours 1110 */
    .screenformview { background-color: white; }
    .screenpaneltwoleft { background-color: red; }
    .screenpaneltworight { background-color: blue; }
    .screenpaneltwoleftwide { background-color: red; }
    .screenpaneltworightwide { background-color: blue; }
    .screenpaneltwoleftnarrow { background-color: red; }
    .screenpaneltworightnarrow { background-color: blue; }
    .screenpanelthree {background-color: red; }
    .screenpanelfour { background-color: red; }
    .screenpanelone { background-color: purple; }
    .screenfieldstd { background-color: yellow; }
    .screenfieldwide { background-color: yellow; }
    .screenfielddate { background-color: yellow; }
    .screenfieldfinancial { background-color: yellow; }
    .screenfieldtime { background-color: yellow; }
    .screenfielddatenarrow { background-color: yellow; }
    .screenfielddateextranarrow { background-color: yellow; }
    .screenfieldnarrow { background-color: yellow; }
    .screenfieldextranarrow { background-color: yellow; }
    .screenfieldsupernarrow { background-color: yellow; }
    .screenlabelstd { background-color: green; }
    .screenlabelmedium { background-color: green; }
    .screenlabelwide { background-color: green; }
    .screenlabelextrawide, .screenlabel50 { background-color: green; }
    .pagecontent { background-color: cyan; }
    .main { background-color: orange; }
}