/************************************** EVENTOS **************************************/

#agenda-servicios #agenda{
	display: flex;
	flex-direction: column;
	margin-top: 7px;
}


#agenda-servicios .titulo{
	display: flex;
	background: #15427D;
	width: 100%;
	align-items:center;
	height: 60px;
	margin-bottom: 17px;
}

#agenda-servicios .titulo h2{
	flex-basis: 35%;
	color: #DDF0F7;
	font-family: Platform-Bold;
	font-size: 30px;
	text-align: center;
	letter-spacing: 1.5px;
	border-right: 1px solid #DDF0F7;
}

#agenda-servicios .titulo p {
	flex-basis: 25%;
	color: #BFE4F1;
	font-family: Platform-Medium;
	font-size: 25px;
	letter-spacing: 1.5px;
	padding: 0px 0px 0px 70px;
}
	
#agenda-servicios .titulo .fas{
	color: #BFE4F1;
	font-size: 25px;
	float: right;
    background: none;
	width: 40%;
}


#agenda-servicios #agenda .eventos {
	position: relative;
	height:265px;
}

#agenda-servicios #agenda .eventos .active {
	display:block
}


#agenda-servicios #agenda .eventos .jcarousel-wrapper {
	width:100%;
	height:0px;
	box-sizing:border-box;
}


#agenda-servicios #agenda .eventos .jcarousel {
    position: relative;
    overflow: hidden;
	width: 90%;
	margin:10px auto;
}

#agenda-servicios #agenda .eventos .jcarousel ul {
    width: 10000em;
    position: relative;
    list-style: none;
    margin: 0;
	padding: 0;
	overflow: hidden;
	cursor: pointer;
}

#agenda-servicios #agenda .eventos .jcarousel ul li {
    float: left;
	background:#f0f7fa;
	margin:0 10px;
	height: 230px;
	width: 10%;
}

#agenda-servicios #agenda .eventos .jcarousel ul li .link-evento{
	background:#ffffff;
	text-decoration: none;
	text-align: center;
	margin:0px 20%;
	margin-top: 17px;
	padding: 4px 7px;
	justify-content: center;
	display: flex;
	border-radius: 40px;
	font-family: Platform-Medium;
	font-size:14px;
	color:#00A5BB;
	letter-spacing: 0.5px;
	border: 3px double #00A5BB;
}

#agenda-servicios #agenda .eventos .jcarousel ul li a h3{
	color:#c9dde0;
	font-family:Platform-Bold !important;
	font-size:15px;
	letter-spacing:1.5px;
    background: #6BA4B6;
}

#agenda-servicios #agenda .eventos .jcarousel ul li h2 {
	background:#4084C5;
	height: 42px;
	text-align: center;
	color:#BFE4F1;
	margin-top:0;
	font-size: 19px;
	font-family: Platform-LightItalic;
	letter-spacing: 1.5px;
	padding:0px;
	float: left;
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
}	

#agenda-servicios #agenda .eventos .jcarousel ul li h2 p{
	color:#BFE4F1;
	font-size: 19px;
	font-family: Platform-BoldItalic;
	letter-spacing: 1.5px;
	float:right;
	margin-left: 5px;
}

#agenda-servicios #agenda .eventos .jcarousel ul li .cuadroEvento{
	background: #BFE4F1;
	text-align: center;
	text-transform: uppercase;
	font-family: Platform-Bold;
	letter-spacing: 0.3px;
	line-height: 5px;
	padding: 1px 7px;
	margin-top: -7px;
	height: 53px;
	display: flex;
    justify-content: center;
    align-items: center;
}


#agenda-servicios #agenda .eventos .jcarousel ul li .textoEvento{
    color:#0d6b8d;
	font-size: 12px;
	line-height: 14px;
    padding:0px 6px;
	/* restringir lineas */
	display:-webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp:2;
	line-clamp:2;
	overflow: hidden;
}

#agenda-servicios #agenda .eventos .jcarousel ul li .textoEvento:hover{
    display: block;
}

#agenda-servicios #agenda .eventos .jcarousel ul li h3 {
	text-align: center;
	color:#75C8D6;
	font-size: 20px;
	font-family: Platform-Bold;
	letter-spacing: 1px;
	padding:0px 5px 10px 5px;
	border-bottom: 1px solid #75C8D6;
}


/** Agenda Carousel Controls **/

#agenda-servicios #agenda .eventos .jcarousel-control-prev,
#agenda-servicios #agenda .eventos .jcarousel-control-next {
    position: absolute;
    top: 50%;
    width: 30px;
    height: 30px;
    text-align: center;
    background: #c2d9dd;
    color: rgb(28, 54, 168);
    text-decoration: none;
    text-shadow: 0 0 1px rgb(0, 0, 0);
    font: 24px/27px Arial, sans-serif;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    -webkit-box-shadow: 0 0 4px #F0EFE7;
    -moz-box-shadow: 0 0 4px #F0EFE7;
    box-shadow: 0 0 4px #F0EFE7;
	display:block;
}

#agenda-servicios #agenda .eventos .jcarousel-control-prev {
    left:13px;
}
#agenda-servicios #agenda .eventos .jcarousel-control-next {
    right:13px;
}

/** Agenda Jconfirm **/

.jconfirm-box {
	width:40% !important;
}

.jconfirm-box {
	border-radius:0px  !important;
	background:#ffffff !important;
	padding: 0 15px !important;
	margin-top:200px !important;
}

.jconfirm-buttons .hide {
	display:none !important;
}

.jconfirm-content-pane, .jconfirm-content-pane p {
	background:#ffffff;
	text-align: center;
	color:#8eced6;
	font-family:Platform-Regular;
	font-size:13px;
	letter-spacing:1px;
	padding:0px 0px 17px 0px;
	margin:0px;
	transition: .3s ease all;
	opacity: 0;
}


.jconfirm-title {
	color:#c9dde0;
	font-family:Platform-Bold !important;
	font-size:15px;
	letter-spacing:1.5px;
	background: #6BA4B6;
	margin: 0px;
	width:105%;
	padding:10px;
	text-align: center;
	margin-left: -25px;
	}

.jconfirm-content-pane h3{
	color:#357c91;
	font-family:Platform-Regular;
	font-size:15px;
	letter-spacing:1px;
	border-bottom:4px double #357c91;
	padding-bottom:8px;
	margin:30px 10px 15px 10px;
	transition: .3s ease all;
	opacity: 0;
	}

.jconfirm-content-pane .descripcion{
	color:#46646d;
	font-family:Platform-BoldItalic;
	font-size:13px;
	letter-spacing:1px;
	border-top:2px solid #46646d;
	border-bottom:2px solid #46646d;
	padding:12px 0px;
	margin:30px 0px;
	line-height:22px;
}

.jconfirm-content-pane h4{
	background:#dff5f5;
	font-family:Platform-Bold;
	font-size:13px;
	letter-spacing:0.5px;
	padding:10px 12px 8px 12px;
	color:#5eabbe;
	margin-bottom: 0px;
	}

.jconfirm-content-pane h5{
	background:#6bbdd1;
	color: #fff;
	font-family:Platform-Light;
	font-size:12.5px;
	letter-spacing:1.2px;
	padding:15px;
	padding-bottom: 26px;
	margin-top: 0px;
	}

.jconfirm-closeIcon {
	color: #357c91;
	background-color: #ffffff;
	border-radius: 100%;
	padding:8px 4px 0px 4px;
	margin-right:8px;
	margin-top: 3px;
  }


/* Agenda animaciones */
.jconfirm-content-pane h3 { animation: entradaTitulo .8s ease .2s forwards; }
.jconfirm-content-pane { animation: entradaSubtitulo .8s ease .5s forwards; }
.jconfirm-content-pane p { animation: entradaSubtituloHora .12s ease .10s forwards; }



@keyframes entradaTitulo {
	from {
		opacity: 0;
		transform: translateY(-25px);
	}

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

@keyframes entradaSubtitulo {
	from {
		opacity: 0;
		transform: translateY(25px);
	}

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

@keyframes entradaSubtituloHora {
	from {
		opacity: 0;
		transform: translateY(25px);
	}

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

/*Media queries*/
@media screen and (max-width: 1023px) {
	
	.jconfirm-box {
		width:60% !important;
	}
	.jconfirm-content-pane h4{
		font-size:12px;
	}		
	.jconfirm-content-pane h5{
		font-size:12px;
		}
	.jconfirm-content-pane .descripcion{
		margin:30px -20px;
	}
	.jconfirm-content-pane p {
		padding:0px 17px;
		}
	.jconfirm-content-pane h3{
		margin:30px 10px 15px 10px;
		}
	.jconfirm-title {
		margin-left: -20px;
		}

	#agenda-servicios .titulo{
		background: #15427D;
		display: flex;
		width: 100%;
		align-items:center;
		height: 60px;
		margin-bottom: 20px;
	   }
	
	#agenda-servicios .titulo h2{
		font-size: 24px;
		width: 50%;
		flex-basis: 50%;
		padding-left:2%;
		padding-right: 2%;
		}
	
	#agenda-servicios .titulo p{
		font-size: 18px;
		width: 37%;
		flex-basis: 37%;
		padding-left:5%;
		}
		
	#agenda-servicios #agenda .titulo .fas{
		font-size: 21px;
		width: 22%;
		flex-basis: 22%;
		padding-left: 10%;
	   }
	#agenda-servicios #agenda .eventos .jcarousel-control-prev {
		left:15px;
	   }
	#agenda-servicios #agenda .eventos .jcarousel-control-next {
		right:15px;
	   }
	#agenda-servicios #agenda .eventos .jcarousel-control-prev,
	#agenda-servicios #agenda .eventos .jcarousel-control-next {
		width: 28px;
		height: 28px;
		font: 19px/25px Arial, sans-serif;
	   }
}


@media screen and (max-width: 600px) {
		#agenda-servicios .titulo{
			background: #15427D;
			display: flex;
			width: 100%;
			align-items:center;
			height: 60px;
			margin-bottom: 20px;
		}
		
		#agenda-servicios .titulo h2{
			font-size: 19.5px;
			width: 50%;
			flex-basis: 50%;
		}
		
		#agenda-servicios .titulo p{
			font-size: 14.5px;
			width: 50%;
			flex-basis: 50%;
			padding-left:5%;
		}
			
		#agenda-servicios .titulo .fas{
			font-size: 21px;
			width: 10%;
			flex-basis: 10%;
			padding-left: 10%;
		}
		
		#agenda-servicios #agenda .eventos .jcarousel-control-prev {
			left:2px;
		}
		#agenda-servicios #agenda .eventos .jcarousel-control-next {
			right:2px;
		}
		
		#agenda-servicios #agenda .eventos .jcarousel-control-prev,
		#agenda-servicios #agenda .eventos .jcarousel-control-next {
			width: 25px;
			height: 25px;
			font: 17px/23px Arial, sans-serif;
		}

		#agenda-servicios #agenda .jconfirm-box {
			width:80% !important;
		}

		#agenda-servicios #agenda .jconfirm-content-pane h4{
			font-size:12px;
		}	

		#agenda-servicios #agenda .jconfirm-content-pane h5{
			font-size:12px;
			}

		#agenda-servicios #agenda .jconfirm-content-pane .descripcion{
			margin:30px -20px;
		}

		#agenda-servicios #agenda .jconfirm-content-pane p {
			padding:0px 17px;
			}

		#agenda-servicios #agenda .jconfirm-content-pane h3{
			margin:30px 10px 15px 10px;
			}

		#agenda-servicios #agenda .jconfirm-title {
			margin-left: -15px;
			}
	
}

@media screen and (max-width: 390px) {

#agenda-servicios #agenda .eventos .jcarousel ul li {
	margin:0px;
}