@import "../bootstrap/scss/functions";
@import "../base/functions";
@import "../base/variables";
@import "../bootstrap/scss/variables";
@import "../base/mixins";
@import "../bootstrap/scss/mixins";


// Base
.thumbnail-calma {
	max-width: 320px;
}

.thumbnail-calma-figure {
	display: block;
	overflow: hidden;
}

.thumbnail-calma-image {
	width: 100%;
	transition: .3s;
	transform: scale(1.1);
}


// Spacing
* + .thumbnail-calma-title {
	margin-top: px-to-rem( 40px );
}

* + .thumbnail-calma-text {
	margin-top: px-to-rem( 20px );
}


// Contexts
.desktop {
	.thumbnail-calma:hover {
		.thumbnail-calma-image {
			transform: none;
		}
	}
}


// Media
@include media-breakpoint-up( xs ) {
	.thumbnail-calma {
		max-width: 100%;
	}
}