<html> <style type="text/css">{  }
// Keep these in step with any references in the JavaScript code.
//
// The stylesheet must be processable by resize_stylesheet.pl , 
// a Perl program which I use to generate size variants.


BODY  {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      background-color: white;
      }

P     {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

H1    {
      font-family: arial, helvetica, sans-serif;
      font-size: 16pt;
      }

H2    {
      font-family: arial, helvetica, sans-serif;
      font-size: 12pt;
      }

H3    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

UL    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

LI    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

DL    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

DT    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

DD    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold
      }

TH    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      }	
			
TD    {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      }

PRE   {
      font-family: courier;
      font-size: 10pt;
      background-color: F8F4FF /* 99FFFF */ ;
      }


/* Visibility. */

.visible 
      { 
      visibility:visible;
      }

.invisible 
      { 
      visibility:hidden;
      }
      /* Used to preset the images of ideal-pointing
         arrows invisible in image grids. We set them
         visible (and change their SRC attribute) 
         in JavaScript if the user clicks on that square.
      */


/* Info windows (opened by linking to a new browser window) */

.info-window-page-border
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      background-color: white;
/*
      background-color: white;      
      border-style: solid;
      border-width: thick;
      border-color: silver;
*/
      }
      

/* Navigation bars. */

.navigation-bar-row          
      {
      background: silver;
      }

.navigation-bar-cell          
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt; 
      font-weight: bold;
      text-align: center;
      }


/* Tables in data analysis. */

.input-table-row          
      {
      background: #a0a0c0;
      }

.input-table-title
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 12pt;
      text-align: left;
      }	

.input-field  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 8pt;
      text-align: left;
      }	
      /* Any cell holding an input field. */			

.input-field-label  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-align: left;
      }	
      /* Cell holding the legend to an input field. */


/* Tabulations and other data summaries. */

.tabulation-header  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-align: left;
      background: #a0a0c0;
      }	
      /* Cells holding the head (cell titles) of a tabulation table. */

.tabulation-body  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-align: right;
      background: #a0c0c0;
      }	
      /* Cells holding the main body of a tabulation table. */

.tabulation-body-left-aligned  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-align: left;
      background: #a0c0c0;
      }	
      /* Cells holding the main body of a tabulation table when
         the text must be left-aligned. 
      */

.tabulation-totals  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-align: right;
      background: #c0a0c0;
      }	
      /* Cells holding auxiliary results, such as the totals. */


/* Parts of a questionnaire in respondent view. */

.respondent-question-cell
      {
      text-align: left;
      }
      /* Cell holding a question in the outer table. */


/* Static grid cells. */

.respondent-static-grid-normal
      {
      background: white;
      }
      /* A normal white cell. */

.respondent-static-grid-unacceptable-0-clicked
      {
      background: #ffccff;
      }
      /* The first 'unacceptables' task. Pink. */

.respondent-static-grid-current-0-clicked
      {
      background: #ffff66;
      }
      /* The first 'current' task. Pale yellow. */

.respondent-static-grid-expected-0-clicked
      {
      background: #66ff99;
      }
      /* The first 'expected' task. Pale green. */

.respondent-static-grid-ideal-0-clicked
      {
      background: #66ff99;
      }
      /* The first ideal task. Pale green. */

.respondent-static-grid-long-question-text
      {
      font-size: 12px;
      }
      /* The class of a DIV which sets a smaller
         size for the long question text in a static
         grid. 
      */


/* Dynamic grid cells. */

.respondent-dynamic-grid-normal
      {
      background: white;
      }
      /* A grid for the respondent to fill in. */

.respondent-dynamic-grid-spend
      {
      color: red;
      background: white;
      }
      /* The cells with the "Spend" header and price changes down the
         left-hand column.
      */ 

.respondent-dynamic-grid-highlighted
      {
      background: yellow;
      }
      /* A cell indicating a starting position. */

.respondent-dynamic-grid-price
      {
      color: "#3300ff";
      }
      /* A cell containing a price. Unlike the other classes,
         this adds to the classes above rather than overriding
         them (it can be used in both normal and highlighted
         cells). */

.respondent-dynamic-grid-ignored
      {
      background: #cccccc;
      }
      /* A cell that's greyed out because its row is to be ignored. */

.respondent-dynamic-grid-trailed
      {
      background: #F1F1FF;
      }
      /* A cell that's in the trail. Only for image grids. */

.respondent-dynamic-grid-clicked
      {
      background: orange;
      }
      /* A cell that's been clicked and changed colour
         via JavaScript.
      */


.respondent-dynamic-grid-option-and-button-table
      {
      width: 100%; 
      cellspacing: 0;
      }
      /* The table containing a grid cell.
      */


.respondent-dynamic-grid-option-and-button-box-image-ideal
      {
      border-style: solid;
      border-width: medium;
      border-color: #ff9966;
      }
      /* Used in a DIV containing the table containing an ideal grid cell in image.
         This boxes it with a red border. 
      */

.respondent-dynamic-grid-image-brand-reminder-tail-letters
      {
      font-size: 6pt;
      }
      /* Used in a SPAN containing all but the first letter of a 
         brand-name reminder put in a grid cell, e.g. the "onda"
         of "Honda". 
         This makes the letters very small, but hopefully just
         large enough to read as a reminder.
      */

.respondent-dynamic-grid-image-extreme-names
      {
      background: #CCFF99;
      }
      /* Holds the names of the first and last
         attributes in an image grid.
      */


.respondent-brand-values-cell-light
      {
      background: #FFFFCC;
      }
      /* Alternate rows of a brand values question, to help
         guide the user's eye.
      */


/* Dynamic grid cells when the researcher creates concepts. */

.concept-creation-dynamic-grid-normal
      {
      background: silver;
      }
      /* A grid for concept creation. */

.concept-creation-dynamic-grid-middle-column
      {
      background: #a0a0c0;
      }
      /* The dark stripe down the "same" column of
         a concept-creation grid. 
      */

.concept-creation-dynamic-grid-clicked
      {
      background: lightblue;
      }
      /* A cell that's been clicked and changed colour
         via JavaScript.
      */


/* Grid summary cells. */

.grid-summary-normal
      {
      background: white;
      }


/* Submit buttons. */

.submit-button  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-align: left;
      }	


/* Failure and success messages. */

.error  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 12pt;
      font-weight: bold;
      color: red;
      }	

.success  
      {
      font-family: arial, helvetica, sans-serif;
      font-size: 12pt;
      font-weight: bold;
      color: green;
      }	


/* Tool tips. */

/* Default DOM tool tip style */

div.domTT {
    border: 1px solid #333333;
}

div.domTTCaption {
    font-family: serif;
    font-size: 12px;
    font-weight: bold;
    padding: 1px 2px;
    color: #FFFFFF;
    background-color: #333333;
}
/* This is the style we are using for the
   tooltip caption.
*/

div.domTTContent {
    font-size: 12px;
    font-family: sans-serif;
    padding: 3px 2px;
    background-color: #F1F1FF;
}
/* This is the style we are using for the
   tooltip text. Generally, that's derived
   from the long question name, for an
   attribute.
   Note that we might also use it, or something
   similar elsewhere, for text not in the
   tooltip, but appearing in a similar context,
   e.g. the text in a static grid.
   At present, that's class
  .respondent-static-grid-long-question-text.
*/


/* Classic tool tip style */

div.domTTClassic {
    border: 1px solid black;
    background-color: #FBF4D4;
}

div.domTTClassicCaption {
    font-family: serif;
    font-size: 12px;
    font-weight: bold;
    font-style: italic;
    padding: 1px 2px;
}

div.domTTClassicContent {
    font-size: 12px;
    font-family: Arial, sans-serif;
    padding: 1px 2px 0 2px;
}


/* Win9x tool tip style */

div.domTTWin {
  border: 2px outset #BFBFBF;
  background-color: #808080
}

div.domTTWinCaption {
  border: 0px solid #BFBFBF;
  border-width: 1px 1px 0px 1px;
  background-color: #00007F;
  padding: 2px;
  font-size: 12px;
  font-weight: bold;
  font-family: sans-serif;
  color: white;
}

div.domTTWinContent {
  border: 1px solid #BFBFBF;
}


/* Overlib tool tip style */

div.domTTOverlib {
    border: 1px solid #333366;
}

div.domTTOverlibCaption {
    font-family: Verdana, Helvetica;
    font-size: 12px;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #333366;
}

div.domTTOverlibContent {
    font-size: 12px;
    font-family: Verdana, Helvetica;
    padding: 2px;
    background-color: #F1F1FF;
}

div.domTTMenu {
  width: 150px;
  border: 2px outset #E6E6E6;
}

div.domTTMenuCaption {
  font-size: 12px;
  font-family: sans-serif;
  background-color: #E6E6E6;
}

div.domTTMenuContent {
  padding: 1px 0;
  background-color: #E6E6E6;
}

-->

</STYLE>
</HTML>
