﻿/*font: inherit;            TK: THIS WILL STOP ALL INLINE FORMATTING, DO NOT USE */
/*vertical-align: baseline; TK:THIS SEEMS TO BREAK THE SPLITTER RESIZING */
/* E4610F 383f44 */
.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}
.clearfix:after {
  clear: both;
}
/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix {
  *zoom: 1;
}
/* ------------------------------------------------------------------------------------
 COMMON
 ------------------------------------------------------------------------------------- */
html,
body,
form {
  height: 100%;
  /*font-size: 12px;*/
  background-color: #FFF;
}
html {
  font-size: 12px;
  /* 11pt or 14px */
}
body {
  line-height: 1.5em;
  background-color: #FFF;
}
a {
  text-decoration: none;
  color: Blue;
  outline: 0;
}
a:hover {
  text-decoration: underline;
  outline: 0;
}
a:active,
a:visited,
a:focus {
  outline: 0;
}
legend {
  font-weight: bold;
  color: #000;
}
.page-title {
  display: none;
  text-align: center;
}
.report-link {
  color: Maroon;
}
.clear {
  clear: both;
}
.float-left {
  float: left;
}
.float-right {
  float: right;
}
.field-validation-error {
  color: Red;
}
.deleted {
  background-color: Red;
}
.update-contracts-rates-link {
  color: #FF0000;
  cursor: pointer;
}
.truncate-dropdown-list {
  width: 650px;
}
.ech-logo,
.application-logo,
.client-logo {
  padding: 2px;
}
/* ------------------------------------------------------------------------------------
 DIV CONTAINERS
.page-actions{text-align: right;padding: 5px;border: 1px solid #aaa;margin-top: 10px;}
------------------------------------------------------------------------------------- */
#input-container,
.input-container {
  width: 960px;
  margin: 0 auto;
  padding: 0;
  clear: both;
  text-align: left;
}
#input-container-small,
.input-container-small {
  width: 760px;
  margin: 0 auto;
  padding: 0;
  clear: both;
  text-align: left;
}
#content-panel,
.content-panel {
  width: 960px;
  margin: 0 auto;
  /*padding-top: 10px;*/
}
#container {
  margin: 0 auto;
}
.header-section {
  background-color: #FFF;
  color: #fff;
}
.header-section-treeview {
  width: 100%;
  height: 30px;
  display: table-cell;
  vertical-align: middle;
}
.header-section td {
  padding: 2px;
}
.header-section-estimating {
  background-color: #EAEAEA;
  color: #000;
}
.table-selection {
  background-color: #fff;
  color: #000;
  width: 800px;
  text-align: left;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  border-top: 1px solid #000;
}
.table-selection td {
  padding: 2px;
}
.manage-table-selector {
  margin: 5px;
  text-align: left;
}
.manage-table-selector td {
  padding: 2px;
}
/* ------------------------------------------------------------------------------------
 DASHBOARD
.dashboard td{padding:2px 8px;vertical-align:top;}
.dashboard th{padding:2px 8px;vertical-align:top;font-weight:bold;}
------------------------------------------------------------------------------------- */
.dashboard {
  text-align: center;
  margin: 0 auto;
}
.dashboard table {
  text-align: center;
  margin: 0 auto;
}
.dashboard td {
  vertical-align: top;
}
.dashboard h3 {
  text-align: center;
}
.rounded-corners-box {
  margin: 0.5in auto;
  color: #000;
  width: 90%;
  padding: 20px;
  /*text-align: left;*/
  background-color: #ECEDF0;
  border: 3px solid #000;
  /* Do rounding (native in Opera, Firefox and Safari) */
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
}
.rounded-corners-box-title {
  width: 200px;
  height: 20px;
  text-align: center;
}
.dashboard-header-style th {
  padding: 2px 6px;
  font-weight: bold;
}
.dashboard-row-style td {
  padding: 2px 6px;
}
.dashboard-footer-style td {
  padding: 2px 6px;
  font-weight: bold;
}
/* ------------------------------------------------------------------------------------
 HEADER & MENU #5B666F
------------------------------------------------------------------------------------- */
.header {
  background-color: #FFF;
  height: 75px;
}
.header .header-left {
  float: left;
  width: 300px;
  height: 100%;
}
.header .header-left img {
  padding: 10px;
}
.header .header-right {
  float: right;
  width: 300px;
  height: 100%;
}
.header .header-centre {
  margin: 0 auto;
  text-align: center;
  background-color: #FFF;
  height: 100%;
}
.menu {
  height: 28px;
  border-top: 1px solid #383f44;
  border-bottom: 1px solid #383f44;
  background-color: #383f44;
}
.breadcrumbs {
  text-align: left;
  background-color: #fff;
  margin-left: 8px;
}
.breadcrumbs a {
  color: blue;
}
.logo {
  float: left;
  margin: 5px;
}
.version {
  color: #fff;
  position: absolute;
  top: 80px;
  right: 5px;
}
.page-actions {
  background-color: #383f44;
  min-height: 1px;
  padding: 0.3em;
  text-align: right;
  margin-top: 2px;
}
.page-actions-left {
  float: left;
  width: 35%;
  min-height: 1px;
  text-align: left;
}
.page-actions-right {
  float: right;
  width: 60%;
  min-height: 1px;
  text-align: right;
}
.page-actions-centre {
  margin: 0 auto;
  text-align: center;
  min-height: 1px;
}
/* ------------------------------------------------------------------------------------
HOME PAGE
------------------------------------------------------------------------------------- */
#HomePageBackground,
.home-page-background {
  position: fixed;
  top: 102px;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -5000;
}
.background-width {
  width: 100%;
}
.background-height {
  height: 100%;
}
.home-page-text {
  color: White;
  margin: 10px;
}
.info-image {
  float: right;
}
/* ------------------------------------------------------------------------------------
 BLOCK UI
 Note: blockMsg is the default class used by blockUI
------------------------------------------------------------------------------------- */
div.progress {
  background-image: url('/common/images/progress-indicator.gif');
  background-position: center center;
  background-repeat: no-repeat;
}
.blockui-popup-message {
  background-position: center center;
  background-repeat: no-repeat;
  height: auto;
  width: auto;
  text-align: center;
  padding: 5px;
}
.blockui-popup-message p {
  padding: 5px;
  margin-bottom: 5px;
}
.blockui-message-title {
  background-color: #cccccc;
  padding: 7px;
  font-weight: bold;
}
.blockui-data-protection-panel {
  position: absolute;
  padding: 5px;
  margin: 0;
  width: 30%;
  top: 50%;
  left: 50%;
  text-align: center;
}
.blockui-popup-progress {
  text-align: center;
  padding: 5px;
}
/* ------------------------------------------------------------------------------------
 PROFILE PANEL
------------------------------------------------------------------------------------- */
.profile-panel {
  background-color: #000044;
  padding: 0 5px 8px 5px;
  margin: 5px 5px 0 0;
  line-height: 0.7em;
  position: absolute;
  top: 0;
  right: 0;
  color: orange;
  font-size: 0.9em;
}
.profile-panel p {
  color: #fff;
}
.profile-panel p a {
  color: #f7ac02;
}
.profile-panel p.last_login {
  color: #ffffff;
}
/* ------------------------------------------------------------------------------------
FORM INPUT SECTION
------------------------------------------------------------------------------------- */
fieldset {
  border: 1px solid #aaa;
  padding: 2px 10px 10px 10px;
  margin-bottom: 0;
  text-align: left;
}
fieldset td {
  padding: 2px;
  padding-left: 4px;
}
textarea {
  width: 98.8%;
  font-family: inherit;
}
.input-text {
  width: 250px;
}
.input-text-small {
  width: 100px;
}
.check-box {
  border: none;
}
.TableColumnWidth {
  width: 150px;
}
.required {
  background-image: url(/common/images/required.gif);
  background-repeat: no-repeat;
  background-position: right;
  display: inline-block;
  width: 100%;
  padding-right: 4px;
  /*stops the text from overlaying on the background image*/
}
.oa-actions {
  float: left;
  width: auto;
  display: inline;
  color: #fff;
}
.page-header-box td {
  padding: 0;
}
.time-type-selector {
  padding: 2px;
  text-align: left;
}
.money {
  width: 150px;
}
/* ------------------------------------------------------------------------------------
ESTIMATING
------------------------------------------------------------------------------------- */
.estimate-grid-filter {
  text-align: left;
}
.estimate-header {
  width: 900px;
  margin: 0 auto;
  padding: 2px 2px 2px 2px;
  font-weight: bold;
  background-color: #fff;
  color: #800000;
  margin-bottom: 2px;
}
/*.estimate-grid { width: auto; margin: 0 auto; }*/
.standard-grid {
  margin: 10px;
  width: 960px;
  margin: 0 auto;
}
.norm-input-panel {
  background-color: #f3f3f3;
  padding: 2px;
}
.estimate-item-header {
  width: 100%;
  padding: 5px;
  margin-top: -5px;
  background-color: #e3e3e3;
  color: #2e2e2e;
}
/*.estimate-item-header th { padding: 0; text-align: left; border: 1px solid silver; }*/
/*.estimate-item-header td { padding: 0; border: 1px solid silver; }*/
.lock-status {
  color: #FF0000;
  font-variant: small-caps;
  font-weight: bold;
}
.estimate-line-item-input td {
  padding: 2px;
}
/* ------------------------------------------------------------------------------------
TABLES
------------------------------------------------------------------------------------- 
table td{ padding: 2px;}
.table-input { padding: 2px; }
.table-input td { padding: 2px; }*/
/*------------------------------------------------------------------
DUAL LIST
------------------------------------------------------------------ */
.dual-list table {
  margin: 0 auto;
}
.dual-list td {
  vertical-align: middle;
  text-align: center;
}
.dual-list-buttons {
  vertical-align: middle;
  text-align: center;
}
.dual-list input,
.dual-list-buttons input {
  width: 35px;
  text-align: center;
}
/*------------------------------------------------------------------
CONDITION FACTORS
------------------------------------------------------------------ */
#condtionFactorsDisplay,
#conditionFactorFieldset {
  border: 1px solid #C0C0C0;
}
#condtionFactorsDisplay .optionListHeader {
  font-weight: bold;
  float: left;
  margin-top: 8px;
  border-bottom: 1px solid #C0C0C0;
  height: 20px;
  width: 99%;
}
#condtionFactorsDisplay .optionList {
  margin: 0;
  margin-bottom: 4px;
  padding: 0;
  width: 100%;
}
#condtionFactorsDisplay .optionList label {
  vertical-align: text-bottom;
}
/*------------------------------------------------------------------
SEARCH CONTAINER
------------------------------------------------------------------ */
.search-panel {
  margin-top: 0;
}
#SearchContainer {
  float: left;
  vertical-align: bottom;
  border: 0 solid Silver;
}
#SearchContainer td {
  padding: 5px;
}
#SearchContainer .WhereBuilder,
#SearchContainer .PageSize,
#SearchContainer td {
  vertical-align: bottom;
}
#SearchContainer .search-container-actions {
  width: 100%;
  text-align: right;
}
/*------------------------------------------------------------------
TREEVIEW
background-color: #383F44;
Notes: don't set the the treeview-header border.
------------------------------------------------------------------ */
.treeview-header {
  color: #000;
  vertical-align: middle;
  background-color: #FFFFFF;
  border-bottom: 1px solid #383F44;
}
.treeview-header-section {
  width: 100%;
  background-color: #383F44;
  color: #ffffff;
  text-align: center;
  padding-top: 2px;
  padding-bottom: 2px;
}
.TreeView {
  background-color: White;
  border: #333333 0 solid;
  padding-top: 2px;
  cursor: default;
}
.TreeNode {
  padding: 1px;
  padding-left: 3px;
  padding-right: 1px;
  cursor: default;
}
.HoverTreeNode {
  padding: 1px;
  padding-left: 3px;
  padding-right: 1px;
  color: #648bcb;
  text-decoration: underline;
  cursor: default;
}
.SelectedTreeNode {
  padding: 1px;
  padding-left: 3px;
  padding-right: 1px;
  background-color: #a0a0a0;
  cursor: default;
}
.NodePopup {
  padding: 1px;
  padding-left: 3px;
  padding-right: 1px;
  background-color: White;
  border: 1px solid black;
  text-decoration: none;
  color: Black;
  filter: progid:DXImageTransform.Microsoft.Shadow(color=black, direction=135, Strength=2);
  cursor: default;
}
.NodeEdit {
  border: 1px silver solid;
}
.MenuGroup {
  background-color: #383F44;
  color: #fff;
}
.MenuGroup td {
  color: #fff;
}
.MenuGroup .MenuItem {
  cursor: pointer;
  color: #fff;
}
.MenuGroup .MenuItemHover,
.MenuGroup .ContextTreeviewActive {
  background-color: #88838F;
  cursor: hand;
}
/*------------------------------------------------------------------
SPLITTER #CCCCCC;
------------------------------------------------------------------ */
.splitter-container {
  margin: 0 auto;
  /*border: 1px solid red;*/
}
.splitter-pane-treeview {
  /*border: 1px solid blue;*/
}
.splitter-pane-details {
  /*border: 1px solid cyan;*/
}
.horizontal-splitter-bar {
  background: url('/Content/themes/images/splitter/splitter_horBg.gif');
}
.collapsed-horizontal-splitter-bar {
  background: url('/Content/themes/images/splitter/splitter_horBg.gif');
  border: 1px solid #000000;
  border-right-width: 0;
}
.vertical-splitter-bar {
  background: url('/Content/themes/images/splitter/splitter_verBg.gif');
}
.collapsed-vertical-splitter-bar {
  background: url('/Content/themes/images/splitter/splitter_verBg.gif');
  border: 1px solid #000000;
  border-bottom-width: 0;
}
.active-splitter-bar {
  background-color: transparent;
  /* Fix for Chrome splitter resizer dragging */
  opacity: 0.4;
}
.splitter-pane {
  vertical-align: top;
  border: 1px solid #888888;
}
.details-pane {
  vertical-align: top;
}
.treeview-pane {
  vertical-align: top;
}
.grid-pane {
  vertical-align: top;
}
/*------------------------------------------------------------------
GRIDS
{background-color:#383F44
------------------------------------------------------------------ */
.grid {
  width: 100%;
}
.grid td {
  padding: 1px 5px 1px 5px;
  vertical-align: middle;
  border: 1px solid silver;
}
/* Header Style */
.grid .header-style th,
.grid .header-style td {
  background-color: #383F44;
  color: #fff;
  height: 24px;
  vertical-align: middle;
}
.grid .child-header-style th,
.grid .child-header-style td {
  background-color: #66727B;
  color: #fff;
  height: 24px;
  vertical-align: middle;
}
.grid .header-style a {
  color: #fff;
  text-decoration: none;
}
.grid .child-header-style a {
  color: #fff;
  text-decoration: none;
}
.grid .sorted-ascending-header-style {
  background: url(images/flexigrid/up.png) no-repeat center top;
  background-color: #383F44;
}
.grid .sorted-descending-header-style {
  background: url(images/flexigrid/dn.png) no-repeat center top;
  background-color: #383F44;
}
/* Row Style */
.row-style {
  background-color: #f3f3f3;
}
.row-style tr {
  border: 1px solid black;
}
.row-style td {
  background-color: #f3f3f3;
}
.alternating-row-style td {
  background-color: #e3e3e3;
}
.selected-row-style td {
  background-color: #d9ebf5;
}
/* Footer Style */
.grid .footer-style {
  background-color: #383F44;
  color: #fff;
}
/* Pager Style */
.grid .pager-style * {
  background-color: #383F44;
  color: #fff;
  font-variant: small-caps;
  vertical-align: middle;
  padding: 0;
  border: 0;
}
.grid .pager-style .pager-nav {
  width: 49%;
  text-align: left;
  float: left;
  height: 24px;
  padding: 2px;
}
.grid .pager-style .pager-info {
  width: 49%;
  text-align: right;
  float: right;
  height: 24px;
  padding: 2px;
}
/*------------------------------------------------------------------
LOGIN
------------------------------------------------------------------*/
.login-page-container {
  width: 700px;
  height: auto;
  margin: 50px auto;
  background-color: silver;
}
.login-panel {
  background-color: #EBEBEC;
  border: 1px solid #FFF;
  width: 230px;
  float: right;
  padding: 1em;
  display: block;
  border-radius: 15px;
}
.login-page-container #four-square {
  background: #FFF;
  width: 640px;
  height: auto;
  padding: 1px;
  display: block;
  position: absolute;
  border-radius: 15px;
  border: solid 1px black;
}
.login-page-container #top-left {
  width: 300px;
  height: 300px;
  margin: 10px;
  display: block;
  float: left;
}
.login-page-container #top-right {
  width: 300px;
  height: 300px;
  margin: 10px;
  display: block;
  float: left;
}
.login-page-container #bottom-left {
  width: 300px;
  height: 100px;
  margin: 10px;
  display: block;
  float: left;
  clear: left;
}
.login-page-container #bottom-right {
  width: 300px;
  height: 100px;
  margin: 10px;
  display: block;
  float: left;
}
.login-page-container .ech-logo {
  position: absolute;
  top: 15px;
  left: 15px;
}
/* Top left*/
.login-page-container .application-logo {
  position: absolute;
  bottom: 15px;
  left: 15px;
}
/* Bottom left */
.login-page-container .client-logo {
  position: absolute;
  bottom: 15px;
  right: 15px;
}
/* Bottom right */
.login-page-container .login-user-input {
  display: inline-block;
  text-align: left;
  width: 100%;
}
.login-container .text {
  width: 220px;
}
.login-page-container div.info,
.login-page-container div.success,
.login-page-container div.warning,
.login-page-container div.error,
.login-page-container div.ValidationSummary {
  border-radius: 15px;
}
.login-message-panel {
  width: 250px;
  clear: both;
  float: right;
  border-radius: 15px;
}
.login-message-panel #MessagePanel,
.OnErrorMessage {
  color: #FF0000;
  width: 250px;
  float: right;
  position: relative;
  left: 0;
  top: 0;
  clear: both;
  border-radius: 15px;
}
.login-container .page-actions {
  border: 0 none;
  background-color: transparent;
}
/*------------------------------------------------------------------
MESSAGES AND VALIDATION
------------------------------------------------------------------*/
#MessagePanel,
.MessagePanel,
#ValidationPanel,
.ValidationPanel {
  width: 100%;
  text-align: left;
}
div.info,
div.success,
div.warning,
div.error,
div.ValidationSummary,
#ValidationPanel div {
  border: 1px solid;
  margin: 1px 1px;
  padding: 10px 10px 10px 55px;
  background-repeat: no-repeat;
  background-position: 10px center;
  text-align: left;
}
div.info {
  color: #00529B;
  background-color: #BDE5F8;
  background-image: url('/common/images/info.png');
}
div.success {
  color: #4F8A10;
  background-color: #DFF2BF;
  background-image: url('/common/images/success.png');
  text-align: left;
}
div.warning {
  color: #9F6000;
  background-color: #FEEFB3;
  background-image: url('/common/images/warning.png');
}
div.error {
  color: #D8000C;
  background-color: #FFBABA;
  background-image: url('/common/images/error.png');
}
div.ValidationSummary {
  color: #D63301;
  background-color: #F8ECEC;
  background-image: url('/common/images/validation.png');
}
#MessagePanel ul,
#ValidationPanel ul {
  margin-left: 20px;
}
.info-message {
  color: #FF6600;
}
/*------------------------------------------------------------------
CONDITIONS FILTER
------------------------------------------------------------------*/
.filter {
  display: none;
  border: #ccc 1px solid;
  overflow: hidden;
  position: relative;
  background-color: #f1f1f1;
  text-align: left;
  margin-bottom: 10px;
}
.filter .addCondition,
.conditions {
  clear: both;
  float: left;
  padding-left: 5px;
  padding-right: 5px;
}
.filter .addCondition {
  width: 100%;
  border-top: #ccc 1px solid;
  background-color: #f6f6f6;
  padding-top: 10px;
  padding-bottom: 5px;
}
.filter .conditions {
  padding-top: 5px;
}
.filter .condition {
  clear: both;
  padding-top: 5px;
}
.filter .fieldLabel {
  padding-right: 5px;
  padding-left: 5px;
  vertical-align: middle;
}
.filter .condition .label {
  padding-right: 5px;
  padding-left: 5px;
  vertical-align: middle;
}
.filter .fields {
  padding-right: 5px;
  float: left;
}
.filter input,
.filter select {
  vertical-align: middle;
}
.filter .filterCriteria {
  padding-right: 5px;
  float: left;
}
.filter .conditions .logicalOperator {
  margin-left: 5px;
}
/*------------------------------------------------------------------
CONDITIONS FILTER SLIDER
------------------------------------------------------------------*/
div.slide {
  background: #fafafa url(images/flexigrid/bg.gif) repeat-x top;
  display: block;
  cursor: pointer;
  padding: 1px;
  height: 18px;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  width: 200px;
  text-align: center;
}
div.slide div {
  padding: 2px 16px 0 16px;
}
div.slide span {
  padding: 2px;
}
div.slide:hover {
  border: 1px solid #aaa;
}
/*------------------------------------------------------------------
AUDIT PANEL
------------------------------------------------------------------*/
#auditPanel {
  line-height: 1em;
}
#auditPanel table {
  width: auto;
}
#auditPanel tr {
  padding: 0;
}
#auditPanel .label {
  font-weight: bold;
}
/*------------------------------------------------------------------
MISCELLANEOUS
------------------------------------------------------------------*/
.bold {
  font-weight: bold;
}
.right {
  text-align: right;
}
.left {
  text-align: left;
}
#notification-panel {
  margin: 0 auto;
  width: 500px;
  border: 3px ridge red;
  padding: 5px;
  margin-top: 10px;
}
#notification-panel p {
  padding: 5px;
}
.warning {
  color: red;
}
/* Used on GSAP download page */
/*------------------------------------------------------------------
ARCHIVING
------------------------------------------------------------------*/
.archive-notification-panel {
  width: auto;
  position: absolute;
  top: 60px;
  right: 25px;
  text-align: center;
  padding: 2px 5px 2px 5px;
}
.archive-notification-panel .pending {
  background-color: orange;
  padding: 2px 5px 2px 5px;
}
.archive-notification-panel .archived {
  background-color: red;
  padding: 2px 5px 2px 5px;
}
img.theme-image {
  padding: 2px;
}
.login-page-container #bottom-left .theme-image {
  top: 45px;
  left: -2px;
  position: relative;
}
.login-page-container #bottom-right .theme-image {
  left: 120px;
  position: relative;
  top: 29px;
}
/*------------------------------------------------------------------
CONTROL SHEET
------------------------------------------------------------------*/
.controlSheet td {
  border: solid 1px lightgrey;
  text-align: right;
  font-size: 0.9em;
  width: 50px;
  padding: 2px;
}
.controlSheet th {
  text-align: center;
  font-size: 0.9em;
}
.controlSheet .control-sheet-banner {
  background-color: #383f44;
  color: #FF9933;
  padding: 5px;
  text-align: center;
  font-weight: bold;
}
.controlSheet .label {
  text-align: left;
  color: darkslategray;
  font-weight: bold;
}
.controlSheet .centre {
  text-align: center;
}
.custom-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  overflow: hidden;
  background-repeat: no-repeat;
  font-size: 0;
  line-height: 0;
  text-indent: -3333px;
  text-align: center;
  margin: 0 3px 0 -3px;
  vertical-align: text-top;
}
.custom-icon-add {
  background: transparent url('/Content/icons/add.png') no-repeat scroll left center;
}
.custom-icon-cancel {
  background: transparent url('/Content/icons/cancel.png') no-repeat scroll left center;
}
.custom-icon-close {
  background: transparent url('/Content/icons/close.png') no-repeat scroll left center;
}
.custom-icon-delete {
  background: transparent url('/Content/icons/delete.png') no-repeat scroll left center;
}
.custom-icon-edit {
  background: transparent url('/Content/icons/edit.png') no-repeat scroll left center;
}
.custom-icon-ok {
  background: transparent url('/Content/icons/ok.png') no-repeat scroll left center;
}
.custom-icon-report {
  background: transparent url('/Content/icons/report.png') no-repeat scroll left center;
}
.custom-icon-undelete {
  background: transparent url('/Content/icons/undelete.png') no-repeat scroll left center;
}
/*------------------------------------------------------------------
NEW FORM LAYOUT
------------------------------------------------------------------*/
#wrapper {
  width: 100%;
  height: 100%;
  display: table;
  padding: 0;
  margin: 0;
}
#left,
#right {
  display: table-cell;
}
#header {
  width: 100%;
}
#left {
  width: 50%;
}
#right {
  width: 50%;
}
#footer {
  width: 100%;
}
/* Kendo Grid */
.drag-helper {
  opacity: 0.2;
  z-index: 1000;
  top: 7px;
}
.k-dirty-cell {
  color: blue;
}
.hint {
  border: 2px solid #00FF00;
  padding: 7px 10px;
  background-color: #FFFFFF;
}
.child-grid {
  border: solid 1px blue;
  height: 100%;
}
.estimate-item-edit {
  width: 100%;
}
.input-form {
  vertical-align: top;
}
.row {
  display: table;
  width: 960px;
  margin: 0 auto;
  background-color: #99CCFF;
}
.cell {
  display: table-cell;
  vertical-align: top;
  padding-left: 10px;
  background-color: #FFFFCC;
}
.input-form label {
  float: left;
  padding: 4px 2px 0 2px;
  margin: 2px 0 0 0;
  display: block;
  font-weight: bold;
  text-align: left;
  width: 120px;
  border: solid 1px #aacfe4;
}
.input-form input,
.input-form select {
  float: left;
  padding: 4px 2px;
  margin: 2px 0 5px 10px;
  border: solid 1px #aacfe4;
  width: 200px;
}
.grid-edit-button {
  background: url('/content/icons/edit.png') no-repeat 0 0;
}
.label {
  font-weight: bold;
}
.error {
  color: #e80c4d;
}
/* styles for validation helpers */
.field-validation-error {
  color: #e80c4d;
  font-weight: bold;
}
.field-validation-valid {
  display: none;
}
input.input-validation-error {
  border: 1px solid #e80c4d;
}
input[type="checkbox"].input-validation-error {
  border: 0 none;
}
.validation-summary-errors {
  color: #e80c4d;
  font-weight: bold;
  font-size: 1.1em;
}
.validation-summary-errors ul li {
  list-style-type: disc;
}
.validation-summary-valid {
  display: none;
}
.k-sprite {
  background-image: url("/Content/icons/coloricons-sprite.png");
}
.rootfolder {
  background-position: 0 0;
}
.folder {
  background-position: 0 -16px;
}
.pdf {
  background-position: 0 -32px;
}
.file {
  background-position: 0 -48px;
}
.image {
  background-position: 0 -64px;
}
.save {
  background-position: 0 -80px;
}
.save-disabled {
  background-position: 0 -96px;
}
.validation-summary-errors {
  margin-left: 20px;
}
.estimate-dimension-input {
  width: 60px;
}
/* Style build-in commands */
.abutton,
div.k-grid .k-grid-edit,
div.k-grid .k-grid-delete,
div.k-grid .k-grid-cancel,
div.k-grid .k-grid-update {
  display: inline-block;
  width: 16px;
  height: 16px;
  text-align: center;
  text-indent: -444px;
  min-width: 0;
  border: 0;
}
div.k-grid .k-grid-edit {
  background: url('~/Content/icons/edit.png');
}
div.k-grid .k-grid-delete {
  background: url('~/Content/icons/cancel.png');
}
div.k-grid .k-grid-cancel {
  background: url('~/Content/icons/cancel.png');
}
div.k-grid .k-grid-update {
  background: url('~/Content/icons/ok.png');
}
/* Style custom buttons */
.abutton.delete {
  background: url('/common/images/delete.gif');
}
.abutton.edit {
  background: url('/common/images/copy.gif');
}
.abutton.update {
  background: url('/Content/icons/ok.png');
}
.abutton.cancel {
  background: url('/Content/icons/cancel.png');
}
.abutton.create {
  background: url('/Content/icons/add.png');
}
/* Kendo */
/*.k-grid, #splitter, #tabstrip {
    border-width: 1px;
    height: 100%;
}*/
div.tableForm {
  display: table;
}
div.tableRow {
  display: table-row;
}
div.tableCell {
  display: table-cell;
  width: auto;
  min-width: 100px;
  padding: 2px;
  white-space: nowrap;
}
/* Header styles */
#header {
  clear: both;
  float: left;
  width: 100%;
  border-bottom: 1px solid #fff;
}
/* 'widths' sub menu */
#layoutdims {
  clear: both;
  background: #eee;
  border-top: 4px solid #000;
  margin: 0;
  /*padding:6px 15px !important;*/
  text-align: right;
}
/* column container */
.colmask {
  clear: both;
  float: left;
  width: 100%;
  /* width of whole page */
  overflow: hidden;
  /* This chops off any overhanging divs */
}
/* common column settings */
.colright,
.colmid,
.colleft {
  float: left;
  width: 100%;
  position: relative;
}
.col1,
.col2,
.col3 {
  float: left;
  position: relative;
  padding: 0 0 1em 0;
  overflow: visible;
}
/* 2 Column (double page) settings */
.doublepage {
  background: #fff;
  /* right column background colour */
  overflow: visible;
}
.doublepage .colleft {
  right: 50%;
  /* right column width */
  background: #fff;
  /* left column background colour */
}
.doublepage .col1 {
  width: 50%;
  left: 50%;
}
.doublepage .col2 {
  width: 50%;
  left: 50%;
}
/* Footer styles */
#footer {
  clear: both;
  float: left;
  width: 100%;
  border-top: 1px solid #fff;
  /*background: #fff;*/
}
.hidden {
  display: none;
}
.debug {
  margin: auto;
  width: 100%;
  border: 3px solid red;
  padding: 2px;
}
.centre {
  margin: auto;
  width: 50%;
}
.text-centre {
  text-align: center;
}
.p2 {
  padding: 2px;
}