.monospace {
font-family: monospace, monospace;
line-height: 1.5;
white-space:pre-wrap;
}
div.monospace {
  padding: 1em;
}

.tabs .tab-title > a {
padding: 12px;
margin-right: 5px;
}


a {
color: #00465D;
}

.belt .details,
ul.invalid {
display:none;
}
ul.invalid {
/*display:inline;*/
}

.results table {
padding: 0;
}

.notes table th,
.results table th,
.brackets table th {
text-align: center;
}

th.alert,
th.success {
padding: 10px;
color: #000;
background-color: #ffcccc;
}
th.success,
th.success {
background-color: #ccffcc;
}

.brackets p {
margin-left: .5rem;
}

.card {
border: 5px solid #fff;
background-color: #eee;
}

.card div {
margin: 2px;
}

.card div div {
margin: 0;
}


.card .title {
background-color: #333;
color: #eee;
text-align: center;
padding: 0.5rem;
min-height:4rem;
font-size: 14px;
}
.card .title a {
color: #fff;
}

.hidden {
display:none;
}

.card .notes {
padding: 0.25rem 0.9375rem;
/*display:none;*/
}

.card .notes div {
margin: 0.5rem 0;
}

.card .belts {
padding-top: .25rem;
background-color: #fff;
border: 10px solid #eee;
}

.belts {
padding-top: .25rem;
}

.belts ul {
margin-left: 0;
margin-bottom:0;
}

.belts ul.invalid a,
.belts li.invalid a {
background-color: #fee;
}
.belts ul.valid a,
.belts li.valid a {
background-color: #efe;
}

.belts li.valid a {
border-color: #efe;
}

.belts li {
list-style:none;
line-height:1.2rem;
width:160px;
}

.belts li a {
display:block;
width: 130px;
margin-left: 10px;
padding: 2px 10px;
border: 1px solid #fee;
border-width: 1px 3px;
}

.belts li.valid.active a {
border: 1px dashed #090;
background-color: #cfc;
}

.belts li.invalid.active a {
border: 1px dashed #900;
background-color: #fcc;
color: #600 !important;
}

.belts li.active a {
width: 150px;
margin-left: 0;
padding: 2px 17px;
padding: 2px 22px;
}

.notes p,
.belts,
.belts a {
font-size: 12px;
}

.card .notes h5 {
font-size: 12px;
font-weight:bold;
}
.card .notes p {
margin-left: .5em;
}

.alert-box ul {
font-size: 12px;
margin-bottom: 0;
}
.panel .alert-box,
.panel .alert-box li{
color: #fff;
}

.measurements_summary table {
xmargin-left: auto;
white-space: pre-line;
}

.measurements_summary table td,
#belt_results table td {
font-size: 12px;
padding: 4px 10px;
vertical-align: top;
}

body {
background-color: #dfffd5;
background-color: #fafbbb;
background-color: #fbfcce;
background-color: #fcffe0;
line-height: auto !important;
}

label {
line-height: auto !important;
}

legend span.num,
label span.num,
legend span.num_ped,
legend span.num_l,
label span.num_ped,
label span.num_l {
font-weight: bold;
/*border:  2px solid #000;*/
border-radius: 25%;
padding: .25rem;
margin-right: .4rem;
background-color: #888;
color: #fff;
}

legend span.num_ped:after,
legend span.num_l:after,
label span.num_ped:after,
label span.num_l:after,
label span.num:after,
legend span.num:after {
content: ". ";
}

legend span.num,
label span.num,
legend span.num_ped,
legend span.num_l,
label span.num_ped,
label span.num_l {
  display: none;
}


fieldset {
background-color: #fff;
}

h4.diagram_title {
font-size: 13px;
font-weight: bold;
text-align:center;
}


.frac {
  font-size:14pt;
  font-weight: normal;
  white-space:nowrap;
/*  font-family: "Palatino";
  font-family: "Calibri";*/
  font-family: "Segoe UI";
}


/* increase max row width */
.row {
/*max-width: 110rem;*/
max-width: 100%;
}

/* CSV drag and drop area */
#csv_drag_holder { border: 2px dashed #ccc; margin: 0px auto;}
#csv_drag_holder.hover { border: 2px dashed #333; }


canvas{display: block; /* required for canvas to draw inline svg in firefox */}
canvas{display: inline;}

@page {size: landscape;}

@media print {
  @page {
    size: letter landscape;
  }
  
  .specscol {
    /*width: auto !important;*/
    /*width: 100% !important;*/
    /*width: 40% !important;*/
    padding-left:  0 !important;
    padding-right:  0 !important;
  }

  .printspecs {
    /*float:  left;*/
    /*display: inline-block;*/
    float:  none !important;
    width:  auto !important;
    /*transform: scale(0.80);*/
    /*transform-origin: 0 0;*/
  }
  
  .printspecs,
  .printspecs .columns {
    margin: 0 !important;
    padding-left:  0 !important;
    padding-right: 0 !important;
  }

  .specscol .row,
  .printspecs .row,
  .printspecs .row .row,
  .printspecs .row .row .row {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  #standard_panel {
    padding-top: 0;
  }

  #sidediagram {
    /*margin-left: -20px;*/
  }

  .diagram {
    margin-top:  10px;
    margin-left:  10px;
    margin: 10px 5px 0 5px;
  }

  .row {
    width: 100% !important;
  }

  .diagram {
    transform: scale(0.80);
    transform-origin: 0 0;
    /*float:  none !!important;*/
    /*width: 3in !important;*/
  }

  .belt_details .row {
    width:  100% !important;
  }
  
  .belt_details .row table,
  .measurements_summary table
  {
    width:  100% !important;
    border-collapse: collapse;
  }
  
  .belt_details .row table td,
  .belt_details .row table th,
  .measurements_summary table td,
  .measurements_summary table th
  {
    border:  1px solid #000;
    border-collapse: collapse;
  }

  .measurements_summary,
  .brackets .columns {
    padding-left: 0 !important;
  }

  .title {
    max-width: 300px !important;
  }

  table {
    page-break-inside: avoid;
  }

  body {
    /*position:fixed;*/
    /*transform: scale(.7);*/
    /*margin:  0 auto;*/
    /*zoom: 70%;*/
/*    transform: scale(0.75);
    transform-origin: 0 0;*/
    /*border:  4px solid black;*/
  }

  .printsmall table tr td {
    font-size: .75em !important;
    line-height: 1em !important;
    margin-bottom: 0 !important;
  }

  .printsmall table tr td.frac {
    font-size:16pt !important;
    white-space:nowrap
  }
  .title {
    margin:  0;
  }

  .medium-1 {
    width: 8.33333%;
  }

  .medium-2 {
    width: 16.66667%;
  }

  .medium-3 {
    width: 25%;
  }

  .medium-4 {
    width: 33.33333%;
  }

  .medium-5 {
    width: 41.66667%;
  }

  .medium-6 {
    width: 50%;
  }

  .medium-7 {
    width: 58.33333%;
  }

  .medium-8 {
    width: 66.66667%;
  }

  .medium-9 {
    width: 75%;
  }

  .medium-10 {
    width: 83.33333%;
  }

  .medium-11 {
    width: 91.66667%;
  }

  .medium-12,
  .medium-8.printspecs
   {
    width: 100% !important;
  }

  .noprint,
  .hide-for-print {
    width:  0 !important;
    width:  0 !important;
    display:none !important;
    margin:  0 !important;
    padding: 0 !important;
  }

  .medium-4.specscol {
    width: 30%;
  }



}