/******************************************************************************/
/******************************************************************************/
/** REGLAS DE ESTILO DE LA CABECERA  **/
/******************************************************************************/
/******************************************************************************/
/** PROPIOS **/
header {
	height: 50px;
	padding: 5px;
	border: none;
	border-radius: 0px;
	background:#b2c0d5;
	position: fixed;
	right: 0;
	left: 0;
	top:  0;
}

.bodylogin header
{
	background:rgba(255,255,255,0.8);
	border:0px;
}

header .container-fluid{
	height: 100%;
	display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
	align-items: center;
}

header .container-fluid > a{
	/* Logo */
	float: left;
	display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
	height: 100%;
	flex-shrink:  0;
	flex-grow: 0;
	align-items: center;
}

header .container-fluid > a img{
	/* Logo Imagen */
	height: 100%;
	width: auto;
	margin-right:20px;
}

header .container-fluid > a img.phone-icon
{
	height:15px !important;
	margin-right: 5px;
}

header .texto-cabecera{	
	/* Texto de la derecha */
	display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
	align-items: baseline;
	color: #4c4c4c;
	margin: 0;
}

header .texto-cabecera, .texto-cabecera h2{
	font-size: 1.2rem;
	margin: 0;
	margin-left:  auto;
}

header .texto-cabecera .telefono,.telefono{	
	color: #4c4c4c;
}

@media (min-width: 768px)
{
	header .texto-cabecera .telefono{	
	margin-right: 1rem;
	padding-right: 1rem;
	border-right: 1px solid #b2c0d5;
	}
}



header .texto-cabecera .telefono:hover,.telefono:hover, 
header .texto-cabecera .telefono:focus,.telefono:focus {
    text-decoration: none;
	color: #4c4c4c;
}

header .texto-cabecera .telefono .fa-phone,.telefono .fa-phone{
	/* Icono del telefono */	
	transform: rotateY(180deg) rotateZ(10deg);
	margin-right: 1rem;
	transition: transform 0.25s;
}

.telefono .fa-phone
{
	margin-right:0.5rem;
}

.idiomas
{
	display: inline-flex;
	align-items: center;
}

.idiomas img 
{
	margin: 3px;
    vertical-align: top;
    width: 20px;
}

header .texto-cabecera .telefono .fa-phone::before,.telefono .fa-phone::before{	
	position: relative;
	top: 0.1rem;
}

header .texto-cabecera .telefono:hover .fa-phone,.telefono:hover .fa-phone{	
	/*transform: rotateY(180deg) rotateZ(-15deg);*/
	top: 0.1rem;
}

header .texto-cabecera .usuario .fas, 
header .cerrar-session .fas{
	/* Todos los iconos de usuario*/	
	position: relative;
	top: 0.1rem;
	font-size: 1.2rem;
	margin-right: 0.25rem;
	transition: all 0.25s;
}

header .cerrar-session:hover, header .cerrar-session:focus{
	text-decoration: none;
	outline: 0;
}

header .cerrar-session:hover .fa-sign-out-alt{
	/* Icono de cerrar sesion 
	transform: translate(0.75rem);*/
}

header .texto-cabecera .usuario .texto-usuario{
	/* Nombre del usuario */	
	margin-right: 1rem;
}

.btn-info
{
	background-color:#00004c !important;
	border-color: #00004c !important;
	
}

.btn-info i
{
	color:#fff;
}

.btn-info:hover,.btn-info:focus,.btn-info:active
{
	box-shadow:none !important;
}


/******************************************************************************/
/******************************************************************************/
/** RESPONSIVE **/
/******************************************************************************/
/******************************************************************************/

@media (max-width: 850px) {
	header{
		height: 50px;
	}
	
	header .texto-cabecera .telefono, 
	header .texto-cabecera .usuario,
	header .texto-cabecera .usuario .fas{	
		/*margin-right: 0;
		padding-right: 0;
		border-right: none;
		font-size: 1.5rem;*/
	}
	
	header .usuario{	
		margin-left: 2rem;
	}
}

@media (max-width: 600px) {
	.usuario
	{
		display:none;
	}
}

@media (max-width: 400px) { 
	header .texto-cabecera{
		/*flex-flow: column;
		margin-left: 2rem;
		border-left: 1px solid #e5e5e5;
		padding-left: 2rem;
		position: relative;*/
		width: 100%;
	}
	
	header .texto-cabecera .telefono,.telefono
	{
		margin:0 auto;
	}

	header .texto-cabecera .telefono .fa-phone,telefono .fa-phone{
		margin-right: 0.5rem;
	}

	header .texto-cabecera .usuario{	
		margin-left: 0;
	}

	header .texto-cabecera .usuario .fas{
		margin-right: 0.5rem;
	}
}