/*! lightslider - v1.1.6 - 2016-10-25
* https://github.com/sachinchoolur/lightslider
* Copyright (c) 2016 Sachin N; Licensed MIT */
/*! lightslider - v1.1.3 - 2015-04-14
* https://github.com/sachinchoolur/lightslider
* Copyright (c) 2015 Sachin N; Licensed MIT */
/** /!!! core css Should not edit !!!/**/ 

.lSSlideOuter {
    overflow: hidden;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}
.lightSlider:before, .lightSlider:after {
    content: " ";
    display: table;
}
.lightSlider {
    overflow: hidden;
    margin: 0;
}
.lSSlideWrapper {
    max-width: 100%;
    overflow: hidden;
    position: relative;
}
.lSSlideWrapper > .lightSlider:after {
    clear: both;
}
.lSSlideWrapper .lSSlide {
    -webkit-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    -webkit-transition: all 1s;
    -webkit-transition-property: -webkit-transform,height;
    -moz-transition-property: -moz-transform,height;
    transition-property: transform,height;
    -webkit-transition-duration: inherit !important;
    transition-duration: inherit !important;
    -webkit-transition-timing-function: inherit !important;
    transition-timing-function: inherit !important;
}
.lSSlideWrapper .lSFade {
    position: relative;
}
.lSSlideWrapper .lSFade > * {
    position: absolute !important;
    top: 0;
    left: 0;
    z-index: 9;
    margin-right: 0;
    width: 100%;
}
.lSSlideWrapper.usingCss .lSFade > * {
    opacity: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-duration: inherit !important;
    transition-duration: inherit !important;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-timing-function: inherit !important;
    transition-timing-function: inherit !important;
}
.lSSlideWrapper .lSFade > *.active {
    z-index: 10;
}
.lSSlideWrapper.usingCss .lSFade > *.active {
    opacity: 1;
}
/** /!!! End of core css Should not edit !!!/**/

/* Pager */
.lSSlideOuter .lSPager.lSpg {
    margin: 10px 0 0;
    padding: 0;
    text-align: center;
}
.lSSlideOuter .lSPager.lSpg > li {
    cursor: pointer;
    display: inline-block;
    padding: 0 5px;
}
.lSSlideOuter .lSPager.lSpg > li a {
    background-color: #222222;
    border-radius: 30px;
    display: inline-block;
    height: 8px;
    overflow: hidden;
    text-indent: -999em;
    width: 8px;
    position: relative;
    z-index: 99;
    -webkit-transition: all 0.5s linear 0s;
    transition: all 0.5s linear 0s;
}
.lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a {
    background-color: #428bca;
}
.lSSlideOuter .media {
    opacity: 0.8;
}
.lSSlideOuter .media.active {
    opacity: 1;
}
/* End of pager */

/** Gallery */
.lSSlideOuter .lSPager.lSGallery {
    list-style: none outside none;
    padding-left: 0;
    margin: 0;
    overflow: hidden;
    transform: translate3d(0px, 0px, 0px);
    -moz-transform: translate3d(0px, 0px, 0px);
    -ms-transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate3d(0px, 0px, 0px);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.lSSlideOuter .lSPager.lSGallery li {
    overflow: hidden;
    -webkit-transition: border-radius 0.12s linear 0s 0.35s linear 0s;
    transition: border-radius 0.12s linear 0s 0.35s linear 0s;
}
.lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover {
    border-radius: 5px;
}
.lSSlideOuter .lSPager.lSGallery img {
    display: block;
    height: auto;
    max-width: 100%;
}
.lSSlideOuter .lSPager.lSGallery:before, .lSSlideOuter .lSPager.lSGallery:after {
    content: " ";
    display: table;
}
.lSSlideOuter .lSPager.lSGallery:after {
    clear: both;
}
/* End of Gallery*/

/* slider actions */
.lSAction > a {
    width: 32px;
    display: block;
    top: 50%;
    height: 32px;
    background-image: url('../img/controls.png');
    cursor: pointer;
    position: absolute;
    z-index: 99;
    margin-top: -16px;
    opacity: 0.5;
    -webkit-transition: opacity 0.35s linear 0s;
    transition: opacity 0.35s linear 0s;
}
.lSAction > a:hover {
    opacity: 1;
}
.lSAction > .lSPrev {
    background-position: 0 0;
    left: 10px;
}
.lSAction > .lSNext {
    background-position: -32px 0;
    right: 10px;
}
.lSAction > a.disabled {
    pointer-events: none;
}
.cS-hidden {
    height: 1px;
    opacity: 0;
    filter: alpha(opacity=0);
    overflow: hidden;
}


/* vertical */
.lSSlideOuter.vertical {
    position: relative;
}
.lSSlideOuter.vertical.noPager {
    padding-right: 0px !important;
}
.lSSlideOuter.vertical .lSGallery {
    position: absolute !important;
    right: 0;
    top: 0;
}
.lSSlideOuter.vertical .lightSlider > * {
    width: 100% !important;
    max-width: none !important;
}

/* vertical controlls */
.lSSlideOuter.vertical .lSAction > a {
    left: 50%;
    margin-left: -14px;
    margin-top: 0;
}
.lSSlideOuter.vertical .lSAction > .lSNext {
    background-position: 31px -31px;
    bottom: 10px;
    top: auto;
}
.lSSlideOuter.vertical .lSAction > .lSPrev {
    background-position: 0 -31px;
    bottom: auto;
    top: 10px;
}
/* vertical */


/* Rtl */
.lSSlideOuter.lSrtl {
    direction: rtl;
}
.lSSlideOuter .lightSlider, .lSSlideOuter .lSPager {
    padding-left: 0;
    list-style: none outside none;
}
.lSSlideOuter.lSrtl .lightSlider, .lSSlideOuter.lSrtl .lSPager {
    padding-right: 0;
}
.lSSlideOuter .lightSlider > *,  .lSSlideOuter .lSGallery li {
    float: left;
}
.lSSlideOuter.lSrtl .lightSlider > *,  .lSSlideOuter.lSrtl .lSGallery li {
    float: right !important;
}
/* Rtl */

@-webkit-keyframes rightEnd {
    0% {
        left: 0;
    }

    50% {
        left: -15px;
    }

    100% {
        left: 0;
    }
}
@keyframes rightEnd {
    0% {
        left: 0;
    }

    50% {
        left: -15px;
    }

    100% {
        left: 0;
    }
}
@-webkit-keyframes topEnd {
    0% {
        top: 0;
    }

    50% {
        top: -15px;
    }

    100% {
        top: 0;
    }
}
@keyframes topEnd {
    0% {
        top: 0;
    }

    50% {
        top: -15px;
    }

    100% {
        top: 0;
    }
}
@-webkit-keyframes leftEnd {
    0% {
        left: 0;
    }

    50% {
        left: 15px;
    }

    100% {
        left: 0;
    }
}
@keyframes leftEnd {
    0% {
        left: 0;
    }

    50% {
        left: 15px;
    }

    100% {
        left: 0;
    }
}
@-webkit-keyframes bottomEnd {
    0% {
        bottom: 0;
    }

    50% {
        bottom: -15px;
    }

    100% {
        bottom: 0;
    }
}
@keyframes bottomEnd {
    0% {
        bottom: 0;
    }

    50% {
        bottom: -15px;
    }

    100% {
        bottom: 0;
    }
}
.lSSlideOuter .rightEnd {
    -webkit-animation: rightEnd 0.3s;
    animation: rightEnd 0.3s;
    position: relative;
}
.lSSlideOuter .leftEnd {
    -webkit-animation: leftEnd 0.3s;
    animation: leftEnd 0.3s;
    position: relative;
}
.lSSlideOuter.vertical .rightEnd {
    -webkit-animation: topEnd 0.3s;
    animation: topEnd 0.3s;
    position: relative;
}
.lSSlideOuter.vertical .leftEnd {
    -webkit-animation: bottomEnd 0.3s;
    animation: bottomEnd 0.3s;
    position: relative;
}
.lSSlideOuter.lSrtl .rightEnd {
    -webkit-animation: leftEnd 0.3s;
    animation: leftEnd 0.3s;
    position: relative;
}
.lSSlideOuter.lSrtl .leftEnd {
    -webkit-animation: rightEnd 0.3s;
    animation: rightEnd 0.3s;
    position: relative;
}
/*/  GRab cursor */
.lightSlider.lsGrab > * {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}
.lightSlider.lsGrabbing > * {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
}
/*menu*/
*,*:before, *:after{
	margin: 0;
	padding:0;
	outline: 0;
	box-sizing: border-box;
}
body{
	font-family: 'Arial';
	background-color: #ffffff;
}
.contenedor_p{
	position: relative;
}

.banner img{
	width: 100%;
	padding: 0;
	margin: 0;
	margin-top: 60px;
	
}
.banner{
	background-image: url(../img/bannerc.jpg);
	background-size:cover;
	background-repeat: no-repeat;
	height: 35em;
	width: auto;
	display: flex;
	align-items: end;
	justify-content:space-between;
	background-position: center center;
    background-origin: content-box;

	color:white;
}

/* estilos de banner */
.card__title{
	/* background-color:rgba(79, 22, 109, 0.73); */
	padding: 3em;
	margin-right: 4em;
}
.banner-img{
	display:flex;
	background-image: url(../img/logoc.png);
	background-size:cover;
	background-repeat: no-repeat;
	background-position: center center;
	width: auto;
	height: 20em;

	
	justify-content:flex-start;
	align-self: center;
	margin-left:5em;
}

@media screen and (max-width: 800px) {
	.banner{
	
		display: flex;
		align-items: center;
		justify-content:center;
		margin-bottom:1em;
		padding-bottom: 1em;
		
	}
	.card__title{
		/* background-color:rgba(79, 22, 109, 0.73); */
		padding: 1em;
		margin-right: 0em;
		display: block;
		align-items: center;
		justify-content:center;

	}
	.banner-img{
		display:none;
		
	}
}
body{
	 overflow-x: hidden;
}

footer{
	background: url("../img/footer_bg.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center center;
	margin: auto;
	width: 100vw;
}

.footer_contenedor{
	width: 90%;
	margin: 0 auto;
	display: flex;
	padding: 50px 0;
}
.nosotros , .hospital{
	width: 40%;
}
.horario{
	width: 20%;
}
.copy{
	color: #D8D8D8;
	text-align: center;
	padding-bottom: 10px;
	margin-left: 15px;
	margin-right: 15px;
}
footer .nosotros .ti{
	margin-bottom: 20px;
	font-weight: bold;
	font-size: 20px;
	font-family: 'Raleway', sans-serif;
}
.ti{
	font-weight: bold;
}
.nosotros p{
	font-family: 'Open Sans' sans-serif;
	font-weight: normal;
	color: #D8D8D8;
	padding-top: 35px;
	padding-right: 25px;
}
.horario p{
	padding-top: 35px;
	padding-bottom: 20px;
	color: #D8D8D8;;
}
.horario img{
	width: 100px;
	display:block;
	margin:auto;
}
.footer_contenedor .footer_cont{
	padding: 0 15px;
	color: #D8D8D8;
}
footer .ti{
	font-size: 20px;
	font-family: 'Raleway', sans-serif;
}
.hospital ul li{
	list-style: none;
	display: flex;
	align-items: center;
	margin-bottom: 5px;
	font-size: 14px;
}
.hospital ul{
	padding-top: 25px;
}
.redes_sociales ul{
	padding-top: 25px;
}
.redes_sociales ul li a{
	shape-margin: 50px;
	display: flex;
	color: #fff;
	text-decoration: none;
	align-items: center;
}
.redes_sociales ul li a:hover{
	color: #000;
}
footer .redes_sociales .ti{
	padding-top: 20px;
}
.hospital ul li img{
	width: 32px;
	height: 32px;
	margin-right: 8px;
}

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

	.nosotros , .hospital{
		width: 35%;
	}
	.horario{
		width: 30%;
	}
}
@media screen and (max-width: 767px){

	.nosotros, .hospital, .horario{
		width: 100%;
		margin-bottom: 30px;

	}
	.footer_contenedor{
		flex-direction: column;
	}
}
/*tajetas de estadisticas*/
.estadisticas{
	margin-left: 130px;
	width: 80%;
	height: 60px;
}
.estadisticas h2, .titulo_directores h2{
	font-size: 30px;
	color: #505050;
	font-weight: normal;
	font-family: 'Oswald', sans-serif;
	text-align: center;
	padding-bottom: 5px;
}
.titulo_Estadistica, .titulo_directores{
	border-bottom: 4px solid #C4C4C4;
	width: 50%;
}
.centro{
	width: 100%;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
/*
.fallecidos{

	background-color: #1EBCB0;
	width: 33.33%;
}
.cont_medio{
	width: 33.33%;
	margin-right: 15px;
}
.cont_ultimo{
	width: 33.33%;
	display: flex;
	flex-direction: column;


}*/
/*nueva estadistica*/

.contenedorDatos {
    width: 100%;
    height: 265px;
    display: flex;
    flex-direction: row;
    min-height: 150px;
    background-image: url(../img/Estadistica_Imagen.png);
	background-size: cover;
	background-repeat: none;
	text-align: center;
    justify-content: space-around;
    align-items: center;
	margin: 0;
	margin-bottom:2em
}

.orden p:nth-child(1) {
    color: #ed3471;
    font-size: 3em;
    font-style: raleway;
    margin-bottom: 20px;
}

.orden p:nth-child(2) {
    color: #fff;
}

@media screen and (max-width: 911px) {
    .contenedorDatos {
        margin-top: 10px;
        margin-bottom: 20px;
        padding-bottom: 30px;
        height: 600px;
        width: 100vw;
        flex-direction: column;
        background: #fff url(../img/Estadistica_Imagen.png) center center/cover no-repeat;
    }
    .orden {
        padding-top: 10px;
		text-align: center;
		align-items: center;
    }
    .orden p:nth-child(1) {
        margin-top: 50px;
    }

}


/*fin estadistica*/

.recuperados{
background-color: #05B8D2;
margin-bottom: 4%;
height: 48%;
}
.recuperados_uci{
background-color: #84B546;
height: 48%;
display: flex;
}
.altas_uci{
background-color: #8A7DBE;
height: 48%;
}
.esta_contenido{
	padding-top: 15px;
	display: flex;
	background-color: #fff;
	width: 100%;
	height: 85%;
}
.fallecidos{
	margin-right: 15px;
}
/*tajeta fallecidos*/
.fallecidos .id_fallecidos , .string_fallecidos{
	text-align: center;
	color: #fff;
	font-family: 'Raleway', sans-serif;
}
.id_fallecidos{
	font-size: 50px;
	padding-top: 70px;
}
.string_fallecidos{
	font-size: 15px;
	padding-top: 8px;
	font-family: 'Open Sans', sans-serif;
}
.fallecidos img{
	padding-top: 8px;
	display:block;
	margin:auto;
}
/*tarjeta de en medio*/
.medio , .string{
	color: #fff;
}
.total_hospi, .recuperados_uci{
	background-color: #FDA332;
	margin-bottom: 4%;
	height: 48%;
	display: flex;
	flex-direction: column;
}
.hopital_contenido img, .recuperados_uci_contenido img, .altas_contenido img, .recuperados_contenido img{
	width: 100px;
}

.hopital_contenido, .recuperados_uci_contenido, .recuperados_contenido, .altas_contenido{ 
	display: flex;
	flex-direction: row;
	align-items: center;
	margin: 5px 5px;
	justify-content: space-around;
	height: 80%;
}
.string_hospitalizados, .string_recuperados, .string_recuperados_uci , .string_total_alta{
	text-align: center;
	font-family: 'Open Sans' , sans-serif;
	font-size: 14px;
	padding-bottom: 10px;
}
.id_hospitalizados, .id_recuperados_uci, .id_altas, .id_recuperados{
	font-size: 40px;
	font-family: 'Raleway', sans-serif;
	padding-left: 15px;
}

@media screen and (max-width: 911px){
	
	.esta_contenido{
	flex-direction: column;
	}
	.recuperados_uci{
		padding-top: 0;
	}
	.fallecidos, .cont_medio,  .cont_ultimo{
		width: 100%;
	}
	.recuperados{
		margin-top: 10px;;
	}
	.cont_medio{
		margin-top: 10px;
	}
}
.fuente{
	text-align: center;
}
/*slider*/


.contariner{
	width: 90%;
	max-height: 100vh;
	max-width: 100%;
	margin: 0 auto;
	overflow: hidden;
}
.slider{
	padding:  40px 0;
}
.imgantes{
	transform: scaleX(-1);
	opacity: 0.8;
	
}
.slider_container{
	display: grid;
	grid-template-columns: 0px 1fr 0px;
	align-items: center;
	/*gap: 1em;*/
}
.slider_body{
	grid-column: 2/3;
	grid-row: 1/2;
	opacity: 0;
	pointer-events: none;
	display: grid;
	grid-template-columns: 1fr max-content;
	align-items: center;
	transition: opacity 1.5s;

}
.slider_body_show{
	opacity: 1;
	pointer-events: unset;
}
.slider_img{
	width: 230px;
	height: 230px;
	border-right: 50%;
	display: block;
	margin: 0 auto;
}
/*.slider_texts{
	/*max-width: 100%;*/
	/*background-color: red;
	display: flex;
	flex-direction: row;
}*/
.subtitulo{
	font-size: 2.5rem;
	margin-bottom: 20px;

}
.descripcion{
	font-weight: 300;
	font-size: 20px;
	line-height: 1.7;
}
.slider_arrow{
	cursor: pointer;
	width: 90%;
}
.slider_arrow:nth-of-type(2){
	justify-self: end;
	opacity: 0.8;
}

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

	.slider_body{
		grid-template-columns: 1fr;
		grid-template-rows: max-content 1fr;
		/*gap: 1em;*/
	}
	.slider_picture{
		grid-row : 1/2;

	}
	.slider_img{
		width: 218px;
		height: 218px;
	}
	.slider_texts{
		flex-direction: column;
		
	}
	.personas2{
		display: none;
	}
}
@media screen and (max-width: 425px){
	.slider_container{
		grid-template-columns: 0px 1fr 0px;
		
	}
	.slider_arrow{
		width: 100%;
	}
	.slider_img{
		width: 180px;
		height: 180px;

	}
	.subtitulo{
		font-size: 2rem;
		margin-bottom: 15px;

	}
	.descripcion{
		font-size: 1rem;
		line-height: 1.6;
	}

}
.slider_figura img{
	width: 100%;
	z-index: 1;
}
.slider_figura{
	background-color: #fff;
}
.contain{
	z-index: 5;
	
}
.slider_{
	background-color: #fff;
}
.slider_texts{
	position: relative;
	display: inline-block;
	background-color: #f0f0f0;
}
.slider_texts img{
	width: 100%;
	z-index: 1;

}
.containerss{
	position: relative;
	padding: 0px;
	margin: 0px;
	/*aqui es el fondo*/
}
.slider_body{
	width: 100%;
	padding: 0px;
	margin: 0px;
}
.slider_arrow{
	z-index: 10;
	width: 64px;
	height: 64px;
	margin-left: 0.5em;
	margin-right: 0.5em;
}

.slider_texts .fondo{
	background-color: #212121;
	opacity: 0.7;
	position: absolute;
    width: 100%;
    height: 100%;
    z-index: 3;
    top:0;
    margin: 0px;
    padding: 0px;
}
.fondoImagen{
	
	height:25em;
	background-size: cover;
	
}
.fondoPrimero{
	background-image: url(../img/IMG_100223.png);
	background-position: center top;
	background-size: cover  ;

}
.fondoSegundo{
	background-image: url(../img/IMG_110223.png);
	background-position: center center;
	background-size: cover ;

}
.fondoTercero{
	background-image: url(../img/IMG_120223.png);
	background-position: center center;
	background-size: cover ;


}


.texto1{
	
	font-size: 1.5em;
	color: #fff;
	z-index: 6;
	font-weight: bold;
	font-family: 'Oswald', sans-serif;
	justify-content: center;
	margin-bottom: 1em;

}
.texto2{
	font-size: 1em;
	top: 322px;
	left: 330px;
	z-index: 7;
	color: #fff;
	font-family: 'Roboto', sans-serif;
}
.fondo{
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;

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

	.slider_arrow{
		height: 45px;
		width: 45px;
	}

}
@media screen and (max-width: 425px){
	
	.slider_arrow{
		height: 32px;
		width: 32px;
	}	
}


/*slider deslizante*/

.container_des{
	width:84%;
	
	display:flex;
	justify-content: center;
	align-items: center;
	margin: auto;
	
	
}
.box{
	
	width:21em;
	height:30em;
	background-color:#230938;
	border-radius: 10px;
	box-shadow: 2px 10px 12px rgba(0,0,0,0.5);
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	margin: 20px 10px;
	border-top-right-radius: 80px;
	border-bottom-left-radius: 80px;
}
.contenidos_del_slider{
	margin-top:1.5em;
	text-align: center;
}
.model{
	height: 18em;
	max-height: 100%;
	max-width: 100%;
	padding-left: 20px;
	border-radius:1em;

}
.details{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 300px;
	white-space : normal;
}
.details p{
	font-family: calibri;
	font-weight: bold;
	color:#fff;
	text-align: center;
	margin-top: 2em;
	width: 100%;
	padding-left: 3px;
}
.marvel{
	color:#fff;
	font-weight: bold;
	letter-spacing: 2px;
	font-family: 'Open Sans', sans-serif;
	font-size: 22px;
}
.box:hover{
	background-color: #4F166D;
	transform-style: preserve-3d;
	transform: scale(1.02);
	transition: all ease 0.3s;
}
.box:hover .marvel{
	color:#A2A2A2;
	transition: all ease 0.5s;
}


@media screen and (max-width:720px){
	.box{
		width: 18em;
		height: 20em;
		
	}
	.model{
		height:250px;
	}
	.details p{
		font-size: 16px;
	}
	.details p{
		font-size: 16px;
		width: 100%;
		
	}
	.marvle{
		width: 100%;
		font-size: 16px;
	}
	.container_des{
		width: 100%;
		margin: auto;
	}
	
}
@media screen and (max-width: 881px){
	.container_des{
		margin-top: 10px;
	
	}
	.marvel{
		font-size: 20px;
	}
	.contenidos_del_slider{
		margin-top:1.5em
	}


}
@media screen and (max-width:414px){
	.box{
		width: 100vw;
		height: 500px;
		word-wrap: break-word;

	}
	.model{
		height:250px;
	}
	.container_des{
		width: 100%;

	}

	.details p{
		font-size: 16px;
		width: 100%;
		
	}
	.marvle{
		width: 100%;
	}
}


@media screen and (max-width:720px){
	.box{
		width:18em;
		height:25em;

	}
	.model{
		height:250px;
	}
	.details p{
		font-size: 16px;
	}
	.details p{
		font-size: 16px;
		width: 100%;
		
	}
	.marvle{
		width: 100%;
		font-size: 16px;
	}
	.container_des{
		width: 100%;
		margin: auto;
	}
	
}
/*.mesa {
    background: rgba(66 , 62, 55, 0.7);
    backdrop-filter: blur( 5px );

    height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    z-index: 5000;*/
}
/* estilos del svg con animacion */
/*
.mesaImagen {
    background-image: url("../img/ortopedia.svg");
    height: 20em;
    width: 15em;
    align-items: center;
    justify-content: center;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    position: absolute;*/
     
}
.sslider-items{ 
    width: 6em;
    align-items: center;
    justify-content: center;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.imagenMesa{
    background-image: url("../img/consultorio2.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 15em;
    height: 26em;
    border: 0.1em solid #e5e4e6;
    margin-top: 50px auto 0;
    box-shadow: 0 8px 10px 0 rgba(0, 0, 0, 0.37);
    display:flex;
    align-items: end;
    justify-content: center;
    position: relative;
    animation: slide 13s infinite alternate ease-in-out;
    
}
.imagenMesa:hover{
  transform: scale(1.65);
  cursor: pointer;
}
@keyframes slide{
  0%{margin-left:  0%;}
  20%{margin-left: 0%;}

  50%{margin-left: -500%;}
  50%{margin-left: -500%;}
}

/*.comunicado2{
  background-image: url("../img/Comunicado proceso de evaluacion.png");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 22em;
  height: 23em;
  border: 0.5em solid #e5e4e6;
  box-shadow: 0 8px 10px 0 rgba(0, 0, 0, 0.37);

  display:flex;
  align-items: end;
  justify-content: center;
  position: relative;*/



.imagenCovid{
   background-image: url("../img/mesacovid.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 20em;
    height: 25em;
    border-radius: 1em;
}



.boton{
    margin: .1em;
    color: hsl(0, 0%, 91%) ;
 
    z-index: 500;
    width:6em;
    height:6em;
    align-self: flex-start;
    /* justify-self: flex-end; */
    /* background-image: url(../img/cerrar.svg);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat; */
    /* margin: 5px; */
    /* padding:10px; */
    font-size:11px;
    line-height:32px;
    text-transform: uppercase;
    /* float:right; */
    position: absolute;
    left:3%;
    
    display: grid;
    place-content: center;
  }
  .boton:hover{
    color: #e199fc;
  }
  .boton a{
    color:#fff;
    text-decoration:none;
    padding:5px 5px 5px 0;
  }
/*  */
.clickBoton{
  height:3em;
  width: 9em;
  /* border:1px solid blue; */
  z-index: 300;
  background: linear-gradient(90deg, #9400D3 0%, #4B0082 100%);
  border-radius:2em;
  margin-bottom:.6em;
  margin-top: 600%;
  margin-left: 2%;
  display:flex;
  align-items:center;
  justify-content: center;
  
  /* background-color: #4B0082; */
}
.clickBoton:hover {
  background: linear-gradient(90deg, #DA22FF 0%, #9733EE 100%);
}

.clickBotonImagem{
  background-image: url("../img/Group 106.svg");
  width: 90%;
  height: 90%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  
}

.clickBotonImagem1{
  background-image: url("../img/clickaqui.svg");

  
}
  .sslider {
 
    position: relative;
    overflow: hidden;
  }
  
  .sslider .sslider-items .itemm {
    display: none;
  }
  
  .sslider .sslider-items .itemm img {
 
  }

  
  
  .sslider .next-button,.previous-button {
    /* color: #FFF; */
    background: linear-gradient(90deg, #9400D3 0%, #4B0082 100%);
    padding: .5em;
    border-radius: 50%;
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    font-size: 1.4rem;
    /* top: 50%; */
    /* transform: translateY(-50%); */
    /* position: absolute; */
    /* line-height: 20px; */
    box-shadow: 0px 0px 10px rgb(78, 78, 78);
    cursor: pointer;
    /* margin-left: 0.5em; */
    /* transition: ease all 5s; */
    /* display: flex;
    justify-content: center;
    align-items: center; */
  }

 
  
  .sslider .next-button:hover,.previous-button:hover {
    background: linear-gradient(90deg, #DA22FF 0%, #9733EE 100%);
  }
  
  .siguiente{
    background-image: url("../img/siguiente.svg");
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
  }
  .anterior{
    background-image: url("../img/anterior.svg");
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
  }

  .container_botones{
    
    display: flex;
    justify-content: center;
    align-self: center;
    /* margin-top: -5em; */
  }

  .sslider .next-button {
    right: 10px;
  }
  
  .sslider .previous-button {
    left: 10px;
  }
  
  .sslider .sslider-items .itemm.active {
    display: block;
  }
  
  @keyframes zoom {
    0% {transform: scale(2);opacity: 0}
    50% {transform: scale(2);}
    100% {transform: scale(1);opacity: 1}
  }
  
  .sslider .sslider-items .itemm .caption {
    position: absolute;
    width: 100%;
    height: 50px;
    background-color: rgba(0,0,0,.6);
    left: 0;
    bottom: 0;
    color: #FFF;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  



/*  */

  @media screen and (max-width: 991px) {
   
    .imagenMesa{
    
       display:flex;
       align-items: flex-end;
       justify-content: center;
       position: relative;
     
       
   }
   
.boton{
  margin: .1em;
  color: hsl(0, 0%, 91%) ;

  z-index: 500;
  width:6em;
  height:6em;
  align-self: flex-start;
  /* justify-self: flex-end; */
  /* background-image: url(../img/cerrar.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat; */
  /* margin: 5px; */
  /* padding:10px; */
  font-size:11px;
  line-height:32px;
  text-transform: uppercase;
  /* float:right; */
  position: absolute;
  left:7%;
  
  display: grid;
  place-content: center;
}

.mesaImagen {
  /* background-image: url("../img/mesa.png");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; */
  height: 29em;
  width: 85%;
  display: flex;
  align-items: center;
  justify-content: center;
  /* position: absolute; */
  
 
}



.imagenMesa{
   background-size: cover;
   background-position: center center;
   background-repeat: no-repeat;
   width: 18em;
   height: 23em;
   /* border: 0.5em solid #e5e4e6; */
   box-shadow: 0 8px 10px 0 rgba(0, 0, 0, 0.37);

   display:flex;
   align-items: end;
   justify-content: center;
   position: relative;
 
   
}
  }

/* COPYRIGHT- CODING WITH NICK*/

/* # ⚙️ Technology Used
1. HTML
2. CSS
3. javaScript

# 🎓 Access this vedio
[Click Here] https://www.youtube.com/channel/UCsseF0Swqs5FsXXtEXo1m_A

## 👏 Support Developer
1. Subscribe & Share my YouTube Channel - https://www.youtube.com/channel/UCsseF0Swqs5FsXXtEXo1m_A
2. Add a Star 🌟  to this 👆 Repository */

/************************************************/



* {
    box-sizing: border-box
}
body {
    font-family: Verdana, sans-serif; margin:0
}
.mySlides-banner-Principal {
    display: none
}


/* Slideshow container */

.slideshow-container-banner {
  
  max-width: 100%;
  position: relative;
  margin: auto;
  /* border: 5px solid blue; */
  display:flex;
  align-items:flex-end;
  justify-content: center;
  /* margin-top: 4em; */
}

/* Next & previous buttons */
.previo, .nextt {
  cursor: pointer;
  position: absolute;
  top: 40%;
  padding: .8em;
  color: white;
  margin: 1em;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}
.fondo-banner01{
  height:85vh;
  width: 100vw;
  background-image: url(../img/bannerc5.jpg);
  background-size: cover;
  background-position: center center;
}

.fondo-banner02{
  height:93vh;
  width: 98vw;
  background-image: url(../img/bannerc8.png);
  background-size: cover;
  background-position: center center;
}

.fondo-banner03{
  height:95vh;
  width: 100vw;
  background-image: url(../img/bannerc7.jpg);
  background-size: cover;
  background-position: center center;
}

.slogan-banner{
  position:absolute;
  left:0;
  align-self: center;
  background: rgba(134, 134, 134, 0.61);
  color: #f2f2f2;
  font-family: "open sans";
  width: 38%;
  padding:1.5em;
  display: grid;
  place-content: center;
  justify-content:center;
  align-items: center;
  margin-left: 5.5em;
  margin-top: 3em;
  

}

/* Position the "next button" to the right */
.nextt {
  right: 0;

  color: #f2f2f2;
  /* border: 1px solid red; */
}
.previo {
  left: 0;

  color:#f2f2f2;
  /* border: 1px solid red; */

}

/* On hover, add a black background color with a little bit see-through */
.previo:hover, .nextt:hover {
  color: #DA22FF;
}

/* Caption text */

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The puntos/bullets/indicators */
.contenedor-puntos{
  /* border: 1px solid red; */
  /* z-index: 400; */
  position: absolute;
  

}

.puntoss {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background: white;

  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.actives, .puntoss:hover {
  background: linear-gradient(90deg, #DA22FF 0%, #9733EE 100%);

}

/* Fading animation */
.fades {
  -webkit-animation-name: fades;
  -webkit-animation-duration: 1.5s;
  animation-name: fades;
  animation-duration: 1.5s;
}

@-webkit-keyframes fades {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fades {
  from {opacity: .4} 
  to {opacity: 1}
}


@media screen and (max-width: 991px) {
   
  .fondo-banner01{
    height:70vh;
    width: 100vw;
    background-image: url(../img/bannerc7.jpg);
    background-size: cover;
    background-position: center center;
  }
  
  .fondo-banner02{
    height:70vh;
    width: 100vw;
    background-image: url(../img/bannerc5.jpg);
    background-size: cover;
    background-position: center center;
  }
  
  .fondo-banner03{
    height:70vh;
    width: 100vw;
    background-image: url(../img/bannerc6.jpg);
    background-size: cover;
    background-position: center center;
  }
  .slogan-banner{
  
    width: 45%;
    padding:1.5em;
  
    margin-left: 4em;
    margin-top: 3em;
    
  
  }
  .previo, .nextt {
    cursor: pointer;
    position: absolute;
    top: 50%;
    padding: .1em;
    color: white;
    margin: .6em;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
  }
  
 }

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .previo, .nextt,.text {font-size: 11px}
.puntoss{
 height: 10px;
  width: 10px;
}
}
@media only screen and (max-width: 500px) {
  .prev, .next,.text {font-size: 14px}
}