html, body {
  background-color: #f7fafd;
  margin: 0;
}
html, body, p, td, input[type="text"],textarea, label, select, option, ul, li {
  /* TL Change */
  font-family: 'Helvetica Neue', Helvetica, Univers, Calibri, Geneva, sans-serif;
  color: #505050;
  line-height: 1.3em;
  font-weight:300;
  font-size: 13pt;
  /* End TL Change */
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  border: none;
}

.inner {
  margin-left: auto;
  margin-right: auto;
  width: 960px;
  height:100%;
}

#header {
  background-color: #f7fafd;
          box-shadow: 1px 7px 17px rgba(152, 152, 152, 0.51);
     -moz-box-shadow: 1px 7px 17px rgba(152, 152, 152, 0.51);
  -webkit-box-shadow: 1px 7px 17px rgba(152, 152, 152, 0.51);
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 100;
  margin: 0;
  padding: 0;
}

#header .inner {
/*  background: url('headerbkg3.jpg');
  background-repeat: no-repeat;
*/
  background-position: center center;
  background-color: #ffffff;
  height: 100px;
}

.content {
  margin-top: 170px;
  margin-bottom: 30px;
}
.maindiv {
  padding: 15px;
  background-color: #ffffff;
          box-shadow: 1px 1px 5px 1px rgba(102, 102, 102, 0.5);
     -moz-box-shadow: 1px 1px 5px 1px rgba(102, 102, 102, 0.5);
  -webkit-box-shadow: 1px 1px 5px 1px rgba(102, 102, 102, 0.5);
}
.maindiv h1 {
  font-size: 15pt;
  text-align: center;
}

.footnote h2 {
  font-size: 12pt;
  margin: 20px 0 5px;
}
.footnote p {
  font-size: 11pt;
  margin: 0px;
}

.button {
/* client says that does not work with IE, presumably an early version as OK with IE11
  background: linear-gradient(to bottom, #0066CC 0px, #1975D1 30%, #3284D6 70%, #4C93DB 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
  border: medium none;
          box-shadow: 1px 1px 4px rgba(50, 50, 50, 0.75);
     -moz-box-shadow: 1px 1px 4px rgba(50, 50, 50, 0.75);
  -webkit-box-shadow: 1px 1px 4px rgba(50, 50, 50, 0.75);
*/
  color: #FFFFFF !important;
  background-color: #004d99;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  /* TL Change */
  font-family: Geneva, sans-serif;
  font-weight:500;
  height: 35px;
  width: 90px;
  border-radius: 4px;
  -webkit-transition-duration: 0.2s; /* Safari */
  transition-duration: 0.2s;
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
  vertical-align:middle;
  padding: 0px 0px 0px 0px;
  /* End TL Change */
}

  /* TL Change */
.button:hover {
    background-color: #80A6CC;
    color: black;
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
 }
  /* End TL Change */


.grey.button {
  background: linear-gradient(to bottom, #E9E9E9 0px, #F0F0F0 1%, #F0F0F0 49%, #EDEDED 50%, #D8D8D8 51%, #D8D8D8 96%, #E1E1E1 98%, #E1E1E1 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
  color: #000000 !important;
}

table.main {
  width: 100%;
}

table.canvas {
  border-collapse: collapse;
  width: 100%;
}
table.canvas td {
  padding: 0px;
}

td.qtext,
td.msg {
  font-weight: bold;
  text-align: left;
  vertical-align: top;
  font-size: 1em;
  /* TL Change */
  padding-top:5px;
  /* TL Change */
}
td.msg {
  padding-bottom: 20px;
}

td.msg2 {
  font-weight: bold;
  text-align: left;
  vertical-align: top;
  font-size: 17pt;
}
td.msg2 {
  padding-bottom: 20px;
}

.note {
  font-style: italic;
  font-size: 95%;
  color: #666666;
  font-weight: normal;
  padding-top: 5px;
}

.qnotes {
  font-style: italic;
  font-size: 95%;
  color: #666666;
  font-weight: normal;
  padding-top: 5px;
   /* TL Change */
  font-family: 'Helvetica Neue', Helvetica, Univers, Calibri, Geneva, sans-serif;
  font-style:normal;  
  color: #505050;
  line-height: 1.3em;
  font-size: 13pt;  
  /* end TL Change */ 
}

.qtxt1 {
  font-weight: normal;
  padding: 5px 0px 8px 10px;
  /*TL change */
  font-weight:600;
  /* End TL Change */
}

div.qtxt1:hover {
/*  color: #00264c; */
  background-color: #f9efe5;
  border-radius: 5px;
}

.rowhd {
  font-weight: bold;
  padding: 5px 0px 5px 10px;
  color: #004d99;
  background-color: #e5eff9;
  padding: 5px 0px 5px 0px;
  /* TL Change */
  padding-left: 5px;
  border-radius: 5px;
  /* End TL Change */
}

.qtxt2 {
  font-style: italic;
  font-weight: normal;
  font-size: 90%;
}

.qtxt3 {
  font-weight: bold;
  font-size: 160%;
  color: #004d99;
  padding-bottom: 1em;
  /* TL Change */
  font-size: 200%;
  /* End TL Change */ 
}

.qtxt4 {
  font-weight: bold;
  font-size: 160%;
  color: #004d99;
  line-height: 110%;
}

.qtxt5 {
  font-weight: normal;
  text-align: left;
  vertical-align: top;
  font-size: 1em;
  padding-top:5px;
}

.qtxt6 {
  font-style: italic;
  font-weight: normal;
  background-color: #e5eff9;
  font-size: 90%;
}

.qtxt7 {
  font-weight: normal;
  background-color: #e5eff9;
  font-size: 90%;
}

.qtxt8 {
  font-weight:600;
  font-size: 140%;
/*  color: #004d99;*/
  padding: 15px 0px 0px 0px;
}

#TitleTxt {
  display: inline-block;
  padding: 30px 0px 0px 20px;
  width: 500px;
}

#TitleTxt p {
  font-weight: bold;
  font-size: 140%;
  color: #004d99;
  display: inline;
  /* TL Change */
  font-size: 160%;
  /* End TL Change */
}

#logo {
  padding: 2px 20px 2px 0px;
  float:right;
  height : 100%;
  position:relative;
}

td.qerror {
  color: #c80000;
  font-weight: normal;
  font-size: 86%;
  background-image: url('RouteError.gif');
  background-repeat: no-repeat;
  background-position: 0px 5px;
  padding: 10px 0px 0px 30px;
}

td.qbody {
  padding-top: 10px;
  padding-bottom: 20px;
}

table.canvas td.hv {
/*  padding-top: 1px; */
  padding-bottom: 4px;
  /* TL Change */
  vertical-align:top;
  padding-top:7px;
  /* End TL Change */
}
table.canvas td.hv label {
  font-size: 1em;
  padding-left: 10px;
}

.cgrid td.colheading,
.cgrid td.cell,
.cgrid td.cell_error {
  width: 80px;
  padding-left: 3px;
  padding-right: 3px;
  text-align: center;
  /* TL Change */
  vertical-align:top;
  font-size:12px;
  padding-bottom:5px;
  padding-top:5px;
  /* End TL Change */
}

.cgrid td.hvcell {
  background-color: #f7fafd;
}

.cgrid .even td.hvcell ,
.cgrid .odd td.hvcell {
  background-color: #e5eff9;
  border-radius: 7px;
}


input[type="text"], textarea {
  width: 50%;
  padding: 2px;
  margin: 0px;
          box-sizing: border-box;
     -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}


table.navbar {
  width: 100%;
}
table.navbar .button,
table.navbar_small .button {
  width: 100px;
  height: 30px;
  text-align: center;
}
table.navbar .button {
  margin-right: 20px;
}
td.prog {
  width: 180px;
}

table.navbar_small {
  display: none;
  width: auto;
  margin: auto;
}
table.navbar_small td {
  text-align: center;
}
table.navbar_small td.prog0,
table.navbar_small td.prog,
table.navbar_small td.prog100 {
  padding-top: 10px;
}
table.navbar_small .button {
  margin-left: 5px;
  margin-right: 5px;
}

.progcell {
  background-color: #f7fafd;
}

td.prog0,
td.prog100 {
  font-size: 9pt;
  width: 40px;
}
td.prog0 {
  text-align: right !important;
}
td.prog100 {
  text-align: left !important;
}

table.progbar {
          box-shadow: 1px 1px 4px rgba(50, 50, 50, 0.75);
     -moz-box-shadow: 1px 1px 4px rgba(50, 50, 50, 0.75);
  -webkit-box-shadow: 1px 1px 4px rgba(50, 50, 50, 0.75);
}

div#copyright {
  font-size: 10pt;
  font-weight: normal;
  padding-top: 10px;
  text-align: right;
  color: #666666;
}
div#copyright a,
div#copyright a:visited {
  text-decoration: none;
  color: #666666;
}
div#copyright a:hover,
div#copyright a:active {
  text-decoration: none;
  color: #1C1F26;
}

.norm {
  font-weight: normal;
}
.ff {
  font-family: monospace;
}

div.stop {
  text-align: right;
  padding-top: 10px;
}

/* ----- */

/*
.canvas input,
.canvas label {
  vertical-align: middle;
}

ul {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 9pt;
  color: #333333;
  font-weight: bold;
  padding-top: 1em;
}
*/
li {
  padding-top: 2px;
  padding-bottom: 2px;
}

/*
a:link,
a:visited,
a:active {
  text-decoration: underline;
}
a:link {
  color: #333333;
}
a:visited {
  color: #666666;
}
a:active,
a:hover {
  color: #c80000;
}

table#maindiv {
  background-color: white;
  color: #333333;
  width: 100%;
  border: none;
  border-collapse: collapse;
}
*/
td#questions {
  padding: 1em;
}
td#bot1 {
  background-color: #010066;
  text-align: left;
  padding: 0;
}

td.pgtit_m {
  font-size: 16px;
  font-weight: bold;
  color: #c80000;
  padding-bottom: 1em;
}
td.pgtit {
  font-size: 16px;
  font-weight: bold;
  color: #c80000;
  padding-bottom: 1em;
  text-decoration: underline;
}
td.mtext {
  padding-top: 1em;
  padding-bottom: 0.5em;
  text-align: right;
  vertical-align: top;
  color: red;
  font-weight: bold;
  font-size: 10pt;
}
td.colheading,
div.colheading {
  text-align: center;
  color: #696969;
  font-weight: bold;
  font-size: 12pt;
}
td.colheading2,
div.colheading2 {
  text-align: center;
  color: #333333;
  font-size: 8pt;
}
td.rowheading {
  text-align: left;
  font-weight: normal;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  /* TL change */
  padding-left: 5px !important;
  /* End TL Change */
}

span.nobtn {
  border: 2px solid white;
  width: 190px;
  display: block;
}

.btn a:link,
.btn a:visited {
  margin-left: auto;
  margin-right: auto;
}
img.tooltipimg {
  padding-left: 0.5em;
  padding-right: 0.5em;
  vertical-align: middle;
}

td.perror {
  padding: 0px 0px 1em 0px;
}
div.perror {
  padding: 0.5em;
  font-weight: bold;
  font-style: italic;
  color: #c80000;
  border: 1px solid #c80000;
  background-color: #ffdddd;
}
/*
td.qerror,
div.qerror {
  font-weight: bold;
  color: #c80000;
}
*/
td.cell_error,
td.bgrow1_error,
td.bgrow2_error {
  border: 1px solid #c80000;
  background-color: #ffdddd;
  color: #c80000;
}
td.input_error input,
td.cell_error input,
td.bgrow1_error input,
td.bgrow2_error input,
input.error {
  background-color: #ffdddd;
  color: #c80000;
  border-color: #c80000;
}

td.bgrow1 {
  background-color: #eeeeee;
  border: 1px solid #A9A9A9;
  font-size: 8pt;
  padding-bottom: 10px;
  padding-top: 10px;
}
td.bgrow2 {
  background-color: #ffffff;
  border: 1px solid #A9A9A9;
  font-size: 8pt;
  padding-bottom: 10px;
  padding-top: 10px;

}

.border {
/*  border: 1px solid #c80000;*/
  border-right: none;
  border-left: none;
  padding: 10px;
  padding-bottom: 0px;
  text-align: center;
  font-weight: bold;
  color: #c80000;
  font-variant: small-caps;
  font-size: 14px;
}

.btn a:link,
td#navprv a:link,
td#navnxt a:link,
.btn a:visited,
td#navprv a:visited,
td#navnxt a:visited {
  border-left: 2px solid #aaaaaa;
  border-top: 2px solid #aaaaaa;
  border-right: 2px solid #666666;
  border-bottom: 2px solid #666666;
  width: 190px;
  display: block;
  background-color: #cceaee;
  color: #666666;
  text-align: center;
  text-decoration: none;
  padding-top: 3px;
  padding-bottom: 3px;
  font-weight: bold;
}
.btn a:hover,
td#navprv a:hover,
td#navnxt a:hover,
.btn a:active,
td#navprv a:active,
td#navnxt a:active {
  border-left: 2px solid #666666;
  border-top: 2px solid #666666;
  border-right: 2px solid #aaaaaa;
  border-bottom: 2px solid #aaaaaa;
  background-color: #eeccd9;
  color: #ee3333;
}

.inc {
  font-weight: bold;
}

.fwn {
  font-weight: normal;
}

/*
.small{
  font-size: 8pt;
  font-style: italic;
  font-weight: normal;
}
*/

.small { display: none; }

.bd {
  font-weight: bold;
}

.feedback {
  color: #0F7F7F;
  font-weight: bold;
  text-align: center;
  font-size: 10pt;
}


table.canvas tr:hover td.rowheading,
table.canvas td.hv label:hover {
  background-color: #e5eff9;
}


.evalqtxt {
  background-color: #e5eff9;
  padding-bottom: 4px;
  padding-top: 4px;
  /* TL Change */
  padding-left: 5px;
  border-radius: 5px;
  /* End TL Change */
}

.even {background-color: #f7fafd;}
.odd  {background-color: #fdfaf7;}

table.canvas tr.odd:hover td.rowheading {
  background-color: #e5eff9;
  border-radius: 5px;
}

table.canvas tr.even:hover td.rowheading {
  border-radius: 5px;
}

table.canvas td.cell.hvg{
 text-align: center;
}

table.canvas td.cell.hvg:hover{
   background-color: #e5eff9;
   border-radius: 25px;
}

tr.bgrow1 {
  background-color: #eeeeee;
}

.qtext b {
  text-decoration: underline;
  color: #c80000;
}

.colheadings {
  border-top: 1px solid #696969;
}
.colheadings td.colheading {
  background-color: #696969;
  color: #ffffff;
}
.rowspanheading {
  border-top: 1px solid #696969;
  text-align: center;
  font-size: 10pt;
}

#canvas_q31 input, #canvas_q32 input { width:auto; margin:4px; width:60px;}

@media screen and (max-width: 1024px) {
  #header { background-color: #ffffff; }
  #header .inner { background-position: right center; }
  .inner { width: 100%; }
  .content { margin-top: 0; }
  .content .maindiv { padding-top: 180px; }
  div#copyright { text-align: center; }
}

@media screen and (max-width: 960px) {
  #header .inner { background-position: left center; 
    height: 45px;
    background-size: cover;
  }
  #logo {
    padding: 2px 5px 2px 0px;
    float:right;
    height: 60px;
    position:relative;
  }
  #TitleTxt p {
    font-weight: bold;
    font-size: 100%;
    color: #004d99;
    display: inline;
  }

  #TitleTxt {
   display: inline-block;
   padding: 17px 0px 0px 35px;
   width:350px;
  }
.qtxt3 {
  font-weight: bold;
  font-size: 160%;
  color: #004d99;
  padding-bottom: 1em;
  /* TL Change */
  font-size: 200%;
  /* End TL Change */
}

}

@media screen and (max-width: 480px), screen and (max-height: 360px) {
  #header .inner { background-position: left center; 
    height: 45px;
    background-size: cover;
  }
  #logo {
    padding: 2px 5px 2px 0px;
    float:right;
    height : 40px;
    position:relative;
  }
  #TitleTxt p {
    font-weight: bold;
    font-size: 80%;
    color: #004d99;
    display: inline;
  }

   #TitleTxt {
   display: inline-block;
   padding: 0px 0px 0px 10px;
   width: 150px;
  }
  .content { margin-top: 0; }
  .content .maindiv { padding: 90px 10px 10px 10px; }
  table.glogo td {
    padding-top: 10px;
  }

  html, body, p, td, input, label, select, option, ul, li {
    font-size: 12pt;
  }
  .note { font-size: 11pt; }

  div.start { text-align: center; }
.qtxt3 {
  font-weight: bold;
  font-size: 25px;
  color: #004d99;
  padding-bottom: 1em;
  /* TL Change */
  /* End TL Change */
}

}

@media screen and (max-width: 480px) {
  td.qtext, td.msg { text-align: justify; }
  table.canvas td.hv label { padding-left: 5px; }

  table.navbar { display: none; }
  table.navbar_small { display: table; }

  .note.small { display: block; }
  td.slider_left, td.slider_right { display: none; }
.qtxt3 {
  font-weight: bold;
  font-size: 20px;
  color: #004d99;
  padding-bottom: 1em;
}

}

.yellowbg {
  background-color:#ffff00;
  color: #004d99;
  font-style:italic;
  font-weight: normal;
}
