.model-block {
    padding: 10px;
    margin: 10px;
    border: 1px solid black;
}

.card-flip{
    perspective: 1000px;
}

.model-picture {
    width: 100%;
    height: auto;
    max-height: 100%;
}

.card-settings {
    height: 200px;
    width: 200px;
    border: 1px solid black;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}


.flip-card-front,
.flip-card-back {
    height: 100%;
    width: 100%;
    transform-style: preserve-3d;
    transition: all 0.6s ease 0s;
    position :absolute;
}

.flip-card-front {
    left : 0px;
    top: 0px;
    transform: rotateY(0deg);
    z-index: 2;
    background-color: #bbb;
    color: black;
    backface-visibility: hidden;
}

.flip-card-back {
    background-color: #2980b9;
    color: white;
    font-size: 0.92rem;
    padding: 5px;
    backface-visibility: hidden;
    left: 0px;
    top: 0px;
    transform: rotateY(-180deg);
    
}

.card-btn-container {
    position: relative;
    height: 50px;
    display: flex;
    justify-content: space-between;
}



.user-buttons{
    display: flex;
    justify-content: space-between;
}

.model-like {
    width: 30px;
    height: auto;
}

.model-like-true{
    color : red;
}

.add-cart-model{
    cursor: pointer;
    width: 30px;
    height: 30px;
}

.cart-add-card:hover .addtip {
    visibility: visible;
}

.valid-mod-btn:hover{
    color: rgb(22, 191, 22);
}

/* Flip card */


.card-inner{
    height: 100%;
    width: 100%;
    position: relative;
    transition:  transform 0.6s;
    transform-style: preserve-3d;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.turned{
    transform: rotateY(180deg);
}

.cards-btn{
    border: 0;
    outline: 0;
    background-color: transparent;
    cursor: pointer;
    position: relative;
}

.like-card-btn:hover .liketip {
    visibility: visible;
}

.update-rm-btn{
    width: 30px;
    height: 30px;
}

.contact {
    position: relative;
  }
  
  .contact:hover .message-tip {
    visibility: visible;
  }

  .tooltip {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
  }
  
  
  
  .contact-icon {
    cursor: pointer;
    width: 30px;
    height: 30px;
  }


  /*Sar rating */
.user-rate-container {
    display: flex;
    font-size: 0.7rem;
}

  .rating-stars {
	display: block;
	width: 70%;
	padding: 0.3vmin;
	background: linear-gradient(60deg, #ffffff90 50vmin, #fff0 40vmin 100%);
	border-radius: 5vmin;
    max-height: 20px;
	position: relative;
    margin: 10px;
}

.radio-rating { display: none; }

.label-rating {
	width: 1.2vmin;
	height: 1.2vmin;
	background: #000b;
	display: inline-flex;
	cursor: pointer;
	margin: 0.2vmin 0.3vmin;
	transition: all 1s ease 0s;	
	clip-path: polygon(50% 0%, 66% 32%, 100% 38%, 78% 64%, 83% 100%, 50% 83%, 17% 100%, 22% 64%, 0 38%, 34% 32%);
}

.star-hidden {
    display: none;
}

.label-rating:before {
	width: 90%;
	height: 90%;
	content: "";
	background: orange;
	z-index: -1;
	display: block;
	margin-left: 5%;
	margin-top: 5%;
	clip-path: polygon(50% 0%, 66% 32%, 100% 38%, 78% 64%, 83% 100%, 50% 83%, 17% 100%, 22% 64%, 0 38%, 34% 32%);
	background: linear-gradient(90deg, yellow, orange 30% 50%, #184580 50%, 70%, #173a75 100%);
	background-size: 205% 100%;
	background-position: 0 0;
}

.label-rating:hover:before {
	transition: all 0.25s ease 0s;		
}

.radio-rating:checked + .label-rating ~ .label-rating:before {
	background-position: 100% 0;
	transition: all 0.25s ease 0s;	
}

.radio-rating:checked + .label-rating ~ .label-rating:hover:before {
	background-position: 0% 0
}

.label-rating + .radio-rating:checked ~ .rating-counter:before {
	color: #ffab00 !important;
	transition: all 0.25s ease 0s;
}

.label-rating:hover ~ .rating-counter:before {
	color: #9aacc6 !important;
	transition: all 0.5s ease 0s;	
	animation: pulse 1s ease 0s infinite;
}

@keyframes pulse {
	  50% { font-size: 6.25vmin; }
}

.radio-rating:checked:hover ~ .rating-counter:before {
	animation: none !important;
	color: #ffab00 !important ;
}