﻿/* ---------- Application ---------- */
html, body { height: 100%; }
html > body #container { height: auto; }
body, input, textarea, select { font-family: "Arial", "Helvetica", sans-serif; }
body { background-color: #FAFAFA; font-size: 13px; color: #363636; }
form { height: 100%; }

* { padding: 0; margin: 0; border: 0; }

/* ---------- Framework ---------- */
#contentRightColDiv { margin-left: 177px; padding: 17px; }
#container { background-color: #FAFAFA; position: relative; min-height: 100%; height: 100%; margin-left: auto; margin-right: auto; width: 1000px; voice-family: "\"}\""; voice-family: inherit; overflow: visible; }

/*.base_colour_top { background-color: White; }*/
.base_colour_bottom { /*background: #3aab97;*/ background: #58585A; }

/* ---------- Header ---------- */
.headerbasic    { width: 100%; min-width: 840px; height: 78px; background-image: url('../img/infrastructure/bgHeader.gif'); background-repeat:repeat-x; }
.headerfull     { width: 100%; min-width: 840px; height: 112px; background-image: url('../img/infrastructure/bgHeaderFull.gif'); background-repeat:repeat-x; }
#logo           { float: left; padding: 15px 0 0 0; width: 225px; }
#logo_right     { float: right; padding: 8px 10px 0 0; }
#modulelabel    { float: left; padding: 16px 0 0 0; color: #74bbc8; font-family: "Segoe UI"; font-size: 26px; font-weight: 100}
#modulepicker   { float: left; padding: 8px 0px 0px 0px; color: #fff; }
#tools          { float: right; padding: 5px 10px 0px 0px; }
#tools a        { text-decoration: none; color: #FFF; }
#usertools      { float: right; padding: 20px 0px 0px 0px; }
#usertools a    { text-decoration: none; color: #325C3C; }
#menu           { height: 24px; background: #2198ae; padding-left:0px; }
#mainmenu       { float:left; background: #fff; margin:0px; }

#headertools { float: right; padding: 20px 0px 0px 0px; }
#headertools .headertoolstable { border-collapse: collapse; background-color: #0e5f73; }
#headertools .headertoolstable .moduleCell { border:solid 1px #1b7a8c; background-image: url('../img/infrastructure/bgModule_off.gif'); height: 30px; width: 150px; color: #ffffff; cursor: pointer; }
#headertools .headertoolstable .moduleCell:hover { background-image: url('../img/infrastructure/bgModule_on.gif'); }
#headertools .headertoolstable .adminCell { border:solid 1px #1b7a8c; background-image: url('../img/infrastructure/bgAdmin_off.gif'); height: 30px; width: 150px; color: #ffffff; cursor: pointer; }
#headertools .headertoolstable .adminCell:hover { background-image: url('../img/infrastructure/bgAdmin_on.gif'); }
#headertools .headertoolstable .userCell { border:solid 1px #1b7a8c; background-image: url('../img/infrastructure/bgUser_off.gif'); height: 30px; width: 150px; color: #ffffff; cursor: pointer; }
#headertools .headertoolstable .userCell:hover { background-image: url('../img/infrastructure/bgUser_on.gif'); }

/*ul.level1     { list-style: none; padding: 0 0 0 1px; }
ul.level1 li    { float: left; height: 24px; background: #fff; padding: 0 1px 0 0; }
ul.level1 a     { display: block; padding: 5px 16px 5px 14px; background: #C9BA81 url(../img/men-bg.jpg) repeat-x; text-decoration: none; letter-spacing:0.08em; color: #325C3C; }
ul.level1 a:hover, ul.level1 a.on   { background-position: 0 -24px; color: #fff; }*/

#breadcrumbbar                          { height:38px; line-height:38px;vertical-align: middle; border-bottom:1px dotted #ccc; font-size:12px; }
#breadcrumbbar #breadcrumb              { float: left; color:#999; }
#breadcrumbbar #breadcrumb A            { color:#999; }
#breadcrumbbar #breadcrumb A:visited    { color:#999; }
#breadcrumbbar #breadcrumb P .arrow     { padding-left:2px; padding-right:2px; }
#breadcrumbbar #pin                     { width:250px; float:right; text-align:right; background:url('../img/infrastructure/bgPin.gif') no-repeat; background-position:right center; padding-right:26px; }
#breadcrumbbar #pin A                   { list-style:none; color: #999; }

/* ---------- Start Page ---------- */
#startpage #welcome     { float:left; height:70px; line-height:70px; width:250px; vertical-align: middle; }
#startpage #clientlogo  { float:right; height:70px; line-height:70px; width:225px; vertical-align:middle; border: 1px dotted #ccc; text-align: center; }
.wideContent    { width: 290px; height:130px; font-family:Segoe UI; color:#fff; padding:10px; }
.squareContent  { width: 100px; height:100px; padding:10px; }
.shortContent   { height: 105px; }
.font14         { font-size: 14px;}
.font18         { font-size: 18px; }
.font22         { font-size: 22px;}

#mytools { height: 30px; width: 180px; padding:0; margin:0; vertical-align: top; text-align: left; border: dotted 1px #ccc; }
#mytools .mytoolstable { border-collapse: collapse; }
#mytools .mytoolstable .mytoolsCell { background-image: url('../img/infrastructure/bgMytools_off.gif'); height: 30px; width: 180px; color: #363636; cursor: pointer;padding-left: 30px;font-size: 12px; }
#mytools .mytoolstable .mytoolsCell:hover { background-image: url('../img/infrastructure/bgMyTools_on.gif'); }

#pageoptions { overflow:hidden; width:180px; margin:0; padding:0; vertical-align:top; text-align:left; border:dotted 1px #ccc;font-size: 12px; }
#pageoptions a { font-size: 12px; text-decoration:underline; color:#363636;}

/* ---------- Settings ---------- */
#currentsettings {  width: 100%; margin:0; padding:10px 0px 10px 5px; background-color:#58585A; border: 1px solid #58585A; overflow:auto; display:block; font-size:13px; }
#currentsettings .row1            { width:85%; padding-bottom:5px; margin:0; vertical-align:middle; }
#currentsettings .row2            { width:85%; vertical-align:middle; clear:both; padding-top:5px;}
#currentsettings .featurelabel    { color: #ccc; }
#currentsettings .active          { cursor: pointer; }
#currentsettings .featurebuttoncontainer   { color: #FFFFFF; background-color: #58585A;float:right; position:absolute; top:0; right:0px; height:100%; width: 127px;border-left: 1px solid #333;padding: 0; margin: 0;}
#currentsettings .featurebutton {background-color: #58585A;outline:none;width: 126px;height:100%;border: none;padding-right:1px;color: #FFFFFF;background-image: url('../img/Infrastructure/settingswheel_off.gif');background-repeat:no-repeat;background-position:left center;text-align: right;}
#currentsettings .featurebutton:hover {background-color: #434343;outline:none;width: 126px;height:100%;border: none;padding-right:1px;color: #FFFFFF;background-image:  url('../img/Infrastructure/settingswheel_on.gif');background-repeat:no-repeat;background-position:left center;text-align: right;cursor:pointer;}
#currentsettings .featureresponse   { color: #FFFFFF; padding-right:20px; }
#currentsettings .featuredelimiter  { color: #ccc;font-family: "Arial Narrow", "Helvetica Narrow", Arial, Helvetica, sans-serif; }
#currentsettings .image     { background:url('../img/Infrastructure/settingswheel_off.gif') no-repeat; background-position:left center; height:100% }
#currentsettings .text      { height:100%; text-align:left; white-space:nowrap; padding-left: 25px; }


/* ---------- Layout ---------- */
h1 { color: #363636; font-size: 39px; font-weight: bold; }
h2 { color: #363636; font-size: 32px; font-weight: normal; }
h3 { color: #363636; font-size: 29px; font-weight: bold; }
h4 { color: #363636; font-size: 25px; font-weight: normal; }
h5 { color: #363636; font-size: 21px; font-weight: normal; }

.clear { clear: both; padding:0px; margin:0px; }
.hide { display: none; }
.spacer5 { height: 5px; clear: both; }
.spacer10 { height: 10px; clear: both; }
.spacer20 { height: 20px; clear: both; }
.spacer50 { height: 50px; clear: both; }
.pointer { cursor: pointer; }
.drag { cursor: n-resize; }


/* ---------- Footer ---------- */
#footer { background-color: #58585A;margin-top: 30px;height: 48px;line-height: 48px;vertical-align: middle;color: #EFEFEF }
#footer A { color: #EFEFEF }

/* ---------- Maintenance ---------- */
#maintenance 
        {
            padding: 15px 15px 15px 15px; 
            width:750px; 
            text-align: center; 
            margin-top: 150px; 
            margin-left: auto;
	        margin-right: auto;
            border:solid 1px #A6A6A6; 
            background-color: #ffffff; 
            font-size: 15px;
	        line-height: 30px;
        }

/* ---------- User Forms ---------- */
.userform               { margin:0; padding:0; }
.userform table         { margin:0; padding:5px; }
/*.userform table tr td   { padding-right:25px; }*/
.userform h3            { font-weight: normal; font-size: 15px }
.userform h4            { font-weight: bold; border-bottom: 1px solid #cccccc; margin-bottom: 12px; font-size: 15px } /* font-size: 1.3em; */
.userform h5            { font-weight: normal; border-bottom: 1px solid #cccccc; margin-bottom: 12px; font-size: 15px } /* font-size: 1.3em; */
.userform p             { margin-bottom: 10px !important; }
.userform p label       { margin-bottom: 5px; }


/* ----- Busy panel overlay ----- */
#busyouter { position: fixed; top: 0; left: 0; width: 100%; height: 100%; margin: 0px auto; filter:alpha(opacity=20); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.2); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=40)"; background: black !important; opacity: .4 !important; -moz-opacity: .4 !important; z-index: 1000000; display: inline-block; }
#busyinner { width:200px; height:100px; position:absolute; left:50%; top:50%; margin:-50px 0 0 -100px; background-color: white; filter:alpha(opacity=20); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.2); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; background:white; opacity:1; -moz-opacity:1; z-index:1000001; }
#busymsg { width:200px; height:100px; position:absolute; left:50%; top:50%; margin:-30px 0 0 -100px; z-index:1000002; display:table; }
#busymsg p{ display: table-cell; vertical-align:middle; text-align:center; font-size:18px; }
#busyimage{ left:80px;top:20px;width:50px;position:absolute; }

.required { color: red; font-weight:bold; }

/* ------ Dashboards -------*/
#row1 #barchart { border: 1px dotted #ccc; background-color: #fff; width: 100%; margin: 15px 0px 10px 0px; }

