/* fonts */
    * { font-family: Roboto, Arial, sans-serif; }
    
    /* background, layout, margins */
    body { background-color: #EEE; }
    .content-holder { padding: 20px; overflow-y: scroll; height: -moz-calc(100%); height: -webkit-calc(100%); height: calc(100%); }
    .row { margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px; height: 100%; display: table-row; }
    .row .no-float { display: table-cell; float: none; }
    .dash-margins { margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px; }
    .container-fluid.calculated-height { margin: 0px; }
    .vcentered-form { margin-top: 25vh; }
    .hcentered-form { text-align: center; }
    .dash-margins.data-entry-page { height: 85vh; padding-top: 15px; }

    /* navbar */
    .mbk-navbar .navbar.navbar-static-top .container-fluid .navbar-header .navbar-brand { text-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1); }
    .mbk-navbar .navbar.navbar-static-top .container-fluid .navbar-header button.navbar-toggle { margin:5px 0 0 0; float: right; }

    /* sidebar */
    #user-sidebar { height: 100%; color:#404040; overflow: auto; text-align: center; }
    #user-sidebar.calculated-height { height: -moz-calc(100vh - 79px); height: -webkit-calc(100vh - 79px); height: calc(100vh - 79px); }
    #user-sidebar.sidebar-section { border: none; }
    .col-lg-2.col-md-2.hidden-sm.hidden-xs.dash-margins#user-sidebar { max-width: 110px; min-width: 100px; display: inline-block; height: -moz-calc(100vh - 79px); height: -webkit-calc(100vh - 79px); height: calc(100vh - 79px); }

    /* forms */
    .form-control.input-sm { height: 34px; border-radius: 4px; }

    /* modals */
    .modal.large.fade > .modal-dialog { width: 50%; }
    .modal#chart-info-modal { margin-top: 200px; }
    .modal-title { font-size: 16px; margin-top: 0px; margin-bottom: 0px; font-weight: normal; color: #337ab7; }
    .modal-header { border: none; }
    .modal-header .close { margin: 0; position: absolute; top: 8px; right: 10px; }
    .btn.btn-primary.plain-btn.chart-modal { color: #6c93a3; background: none; border: none; }
    .btn.btn-primary.plain-btn.chart-modal:active, 
    .btn.btn-primary.plain-btn.chart-modal:focus,
    .btn.btn-primary.plain-btn.chart-modal:hover { color: #144660; }

    /* other buttons */
    .button-wrapper-slim { float: right; }
    .button-wrapper.button-wrapper-left { float: left; margin-left: 10px; }
    .btn.btn-primary.plain-btn:disabled { background: #bbb; border: #bbb; cursor: not-allowed; }

    /* charts */
    .highcharts-container { overflow: visible !important; }
    .highcharts-background { width: 1400px !important; height: 600px !important; }

    /* static figures */
    .img-wrapper { width: 100%; text-align: center; vertical-align: middle; height: -moz-calc(100vh - 170px); height: -webkit-calc(100vh - 170px); height: calc(100vh - 170px); }
    .report-figure { height: 100%; }

    /* tables */
    .table-striped tr { border: none; }

    /* handsontables */
    #hot { font-size: .75em !important; width: 100% !important; }
    table.htCore thead th { background-color: #6c93a3 !important; color: white !important; vertical-align: middle !important; }
    table.htCore td { text-align: center !important; vertical-align: middle !important; }
    table.htCore .htDimmed { background-color: #eee !important; }
    table.htCore .htRight { text-align: center !important; }
    .handsontable.ht__selection--columns thead th.ht__highlight, 
    .handsontable.htColumnHeaders th.ht__highlight { background-color: #144660 !important; }
    th.ht__highlight { background-color: #144660 !important; color: white !important; }
    td.htRight.htNumeric.area.highlight { background-color: #ddd !important; }
    .handsontable td.area-7:before, .handsontable td.area:before { background: #ddd !important; }
    .htInvalid { color: black !important; }
    .content-holder.dash-margins { margin: 0px !important; padding: 0px !important; }
    #chart { height: 84vh !important; width: 98% !important; }
    .highcharts-background { background: none !important; }
    .highcharts-root { font-size: 1.3rem !important; }
    .highcharts-plot-background { background: white !important; }
    .handsontable th { line-height: 1.4 !important; }  

    /* mobile */
    @media(max-width:767px) { 

      /* background, layout, margins */
      .row.dash-margins .col-lg-9.col-md-12, .row.dash-margins .col-lg-12.col-md-12 { padding-left: 0px; }
      .title-block, .chart-content { margin: 10px; }
      .title-block span#chart-title { display: none; }

      /* navbar */
      .mbk-navbar .navbar.navbar-static-top .container-fluid .navbar-header .navbar-brand { line-height: 1.7em; padding: 5px 15px; }

      /* button bar */
      .yellow { height: 34px; padding: 0px; }
      .yellow .button-wrapper { line-height: 22px; margin-left: 5px; margin-right: 5px; }
      .yellow .button-wrapper #exportMenu { padding: 0px 0px 0px 0px ; height: 2.0em; }
      .yellow .button-wrapper #exportMenu > span#button-title { vertical-align: middle; margin-top: 2px; padding: 4px; }
      .yellow .button-wrapper #exportMenu button#exportCsv, #exportMenu button#printPlot { height: 100%; }

      /* modals */
      .modal#chart-info-modal { margin-top: 60px; }

      /* other buttons */
      .btn { font-size: .75em; line-height: .75em; }
      .button-wrapper .btn { display: inline-block; height: 2.0em; margin: 0px; font-size: .75em; line-height: .75em; }

      /* charts */
      #chart.chart-calculated-height { height: -moz-calc(100vh - 80px); height: -webkit-calc(100vh - 80px); height: calc(100vh - 80px); margin: 0px; font-size: 1em; }

      /* static figures */
      .img-wrapper.chart-calculated-height { height: -moz-calc(100vh - 130px); height: -webkit-calc(100vh - 130px); height: calc(100vh - 130px); font-size: 1em; }     

    }