/************************
  HEADER
************************/
body {
    font-family: 'Jura', sans-serif;
    /*font: 1.5em Helvetica;*/
    background: #CCCCCC;
    overflow-x: hidden;
    /*font-family: Monserrat,serif;*/
    }
  
/* Impares */
tr:nth-child(odd):hover {
    background-color:#EBF8FC;
}
/* Pares */	
tr:nth-child(even):hover {  
    background-color:#EBF8F4;
} 
.ocultar {
  display:none;
}
.box img{
    width: auto;
    height: 100%;
}
.box2 img{
    width: 100%;
    height: auto;
}
.contenedor_botonera_PC {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-content: flex-start;
}
.contenedor_botonera_MOVIL {
  /*width: 33.33%;*/
  display: flex;
  flex-direction: row;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: flex-start;
  /*flex-flow: row;*/
  /*align-items: stretch;
  align-content: flex-start;*/
}
.boton_oculto {
  display: none;
}
.gradiente1,.gradiente2,.gradiente3,.gradiente4,.gradiente5,.gradiente6 {
  font-family: 'Electrolize', sans-serif;
}

.gradiente1 {                                                     /*  lila => blanco */
  background: -webkit-gradient(linear, left top, left bottom, from(#f9beed), to(white));
	background: -moz-linear-gradient(center top , #f9beed, white 18px) repeat scroll 0 0 transparent;
	background: -o-linear-gradient(center top , #f9beed, white 18px) repeat scroll 0 0 transparent;
	background: -ms-linear-gradient(center top , #f9beed, white 18px) repeat scroll 0 0 transparent;
	background: linear-gradient(center top , #f9beed, white 18px) repeat scroll 0 0 transparent;
	font-weight: bold;
  text-align: center;
  vertical-align: middle;
  padding:5px 10px;
  cursor: hand;
  color: brown;
  border-radius: 0.2em;-moz-border-radius: 0.2em;-webkit-border-radius: 0.2em;
  flex: auto;
  max-width:100%; font-size:1em; overflow:hidden;
}
.fondo1 {
  background: #f9beed;
}
.gradiente1:hover {                                               /*  blanco => lila */
  background: -webkit-gradient(linear, left top, left bottom, from(white), to(#f9beed));
	background: -moz-linear-gradient(center top , white 12px, #f9beed 25px) repeat scroll 0 0 transparent;
	background: -o-linear-gradient(center top , white 12px, #f9beed 25px) repeat scroll 0 0 transparent;
	background: -ms-linear-gradient(center top , white 12px, #f9beed 25px) repeat scroll 0 0 transparent;
	background: linear-gradient(center top , white 12px, #f9beed 25px) repeat scroll 0 0 transparent;
	text-decoration: none;
    color: #f36f21;
}
.gradiente2 {
  background: -webkit-gradient(linear, left top, left bottom, from(#d1ebf7), to(white));
  background: -moz-linear-gradient(center top , #d1ebf7, white 18px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , #d1ebf7, white 18px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , #d1ebf7, white 18px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , #d1ebf7, white 18px) repeat scroll 0 0 transparent;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  padding:5px 10px;
  cursor: hand;
  color: #888;
  border-radius: 0.2em;-moz-border-radius: 0.2em;-webkit-border-radius: 0.2em;
  cursor: hand;
  flex: auto;
  max-width:100%; font-size:1em; overflow:hidden;
}
.fondo2 {
  background: #d1ebf7;
}
.gradiente2:hover {
  background: -webkit-gradient(linear, left top, left bottom, from(white), to(#d1ebf7));
  background: -moz-linear-gradient(center top , white 12px, #d1ebf7 25px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , white 12px, #d1ebf7 25px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , white 12px, #d1ebf7 25px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , white 12px, #d1ebf7 25px) repeat scroll 0 0 transparent;
  text-decoration: none;
  color: blue;
}
.gradiente3 {
  background: -webkit-gradient(linear, left top, left bottom, from(#d1ebf7), to(lightblue));
  background: -moz-linear-gradient(center top , #d1ebf7, lightblue 18px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , #d1ebf7, lightblue 18px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , #d1ebf7, lightblue 18px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , #d1ebf7, lightblue 18px) repeat scroll 0 0 transparent;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  padding:5px 10px;
  cursor: hand;
  color: #888;
  border-radius: 0.2em;-moz-border-radius: 0.2em;-webkit-border-radius: 0.2em;
  cursor: hand;
  flex: auto;
  max-width:100%; font-size:1em; overflow:hidden;
}
.fondo3 {
  background: #d1ebf7;
}
.gradiente3:hover {
  background: -webkit-gradient(linear, left top, left bottom, from(lightblue), to(white));
  background: -moz-linear-gradient(center top , lightblue 12px, white 25px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , lightblue 12px, white 25px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , lightblue 12px, white 25px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , lightblue 12px, white 25px) repeat scroll 0 0 transparent;
  text-decoration: none;
  color: blue;
}
.gradiente4 {
  /* verde  => blanco */
  background: -webkit-gradient(linear, left top, left bottom, from(#defb91), to(white));
  background: -moz-linear-gradient(center top , #defb91, white 18px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , #defb91, white 18px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , #defb91, white 18px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , #defb91, white 18px) repeat scroll 0 0 transparent;
  /*border: 1px solid #BBBBBB;*/
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  padding:5px 10px;
  color: brown;
  border-radius: 0.2em;-moz-border-radius: 0.2em;-webkit-border-radius: 0.2em;
  cursor: hand;
  flex: auto;
  max-width:100%; font-size:1em; overflow:hidden;
}
.fondo4 {
  background: #ffffd6; /* naranja palido */
}
.gradiente4:hover {                                           /* blanco => verde */
  background: -webkit-gradient(linear, left top, left bottom, from(white), to(#defb91));
  background: -moz-linear-gradient(center top , white 12px, #defb91 25px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , white 12px, #defb91 25px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , white 12px, #defb91 25px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , white 12px, #defb91 25px) repeat scroll 0 0 transparent;
  text-decoration: none;
  color: #f9aa01;
} 
.gradiente5 {
  /* celeste  => blanco */
  background: -webkit-gradient(linear, left top, left bottom, from(#c5f9ff), to(white));
	background: -moz-linear-gradient(center top , #c5f9ff, white 18px) repeat scroll 0 0 transparent;
	background: -o-linear-gradient(center top , #c5f9ff, white 18px) repeat scroll 0 0 transparent;
	background: -ms-linear-gradient(center top , #c5f9ff, white 18px) repeat scroll 0 0 transparent;
	background: linear-gradient(center top , #c5f9ff, white 18px) repeat scroll 0 0 transparent;
	/*border: 1px solid #BBBBBB;*/
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  padding:5px 10px;
  color: #55cc55;
  border-radius: 0.2em;-moz-border-radius: 0.2em;-webkit-border-radius: 0.2em;
  cursor: hand;
  flex: auto;
  max-width:100%; font-size:1em; overflow:hidden;
}
.fondo5 {
  background: #d0f8c9; /* verde claro */
}
.gradiente5:hover {                                           /* blanco => celeste */
	background: -webkit-gradient(linear, left top, left bottom, from(white), to(#c5f9ff));
	background: -moz-linear-gradient(center top , white 12px, #c5f9ff 25px) repeat scroll 0 0 transparent;
	background: -o-linear-gradient(center top , white 12px, #c5f9ff 25px) repeat scroll 0 0 transparent;
	background: -ms-linear-gradient(center top , white 12px, #c5f9ff 25px) repeat scroll 0 0 transparent;
	background: linear-gradient(center top , white 12px, #c5f9ff 25px) repeat scroll 0 0 transparent;
	text-decoration: none;
	color: #008400;  /*  verde oscuro  */
} 
.gradiente6 {											
  /*  blanco y azul   */
  background: -webkit-gradient(linear, left top, left bottom, from(white), to(#cdd9fd));
  background: -moz-linear-gradient(center top , white, #cdd9fd 18px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , white, #cdd9fd 18px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , white, #cdd9fd 18px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , white, #cdd9fd 18px) repeat scroll 0 0 transparent;
  /*border: 1px solid #BBBBBB;*/
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  padding:5px 10px;
  color: #6666ff;
  border-radius: 0.2em;-moz-border-radius: 0.2em;-webkit-border-radius: 0.2em;
  cursor: hand;
  flex: auto;
  max-width:100%; font-size:1em; overflow:hidden;
}
.fondo6 {
  background: #cdd9fd;
}
.gradiente6:hover {
  background: -webkit-gradient(linear, left top, left bottom, from(#cdd9fd), to(white));
  background: -moz-linear-gradient(center top , #cdd9fd 12px, white 25px) repeat scroll 0 0 transparent;
  background: -o-linear-gradient(center top , #cdd9fd 12px, white 25px) repeat scroll 0 0 transparent;
  background: -ms-linear-gradient(center top , #cdd9fd 12px, white 25px) repeat scroll 0 0 transparent;
  background: linear-gradient(center top , #cdd9fd 12px, white 25px) repeat scroll 0 0 transparent;
  text-decoration: none;
  color: #000084; /*  azul oscuro  */
} 
.logo_grande {
  height: 100%; 
  width: 100%;
  display: inline-block;
  background-size: auto 100%;
  background-position:center center;
  background-repeat: no-repeat;
}
.colorblanco {
    height: 34px;
    background-color: white;
    color: #006;
}
.colorcielo {
    height: 34px;
    background-color: #cee;
    color: #006;
}
.colorsalmon {
    height: 34px;
    background-color: #fec;
    color: #804;
}
.fondosalmon {
    background-color: #fec;
}
.fondocielo {
    background-color: #cee;
}
.botonprincipal {
            width:100%;
            padding-top:8px;
            font-weight:bold;
            height:2.8em;
}
.itembotonera {
  min-width:220px;
  max-width:32.3%;
  font-size:1em;
  overflow:hidden;
}
.botonprincipal_movil {
            height:4em;
}
.menuCSS3 ul {
            display: flex;
            padding: 0;
            margin: 0;
            list-style: none;
}
.item {
            display: block;
            padding: 2em;
            background-color: lightgrey;
            text-decoration: none;
            color: grey;
            font-weight: bold;
            width:100%;
            border:1px dotted white;
}
.menuCSS3 .item:hover {
            background-color: lightblue;
            color: brown;
            text-decoration: none;
}
.transparente {
              border-radius: 3px;
              cursor: pointer;
              color:yellow;
              border:2px solid yellow;
              padding:2px 5px 5px 5px;
              opacity:0.8;
              filter:alpha(opacity=80); /* IE < 9.0 */
            }
.tab {
              overflow: hidden;
              border: 1px solid #ccc;
              background-color: #f1f1f1;
              font-family: Arial;
}
            /* Style the buttons inside the tab */
.tab button {
              background-color: inherit;
              float: left;
              border: none;
              outline: none;
              cursor: pointer;
              padding: 14px 16px;
              transition: 0.3s;
              font-size: 1em;
              color: grey;
}
.tabmovil button {
        font-size:0.7em;
}
            /* Change background color of buttons on hover */
.tab button:hover {
              background-color: #ddd;
}
            /* Create an active/current tablink class */
.tab button.active {
              background-color: #ccc;
              color: black;
}
            /* Style the tab content */
.tabcontent {
              display: none;
              padding: 0;/*6px 12px;*/
              /*border: 1px solid #ccc;*/
              border-top: none;
}
.flex {
    /* basic styling */
    min-width: 350px;
    height: 200px;
    border: 1px solid #cdd;
    font: 1em Arial;
    /* flexbox setup */
    display: -webkit-flex;
    -webkit-flex-direction: row;
    display: flex;
    flex-direction: row;
    }

.flex > div {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 30px; /* To make the transition work nicely.  (Transitions to/from
                      "width:auto" are buggy in Gecko and Webkit, at least.
                      See http://bugzil.la/731886 for more info.) */
    -webkit-transition: width 0.7s ease-out;
    transition: width 0.7s ease-out;
    }
#main {
    min-height: 50em;
    margin: 0px;
    padding: 0px;
    display: -webkit-flex;
    display:         flex;
    -webkit-flex-flow: row;
            flex-flow: row;
    }
#main > article {
    width:100%;/*float:left;margin-left:0;*/
    
    padding: 0 10px;
    
    background: white; /*#dddd88; */
   -webkit-flex: 5 1 100%;
           flex: 5 1 100%;
   -webkit-order: 2;
           order: 2;
    }
#main > nav {
    min-height:20em;
    min-width:16em;
    margin: 0px;
    border: 1px solid #cdd; 
    
    background: #f6f8fa; /*#ccccff; */
   -webkit-flex: 1 5 16%;
           flex: 1 5 16%;
   -webkit-order: 1;
           order: 1;
    }
/*#main > aside {
    min-width:17em;
    padding:20px 10px;
    margin: 0px;
    border: 1px solid #cdd;
    background: #eef3fb; 
   -webkit-flex: 1 6 20%;
           flex: 1 6 20%;
   -webkit-order: 3;
           order: 3;
    }*/
#main > nav ul {
    padding: 20px -20px 10px 0px;
    list-style-type: none;
    /*list-style-image: url("");*/
    list-style-position: inside;
    }
#main > nav ul li a {
    text-decoration: none;
    width: 100%;
    margin:0px 0px 10px -20px ;
    padding:5px 10px;
    }
#main > nav ul li a:hover {
    font-weight: bold;
    text-decoration: none;
    }
header, footer {
    display: block;
    margin: 2px;
    padding: 5px;
    /*min-height: 5em; 60pt; */
    border: 3px solid lightgrey;/*#cdd; /*#eebb55; */
    border-radius: 7px;
    background: #7b7977; /*#eef3fb; #ffeebb; */
    }
#cabecera {
    top: 0;
    left: 0;
    width: 100%;
    position: sticky;
    z-index: 100;
}
/*footer {
    height: 3.7em;
}*/
.botonAlta {
    background: white; /*#dddd88; */
    color: blue;
    margin-left:20px;
    padding:4px 6px 3px 5px;
    border:1px solid #8888bb;
    border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;
    text-decoration:none;
}
.datepicker:invalid {
    border-color: red;
}
.datepicker:valid {
    border-color: #ccc;
}
.botonAlta:hover {
    font-weight: bold;
    border:1px solid blue;
    text-decoration: none;
}
.fondo1 {
    background:url(images/fondo.jpg) repeat fixed;
    -webkit-background-size:cover;
    background-size:cover;
}
 
/* Too narrow to support three columns */
@media all and (max-width: 999px) {
    
    input {
        font: 4em Helvetica;
    }
    
    #panelcontrol {
        font: 4em Helvetica;
        margin-top:-1em;
    }
    
    #main, #page {
        font: 3em Helvetica;
        -webkit-flex-flow: column;
        flex-flow: column;
    }

    #main > article, #main > nav, #main > aside {
        /* Return them to document order */
        -webkit-order: 0;
        order: 0;
    }
  
    /*#main > nav, #main > aside, footer {
        min-height: 400pt;
        max-height: 400pt;
    }*/
    #main > nav, #main > aside {
        min-height: 400pt;
        max-height: 400pt;
    }
    
    footer {
        font: 2em Helvetica;
    }
    
    main > h3 {
        font: 4em Helvetica;
    }
    .col-25, .col-75, input[type=submit] {
                width: 100%;
                margin-top: 0;
              }
}
    


/************************
  MAIN CONTENTS
************************/
* {
    box-sizing: border-box;
    }
input[type=text], select, textarea {
              width: 100%;
              padding: 12px;
              border: 1px solid #ccc;
              border-radius: 4px;
              resize: vertical;
            }
label {
              padding: 12px 12px 12px 0;
              display: inline-block;
            }
input[type=submit] {
              background-color: #4CAF50;
              color: white;
              padding: 12px 20px;
              border: none;
              border-radius: 4px;
              cursor: pointer;
              float: right;
            }
input[type=submit]:hover {
              background-color: #45a049;
            }
.container {
              width: 100%;
              background-color: white; /* #f2f2f2; */
              padding: 0;
              margin: 0;
              /*float: left;*/
            }
.col-5 {
              float: left;
              width: 5%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
}
.col-10 {
              float: left;
              width: 10%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
}
.col-15 {
              float: left;
              width: 15%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-20 {
              float: left;
              width: 20%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-20L {
              float: left;
              width: 20%;
              margin-top: 6px;
              padding-right:10px;
              padding-left:10px;
            }
.col-25 {
              float: left;
              width: 25%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-30 {
              float: left;
              width: 30%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-30L {
              float: left;
              width: 30%;
              margin-top: 6px;
              padding-right:10px;
              padding-left:10px;
            }
.col-33 {
              float: left;
              width: 33.33%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-40 {
              float: left;
              width: 40%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-40L {
              float: left;
              width: 40%;
              margin-top: 6px;
              padding-right:10px;
              padding-left:10px;
            }
.col-50 {
              float: left;
              width: 50%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-60 {
              float: left;
              width: 60%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-66 {
              float: left;
              width: 66.66%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-70 {
              float: left;
              width: 70%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-75 {
              float: left;
              width: 75%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-80 {
              float: left;
              width: 80%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-90 {
              float: left;
              width: 90%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }
.col-100 {
              float: left;
              width: 100%;
              margin-top: 6px;
              padding-right:0px;
              padding-left:0px;
            }

/* Clear floats after the columns */
.row:after {
              content: "";
              display: table;
              clear: both;
            }
/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
              
            }
#dos {
	border: none; 
	color: black;
	padding: 30px 45px;
	background-color: white; /*#eee5de;*/
	font-size: 1em;
	text-align: center;
	/*border-collapse: collapse;*/
	box-shadow: 6px 6px 3px gray;
	-moz-box-shadow: 6px 6px 3px gray;
    -webkit-box-shadow: 6px 6px 3px gray;
    -ms-box-shadow: 6px 6px 3px gray;
	border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    }
#dos th	{
	text-align: center;
	padding: 10px 200px;
	}

/* Impares */
#dos tr:nth-child(odd):hover {
    background-color:#EBF8FC;
}
/* Pares */	
#dos tr:nth-child(even):hover {  
    background-color:#EBF8F4;
} 

#tres	{
	border:1px solid #000;
	border-collapse:collapse;
	font-family:Arial, Sans-Serif;
	font-size:14px;
	text-align:center;
	}
#tres th	{
	text-align: center;
	border:1px solid #000;
	padding: 6px 12px;
	}
#tres td	{
  text-align: center;
	border:1px solid #000;
	padding:6px 12px;
	}
#tres tr:hover {
  background-color: #EBF8FC;
  }
    
#cuatro { 
	color: black;
	padding: 30px 45px;
	background-color: white; /*#eee5de;*/
	font-size: 1em;
	text-align: center;
	border:1px solid gray;
  }
#cuatro th, td	{
	text-align: center;
	padding: 10px 20px;
	border:1px solid gray;
	}

/* Impares */
tr:nth-child(odd):hover {
  background-color:#EBF8FC;
}
/* Pares */	
tr:nth-child(even):hover {  
  background-color:#EBF8F4;
} 

.cuadrodos {
    padding: 20px;
    box-shadow: 6px 6px 3px gray;
	-moz-box-shadow: 6px 6px 3px gray;
    -webkit-box-shadow: 6px 6px 3px gray;
    -ms-box-shadow: 6px 6px 3px gray;
	border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
}
.btn:hover {
    background:white;
    color: black;
} 
.page-contents {
    /*background-size:cover;*/
    padding: 0px;
    width: 100%;
    margin: auto;
    text-align: center;
    max-width: 150rem;
}
.ContenedorSlide {
    background-size:cover;
    border: none;
    margin-top: 30px;
    margin-left: -15px;
    margin-right: -15px;
    max-width: 150rem;
}
.cuerpotexto {
    /*border: 1px solid lightgray;*/
	color: black;
  	width: 100%;  /* 95.2%*/
  	height: auto;
  	display: inline-block;
  	margin: 5pt 30pt 5pt 5pt;
  	text-decoration: none;
  	/*font-size: 1em;*/
  	max-width: 150rem;
}
.cuerpotexto p {
    color: #333;
}
/*
.nav li a{
    background:#7f7f7f;
    font-weight:bold;
    color: black;
    font-family: 'Barlow Semi Condensed',sans-serif;
    letter-spacing: 1px;
}*/
.dropdown:hover > ul {
    background:#7f7f7f;
    display:block;
    margin:0;
}
.dropdown > ul {
    background:#7f7f7f;
    margin:0;
    color: black;
    font-family: 'Barlow Semi Condensed',sans-serif;
    letter-spacing: 1px;
}
.dropdown > ul li a:hover {
    background: #aaa;
    margin:0;
}


.subraye1:after {
        position: absolute;
        bottom: 0.9em;
        left: 50px;
        width: 10%;
        height: 4px;
        background-color: blue;/*#FFD743;*/
        content: "";
        opacity: 0;
        transition: left 0.3s ease 0s, width 0.3s ease 0s, opacity 0.3s ease 0s, transform 0.3s ease 0s;
        transform: translateY(0px);        
}
.subraye1:hover:after{
        opacity:1;
        left:0px;
        width: 100%;
        transform: translateY(0px)
}
/* =================== */


.imgLugar5 {
    font-size: 0;
    text-align: center;
}
.imgLugar5 .imgResponsiva {
    display: inline-block;
    font-size: inherit;
}
.imgResponsiva {
    width: 20%; 
    max-width: 250px;
    padding: 10px;
}
.imgResponsiva img {
    width: 100%;
    height: 200px;
    border-radius: 6px 6px 6px 6px;
    -moz-border-radius: 6px 6px 6px 6px;
    -webkit-border-radius: 6px 6px 6px 6px;
    border: 2px solid #e7f2ff;
}

.logoCliente {
    width: 150px;
    height: 150px;
    background-position: center;
    background-size: cover;
    border-radius: 6px 6px 6px 6px;
    -moz-border-radius: 6px 6px 6px 6px;
    -webkit-border-radius: 6px 6px 6px 6px;
    border: 2px solid #e7f2ff;
}
.botonmenos {
    background: #0b1983;
    color: white;
    width: 130px;
    font-weight: bold;
    padding: 8px 15px;
    border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    text-decoration: none;
    box-shadow: 3px 3px gray; 
    -moz-box-shadow: 3px 3px gray;
    -webkit-box-shadow: 3px 3px gray;
}
.botonmas {
    color: black;
    font-weight: bold;
    letter-spacing: 1px;
    width: 130px;
    background: lightgray;
    padding: 8px 15px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    text-decoration: none;
    box-shadow: 2px 2px gray;
    -moz-box-shadow: 2px 2px gray;
    -webkit-box-shadow: 2px 2px gray;
}
.botonmas:hover {
    background: #0b1983;
    color: white;
    text-decoration: none;
}

.facturaonline {
    margin-left:10px;
    color:white;
    padding:5px 10px 4px 10px;
    border:2px solid black;
    border-radius: 6px 6px 6px 6px;
    -moz-border-radius: 6px 6px 6px 6px;
    -webkit-border-radius: 6px 6px 6px 6px;
    box-shadow: 2px 2px lightgray inset;
    text-shadow: -2px -2px black;
}

.cajasombraC1 {
-webkit-box-shadow: 7px 7px 2px -1px rgba(141,142,143,0.95);
-moz-box-shadow: 7px 7px 2px -1px rgba(141,142,143,0.95);
box-shadow: 7px 7px 2px -1px rgba(141,142,143,0.95);
}
.sombraE1 {
    text-shadow: 4px 4px  blue;
    /*text-shadow: 1px 1px black,
                -1px 1px black,
                -1px -1px black, 
                 1px -1px black;*/
    
                
}
.sombraE2 {
    text-shadow: 4px 4px  #740694;

}
.sombraE3 {
    text-shadow: 2px 2px 3px #f00,
               4px 4px 5px #f00,
               6px 6px 7px #0f0; /*   #0f0 , #00f;*/
}
.sombraE4 {
    text-shadow: 1px 1px 2px blue,
               2px 2px 3px lightblue,
               3px 3px 4px lightblue;
}
.sombraE6 {
/*    text-shadow: 2px 2px 1px black,
                -2px 2px 1px black,
                -2px -2px 1px black, 
                 2px -2px 1px black;*/
    text-shadow: 3px 3px 2px black,
                -3px 3px 2px black,
                -3px -3px 2px black, 
                 3px -3px 2px black;
}
.sombraE7 {
    text-shadow: 3px  3px 3px white,
                -3px  3px 3px white,
                -3px -3px 3px white, 
                 3px -3px 3px white;
}
.sombraE8 {
    text-shadow: 3px 3px 4px white;
}
.sombraE9 {
    text-shadow: 1px 1px 2px black,
                -1px 1px 2px black,
                -1px -1px 2px black, 
                 1px -1px 2px black
}
.cajaBar {
    color:black;
    /*font-family:'Barlow Semi Condensed',sans-serif;*/
    letter-spacing:2px;
}

[data-tooltip-bottom]:hover,
[data-tooltip-left]:hover,
[data-tooltip-right]:hover,
[data-tooltip]:hover {
	position: relative;
}
[data-tooltip-bottom]:hover::after,
[data-tooltip-left]:hover::after,
[data-tooltip-right]:hover::after,
[data-tooltip]:hover::after {
	all: initial;
	display: inline-block;
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;		  
	border-top: 10px solid #1a1a1a;
	position: absolute;
	bottom: 100%;
	content: '';
	left: 50%;
	transform: translate(-50%, 0);
	margin-bottom: 5px;
}
[data-tooltip-right]:hover::after {
	margin-bottom: 0;
	bottom: auto;
	transform: rotate(90deg) translate(0, -50%);
	left: 100%;
	top: 50%;
	margin-left: -5px;
	margin-top: -5px;
}
[data-tooltip-left]:hover::after {
	margin-bottom: 0;
	bottom: auto;
	transform: rotate(-90deg) translate(0, -50%);
	left: auto;
	right: 100%;
	top: 50%;
	margin-right: -5px;
	margin-top: -5px;
}
[data-tooltip-bottom]:hover::after {
	margin-bottom: 0;
	bottom: auto;
	transform: rotate(180deg) translate(-50%, 0);
	top: 100%;
	margin-left: -20px;
	margin-top: 5px;
}
[data-tooltip-bottom]:hover::before,
[data-tooltip-left]:hover::before,
[data-tooltip-right]:hover::before,
[data-tooltip]:hover::before {
	all: initial;
	/*font-family: Arial, Helvetica, sans-serif;*/
	display: inline-block;
	border-radius: 5px;
	padding: 10px;
	background-color: #1a1a1a;
	content: attr(data-tooltip);
	color: #f9f9f9;
	position: absolute;
	bottom: 100%;
	width: 250px;
	left: 50%;
	transform: translate(-50%, 0);
	margin-bottom: 15px;
	text-align: center;
	font-size: 1.5em;
	font-weight: bold;
}
[data-tooltip-right]:hover::before {
	margin-bottom: 0;
	bottom: auto;
	transform: translate(0, -50%);
	left: 100%;
	top: 50%;
	content: attr(data-tooltip-right);
	margin-left: 15px;
}
[data-tooltip-left]:hover::before {
	margin-bottom: 0;
	bottom: auto;
	transform: translate(0, -50%);
	left: auto;
	right: 100%;
	top: 50%;
	content: attr(data-tooltip-left);
	margin-right: 15px;
}
[data-tooltip-bottom]:hover::before {
	margin-bottom: 0;
	bottom: auto;
	top: 100%;
	content: attr(data-tooltip-bottom);
	margin-top: 15px;
}


