.remove-item{ display:none}
.scroll-list {
	position: relative;
	width: 100%;
	height: 300px;
	margin: 0;
	padding: 0;
	
	list-style: none;

	-webkit-perspective: 400px;
	   -moz-perspective: 400px;
	    -ms-perspective: 400px;
	     -o-perspective: 400px;
	        perspective: 400px;
}
.scroll-list li {
		position: relative;
		padding: 15px;
		background: #eee;
		color: #252525;
		font-size: 18px;
		z-inddynamic-list: 2;

		-webkit-transform: translateZ(0px);
		   -moz-transform: translateZ(0px);
		    -ms-transform: translateZ(0px);
		     -o-transform: translateZ(0px);
		        transform: translateZ(0px);
	}
.scroll-list h6{
	margin: 0;
}
.scroll-list li:nth-child(even) {
		background: #fff;
	}

/*dynamic list*/

.dynamic-row {
	overflow: hidden;
}
.dynamic-row li{
	padding: 15px;
}

.dynamic-list-one .new-item {
	background: #1b8bf9;
	color: #fff;
}

.dynamic-list-two .new-item {
	background: #1b8bf9;
	color: #fff;
	max-height: 0;
	opacity: 0;
	transform: scale(0);
	animation: growHeight 0.2s ease forwards;
}
@keyframes growHeight {
	to {
		max-height: 50px;
		opacity: 1;
		transform: scale(1);
	}
}

/*list add and delete*/

.dynamic-list-three ul {
	overflow: hidden;
}
.dynamic-list-three .new-item {
	background: #1b8bf9;
	color: #fff;
	max-height: 0;
	opacity: 0;
	transform: translatdynamic-list(-300px);
	animation:
			openSpace 0.2s ease forwards,
			moveIn 0.3s 0.2s ease forwards;
}
@keyframes openSpace {
	to {
		max-height: 50px;
	}
}
@keyframes moveIn {
	to {
		opacity: 1;
		transform: translatdynamic-list(0);
	}
}
.hider {
	overflow: hidden;
}
.slider-wrap {
	width: 200%;
	position: relative;
	transition: transform 0.5s linear;
}
.slider-wrap.open {
	transform: translatdynamic-list(-50.1%);
}
.dynamic-list-five .details {
	display: none;
	line-height: 1.4;
	padding-bottom: 10px;
}
#dynamic-list-five-button {
	transition: background 0.2s ease;
}
#dynamic-list-five-button.open {
	background: #1b8bf9;
	color: #fff;
}
#dynamic-list-five-button.open .title {
	font-weight: bold;
}

.dynamic-list-six .details {
	display: none;
	line-height: 1.4;
	padding-bottom: 10px;
}
#dynamic-list-six-button {
	position: relative;
	transition: transform 0.2s ease;
}
#dynamic-list-five-button.open  h6,#dynamic-list-six-button.open  h6{
	color: #fff;
}
#dynamic-list-six-button.open{
	background: #1b8bf9;
	color: #fff;
	padding: 50px;
	transform:
			translateY(-60px)
			scale(2.8);
}
#dynamic-list-six-list {
	transition: transform 0.2s ease;
}
#dynamic-list-six-list.open {
	transform:
			translateY(-40px)
			scale(0.4);
}
#dynamic-list-six-list.open .title {
	font-weight: bold;
	font-size: 120%;
}
.close-button {
	position: absolute;
	top: 10px;
	right: 50px;
	font-weight: bold;
	color: #fff;
	font-size: 25px;
	line-height: 1;
	display: none;
}
#dynamic-list-six-button.open .close-button {
	display: block;
}
.details p{
	color: #fff;
}