img.grayscale {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
    -webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
    -webkit-backface-visibility: hidden; /* Fix for transition flickering */
}

img.grayscale:hover {
    filter: none;
    -webkit-filter: grayscale(0%);
}

svg {
    background:url(user/images/bandera_ing.jpg);
}

svg image {
    transition: all .6s ease;
}

svg image:hover {
    opacity: 0;
}

div.half-grayscale-container {
    background: url(user/images/bandera_ing.jpg) no-repeat; /* IE6-9 */
}

img.half-grayscale {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'saturate\' values=\'0.5\'/></filter></svg>#grayscale"); /* Firefox 10+ */
    filter: gray alpha(opacity=50); /* IE6-9 */
    -webkit-filter: grayscale(50%); /* Chrome 19+ & Safari 6+ */
    -webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
    -webkit-backface-visibility: hidden; /* Fix for transition flickering */
}

img.half-grayscale:hover {
    filter: none;
    -webkit-filter: grayscale(0%);
}
.UClink .pi-section-parallax a{
	color: #fcf808;
	font-weight:600;
}
/*.etiquetapromo {
	top:1px;
	height: 50px;
	position: absolute;
	width: 128px;
	z-index: 100;
}
.tp-banner-container{width:100%;position:relative;padding:0;}
.tp-banner{width:100%;position:relative;}
.tp-banner ul li {margin:0;}
.tp-banner-fullscreen-container{width:100%;position:relative;padding:0;}
div#cf {
	position: fixed;
	z-index: 10000;
	right: 0;
	top: 45%;
	bottom: 45%;
	float: right;
	width: 200px;
	height: 90px;
}
#cf img {
	position:absolute;
	left: 138px;
	transition: all 0.5s ease-in-out 0s;
}
#cf img:hover {
	left: 0px;
	transition: all 0.5s ease-in-out 0s;
}

#cf img.top:hover {
	opacity:0;
}

@media all and (max-width: 768px) {
	div#cf {
		position: fixed;
		z-index: 10000;
		right: 0;
		top: 45%;
		bottom: 45%;
		float: right;
		width: 200px;
		height: 90px;
	}
	#cf img {
		position:absolute;
		left: 138px;
		transition: all 0.5s ease-in-out 0s;
	}
	#cf img:hover {
		left: 0px;
		transition: all 0.5s ease-in-out 0s;
	}
}*/

.etiquetapromo {
	top:1px;
	height: 50px;
	position: absolute;
	width: 128px;
	z-index: 100;
}
.tp-banner-container{width:100%;position:relative;padding:0;}
.tp-banner{width:100%;position:relative;}
.tp-banner ul li {margin:0;}
.tp-banner-fullscreen-container{width:100%;position:relative;padding:0;}
div#cf {
	position: fixed;
	z-index: 10000;
	right: 0;
	top: 45%;
	bottom: 45%;
	float: right;
	width: 48px;
	height: 204px;
}
#cf img {
	position:absolute;
	left: 8px;
	transition: all 0.5s ease-in-out 0s;
}
#cf img:hover {
	left: 0px;
	transition: all 0.5s ease-in-out 0s;
}

#cf img.top:hover {
	opacity:0;
}

@media all and (max-width: 768px) {
	div#cf {
		position: fixed;
		z-index: 10000;
		right: 0;
		top: 45%;
		bottom: 45%;
		float: right;
		width: 48px;
		height: 204px;
	}
	#cf img {
		position:absolute;
		left: 8px;
		transition: all 0.5s ease-in-out 0s;
	}
	#cf img:hover {
		left: 0px;
		transition: all 0.5s ease-in-out 0s;
	}
}
.whatsapp-bubble {
	position: fixed;
	bottom: 30px;
	left: 20px;
	background: rgb(0, 199, 84);
	background: rgba(0, 199, 84, 1);
	width: 55px;
	height: 55px;
	display: block;
	z-index:1000;
	text-decoration: none;
	-webkit-border-radius: 35px;
	-moz-border-radius: 35px;
	border-radius: 50%;
	/*display: none;*/
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.whatsapp-bubble i {
	color: #fff;
	margin: 0;
	position: relative;
	left: 13px;
	top: 8px;
	font-size: 38px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.whatsapp-bubble:hover {
	background: rgba(1, 1, 1, 1);
}
.whatsapp-bubble:hover i {
	color: #fff;
}




/*slide logos*/
@keyframes slides {
  from {
	transform: translateX(0);
  }
  to {
	transform: translateX(-100%);
  }
}

.logos {
  overflow: hidden;
  padding: 30px 0px;
  white-space: nowrap;
  position: relative;
}

.logos:before, .logos:after {
  position: absolute;
  top: 0;
  content: '';
  width: 250px;
  height: 100%;
  z-index: 2;
}

.logos:before {
  left: 0;
  background: linear-gradient(to left, rgba(244, 246, 246,0), rgb(244, 246, 246));
}

.logos:after {
  right: 0;
  background: linear-gradient(to right, rgba(244, 246, 246,0), rgb(244, 246, 246));
}

.logo_items {
  display: inline-block;
  animation: 35s slides infinite linear;
}

.logos:hover .logo_items {
  animation-play-state: paused;
}

.logo_items img{
  height: 100px;
}
/*slide logos*/

.loading {
  position: fixed;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 9999;
  display: none;
  width: 100%;
  height: 100%;
  background-color: #dedfe0;
  display:block;
}

.loading-gif {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

/*!---------- ALERTS ----------*/
.alert {
  margin-bottom: 24px;
  background: none;
  border-radius: 0;
  font-weight: 600;
  padding: 12px 16px;
}
.alert .close {
  opacity: 1;
  font-size: 24px;
  top: -2px;
  right: -4px;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
}
.alert .close span {
  font-weight: 400;
}
.alert-warning {
  border: 1px solid #d88519;
  color: #d88519;
}
.alert-success {
  border: 1px solid #60b963;
  color: #60b963;
}
.alert-danger {
  border: 1px solid #c64444;
  color: #c64444;
}
.loading {
  position: fixed;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 9999;
  display: none;
  width: 100%;
  height: 100%;
  background-color: #dedfe0;
  display:block;
}
.loading-gif {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.pi-btn-orange {
	background: #f49e01 none repeat scroll 0 0;
	border: 1px solid #e97931;
	box-shadow: 0 1px 0 #f69c45 inset;
	color: #fff !important;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
.pi-btn-orange:hover {
	background: #e46526 none repeat scroll 0 0;
	border: 1px solid #d6561f;
	box-shadow: 0 1px 0 #e8742c inset;
	color: #fff !important;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
.pi-btn-orange.pi-btn-no-border {
	border-color: #f8a862 #f49e01 #f49e01;
	box-shadow: none;
}
.pi-btn-orange.pi-btn-no-border:hover {
	border-color: #eb8344 #e46526 #e46526;
	box-shadow: none;
}

.pi-icon-box-vertical .pi-icon-box-vertical-icon-bigger .pi-text-center .pi-box .pi-box-slave .pi-round .pi-border .pi-shadow .pi-icon-box-hover {
	min-height: 6000px;
}

@media (max-width: 992px) {
	.pi-icon-box-vertical .pi-icon-box-vertical-icon-bigger .pi-text-center .pi-box .pi-box-slave .pi-round .pi-border .pi-shadow .pi-icon-box-hover {
		min-height: 60px;
	}
	.pi-icon-box-vertical-icon-bigger .pi-icon-box-icon-circle img, .pi-icon-box-vertical-icon-bigger .pi-icon-box-icon-square img {
	  margin-top: -18px;
	  max-height: 50px;
	  max-width: 50px;
	}
	.pi-icon-box-vertical-icon-bigger .pi-icon-box-icon-circle, .pi-icon-box-vertical-icon-bigger .pi-icon-box-icon-square {
	  font-size: -50px;
	  height: 100px;
	  line-height: 88px;
	  width: 100px;
	}
}


/* ======================================================
   BOTÓN ESMERALDA
====================================================== */
.pi-btn-green1{
	position:relative;
	overflow:hidden;
	background:#1F9D55;
	border:1px solid #19864A;
	color:#FFF !important;
	border-radius:6px;
	text-shadow:none;
	margin-bottom: 20px;
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.18),
		0 3px 10px rgba(31,157,85,.18);
	transition:all .25s ease;
}
.pi-btn-green1:before{
	content:"";
	position:absolute;
	top:-40%;
	left:-45%;
	width:26%;
	height:180%;
	background:linear-gradient(
		90deg,
		transparent,
		rgba(255,255,255,.45),
		transparent
	);
	transform:rotate(25deg);
	animation:shine1 2.8s linear infinite;
	pointer-events:none;
}
.pi-btn-green1:hover,
.pi-btn-green1:focus{
	background:#188446;
	border-color:#146E3A;
	color:#FFF !important;
	text-decoration:none;
	transform:translateY(-2px);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.18),
		0 8px 20px rgba(31,157,85,.28);
}
.pi-btn-green1:active{
	transform:translateY(0);
	box-shadow:
		inset 0 2px 5px rgba(0,0,0,.12);
}

/* ======================================================
   BOTÓN GREEN 2
====================================================== */
.pi-btn-green2{
	position:relative;
	overflow:hidden;
	background:#1F9D55;
	border:1px solid #19864A;
	color:#FFF !important;
	border-radius:6px;
	text-shadow:none;
	margin-bottom: 20px;
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.18),
		0 3px 10px rgba(31,157,85,.18);
	transition:all .25s ease;
}

.pi-btn-green2:before{
	content:"";
	position:absolute;
	top:-40%;
	left:-45%;
	width:26%;
	height:180%;
	background:linear-gradient(
		90deg,
		transparent,
		rgba(255,255,255,.45),
		transparent
	);
	transform:rotate(25deg);
	animation:shine2 2.3s linear infinite;
	pointer-events:none;
}

.pi-btn-green2:hover,
.pi-btn-green2:focus{
	background:#188446;
	border-color:#146E3A;
	color:#FFF !important;
	text-decoration:none;
	transform:translateY(-2px);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.18),
		0 8px 20px rgba(31,157,85,.28);
}
.pi-btn-green2:active{
	transform:translateY(0);
	box-shadow:
		inset 0 2px 5px rgba(0,0,0,.12);
}

/* ======================================================
   EFECTO REFLEJO
====================================================== */
@keyframes shine1{
	0%{
		left:-45%;
	}
	18%{
		left:145%;
	}
	100%{
		left:145%;
	}
}

@keyframes shine2{
	0%{
		left:-45%;
	}
	20%{
		left:145%;
	}
	100%{
		left:145%;
	}
}

.video-responsive {
    position: relative;
    width: 100%;
    max-width: 750px;
    aspect-ratio: 16 / 9;
    margin: 25px auto;
}
.video-responsive iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}