@charset "utf-8";

#wrapper {
    max-width: 850px;
    min-width: 200px;
    margin: 0 auto;
    height: auto;
}

h1{
    padding-top: 0px;
    margin-top: 10px;
    //font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    font-family: arial;
}

.logo {
    width: 280px;
    height: 30px;
}

.enlacechico {
    color: #4288AB;
    font-size: 14px;
    text-decoration: none;
}

.textbusqueda{
    border: solid 1px black;
    width: 100%;
    outline: none;
    border-color: #3b87ff;
    height: 22px;
    border-radius: 8px;
}

.selectbusqueda{
    border: solid 1px black;
    border-radius:8px;
    width: 100%;
    outline: none;
    border-color: #3b87ff;
    height: 22px;
}

/* Content containers */
.content-medium{
    background-color:white;
    padding:0px;
    margin: 0px;
    font-size:88%; 
    overflow: visible;
    height: auto;
    min-height: 100%;
}

.cabezera{
    padding-left: 20px;
    padding-top: 15px;
    padding-right: 0px;
    padding-bottom: 30px;
}

.content{
    padding: 5px 13px 5px 13px;
    width: auto;
    background: rgba(254,254,254,254);
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;     
    border-left: #DAD7D7 solid 1px;
    border-right: #DAD7D7 solid 1px;
    border-top: #DAD7D7 solid 1px;
    border-bottom: #DAD7D7 solid 1px;
    margin: 10px 20px 0px 20px;
}

.contentsub{
    padding: 5px 13px 5px 13px;
    background: rgba(254,254,254,254);
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;     
    border-left: #DAD7D7 solid 1px;
    border-right: #DAD7D7 solid 1px;
    border-top: #DAD7D7 solid 1px;
    border-bottom: #DAD7D7 solid 1px;
    margin: 10px 5px 0px 5px;
}


.contentusuario{
    padding: 5px 0px 5px 13px;
    background: rgba(254,254,254,254);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px 0px 0px 10px;     
    border-left: #DAD7D7 solid 1px;
    border-top: #DAD7D7 solid 1px;
    border-bottom: #DAD7D7 solid 1px;
    float: right;
}

.contentusuario2{
    padding: 10px 16px 5px 16px;
    margin-left: 20px;
    margin-right: 20px;
    max-width: 100%;
}

#nav {
    list-style-type: none;
    padding: 0px 20px 0px 20px;
    font-weight: bold;
    font-size: 107%;
    height: 80px;
}

#nav li {
    float: left;
    width: 25%;
}
#nav li a {
    display: block;    
    padding: 10px 0px 8px;
    margin: 0px 6px 14px 6px;    
    text-align: center;
    text-decoration: none;
    color: white;
    background-color: #74abfe;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    font-size: 13px;
}

#nav a:hover, #nav a:active, #nav a:focus {
    background-color:#3b87ff;
    color: #FFF;
}


#nav2 {
    list-style-type: none;
    padding: 0px 0px 0px 0px;
    font-weight: bold;
    font-size: 107%;
    height: auto;
    margin-top: 0px;
}   

#nav2 li {
    width: 100%;
}
#nav2 li a { 
    pointer-events: none;
    display: block;    
    padding: 10px 0px 10px;
    margin: 0px 6px 14px 0px;    
    text-align: center;
    text-decoration: none;
    color: #FFF;
    background-color: #3b87ff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}

.selecttipocaso{
    padding-left: 8px;
    padding-right: 6px;
    padding:0px;
    border: solid 1px #3b87ff;
    border-radius:8px;
    width: 50%;
    height: 25px;
    outline: none;
}



.divusuario{
    color: white;
    float: right;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    height: 25px;
    max-width: 320px;
    background: #4288AB;
    -webkit-border-radius: 8px 0px 0px 8px; 
    -moz-border-radius: 8px 0px 0px 8px;
    border-radius: 8px 0px 0px 8px;  
    border-left: black solid 2px;
    border-top: black solid 2px;
    border-bottom: black solid 2px;    
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.divusuario2{
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    background: #4288AB;
    -webkit-border-radius: 8px; 
    -moz-border-radius: 8px;
    border-radius: 8px;  
    border: black solid 2px;    
    max-width: 200px;
}

.usuarioname{
     overflow:hidden;
    white-space:nowrap;
    text-overflow: ellipsis;
    max-width: 200px;    
}




/* para busquedas  */
#contentsubpadrecasos{
    padding: 0px 20px 5px 20px;      
    margin: 0px 10px 0px 10px;
    overflow: hidden;
}

.divderecha{
    margin-right: 10px;
    float: left;
    width: 27%;
}
.divizquierda{
    float: right;
    width: 67%;
}

.letramediana{
    font-size: 19px;
    font-weight: bold;
    color: #1A4892;
    padding-bottom: 12px;
    padding-top: 8px;
    cursor: pointer;
}

.letramedianamenos{
    padding-top: 0px;
    font-size: 16px;
    font-weight: bold;
    color: #3b87ff;
}



.containercaso{
  width: 500px;
  overflow: hidden;
  text-align: justify;
  font-size: 13px;
  margin-top: 15px;
  margin-bottom: 30px;
}

.referencia{
    text-decoration: none;
}

.referenciacaso{
    //color: #08298A;
    font-weight: bold;
    font-size: 13px;
}

.descripcioncaso{
    //color: #0431B4;
    font-size: 14px;
}

.referenciacasodis{
    color: silver;
    font-weight: bold;
    font-size: 13px;
}

.descripcioncasodis{
    color: silver;
    font-size: 14px;
}



.descripcioncasonegrita{
    color: black;
    font-size: 12px;
}

.descripcioncasonegritadis{
    color: silver;
    font-size: 12px;
}

.descripcioncaso2{
    color: black;
    font-size: 13px;
}

.paginacion{
    text-decoration: none;
    font-size: 12px;
    color: black;
    font-weight: bold;
    border-bottom: 1px solid; 
    padding-bottom: .1em;
    color: #414244;
}

.navegacion{
    color: black; 
    padding-left: 15px;
}

.navegacion li{
    padding-bottom: 5px;
}

.navegacion li a{
    color: #DF0101; 
    text-decoration: none;
    font-size: 16px;
}

.navegacion a:hover, #navegacion a:active, #navegacion a:focus {
    font-weight: bold;
}

.quitar{
    color: #B40404; 
    text-decoration: none;
    font-size: 12px;
    cursor: pointer;
}

.quitar:hover {
    font-weight: bold;
    text-decoration: underline;
}

.letracelestefuerte{
    color: #3b87ff;
    font-weight: bold;
}


#ruta{
    font-size: 14px;
}

#ruta a{
    font-weight: bold;
    text-decoration: none;
    padding-bottom: .0.5em;
    border-bottom: 1px solid;
    color: #3b87ff;
}

.rutadoc{
    font-size: 12px;
}

.rutadoc a{
    color: #3b87ff;
    font-size: 12px;
}

#divpaginacion a{
    text-decoration: none;
    padding-bottom: .0.5em;
    border-bottom: 1px solid;
    color: #1A4892;
    font-weight: bold;
    font-size: 13px;
}

#divpaginacion a:hover, #divpaginacion a:active, #divpaginacion a:focus {
    color: blue;
}

.input1 {
    padding-left: 10px;
    padding-right: 10px;
    border: solid 1px #4288AB;
    border-radius:9px;
    width: 96%;
    height: 30px;
    font-size: 17px;
    _width: 80%;
    _height: 20px;   
    _font-size: 14px;
    outline: none;
}

#buscar {
    list-style-type: none;
    padding: 0px 0px 0px 0px;
    font-weight: bold;
    font-size: 90%;
    margin-top: 7px; 
}

#buscar li {
    width: 110px;
}
#buscar li a {
    display: block;    
    padding: 5px 0px 8px;    
    text-align: center;
    text-decoration: none;
    color: white;
    background-color: #F31D1D;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}
#buscar a:hover, #buscar a:active, #buscar a:focus {
    background-color:#FA5943;
    color: #FFF;
}

.letraceleste{
    color: #3b87ff;
    font-family: Arial, Helvetica, Verdana;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}
.letraceleste:hover, .letraceleste:active, .letraceleste:focus {
    font-weight: bold;
    color: #3b87ff;
    text-decoration: underline;
}

/* aqui termina para busquedas  */


/* Cuando es menor a 480 */
@media only screen and (max-width: 480px) {    
    .content{
        padding: 2px 5px 2px 5px;
        margin: 10px 10px 0px 10px;
    }
    .contentsubpadre{
        padding: 5px 5px 5px 5px;
    }
}

/* Cuando es menor a 820 */
@media only screen and (max-width: 820px) {    
     .containercaso{
        width: 450px;
      }
}

/* cuando es menor a 420 */
@media only screen and (max-width: 420px) {
    .divusuario2{    
        max-width: 100px;
    }

    .usuarioname{
        max-width: 100px;    
    }   
    
    .letramediana{
        font-size: 15px;
    }
}

/* cuando es menor a 550 */
@media only screen and (max-width: 550px) {
    #nav li {
        float: left;
        width: 50%;
    }
    #nav {
        height: 165px;
    }  
    .contentsub{
        padding: 5px 5px 5px 5px;
    }
    
    
}

/* cuando es menor a 760 */
@media only screen and (max-width: 760px) {        
    .contentusuario{
        display: none;        
    }
            
    .logo {
        width: 250px;
        height: 26px;
    }
    
    .containercaso{
        width: 400px;
    }
}

/* cuando es menor a 450 */
@media only screen and (max-width: 450px) {              
    .logo {
        width: 200px;
        height: 20px;
    }
    #contentsubpadrecasos{
        padding: 0px 5px 5px 5px;      
        margin: 0px 5px 0px 5px;
    }
    #divpaginacion a{
        font-size: 11px;
    }
}

/* cuando es mayor a 760 */
@media only screen and (min-width: 760px) {        
    .contentusuario2{
        display:none; 
    }
    .contentusuario{
        float: right;
    }
}

/* cuando es menor a 700 */
@media only screen and (max-width: 700px) {        
    .divderecha{
        float: none;
        width: 100%;
    }
    .divizquierda{
        float: none;
        width: 100%;
    }
    .contentsubpadre{
        height: 450px;
    }
    .contentsubpadrecasos{
        padding: 5px 13px 5px 13px;
    }
    .containercaso{
        width: 340px;
        font-size: 15px;
     }
     .containercaso{
        width: auto;
    }
}

/* cuando es menor a 500 */
@media only screen and (max-width: 500px) {        
    .contentsubpadrecasos{
        padding: 5px 6px 5px 6px;
    }
    .containercaso{
        font-size: 10px;
     }
}

/* cuando es menor a 400 */
@media only screen and (max-width: 400px) {   
    .containercaso{
        font-size: 10px;
     }
     #divpaginacion a{
        font-size: 9px;
    }
    
    .selecttipocaso{
        width: 100%;
    }
}

/* cuando es menor a 350 */
@media only screen and (max-width: 350px) {       
     #divpaginacion a{
        font-size: 8px;
    }
}

/* Cuando esta entre 540 y 699 */
@media only screen and (min-width: 540px) and (max-width: 699px) {    
    
}