body{ overflow-x: 0px}
/* Slider Style
--------------------------------------*/
.cd-slider {
	position: relative;
	width: 100%;
	height: 85vh;
	overflow: hidden;
}
.cd-slider li {
	position: absolute;
	top: 0;
	right: 0px;
	width: 100%;
	height: 100%;
	visibility: hidden;
	transition: visibility 0s 1s;
  will-change: visibility;
}
.image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: 50% 50%;
	clip: rect(0, 200rem, 50rem, 200rem);
	transition: clip .5s cubic-bezier(0.99, 0.01, 0.45, 0.9) .5s;
  will-change: clip;
}

.slideres li .frase {
	margin-top: 60px;
	padding: 10px;
	margin-right: 80px;
	background: rgb(255,255,255);
background: linear-gradient(90deg, rgba(83,89,100,0) 10%, rgba(83,89,100.80) 92%);
border-right: solid 2px #76BFD2;
	text-overflow: ellipsis;
	overflow: hidden;
	-webkit-transform: translateY(-30%);
	        transform: translateY(-30%);
	opacity: 0;
	transition: opacity .5s, -webkit-transform .5s;
	transition: transform .5s, opacity .5s;
	transition: transform .5s, opacity .5s, -webkit-transform .5s;
  will-change: transform, opacity;
}
.slideres li h2 {
	text-align: right;
	color: white;
	font-family: 'muli', sans-serif; 
	font-weight: 500;
	font-size: 1.7em;
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
	text-overflow: ellipsis;
	overflow: hidden;
	-webkit-transform: translateY(-50%);
	        transform: translateY(-50%);
	opacity: 0;
	transition: opacity .7s, -webkit-transform .7s;
	transition: transform .7s, opacity .7s;
	transition: transform .7s, opacity .7s, -webkit-transform .7s;
  will-change: transform, opacity;
}




/* Current Slide 
-------------------------------------*/
.slideres li.current {
	visibility: visible;
	transition-delay: 0s;
}
.slideres li.current .image {
	clip: rect(0, 200rem, 50rem, 0);
}
.slideres li.current .container .frase {
	-webkit-transform: translateY(0);
	        transform: translateY(0);
	opacity: 1;
	transition-delay: 1s;
}
.slideres li.current .container h2 {
	-webkit-transform: translateY(0);
	        transform: translateY(0);
	opacity: 1;
	transition-delay: 1s;
}
.slideres li.current .container a {
	-webkit-transform: translateY(0);
	        transform: translateY(0);
	opacity: 1;
	transition-delay: 1.1s;
}

/* imágenes Slide 
-------------------------------------*/
.slideres li:nth-child(1) .image {
  background-image: url("../images/home-01.jpg");
}
.slideres li:nth-child(2) .image {
  background-image: url("../images/home-02.jpg"); 
}
.slideres li:nth-child(3) .image {
  background-image: url("../images/home-03.jpg");
}
.slideres li:nth-child(4) .image {
  background-image: url("../images/home-04.jpg");
}
.slideres li:nth-child(5) .image {
  background-image: url("../images/home-05.jpg");
}
.slideres li:nth-child(6) .image {
  background-image: url("../images/home-06.jpg");
}
.slideres li:nth-child(7) .image {
  background-image: url("../images/home-07.jpg");
}




@media (max-width: 991.98px) {

	        .frase{margin-right: 30px!important; margin-left: 30px!important; margin-top: 60%!important}
.slideres li h3 {font-size: 1.0em;}


	


}

/* Prev Slide 
------------------------------------*/
.slideres li.prev_slide .image {
	clip: rect(0, 0, 50rem, 0);
}

.nav_arrows {  
  opacity: 0;
  transform: translateY(200%); transition: .25s ease opacity,.25s ease transform;}
  
.cd-slider:hover .nav_arrows {

  opacity: 1;
  transform: translateY(0);
}

.nav_arrows {
	position: relative;
	top: calc(50% - 40px);
	right: 0;
	z-index: 2;
	width: 100%;
	 
}

.prev:hover, .next:hover{opacity: .7}
	
.prev, .next {z-index: 100;
	vertical-align: middle; 
	display: inline-block;
	position: relative ;
	border: none;
	height: 40px;
	width: 40px;
	padding: 12px 10px;
}

.prev{left: 10px}
.next{right: 10px; float: right; position: relative}

.next > div{margin-left:18px;}
.nav_arrows button{background: transparent; border: solid white 2px; border-radius: 40px}
.nav_arrows div {
  position: absolute;
  left:8px;
  top: 50%;
  width: 3px;
  height: 20px;
  -webkit-transform-origin: 50% 0;
          transform-origin: 50% 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.nav_arrows div:nth-child(2) {
  -webkit-transform: translateY(1px) rotate(-135deg);
          transform: translateY(1px) rotate(-135deg);
}
.nav_arrows .next div {
  right: -30px;
  -webkit-transform-origin: 1px 0;
          transform-origin: 1px 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.nav_arrows .next div:nth-child(2) {
  -webkit-transform: translateY(1px) rotate(135deg);
          transform: translateY(1px) rotate(135deg);
}
.nav_arrows div:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  transition: background-color 0.3s;
}
.nav_arrows:hover div:after {
  background-color: #fff;
}
@media (max-width: 991.98px) {
.next > div{margin-left:12px;}
.prev, .next{left: 0px; 	height: 42px;	width: 42px; 	padding: 10px 10px;}

}