body
{
    margin: 0 auto;
    padding: 0;
    font-family: "Lucida Grande" , Verdana, Arial, helvetica, Sans-Serif;
    color: #222;
    background-color: #E5E5E5;
    text-align: center;
}

html, body
{
    background: #E5E5E5;
}

td
{
    font-family: "Lucida Grande" , Verdana, Arial, helvetica, Sans-Serif;
}

h1
{
    font-family: "Lucida Grande" , arial, sans-serif;
    padding: 0;
    border-bottom: 0;
    margin: 0;
    color: #333;
    font-size: 16px;
    font-weight: bold;
}

/*-------------------------------------------------
LOGIN SCREEN (.login is body class)
-------------------------------------------------*/

.LoginLabel
{
    font-size: 14px;
    line-height: 24px;
}

.login td
{
    line-height: 24px;
}

.login .RememberMe
{
    color: #666666;
    font-size: 11px;
    margin: 0px 0px 0px 0px;
}

.login div.Container
{
    width: 500px;
    margin: 60px auto 20px auto;
}

.login h1
{
    margin-bottom: 20px;
}

.login .inputUserName, .login .inputPassword, .login input
{
    font-size: 14px;
    padding: 3px;
}

.login .inputUserName
{
    width: 300px;
}

.login .inputPassword
{
    width: 140px;
    margin-right: 5px;
}

.login input#emailpassword
{
    vertical-align: middle;
    margin-right: 5px;
}

.login div.AlertGood, .login div.AlertBad
{
    margin: 10px 0 20px 0;
}

.login div#Dialog
{
    border: 10px solid #ccc;
    padding: 15px 20px 10px 20px;
    text-align: left;
    background: #fff;
}

.login div#Dialog h2
{
    margin: 0;
    padding: 0;
}

.login div.below
{
    font-size: 10px;
    text-align: right;
    padding: 5px 0 0 0;
}

.login div.below a:link, .login div.below a:visited
{
    color: #666;
}

.login div.below a:hover
{
    color: #fff;
    background-color: #666;
}

/*-------------------------------------------------
FLASHES
-------------------------------------------------*/

.validate_error
{
    border-color: #c99;
    color: #fff;
    background: url('../images/alertbad_icon.gif') #c00 left no-repeat;
    text-align: left;
    border: 1px solid #CC9999;
    padding: 5px 5px 5px 30px;
    font-size: 14px;
    margin-bottom: 12px;
}

.validate_success
{
    border-color: #468847;
    color: #468847;
    background: url('../images/checked.png') #DFF0D8 left no-repeat;
    background-position: 5px 50%;
    text-align: left;
    border: 1px solid #468847;
    padding: 5px 5px 5px 30px;
    font-size: 14px;
    margin-bottom: 12px;
}

#Flash
{
    text-align: left;
    border: 1px solid #ccc;
    padding: 5px 5px 5px 30px;
    font-size: 14px;
    margin-bottom: 12px;
}


.login #Flash
{
    font-size: 12px;
}

#Flash.flash_notice
{
    border-color: #9c9;
    color: #060;
    background: url(images/alertgood_icon.gif) #E2F9E3 left no-repeat;
}

#Flash.flash_alert
{
    border-color: #c99;
    color: #fff;
    background: url('../images/alertbad_icon.gif') #c00 left no-repeat;
}

#Flash.flash_alert a
{
    color: #fff;
}

#Flash.flash_alert a:hover
{
    background: #000;
}

/*-------------------------------------------------
HEADER
-------------------------------------------------*/

#Header
{
    /*width: 100%;*/
    background: #fff;
    padding: 1px 0 0 0;
    margin: 0;
    text-align: left;
    position: relative;
}

#Header h1 /* client name */
{
    padding: 0 0 10px 0;
    margin: 7px 0 0 30px;
    font-size: 24px;
    font-weight: normal;
    color: #194E85;
    text-align: left;
}

#Header h3
{
    padding: 0 30px 0 32px;
    margin: 7px 0 0 0;
    font-size: 10px;
    font-weight: normal;
    font-family: verdana;
    text-align: left;
}

#Header h3.global
{
    position: relative;
    float: right;
    text-align: right;
    width: 300px;
}

#Header h3 span#floatright
{
    text-align: right;
    width: 400px;
    position: relative;
    float: right;
}

#Header h3 span.pipe
{
}

#Header h3 a.current
{
    font-weight: bold;
    text-decoration: none;
}

#Header h3 a
{
    color: #222222;
}

#fresh_all h2
{
    padding: 0 0 2px 0;
    margin: 0;
    border-bottom: 1px dotted #ccc;
}

#Header a:hover.image
{
    background-color: transparent;
}

/*-------------------------------------------------
TABS
-------------------------------------------------*/

#Tabs
{
    margin: 0 0 0 30px;
    height: 25px;
    padding: 0;
}

#Tabs ul
{
    margin: 0;
    padding: 0;
}

#Tabs li
{
    margin: 0;
    padding: 0;
    display: inline;
    list-style: none;
    border: none;
}

#Tabs ul#MainTabs
{
}

#Tabs a:link, #Tabs a:visited {
    text-decoration: none;
    background-color: #CC9900;
    color: #fff;
    border-left: 2px solid #fff;
    /*border-bottom: 1px solid #30CCF4;*/
}

#Tabs a:hover {
    color: #323332;
    background-color: #F5DEB3;
    border-bottom: 1px solid #F5DEB3;
}

#Tabs ul#MainTabs a:link, #Tabs ul#MainTabs a:visited
{
    float: left; /* for IE6 */
    font-size: 12px;
    font-weight: normal;
    padding: 4px 8px 6px 8px;
    margin: 0;
}

#Tabs ul#MainTabs a:link.current, #Tabs ul#MainTabs a:visited.current
{
    background: #e5e5e5 url(../images/tab-bg.gif) top repeat-x;
    border-bottom: 1px solid #e5e5e5;
    color: #CC9900;
    font-weight: bold;
    text-decoration: none;
    margin: 0;
}

/*-------------------------------------------------
STRUCTURE
-------------------------------------------------*/

div#Wrapper
{
    padding: 12px 23px 0 30px;
    margin: 0 auto;
}

.container
{
    margin: 0 auto 0 auto;
    text-align: center;
    min-width: 750px;
}

.ClearAll
{
    padding: 0px;
    clear: both;
    font-size: 0px;
}

#ContentFrame, #DashContentFrame, .ContentFrame
{
    margin: 0;
    padding: 0px 0;
    width: 100%;
    text-align: left; /*position: relative;*/
    float: left;
}

table.layout
{
    clear: left;
    border-collapse: collapse;
    width: 100%;
}

table.layout td.left, table.layout td.right
{
    vertical-align: top;
    padding: 0;
}

table.layout td.left
{
    width: 70%;
}

table.layout td.right
{
    width: 30%;
}

div.Left
{
    margin: 0;
    padding: 0;
    text-align: left;
    width: 70%;
    float: left;
}

div.Right
{
    margin: 0px 0 0 0;
    padding: 0;
    text-align: left; /*position: absolute;*/
    float: left;
    width: 30%;
}

table.layout td.left div.Left, table.layout td.right div.Right
{
    width: auto;
    float: none;
}


.Footer
{
    clear: left;
    font-size: 9px;
    color: #666;
     text-align: left;
    padding-bottom: 15px;
}

.Footer a:link, .Footer a:visited
{
    color: #666;
}

.Footer a:hover
{
    color: #fff;
    background: #666;
}


/*-------------------------------------------------
CONTENT
-------------------------------------------------*/

.col
{
    padding: 0 20px;
    text-align: left;
}

.left .col, .full .col
{
    padding: 0 0 0 0;
    background: #fff url(../images/right-bg.gif) right repeat-y;
    position: relative;
}

.left .innercol, .full .innercol
{
    padding: 0px 60px 20px 23px;
}

div.bottom
{
    background: url(../images/bottom-bg.gif) top right no-repeat;
    font-size: 8px;
    width: 100%;
}

div.Right .col
{
    padding: 0 0 0 9px;
}

a.adminblue:link, a.adminblue:visited {
    color: #CC9900;
    font-family: verdana;
    font-size: 11px;
    font-weight: normal;
}


a.admin:link, a.admin:visited
{
    color: #FF0000;
    font-family: verdana;
    font-size: 11px;
    font-weight: normal;
}

a.admin:hover
{
    color: #FFFFFF;
    background: #FF0000 none repeat scroll 0%;
}

a.adminclear:link, a.adminclear:visited
{
    text-decoration: none;
}

dd
{
    font-size: 10px;
    margin: 0pt 0pt 5px 0px;
}

dt
{
    float: left;
    padding-right: 10px;
    width: 180px;
    font-size: 11px;
    color: #333333;
}

.DirectContacts
{
    font-size: 11px;
    color: #333333;
}

.DirectContacts label
{
    margin-left: 10px;
}


/*-------------------------------------------------
PAGE_HEADER
-------------------------------------------------*/


div.page_header {
    background: #F5DEB3 none repeat scroll 0%;
    margin: 0pt 0pt 5px;
    padding: 13px 30px 13px 24px;
}
div.page_header h1
{
    color: #000000;
    font-size: 18px;
    margin: 0pt;
    padding: 0pt;
}
div.page_header h1 span
{
    color: #666666;
    font-size: 12px;
    font-weight: normal;
}

div.page_header p
{
    margin: 5px 0pt 0pt;
    font-size: 12px;
    line-height: 16px;
}

div.sheet div.page_header h1
{
    font-size: 20px;
}

div.submit
{
    border-top: 1px dashed #CCCCCC;
    margin: 20px -60px -15px -23px;
    padding: 15px 0pt 15px 30px;
    text-align: left;
}

div.submit2
{
    border-top: 1px dashed #CCCCCC;
    margin: 20px -25px 0px -15px;
    padding: 20px 0pt 0px 15px;
    text-align: left;
}

div.submit3
{
    border-top: 1px dashed #CCCCCC;
    margin: 20px 0px 0px 0px;
    padding: 10px 0pt 0px 0px;
    text-align: left;
}

div.comments
{
    border-top: 1px dashed #CCCCCC;
    margin: 20px -60px -15px -23px;
    padding: 15px 0pt 15px 30px;
    text-align: left;
}


div.page_header p
{
    margin: 5px 0pt 0pt;
}
div.page_header_links
{
    color: #FF0000;
    float: right;
    font-size: 11px;
    line-height: 20px;
    margin-top: 0pt;
    text-align: right;
}
div.page_header_links strong
{
    color: #000000;
}
div.page_header_links a.active:link, div.page_header_links a.active:visited, div.page_header_links a.active:hover
{
    background: #999999 none repeat scroll 0%;
    color: #000000;
    font-weight: normal;
    text-decoration: none;
}
div.page_header_links a.edit
{
    color: #777777;
    text-decoration: none;
}
div.page_header_links a.edit:hover
{
    color: #FFFFFF;
}

div.button_to_add_new
{
    margin: 0pt 0pt 15px;
}

body .Right h1
{
    color: #333333;
    font-size: 13px;
}

body .rightHeader {
    background-color: #F5DEB3;
    border-bottom: 1px solid #DCDCDC;
    margin: 0pt 0pt 5px;
    padding: 6px 8px;
}

body .header_links
{
    float: right;
    margin-top: -3px;
}

body .Right p
{
    color: #222222;
    font-size: 12px;
    line-height: 1.3em;
}
body .Right div.indent
{
    padding-left: 8px;
}
    
body.edit_message div.FormBlock, body.new_message div.FormBlock
{
    margin-top: 0pt;
}

.FormBlock
{
    background: #F0F0F0 none repeat scroll 0%;
    border: 1px solid #CCCCCC;
    font-size: 12px;
    margin-top: 20px;
    padding: 1px 25px 15px 15px;
}

.FormBlock2
{
    background: #F0F0F0 none repeat scroll 0%;
    border: 1px solid #CCCCCC;
    font-size: 12px;
    padding: 1px 25px 15px 15px;
}

.MultilineTextbox
{
    width: 100%;
}

.comments .MultilineTextbox
{
    width: 90%;
}

.PostButton
{
    padding: 15px 0pt 15px 0pt;
}

.taskheader
{
    text-align: right;
    background-color: #334E7D;
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 10px;
    padding: 3px 4px;
    white-space: nowrap;
    width: 60px;
    margin-right: 10px;
}

.workreportheader
{
    text-align: right;
    background-color: #009933;
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 10px;
    padding: 3px 4px;
    white-space: nowrap;
    width: 60px;
    margin-right: 10px;
}

.maintenancereportheader
{
    text-align: right;
    background-color: #99CCCC;
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 10px;
    padding: 3px 4px;
    white-space: nowrap;
    width: 60px;
    margin-right: 10px;
}

.invoicedetailheader
{
    text-align: right;
    background-color: #30CCF4;
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 10px;
    padding: 3px 4px;
    white-space: nowrap;
    width: 60px;
    margin-right: 10px;
}

.creditnoteheader
{
    text-align: right;
    background-color: rgb(204, 0, 0);
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 10px;
    padding: 3px 4px;
    white-space: nowrap;
    width: 60px;
    margin-right: 10px;
}

.readytosendheader {
    background-color: #43974c;
}

.readyforsapheader {
    background-color: #ffde00;
}

.visitdate {
    background-color: #EDF3FE;
    color: #000000;
    font-weight: bold;
    font-family: Verdana;
    font-size: 10px;
    padding: 4px;
    border-bottom: 2px solid #EDF3FE;
    vertical-align: middle;
}

.visituser
{
    color: #999999;
    font-size: 10px;
}

.visituser a {
    color: #CC9900
}

.visitdiscussed
{
    color: #333333;
    font-size: 12px;
    line-height: 18px;
}

.indent dl
{
    line-height: 16px;
}

.indent dd, .indent label
{
    font-size: 11px;
}

.indent dl dt
{
    width: 160px;
    font-size: 11px;
}

.postComment
{
    color: #333333;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.3em;
    margin: 10px 60px 5px 0px;
    padding: 0pt;
    background-color: #FFFFCC;
}

.textballoon {
  position:relative;
  padding:10px;
  color:#333;
  background:#F5DEB3;
  margin: 15px 5px 10px 0px;
  /* css3 */
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
}

.textballoon:after {
  content:"";
  position:absolute;
  top:-20px;
  left:20px;
  border:10px solid transparent;
  border-bottom-color:#F5DEB3;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}


.SearchButton
{
    padding: 0pt 2px 0pt 2px;
    margin-right: 10px;
}

.Progress
{
    background-color: #CF4342;
    color: White;
    z-index: 99999;
}

.Progress img
{
    vertical-align: middle;
    margin: 2px;
}

/* Data Pager Styles */
.pager
{
    font-family: Verdana,serif;
    text-align: center;
    padding: 15px 0px;
    font-size: 12px;
}

.pager SPAN.command, .pager SPAN.current, .pager A.command
{
    border: solid 1px #ccc;
    color: #666;
    background-position: 0px -20px;
    line-height: 18pt;
    padding: 5px;
    text-decoration: none;
}

.pager SPAN.current
{
    font-weight: bold;
}

/* table level rules */
.yui-grid
{
    font-family: arial;
    font-size: small;
    border: solid 1px #7f7f7f;
    border-collapse: collapse;
}


/* header column rules */
.yui-grid th
{
    background: url(../images/sprite.png) repeat-x 0px 0px;
    border-color: #989898 #cbcbcb #989898 #989898;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    color: #000;
    padding: 4px 5px 4px 10px;
    text-align: center;
    vertical-align: bottom;
}

.yui-grid th a
{
    font-weight: normal;
    text-decoration: none;
    text-align: center;
    color: #000;
    display: block;
    padding-right: 10px;
}

/* change the background image when the column is being sorted by */
.yui-grid th.sortasc, .yui-grid th.sortdesc
{
    background: url(../images/sprite.png) repeat-x 0px -100px;
}

/* change image if it is an asc sort */
.yui-grid th.sortasc a
{
    background: url(../images/dt-arrow-up.png) no-repeat right 50%;
}

/* change image if it is a desc sort */
.yui-grid th.sortdesc a
{
    background: url(../images/dt-arrow-dn.png) no-repeat right 50%;
}


/* data cell and data row rules */
.yui-grid td
{
    padding: 4px 10px 4px 10px;
    border-right: solid 1px #cbcbcb;
}

.yui-grid .altrow, .yui-grid .row .sort
{
    background-color: #edf5ff;
}

.yui-grid .altrow .sort
{
    background-color: #dbeaff;
}

.yui-grid .row
{
    background-color: #fff;
}

.reportimg
{
    margin-right: 5px;
}

/* table level rules */
.yui-grid2
{
    font-family: arial;
    font-size: small; /*border: solid 1px #7f7f7f;*/
    border-collapse: collapse;
}


/* header column rules */
.yui-grid2 th
{
    background: url(../images/sprite.png) repeat-x 0px 0px;
    border-color: #989898 #cbcbcb #989898 #989898;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    color: #000;
    padding: 4px 5px 4px 10px;
    text-align: center;
    vertical-align: bottom;
}

.yui-grid2 th a
{
    font-weight: normal;
    text-decoration: none;
    text-align: center;
    color: #000;
    display: block;
    padding-right: 10px;
}

/* change the background image when the column is being sorted by */
.yui-grid2 th.sortasc, .yui-grid th.sortdesc
{
    background: url(../images/sprite.png) repeat-x 0px -100px;
}

/* change image if it is an asc sort */
.yui-grid2 th.sortasc a
{
    background: url(../images/dt-arrow-up.png) no-repeat right 50%;
}

/* change image if it is a desc sort */
.yui-grid2 th.sortdesc a
{
    background: url(../images/dt-arrow-dn.png) no-repeat right 50%;
}


/* data cell and data row rules */
.yui-grid2 td
{
    /*padding: 4px 10px 4px 10px;*/
    padding: 0px;
    border-right: solid 1px #cbcbcb;
}

.yui-grid2 .altrow, .yui-grid .row .sort
{
    background-color: #edf5ff;
}

.yui-grid2 .altrow .sort
{
    background-color: #dbeaff;
}

.yui-grid2 .row
{
    background-color: #fff;
}

/* switch */

.cb-enable, .cb-disable, .cb-enable span, .cb-disable span
{
    background: url(../images/switch.gif) repeat-x;
    display: block;
    float: left;
}
.cb-enable span, .cb-disable span
{
    line-height: 30px;
    display: block;
    background-repeat: no-repeat;
    font-weight: bold;
}
.cb-enable span
{
    background-position: left -90px;
    padding: 0 10px;
}
.cb-disable span
{
    background-position: right -180px;
    padding: 0 10px;
}
.cb-disable.selected
{
    background-position: 0 -30px;
}
.cb-disable.selected span
{
    background-position: right -210px;
    color: #fff;
}
.cb-enable.selected
{
    background-position: 0 -60px;
}
.cb-enable.selected span
{
    background-position: left -150px;
    color: #fff;
}
.switch label
{
    cursor: pointer;
}
.switch input
{
    display: none;
}

div#launchbar {
  font-family: 'Lucida Grande', Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  background: #000;
  position: relative;
  text-align: left;
}

div#launchbar div.message {
  padding: 5px 30px;
  color: #999;
}

div#launchbar ul {
  margin: 0;
  padding: 0;
}

div#launchbar li {
  list-style-type: none;
  line-height: normal;
  padding: 0;
}

div#launchbar ul.menus {
  padding: 0 25px;
}

div#launchbar li.menu {
  float: left;
  position: relative;
  margin-right: 4px;
}

div#launchbar li.menu a {
  position: relative;
  display: block;
  padding: 5px 7px 6px 4px;
  font-size: 11px;
  color: #999;
    border-right: 1px solid #222;
  text-decoration: none;
}

div#launchbar li.menu a:hover {
  background: #000;
}

div#launchbar li.menu a:hover {
  background: #000;
}

div#launchbar li.menu a.on {
  color: #ddd;
}

div#launchbar li.menu a.on:hover {
  color: #ddd;
}

div#launchbar li.menu a.account:hover {
  color: #fff;
}

div#launchbar li.menu a.current_account:hover {
  color: #999;
}

.btn {
  align-items: flex-start;
  text-align: center;
  cursor: default;
  color: buttontext;
  padding: 2px 6px 3px;
  border: 2px outset buttonface;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
  background-color: buttonface;
  box-sizing: border-box;
  -webkit-appearance: push-button;
  -webkit-user-select: none;
  white-space: pre;
  font-size: 13px;
  text-decoration: none;
}