:root {
  --blue: #649500;
  --white: #faf0e6; 
}

/* background-color: var(--blue); */


* { margin: 0; padding: 0; }

body {
}

h1, h2, h3 {  
	/* border-bottom: 1px dotted #ccc; */
	margin: 0 0 10px 0;  
}

.report td { border: 0.5px solid gray; padding: 5px;}

a 					{ text-decoration: none; color: #039;}
a:hover 			{ text-decoration: underline; }
a:visited 			{ text-decoration: none; color: #039;}

a .inline 			{ background: #ffe; text-decoration: none;} 
a:hover .inline 	{ background: #ddc; text-decoration: underline;}

.div_live 			{ background: #fff; text-decoration: none;}
.div_live:hover		{ background: #e6e9ef; text-decoration: none;}

.separator hr		{ border: 0.5px solid #eee;}


.hide_when_mobile 	{ display: block; }

/* ---------------------- COLORS & SIZE --------------------- */

.icon_size 			{ height: 12px; }
.cal_icon_size 		{ height: 20px; }

@media only screen and (max-width: 400px) {
	.icon_size { height: 16px; margin-left: 3px;}
	.cal_icon_size { height: 25px; }
}




/* ---------------------- FLOAT BOX ------------------------- */

.landing_box 	{ width: 1000px; }
.body_box 		{ width: 1200px; }
.form_box		{ width: 600px; }

.float_background {
	display: block; z-index: 14000;	
	position: absolute; top: 0; left: 0; width: 100%; height: 600%; 
	background: #000; opacity: 0.5; filter: alpha(opacity=50); 
	
}

.float_box {
	display: block; z-index: 15000; 
	position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); 
	padding: 10px 10px 10px 10px;
	background: #fff;  border: 1px solid #aaa; box-shadow: 0px 0px 50px #666; 
}




/* ------------------------ CRM CSS codes ------------------------- */

.cal_today_text 	{font-size: 14pt; }
.cal_today_number 	{font-size: 44pt; }
.cal_month 			{font-size: 8pt;}
.cal_week 			{font-size: 8pt;}
.cal_day 			{font-size: 6pt;}
.cal_day_range 		{font-size: 6pt; background: #ff0;}

.cal_month_day 		{ background: #aad; color: #fff; }
.cal_month_today 	{ background: #88b; color: #fff; font-weight: bold; }


/* --------- Overall Visuals (non responsive) ------------- */

.status {
	display: inline-block;			text-decoration: none;			cursor: hand;				font-size: 6pt;
	-webkit-border-radius: 3px; 	border-radius: 3px;				padding: 3 10 3 10;			margin: 2 2 2 2;

}

.status_activo {	background: #ada;				border: 1px solid #ada;			color: #6a6; 	}
.status_pasivo {	background: #ded;				border: 1px solid #ded;			color: #6a6;	}
.status_pausa  {	background: #adf;				border: 1px solid #adf;			color: #88a;	}
.status_terminado {	background: #faa;				border: 1px solid #faa;			color: #a66;	}
.status_cancelado {	background: #aaa;				border: 1px solid #aaa;			color: #444;	}


/* ------------------------ RESPONSIVE ------------------------- */

/*  SECTIONS  */
.section { 	clear: both;	padding: 0px;	margin: 0px; }

/*  COLUMN SETUP  */
.col { display: block;		float:left;		margin: 1% 0 1% 1.6%; }
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after {	content:"";		display:table; }
.group:after {	clear:both; }
.group {
    zoom:1; /* For IE 6/7 */
}

/* ----------------------- GRIDS ------------------------- */

.span_1_of_1 {	width: 100%;}
.span_2_of_2 {	width: 100%;}
.span_1_of_2 {	width: 49.2%;}
.span_1_of_2_web {	width: 49.2%;}
.span_3_of_3 {	width: 100%; }
.span_2_of_3 {	width: 66.1%;}
.span_1_of_3 {	width: 32.2%;}
.span_4_of_4 {	width: 100%; }
.span_3_of_4 {	width: 74.6%; }
.span_2_of_4 {	width: 49.2%; }
.span_1_of_4 {	width: 23.8%; }

.cal_1_of_7 {width: 12%; background: #eee;}
.cal_1_of_7_empty {width: 12%; }
.cal_full {	display: block;}
.cal_mobi { display: none;}

.only_wide   { padding: 0px; margin: 0px; display: block; }
.only_mobile {  display: none; }

.card_width		{ width: 800px; }

/*  GO FULL WIDTH AT LESS THAN 699 (era 480) PIXELS */

@media only screen and (max-width: 900px) {
	.col { 	margin: 1% 0 1% 0%;	}
	.head_1_of_4 {	width: 25%; min-width: 226px;text-align: left;   }
	.head_2_of_4 {	width: 30%; min-width: 240px;  }
	.head_3_of_4 {	width: 30%; min-width: 200px;  }
	.head_4_of_4 {	display: none; }
	.footer_login { display: block;}
	.button {		border: 1px #ddd solid;	}
	.float_box {	width: 100%; }

	.landing_box 	{ width: 100%; }
	.body_box	 	{ width: 100%; }
	.form_box		{ width: 100%; }
}

@media only screen and (max-width: 699px) {
	.col { 	margin: 1% 0 1% 0%;	}
	.data_cont .data_label 	{text-align: left;}

	.cal_1_of_7 {width: 100%; }
	.cal_1_of_7_empty {display: none;}
	.cal_full {	display: none;}
	.cal_mobi { display: block;}

	.only_wide {display: none;}
	.only_mobile { padding: 0px; margin: 0px; display:block; }	

	.hide_when_mobile { display: none;	}

	.span_2_of_2 {	width: 100%; }
	.span_1_of_2 {	width: 100%; }
	.span_1_of_2_web {	display: none;}
	.span_3_of_3 {	width: 100%; }
	.span_2_of_3 {	width: 100%; }
	.span_1_of_3 {	width: 100%; }
	.span_4_of_4 {	width: 100%; }
	.span_3_of_4 {	width: 100%; }
	.span_2_of_4 {	width: 100%; }
	.span_1_of_4 {	width: 100%; }
}