body{
    /*
    	mix-blend-mode: multiply;
	background:rgba(163,144,124,0.50);
    */
font-family: 'Open Sans Condensed', sans-serif;
}
h1, h2, h3, h4,h5, h6, p{
font-family: 'Open Sans Condensed', sans-serif;}
.multiplicar{
    
    	mix-blend-mode: multiply;
	background:rgba(72,14,24,0.50);
}
html {
    scroll-behavior: smooth;
}
.suave {

    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth; // Added in from answer from Felix
    overflow-x: scroll;

}
.malaspruebas{
    transition: 4s;
    transition-timing-function: ease;
    -webkit-transition-timing-function: ease;

    -webkit-transition: all 3s ease-in;
    -moz-transition: all 3s ease-in;
    -o-transition: all 3s ease-in;
    -ms-transition: all 3s ease-in;
    transition: all 3s ease-in;

    transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    -webkittransform: translateY(0px);
    -ms-transform: translateY(0px);
}
.enlaceazul{
	color:#03C;
	}
.enlacenaranja{
	color:#E65C00;
}
.enlacecolor{
	color:#063;
}
.fotogramas{

    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.fotogramas img{
}
.menu-mik a {

    display: block;
}
.destaca {
    border-left: 1px solid darkorange;
    border-bottom: 1px solid darkorange;
    border-radius: 30px 0 0 50px;
    padding-left: 20px;
    padding-bottom: 5px;
}
.lineadecorativa{
    width: 100%;
    height: 1px;
    background-color: darkorange;
    text-align: center;
    color: darkorange;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border:0px;

}
.lineadecorativa:before{
    content: " ᵒ^ᵒ ";
    color:#FFFFFF;
    
    width: 10px;
    height: 6px;
    
    border: 2px solid darkorange ;
    background-color: darkorange;
    -webkit-border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px 15px 15px 15px;
    border-radius: 15px 15px 15px 15px;
            -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
}

.lineadecorativa:hover:before{
    border: 6px solid #03C;
    background-color: #03C;
    width: 20px;
    height: 20px;
    transform: scale(1.2);
    position: relative;
    top:-7px;
}
.lineadecorativa40{
    width: 30%;
    height: 3px;
    margin-left: 35%;
    margin-right: 35%;
    background-color: darkorange;
    text-align: center;
    color: darkorange;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border:0px;
}
.lineadecorativatitulo{
    width: 9%;
    height: 5px;
    background-color: #0F4987;
    color: #0F4987;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border:0px;
    -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
}
.lineadecorativatitulo:hover{
    width: 69%;
}
.lineadecorativatitulo:hover:after{
    content: " ᵒ-ᵒ ";
     width: 10px;
    height: 6px;
    color:#FFFFFF;
    border: 2px solid #0F4987 ;
    background-color: #0F4987;
    -webkit-border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px 15px 15px 15px;
    border-radius: 15px 15px 15px 15px;
            -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
}
hr::before{
width:  7%;
height: 4px;
background-color: darkorange;
color: darkorange;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
border:0px;
}
.portadaboton, .portadaboton:active, .portadaboton:focus{
    background: rgba(45,115,135,0.4);
}
.portadaboton:hover{
    background: rgba(45,115,135,0.8);
}
p{
	  font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}
.f-topbar-fixed {
    padding-top: 40px;
}
.ojos{
    margin-top: -8px;
}
/*
a:visited::before{
   content: "\\2713 (visitado) ";
}	  
a:visited::after{
   content: "\\2713 (visitado) ";
}	  
*/
.top-bar-section ul li:last-child a{
font-size: 9px;
}
.top-bar{
    /*background:rgba(255,140,0,0.9);
    background:#000;*/
    -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
}
.top-bar:hover{
    
    background: #b8b8b8;
    
}
.top-bar-section ul li a:first-letter{
/* font-size: 12px; */
    color: darkorange;
}
.button{
    border-radius: 5px 5px 5px 5px;
}
.success{
    background:#e2e2e2;
}
.equipogris{
	-webkit-filter: grayscale(1);
	filter:gray;
}
.equipogris:hover{
	-webkit-filter: grayscale(0);
	filter:none;
}
section.galeria { 
   padding: .5vw;
   font-size: 0;
   -ms-flex-wrap: wrap;
   -ms-flex-direction: column;
   -webkit-flex-flow: row wrap; 
   flex-flow: row wrap; 
   display: -webkit-box;
   display: flex;
   display: -ms-flexbox; /*IE 10*/
   margin: 5% ;
}
section.galeria div { 
   -webkit-box-flex: auto;
   -ms-flex: auto;
   flex: auto; 
   width: 200px; 
   margin: .5vw; 
}
section.galeria div img { 
   width: 100%; 
   height: auto; 
   mix-blend-mode: multiply;
}
section.galeria div img:hover {
        mix-blend-mode: multiply;
   	-webkit-filter: grayscale(1);
    position: relative;
	-webkit-box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
	-moz-box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
	box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
	transform: scale(1.25);
	border:0;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
	z-index:15;
        overflow: hidden;
        
}
section.galeria div img:active {
    -webkit-filter: grayscale(0);
	filter:none;
    position: relative;
	-webkit-box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
	-moz-box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
	box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
	transform: scale(2.25);
	border:0;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
	z-index:15;
        overflow: hidden;
        
}
section.galeria div img:not(:last-child):hover{
    transform: scale(0.90);
}
.prebola{
     content: "";
	background: #dadada; /* Fallback */	
	background: -moz-linear-gradient(bottom, #9c9c9c, rgba(255,255,255,0) );
	background: -webkit-gradient(linear, left bottom, right top, from(#9c9c9c), color-stop(100%, rgba(255,255,255,0))); 
	height: 70px;
	width: 1px;
	display: block;
	margin: 0 auto;
        margin-left: 45px;
        padding-top:0px;
        
 }
 .bola:before
{
	content: "";

	background: #fff; /* Fallback */	
	background: -moz-linear-gradient(left, #fff, #9c9c9c, #fff, #9c9c9c );
	background: -webkit-gradient(linear, left center, right center, from(#fff), color-stop(25%, #9c9c9c), color-stop(50%, #fff), color-stop(75%, #9c9c9c)); 
	
	-moz-border-radius: 2px;
	border-radius: 2px;
	
	-moz-box-shadow: 0 1px 0 rgba(0,0,0,0.2), 0 -1px 0 rgba(255,255,255,0.3) inset;
	box-shadow: 0 1px 0 rgba(0,0,0,0.2), 0 -1px 0 rgba(255,255,255,0.3) inset;
	-webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.2), 0 -1px 0 rgba(255,255,255,0.3) inset;
	
	border: 1px solid #dadada ;
	height: 10px;
	width: 20px;		
	position: absolute;
	left: 50%;
	top: -12px;
	margin-left: -10px;

}

 .bola{
     
     width: 90px;
     height: 90px;
     border-radius: 90px;
     background: #1A90B7;
     color:#95c262;
     z-index: 2000;
     padding-top: 30px;
     text-align: center;
     -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
    box-shadow: 0 0 5px #777;
-moz-box-shadow: 0 0 5px #777;
-webkit-box-shadow: 0 0 5px #777;
background-color: #4d8d00;
background-image: -webkit-radial-gradient(50% 50%, circle, #FFFFFF, #1A90B7 70%);
background-image: -moz-radial-gradient(50% 50%, circle, #FFFFFF, #1A90B7 70%);
background-image: -o-radial-gradient(50% 50%, circle, #FFFFFF, #1A90B7 70%);
background-image: radial-gradient(50% 50%, circle, #FFFFFF, #1A90B7 70%);
z-index: 2;
transform: scale(0.9);
 }
 .bola:hover, .bola:nth-child(even):hover, .bola:nth-child(odd):hover{
     /*background: #65b32e;
     background-color: #006934;
     background-image: -webkit-radial-gradient(50% 50%, circle, #d1e5b2, #65b32e 70%);
background-image: -moz-radial-gradient(50% 50%, circle, #d1e5b2, #65b32e 70%);
background-image: -o-radial-gradient(50% 50%, circle, #d1e5b2, #65b32e 70%);
background-image: radial-gradient(50% 50%, circle, #d1e5b2, #65b32e 70%);
     */
     color:#006934;
     transform: scale(0.8);
      

     z-index: 3;
    

 }

.bola:nth-child(even){
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
}
.bola:nth-child(odd){
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}
.bola a{
    color:#FFFFFF;
}
 .contenedorbolas{
 -ms-flex-wrap: wrap;
   -ms-flex-direction: column;
   -webkit-flex-flow: row wrap; 
   flex-flow: row wrap; 
   width: 100%;
   height: 100%;
   display: -webkit-box;
   display: flex;
   display: -ms-flexbox; /*IE 10*/
   z-index: 2;
   padding-bottom: 50px;
   
 }
.contenedorbolasp{
 -ms-flex-wrap: wrap;
   -ms-flex-direction: column;
   -webkit-flex-flow: row wrap; 
   flex-flow: row wrap; 
   width: 60%;
   height: 100%;
   display: -webkit-box;
   display: flex;
   display: -ms-flexbox; /*IE 10*/
   z-index: 155;
   padding-bottom: 50px;
   
   position: absolute;
   transform: scale(0.5);
   top:15px;
   
   
 }
 
 video.fullscreen { 
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  transform: translate(-50%, -50%);
}
/* lo quitado del flip*/
/*	.flip-container:hover .flipper, .flip-container.hover .flipper {
		transform: rotateY(180deg);
	}

.flip-container, .front, .back {
	width: 350px;
	height: 320px;
}


.flipper {
	transition: 0.6s;
	transform-style: preserve-3d;

	position: relative;

}


.front, .back {
	backface-visibility: hidden;

	position: absolute;
	top: 0;
	left: 0;
background:#FFFFFF;
}
.front {
	z-index: 2;
	transform: rotateY(0deg);
}
*/


/* entire container, keeps perspective */
.flip-container {
/*	position: relative;
	float:left;
*/
	perspective: 1000px;
	transform-style: preserve-3d;
}
	/* flip the pane when hovered */


/* back, initially hidden panel */
.back {
	transform: rotateY(180deg);
}

/*aqui */
/*  UPDATED! flip the pane when hovered */
	.flip-container:hover .back {
		transform: rotateY(0deg);
	}
	.flip-container:hover .front {
	    transform: rotateY(180deg);
	}

.flip-container, .front, .back {
	width: 320px;
	height: 350px;
}

/* flip speed goes here */
.flipper {
	transition: 0.6s;
	transform-style: preserve-3d;

	position: relative;
}

/* hide back of pane during swap */
.front, .back {
	backface-visibility: hidden;
	transition: 0.6s;
	transform-style: preserve-3d;

	position: absolute;
	top: 0;
	left: 0;
}

/*  UPDATED! front pane, placed above back */
.front {
	z-index: 2;
	transform: rotateY(0deg);
}

/* back, initially hidden pane */
.back {
	transform: rotateY(-180deg);
}

/* 
	Some vertical flip updates 
*/
.vertical.flip-container {
	position: relative;
}

	.vertical .back {
		transform: rotateX(180deg);
	}

	.vertical.flip-container:hover .back {
	    transform: rotateX(0deg);
	}

	.vertical.flip-container:hover .front {
	    transform: rotateX(180deg);
	}

.flip-opacity {
background:url("/hospital/galeriahospital/mini/IM027097.JPG");
width:377px;
height:300px;
position:relative;
float:left;
/*
-webkit-transition: background-image 3.2s ease-in-out;
transition: background-image 3.2s ease-in-out;
*/
 opacity:1;
   -webkit-transition: opacity 900ms linear;
   -moz-transition: opacity 900ms linear;
   -o-transition: opacity 900ms linear;
   -ms-transition: opacity 900ms linear;
   transition: opacity 900ms linear;
   
   -webkit-transition: background-image 3.2s ease-in-out;
transition: background-image 3.2s ease-in-out;
}

.flip-opacity:hover {
background:url(/hospital/galeriahospital/mini/IM028443.JPG);
 opacity:1;
 /*
   -webkit-transition: opacity 900ms linear;
   -moz-transition: opacity 900ms linear;
   -o-transition: opacity 900ms linear;
   -ms-transition: opacity 900ms linear;
   transition: opacity 900ms linear;
 */
      -webkit-transition: all 3000ms linear;
    -moz-transition: all 3000ms linear;
    -o-transition: all 3000ms linear;
    -ms-transition: all 3000ms linear;
    transition: all 3000ms linear;
}
.flip-opacity img:hover {
opacity:0;
-webkit-transition: background-image 3.2s ease-in-out;
transition: background-image 3.2s ease-in-out;
}	
 

#listaNumeros {
    counter-reset: li; 
    list-style: none; 
    *list-style: decimal; 
    font: 15px ;
    padding: 0;
    margin-bottom: 4em;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
}

#listaNumeros ol {
    margin: 0 0 0 2em; 
}

#listaNumeros {
    list-style-type: none;
    list-style-type: decimal !ie; /*IE 7- hack*/
     
    margin: 0;
    margin-left: 1em;
    padding: 0;
     
    counter-reset: li-counter;
}

#listaNumeros > li{
    position: relative;
    margin-bottom: 1.5em;
    padding: 1.5em;
    background-color: #F2F2F2;
}

#listaNumeros > li:before {
    position: absolute;
    top: -0.3em;
    left: -0.5em;
    width: 1.8em;
    height: 1.2em;
     
    font-size: 2em;
    line-height: 1.2;
    font-weight: bold;
    text-align: center;
    color: #F2F2F2;
    background-color: #000;
     
    transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    z-index: 99;
    overflow: hidden;
     
    content: counter(li-counter);
    counter-increment: li-counter;
}



#listaNumeros2 ol {
    counter-reset: li; 
    list-style: none; 
    *list-style: decimal; 
    padding: 0;
    margin-bottom: 4em;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
}

#listaNumeros2 ol {
    margin: 0 0 0 2em; 
}

#listaNumeros2 {
    list-style-type: none;
    list-style-type: decimal !ie; /*IE 7- hack*/
     
    margin: 0;
    margin-left: 3em;
    padding: 0;
     
    counter-reset: li-counter;
}

#listaNumeros2 > li{
    position: relative;
    margin-bottom: 20px;
    padding: 1em;
    border-left: 2px solid #0F4980;
    background-color: #0F4987;
color:#FFF;
}

#listaNumeros2 > li:before {
    position: absolute;
    top: 0;
    left: -0.95em;
    width: 1em;
 
    font-size: 4em;
    line-height: 1;
    font-weight: bold;
    text-align: right;
    color: #0F4987;
     
    transform: rotate(-25deg);
    -ms-transform: rotate(-25deg);
    -webkit-transform: rotate(-25deg);
    z-index: -99;
    overflow: hidden;
     
    content: counter(li-counter);
    counter-increment: li-counter;
}

#listaNumerosMultiple {
    counter-reset: li; 
    list-style: none; 
    *list-style: decimal; 
    padding: 0;
    margin-bottom: 4em;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
}

#listaNumerosMultiple ol {
    margin: 0 0 0 2em; 
}

#listaNumerosMultiple li{
    position: relative;
    display: block;
    padding: .4em .4em .4em .8em;
    *padding: .4em;
    margin: .5em 0 .5em 2.5em;
    background: #ddd;
    color: #444;
    text-decoration: none;
    transition: all .3s ease-out;   
}

#listaNumerosMultiple li:hover{
    background: #eee;
}   

#listaNumerosMultiple li:before{
    content: counter(li);
    counter-increment: li;
    position: absolute; 
    left: -2.5em;
    top: 50%;
    margin-top: -1em;
    background: #ff8c00;
    height: 2em;
    width: 2em;
    line-height: 2em;
    text-align: center;
    font-weight: bold;
}

#listaNumerosMultiple li:after{
    position: absolute; 
    content: '';
    border: .5em solid transparent;
    left: -1em;
    top: 50%;
    margin-top: -.5em;
    transition: all .3s ease-out;               
}

#listaNumerosMultiple li:hover:after{
    left: -.5em;
    border-left-color: #fa8072;             
}


 /*Media Queries*/
@media only screen and (min-width: 865px) {

    .top-bar-section ul li  a{
        font-size: 14px;
        padding:15px;
    }
         .contenedorbolasp{
        -ms-flex-wrap: wrap;
          -ms-flex-direction: column;
          -webkit-flex-flow: row wrap; 
          flex-flow: row wrap; 
          width: 60%;
          height: 100%;
          display: -webkit-box;
          display: flex;
          display: -ms-flexbox; /*IE 10*/
          z-index: 155;
          padding-bottom: 50px;

          position: absolute;
          transform: scale(0.4);
          top:15px;


        }
}

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

    .top-bar-section ul li  a{
        font-size: 10px;
        padding:3px;
    }
}
@media screen and (max-width: 740px) {
    .top-bar-section ul li a {
        font-size: 10px;
        padding: 0 2px;
    }
    .top-bar-section ul li:last-child a {
        font-size: 8px;
    }
    .top-bar-section li a:not(.button) {
        padding: 0 9px;
        line-height: 45px;
        background: #333333;
    }
    th {
        border:0;
    }
     .contenedorbolasp{
        -ms-flex-wrap: wrap;
          -ms-flex-direction: column;
          -webkit-flex-flow: row wrap; 
          flex-flow: row wrap; 
          width: 60%;
          height: 100%;
          display: -webkit-box;
          display: flex;
          display: -ms-flexbox; /*IE 10*/
          z-index: 155;
          padding-bottom: 50px;

          position: absolute;
          transform: scale(0.3);
          top:15px;


        }    
}
 @media screen and (max-width: 650px) {
     section.galeria div {
         margin: 0;
     }

     section.galeria {
         padding: 0;
     }
     .top-bar-section ul li a {
         font-size: 9px;
         padding: 5px;
     }
     .th {
         border:0;
     }
     .contenedorbolasp{
        -ms-flex-wrap: wrap;
          -ms-flex-direction: column;
          -webkit-flex-flow: row wrap; 
          flex-flow: row wrap; 
          width: 60%;
          height: 100%;
          display: -webkit-box;
          display: flex;
          display: -ms-flexbox; /*IE 10*/
          z-index: 155;
          padding-bottom: 50px;

          position: absolute;
          transform: scale(0.2);
          top:15px;


        }
 }