soil-report-ai/client-assets/css/graphPrint.css

/**
 * Print stylesheet for Graph Pages Only
* @version         1.0
* @lastmodified    02/08/2019
*/
@media print {
    @page {
        size: A4 portrait;
        margin: 0.25cm;
    }

    body {
        font-size: 0.9em;
    }
    .pagebreak { 
        page-break-before: always;
        break-before: page;
    }
    
    .graph th td {
        border-bottom: 1px solid #e1e1e1 !important;
        border-width:0 1px 1px 0 !important;
    }
    
    hr {
        page-break-after: avoid;
        display:none;
        height:1px;
        border:0;
        padding:0
    }
    
    .nav-header {
        float: left;
        margin: 0
    }
    
    .graph-header {
        padding: 5px 0 5px 0;
        font-weight: bold;
        font-size: 20px;
        color: black;
    }
    .progress {
        border-radius: 0;
    }
    .no-pad-menu {
        padding: 0;
        margin-bottom: 0;
        background: transparent !important
    }
    
    .ratios {
        width: 100%;
    }
    
    .ratios-header {
        width: 100%;
        background: #2b2b2b;
        color: white;
    }
    
    .chart {
        width: 100%;
        color: black;
    }
    .chart-header {
        padding: 10px 0 10px 40px;
        font-weight: bold;
        font-size: 15px;
        color: #ffffff;
        line-height: 20px;
        width: 100%;
        background: #2b2b2b;
    }
    .sub-chart-plant {
        padding: 10px 0 10px 0;
        line-height: 26px;
    
    }
    
    .sub-chart-plant, th, td.graph-border {
        padding: 10px 0 10px 0;
    }
    
    .chart-header-sub {
        width: 100%;
        background: #afafaf;
        color: #ffffff;
        margin: 0px;
        padding: 0px;
    }
    
    .sub-chart td {
        padding: 2px 0 2px 0;
        page-break-after: avoid;
    }

    .text-left {
        padding-left: 5px;
    }

    .analysis-footer {
        padding: 20px 20px 0 20px;
    }
    .stripe-1 {
      color: #4e4e4e;
      background: repeating-linear-gradient( 45deg, #ffffff, #ffffff 4px, #f7f7f7 2px, #f7f7f7 6px );
      background: -moz-repeating-linear-gradient( 45deg, #ffffff, #ffffff 4px, #f7f7f7 2px, #f7f7f7 6px );
    }
    
    /* BAR GRAPH COLOURS */
    
    .lightgreenGraph {
        background: #5cb85c;
    }
    .lightgreen {
        color: white;
        background-image: -webkit-linear-gradient(left, #ebf1de, #5cb85c);
        background-image: -moz-linear-gradient(left, #ebf1de, #5cb85c);
        background-image: -o-linear-gradient(left, #ebf1de, #5cb85c);
        background-image: -ms-linear-gradient(left, #ebf1de, #5cb85c);
        background-image: linear-gradient(left, #ebf1de, #5cb85c);
    }
    .lightredGraph {
        background: #9a3634;
    }
    .lightred {
        color: white;
        background-image: -webkit-linear-gradient(left, #f3dddc, #9a3634);
        background-image: -moz-linear-gradient(left, #f3dddc, #9a3634);
        background-image: -o-linear-gradient(left, #f3dddc, #9a3634);
        background-image: -ms-linear-gradient(left, #f3dddc, #9a3634);
        background-image: linear-gradient(left, #f3dddc, #9a3634);
    }
    .lightpurpleGraph {
        background: #16365c;
    }
    .lightpurple {
        color: white;
        background-image: -webkit-linear-gradient(left, #ebf1de, #16365c);
        background-image: -moz-linear-gradient(left, #ebf1de, #16365c);
        background-image: -o-linear-gradient(left, #ebf1de, #16365c);
        background-image: -ms-linear-gradient(left, #ebf1de, #16365c);
        background-image: linear-gradient(left, #ebf1de, #16365c);
    }
    .lightblueGraph {
        background: #366092;
    }
    .lightblue {
        color: white;
        background-image: -webkit-linear-gradient(left, #dde7f2, #366092);
        background-image: -moz-linear-gradient(left, #dde7f2, #366092);
        background-image: -o-linear-gradient(left, #dde7f2, #366092);
        background-image: -ms-linear-gradient(left, #dde7f2, #366092);
        background-image: linear-gradient(left, #dde7f2, #366092);
    }
    
    .lightorangeGraph {
        background: #ffa500;
    }
    .lightorange {
        color: white;
        background-image: -webkit-linear-gradient(left, #fcdda4, #ffa500);
        background-image: -moz-linear-gradient(left, #fcdda4, #ffa500);
        background-image: -o-linear-gradient(left, #fcdda4, #ffa500);
        background-image: -ms-linear-gradient(left, #fcdda4, #ffa500);
        background-image: linear-gradient(left, #fcdda4, #ffa500);
    }
    .lightgreyGraph {
        background: #afafaf;
    }
    .lightgrey {
        color: white;
        background-image: -webkit-linear-gradient(left, #d2d2d2, #afafaf);
        background-image: -moz-linear-gradient(left, #d2d2d2, #afafaf);
        background-image: -o-linear-gradient(left, #d2d2d2, #afafaf);
        background-image: -ms-linear-gradient(left, #d2d2d2, #afafaf);
        background-image: linear-gradient(left, #d2d2d2, #afafaf);
    }
    
    .nutrient-balance {
        background-color: #b7ffb6;
    }
    .ratio-balance {
        /*background-color: #efefef;*/
        font-weight: bold;
    }
    .odd {
        background-color: #efefef;
    }
    
    .title {
        width: 100%;
    }
    .title, .left, th, td {
        padding: 3px 10px 0 0;
        text-align: left;
    }
    .title, .right, th, td {
        padding: 3px 10px 0 0;
        text-align: right;
    }
    
    tr.sub-chart td table {
        margin-bottom: 0px;
    }
    
    .progress.thin, tr.progress.thin {
      height: 20px;
    }
    .progress, tr.progress {
      background: #f2f4f8;
      height: 17px;
      overflow: hidden;
      background-color: #f5f5f5;
    }
    .progress-bar, td.progress-bar {
        height: 15px;
    }
    
    .progress-bar-success, td.progress-bar-success {
        background-color: #5cb85c;
    }
    .progress-bar-warning, td.progress-bar-warning {
        background-color: #f0ad4e;
    }
    .progress-bar-danger, td.progress-bar-danger {
        background-color: #d9534f;
    }
    
    .col{
        flex:1
    }
    [class*='col']{
        padding:0 20px;
        position:relative
    }
    .col-100{
        width:100%
    }
    .col-50{
        width:50%
    }
    .col-33{
        width:33.33%
    }
    .col-66{
        width:66.66%
    }
    .col-25{
        width:25%
    }
    .col-75{
        width:75%
    }
    .col-20{
        width:20%
    }
    .col-40{
        width:40%
    }
    .col-60{
        width:60%
    }
    .col-80{
        width:80%
    }
    
    .col-15{
        width:15.66%
    }
    
    .col-16{
        width:16.66%
    }
    
    .col-14{
        width:14.66%
    }
    .col-18{
        width:18.66%
    }
    .col-12{
        width:12.5%
    }
    .col-10{
        width:10%
    }
    .col-30{
        width:30%
    }
    .col-70{
        width:70%
    }
    .col-90{
        width:90%
    }
    
    
    .col-md-3{
        width:25%
    }
    .col-md-9{
        width:75%
    }
   
    
}