@import url(reset.css);

/* -------------------------------------------------------------------------------------------------------------- */
/* General
/* -------------------------------------------------------------------------------------------------------------- */

body {
	background: #FFFFFF;
 	font-family: "Calibri", Trebuchet MS,Arial,sans-serif;
	font-size: 14px;
	line-height: 31px;
	margin: 0;
	cursor: default !important;
	font-stretch: normal;
	-x-system-font: none;
}

h1 { font-size: 20px; font-weight: bold; color: #333333; }
h2 { font-size: 18px; font-weight: bold; color: #333333; } 
h3 { font-size: 16px; font-weight: bold; color: #333333; }
h5 { font-size: 50px; font-weight: bold; color: #34AC8B; padding-top: 10px; } 	

input, textarea, select {
	font-family: "Calibri", Trebuchet MS, Tahoma, Arial, Helvetica, sans-serif;
 	font-size: 14px;
	background-color: #ffffff; /* #f5f5f5 */
	/*font-weight: bold;*/
	color: black; /*#0099CC;*/
	padding: 1px;
	border : 1px solid #aaaaaa;
	/*border : 0px solid #d8d8d8;*/
  -moz-border-radius:4px; border-radius:4px; -webkit-border-radius:4px;
	height: 20px;
}

input:focus,
input:hover,
textarea:focus,
textarea:hover,
select:focus,
select:hover {
	color: Black;
	/*  background: #E0E1BF; */
	/*border: 1px solid Red;*/
}

a:link { color: #0099CC; }
a:visited { color: #0099CC; }
a:hover,a:active { color: #0099CC; }
a.link_strike { color: #0099CC; }

.button { border : 0px solid #d8d8d8; color: white; padding: 3px; cursor:pointer !important; }
.button:focus, .button:hover {
	color: white;
	background: black;
}

.no_selectable {
	-moz-user-select:-moz-none;
	-moz-user-select:none;
	-o-user-select:none;
	-khtml-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	user-select:none;
}


/* -------------------------------------------------------------------------------------------------------------- */
/* APP
/* -------------------------------------------------------------------------------------------------------------- */

.log { 
	clear: both;
	width: 97%;
	padding: 20px;
	background: #dfdfdf;
	-moz-border-radius:5px; border-radius:5px; -webkit-border-radius:5px;
	line-height: 15px;
}

.csv_upload {
	padding: 0px 10px 0px 10px;
	background: #629fcf; /*rgb(226, 0, 38);*/
	-moz-border-radius:5px; border-radius:5px; -webkit-border-radius:5px;
	margin-bottom: 20px;
	color: white;
}

.remittance_div {
	padding: 10px; 
	background: #e9e9e9;
	width: 500px;
	-moz-border-radius:7px; border-radius:7px; -webkit-border-radius:7px;
}
	
.remittance {
	font-family: "Calibri", Trebuchet MS, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 15px;
  border : none;
	/*background-color: #FFFFFF; */ /* #F9F8F8; */
	color: #333333;
	spacing: 0;
	padding: 2;
	border-spacing: 0px;
	width: 100%;
}

.remittance tr { height: 22px; }
.remittance td { padding: 5px; }
.remittance a 	{ color: #ffffff; }

.remittance tr:hover 	{ background-color: #e6f0f5; } /* No funciona */

.remittance tr { height: 22px; }
.remittance td {
	font-size: 14px;
	padding-right: 5px;
	padding-left: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	border-bottom: 1px solid #cecece;
	vertical-align: middle;
	/*background-color: #FFFFFF;*/
	color: #CC6600;
	height: 25px;
}
.remittance a:link 		{ color: #0099CC; }
.remittance a:visited 	{ color: #0099CC; }
.remittance a:hover 		{	color: #0099CC; }
.remittance a:active		{	color: #0099CC; }
.remittance td:hover 	{ background-color: #e6f0f5; }


/* -------------------------------------------------------------------------------------------------------------- */
/* Toolbar
/* -------------------------------------------------------------------------------------------------------------- */

.toolbar {
	float:left; text-align: left; padding-top: 5px; padding-right: 15px; width: 96px; line-height: 18px;
}

.toolbar a:link    {  color : #333333; text-decoration: none; }
.toolbar a:active  {  color : #333333; text-decoration: none; }
.toolbar a:visited {  color : #333333; text-decoration: none; }


.toolbar div.icon3 a:hover { 
	border: 1px solid red; 
}

/* -------------------------------------------------------------------------------------------------------------- */
/* DatePicker
/* -------------------------------------------------------------------------------------------------------------- */

input.dp-applied {
	width: 140px;
	/*float: left;*/
}
a.dp-choose-date {
	/*float: left;*/
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	/*display: block;*/
	text-indent: -2000px;
	overflow: hidden;
	/*background: url(http://intranet.myfocus.loc/ka/apps/intranet/js/datepicker/calendar.png) no-repeat; */
	background: url("../js/datepicker/calendar.png") no-repeat;
	text-decoration: none;
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}


/* -------------------------------------------------------------------------------------------------------------- */
/* Framework
/* -------------------------------------------------------------------------------------------------------------- */

.full 	{ width: 100%; padding: 0; }
.path 	{ background: #fff; color: #333; height: 20px; padding: 10px 20px; }
.main 	{ background: #fff; color: #333; padding: 10px 20px; }
.footer	{ background: #fff; color: #333; padding: 20px 20px; }

.header { width: 100%; padding: 0; height: 50px; background: black; }

.header_title2 { 
	position: absolute; top: 10px; left: 20px; background: #bd4646; color: white; padding: 0px 10px; font-weight: bold; 
	-moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;
}

.header_title { color: white; padding-left: 20px; font-size: 17px; padding-top: 10px; font-weight: normal; }
.header_logo { position: absolute; top: 10px; right: 20px;  }


.link_simple {
	text-decoration: none;
	color: #666666;
}

a.link_simple:link    {  color : #666666; text-decoration: none; }
a.link_simple:active  {  color : #666666; text-decoration: none; }
a.link_simple:visited {  color : #666666; text-decoration: none; }

.link_simple_current {
	text-decoration: none;
	color: #0099CC;
	border: 1px solid #0099CC;
	padding: 1px 10px 1px 10px;
	-moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;
}

a.link_simple_current:link    {  color : #0099CC; text-decoration: none; }
a.link_simple_current:active  {  color : #0099CC; text-decoration: none; }
a.link_simple_current:visited {  color : #0099CC; text-decoration: none; }


.link_simple2 {
	text-decoration: none;
	color: green;
}

a.link_simple2:link    {  color : green; text-decoration: none; }
a.link_simple2:active  {  color : green; text-decoration: none; }
a.link_simple2:visited {  color : green; text-decoration: none; }

.link_simple2_current {
	text-decoration: none;
	color: green;
	border: 1px solid green;
	padding: 1px 3px 1px 3px;
	-moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;
}


.stats {
	-moz-border-radius:5px; border-radius:5px; -webkit-border-radius:5px;
	padding: 10px 20px 20px 10px;
	background: #eeeeee;
	width: 1200px;
	border: 1px solid #dedede;
	margin-top: 10px;
}

.stats a {
	text-decoration: none;
}

/* -------------------------------------------------------------------------------------------------------------- */
/* KA/Options
/* -------------------------------------------------------------------------------------------------------------- */

.ka_options { border: 0px solid white; }

.ka_options a:link { color: white; }
.ka_options a:visited { color: white; }
.ka_options a:hover,a:active { color: white; }
.ka_options a.link_strike { color: white; }

.ka_option { text-decoration: none; padding: 3px 6px 3px 6px; -moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px; }

.ka_option:focus, .ka_option:hover {
	color: white;
	background: black;
}

/* -------------------------------------------------------------------------------------------------------------- */
/* KA/Fonts
/* -------------------------------------------------------------------------------------------------------------- */

.ka_title {
	font-size: 18px; font-weight: bold; color: #333333; padding-bottom: 5px;
}

.ka_title2 {
	padding:2px 1px; -moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;
	text-align:center; font-weight:bold; color:#fff; text-transform:uppercase; font-size: 13px;
}

.ka_status {
	-moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;
	padding: 1px 3px 1px 3px;
	text-align:center; font-weight:normal; color:#fff;
}

/* -------------------------------------------------------------------------------------------------------------- */
/* KA/Colors
/* -------------------------------------------------------------------------------------------------------------- */

.blue 	{ color: #0099CC; }
.red 		{ color: #bd4646; }
.orange { color: #CC6600; }
.green 	{ color: #379b3c; }
.green2 { color: #909139; }
.grey 	{ color: #5F5F5F; }
.grey2	{ color: #7D7D7D; }
.grey3	{ color: #ddd; }
.black 	{ color: #333333; }
.brown 	{ color: #9F6000; }

.bg_blue 		{ background:#0099CC; }
.bg_green 	{ background:#379b3c; }
.bg_green2 	{ background:#63BE7a; }
.bg_yellow 	{ background:#d9c855; } /* #c4b22a; */
.bg_orange 	{ background:#bf8311; }
.bg_red 		{ background:#bd4646; }
.bg_grey 		{ background:#434343; }
.bg_grey2 	{ background:#6f6f6f; }
.bg_grey3 	{ background:#9f9f9f; }
.bg_brown 	{ background:#af9c7e; }
.bg_black 	{ background:#000000; }


/* -------------------------------------------------------------------------------------------------------------- */
/* KA/Messages
/* -------------------------------------------------------------------------------------------------------------- */

.message_ok,
.message_ko {
	position: fixed;
	bottom: 15px;
	left: 15px;
	right: 15px;
}


.message_ok {
	background:#e1ffd1 url("../assets/ka_img/alert_ok.png") no-repeat 11px 12px;
	border-top:1px solid #c5f8ac;
	border-bottom:1px solid #c5f8ac;
	margin:10px 0px 10px 0px;
	padding:5px 10px 5px 35px;
	color:#468d3f; font-size:15px; font-weight:600;
}

.message_ok h3 { color:#468d3f; font-size:15px; font-weight:600; margin:0; padding:0; }
	
.message_ko {
	background:#ffd1d1 url("../assets/ka_img/alert_ko.png") no-repeat 13px 11px;
	border-top:1px solid #f8acac;
	border-bottom:1px solid #f8acac;
	margin:10px 0px 10px 0px;
	padding:5px 10px 5px 35px;
	color:#cc3300; font-size:15px; font-weight:600;
}

.message_ko h3 { color:#8d3f3f; font-size:15px; font-weight:600; margin:0; padding:0; }

/* -------------------------------------------------------------------------------------------------------------- */
/* KA/Grid
/* -------------------------------------------------------------------------------------------------------------- */

.ka_grid {
	font-family: "Calibri", Trebuchet MS, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 14px;
  border : none;
	background-color: #FFFFFF; /* #F9F8F8; */
	color: #333333;
	spacing: 0;
	padding: 2;
	width: 100%;
	border-spacing: 0px;
}

.ka_grid tr { height: 22px; }
.ka_grid td { padding: 5px; }
.ka_grid a 	{ color: #ffffff;

	font-size: 14px;
	line-height: 31px;

 }

.ka_grid tr:hover 	{ background-color: #e6f0f5; } /* No funciona */

.ka_grid_header th, .ka_grid_header td {
	text-align: left; /* center */
	vertical-align: middle;
	padding: 4px;
	background-color: #666; /*#0099CC; #c0cffa;*/
	color: White; /*#333333;*/
	white-space: nowrap;
	font-size: 14px;
	line-height: 31px;
}

.ka_grid_header a:link, .panel_grid_header a:visited, .panel_grid_header a:hover, .panel_grid_header a:active {
	color: White; /*#333333;*/
	font-size: 14px;
	line-height: 31px;
}

.ka_grid_footer th { 
	text-align: center;
	vertical-align: middle;
	padding: 4px;
	background-color: #4671b2; /*#c0cffa;*/
	color: White; /*#333333;*/
	white-space: nowrap;
}

.ka_grid_row tr { height: 22px; }
.ka_grid_row td {
	font-size: 13px;
	padding-right: 5px;
	padding-left: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	border-bottom: 1px solid #dedede;
	vertical-align: middle;
	background-color: #FFFFFF;
	color: #343434;
	height: 25px;
}
.ka_grid_row a:link 		{ color: #0099CC; }
.ka_grid_row a:visited 	{ color: #0099CC; }
.ka_grid_row a:hover 		{	color: #0099CC; }
.ka_grid_row a:active		{	color: #0099CC; }
.ka_grid_row td:hover 	{ background-color: #e6f0f5; }

.ka_grid_row_alt tr { height: 22px; }
.ka_grid_row_alt td {
		font-size: 14px;
	line-height: 31px;

	padding-right: 5px;
	padding-left: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	border-bottom: 1px solid #dedede;
	vertical-align: middle;
	background-color: #eeeeee; /*#E6E3E3*/
	color: #343434;
	height: 25px;
}
.ka_grid_row_alt a:link 		{ color: #0099CC; }
.ka_grid_row_alt a:visited 	{ color: #0099CC; }
.ka_grid_row_alt a:hover 		{	color: #0099CC; }
.ka_grid_row_alt a:active		{	color: #0099CC; }
.ka_grid_row_alt td:hover 	{ background-color: #e6f0f5; }

.ka_grid_row_add tr { height: 22px; }
.ka_grid_row_add td {
	font-size: 14px;
	line-height: 31px;

	padding-right: 5px;
	padding-left: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	border-bottom: 1px solid #dedede;
	vertical-align: middle;
	background-color: #bad4e9;
	color: #343434;
	height: 32px;
}
.ka_grid_row_add a:link 		{ color: #0099CC; }
.ka_grid_row_add a:visited 	{ color: #0099CC; }
.ka_grid_row_add a:hover 		{	color: #0099CC; }
.ka_grid_row_add a:active		{	color: #0099CC; }
.ka_grid_row_add td:hover 	{ background-color: #e6f0f5; }

/* -------------------------------------------------------------------------------------------------------------- */
/* RECORD
/* -------------------------------------------------------------------------------------------------------------- */

.ka_record {
	-moz-border-radius:4px; border-radius:4px; -webkit-border-radius:4px;
	font-family: "Calibri", Trebuchet MS, Tahoma, Arial, Helvetica, sans-serif;

	font-size: 14px;
	line-height: 31px;

	color: #333333;
	spacing: 0;
	padding: 8px;
	width: 100%;
	background-color: #eeeeee; /* #f0f0d4; #fbf9ee;*/
	margin-top: 4px;
}

.ka_record p {
	padding-top: 6px;
	padding-bottom: 3px;
}

.ka_record tr {
	height: 20px;
}

.ka_record th {
	text-align: left;

font-size: 14px;
	line-height: 31px;

	vertical-align: top;
	padding-top: 3px;
	padding-bottom: 0px;	
	border-bottom: 1px #cccccc solid; /* #cdcd89 */
}

.ka_record td {

font-size: 14px;
	line-height: 31px;

	text-align: left;
	vertical-align: top;
	padding-top: 0px;
	padding-bottom: 0px;
}

.ka_record a { color: #0099CC; }
.ka_record a:visited { color: #0099CC; }
.ka_record a:hover { color: #0099CC; }
.ka_record a:active { color: #0099CC; }
.ka_record_bottom { text-align: right; }

.ka_record_buttons { padding-top: 7px; padding-bottom: 5px; }










/*
	CSS PARA EFECTO HOVER EN LA FILA DE KA_GRID   			http://flatuicolors.com/
*/
.ka_grid_row td, .ka_grid_row_alt td {
	/*padding: 10px 0;*/
	color: rgb(112, 114, 113);
	font-family: 'Calibri', sans-serif !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 31px;
	background: none;
	white-space: wrap;
	text-overflow: ellipsis;
}
.ka_grid_row td:hover, .ka_grid_row:hover td, .ka_grid_row_alt td:hover, .ka_grid_row_alt:hover td {
  background: none;
  cursor: pointer;
}
.ka_grid tr.active{
	background: #e3f8ff !important;
}
.ka_grid tr:nth-child(odd){
	background: #eee;
}
.ka_grid tr:nth-child(even){
	background: #fff;
}
.ka_grid tr:nth-child(odd):hover{
	outline: 1px solid #999;
	background: #eee;
}
.ka_grid tr:nth-child(even):hover{
	outline: 1px solid #999;
	background: #fff;
}
.ka_grid tbody tr.ka_grid_header:hover {
	outline: 0;
}


/*
========================================================================================================================
GENERAL
========================================================================================================================
*/

.left 	{ text-align: left; }
.center { text-align: center; }
.right 	{ text-align: right; }

.cursor-default { cursor: default !important; }
.cursor-pointer { cursor: pointer !important; }
.cp { cursor: pointer !important; }

.col_blue 	{ color: #629fcf !important; }
.col_red 		{ color: var(--color-red-a400) !important; }
.col_orange { color: #CC6600 !important; }
.col_green 	{ color: #379b3c !important; }
.col_green2 { color: #909139 !important; }
.col_grey 	{ color: #5F5F5F !important; }
.col_grey2	{ color: #7D7D7D !important; }
.col_black 	{ color: #333333 !important; }
.col_brown 	{ color: #9F6000 !important; }
.col_yellow { color: #d9c855 !important; }
.col_white	{ color: #ffffff !important; }

.bg_white		{ background:#ffffff !important; }
.bg_blue 		{ background:#629fcf !important; }
.bg_blue2 	{ background:#4671b2 !important; }
.bg_green 	{ background:#379b3c !important; }
.bg_green2 	{ background:#63BE7a !important; }
.bg_yellow 	{ background:#d9c855 !important; }
.bg_orange 	{ background:#CC6600 !important; }
.bg_red 		{ background:#bd4646 !important; }
.bg_red2 		{ background:#db8d8d !important; }
.bg_grey 		{ background:#434343 !important; }
.bg_grey2 	{ background:#6f6f6f !important; }
.bg_grey3 	{ background:#9f9f9f !important; }
.bg_grey4 	{ background:#eeeeee !important; }
.bg_brown 	{ background:#af9c7e !important; }
.bg_black 	{ background:#000000 !important; }

.p5 { padding: 5px; }
.p7 { padding: 7px; }
.p10 { padding: 10px; }

.pt5 { padding-top: 5px; }
.pt7 { padding-top: 7px; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }

.pb5 { padding-bottom: 5px; }
.pb7 { padding-bottom: 7px; }
.pb10 { padding-bottom: 10px; }
.pb20 { padding-bottom: 20px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }

.pr5 { padding-right: 5px; }
.pr10 { padding-right: 10px !important; }
.pr20 { padding-right: 20px; }
.pr30 { padding-right: 30px; }
.pr40 { padding-right: 40px; }

.pl5 { padding-left: 5px; }
.pl10 { padding-left: 10px !important; }
.pl20 { padding-left: 20px; }
.pl30 { padding-left: 30px; }
.pl40 { padding-left: 40px; }

.mt5 { margin-top: 5px; }
.mt7 { margin-top: 7px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }

.mb5 { margin-bottom: 5px; }
.mb7 { margin-bottom: 7px; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }

.mr5 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr20 { margin-right: 20px; }
.mr30 { margin-right: 30px; }

.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }

.tal { text-align: left !important; }
.tac { text-align: center !important; }
.tar { text-align: right !important; }

.nw {	white-space: nowrap; }
.dp { display: none ; }
.dn { display: none !important; }
.dni { display: none; }

.w1 { width: 1%; }
.w100 {	width: 100%; }

.mw { max-width: 1100px; }
.wm { max-width: 1100px; }
.mw2 { max-width: 600px; }

.vat { vertical-align: top; }
.vam { vertical-align: middle !important; }
.vab { vertical-align: bottom ; }

.cb { clear:both; }

.bold { font-weight: bold; }

.flat 		{ border: 0; padding: 0; }
.flat td 	{ border: 0; padding: 3px; line-height: 18px; }
.flat th 	{ border: 0; padding: 3px; line-height: 18px; }

.underline {
	text-decoration: underline;
}

.tdn {
	text-decoration: none;
}

.br3 { border-radius: 3px }
.br5 { border-radius: 5px }
.br10 { border-radius: 10px }