/*
 * Style settings for the mobile / small screen version of the cross table
 */


/*
 * Some stuff to make it more responsive
 */

@viewport{
    zoom: 1.0;
    width: extend-to-zoom;
}

body {
  margin:		0px;
  width:		100%;
  font-size:		100%;
}

/*
 *
 */

#mxtb_cntrl_0 {
  height:               20px;
  width:                100%;
}

#mxtb_cntrl_0 a {
  color:                #3e3e3e;
  text-decoration:      none;
}


/*
 * The header picker/selector
 */

#mxtb_hdrsel_0 {
  overflow-x:		hidden;
  overflow-y:		auto;
}

/*
 * The mobile crosstable data columns
 */

#mxtb_0 {
  overflow-x:		hidden;
  overflow-y:		auto;
}

/*
 * The individual column table that shows all the data for the selected header
 */

table.mxtb_col {
  background-color:	white;
  border:		1px solid #3e3e3e;
  border-collapse:	collapse;
  table-layout:		fixed;
  text-align:		right;
  color:		black;
  font-family:		'Helvetica', Arial, Verdana, sans-serif; 
  font-size:		100%;
  width:		100%;
}

/*
 * The left side header cell for the column table
 */

table.mxtb_col th {
  background-color:	#e1e1e1;
  border:		1px solid #3e3e3e;
  color:		black;
  font-weight:		bold;
  padding:		5px;
  vertical-align:	middle;
}

/*
 * The right side data cell for the column table
 */

table.mxtb_col td {
  border:		1px solid #3e3e3e; 
  background-color:	white;
  color:		black;
  font-style:		italic;	
  padding:		0px;
  vertical-align:	middle;
  text-align:		center;
}

/*
 * Comment cell for data in the column table
 */

table.mxtb_col td.comment {
  background-color:	yellow;
  font-size:		75%;
}

/*
 * Display style for the list of header divs in the header picker
 */

div.mxtb_hdr {
  width:		100%;
  border:		1px solid black;
  background-color:	white;
  color:		black;
  font-family:		'Helvetica', Arial, Verdana, sans-serif; 
  font-weight:		bold;
  font-size:		100%;
  text-align:		center;
  vertical-align:	middle;
}

/*
 * Style modification to show the selected header in the picker
 */

div.mxtb_hdr_sel {
  background-color:	#008dc9;	
  color:		white;
}