body{
	background-color: #E9EDF5;
}


/**** GENERAL ****/

.dataTables_filter{
	margin-bottom: 10px;
}

table.dataTable thead th.sorting-none, table.dataTable thead td.sorting-none {
    background-image: none;
    cursor: default;
}

.centrar-text{
	text-align: center;
}

.separar{
	margin-bottom: 10px;
	margin-top: 10px;
}

.display{
	display: inline-block;
}

.fijo{
	position: fixed;
	width: 100%;
	z-index: 9;
}

.oculto{
	display: none;
}

.color-blue{
	color: #61C0CC;
}

.color-gray{
	color: #808C96;
}

.warning{
	color: #ffa200;
}

.danger{
	color: #fb5f5f;
	border-width: thin;
 	/* border-color: red;
 	border-style: solid;
 	border-radius: 15px 15px 15px 15px; */
}

.danger-title{
	color:white;
	background-color: red;
	border-radius: 15px 15px 15px 15px;
}

.info{
	color: #00bfdf;
}

.success{
	color:white;
	background-color: #9dd641;
}


.content-scroll{
	overflow: auto;
	padding-bottom: 10px;
}

.titulo-4{
	font-weight: bold;
}
/**** GENERAL FIN ****/


/**** HEADER ****/

.header{
	background-color: #1E1E75;
	box-shadow: 0 3px 5px #ccc;
	color: #FFF;
}

.header .logo{
	font-size: 30px;
	height: 40px;
	margin-left: 45px;
	margin-top: 5px;
	width: 150px;
}

.header .usuario {
	font-size: 14px;
	/*margin-right: 5px;*/
	margin-top: 10px;
	text-align: right;
}

.header a {
	color: #fff;
}

#mostrar-menu{
	cursor: pointer;
	left: 15px;
	padding: 2px 0 2px 5px;
	position: absolute;
	top: 15px;
}

/**** HEADER FIN ****/

/**** CONTENEDOR ****/

.component{
	background-color: #fff;
	border-radius: 3px;
	box-shadow: 0 2px 5px #ccc;
	color: #435966;
	margin-bottom: 10px;
	/*margin-right: 10px;*/
	padding: 0 15px 15px 15px;
}

.component-border {
	border-bottom: 2px solid #435966;
	border-top: 2px solid #435966;
}


.component .component-header{
	background-color: #69CFDC;
	border-radius: 3px 3px 0 0;
	color: #fff;
	height: 30px;
	margin: 0 -15px 15px -15px;
	padding-top: 8px;
	text-align: center;
}

.component-esp {
	color: #fff;
	height: 130px;
	margin-bottom: 10px;
	margin-right: 10px;
	position: relative;
	z-index: 5;
}

.component-esp:hover .component-icon {
	font-size: 60px;
	transition: all .4s;
}

.component-esp .component-titulo-1 {
	font-size: 26px;
	font-weight: bold;
	margin-top: 10px;
	text-transform: uppercase;
}

.component-esp .component-titulo-2 {
	font-style: 16px;
	margin-top: 10px;
}

.component-esp .component-enlace {
	bottom: 0;
	left: 0;
	padding-bottom: 5px;
	padding-top: 5px;
	position: absolute;
	width: 100%;
}

.component-esp a {
	color: #fff;
	font-style: 16px;
}

.component-esp .component-icon {
	color: #000;
	font-size: 80px;
	right: 10px;
	opacity: .1;
	position: absolute;
	top: 10px;
}

.component-esp-red {
	background-color: #DD4B39;
}

.component-esp-red .component-enlace{
	background-color: #BC4031;
}

.component-esp-gray {
	background-color: #999999;
}

.component-esp-gray .component-enlace{
	background-color: #8C8C8C;
}

.component-esp-orange {
	background-color: #F39C12;
}

.component-esp-orange .component-enlace{
	background-color: #CF850F;
}

.component-esp-cian {
	background-color: #00C0EF;
}

.component-esp-cian .component-enlace{
	background-color: #00A4CC;
}

.component-esp-blue {
	background-color: #3C8DBC;
}

.component-esp-blue .component-enlace{
	background-color: #0068A5;
}

.component-esp-blueLight {
	background-color: #3378A0;
}

.component-esp-blueLight .component-enlace{
	background-color: #00629C;
}

.component-esp-green {
	background-color: #00A65A;
}

.component-esp-green .component-enlace{
	background-color: #009651;
}

.component-esp-pink {
	background-color: #DB0EAD;
}

.component-esp-pink .component-enlace{
	background-color: #BA0C93;
}

.component-esp-yellow {
	background-color: #EFE81C;
}

.component-esp-yellow .component-enlace{
	background-color: #EFE81C;
}

.component-esp-violet {
	background-color: #555299;
}

.component-esp-violet .component-enlace{
	background-color: #484682;
}

.component-esp-blueDark {
	background-color: #001F3F;
}

.component-esp-blueDark .component-enlace{
	background-color: #001A36;
}

.component-comp {
	background-color: #fff;
	height: 80px;
	margin-bottom: 10px;
	margin-right: 10px;
	position: relative;
	z-index: 5;
}

.component-comp .component-icon {
	color: #000;
	height: 80px;
	width: 80px;
}

.component-comp .component-icon i {
	color: #fff;
	font-size: 70px;
	left: 5px;
	position: absolute;
	top: 15px;
}

.component-comp:hover .component-icon i {
	font-size: 60px;
	left: 10px;
	top: 20px;
	transition: all .4s;
}

.component-comp .component-titulo-1 {
	color: #999;
	font-size: 16px;
	left: 90px;
	position: absolute;
	top: 10px;
}

.component-comp .component-titulo-2 a {
	color: #000;
	font-size: 18px;
	font-weight: bold;
	left: 90px;
	position: absolute;
	top: 30px;
}

.component-comp-cian .component-icon {
	background-color: #00C0EF;
}

.component-comp-green .component-icon {
	background-color: #00A65A;
}

.component-comp-orange .component-icon {
	background-color: #F39C12;
}

.component-comp-red .component-icon {
	background-color: #DD4B39;
}

.component-comp-blue .component-icon {
	background-color: #0073B7;
}

.component-comp-yellow .component-icon {
	background-color: #E0E718;
}

.component-comp-yellowdark .component-icon {
	background-color: #E5F1B3;
}

.component-comp-purple .component-icon {
	background-color: #C471E7;
}


/**** CONTENEDOR FIN ****/


/**** FORMULARIOS ****/

.button{
	border: 0;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 14px;
	font-weight: bold;
	height: 40px;
	line-height: 1em;
	margin-bottom: 5px;
	margin-top: 5px;
	outline: none !important;
	padding-top: 13px;
	text-decoration: none;
	min-width: 80px;
	border-radius: 15px 15px 15px 15px;
}

.button-primary{
	background-color: #9dd641;
}

.button-primary:hover{
	background-color: #B7F259;
}

.button-info{
	background-color: #1E1E75;
}

.button-info:hover{
	background-color: #566F7D;
}

.button-danger{
	background-color: #EB1414;
}

.button-danger:hover{
	background-color: #B65454;
}

input[type="file"].cargar-file {
	border: 0;
	color: #FFF;
	font-size: 11px;
}

.icon-action{
	cursor: pointer;
	color: #015198;
	text-decoration: none;
}

/* checkbox */

.square-check, .circle-check{
	display: none;
}

.square-check + label, .circle-check + label {
	cursor: pointer;
	display: inline-block;
	width: 20px;
}

.square-check + label:before, .circle-check + label:before {
	background: #f8f8f8;
	border: 2px solid #999;
	border-radius: 3px;
	content: '';
	display: block;
	height: 20px;
	transition: all .4s;
	width: 20px;
}

.circle-check + label:before{
	border-radius: 50%;
}

.square-check:checked + label:before, .circle-check:checked + label:before {
	border: 2px solid #69CFDC;
	transition: all .3s;
}

.square-check:checked + label:before{
	background: #69CFDC;
}

.square-check:disabled + label:before, .circle-check:disabled + label:before {
	background: #ccc;
	border: 2px solid #999;
	transition: all .3s;
}

.square-check + label:after {
	color: #fff;
	content: '✔';
	display: block;
	font-size: 15px;
	margin-left: 4px;
	margin-top: -20px;
}

.circle-check + label:after {
	background-color: #69CFDC;
	border-radius: 50%;
	content: '';
	display: block;
	font-size: 15px;
	height: 10px;
	margin-left: 5px;
	margin-top: -15px;
	width: 10px;
}

.square-check:not(:checked) + label:after, .circle-check:not(:checked) + label:after {
	opacity: 0; 
	transform: scale(0);
}

.square-check:checked + label:after, .circle-check:checked + label:after {
	opacity: 1; 
	/*transform: scale(1); */
	transition: all .4s;
}

.toggle-check{
	display: none;
}

.toggle-check + label{
	background-color: #f1f1f1;
	border-radius: 1.25em;
	box-shadow: 0 0 0 1px #ccc inset;
	cursor: pointer;
	display: inline-block;
	height: 20px;
	padding-top: 1px;
	padding-left: 1px;
	transition: all .4s;
	width: 40px;
}

.toggle-check + label:before{
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
	content: "";
	display: block;
	height: 18px;
	width: 18px;
}

.toggle-check:checked + label{
	background-color: #69CFDC;
}

.toggle-check + label:before{
	transition: margin 0.4s;
}

.toggle-check:checked + label:before{
	margin-left: 20px;
}

.toggle-check:disabled + label:before{
	background-color: #f1f1f1;
}

/* checkbox fin */



.cargar-file{
	background-color: #91A0AD;
	border-radius: 3px;
	padding: 2px 3px 5px 3px;
}

.cargar-file:hover{
	background-color: #808C96;
}

.badge{
	background-color: #777;
	border-radius: 10px;
	color: #fff;
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	min-width: 10px;
	padding: 3px 7px;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
}

.badge-primary {
	background-color: #188ae2;
}

.badge-success {
	background-color: #10c469;
}

.badge-info {
	background-color: #35b8e0;
}

.badge-inverse {
	background-color: #3b3e47;
}

.badge-warning {
	background-color: #f9c851;
}

.badge-danger {
	background-color: #ff5b5b;
}

.badge-purple {
	background-color: #5b69bc;
}

.badge-pink {
	background-color: #ff8acc;
}


/**** FORMULARIOS FIN *****/

.table{
	border-spacing: 0;
	border-collapse: collapse;
	display: table;
	width: 100%;
}

.table a{
	color: #435966;
}

.table thead tr th{
	border: 1px solid #ebeff2;
	border-bottom: 2px solid #ebeff2;
	color: #666666;
	padding: 8px;
}

.table-bordered tr td{
	border: 1px solid #ebeff2;
}

.table-compact tr td{
	padding: 4px;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f4f8fb !important;
}

.table-hover > tbody > tr:hover{
	background-color: #f5f5f5;
}

.formulario-login {
	border-bottom: 2px solid #015198;
	border-top: 2px solid #015198;
	/*box-shadow: 0 3px 5px #ccc;*/
	margin-top: 30px;
	padding: 20px;
	width: 250px;
}

.formulario-login .usuario-icono {
	background-color: #1E1E75;
	border: 3px solid #fff;
	border-radius: 50%;
	color: #fff;
	height: 50px;
	margin-top: -45px;
	width: 50px;
}

.formulario-login .usuario-icono i{
	font-size: 30px;
	margin-left: 10px;
	margin-top: 10px;
}

.formulario-login a {
	color: #656565;
}

.form-control label {
	display: inline-block;
	vertical-align: top;
}

.form-control input[type="text"], .form-control input[type="email"], .form-control input[type="number"], .form-control input[type="password"],  textarea {
	border: 1px solid #cdcdcd;
	color: #666666;
	font-size: 16px;
	line-height: 2em;
	margin-bottom: 10px;
}


.form-control input[type="date"]{
	border: 1px solid #cdcdcd;
	color: #666666;
	font-size: 13px;
	line-height: 2em;
	margin-bottom: 10px;
}


.form-control input[type="button"], .form-control input[type="submit"], .form-control button {
	color: #fff;
	font-family: "Open Sans";
	height: 40px;
	padding: 3px 4px;
}

.form-control select {
	border: 1px solid #cdcdcd;
	color: #666666;
	font-size: 16px;
	height: 34px;
	line-height: 3;
	margin-bottom: 10px;
}

/****Intento de centrar una tabla en un div***/
div.centerTable{
        text-align: center;
}


div.centerTable table {
       margin: 0 auto;
       text-align: left;
}


@media (max-width: 479px) {

	.cabecera .usuario{
		border: 0;
		margin-top: 5px;
	}

}

@media (max-width: 767px) {

	/**** MENU ****/

	.menu{
		background-color: #FFF;
		box-shadow: 0 3px 5px #ccc;
		left: -75%;
		line-height: 50px;
		list-style: none;
		margin: 0;
		overflow: auto;
		padding: 0;
		position: fixed;
		z-index: 20;
		width: 75%;
	}

	.mostrar-menu-principal{
		left: 0;
		height: 90%;
	}

	.menu li{
		display: block;
		position: relative;
	}

	.menu > li > a{
		padding-left: 3em;
	}

	.menu > li > a > span{
		margin-left: 5px;
	}

	.menu a{
		color: #435966;
		display: block;
		font-size: 14px;
		text-decoration: none;
		--webkit-transition: all .5s;
		-o-transition: all .5s;
		transition: all .5s;
	}

	.menu li a:hover{
		color: #69CFDC;
	}

	.menu ul {
		border: 1px solid #e7e7e7;
		background-color: #fff;
		display: none;
		line-height: 30px;
		padding: 0;
		/*position: absolute;*/
		text-align: left;
		z-index: 30;
	}

	.menu li li{
		min-width: 200px;
	}

	.menu ul ul{
		background-color: #E9EDF5; 
		left: 100%;
		top: 0;
		margin:0;
	}

	/*.menu li:hover > ul{
		display: block;
	}*/

	.menu ul li{
		display: block;
		padding-left: .8em;
	}

	.menu ul li a:hover{
		padding-left: 3em;
	}

	.menu .expanded{
		margin-top: 7px;
		position: absolute;
		right: 5px;
	}

	/**** MENU FIN ****/

	/**** CONTENEDOR ****/
	.container{
		margin-top: 80px;
	}
	/**** CONTENEDOR FIN ****/

}

@media (min-width: 768px) {
	
	/**** MENU ****/
	.menu{
		background-color: #FFF;
		box-shadow: 0 3px 5px #ccc;
		/*left: -75%;*/
		line-height: 50px;
		list-style: none;
		margin: 0;
		padding: 0;
		text-align: center;
		z-index: 20;
	}

	.menu li{
		display: inline-block;
		position: relative;
	}

	.menu > li > a{
		padding-left: 3em;
	}

	.menu > li > a > span{
		margin-left: 5px;
	}

	.menu a{
		color: #015198;
		display: block;
		font-size: 14px;
		text-decoration: none;
		--webkit-transition: all .5s;
		-o-transition: all .5s;
		transition: all .5s;
	}

	.menu li a:hover{
		color: #69CFDC;
	}

	.menu ul {
		border: 1px solid #e7e7e7;
		background-color: #fff;
		display: none;
		line-height: 30px;
		padding: 0;
		position: absolute;
		text-align: left;
	}

	.menu li li{
		min-width: 200px;
	}

	.menu ul ul{
		left: 100%;
		top: 0;
		margin:0;
	}

	.menu li.ultimo-elemento ul ul{
		right: 100%;
		left: -100%;
	}

	.menu li:hover > ul{
		display: block;
	}

	.menu ul li{
		display: block;
		padding-left: .8em;
	}

	.menu ul li a:hover{
		padding-left: 1.2em;
	}

	.menu .expanded{
		margin-top: 7px;
		position: absolute;
		right: 5px;
	}

	/**** MENU FIN ****/

	/**** CONTENEDOR ****/
	.container{
		margin-top: 115px;
	}
	/**** CONTENEDOR FIN ****/
	


}

@media all and (min-width: 700px) {
	.td1{
		width: 104px !important;
	}
	.tr1{
		padding-left: 60% !important;
	}
	
}

@media all and (min-width: 1100px) {
	.td1{
		width: 128px !important;
	}

	.tr1{
		padding-left: 60% !important;
	}
}
@media all and (min-width: 1220px) {
	.td1{
		width: 150px !important;
	}

	.tr1{
		padding-left: 60% !important;
	}
}

@media all and (min-width: 1310px) {

	.td1{
		width: 158px !important;
	}

	.tr1{
		padding-left: 60% !important;
	}
	
}
@media all and (min-width: 1700px){
	.td1{
		width: 159px !important;
	}
}
