/* Positioning */
html, body					{ margin: 4px 4px; padding:0; }
p							{ position:relative; width:100%; height:2px; padding:0px; }
/* .commentLine				{ position:absolute; left:0px; } */
/* .labelField					{ position:absolute; left:0px; } */
/* .opcodeField 				{ position:absolute; left:56px; } */
/* .operandField				{ position:absolute; left:96px; } */
/* .commentField				{ position:absolute; left:232px; } */
.commentLine				{ position:absolute; left:50px; }
.labelField					{ position:absolute; left:50px; }
.opcodeField 				{ position:absolute; left:106px; }
.operandField				{ position:absolute; left:146px; }
.commentField				{ position:absolute; left:282px; }
span a						{ padding:0; margin:0; }
span						{ padding:0; margin:0; }

/* Text Format */
html, body, p				{ font-size: 13px; font-family: monospace; font-style:normal; }
span.operandField a			{ text-decoration:none; }

/* Tool Tips */
.tooltip {
	cursor: help;
	position: relative;
}

.tooltip span[rel=tooltip] {
	display: none;
}

.tooltip:hover span[rel=tooltip] {
	display: block;
	position: absolute;
	left: -5em;
	width: 35em;
	padding: 0.5em;
	z-index: 100;
	color: #000;
	background-color: white;
	border: solid 1px #000000;
	border-radius: 0.2em;
}

dfn.tooltip {font-style: normal; }
dfn.tooltip span[rel=tooltip] span.big { font-size:16px; }

/* Coloring */
span.operandField a,				
.operandSymbol, 				
.operandComponentSymbolReference,
.toolTipSymbol										{ color:#00BFFF; } /*#7AD9FF*/
.locationCounterField,
.toolTipLocationCounter								{ color:#FFA700; } 
.labelField, .toolTipLabel							{ color:#0034FF; }
.opcodeField, .toolTipOpcode						{ color:#800000; }
.commentField, .commentLine, .toolTipComment		{ color:#008000; }
.operandCharacterString,
.operandSignedCharacterString,
.operandFileNameReference,
.operandComponentCharacterString					{ color:#FF00FF; }
.operandCruBitAddress 								{ color:orange; }
.operandCruBitDisplacement 							{ color:orange; }
/*.operandExpression 									{ background-color:#FFFAFA; }*/
.operandGeneralAddress, .toolTipGeneralAddress 		{ color:#FFA07A; }
.operandImmediateValue , .toolTipImmediateValue		{ color:#FF8C00; }
.operandShiftCount 									{ color:#FF8C00; }
.operandWorkspaceRegister, .toolTipWorkspaceRegister				
.operandGeneralAddressWorkspaceRegister,						
.operandGeneralAddressIndirectWorkspaceRegister,				
.operandGeneralAddressIndirectWorkspaceRegisterAutoIncrement,
.indexedMemoryWorkSpaceRegister						{ color:#0000CD; }
.operandGeneralAddressSymbolicMemory				{ }
.operandGeneralAddressIndexedMemory					{ }
.operandXop											{ color:#FF8C00; } 
.operandComponentIntegerDecimal						{ color:#FF8C00; }
.operandComponentIntegerHexadecimal					{ color:#FFA700; }
.operandComponentParenthesis						{ color:#DC143C; }
.operandComponentSimpleSymbolReference				{ color:#FF8C00; }
.operandOperator									{ color:#0000FF; }


#showLocationCounter:not(:checked) ~ p .locationCounterField {
  display: none;
}

#showCommentField:not(:checked) ~ p .commentField {
  display: none;
}

#showCommentLine:not(:checked) ~ p .commentLine {
  display: none;
}


*, *::before, *::after {
  box-sizing: border-box;
}

html {
  min-height: 100%;
}

input {
  position: absolute;
  left: -9999px;
  display:none;
}

label {
  display: block;
  position: fixed;
  right:20px;
  margin: 20px;
  width: 280px;
  padding: 15px 30px 15px 62px;
  border: 3px solid #fff;
  border-radius: 100px;
  background-color: #ab576c;
  font: 1.4em/1 'Noto Sans', sans-serif;
  color: #fff;
  box-shadow: 0 0 20px rgba(0, 0, 0, .2);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: background-color .2s, box-shadow .2s;
}

label[for=showLocationCounter]
{
	top:10px;
}
label[for=showCommentField]
{
	top:80px;
}
label[for=showCommentLine]
{
	top:150px;
}

label::before {
  content: '';
  display: block;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  width: 32px;
  border: 3px solid #fff;
  border-radius: 100px;
  transition: background-color .2s;
}

label:hover, input:focus + label {
  box-shadow: 0 0 20px rgba(0, 0, 0, .6);
}

input:checked + label {
  background-color: #6a8494;
}

input:checked + label::before {
  background-color: #fff;
}