﻿/* canvas.css is based on lots of things   */
/* but unlike myskeleton.css where html    */
/* is set to 62.5%, all REM measurements   */
/* are standard ...                        */
/* so don't include both in the same HTML! */
html, body {
    min-height:101%;
}
body {
    font-family:'Segoe UI'; 
    margin-left:0px; 
    margin-top:0px;
    margin-bottom:0px;
    margin-right:0px;
    font-weight:200; 
    color: #191919;            /* my dark grey font color for text */
}
h1, h3 {
    margin-top: 0;
    margin-bottom: 1.5rem;
    color: #662999;           /* my dark purple font color for headings */
}
@media (min-width: 750px) {
    h1 {
        font-size: 3.0rem;
        font-weight: 400;
    }

    h3 {
        font-size: 2.0rem;
        font-weight: 300;
    }
}
.disablePanZoom {
    -ms-touch-action: none; /* Shunt all pointer events to JavaScript code. */
}
#Dheader {  
    font-family:"Segoe UI";
    font-size:32px;
    font-weight:400;
    color: #662999; 
}
#Dform {  
    font-family:"Segoe UI";
    font-size:18px;
    font-weight:300;
}
#IDchecklist {
    font-family:"Segoe UI";
    color: #662999;
    font-size:14px;
    font-weight:300;
}
checkbox {
    color:lightgray;
    font-family:"Segoe UI";
    font-size:12px;
    font-weight:200;
    vertical-align: text-top
}
#Dcb1 { 
    position:absolute;
    top:16px; 
    left:240px;}
#Dcb2 {
    position:absolute;
    top:16px; 
    left:366px;}
#Dcb3 {
    position:absolute;
    top:16px; 
    left:486px;}
#Dcb8 {
    position:absolute;
    top:16px; 
    left:600px;}
#Dcb4 { 
    position:absolute;
    top:16px; 
    left:758px;}
#Dcb5 {
    position:absolute;
    top:16px; 
    left:910px;
    color:lightblue;
}
#Dcb6 {
    position:absolute;
    top:16px; 
    left: 990px;
    color:lightblue;
}
#Dcb7 { 
    position:absolute;
    top:16px; 
    left:1200px;}
#Dcb9 { 
    position:absolute;
    top:16px; 
    left:1374px;}
#Dcb10 { }

#theList {
    font-family:"Courier New";
    font-size:16px;
}

button {  
    margin: 10px 0px 6px 0px;
    font-family: "Segoe UI";
    font-weight: 300;
    font-size: 1.6rem;
    padding: 3px 6px 3px 6px;
    color: #fff;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 7px;
    background: #662999;   /* for browsers that do not support gradients */
    background: linear-gradient(#662999,#592680);
}
button:hover,
button:focus {
    background: #AA6ADA;   /* for browsers that do not support gradients */
    background: linear-gradient(#aa6ada, #6a3791);
}

input[type=text] {
  height:36px;
  cursor: text;
  width: 194px;
  font-family:"Segoe UI";
  font-size: 18px;
}
.Bnew {
  position:absolute;
  width: 200px;
  height:42px;
  left:1420px;
  top:40px;
  font-size: 24px;
}
.Bsave {
  width: 200px;
  height:42px;
  position:absolute;
  left:1420px;
  top:88px;
  font-size: 24px;
}
.Ifname {
    position: absolute;
    top: 148px;
    border-radius: 7px;
    left: 1420px;
}
.IfnameHidden{
  visibility: hidden;
}
.Uready {
  position:absolute;
  left:1464px;
  top: 148px;
}
select.maturityList {
  height:36px;
  width: 140px;
  cursor: text;
  font-size: 20px;
  font-family:"Segoe UI";
}
textarea.addInfo {
 font-size: 16px;
}
#B0, #B1,  #B2, #B3, #B4 {
   width: 244px;
}
#TB1, #TB2, #TB3 {
    font-size: 14px;
    font-weight: 300;
    width: 244px;
    height: 30px;
    text-align:left;
    background:darkgray;
}
#TB1:hover, #TB2:hover, #TB3:hover {
    background: #501080;
    background: linear-gradient(#501080 0%,#280050 100%);
}
.BFspanFormat {
  text-align: left;
  display: table-cell;
}
#FTtable {
    text-align: left;
    font-size: 12px;
    font-weight: 300;
    color:#280050;
}
#Ffilter {
    font-family:"Segoe UI";
    font-size:20px;
    font-weight:400;
    width: 300px;
    height: 40px;  	
    padding: 2px 8px 4px 8px;
    color:#fff;
    line-height: 40px;
    cursor: default;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    border-radius:7px;
/*    -webkit-user-select: none;
 *    -moz-user-select: none;
 *    -ms-user-select: none;
 *     user-select: none;
 */
}

#textarea{
    display:none;
}

textarea {
          min-height: 65px;
         padding-top: 6px;
      padding-bottom: 6px; }

textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }

label, legend {
  display: inline;
  margin-bottom: .5rem;
  font-weight: 200; }

fieldset {
  padding: 0;
  border-width: 0; }

.summaryFont {
    font-family:"Segoe UI Light";
    font-size:16px;
    font-weight:300;
    color:#002060;
    background: #FFFFFF;
    margin: 0px 0px; 
    padding: 6px 6px 6px 6px;
}
.summaryWHY {
    font-family:"Segoe UI Light";
    font-size:20px;
    font-weight:400;
    border:solid #7030A0; 
    background:#7030A0;
    padding: 6px 6px 6px 6px;
}
.summaryWHAT {
    font-family:"Segoe UI Light";
    font-size:20px;
    font-weight:400;
    border:solid #2BB3C5; 
    background: #2BB3C5;
    padding: 6px 6px 6px 6px;
}
.summaryHOW {
    font-family:"Segoe UI Light";
    font-size:20px;
    font-weight:400;
    border:solid #000086; 
    background:#000086;
    padding: 6px 6px 6px 6px;
}
.summaryC1{
color:white; 
height:4px; 
width:60px;
}
.summaryC2 {
color:white; 
height:4px; 
width:840px;
}