.d-tit {
    top: 0px;
    background-color: #6192c0;
    background-image: url(DELATE.gif);
    background-repeat: no-repeat;
    background-position: right;
    /*background-position:right;
    background-repeat:no-repeat;*/
    color: White;
    font-family: Verdana;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    font-size: 1.1em;
    height: 28px;
    width: 100%;
    text-transform: uppercase;
    margin: 0px 0px 1px 0px;
    text-shadow: 2px 2px 4px #000000;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

    li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
    }

        /* Change the link color to #111 (black) on hover */
        li a:hover {
            background-color: #111;
        }




.sidenav {
    height: 100%;
    width: 0%;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #0073EB; /* #111;*/
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color:Black; /*#818181 ;*/
    display: block;
    transition: 0.3s;
    
}

.sidenav a:hover, .offcanvas a:focus{
    color:navy; /* #f1f1f1;*/
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}







.modal
        {
            position: fixed;
            z-index: 999;
            height: 100%;
            width: 100%;
            top: 0;
            background-color: Gray;
            filter: alpha(opacity=60);
            opacity: 0.6;
            -moz-opacity: 0.8;
        }
.center
{
    z-index: 1000;
    margin: 300px auto;
    padding: 10px;
    width: 130px;
    background-color: White;
    border-radius: 10px;
    filter: alpha(opacity=100);
    opacity: 1;
    -moz-opacity: 1;
}
.center img
{
    height: 128px;
    width: 128px;
}

/* Overlay para toda la pantalla*/

.overlay {
    
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1; 
    left: 0;
    top: 0;
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0, 0.9); 
    overflow-x: hidden; 
    transition: 0.5s; 
}


.overlay-content {
    position: relative;
    top: 25%; 
    width: 100%; 
    text-align: center;
    margin-top: 30px;
}

.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #818181;
    display: block;
    transition: 0.3s; 
}


.overlay a:hover, .overlay a:focus {
    color:black;/* #f1f1f1;*/
}


.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .overlay .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }
}




/* Semejante a overlay con alguna modificación*/

/* Overlay2 para toda la pantalla*/

.overlay2 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    overflow-x: hidden;
    transition: 0.5s;
}


.overlay2-content {
    position: relative;
    top: 0%;
    width: 100%;
    text-align: center;
    margin-top: 0px;
}

.overlay2 a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #818181;
    display: block;
    transition: 0.3s;
}


    .overlay2 a:hover, .overlay2 a:focus {
        color: black; /* #f1f1f1;*/
    }


.overlay2 .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay2 a {
        font-size: 20px
    }

    .overlay2 .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }
}








.espan
{
    font-size:30px;cursor:pointer; color:Black;
}






td
{
    vertical-align:top;
}


.tabla-cab {
    background: White;
    text-transform: uppercase;
    text-align: center;
    padding-left: 1px;
    color: #1682ba;
    font-size: .7em;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-decoration: underline;
}

.tabla-td {
    background: White;
    text-transform: uppercase;
    text-align: left;
    padding-left: 3px;
    color: #0073EB; /*#1682ba;*/
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    padding-top:6px:
}



.tabla-ddl
{
  font-size:11px;
  font-family    : Arial, Helvetica, sans-serif;
  color          :Navy;
  padding-left        :  3px;
  border-left    :  solid 1px #c1c1c1;
  border-top     :  solid 1px #cfcfcf;
  border-right   :  solid 1px #cfcfcf;
  border-bottom  :  solid 1px #cfcfcf;
  }

.tabla-ddl-el {
    height: 20px;
    font-size: 8px;
    font-family: Arial, Helvetica, sans-serif;
    color: Navy;
    padding-left: 3px;
    border-left: solid 1px #c1c1c1;
    border-top: solid 1px #cfcfcf;
    border-right: solid 1px #cfcfcf;
    border-bottom: solid 1px #cfcfcf;
    width: 99%;
    background-color:beige;
}

    .tabla-ddl:focus {
        border-color: #0073EB;
        color: Navy;
        background-color: #D9FCFC;
    }


.tabla-drop {
    color: Navy;
    height: 20px;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    padding: 1px;
    
}

    .tabla-drop:focus {
        border-color: #646464;
        background-color: #D9FCFC;
        border: 1px solid #0073EB;
    }

.tabla-drop-el {
    color: Navy;
    height: 20px;
    font-size: 8px;
    font-family: Arial, Helvetica, sans-serif;
    padding: 1px;
    background-color:beige;
}

    .tabla-drop-el:focus {
        border-color: #646464;
        background-color: #D9FCFC;
        border: 1px solid #0073EB;
    }

.tabla-td-menor {
    background: White;
    text-transform: uppercase;
    text-align: left;
    padding-left: 3px;
    color: #0073EB;  /* #1682ba;*/
    font-size: 8px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
}



.tabla-ddl-menor {
   
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    color: Navy;
    padding-left: 3px;
        width: 99%;
}

    .tabla-ddl-menor:focus {
        border-color: #0073EB;
        color: Navy;
        background-color: #D9FCFC;
    }


.tabla-drop-menor {
    color: Navy;
   
    font-size: 8px;
    font-family: Arial, Helvetica, sans-serif;
    width: 99%;
}

    .tabla-drop-menor:focus {
        border-color: #0073EB;
        background-color: #D9FCFC;
        border: 1px solid #0073EB;
    }



.tabla_pocos_datos {
    position: absolute;
    width: 60%;
    left: 20%;
    height: 80%;
    top: 10%;
    border: solid 2px Navy;
    border-top: solid 5px Navy;
}



    .cuadro-div {
    position: absolute;
    top: 4%;
    text-align: center;
    height: calc(95%);
    z-index: 100;
    left: 280px;
    width: calc(95% - 250px);
    background-color: White;
    border-top: 2px solid #0073EB;
    overflow: hidden;
    border-left: 1px solid #0073EB;
    border-right: 1px solid #0073EB;
    border-bottom: 1px solid #0073EB;
    /*border-radius:10px;*/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: auto;
    padding: 0;
    margin: 0;
}




.cuadro-izq {
    position: absolute;
    top: 4%;
    text-align: center;
    height: 95%;
    z-index: 100;
    left: 1%;
    width: 250px;
    background-color: White;
    border-top: 2px solid #0073EB;
    overflow: hidden;
    border-left: 1px solid #0073EB;
    border-right: 1px solid #0073EB;
    border-bottom: 1px solid #0073EB;
    /*border-radius:10px;*/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: auto;
    padding-top: 100px;
}

.cuadro-izq-gen {
    position: absolute;
    top: 20px;
    text-align: center;
    height: 95%;
    z-index: 100;
    left: 1%;
    width: 300px;
    background-color: White;
    border-top: 12px solid #0073EB;
    overflow: hidden;
    border-left: 4px solid #0073EB;
    border-right: 1px solid #0073EB;
    border-bottom: 4px solid #0073EB;
    /*border-radius:10px;*/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: auto;
}

.cuadro-div-gen {
    position: absolute;
    top: 20px;
    text-align: center;
    height: 95%;
    z-index: 100;
    left: 320px;
    width: calc(98% - 290px);
    background-color: White;
    border-top: 12px solid #0073EB;
    overflow: hidden;
    border-left: 4px solid #0073EB;
    border-right: 4px solid #0073EB;
    border-bottom: 4px solid #0073EB;
    /*border-radius:10px;*/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: auto;
    padding: 0;
    margin: 0;
    /*width:80vw; height:90vh;*/
}

.cuadro-iframe
{
    position:absolute; top:90px; width:100%; height:calc(98% - 85px); overflow:auto; text-align:left;
}

.cuadro-int {
    border: 2px solid #0073EB;
    position: relative;
    top: 3%;
    height: 85%;
    width: 98%;
    left: 1%;
    overflow: auto;
    border: 2px solid #0073EB;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}     





 
  




              
.paramensajes
{
border-spacing:5px;
background-color:transparent;
text-align:center;
/*border-radius:15px;*/
box-shadow: 0 10px 13px rgba(0,0,0,0.6);
position:fixed;
z-index:9999;
top:0;
left:0;
width:100%;
height:100%;
vertical-align:middle;
}






.botex {
    background-color: White;
    background-image: url('puntos.jpg');
    background-position: left;
    background-repeat: no-repeat;
    color: #0073EB;
    font-weight: bold;
    font-size: 14px;
    font-family: Arial;
    border: 1px solid #0073EB;
    text-align: left;
    padding-left: 35px;
}



.botex:hover
{
color:lightblue;
background-image:url('puntos.jpg');
background-position:left;  
background-repeat:no-repeat;
cursor:pointer;   
}


.botexmini {
    background-color: White;
    background-image: url('puntos.jpg');
    background-position: left;
    background-repeat: no-repeat;
    color: #0073EB;
    font-weight: bold;
    font-size: 10px;
    font-family: Arial;
    border: 1px solid #0073EB;
    text-align: left;
    padding-left: 35px;
    height: 20px;
}



    .botexmini:hover {
        color: lightblue;
        background-image: url('puntos.jpg');
        background-position: left;
        background-repeat: no-repeat;
        cursor: pointer;
    }


        


body{ background-color:White;}



.mGrid { width: 100%; background-color:#fff ; margin: 5px 0 10px 0; border: solid 1px #525252; border-collapse:collapse; font-size:.7em; font-family: Arial; }
.mGrid .alt { background: #fcfcfc url(V_grd_alt.png) repeat-x top; }
.mGrid .sel { background-color:#002765; font-weight:400; color:White; }
.mGrid .ft { background: #fcfcfc url(ASPA.JPG) repeat-x top; margin: 5px 0 10px 0; border: solid 1px #525252; border-collapse:collapse; }


    .mGrid td { padding: 2px; border: solid 1px #c1c1c1; color: #717171; }
    .mGrid th { color: #fff; background: #424242 url(grd_head.png) repeat-x top; border-left: solid 1px #525252; font-size: 0.9em; }

/*.mGrid .pgr {background: #424242 url(grd_head.png) repeat-x ;  }*/
.mGrid .pgr { background-image: url(V_grd_foot.png); background-repeat:repeat-x  repeat-y ;   }
    .mGrid .pgr table { margin: 5px 0; border:none; }
    .mGrid .pgr td { border-style:none; border-width: 0; padding: 0 6px;  font-weight: bold; color: #fff; line-height: 12px; }   
    .mGrid .pgr a { color: #666; text-decoration: none; }
    .mGrid .pgr a:hover { color: #000; text-decoration: none; }
    
    
.Grid
{ width: 100%; background-color:#fff ; margin: 5px 0 10px 0; 
        border: solid 1px #525252; border-collapse:collapse; font-size:.7em; font-family: Arial; }

/*.Grid .head2 { background-image: url(V_grd_head.png); height:25px; background-repeat:repeat-x  repeat-y ; color:White; font-weight:bold;   }*/
        
        .Grid .head2 { background-color:#002765; color:White;font-weight:bold;   }

    .grid table {
        border: solid 1px #0073EB;
        height: 30px;
    }

    .grid th {
        background: transparent url(thbackground.gif) repeat;
        height: 19px;
        border: solid 1px #0073EB;
        font-weight: normal;
    }

    .grid td {
        border: 1px solid #0073EB;
        color: Black;
        height: 25px;
    }
        
        .pagerstyle 
        {
	        font-size:x-small;
	        text-align:right;
            background-position: bottom left;
            background: #D0DEF0 url(toolbarbck.gif) repeat-x scroll left top;
        }

        .gopag 
        {
            font-size:x-small;
            width:20px;
        }

        .pagprev
        {
            background:transparent url(previous.png) no-repeat scroll center;
            height:1.3em;
            width:16px;
            cursor:pointer;
            border:0;
        }
        
        .pagnext
        {
            background:transparent url(next.png) no-repeat scroll center;
            height:1.3em;
            width:16px;
            cursor:pointer;
            border:0;
        }

        .pagfirst
        {
            background:transparent url(first.png) no-repeat scroll center;
            height:1.3em;
            width:16px;
            cursor:pointer;
            border:0;
        }
        
        .paglast
        {
            background:transparent url(last.png) no-repeat scroll center;
            height:1.3em;
            width:16px;
            cursor:pointer;
            border:0;
        }


        .Grid .alt { background: #fcfcfc url(V_grd_alt.png) repeat-x top; }
        
        /*.Grid .pgr { background-image: url(V_grd_foot.png); background-repeat:repeat-x  repeat-y ;   }*/
        .Grid .pgr { background-color:White; color:Black; font-weight:bold; border:1px solid Navy;}
        .Grid .pgr table { margin: 5px 0; border:none; }
        .Grid .pgr td { border-style:none; border-width: 0; padding: 0 6px;  font-weight: bold; color: #fff; line-height: 12px; }   
        .Grid .pgr a { color: #666; text-decoration: none; }
        .Grid .pgr a:hover { color: #000; text-decoration: none; }
        .Grid .sel { background-color:#D8D8D8; font-weight:400; color:Black; }
        
        
        

.Grid th
{
    color: #fff;
    background-color:Navy;/*:#3AC0F2;*/
}
/* CSS to change the GridLines color */
.Grid, .Grid th, .Grid td
{
    border:1px solid  #fff000;
}


.FixedHeader {
            position: absolute;
            font-weight: bold;
            margin-bottom:500px;
            background-color:Navy;
            color:White;
            border:1px solid White;
            height:25px;
            font-size:18px;
        }  
        
  

    
    .btes{
		 border:1px solid Green; padding-right:30px; height:20px; cursor:auto;display: block;
		 }
		 
		 .btes:hover
		 {
		     background-color:Black; color:White; cursor:pointer;
		}





ul.acorh,
ul.acorh * {
    margin: 0;
    padding: 0;
    border: 0;
}

ul.acorh {
    margin: 10px auto;
    padding: 0;
    list-style: none;
    width: 99%;
    font-size: 15px;
}

    ul.acorh li {
        list-style: none;
    }

        ul.acorh li a {
            display: block;
            padding: 10px 10px 10px 20px;
            /*  background: #333;*/
            color: White; /* #eee;*/
            border-bottom: 1px solid #000;
            border-top: 1px solid #666;
            text-decoration: none;
            box-sizing: border-box;
        }

        ul.acorh li ul {
            max-height: 0;
            margin: 0;
            padding: 0;
            list-style: none;
            overflow: hidden;
            transition: .3s all ease-in;
        }

        ul.acorh li li a {
            padding: 10px 10px 10px 40px;
            /*  background: #999;*/
            color: white; /* #000;*/
            font-size: 16px;
            border: 0;
            border-bottom: 1px solid #ccc;
            box-sizing: border-box;
        }

ul.acorc li li:last-child a {
    border-bottom: 0;
}

ul.acorh li:hover ul {
    max-height: 300px;
    transition: .3s all ease-in;
}

ul.acorh li a:hover {
    /* background: #666;*/
    color: #fff;
}



.header {
    padding: 2px;
    text-align: center;
    background: #0073EB;
    color: white;
}

    .header h1 {
        font-size: 16px;
    }

/* Style the top navigation bar */
.topnav1 {
    overflow: hidden;
    background-color: #333;
}

    /* Style the topnav links */
    .topnav1 a {
        float: left;
        display: block;
        color: #f2f2f2;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
    }

        /* Change color on hover */
        .topnav a:hover {
            background-color: #ddd;
            color: black;
            cursor: pointer;
        }
.topnav {
    overflow: hidden;
    background-color: #333;
    font-size:12px;
}
.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 4px 6px;
    text-decoration: none;
}

    /* Change color on hover */
    .topnav a:hover {
        background-color: #ddd;
        color: black;
        cursor: pointer;
    }



/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

.imgb {
    top: 10px;
    Height: 10px;
    margin-right: 5px;
    padding-top: 15px;
}



.mid li a {
    font-family: Arial;
    font-size: 11px;
    text-decoration: none;
    float: left;
    padding: 10px;
    background-color: #2175bc;
    color: #fff;
}

.mid {
    padding: 0;
}

.mid li {
    display: inline;
}

.mid li a:hover {
    background-color: #2586d7;
    margin-top: -2;
    padding-bottom: 12px;
    
}

.bt {
    border: none;
    background: #0073EB;
    color: #f2f2f2;
    padding: 5px;
    font-size: 12px;
    border-radius: 5px;
    position: relative;
    box-sizing: border-box;
    transition: all 500ms ease;
}

    .bt:before {
        content: '';
        position: absolute;
        top: 0px;
        left: 0px;
        width: 0px;
        /*height: 30px;*/
        background: rgba(255,255,255,0.3);
        border-radius: 5px;
        transition: all 2s ease;
    }

    .bt:hover:before {
        width: 100%;
    }



.btn-group button {
    /*  background-color: transparent;
    border: 1px solid #0073EB;
    color: Black;*/ /*#818181 ;*/
    /*   padding: 5px 5px;
    cursor: pointer;
    width: 80%;
    display: block; 
    font-size: 1.1em;
    left: 10%;
    text-align: left;*/
    border: none;
    border: 2px solid White;
    background: #0073EB;
    color: white;
    padding: 5px;
    font-size: 12px;
    border-radius: 5px;
    position: relative;
    box-sizing: border-box;
    transition: all 500ms ease;
    display: block;
    left: 10%;
    text-align: left;
    width: 90%;
}

    .btn-group button:not(:last-child) {
        border-bottom: none;
    }


    .btn-group button:hover {
        background-color: lightblue;
    }


.radioboxlist radioboxlistStyle {
    font-size: 11px;
    padding-right: 10px;
}

.radioboxlist label {
    color: #0073EB;
    font-size: 11px;
    /*background-color:#E8E5D4;*/
   /* padding-left: 6px;
    padding-right: 16px;
    padding-top: 2px;
    padding-bottom: 2px;
    /*border: 1px solid #AAAAAA;*/
    white-space: nowrap;
    clear: left;
    margin-right: 10px;
    margin-left: 10px;
    font-family: Arial Verdana sans-serif;
}

    .radioboxlist label:hover {
        color: #CC3300;
        /*background: #D1CFC2;*/
    }

input:checked + label {
    color: #0073EB;
    font-size: 11px;
    font-family: Arial Verdana sans-serif;
    color: #0073EB;
    /*background: #D1CFC2;*/
}


.container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #0073EB;
    font-size: 15px;
    font-family: Arial Verdana sans-serif;
    color: #0073EB;
    text-transform: uppercase;
}

    /* Hide the browser's default checkbox */
    .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: White; /* #eee;*/
    border: solid 1px Black;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}