.slider {
	width: 75%;
	margin: 0px auto;
}

.slider-nav {
	width:calc(100% - 100px); 
}

.slider-for {
	width: 75%;
	margin: 0px auto;
}

.about-slide {
	padding-top:90px;
}

@media (max-width: 700px) {
	
	.slider-for {
        width: 100%;
	}
	
	.slider-nav {
		width:calc(100% - 50px); 
	}

	.about-slide {
		padding-top:20px;
	}

}

.slick-slide {
	margin: 0px 20px;
}

.slick-slide img {
	width: 100%;
}

.slick-prev:before,
.slick-next:before {
	color: #ffffff;
}

/*
.slider-nav .slick-current {
	color:#ffffff!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}
	

.slider-nav .slick-current + div h6 {
	color:#000000!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}

.slider-nav .slick-current + div h6 + div h6 {
	color:#ffffff!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}
*/

.slider-nav .slick-current h6 {
	color:#000000!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}

.slider-nav .slick-current h6 {
	color:#ffffff!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}
	
/*
.slider-nav .slick-current + div h6 {
	color:#000000!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}


.slider-nav .slick-current + div h6 + div h6 {
	color:#ffffff!important;
	-webkit-transition: 0.3s linear;
	-moz-transition: 0.3s linear;
	transition: 0.3s linear;
}
*/
	
.content-holder h6 {
	color:#fff;
}

/* change from padding to margin to hide edges of wraparound items - this is neccessary beacause i have forced the nav arrows by setting slidesToShow: 2.99 rather than 3. using 3-even hides the arrows */
div.slick-list.draggable {
	padding: 0px 0px!important;
	margin-left: 30px;
	margin-right: 30px;
}