.cardslider {
	width: 100%;
	height: auto;
	position: relative;
	overflow: hidden;
}

.cardslider-cards,
.cardslider-dots-nav {
	margin: 0;
	padding: 0;
	list-style: none;
	-webkit-margin-before: 0;
	-webkit-margin-after: 0;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
	-webkit-padding-start: 0;
}

.cardslider-cards {
	position: relative;
	width: 54.396%;
	min-height: 435px;
	height: auto;
	margin: 0 auto; /* position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)*/
}

.cardslider-dots-nav {
	position: absolute;
	bottom: 20px;
	left: 50%;
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

.cardslider-dots-nav li {
	display: inline-block;
	margin-right: 8px;
}

.cardslider-dots-nav li a {
	position: relative;
	border-radius: 50%;
	border: 2px solid white;
	width: 10px;
	height: 10px;
	display: block;
}

.cardslider-dots-nav li a::before {
	content: " ";
	position: absolute;
	display: block;
	background: white;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	left: 50%;
	top: 50%;
	transition: all 0.5s;
	-ms-transform: translate(-50%, -50%) scale(0);
	transform: translate(-50%, -50%) scale(0);
}

.cardslider-dots-nav li.active a::before {
	-ms-transform: translate(-50%, -50%) scale(1);
	transform: translate(-50%, -50%) scale(1);
}

.cardslider-card {
	background: #ffffff;
	height: 100%;
	position: absolute;
	transition: all 0.5s ease-out;
	padding: 20px;
	color: black;
	font-size: 4rem;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	    flex-direction: column;
	-ms-flex-pack: center;
	    justify-content: center;
	-ms-flex-align: center;
	    align-items: center;
	width: 100%;
	opacity: 0;
}

.cardslider-card.out {
	opacity: 0;
}

.cardslider.direction-up .cardslider-card {
	-ms-transform: scale(0.8) translateY(96px);
	transform: scale(0.8) translateY(96px);
}

.cardslider.direction-up .card-0 {
	-ms-transform: none;
	    transform: none;
	opacity: 1;
}

.cardslider.direction-up .card-1 {
	-ms-transform: scale(0.95) translateY(3rem);
	    transform: scale(0.95) translateY(3rem);
	opacity: 0.9;
}

.cardslider.direction-up .card-2 {
	-ms-transform: scale(0.75) translateY(9rem);
	    transform: scale(0.75) translateY(9rem);
	opacity: 0.9;
}

/*.cardslider.direction-up .card-3 {
    transform: scale(0.85) translateY(12.91%)
}
*/

.cardslider.direction-up .out {
	-ms-transform: translateY(-1000px);
	    transform: translateY(-1000px);
}

.cardslider.direction-down .cardslider-card {
	-ms-transform: scale(0.8) translateY(-17.25%);
	transform: scale(0.8) translateY(-17.25%);
}

.cardslider.direction-down .card-0 {
	-ms-transform: none;
	    transform: none;
}

.cardslider.direction-down .card-1 {
	-ms-transform: scale(0.95) translateY(-4.31%);
	    transform: scale(0.95) translateY(-4.31%);
}

.cardslider.direction-down .card-2 {
	-ms-transform: scale(0.9) translateY(-8.61%);
	    transform: scale(0.9) translateY(-8.61%);
}

.cardslider.direction-down .card-3 {
	-ms-transform: scale(0.85) translateY(-12.91%);
	    transform: scale(0.85) translateY(-12.91%);
}

.cardslider.direction-down .out {
	-ms-transform: translateY(1000px);
	    transform: translateY(1000px);
}

.cardslider.direction-right .cardslider-card {
	-ms-transform: scale(0.8) translateX(-17.25%);
	transform: scale(0.8) translateX(-17.25%);
}

.cardslider.direction-right .card-0 {
	-ms-transform: none;
	    transform: none;
}

.cardslider.direction-right .card-1 {
	-ms-transform: scale(0.95) translateX(-4.31%);
	    transform: scale(0.95) translateX(-4.31%);
}

.cardslider.direction-right .card-2 {
	-ms-transform: scale(0.9) translateX(-8.61%);
	    transform: scale(0.9) translateX(-8.61%);
}

.cardslider.direction-right .card-3 {
	-ms-transform: scale(0.85) translateX(-12.91%);
	    transform: scale(0.85) translateX(-12.91%);
}

.cardslider.direction-right .out {
	-ms-transform: translateX(1000px);
	    transform: translateX(1000px);
}

.cardslider.direction-left .cardslider-card {
	-ms-transform: scale(0.8) translateX(17.25%);
	transform: scale(0.8) translateX(17.25%);
}

.cardslider.direction-left .card-0 {
	-ms-transform: none;
	    transform: none;
}

.cardslider.direction-left .card-1 {
	-ms-transform: scale(0.95) translateX(4.31%);
	    transform: scale(0.95) translateX(4.31%);
}

.cardslider.direction-left .card-2 {
	-ms-transform: scale(0.9) translateX(8.61%);
	    transform: scale(0.9) translateX(8.61%);
}

.cardslider.direction-left .card-3 {
	-ms-transform: scale(0.85) translateX(12.91%);
	    transform: scale(0.85) translateX(12.91%);
}

.cardslider.direction-left .out {
	-ms-transform: translateX(-1000px);
	    transform: translateX(-1000px);
}