.title {
	font-size: 130%;
	font-weight: bold;
	background-color: #dddddd;
}

.line::after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.label {
	float: left;
	font-weight: bold;
	width: 100px;
}

.value {
	float: left;
	width: 80%;
}

.value input,
.value textarea {
	width: 100%;
}

.value textarea {
	height: 200px;
}

.operation {
	border: 1px #000000 solid;
}

.operation::after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.operation button {
	float: right;
}

.explanation {
	font-weight: bold;
	font-size: 110%;
}

.property::after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.propertyName {
	float: left;
	font-weight: bold;
}

.previousValue, 
.newValue,
.targetSelector,
.targetValue {
	float: left;
	padding-left: 5px;
}

.newValue::before {
	float: left;
	content: " -> ";
	font-weight: bold;
	padding-right: 5px;
}

.targetValue::before {
	float: left;
	content: " = ";
	font-weight: bold;
	padding-right: 5px;
}

.copyOperation .selector,
.copyOperation .currentValue,
.copyOperation .updatedValue {
	float: left;
}

.copyOperation .selector {
	font-weight: bold;
}

.copyOperation .currentValue,
.copyOperation .updatedValue {
	padding-left: 5px;
}

.copyOperation .updatedValue::before {
	float: left;
	content: " -> ";
	font-weight: bold;
	padding-right: 5px;
}

.copyOperation::after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.addition .property .previousValue,
.addition .copyOperation .currentValue {
	display: none;
}

.log {
	color: #0000ff;
}

.error {
	color: #ff0000;
}