/*
 * Tarifs
 */
 .tarifs {
    font-family: "Open Sans", Helvetica, sans-serif;
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow-x: hidden;
    font-size: small;
    padding: 0em 0 4em 0;
  }
  .tarifs_toogle_activite {
	color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .tarifs_toggle {
    color: hsl(234, 14%, 74%);
    display: flex;
    align-items: center;
  }
  .tarifs_card {
    background: #fff;
    color: hsl(233, 13%, 49%);
    border-radius: 0.8rem;
	max-width: 25%;
	box-shadow: 3px 3px 4px 2px rgba(0, 0, 0, 0.4);
  }

  .tarifs_card:hover {
  	box-shadow: 10px 10px 20px 6px rgba(0, 0, 0, .2) !important;
  }

  .tarifs_cards {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 90%;

        .tarifs_card.active {
            background: rgb(103, 151, 255);
            color: #fff;
            align-items: center;
            transform: scale(1.1);
            z-index: 1;
            font-size: small !important;
            overflow: hidden;
            display: table;
        }
        .shadow {
            box-shadow: -5px 5px 15px 1px rgba(0, 0, 0, 0.1);
        }
    }
    
  .tarifs_ul {
    margin: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    padding: 0;
    list-style: none !important;
  }
  .price {
    font-size: 3rem !important;
    color: hsl(232, 13%, 33%);
    padding-bottom: 2rem !important;
  }
  /*
  .shadow {
    box-shadow: -5px 5px 15px 1px rgba(0, 0, 0, 0.1);
  }
	*/
  .tarifs_card.active .price {
    color: #fff;
  }
/*
  .sku-item.even .tips[data-v-7ab5a9ca] {
    display: block;
  }
*/
.tips {
	position: absolute;
    top: 35px;
    right: -40px;
    font-size: small;
    line-height: 32px;
    background: #ff6464;
    color: #fff;
    width: auto;
    transform: rotate(45deg);
    padding: 0 30px 0 30px;
}

body.is-mobile .tarifs_cards {
	display: grid;
	border-radius: 4%;
}
body.is-mobile .tarifs_card {
	min-width: max-content;
	margin: 0 0 2em 0;
}
body.is-mobile .tarifs_card.active {
	transform: unset !important;
}
body.is-mobile .tips {
	display: none;
}

@media (max-width: 280px) {
	.tarifs_toggle {
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		align-items: center;
		height: 80px;
	}
	.tarifs_cards {
		margin: 0;
		display: flex;
		flex-direction: column;
	}
	.tarifs_card {
		transform: scale(0.8);
		margin-bottom: 1rem;
	}
	.tarifs_cards .tarifs_card.active {
		transform: scale(0.8);
	}
}