/*LAS CLASES DEBEN SER CREADAS CON EL ANTEPONIENDO AL BLOQUE QUE PERTENECE EJEMPLO HOME Hnombreclase*/



.bloque-top{
background-color:rgba(20, 39, 78, 1);
width:100%;
min-height:30px;
z-index:1;
border-bottom:1px solid #f1f6f9 ;

}

.border-left-col{
  border-left:1px solid #f1f6f9;

}




.bloque-white{
    background-color:rgba(255, 255, 255,.9);
    }

.menu{
    z-index: 1;
}

   .menu li {
        display: inline;
      }
      
    .menu ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
      }


.login-register{

text-decoration: none;
font-family:'Varela Round', sans-serif;
font-size:14px;
font-weight:500;
padding:10px;
color:#f1f6f9;
}

.login-register:hover{

    color:#9ba4b4;
    }


.titulo{
font-size:30px;
font-family:'Anton', sans-serif;
font-weight:500;
color: #f1f6f9;
}

.titulo2{
  font-size:30px;
  font-family:'Anton', sans-serif;
  font-weight:500;
  color: #fff;
}
  
  


  .titulo3{
    font-size:18px;
    font-family:'Anton', sans-serif;
    font-weight:500;
    color: #f1f6f9;
    }


    .titulo4{
      font-size:30px;
      font-family:'roboto', sans-serif;
      font-weight:500;
      color: #14274e;
      }
      

      .titulo5{
        font-size:40px;
        font-family:'roboto', sans-serif;
        font-weight:500;
        color: #14274e;
        }
        
  
        .titulo6{
          font-size:20px;
          font-family:'roboto', sans-serif;
          font-weight:500;
          color: #5B6884;
          }
          

          .titulo7{
            font-size:18px;
            font-family:'roboto', sans-serif;
            font-weight:500;
            color: #5B6884;
            }
            
      

    .logo{
        display: block;
   margin:auto;
   width:150px;
   height:150px;
   margin-bottom:5px;
   
   }
   
   .logo img{
   width:100%;
   height:100%;
   overflow: hidden;
   border-radius:100px;
   }


.portada{
  background:url('../img/fondo.jpg')
  no-repeat center center fixed;

width:100%;
height:100%;
display: block;
overflow: hidden;
background-size: cover;
background-position: center 0;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
-moz-object-fit:cover;
object-fit: cover;
/*background-color: rgba(0,0,0,0.9);
filter:brightness(0.7);
*/
}



    


.b-search3:first-child{
  border-right:none;
  border-bottom-left-radius:10px;
  border-top-left-radius:10px;
  }
  
.b-search4:last-child{
  border-left:none;

  }
  .b-buscar{
    max-width:100%;
    width:100%;
   min-width:auto;
    background:#14274e;
    height:80px;
    border-top:1px solid #f1f6f9;
    border-left:0px solid #f1f6f9;
    border-right:1px solid #f1f6f9;
    border-bottom:1px solid #f1f6f9;
    font-family:'Varela Round', sans-serif;
    color:#f1f6f9;
    font-family:Wendy+One;
    font-weight:400;
   font-size:16px;  
   border-bottom-right-radius:10px;
   border-top-right-radius:10px;   
   }

   .b-buscar:hover{
    max-width:100%;
    width:100%;
   min-width:auto;
    background:#394867;
    height:80px;
     border:0px solid #f1f6f9;
    }


   

  .bloque-logo{
    display: block;
    margin-top:20px;
    padding:20px;
   text-align: center; 
  }
  
  .bloque-logo img{
  margin-top:10px;
    max-width:200px;
  max-height:200px;
  margin-bottom: 10px;
  }




.barra-titulo{
  background:#f1f6f9;
  color:#14274e;
  border: 1px solid #f1f6f9;
}


.fondo-barra{
  background:#eeeeee;
  color:#394867;
border:1px solid #eeeeee;
font-size:12px;
font-family:'roboto',sans-serif;
}

.login-foto{

max-width:380px;
max-height:420px;
min-width:280px;
min-height:320px;
overflow: hidden;
border-top-left-radius:5px;
border-bottom-left-radius:5px;

}

.login-foto img{
width:100%;
height:100%;
}






      
      .HM-card-img-icon{
        width:40%;
        height:40%;
      }
   
      .HM-card-img-icon2{
        width:60%;
        height:60%;
      }
   
      .HM-card-catergorias{
        background: #fff;
        border: 1px solid #fff;
        color:#14274e;
        font-size:14px;
        font-family:'roboto', serif;
            }
        
        
  .HM-card-catergorias:hover{
background: #14274e;
color:#fff;
border:1px solid #14274e;
font-weight: 400;

    }


.HM-link{
  color:#14274e;
  font-family:'Varela Round', sans-serif;
font-size: 14px;

}

.info-single{
  background:#fff;
  min-height:300px;
  height:auto;
  border-top:1px solid #DFDFDF;
  border-bottom:1px solid #DFDFDF;
  /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
  color:#5B6884;
  font-size:12px;
  font-family:'roboto', serif;
  text-align:center;
  padding:2%;
  }
  

.HMtext-info-footer{
font-size:12px;
  color:#14274e;
  font-family:'Varela Round', sans-serif;

}


.HMsombra{
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

}

.HMsombra2{
  box-shadow: 4px 0 8px 0 rgba(0, 0, 0, 0.2), 0 0px 2px 0 rgba(0, 0, 0, 0.19);

}

.HMtext-shadow{
  text-shadow: 3px 2px 3px #000;

}



.HMglobe {
	width: 7rem;
	height: 7rem;
	border-radius: 50%;
	background: #14274e;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
  border: 1px solid #fff;
  color:#fff;
}

.HMglobe:hover{
background:#fff;
color:#14274e;
border: 1px solid #14274e;

}


.HMbloquewhite{
  background:#fff;
  height:60px;
  padding:15px;
  border-radius:10px;
  }
  

  .card-oficios{
min-height:80px;
line-height:20px;
  }

.card-manual{
background: #fff;
border: 1px solid #e9ecef;

}


.textobusqueda{
  font-size:20px;
  font-family:'roboto', sans-serif;
  font-weight:500;
  color: #5B6884;
  }



  .pagination {
    display: inline-block;
  }
  
  .pagination a {
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    font-size:16px;
    font-family:'roboto', sans-serif;
border:1px solid #9ba4b4;
border-radius:10px;
background:#fff;
color:#14274E;

  }



.pagination a:hover{
  background: #DFDFDF;
color:#000;
}


  
  .pagination a.active {
    background-color: #14274E;
    color: white;
    border-radius:10px;
    
  }

@media screen and (max-width: 768px) {


  input[type='search']{
 height:40px;
 width:100%;
 font-family:roboto;
 font-size:14px;
 font-weight:500;
 color: #393e46;
 border: 1px solid #e9ecef;
 text-align: center;
 }


 
 input[type=text],
 input[type='password']{
height:auto;
width:100%;
font-family:roboto;
font-size:12px;
font-weight:300;
color: #393e46;
border: 1px solid #e9ecef;
text-align: center;
 }





 .b-buscar{
  max-width:100%;
  width:100%;
 min-width:auto;
  background:#14274e;
  height:40px;
  border-top:1px solid #f1f6f9;
  border-left:0px solid #f1f6f9;
  border-right:1px solid #f1f6f9;
  border-bottom:1px solid #f1f6f9;

  color:#fff;
  font-family:Wendy+One;
  font-weight:400;
 font-size:16px;  
 border-bottom-right-radius:10px;
 border-top-right-radius:10px;   
 }

 .b-buscar:hover{
  max-width:100%;
  width:100%;
 min-width:auto;
  background:#394867;
  height:40px;
   border:0px solid #f1f6f9;
  }




        .logo{
          display: block;
     margin:auto;
     width:100px;
     height:100px;
     margin-bottom:5px;
     padding:0;
     }
     
     .logo img{
     width:100%;
     height:100%;
     overflow: hidden;
     border-radius:100px;
     }



        .bloque-top{
            width:100%;
            min-height:10px;
            
            }


            



    .bloque-logo{
      display: block;
      padding:20px;
      
      
      }
      .bloque-logo img{
      max-width:140px;
      max-height:140px;
      }
      
      .b-buscar{
        border-bottom-left-radius:0px;   
        border-bottom-right-radius:10px;   
        border-top-left-radius:0px;   
        border-top-right-radius:0px;   
        font-family:'Varela Round', sans-serif;

       }
       
           .b-buscar  span{
               display:none;
             
             
             }


             
             
               
           .b-search3:first-child{
               border-right:none;
               border-top-right-radius:10px;
               border-bottom-left-radius:0px;
       
               border-top-left-radius:10px;
               }
       
               
               .b-search4:last-child{
                   border-right:none;
                   border-bottom-right-radius:0px;
                   border-bottom-left-radius:0px;
           
                   border-bottom-left-radius:10px;
                   }
         
    

.menu span{
  display:none;
}     
 


.titulo{
  font-size:20px;
  font-family:'Anton', sans-serif;
  font-weight:500;
  color: #f1f6f9;
  }
  


  
.titulo2{
  font-size:20px;
  font-family:'Anton', sans-serif;
  font-weight:500;
  color: #f1f6f9;
  }
  

  .titulo3{
    font-size:12px;
    font-family:'Anton', sans-serif;
    font-weight:500;
    color: #f1f6f9;
    }
    
    .titulo4{
      font-size:20px;
      font-family:'Anton', sans-serif;
      font-weight:500;
      color: #394867;
      }




      .login-foto{

        max-width:180px;
        max-height:220px;
        min-width:180px;
        min-height:220px;
        overflow: hidden;
        border-top-left-radius:5px;
        border-bottom-left-radius:5px;
        
        }
        
        .login-foto img{
        width:100%;
        height:100%;
        }
        

        .textobusqueda{
          font-size:14px;
          font-family:'roboto', sans-serif;
          font-weight:500;
          color: #5B6884;
          }
          .pagination {
            display: inline-block;
          }
          
          .pagination a {
            color: black;
            float: left;
            padding: 6px 12px;
            text-decoration: none;
            font-size:12px;
            font-family:'roboto', sans-serif;
        border:1px solid #9ba4b4;
        border-radius:10px;
        background:#fff;
        color:#14274E;
        
          }
        
        
        
        .pagination a:hover{
          background: #DFDFDF;
        color:#000;
        }
        
        
          
          .pagination a.active {
            background-color: #14274E;
            color: white;
            border-radius:10px;
            
          }
        

}











