.component.item-card {
	width: auto;
	padding: $std-pd-sm;
	background-color: $color-bg-card-alt;
	box-sizing: border-box;
	border: 1px solid transparent;
	transition-duration: $trans-du;
	transition-property: border-color;

	@include media("max", "sm") {
		padding: $std-pd-xsm;
	}

	&.load-ready .thumbnail-img {
		opacity: 1;
	}

	&:hover {
		border-color: $color-primary;

		.hover-effect {
			opacity: 1;

			.mdi {
				left: 0;
			}	
		}
	}

	.info {
		font-size: $fsize-sm;

		.title {
			font-size: $fsize-lg;
			color: $color-primary;
		}

		.genres {
			margin: $std-mg-xsm 0;
		}
	}
}