/* ------------Jewellery collection style------------ */

.to-change-shape {
    cursor:pointer;
}

.mt-10-p-0
{
    margin-bottom: 0;
    margin-top: 10px
}

.jewellery-collection-text1 {
    font-size: 12px;
    color: #717171;
}

.collection-img	{
	/* width: 200px !important; */
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.collection-row {
	min-height: 240px !important;
}

/* For flip box */
.flip-container {
	/* -moz-transform: perspective(1000px);
	perspective: 1000px; */
}


/* flip the pane when hovered */
.flip-container.flip .flipper,
.flip-container:hover .flipper {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

.back,
.flip-container,
.front {
	/* width: 25rem;
	height: 18.75rem;*/
	/* width: 400px;
	height: 300px; */
}


/* flip speed goes here */
.flipper {
	-webkit-transition: 0.6s;
	-moz-transition: 0.6s;
	transition: 0.6s;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	position: relative;
	width: 100%;
	height: 100%;
	margin: 0;
}


/* hide back of pane during swap */
.back,
.front {
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* this part centers content*/
	display: flex;
	align-items: center;
	justify-content: center;
	.flipper-content {
	 display: block;
	}
}


/* front pane, placed above back */
.front {
	z-index: 2;
	/* for firefox 31 */
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	transform: rotateY(0deg);
	.bg-primary {
	 color: white;
	}
}


/* back, initially hidden pane */
.back {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
