.slider-control-wrapper{
	display: grid;
	grid-template-columns: min-content auto min-content;
	grid-gap: .5rem;
	align-items: center;
	}

.slider-wrapper{
	margin-top: 1.5rem;
	padding: 0 5%;
	}

.toggle-content-wrapper .slider-wrapper{
	padding: 0;
	}

.slider-wrapper .label{
	padding: .4rem 0;
	}	

/* SLIDERS ----------------------- */

/* bar */
.slider {
  	-webkit-appearance: none;
  	width: 100%;
  	margin: 2% 0;
  	height: .75rem;
  	border-radius: 5px;  
  	background: #CCC;
  	outline: none;
  	opacity: 1;
  	-webkit-transition: .2s;
  	transition: opacity .2s;
	}

/* thumb (handle)
IMPORTANT: Webkit prefix can't be comma separated to combine */
.slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%; 
	background: var( --asu-maroon );
	cursor: pointer;
	}
.slider::-moz-range-thumb {
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%;
	background: var( --asu-maroon );
	cursor: pointer;
	}



/* SIDE BUTTONS ------------------ */
.slider-side-button-wrapper{
	margin-top: .5rem;
	display: grid;
	grid-template-columns: 1.75rem auto 1.75rem;
	gap: .5rem;
	align-items: center;
	}
.side-button{
	height: 1.75rem;
	width: 1.75rem;
	background-color: var(--link);
	border-radius: .5rem;
	color: #fff;
	cursor: pointer;
	padding: .5rem;
   	background-size: 60%;
	background-repeat: no-repeat;
	background-position: center;
	}
.side-button:hover{ background-color: var(--hover); }	
.plus{ background-image: url(../images/icons/slider-icon-plus.svg); }
.minus{ background-image: url(../images/icons/slider-icon-minus.svg); } 
