/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

article,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

nav ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}

a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

/* change colours to suit your needs */
ins {
	background-color: #ff9;
	color: #000;
	text-decoration: none;
}

/* change colours to suit your needs */
mark {
	background-color: #ff9;
	color: #000;
	font-style: italic;
	font-weight: bold;
}

del {
	text-decoration: line-through;
}

abbr[title],
dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #cccccc;
	margin: 1em 0;
	padding: 0;
}

input,
select {
	vertical-align: middle;
}

/*  COLORES DE INTERFAZ  */
:root {
	--white: #ffffff;
	--light_gray: #ededed;
	--dark_gray: #dcdcdc;
	--black: #20242a;
	--black-light: #474747;
	--purple: #9a2bcb;
	--purple_light: #d462ce;
	--yellow: #f2fe46;
	--yellow_light: #f9fea5;
	--green: #7bca20;
	--green_light: #9be45f;
	--cyan: #4dccab;
	--cyan_light: #6fe5c7;
	--blue: #4290fc;
	--blue_light: #75e5fd;
	--red: #ff1919;
	--red_light: #fd3939;
	--orange: #f9a315;
	--orange_light: #fdbc53;

	--space_small: 4px;
	--space_medium: 8px;
	--space_large: 12px;
	--space_extra: 16px;

	--text_body: 14px;
	--text_anchors: 14px;
	--text_box_titles: 16px;
	--text_title1: 18px;
	--text_title2: 17px;
	--text_title3: 16px;
	--text_title4: 15px;
	--text_title5: 14.5px;
	--text_title6: 14px;
	--icon_size_small: 10px;

	--round_small: 12px;
	--round_medium: 8px;
	--round_large: 12px;

	--small_height: 24px;
	--standar_height: 32px;
	--large_height: 48px;
	--icon_width: 24px;
	--icon_height: 32px;
	--icon_button_text: 16px;

	--card_height: 36px;
	--card_info: 20px;
	--card_margin: 2px;
	--card_margin_long: 4px;

	--avatar_height: 80px;
	--avatar_width: 80px;
	--avatar_icon: 32px;
}

body {
	width: 100%;
	max-width: 1280px;
	padding: 0;
	margin: 0;
	font-size: var(--text_body);
	font-family: "Roboto", sans-serif;
	font-weight: 300;
	background: var(--light_gray);
	overflow-y: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Raleway", sans-serif;
	font-weight: 500;
}

h1 {
	font-size: var(--text_title1);
	margin: var(--space_small);
}
h2 {
	font-size: var(--text_title2);
	margin: var(--space_small);
}
h3 {
	font-size: var(--text_title3);
	margin: var(--space_small);
}
h4 {
	font-size: var(--text_title4);
	margin: var(--space_small);
}
h5 {
	font-size: var(--text_title5);
	margin: var(--space_small);
}
h6 {
	font-size: var(--text_title6);
	margin: var(--space_small);
}

p {
	margin-bottom: var(--space_small);
}

.app {
	height: 100vh;
	overflow-y: hidden;
}

.hidden_menu {
	visibility: hidden;
}

.sidebar {
	position: fixed;
	width: 16%;
	height: 100%;
	overflow: hidden;
	background-color: var(--black);
	visibility: visible;
	top: 0;
}

.sidebar header {
	background: var(--black);
	color: var(--white);
	width: 100%;
	display: block;
	padding: 0;
	text-align: center;
	position: relative;
	text-shadow: 2px 2px 3px var(--black);
}

.sidebar header img {
	width: 100%;
	background: var(--white);
}

.sidebar ul {
	list-style: none;
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
}

.sidebar ul li {
	margin-left: 0;
	padding-left: 0;
	display: inline-block;
	width: 100%;
}

.sidebar ul li > a {
	color: var(--white);
	font-size: var(--text_anchors);
	margin: 0.4em 0.4em 0 0.4em;
	font-family: "Raleway", sans-serif;
	font-weight: 300;
	/* background: #e439ab; */
	display: block;
	text-decoration: none;
	-webkit-transition: font-size 0.1s ease-in;
	-moz-transition: font-size 0.1s ease-in;
	-o-transition: font-size 0.1s ease-in;
	transition: font-size 0.1s ease-in;
}

div.box div[class*="secondary_menu"] {
	display: grid;
	gap: 4px;
	grid-auto-rows: min-content;
}

div.box div.secondary_menu_8,
div.box div.secondary_menu_16 {
	display: grid;
	gap: 4px;
	grid-auto-rows: min-content;
}

div.border {
	border: var(--black) 1px solid;
}

.standar_height {
	line-height: var(--standar_height);
}

div.box div[class*="secondary_menu"] a {
	display: block;
	color: var(--white);
	font-size: var(--text_anchors);
	font-family: "Raleway", sans-serif;
	/* background: #e439ab; */
	text-decoration: none;
	-webkit-transition: font-size 0.1s ease-in;
	-moz-transition: font-size 0.1s ease-in;
	-o-transition: font-size 0.1s ease-in;
	transition: font-size 0.1s ease-in;
}

div.box div.list_menu {
	/* background: #e439ab; */
	text-decoration: none;
	-webkit-transition: font-size 0.1s ease-in;
	-moz-transition: font-size 0.1s ease-in;
	-o-transition: font-size 0.1s ease-in;
	transition: font-size 0.1s ease-in;
	display: grid;
	gap: var(--space_small);
	grid-auto-rows: auto;
}

div.box div.secondary_menu > a i {
	margin-left: 0.4em;
	margin-right: 0.4em;
}

.button {
	background: var(--black-light);
	font-size: var(--text_anchors);
	font-family: "Raleway", sans-serif;
	/* background: #e439ab; */
	text-decoration: none;
	-webkit-transition: font-size 0.1s ease-in;
	-moz-transition: font-size 0.1s ease-in;
	-o-transition: font-size 0.1s ease-in;
	transition: font-size 0.1s ease-in;
	border-radius: var(--round_small);
	color: var(--white);
	text-shadow: 1px 1px 3px var(--black);
	width: 100%;
	height: var(--standar_height);
	text-align: center;
	line-height: var(--standar_height);
	text-decoration: none;
	border: none;
	outline: none;
}

.button i,
button i {
	padding: 0 var(--space_small);
}

.button:hover,
button:hover {
	filter: brightness(110%);
}

.button_blue {
	background-image: linear-gradient(
		to right,
		var(--blue),
		var(--blue_light)
	) !important;
	border-radius: var(--round_small);
}

.button_cyan {
	background-image: linear-gradient(
		to right,
		var(--cyan),
		var(--cyan_light)
	) !important;
	border-radius: var(--round_small);
}

.button_green {
	background-image: linear-gradient(
		to right,
		var(--green),
		var(--green_light)
	) !important;
	border-radius: var(--round_small);
}

.button_red {
	background-image: linear-gradient(
		to right,
		var(--red),
		var(--red_light)
	) !important;
	border-radius: var(--round_small);
}

.button_purple {
	background-image: linear-gradient(
		to right,
		var(--purple),
		var(--purple_light)
	) !important;
	border-radius: var(--round_small);
}

.button_yellow {
	background-image: linear-gradient(
		to right,
		var(--yellow),
		var(--yellow_light)
	) !important;
	border-radius: var(--round_small);
}

.button_orange {
	background-image: linear-gradient(
		to right,
		var(--orange),
		var(--orange_light)
	) !important;
	border-radius: var(--round_small);
}

.button_black {
	background-image: linear-gradient(
		to right,
		var(--black),
		var(--black-light)
	) !important;
	border-radius: var(--round_small);
}

.button_gray {
	background-image: linear-gradient(
		to right,
		var(--dark_gray),
		var(--light_gray)
	) !important;
	border-radius: var(--round_small);
}

.button_no_background {
	background: none !important;
	background-image: none !important;
	border: none;
}

.sidebar ul li:hover > a {
	background: var(--blue);
	font-size: var(--text_anchors);
	color: var(--light_gray);
	font-weight: 500;
	font-style: oblique;
	border-radius: var(--round_small);
	text-shadow: 1px 1px 3px var(--black);
}

.sidebar ul li:hover > a i {
	background: var(--blue_light);
	color: var(--white);
	border-radius: var(--round_small);
	text-shadow: 1px 1px 3px var(--black);
}

.sidebar ul li i {
	font-size: 1.1em;
	padding: 0.15em;
	margin-right: 0.4em;
	color: var(--white);
}

.sidebar nav a i {
	width: 24px;
	height: 100%;
	text-align: center;
}

.notify-bubble {
	position: relative;
	top: -6px;
	left: -2px;
	padding: 2px 4px;
	background-color: var(--red);
	color: var(--white);
	font-size: 6px;
	border-radius: var(--round_small);
	font-family: "Roboto", sans-serif;
	font-weight: 300;
}

.notify-bubble-big {
	position: relative;
	top: -10px;
	left: -1px;
	padding: 2px 4px;
	background-color: var(--red);
	color: var(--white);
	font-size: 12px;
	border-radius: var(--round_small);
	font-family: "Roboto", sans-serif;
	font-weight: 500;
}

.content {
	position: fixed;
	width: 82%;
	margin-left: 16%;
	height: 97%;
	padding: 1%;
	top: 0;
	overflow-y: scroll;
	background-color: var(--light_gray);

	visibility: visible;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	gap: var(--space_medium);
	margin-bottom: var(--space_large);
	grid-auto-rows: min-content;
}

img.full_size {
	width: 100%;
}

a i span {
	font-size: 0.7em;
}

.content .box .box {
	margin-bottom: var(--space_medium);
}

.content_login {
	position: absolute;
	width: 480px;
	height: 240px;
	margin: 0 auto;
	padding: 1%;
	top: 50%;
	left: 50%;
	margin-left: -240px;
	margin-top: -120px;
	background: var(--white);
	border-radius: var(--round_medium);
	padding: var(--space_medium);
	box-shadow: 3px 3px 5px #909090;
	text-align: center;
	visibility: visible;
	display: grid;
	grid-template-columns: 1fr;
	margin-bottom: var(--space_large);
	grid-auto-rows: auto;
	overflow-y: hidden !important;
}

.login_error {
	position: absolute;
	width: 480px;
	height: 300px;
	margin-left: -240px;
	margin-top: -150px;
}

.content_login img.login_image {
	width: 160px;
	margin: 0 auto;
	margin-top: var(--space_small);
}

img.login_header {
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.content div.box {
	background: var(--white);
	border-radius: var(--round_small);
	padding: var(--space_medium);
	box-shadow: 3px 3px 5px #909090;
	vertical-align: middle;
}

.content div.box i span {
	font-family: "Roboto", sans-serif !important;
	font-weight: 500;
}

.content div.box > h1 {
	font-size: var(--text_box_titles);
	color: var(--black-light);
	padding-bottom: var(--space_small);
	border-bottom: var(--light_gray) 1px solid;
	margin-bottom: var(--space_small);
	text-align: center;
	color: var(--black);
}
.content div.box > h3 {
	color: var(--black-light);
	padding-bottom: var(--space_small);
	margin-bottom: var(--space_small);
	text-align: center;
	color: var(--black);
}

.content div.box p {
	text-align: justify;
}

form {
	margin: 0 auto;
	text-align: center;
	visibility: visible;
	margin-bottom: var(--space_large);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space_small);

	grid-auto-rows: min-content;
}

.box form input {
	font-family: "Roboto", sans-serif;
	font-weight: 300;
	font-size: var(--text_body);
	height: var(--standar_height);
	padding: 0 var(--space_medium);
	background: var(--white);
	border: var(--black-light) 1px solid;
	border-radius: var(--round_small);
	margin-bottom: var(--space_small);
}

::placeholder {
	/* Chrome, Firefox, Opera, Safari 10.1+ */
	color: rgb(66, 144, 252);
	opacity: 1; /* Firefox */
}

.box form textarea {
	font-family: "Roboto", sans-serif;
	font-weight: 300;
	font-size: var(--text_body);
	height: 120px;
	padding: var(--space_medium);
	background: var(--white);
	border: var(--black-light) 1px solid;
	border-radius: var(--round_small);
	margin-bottom: var(--space_small);
}

form input.button {
	border: none !important;
	margin: 0 auto;
	font-family: "Roboto", sans-serif !important;
	font-weight: 500;
}

form select {
	height: var(--standar_height);
	line-height: var(--standar_height);
	padding: 0 var(--space_medium);
	margin-bottom: var(--space_small);
	background: var(--white);
	width: 100%;
}

form label {
	text-align: left;
	margin-left: var(--space_medium);
}

form h4 {
	background-color: var(--black-light);
	padding: var(--space_small);
	margin-top: var(--space_small);
	line-height: 24px;
	height: 24px;
	border-radius: var(--round_small);
	color: var(--white);
}

div.form_error {
	padding: var(--space_medium);
	background-color: var(--purple);
	color: var(--white);
	text-align: center;
	border-radius: var(--round_small);
	margin-bottom: var(--space_small);
}

div.instructions {
	padding: var(--space_medium);
	background-color: var(--cyan);
	color: var(--white);
	text-align: center;
	border-radius: var(--round_medium);
}

div.form_error h1 {
	font-size: var(--text_box_titles);
}

.content_login form input {
	margin-top: var(--space_small);
}

.icon_full_width {
	width: 100%;
	text-align: center;
	color: var(--white);
	background-image: linear-gradient(to right, var(--blue), var(--blue_light));
	padding: var(--space_small) 0;
	margin-bottom: var(--space_medium);
	/* text-shadow: 1px 1px 3px var(--black); */
}

.icon_action {
	font-size: var(--icon_button_text);
	text-align: center;
	color: var(--white);
	background-image: linear-gradient(to right, var(--blue), var(--blue_light));
	margin-left: var(--space_small);
	border-radius: var(--round_small);
	height: var(--icon_height);
	min-width: var(--icon_width);
	line-height: var(--icon_height) !important;
	text-shadow: 1px 1px 3px var(--black);
	vertical-align: middle;
	padding: var(--space_small);
}

.hidden {
	visibility: hidden !important;
}

.text_left {
	text-align: left;
}
.text_center {
	text-align: center !important;
}
.text_right {
	text-align: right !important;
}
.text_white {
	color: var(--white) !important;
}
.text_black {
	color: var(--black) !important;
}
.text_red {
	color: var(--red) !important;
}
.text_cyan {
	color: var(--cyan) !important;
}
.text_green {
	color: var(--green) !important;
}
.text_purple {
	color: var(--purple) !important;
}
.no_border {
	border: none !important;
}

table {
	width: 100%;
}

table th,
table td {
	border-bottom: var(--light_gray) 1px solid;
	text-align: center;
	padding: var(--space_small) 0;
	line-height: 20px;
}

div#printableArea table td.no_border_bottom {
	border-bottom: var(--white) 1px solid !important;
}

div#printableArea table td.no_border_top {
	border-top: var(--white) 1px solid !important;
}

div#printableArea table td.no_border_bottom_top {
	border-bottom: var(--white) 1px solid !important;
	border-top: var(--white) 1px solid !important;
}

div#printableArea table td {
	border: var(--black) 1px solid !important;
	text-align: left;
	padding: var(--space_small) var(--space_medium);
}

div#printableArea table th {
	border: var(--black) 1px solid !important;
	text-align: left;
	padding: var(--space_small) var(--space_medium);
	background-color: var(--light_gray);
}

div#printableArea table.company_info td {
	border: none !important;
}

table.user_card {
	width: 400px;
	height: 220px;
	margin: 0 auto;
	background: #ffffff;
	border: #4b9ff6 solid 4px;
	border-radius: 8px;
}

table.user_card tr {
	border: 0 solid #ffffff !important;
}

table.user_card td {
	page-break-inside: avoid;
	border: none !important;
}

table.user_card h2 {
	font-size: 1.6em;
}

table.user_card h3 {
	font-size: 1.2em;
}

table.contract {
	border: #20242a 1px solid;
}

table.contract th {
	border: #20242a 1px solid;
	background-color: var(--light_gray);
	padding: var(--space_medium);
}

table.contract td {
	border: #20242a 1px solid;
	text-align: left;
	padding: var(--space_medium);
}

div.payment_item {
	padding: 4px;
	background: #f4f4f4 !important;
}

div.payment_item_paid {
	padding: 4px;
	background: #d4f9dc !important;
}

div.payment_item_debt {
	padding: 4px;
	background: #f9d3c9 !important;
}

div.payment_item_half {
	padding: 4px;
	background: #fbe8bc !important;
}

div.payment_item_promo {
	padding: 4px;
	background: #ecd9ff !important;
}

#mapCanvas {
	background: #f6f6f6;
	width: 100%;
	height: 600px;
}

div.terminal_info {
	height: var(--standar_height);
}

div.terminal_info p {
	line-height: var(--standar_height);
}

.no_spacing {
	gap: 0px !important;
}

span.client_connected {
	height: var(--standar_height) !important;
	border: solid 1px var(--black-light);
	border-radius: var(--round_small);
	color: var(--blue);
	background: var(--blue);
	width: 100%;
	margin-bottom: var(--space_small);
}

span.client_empty {
	height: var(--standar_height) !important;
	border: solid 1px var(--black-light);
	border-radius: var(--round_small);
	color: var(--white);
	background: var(--white);
	width: 100%;
	margin-bottom: var(--space_small);
}

span.port_used {
	background: var(--cyan);
	text-align: center;
	color: var(--cyan);
	border-radius: 4px;
	padding: 0 4px;
	border: 1px solid black;
}

span.port_empty {
	background: var(--white);
	text-align: center;
	color: var(--white);
	border-radius: 4px;
	padding: 0 4px;
	border: 1px solid black;
}

div.rent_receipt_title {
	background-color: var(--black-light);
	width: 98%;
	padding: 1%;
	height: 32px;
	margin: 0 auto;
	border-radius: var(--round_medium) var(--round_medium) 0 0;
	border: var(--black-light) 1px solid;
}

div.rent_receipt_title h1 {
	text-align: center;
	color: var(--white);
	line-height: 32px;
}

div.rent_receipt p {
	font-size: 20px;
	line-height: 32px;
	margin: 0 8px;
}

div.rent_receipt h3 {
	font-size: 22px;
	line-height: 28px;
}

div.rent_receipt {
	background-color: var(--white);
	width: 98%;
	padding: 1%;
	min-height: 450px;
	margin: 0 auto;
	border-radius: 0 0 var(--round_medium) var(--round_medium);

	visibility: visible;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	gap: var(--space_medium);
	margin-bottom: var(--space_large);
	grid-auto-rows: min-content;
	border: var(--black-light) 3px solid;
}

div.rent_receipt {
	box-shadow: none;
	border: var(--black-light) 1px solid;
	height: 28px;
	line-height: 28px;
}

div.avatar {
	text-align: center;
}

div.avatar img {
	width: var(--avatar_width);
	height: var(--avatar_height);
	margin: 8px auto;
}

div.gray {
	background-color: #f4f4f4;
	padding: var(--card_margin_long);
	border-radius: var(--round_large);
}

div.people_card {
	display: flex;
	background-color: #f4f4f4;
	min-height: var(--card_height) !important;
	height: auto;
	padding: var(--card_margin_long);
	border-radius: var(--round_large);
}

div.people_card img.avatar {
	width: var(--card_height);
	height: var(--card_height);
	margin: var(--card_margin_long);
}

div.people_card div.info {
	flex-grow: 4;
}

div.people_card div.info p span.payment {
	width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--cyan);
	color: var(--white);
	border-radius: var(--round_small);
}

div.people_card div.info p span.date {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--black);
	color: var(--white);
	border-radius: var(--round_small);
}

div.people_card div.info p span.mac {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--purple);
	color: var(--white);
	border-radius: var(--round_small);
}

div.people_card div.info p span.purple {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--purple);
	color: var(--white);
	border-radius: var(--round_small);
}

span.date {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--black);
	color: var(--white);
	border-radius: var(--round_small);
}
span.amount {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--green);
	color: var(--white);
	border-radius: var(--round_small);
}

span.discount {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--red);
	color: var(--white);
	border-radius: var(--round_small);
}

span.total {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--purple);
	color: var(--white);
	border-radius: var(--round_small);
}

div.people_card div.info p:first-child {
	height: 20px;
	margin: 0;
	line-height: 20px;
	padding-top: var(--card_margin);
	font-size: 14px;
	font-weight: bold;
}

div.people_card div.info p:last-child {
	height: 20px;
	margin: 0;
	line-height: 20px;
	padding-top: var(--card_margin);
	font-size: 12px;
}

div.people_card div.actions {
	height: var(--card_height);
	margin: var(--card_margin_long);
}

div.people_card div.actions i.action {
	font-size: var(--card_info);
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--cyan);
}

div.people_card div.actions i.action_red {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--red);
}

div.people_card div.actions i.action_green {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--green);
}

div.people_card div.actions i.action_purple {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--purple);
}

div.dashboard_icon {
	min-height: var(--card_height) !important;
	height: auto;
	padding: var(--card_margin_long);
	margin-bottom: var(--card_margin_long);
	border-radius: var(--round_large);
	text-align: center;
	background-repeat: no-repeat;
	background-size: contain;
	background-position-x: center;
	background-position-y: center;
	background-color: none;
	background-color: rgba(0, 0, 0, 0.1);
	/*border: solid 1px white;*/
}

div.dashboard_icon img.avatar {
	width: 48px;
	height: 48px;
	margin: 0 auto;
}

div.dashboard_icon div.info {
	margin: var(--space_small);
}

div.dashboard_icon div.info p {
	margin: 0;
	line-height: 16px;
	padding-top: var(--card_margin);
	font-size: 12px;
	font-weight: bold;
	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
	color: white;
}

div.dashboard_card {
	min-height: var(--card_height) !important;
	height: auto;
	padding: var(--card_margin_long);
	margin-bottom: var(--card_margin_long);
	border-radius: var(--round_large);
	text-align: center;
	background-repeat: no-repeat;
	background-size: contain;
	background-position-x: center;
	background-position-y: center;
	background-color: none;
	background-color: rgba(0, 0, 0, 0.2);
	/*border: solid 1px white;*/
}

div.dashboard_card img.avatar {
	width: 72px;
	height: 72px;
	margin: 0 auto;
}

div.dashboard_card div.info {
	margin: var(--space_small);
}

div.dashboard_card div.info p:first-child {
	margin: 0;
	line-height: 24px;
	padding-top: var(--card_margin);
	font-size: 16px;
	font-weight: bold;
	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
	color: white;
}

div.dashboard_card div.info {
	flex-grow: 4;
}

div.info p span.detail {
	height: var(--card_info);
	line-height: 20px;
	padding: var(--card_margin) 0;

	padding-right: 4px;
	margin-right: 4px;
	border-radius: 4px;
	font-size: 14px;
	color: var(--black-light);
}

div.info p span.detail img {
	height: 16px;
	width: 16px;
	margin: 0 2px;
	margin-top: -1px;
	line-height: 16px;
	display: inline-block;
	vertical-align: middle;
}

div.info p span.detail_client {
	height: var(--card_info);
	line-height: 24px;
	padding: var(--card_margin) 0;

	padding-right: 8px;
	margin-right: 8px;
	border-radius: 4px;
	font-size: 16px;
	color: var(--black-light);
	font-weight: 400;
}

div.info p span.detail_client img {
	height: 24px;
	width: 24px;
	margin: 0;
	margin-top: -1px;
	margin-right: 8px;
	line-height: 24px;
	display: inline-block;
	vertical-align: middle;
}

div.list_double {
	display: flex;
	background-color: #f4f4f4;
	height: var(--card_height) !important;
	padding: var(--card_margin_long);
	margin-bottom: var(--card_margin_long);
	border-radius: var(--round_large);
}

div.list_double img.avatar {
	width: var(--card_height);
	height: var(--card_height);
	margin: 0 var(--card_margin_long);
}

div.list_double div.info {
	flex-grow: 4;
}

div.list_double div.info p span.amount {
	width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--red);
	color: var(--white);
	border-radius: var(--round_small);
}

div.list_double div.info p span.paid {
	width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--cyan);
	color: var(--white);
	border-radius: var(--round_small);
}

div.list_double div.info p span.date {
	width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--black);
	color: var(--white);
	border-radius: var(--round_small);
}

div.list_double div.info p:first-child {
	height: var(--card_info);
	margin: 0;
	line-height: 24px;
	padding-top: var(--card_margin);
	font-size: 16px;
	font-weight: bold;
}

div.list_double div.info p:last-child {
	height: var(--card_info);
	margin: 0;
	line-height: 24px;
	padding-bottom: var(--card_margin);
	font-size: 14px;
}

div.report_card {
	display: flex;
	background-color: #f4f4f4;
	min-height: 48px !important;
	height: auto;
	padding: var(--card_margin_long);
	margin-bottom: var(--card_margin_long);
	border-radius: var(--round_large);
}

div.report_card img.avatar {
	height: 48px;
	margin: 12px var(--card_margin_long);
}

div.report_card div.info {
	flex-grow: 4;
}

div.report_card div.info p span.technic,
div.people_card div.info p span.technic {
	width: 150px;
	height: 20px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--cyan);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p span.client {
	width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--purple);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p span.critical,
div.people_card div.info p span.critical {
	width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--red);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p span.high,
div.people_card div.info p span.high {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--orange);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p span.medium,
div.people_card div.info p span.medium {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--yellow);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p span.low,
div.people_card div.info p span.low {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--green);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p span.data {
	min-width: 150px;
	height: 16px;
	line-height: 20px;
	padding: 2px 12px;
	background: var(--black);
	color: var(--white);
	border-radius: var(--round_small);
}

div.report_card div.info p {
	min-height: 22px;
	margin: 0;
	line-height: 22px;
	padding-top: var(--card_margin);
	font-size: 14px;
}

div.report_card div.info p:first-child {
	height: var(--card_info);
	margin: 0;
	line-height: 24px;
	padding-top: var(--card_margin);
	font-size: 14px;
	font-weight: bold;
}

div.report_card div.info p:last-child {
	min-height: 24px;
	height: auto;
	margin: 0;
	line-height: 20px;
	font-size: 14px;
	padding-bottom: 4px;
}

div.report_card div.actions {
	height: var(--card_height);
	margin: 0 var(--card_margin_long);
}

div.report_card div.actions i.action {
	font-size: var(--card_info);
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--cyan);
}

div.report_card div.actions i.action_red {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--red);
}

div.report_card div.actions i.action_green {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--green);
}

span.salary_red {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--red);
}

span.salary_green {
	font-size: 20px;
	height: var(--card_height);
	padding: 0 var(--card_margin);
	vertical-align: middle;
	line-height: var(--card_height);
	color: var(--green);
}

div.menu_details {
	line-height: var(--small_height);
}

div.menu_details i.menu_item {
	line-height: var(--small_height);
	margin: 0 var(--space_medium);
}
body div.dashboard_background {
	background: none !important;
	background-color: transparent;
	background-image: url("../../images/dashboard/mountain.jpg") !important;
	background-size: 100% 100% !important;
	height: -webkit-fill-available;
}

#printableArea div.full {
	grid-column: 1/7 !important;
}
#printableArea div.grid_12 {
	grid-column: 1/2 !important;
}
#printableArea div.grid_23 {
	grid-column: 2/3 !important;
}
#printableArea div.grid_34 {
	grid-column: 3/4 !important;
}
#printableArea div.grid_45 {
	grid-column: 4/5 !important;
}
#printableArea div.grid_56 {
	grid-column: 5/6 !important;
}
#printableArea div.grid_67 {
	grid-column: 6/7 !important;
}
#printableArea div.grid_13 {
	grid-column: 1/3 !important;
}
#printableArea div.grid_24 {
	grid-column: 2/4 !important;
}
#printableArea div.grid_35 {
	grid-column: 3/5 !important;
}
#printableArea div.grid_46 {
	grid-column: 4/6 !important;
}
#printableArea div.grid_57 {
	grid-column: 5/7 !important;
}
#printableArea div.grid_14 {
	grid-column: 1/4 !important;
}
#printableArea div.grid_25 {
	grid-column: 2/5 !important;
}
#printableArea div.grid_36 {
	grid-column: 3/6 !important;
}
#printableArea div.grid_47 {
	grid-column: 4/7 !important;
}
#printableArea div.grid_15 {
	grid-column: 1/5 !important;
}
#printableArea div.grid_26 {
	grid-column: 2/6 !important;
}
#printableArea div.grid_37 {
	grid-column: 3/7 !important;
}
#printableArea div.grid_16 {
	grid-column: 1/6 !important;
}
#printableArea div.grid_27 {
	grid-column: 2/7 !important;
}

div#printableArea div.secondary_menu_1 {
	grid-template-columns: repeat(1, 1fr) !important;
}
div#printableArea div.secondary_menu_2 {
	grid-template-columns: repeat(2, 1fr) !important;
}
div#printableArea div.secondary_menu_3 {
	grid-template-columns: repeat(3, 1fr) !important;
}
div#printableArea div.secondary_menu_4 {
	grid-template-columns: repeat(4, 1fr) !important;
}
div#printableArea div.secondary_menu_5 {
	grid-template-columns: repeat(5, 1fr) !important;
}
div#printableArea div.secondary_menu_6 {
	grid-template-columns: repeat(6, 1fr) !important;
}
div#printableArea div.secondary_menu_7 {
	grid-template-columns: repeat(7, 1fr) !important;
}
div#printableArea div.secondary_menu_8 {
	grid-template-columns: repeat(8, 1fr) !important;
}
div#printableArea div.secondary_menu_16 {
	grid-template-columns: repeat(16, 1fr) !important;
}

div.recibo_de_pago {
	border: 1px var(--purple) solid;
	padding: 4px;
	border-radius: 8px;
	padding: 8px;
}

div.recibo_cliente {
	border: 1px var(--cyan) solid;
	padding: 4px;
	border-radius: 8px;
	padding: 8px;
}

div.recibo_de_pago h1 {
	font-size: 24px;
	margin: 4px;
	padding: 0;
}

div.recibo_de_pago p {
	margin: 0;
	padding: 0;
}

div.recibo_de_pago p.title {
	font-weight: 500;
	font-size: 10px;
	vertical-align: bottom;
	margin-left: 12px;
}

div.recibo_de_pago div.elemento {
	display: flex;
	flex-flow: row wrap;
}

div.recibo_de_pago div.elemento {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
}

div.recibo_de_pago .flex_0 {
	flex-grow: 0;
}
div.recibo_de_pago .flex_1 {
	flex-grow: 1;
}
div.recibo_de_pago .flex_2 {
	flex-grow: 2;
}
div.recibo_de_pago .flex_3 {
	flex-grow: 3;
}
div.recibo_de_pago .flex_4 {
	flex-grow: 4;
}
div.recibo_de_pago .flex_5 {
	flex-grow: 5;
}
div.recibo_de_pago .flex_6 {
	flex-grow: 6;
}

div.recibo_de_pago input {
	font-family: "Roboto", sans-serif;
	font-weight: 300;
	height: 20px;
	background: var(--white);
	border: var(--black-light) 1px solid;
	border-radius: var(--round_small);
	width: -webkit-fill-available;
}

div.plans_container form {
	margin-bottom: 0px !important;
}

div.plans_container form select {
	border: 1px solid green;
	border-radius: 8px;
	font-size: 12px;
    height: 24px;
    margin-top: -8px;
}

.content div.box p.report_detail{
	font-size: 16px !important;
}

.content div.box div.secondary_menu a.button{
	font-size: 16px !important;
}


/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-device-width: 320px) and (max-device-width: 768px) {
	:root {
		--white: #ffffff;
		--light_gray: #ededed;
		--dark_gray: #dcdcdc;
		--black: #20242a;
		--black-light: #474747;
		--purple: #9a2bcb;
		--purple_light: #d462ce;
		--yellow: #f2fe46;
		--yellow_light: #f9fea5;
		--green: #7bca20;
		--green_light: #9be45f;
		--cyan: #4dccab;
		--cyan_light: #6fe5c7;
		--blue: #4290fc;
		--blue_light: #75e5fd;
		--red: #ff1919;
		--red_light: #fd3939;
		--orange: #f9a315;
		--orange_light: #fdbc53;

		--space_small: 8px;
		--space_medium: 16px;
		--space_large: 24px;
		--space_extra: 32px;

		--text_body: 30px;
		--text_anchors: 28px;
		--text_box_titles: 32px;
		--text_title1: 28px;
		--text_title2: 27px;
		--text_title3: 26px;
		--text_title4: 25px;
		--text_title5: 24px;
		--text_title6: 23px;
		--icon_size_small: 20px;

		--round_small: 8px;
		--round_medium: 16px;
		--round_large: 24px;

		--standar_height: 32px;
		--icon_width: 32px;
		--icon_height: 32px;
		--icon_button_text: 16px;
	}

	.content {
		position: fixed;
		width: 92%;
		margin-left: 2%;
		margin-top: 120px;
		height: 97%;
		padding: 1%;
		top: 32px;
		visibility: visible;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
		gap: var(--space_medium);
		margin-bottom: var(--space_large);
		grid-auto-rows: min-content;
	}

	.sidebar {
		visibility: hidden;
	}

	.hidden_menu {
		background-color: var(--black);
		top: 0;
		height: 120px;
		width: 100%;
		border: #000 2px solid;
		visibility: visible;
	}

	.hidden_menu h1 {
		font-size: 64px;
		line-height: 120px;
		color: var(--white);
	}

	div.box div.secondary_menu_1 {
		grid-template-columns: repeat(1, 1fr) !important;
	}
	div.box div.secondary_menu_2 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_3 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_4 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_5 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_6 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_7 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_8 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	div.box div.secondary_menu_16 {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	.content div.full {
		grid-column: 1/7;
	}
	.content div.grid_12 {
		grid-column: 1/7;
	}
	.content div.grid_23 {
		grid-column: 1/7;
	}
	.content div.grid_34 {
		grid-column: 1/7;
	}
	.content div.grid_45 {
		grid-column: 1/7;
	}
	.content div.grid_56 {
		grid-column: 1/7;
	}
	.content div.grid_67 {
		grid-column: 1/7;
	}
	.content div.grid_13 {
		grid-column: 1/7;
	}
	.content div.grid_24 {
		grid-column: 1/7;
	}
	.content div.grid_35 {
		grid-column: 1/7;
	}
	.content div.grid_46 {
		grid-column: 1/7;
	}
	.content div.grid_57 {
		grid-column: 1/7;
	}
	.content div.grid_14 {
		grid-column: 1/7;
	}
	.content div.grid_25 {
		grid-column: 1/7;
	}
	.content div.grid_36 {
		grid-column: 1/7;
	}
	.content div.grid_47 {
		grid-column: 1/7;
	}
	.content div.grid_15 {
		grid-column: 1/7;
	}
	.content div.grid_26 {
		grid-column: 1/7;
	}
	.content div.grid_37 {
		grid-column: 1/7;
	}
	.content div.grid_16 {
		grid-column: 1/7;
	}
	.content div.grid_27 {
		grid-column: 1/7;
	}
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
	.sidebar {
		background-color: var(--black);
	}

	div.box div.secondary_menu_1 {
		grid-template-columns: repeat(1, 1fr);
	}
	div.box div.secondary_menu_2 {
		grid-template-columns: repeat(2, 1fr);
	}
	div.box div.secondary_menu_3 {
		grid-template-columns: repeat(3, 1fr);
	}
	div.box div.secondary_menu_4 {
		grid-template-columns: repeat(4, 1fr);
	}
	div.box div.secondary_menu_5 {
		grid-template-columns: repeat(5, 1fr);
	}
	div.box div.secondary_menu_6 {
		grid-template-columns: repeat(6, 1fr);
	}
	div.box div.secondary_menu_7 {
		grid-template-columns: repeat(7, 1fr);
	}
	div.box div.secondary_menu_8 {
		grid-template-columns: repeat(8, 1fr);
	}
	div.box div.secondary_menu_16 {
		grid-template-columns: repeat(16, 1fr);
	}

	.content div.full {
		grid-column: 1/7;
	}
	.content div.grid_12 {
		grid-column: 1/7;
	}
	.content div.grid_23 {
		grid-column: 1/7;
	}
	.content div.grid_34 {
		grid-column: 1/7;
	}
	.content div.grid_45 {
		grid-column: 1/7;
	}
	.content div.grid_56 {
		grid-column: 1/7;
	}
	.content div.grid_67 {
		grid-column: 1/7;
	}
	.content div.grid_13 {
		grid-column: 1/7;
	}
	.content div.grid_24 {
		grid-column: 1/7;
	}
	.content div.grid_35 {
		grid-column: 1/7;
	}
	.content div.grid_46 {
		grid-column: 1/7;
	}
	.content div.grid_57 {
		grid-column: 1/7;
	}
	.content div.grid_14 {
		grid-column: 1/7;
	}
	.content div.grid_25 {
		grid-column: 1/7;
	}
	.content div.grid_36 {
		grid-column: 1/7;
	}
	.content div.grid_47 {
		grid-column: 1/7;
	}
	.content div.grid_15 {
		grid-column: 1/7;
	}
	.content div.grid_26 {
		grid-column: 1/7;
	}
	.content div.grid_37 {
		grid-column: 1/7;
	}
	.content div.grid_16 {
		grid-column: 1/7;
	}
	.content div.grid_27 {
		grid-column: 1/7;
	}
}

@media only screen and (min-width: 1025px) and (max-width: 1280px) {
	.sidebar {
		background-color: var(--black);
	}

	.content div.full {
		grid-column: 1/7;
	}
	.content div.grid_12 {
		grid-column: 1/2;
	}
	.content div.grid_23 {
		grid-column: 2/3;
	}
	.content div.grid_34 {
		grid-column: 3/4;
	}
	.content div.grid_45 {
		grid-column: 4/5;
	}
	.content div.grid_56 {
		grid-column: 5/6;
	}
	.content div.grid_67 {
		grid-column: 6/7;
	}
	.content div.grid_13 {
		grid-column: 1/3;
	}
	.content div.grid_24 {
		grid-column: 2/4;
	}
	.content div.grid_35 {
		grid-column: 3/5;
	}
	.content div.grid_46 {
		grid-column: 4/6;
	}
	.content div.grid_57 {
		grid-column: 5/7;
	}
	.content div.grid_14 {
		grid-column: 1/4;
	}
	.content div.grid_25 {
		grid-column: 2/5;
	}
	.content div.grid_36 {
		grid-column: 3/6;
	}
	.content div.grid_47 {
		grid-column: 4/7;
	}
	.content div.grid_15 {
		grid-column: 1/5;
	}
	.content div.grid_26 {
		grid-column: 2/6;
	}
	.content div.grid_37 {
		grid-column: 3/7;
	}
	.content div.grid_16 {
		grid-column: 1/6;
	}
	.content div.grid_27 {
		grid-column: 2/7;
	}

	div.box div.secondary_menu_1 {
		grid-template-columns: repeat(1, 1fr);
	}
	div.box div.secondary_menu_2 {
		grid-template-columns: repeat(2, 1fr);
	}
	div.box div.secondary_menu_3 {
		grid-template-columns: repeat(3, 1fr);
	}
	div.box div.secondary_menu_4 {
		grid-template-columns: repeat(4, 1fr);
	}
	div.box div.secondary_menu_5 {
		grid-template-columns: repeat(5, 1fr);
	}
	div.box div.secondary_menu_6 {
		grid-template-columns: repeat(6, 1fr);
	}
	div.box div.secondary_menu_7 {
		grid-template-columns: repeat(7, 1fr);
	}
	div.box div.secondary_menu_8 {
		grid-template-columns: repeat(8, 1fr);
	}
	div.box div.secondary_menu_16 {
		grid-template-columns: repeat(16, 1fr);
	}
}

@media only screen and (min-width: 1281px) {
	:root {
		--space_small: 6px;
		--space_medium: 10px;
		--space_large: 14px;
		--space_extra: 18px;

		--text_body: 14px;
		--text_anchors: 16px;
		--text_box_titles: 18px;
		--text_title1: 18px;
		--text_title2: 17.5px;
		--text_title3: 17px;
		--text_title4: 16.5px;
		--text_title5: 16px;
		--text_title6: 15px;
		--icon_size_small: 12px;

		--round_small: 6px;
		--round_medium: 10px;
		--round_large: 14px;

		--standar_height: 32px;
		--icon_width: 32px;
		--icon_height: 32px;
		--icon_button_text: 16px;
	}

	.content {
		position: fixed;
		width: 78%;
		margin-left: 20%;
		height: 97%;
		padding: 1%;
		top: 0;

		visibility: visible;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
		gap: var(--space_medium);
		margin-bottom: var(--space_large);
		grid-auto-rows: min-content;
	}

	.sidebar {
		position: fixed;
		width: 20%;
		height: 100%;
		background-color: var(--black);
	}

	.content div.full {
		grid-column: 1/7;
	}
	.content div.grid_12 {
		grid-column: 1/2;
	}
	.content div.grid_23 {
		grid-column: 2/3;
	}
	.content div.grid_34 {
		grid-column: 3/4;
	}
	.content div.grid_45 {
		grid-column: 4/5;
	}
	.content div.grid_56 {
		grid-column: 5/6;
	}
	.content div.grid_67 {
		grid-column: 6/7;
	}
	.content div.grid_13 {
		grid-column: 1/3;
	}
	.content div.grid_24 {
		grid-column: 2/4;
	}
	.content div.grid_35 {
		grid-column: 3/5;
	}
	.content div.grid_46 {
		grid-column: 4/6;
	}
	.content div.grid_57 {
		grid-column: 5/7;
	}
	.content div.grid_14 {
		grid-column: 1/4;
	}
	.content div.grid_25 {
		grid-column: 2/5;
	}
	.content div.grid_36 {
		grid-column: 3/6;
	}
	.content div.grid_47 {
		grid-column: 4/7;
	}
	.content div.grid_15 {
		grid-column: 1/5;
	}
	.content div.grid_26 {
		grid-column: 2/6;
	}
	.content div.grid_37 {
		grid-column: 3/7;
	}
	.content div.grid_16 {
		grid-column: 1/6;
	}
	.content div.grid_27 {
		grid-column: 2/7;
	}

	div.box div.secondary_menu_1 {
		grid-template-columns: repeat(1, 1fr);
	}
	div.box div.secondary_menu_2 {
		grid-template-columns: repeat(2, 1fr);
	}
	div.box div.secondary_menu_3 {
		grid-template-columns: repeat(3, 1fr);
	}
	div.box div.secondary_menu_4 {
		grid-template-columns: repeat(4, 1fr);
	}
	div.box div.secondary_menu_5 {
		grid-template-columns: repeat(5, 1fr);
	}
	div.box div.secondary_menu_6 {
		grid-template-columns: repeat(6, 1fr);
	}
	div.box div.secondary_menu_7 {
		grid-template-columns: repeat(7, 1fr);
	}
	div.box div.secondary_menu_8 {
		grid-template-columns: repeat(8, 1fr);
	}
	div.box div.secondary_menu_16 {
		grid-template-columns: repeat(16, 1fr);
	}
}

@media print {
	/* Contenido del fichero print.css */
	:root {
		--space_small: 6px;
		--space_medium: 10px;
		--space_large: 14px;
		--space_extra: 18px;

		--text_body: 14px;
		--text_anchors: 16px;
		--text_box_titles: 18px;
		--text_title1: 18px;
		--text_title2: 17.5px;
		--text_title3: 17px;
		--text_title4: 16.5px;
		--text_title5: 16px;
		--text_title6: 15px;
		--icon_size_small: 12px;

		--round_small: 6px;
		--round_medium: 10px;
		--round_large: 14px;

		--standar_height: 32px;
		--icon_width: 32px;
		--icon_height: 32px;
		--icon_button_text: 16px;
	}

	div.hidden_printable {
		display: block !important;
	}

	* {
		overflow: visible !important;
	}
	#printableArea {
		page-break-after: always;
	}

	body aside {
		visibility: visible !important;
	}

	body * {
		visibility: hidden !important;
	}

	#printableArea,
	#printableArea * {
		visibility: visible !important;
	}
	#printableArea {
		left: 0px;
		top: 0px;
		position: absolute !important;
	}
	p {
		page-break-before: always;
	}

	table {
		table-layout: fixed;
	}

	hr {
		height: 0;
		border: 0;
		border-top: 2px dashed #9a2bcb;
	}

	.content {
		background-color: #ffffff;
		overflow: visible;
		position: absolute !important;
	}

	div#printableArea {
		font-family: "Roboto", sans-serif;
		font-weight: 300;
		background-color: #ffffff;
		overflow: visible;
		page-break-inside: avoid;
		page-break-before: always;
	}

	div#printableArea div.company_info h1 {
		font-size: 18px;
	}

	div#printableArea div.company_info p {
		font-size: 10px;
	}

	div.company_info h1 {
		font-size: 16px;
		margin: 10px 0;
		font-family: "Raleway", sans-serif;
		font-weight: 500;
	}

	table.contract h1 {
		font-size: 10px;
		margin: 2px 0;
		text-align: center;
		font-family: "Raleway", sans-serif;
		font-weight: 500;
		background-color: #dcdcdc;
	}

	div#printableArea p.hidden{
		visibility:collapse;
		margin: 0;
		padding: 0;
		display: none;
	}

	div#printableArea table td,
	div#printableArea table tr,
	div#printableArea table th,
	div#printableArea table {
		font-size: 10px;
		padding: 2px 8px;
		border: solid 1px #9a2bcb !important;
		background-color: #ffffff;
	}

	div#printableArea div.report_container{
		border: solid 1px #9a2bcb !important;
		padding-top: 8px;
		margin-bottom: 8px;
		page-break-inside: avoid;
	}

	div#printableArea table td.clausules p {
		line-height: 12px;
		font-size: 9px;
	}

	div#printableArea div.people_card {
		margin: 0;
		padding: 0;
	}

	div#printableArea div.people_card img.avatar{
		height: 24px !important;
		width: 24px !important;
		margin: 4px 8px;
		padding: 0;
	}

	div.people_card div.info p:first-child {
		height: 14px !important;
		line-height: 12px !important;
		font-size: 10px !important;
		font-weight: bold;
		margin-top: 0;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
	}

	div.people_card div.info p {
		height: 14px !important;
		line-height: 14px !important;
		font-size: 10px !important;
		font-weight: none;
		margin-top: 0;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
	}

	div.people_card div.info {
		padding-right: 8px;
	}

	div#printableArea table th {
		background-color: #b4b4b4 !important;
		text-align: center;
	}

	div#printableArea table th.title {
		font-size: 14px;
	}

	div#printableArea table td {
		font-size: 10px;
		padding: 2px 8px;
		page-break-inside: avoid;
	}

	div#printableArea table td strong {
		font-size: 10px;
	}

	.content div.full {
		grid-column: 1/7;
	}
	.content div.grid_12 {
		grid-column: 1/2;
	}
	.content div.grid_23 {
		grid-column: 2/3;
	}
	.content div.grid_34 {
		grid-column: 3/4;
	}
	.content div.grid_45 {
		grid-column: 4/5;
	}
	.content div.grid_56 {
		grid-column: 5/6;
	}
	.content div.grid_67 {
		grid-column: 6/7;
	}
	.content div.grid_13 {
		grid-column: 1/3;
	}
	.content div.grid_24 {
		grid-column: 2/4;
	}
	.content div.grid_35 {
		grid-column: 3/5;
	}
	.content div.grid_46 {
		grid-column: 4/6;
	}
	.content div.grid_57 {
		grid-column: 5/7;
	}
	.content div.grid_14 {
		grid-column: 1/4;
	}
	.content div.grid_25 {
		grid-column: 2/5;
	}
	.content div.grid_36 {
		grid-column: 3/6;
	}
	.content div.grid_47 {
		grid-column: 4/7;
	}
	.content div.grid_15 {
		grid-column: 1/5;
	}
	.content div.grid_26 {
		grid-column: 2/6;
	}
	.content div.grid_37 {
		grid-column: 3/7;
	}
	.content div.grid_16 {
		grid-column: 1/6;
	}
	.content div.grid_27 {
		grid-column: 2/7;
	}

	div.box div.secondary_menu_1 {
		grid-template-columns: repeat(1, 1fr);
	}
	div.box div.secondary_menu_2 {
		grid-template-columns: repeat(2, 1fr);
	}
	div.box div.secondary_menu_3 {
		grid-template-columns: repeat(3, 1fr);
	}
	div.box div.secondary_menu_4 {
		grid-template-columns: repeat(4, 1fr);
	}
	div.box div.secondary_menu_5 {
		grid-template-columns: repeat(5, 1fr);
	}
	div.box div.secondary_menu_6 {
		grid-template-columns: repeat(6, 1fr);
	}
	div.box div.secondary_menu_7 {
		grid-template-columns: repeat(7, 1fr);
	}
	div.box div.secondary_menu_8 {
		grid-template-columns: repeat(8, 1fr);
	}
	div.box div.secondary_menu_16 {
		grid-template-columns: repeat(16, 1fr);
	}


}