.topic {
	h1 {
		font-size: 28px;
		line-height: 24px;
		margin-bottom: 30px;

		> span {
			text-transform: uppercase;
			color: @gray-light;
			font-size: 12px;
			display: inline-block;
			margin-top: 8px;

			> span {
				vertical-align: middle;
				margin-right: 8px;
			}
		}
	}

	.posts {
		.icon {
			font-size: 17px;
			line-height: 17px;
			border-radius: 50%;
			min-width: 46px;
			min-height: 46px;
			margin-top: 2px;

			img {
				margin-right: 15px;
				width: 46px;
				height: 46px;
				border-radius: 50%;
			}
		}
	}

	.stats {
		width: 60px;
		float: left;
		margin-top: -5px;
	}

	.topic-main-buttons a.btn {
		margin-left: 20px;
	}

	.title {
		p {
			margin-bottom: 4px;
		}

		small {
			margin-top: 2px;
			display: block;

			color: @gray-light;

			strong {
				color: @gray-dark;
			}
		}
	}

	.content {
		margin-top: 20px;
		padding-bottom: 1px;
		margin-top: -43px;
		margin-left: 61px;
		word-wrap: break-word;
	}

	.moderator-tools {
		position: absolute;
		right: -5px;
		top: 0;
		font-size: 14px;
		
		a {
			color: @gray-light;
			outline: none;
			padding: 0.25em;

			&[role="menuitem"] {
				color: @gray-dark;
			}
		}

		// temporary until we build component toggling
		.favourite.btn-warning, .follow.btn-success {
			background: white !important;
			color: #333;
			&:hover {
				background: @brand-primary !important;
			}
		}
	}

	.tags {
		vertical-align: -40%;
	}

	h1 {
		.btn-group, .btn {
			margin-left: 15px;
		}

		.btn {
			background: @body-bg;
			text-transform: uppercase;
			font-weight: 600;
			box-shadow: none !important;
			font-size: 11px;
			color: @gray-light;
			padding: 0;
		}
	}

	@media (max-width: @screen-sm-max) {
		.content {
			margin-left: 0;
			margin-top: -10px;
		}

		.posts .icon {
			min-width: 0;
			min-height: 0;
			margin-top: -4px;

			img {
				width: 23px;
				height: 23px;
			}
		}
	}
}








.topic {
	&.deleted {
		-moz-opacity: 0.30;
		opacity: 0.30;
	}

	.posts {
		list-style-type: none;
		padding: 0;

		> li {
			position: relative;

			&.deleted {
				-moz-opacity: 0.30;
				opacity: 0.30;
			}
		}

		.post-content {
			ul {
				> li {
					list-style-type: disc;

					ul > li {
						list-style-type: circle;

						ul > li {
							list-style-type: square;
						}
					}
				}
			}

			> blockquote {
				> *:not(:first-child) {
					display: none;
				}

				> blockquote {
					display: block!important;
					> *:not(:first-child) {
						display: none;
					}
				}
			}

			> blockquote.uncollapsed {
				> *:not(:first-child) {
					display: block;
				}

				> blockquote {
					display: block!important;
					> *:not(:first-child) {
						display: block;
					}
				}
			}

			.toggle {
				padding: 0px 5px;
				border: 1px solid #e0e0e0;
				background: #fcfcfc;
				width: 50px;
				text-align: center;
				display:block!important;
			}

			pre {
				max-height: 350px;

				code {
					white-space: pre;
					word-wrap: normal;
				}
			}

			@media (max-width: @screen-sm-min) {
				pre {
					max-height: 250px;
				}
			}
		}
	}
}

.thread_active_users {
	a[data-uid] {
		img {
			border-radius: 50%;
			width: 20px;
			margin-right: -12px;
			vertical-align: middle;
		}

		&::after {
			.opacity(0);
			font-family: "FontAwesome";
			content: "\f11c";
			padding: 4px 0.25em;
			position: relative;
			top: 1px;
		}

		&.replying::after {
			.opacity(100);
		}
	}

	.anonymous-box {
		border: 1px solid #ddd;
		width: 24px;
		height: 24px;
		position: relative;
		text-align: center;
	}
}