@import "base.less";

.review-item {
	padding: 4vw;
	line-height: 1.5;

	blockquote {
		padding: 0 0 0 1em;
		margin: 1em 0;
		border-left: rgba(255, 255, 255, 0.5) solid 2px;
	}

	.title {
		color: @titleColor;
		font-size: 5vw;
	}

	.info {
		color: @infoColor;
		margin: 2vw 0;

		>* {
			display: inline-block;
			vertical-align: middle;
			line-height: 6vw;
			font-size: 3.5vw;
			margin-right: 1.5vw;
		}

		.avatar {
			width: 6vw;
			height: 6vw;
			border-radius: 3vw;
		}
	}

	.content {
		margin-top: 4vw;
		font-size: 4vw;
		color: @contentColor;

		img {
			display: block;
			margin: 6vw auto;
			max-width: 100%;
			// margin: 0 auto;
		}
	}
}


@media screen and (min-width: 768px) {

	.review-item {

		.title {
			// color: @titleColor;
			font-size: 3.5vw;
		}

		.info {
			// color: @infoColor;
			margin: 1.5vw 0;

			>* {
				// display: inline-block;
				// vertical-align: middle;
				line-height: 4vw;
				font-size: 2.4vw;
				// margin-right: 1.5vw;
			}

			.avatar {
				width: 4vw;
				height: 4vw;
				border-radius: 2vw;
			}
		}

		.content {
			margin-top: 3vw;
			font-size: 2.6vw;
			// color: @contentColor;

			img {
				// display: block;
				// margin: 1em 0;
				// max-width: 100%;
				margin: 5vw auto;
			}
		}
	}
}