/**
 * Estilos personalizados para ubicar componentes
 * @author: Erick Sánchez
 */

/*********** ESTILOS HTML ***************/

html,body{
	width           : 100%;
	height          : 100%;
	background-color: #ccc !important;
	padding         : 0px !important;
	margin          : 0px !important;
}

@font-face {
	font-family: 'Muli';
	font-style : normal;
	font-weight: 400;
	src        : local('Muli'), url(Muli.woff) format('woff');
}

/********** ESTILOS DE PLANTILLA **************/

#main-container	{
	/*width           : 1024px;*/
	width           : 1200px;
	height          : 100%;
	background-color: #fff;
	font-size       : 16px;
	font-family     : 'Muli', Arial, serif; font-weight: 400; 
	margin          : 0 auto;
}

#main-container	 *{
	/*border: 1px dotted #f00;*/
}

/* Header */
	#main-container #bar-header{
		background-color: #f6f6f6;
		width           : 100%;
		height          : 90px;
	}
		#bar-header .bar-height{
			position   : absolute;
			padding-top: 10px;
			height     : 30px;
			display    : block;
			float      : left;
			font-weight: bold;
		}
		#bar-header #header-logo{
			position: absolute;
			width   : 200px;
			display : block;
		}
			#bar-header #header-logo img{
				margin : 5px auto;
				height : 80px;
				display: block;
			}
		#bar-header #bar-username{
			/*width      : 624px;*/
			width      : 800px;
			margin-left: 200px;
			text-indent: 30px;
		}
		#bar-header .item-session{
			width      : 200px;
			margin-left: 1000px;
			text-align : center;
		}
		#bar-header #bar-user-guest{
			/*width      : 624px;*/
			width      : 800px;
			margin-left: 200px;
		}
		#bar-header #bar-main-title{
			margin-left: 200px;
			margin-top : 50px;
			width      : 1000px;
			position   : absolute;
			padding-top: 5px;
			height     : 20px;
			display    : block;
			text-align : center;
			font-size  : 25px;
			font-weight: normal;
		}

	#main-container #bar-main-container{
		height    : 100%;
		overflow-y: scroll;
	}

	#main-container #bar-footer{
		/*Alinear texto al centro verticalmente*/
		padding-top: 10px;
		height     : 20px;
		padding-bottom: 10px;
	}
    #main-container #bar-footer a{
      color: #fff;
      font-size: 19px;
      text-decoration:none;
      font-weight:bold;
    }

/*Menu principal (barra)*/
.menu-bar-k{
	/*background-color: #3ec932;*/
	padding-left    : 2px !important;
	text-shadow     : 1px 1px 1px #333;
	width: 99%;
}
	.menu-bar-k .menu-bar-item{
		/*border          : 1px solid #ccc;*/
		/*background-color: #3ec932;*/
		padding              : 4px 0px;
		margin               : 0px 3px;
		-webkit-border-radius: 3px;
		-moz-border-radius   : 3px;
		border-radius        : 3px;
		-webkit-box-shadow   : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
		-moz-box-shadow      : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
		box-shadow           : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
	}
	.menu-bar-k .menu-bar-item:hover{
		/*background-color  : #ff9200 !important;*/
		background-color: #00aaf7 !important;
		cursor          : pointer;
	}
		.menu-bar-k .menu-bar-item a{
			font-size: 15px !important;
		}
		.menu-bar-k .menu-bar-item a:hover{
			color           : #fff !important;
			background-color: transparent !important;
			font-weight     : bold !important;
		}
	.menu-bar-k .menu-bar-item-active{
		/*background-color: #007c24 !important;*/
		background-color: #cacaca !important;
	}

.menu-bar-left{
	/*text-indent: 10px;*/
	padding    :10px;
	font-weight: bold;
	font-size: 12px;
}
	.menu-bar-left .menu-bar-left-title{
		font-size: 20px;
	}
	.menu-bar-left li a:hover{
		text-decoration: none;
	}


/********* COLORES DE LAYOUT ************/
.darkblue-background{
	color           : #f6f6f6;
	background-color: #4f83c5;
}

.red-background{
	color           : #f6f6f6;
	background-color: #bb3346;
}
.red-background:hover{
	cursor: pointer;
}

/********* ESTILOS COMPARTIDOS ************/
.menu-item{
	background-color     : #ddd;
	border               : 2px #ccc solid;
	-webkit-border-radius: 10px;
	-moz-border-radius   : 10px;
	border-radius        : 10px;
	padding              : 10px;
	-webkit-box-shadow   : 7px 7px 5px 0px rgba(50, 50, 50, 0.60);
	-moz-box-shadow      : 7px 7px 5px 0px rgba(50, 50, 50, 0.60);
	box-shadow           : 7px 7px 5px 0px rgba(50, 50, 50, 0.60);
	margin-top           : 25px;
	height               : 160px;
  position             : relative;
}
	.menu-item h4{
		text-shadow: 1px 1px 2px #777;
		color      : #172461;
	}
	.menu-item:hover{
		cursor     : auto;
		font-weight: bold;
	}
	.menu-item img{
		margin-top: 10px;
		width     : 90px;
		height    : 90px;
	}
    .menu-item .menu-item-notification{
      background-color      : #FC4A46;
      font-weight           : bold;
      position              : absolute;
      top                   : 55px;
      left                  : 160px;
      width                 : 28px;
      height                : 28px;
      -webkit-border-radius : 15px;
    	-moz-border-radius    : 15px;
    	border-radius         : 15px;
      border                : 2px solid #BC3734;
      -webkit-box-shadow    : 3px 3px 5px 0px rgba(50, 50, 50, 0.60);
      -moz-box-shadow       : 3px 3px 5px 0px rgba(50, 50, 50, 0.60);
      box-shadow            : 3px 3px 5px 0px rgba(50, 50, 50, 0.60);
    }
      .menu-item .menu-item-notification .menu-item-notification-txt{
        top        : 5px;
        left       : -7px;
        width      : 40px;
        text-align : center;
        position   : absolute;
        text-align : center;
        color      : #fff;
      }
  .menu-link:hover{
		text-decoration: none !important;
	}
  

.menu-item:hover{
	background-color: #ccc;
}

.menu-link{
	width : 100%;
	height: 100%;
}

.fieldset-mini{
	border               : 1px dotted #ccc;
	-webkit-border-radius: 10px;
	-moz-border-radius   : 10px;
	border-radius        : 10px;
	font-size            : 14px;
}
	.fieldset-mini legend{
		font-size    : 16px;
		text-indent  : 15px;
		color        : #e01f00;
		margin-bottom: 0px;
	}

.form-hint{
	width                : 80%;
	text-align           : center;
	border               : 1px dashed #ccc;
	background-color     : #eee;
	-webkit-border-radius: 10px;
	-moz-border-radius   : 10px;
	border-radius        : 10px;
	margin               : 10px auto;
}
.container-center-login{
	width     : 500px;
	text-align: center;
	margin    : 0 auto;
}
.controls .errorMessage{
	display: inline-block;
}

.view-list{
	color                : #172461;
	border               : 1px solid #ccc;
	margin               : 5px 0px;
	padding              : 5px;
	-webkit-border-radius: 8px;
	-moz-border-radius   : 8px;
	border-radius        : 8px;
	background-color: #efefef;
}
	.view-list .detail-menu{
		background-color: #fff;
		font-size       : 14px;
		padding         : 10px 0px;
	}
.input-info{
	border-color    : #3a87ad !important;
	background-color: #d9edf7 !important;
}

.label-big{
	font-size: 14px !important;
	padding  : 10px !important;
}

.hero-fit{
	padding: 20px !important;
}

.font-little{
	font-size: 15px;
}
.font-mini{
	font-size: 13px;
}
.font-micro{
	font-size: 11px;
}

.gallery-dock{
	width                : 95%;
	margin               : 10px auto;
	padding              : 15px;
	-webkit-border-radius: 5px;
	-moz-border-radius   : 5px;
	border-radius        : 5px;
	background-color     : #caceca;
	overflow-y           : auto;
	max-height           : 280px;
}
	.gallery-dock .gallery-img{
		height            : 90px;
		width             : 90px;
		display           : block;
		float             : left;
		margin            : 5px;
		-webkit-box-shadow: 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
		-moz-box-shadow   : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
		box-shadow        : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
	}

.item-lista-grupos{
	width      : 45%;
	display    : block;
	float      : left;
	font-size  : 12.5px;
	border     : 1px solid #f00;
	padding-top: 3px;
}

.items-grupos{
	font-size            : 13px;
	display              : block;
	float                : left;
	width                : 45%;
	background-color     : #dfdfdf;
	margin               : 3px;
	padding-top          : 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius   : 5px;
	border-radius        : 5px;
}

.items-formatos{
	font-size            : 15px;
	display              : block;
	float                : left;
	background-color     : #dfdfdf;
	margin               : 3px;
	width: 24%;
	padding-top          : 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius   : 5px;
	border-radius        : 5px;
}

.item-message-view{
  font-family        : Arial, sans-serif;
  height             : 100px;
  background-color   : #eee;
  color              : #000;
  margin-bottom      : 15px;
  -webkit-box-shadow : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
	-moz-box-shadow    : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
	box-shadow         : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
  position           : relative;
}
  .img-arrow-right{
    position : absolute;
    top      : 40px;
    left     : 73px;
    width    : 35px;
  }
  .item-message-view-photo{
    width   : 100px;
    display : inline-block;
    float   : left;
  }
    .item-message-view-photo .item-message-view-img{
      height : 100px;
      width  : 80px;
      display: inline-block;
      float: left;
    }
  .item-message-view-content{
    width    : 730px;
    display  : inline-block;
    float    : left;
    position : relative;
  }
    .item-message-view-content .msg-label{
      font-style  : normal;
      font-weight : normal;
      font-size   : 12px;
    }
    .item-message-view-content .msg-autor{
      position    : absolute;
      top         : 8px;
      left        : 0;
      font-size   : 13px;
      font-weight : bold;
      font-style  : italic;
    }
    .item-message-view-content .msg-fecha{
      color      : #898989;
      position   : absolute;
      top        : 5px;
      right      : 10px;
      font-size  : 11px;
      font-style : italic !important;
    }
    .item-message-view-content .msg-asunto{
      position   : absolute;
      top        : 40px;
      left       : 0;
      font-size  : 15px;
      font-style : italic;
    }
    .item-message-view-content .msg-mensaje{
      position : absolute;
      top      : 70px;
      left     : 0;
    }
    .item-message-view-content .msg-nuevo{
      position             : absolute;
      top                  : 30px;
      right                : 5px;
      width                : 60px;
      height               : 60px;
      background-color     : #aaa;
      -webkit-box-shadow   : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
    	-moz-box-shadow      : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
    	box-shadow           : 1px 1px 5px 0px rgba(50, 50, 50, 0.60);
      -webkit-border-radius: 30px;
    	-moz-border-radius   : 30px;
    	border-radius        : 30px;
      
    }
      .item-message-view-content .msg-nuevo img{
        width    : 50px;
        margin   : 0 auto;
        position : absolute;
        top      : 25px;
        left     : 6px;
      }
    
.nav-padded{
	margin-bottom: 0px;
}
	.nav-padded .active a{
		background-color: #ececec;
	}
	.nav-padded .active a:hover{
		background-color: #dddddd;
	}

.tab-padded{
	background-color                  : #ececec;
	padding                           : 20px 40px;
	margin-bottom                     : 20px;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius : 5px;
	-moz-border-radius-bottomright    : 5px;
	-moz-border-radius-bottomleft     : 5px;
	border-bottom-right-radius        : 5px;
	border-bottom-left-radius         : 5px;
}
	.tab-padded label{
		font-weight: bold;
	}

/******* ESTILOS GENERICOS *******/
h1{
	font-size  : 24px !important;
	color      : #e01f00 !important;
	text-shadow: 1px 1px 2px #777;
}
	h1 small{
		color      : #69a8cd;
		margin-left: 20px;
		font-size  : 18px !important;
	}

h2{
	font-size  : 20px !important;
	color      : #519cc6 !important;
}

/*Estilo para imagenes de menu de acciones de grids*/
table.items a img{
	width : 25px;
	height: 25px;
}



/*bug de plugin-chosen*/	
.bugged-chosen .chosen-container{
	width: 80% !important;
}

/* Resumen de tablas a la derecha */
.bugged-table .summary{
  text-align: right;
}