.product-actions{
	display: none;
}
.MatrixCombinationsGroup{
	text-align:center;
	margin: 20px 0;
	background-color: transparent;
}
.MatrixCombinations{
	display: flex;
	flex-direction: column;
    max-width: 100%;
}
	#MatrixCombinations .thead{
		display: flex;
	    width: 100%;
	    flex-direction: row;
	    /*justify-content: center;*/
	    justify-content: flex-start;
	}
	#MatrixCombinations .tbody{
		display: flex;
	    width: 100%;
	    flex-direction: column;
	    /*align-items: center;*/
	    align-items: flex-start;
	}
		#MatrixCombinations .thead .tr{
			display: flex;
		    flex-direction: row;
		    width: 100%;
		    flex-wrap: nowrap;
		    justify-content: center;
		    align-items: stretch;
		}
		#MatrixCombinations .tbody .tr{
			display: flex;
    		flex-direction: row;
		}
		#MatrixCombinations .td{
			display: flex;
		    padding: 5px 10px;
		    flex-direction: column;
		    width: 100px;
		    align-items: center;
		    justify-content: flex-start;
		    flex-wrap: nowrap;
		}
			#MatrixCombinations .td small{
				float: left;
			    width: 100%;
			    margin: 2px 0;
			    font-size: 11px;
			    line-height: 13px;
			}
				#MatrixCombinations .tr .td span.color{
					display: inline-block;
					width:25px;
					height:25px;
					transition:all 150ms;
				}
					#MatrixCombinations .tr .td span.color img{
						width: 100%;
					}
				#MatrixCombinations .tr .td span.color:hover{
					border: 0 !important;
				}
				#MatrixCombinations .tr .td .combination-qty{
					width: 50px;
				    padding: 4px 15px;
				    font-size: 13px;
				    text-align: center;
				    border: 1px solid #000;
				    padding-right: 0;
				}
					#MatrixCombinations .tr .td input.combination-qty::-webkit-outer-spin-button,
					#MatrixCombinations .tr .td input.combination-qty::-webkit-inner-spin-button{
						-webkit-appearance: auto !important;
					}
				#MatrixCombinations .tr:nth-child(even){
					background-color: #FFFFFF;
				}
				#MatrixCombinations .tr:nth-child(odd){
					background-color: #EFEFEF;
				}

		#MatrixCombinations tr td small{
			float: left;
			width: 100%;
			font-size: 10px;
			line-height: 12px;
		}
	#MatrixCombinations tr td span.color{
		width:25px;
		height:25px;
		transition:all 150ms;
	}
		#MatrixCombinations tr td span.color img{
			width: 100%;
		}
	#MatrixCombinations tr td span.color:hover{
		border: 0 !important;
	}
	#MatrixCombinations tr td .combination-qty{
		width:40px;
		padding:4px;
		font-size:13px;
		text-align:center;
		border:1px solid #000;
	}
	.MatrixButtons{
		width: 100%;
		display: flex;
	    flex-direction: column;
	    align-items: center;
	}
	.comb-subtotal{
		width: 100%;
		font-size:16px;
		font-weight:600;
		color:#000;
	}
		.comb-subtotal i{
			font-style: normal;
		}
	.comb-subtotal span{
		float:right;
		width:100%;
		font-size:14px;
		font-weight:500;
		margin-bottom:5px;
	}
	#addMatrixToCart{
		display: flex;
	    margin-top: 10px;
	    flex-direction: row;
	    flex-wrap: nowrap;
	    justify-content: center;
	    align-items: center;
	}
	#MatrixCombinations .colorOut{
		float: none
	}
	
.MatrixCombinationsScroll{
	overflow-x: scroll;
}
	.MatrixCombinationsScroll::-webkit-scrollbar {
		height: 5px;
	}

	/* Track */
	.MatrixCombinationsScroll::-webkit-scrollbar-track {
	  background: #f1f1f1;
	}

	/* Handle */
	.MatrixCombinationsScroll::-webkit-scrollbar-thumb {
	  background: #888;
	}

	/* Handle on hover */
	.MatrixCombinationsScroll::-webkit-scrollbar-thumb:hover {
	  background: #555;
	}
.firstTd{
	position: sticky;
    z-index: 2;
    left: 0;
    background-color: #FFF;
}
	#MatrixCombinations .tr:nth-child(even) .firstTd{
		background-color: #FFFFFF;
	}
	#MatrixCombinations .tr:nth-child(odd) .firstTd{
	    background-color: #EFEFEF;
	}

#agregado{
	opacity: 0;
	transform: scale(0);
	color: #32c671;
	margin-top: 20px;
}
	#agregado.active{
		animation: aparecer 5s 1;
	}
	#agregado img{
		margin-right: 5px;
	}

	@keyframes aparecer{
		0%{
			opacity: 0;
			transform: scale(0);
		}
		10%{
			opacity: 1;
			transform: scale(1);
		}
		90%{
			opacity: 1;
		}
		100%{
			opacity: 0;
			transform: scale(1);
		}
	}

	@media only screen and (max-width: 767px) {
		#MatrixCombinations .td{
			font-size: 11px;
			/*width: 60px;*/
		}
		#MatrixCombinations .td small{
			line-height: 11px;
		}
		#MatrixCombinations .tr .td .combination-qty{
			width: 30px;
			padding: 1px;
		}
		.scrollMobile .thead, .scrollMobile .tbody{
			/*width: 2000px !important;*/
		}
		#agregado{
			font-size: 14px;
		}
	}

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 30px;
}
.lds-ellipsis span {
  position: absolute;
  top: 10px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis span:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis span:nth-child(2) {
  left: 0px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis span:nth-child(3) {
  left: 16px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis span:nth-child(4) {
  left: 32px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}