.ventana{
  background-color:rgb(229, 248, 248);
  width:900px;
  padding: 10px 20px;
  margin: 10% auto;
  position: relative;
}
.modal{
  background-color: rgba(0,0,0,.8);
  position:fixed;
  top:-100px;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
}
#IrVentanaFlotante:target{
  opacity:1;
  pointer-events:auto;
}

@media screen and (max-width: 400px) and (min-width: 100px) {
  .ventana  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:350px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 600px) and (min-width: 400px) {
  .ventana  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:450px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 800px) and (min-width: 600px) {
  .ventana  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:620px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1000px) and (min-width: 800px) {
  .ventana  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:820px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1200px) and (min-width: 1000px) {
  .ventana  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:920px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
/* Financiero */
.ventana_financiero{
  background-color:rgb(229, 248, 248);
  width:900px;
  padding: 10px 20px;
  margin: 10% auto;
  position: relative;
}
.modal_financiero{
  background-color: rgba(0,0,0,.8);
  position:fixed;
  top:-100px;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
}
#InfoFinanciero:target{
  opacity:1;
  pointer-events:auto;
}
@media screen and (max-width: 400px) and (min-width: 100px) {
  .ventana_financiero  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:350px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 600px) and (min-width: 400px) {
  .ventana_financiero  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:450px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 800px) and (min-width: 600px) {
  .ventana_financiero  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:620px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1000px) and (min-width: 800px) {
  .ventana_financiero  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:820px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1200px) and (min-width: 1000px) {
  .ventana_financiero  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:920px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}

/* Criminalistica */
.ventana_criminalistica{
  background-color:rgb(229, 248, 248);
  width:900px;
  padding: 10px 20px;
  margin: 10% auto;
  position: relative;
}
.modal_criminalistica{
  background-color: rgba(0,0,0,.8);
  position:fixed;
  top:-100px;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
}
#InfoCriminalistica:target{
  opacity:1;
  pointer-events:auto;
}

@media screen and (max-width: 400px) and (min-width: 100px) {
  .ventana_criminalistica  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:350px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 600px) and (min-width: 400px) {
  .ventana_criminalistica  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:450px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 800px) and (min-width: 600px) {
  .ventana_criminalistica  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:620px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1000px) and (min-width: 800px) {
  .ventana_criminalistica  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:820px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1200px) and (min-width: 1000px) {
  .ventana_criminalistica  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:920px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
/* Gestion Humana */
.ventana_gestionH{
  background-color:rgb(229, 248, 248);
  width:900px;
  padding: 10px 20px;
  margin: 10% auto;
  position: relative;
}
.modal_gestionH{
  background-color: rgba(0,0,0,.8);
  position:fixed;
  top:-100px;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
}
#InfoGestionH:target{
  opacity:1;
  pointer-events:auto;
}
@media screen and (max-width: 400px) and (min-width: 100px) {
  .ventana_gestionH  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:350px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 600px) and (min-width: 400px) {
  .ventana_gestionH  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:450px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 800px) and (min-width: 600px) {
  .ventana_gestionH  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:620px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1000px) and (min-width: 800px) {
  .ventana_gestionH  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:820px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1200px) and (min-width: 1000px) {
  .ventana_gestionH  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:920px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
/* Veterinaria */
.ventana_veterinaria{
  background-color:rgb(229, 248, 248);
  width:900px;
  padding: 10px 20px;
  margin: 10% auto;
  position: relative;
}
.modal_veterinaria{
  background-color: rgba(0,0,0,.8);
  position:fixed;
  top:-100px;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
}
#InfoVeterinaria:target{
  opacity:1;
  pointer-events:auto;
}
@media screen and (max-width: 400px) and (min-width: 100px) {
  .ventana_veterinaria  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:350px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 600px) and (min-width: 400px) {
  .ventana_veterinaria  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:450px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 800px) and (min-width: 600px) {
  .ventana_veterinaria  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:620px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1000px) and (min-width: 800px) {
  .ventana_veterinaria  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:820px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
@media screen and (max-width: 1200px) and (min-width: 1000px) {
  .ventana_veterinaria  {
    top: 10%;
    background-color:rgb(229, 248, 248);
    width:920px;
    padding: 10px 20px;
    margin: 10% auto;
    position: relative;
  }
}
