/*------------------------------------------------------------------------------------------------------------------------*/
/* site css */
/*------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------*/
/* elements */
/*------------------------------------------------------------------------*/

:root {
	--white: hsl(0, 0%, 100%);
	--black: hsl(0, 0%, 0%);
	--white: hsl(0, 0%, 100%);
	--black: hsl(0, 0%, 0%);
	--tro-primary: hsl(229, 100%, 33%);
	--tro-litprimary: hsl(229, 100%, 50%);
	--tro-green: hsl(140, 100%, 35%);
	--tro-fadedgreen: hsl(140, 100%, 35%, 0.3);
	--tro-red: hsl(0, 100%, 37%);
	--tro-fadedtext: hsl(0, 0%, 59%);
	--tro-elementgrey: hsl(0, 0%, 85%);
	--tro-linkgrey: hsl(0, 0%, 32%);
	--tro-shadowgrey: hsla(0, 0%, 0%, 0.1);
	--tro-shadowgreydark: hsla(0, 0%, 0%, 0.3);
	--tro-imagegrey: hsla(0, 0%, 46%);
	--tro-togglegreyon: hsl(0, 0%, 32%);
	--tro-togglegreyoff: hsl(0, 0%, 85%);
}

body {
	font-family: "Rubik", sans-serif;
	font-optical-sizing: auto;
	font-weight: 350;
	font-style: normal;
	font-size: 1rem;
	line-height: 1.8;
	-webkit-user-select: none; /* Safari */
	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */
}

hr.hcHRSmall {
	border-top: 1px solid var(--tro-elementgrey);
}

table {
	border-collapse: collapse;
	border: 1px solid var(--black);
}
table td {
	border: 1px solid var(--black);
	padding: 5px;
}
table td:first-child {
	border-left: 0px solid var(--black);
}

.hcGeneralButton {
	font-family: inherit;
	font-size: inherit;
	background-color: var(--tro-primary);
	border: none;
	color: var(--white);
	padding: 8px 16px;
	text-decoration: none;
	margin: 4px 2px;
	cursor: pointer;
}

.hcTable {
	display: table;
	padding: 5px;
}

.hcTableRow {
	display: table-row;
	padding: 5px;
}

.hcTableCell {
	display: table-cell;
	padding: 5px;
}

.hcTableBordered {
	border: 1px solid var(--tro-elementgrey);
}

.hcErrorText {
	color: var(--tro-red);
	line-height: 1.2;
}

.hcSuccessText {
	color: var(--tro-green);
	line-height: 1.2;
}

.hcSuccessAdditionalText {
	padding-top: 10px;
	color: var(--black);
	line-height: 1.2;
}

/*------------------------------------------------------------------------*/
/* media desktop */
/*------------------------------------------------------------------------*/

@media screen and (min-width: 1025px) {
	body {
		-webkit-user-select: auto; /* Safari */
		-ms-user-select: auto; /* IE 10 and IE 11 */
		user-select: auto; /* Standard syntax */
	}
}