﻿/*:root {
	--mobile-width: 640px;
}*/

.company-logotype {
	position: relative;
	float: right;
	max-height: 24px;
	margin-right: 10px;
	margin-top: 10px;
}

@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: url(https://example.com/MaterialIcons-Regular.eot); /* For IE6-8 */
	src: local("Material Icons"), local("MaterialIcons-Regular"), url("../fonts/MaterialIcons-Regular.woff") format("woff"), url(https://example.com/MaterialIcons-Regular.woff2) format('woff2'), url(https://example.com/MaterialIcons-Regular.ttf) format('truetype');
}

.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px; /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;
	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;
	/* Support for IE. */
	font-feature-settings: 'liga';
}

:focus {
	box-shadow: 0 0 0 0.0625em #ffffff, 0 0 0 0.125em #376df5;
	outline: 0;
	border-color: #F3F3F3;
	border-radius: 0.3em !important;
}

.card-header {
	border: 0.063em solid #d3d3d3;
	width: 100%;
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}

	.card-header:hover {
		background-color: #e6e6e6;
		border: 0.063em solid #b3b3b3;
		box-shadow: 0 0 0.2em #e6e6e6;
	}

	.card-header:focus {
		box-shadow: 0 0 0 0.0625em #ffffff, 0 0 0 0.125em #376df5;
		outline: 0;
		border-color: #F3F3F3;
		border-radius: 0.3em !important;
	}

h2.env-collapse-header span {
	cursor: pointer;
}

.lex-search {
	max-width: 23em;
}

.lex-title {
	/*float: left;*/
	font-size: xx-large
}

.clickable-table-header {
	cursor: pointer;
	white-space: nowrap;
}

.secrecyRow {
	background-color: #e6e6e6 !important;
}

.selectedRow {
	background-color: #DBE9FA !important;
}

.disabled-button {
	cursor: not-allowed !important;
	pointer-events: auto !important;
	opacity: 0.6;
}

.lex-form-input {
	margin-bottom: 0.5em;
	padding: 0.4375rem;
	height: 2.25rem;
	line-height: 1.25rem;
	transition: all 0.1s linear;
	outline: none;
	width: 100%;
	border: 0.0625em solid #e0e1e4;
	border-radius: 0.125em;
	box-shadow: none;
	background-color: #ffffff;
}

	.lex-form-input:hover {
		box-shadow: none;
		border: 0.0625em solid #376df5;
	}

	.lex-form-input:focus {
		box-shadow: 0 0 0 0.0625em #fff, 0 0 0 0.25em #376df5;
		border: 0.0625em solid #376df5;
		/*outline: 0;*/
	}

.headerWrapper {
	background-color: #61A3FF;
	color: black;
}

.opacityWrapper {
	opacity: 0.5;
}

.lex-button {
	border-radius: 0.3em !important;
	border-color: #6c757d !important;
}

button.btn:active, button.btn:focus {
	color: yellow;
}

.lex-linkbutton {
	background: none !important;
	border: none;
	padding: 0 !important;
	/*optional*/
	font-family: arial, sans-serif;
	/*input has OS specific font-family*/
	color: #069;
	text-decoration: underline;
	cursor: pointer;
}

a:hover, button:hover, .lex-button:hover {
	cursor: pointer;
}

.mandatoryMark {
	color: red;
}

.showDownloadDocumentCell {
	cursor: pointer;
}

.display-none-override {
	display: none !important;
}

.spinner-text {
	position: absolute;
	left: 40%;
	top: 30%;
	cursor: not-allowed;
	opacity: 0.5;
}

#spinner-overlay {
	position: fixed; /* Sit on top of the page content */
	display: block; /* Hidden by default */
	width: 100%; /* Full width (cover the whole page) */
	height: 100%; /* Full height (cover the whole page) */
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fff;
	opacity: 0.5;
	z-index: 1001;
	cursor: progress; /* Add a pointer on hover */
}

.env-spinner {
	position: absolute;
	left: 40%;
	top: 40%;
}

.env-rect1, .env-rect2, .env-rect3, .env-rect4, .env-rect5 {
	border: 0.063em solid #fff;
}

.lex-spinner {
	position: absolute;
	border: 1em solid silver;
	border-radius: 50%;
	border-top: 1em solid #376df5;
	width: 5em;
	height: 5em;
	left: 40%;
	top: 40%;
	-webkit-animation: spin 700ms linear infinite; /* Safari */
	animation: spin 700ms linear infinite;
	z-index: 1002 !important;
}

@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
	}
}

@keyframes spin {
	0% {
		transform: rotate(0deg)
	}

	100% {
		transform: rotate(360deg)
	}
}

hr.sep {
	border-bottom: 0.3em solid #ddd;
	margin: 0;
	padding: 0;
}

/*-------------- lex-table --------------*/
.lex-table {
	display: table;
	width: 100%;
	border-collapse: collapse;
	border: 0.063em solid #ccc;
	margin: 0;
	padding: 0;
	border-spacing: 0;
}

.lex-table_heading {
	display: table-header-group;
	font-weight: bold;
	line-height: 2.5em;
}

.lex-table_body {
	display: table-row-group;
	border: 0.063em solid #ddd;
}

.lex-table_row {
	display: table-row;
	border: 0.063em solid #ddd;
	padding: 0.2em;
	background: #fff;
}

.lex-table_head {
	font-weight: bold;
}

.lex-table_cell, .lex-table_head {
	display: table-cell;
	padding: 0.5em;
}

.lex-nowrap {
	white-space: nowrap;
}

.lex-table_foot {
	display: table-footer-group;
	font-weight: bold;
}

.lex-table_cell button, .lex-table_cell [type=button] {
	height: 2.4em;
	white-space: nowrap;
	position: relative;
	-webkit-appearance: none;
}

.lex-table_cell-wide {
	width: 12rem !important;
	padding-left: 0.5em;
}

/*-------------- lex-info-table --------------*/
.lex-info-table {
	display: table;
	border-collapse: collapse;
	margin: 0;
	padding: 0;
}

.lex-info-table_heading {
	display: table-header-group;
	font-weight: bold;
}

.lex-info-table_body {
	display: table-row-group;
}

.lex-info-table_row {
	display: table-row;
	padding: 0.2em;
}

.lex-info-table_head {
	font-weight: bold;
}

.lex-info-table_cell, .lex-info-table_head {
	display: table-cell;
	padding: 0.2em;
}

.lex-info-table_foot {
	display: table-footer-group;
	font-weight: bold;
}

.lex-info-table_row-100 {
	display: table-row;
	padding: 0.2em;
}

.lex-info-table_cell-100 {
	display: table-cell;
	padding: 0.2em;
	width: 12rem;
}
/*-------------- lex-head-table --------------*/
.lex-head-table {
	display: table;
	border-collapse: collapse;
	margin: 0;
	padding: 0;
	border-spacing: 0;
}

.lex-head-table_body {
	display: table-row-group;
}

.lex-head-table_row {
	display: table-row;
}

.lex-head-table_head {
	font-weight: bold;
}

.lex-head-table_cell {
	display: table-cell;
	padding: 0.5em;
}

	.lex-head-table_cell button, .lex-head-table_cell [type=button] {
		height: 2.4em;
		white-space: nowrap;
	}

/*@media only screen and (max-width: var(--mobile-width)) { TODO: funkar inte ännu, men snart */
@media only screen and (max-width : 1024px) {
	.flip-scroll .cf:after {
		visibility: hidden;
		display: block;
		font-size: 0;
		content: "";
		clear: both;
		height: 0;
	}

	.flip-scroll * html .cf {
		transform: scale(1);
	}
	/*zoom: 1;*/
	.flip-scroll *:first-child + html .cf {
		transform: scale(1);
	}
	/*zoom: 1;*/
	.flip-scroll .lex-table {
		width: 100%;
		border-collapse: collapse;
		border-spacing: 0;
		border: none
	}

	.flip-scroll .lex-table_head, .lex-table_cell {
		margin-top: 0.1em;
		margin-bottom: 0.1em;
		vertical-align: top;
		position: relative;
		width: 100%;
		padding: 0.2em;
	}

	.flip-scroll .lex-table_head {
		text-align: left;
	}

	.flip-scroll .lex-table {
		display: block;
		position: relative;
		width: 100%;
	}

	.flip-scroll .lex-table_heading {
		display: block;
		float: left;
	}

	.flip-scroll .lex-table_body {
		display: inline-grid;
		width: auto;
		position: relative;
		overflow-x: auto;
	}

	.flip-scroll .lex-table_heading .lex-table_row, .lex-table_heading .lex-head-table_row {
		display: none;
		border: none
	}

	.flip-scroll .lex-table_cell .lex-table_head {
		display: block;
		text-align: right;
		padding: 0.2em;
	}

	.flip-scroll .lex-table_body .lex-table_row {
		display: inline-block;
		vertical-align: top;
		flex-direction: row;
	}

	.flip-scroll .lex-table_cell {
		display: block;
		text-align: left;
		position: relative;
		width: 99.9%;
		min-height: 2.2em;
		padding: 0.2em;
	}

		.flip-scroll .lex-table_cell:empty {
			display: none;
		}

		.flip-scroll .lex-table_cell div {
			width: 100%;
			position: relative;
			height: auto;
		}

		.flip-scroll .lex-table_cell button, .lex-table_cell [type=button] {
			height: 2.4em;
			-webkit-appearance: none;
			-moz-appearance: none;
		}

	.flip-scroll .lex-info-table {
		width: 100%;
	}

	.flip-scroll .lex-info-table_row-100 {
		border: none;
	}

	.flip-scroll .lex-info-table_cell-100 {
		display: block;
		text-align: left;
		padding: 0.2em;
	}

	.flip-scroll .lex-info-table_cell-100-content {
		position: absolute;
		bottom: 0;
		height: 100%;
	}

	.flip-scroll .lex-head-table {
		display: block;
		position: relative;
		border-collapse: collapse;
		border-spacing: 0;
		border: none;
	}

	.flip-scroll .lex-head-table_body {
		display: inline-grid;
		width: auto;
		position: relative;
		overflow-x: auto;
	}

		.flip-scroll .lex-head-table_body .lex-head-table_row {
			display: inline-block;
			vertical-align: top;
			flex-direction: row;
		}

	.flip-scroll .lex-head-table_cell {
		display: block;
		text-align: left;
		position: relative;
		height: 2.2em;
		padding: 0.2em;
	}

		.flip-scroll .lex-head-table_cell div {
			position: relative;
			height: 100%;
		}

		.flip-scroll .lex-head-table_cell button, .lex-head-table_cell [type=button] {
			position: relative;
			margin-left: -0.2em;
			height: 2.4em;
		}

	.flip-scroll .lex-head-table_head, .lex-head-table_cell {
		margin-top: 0.1em;
		margin-bottom: 0.1em;
		vertical-align: top;
		position: relative;
	}
}

/*-------------- lex-checkbox --------------*/
.lex-checkbox {
	box-sizing: content-box;
	display: block;
	font-size: 1em;
}

	.lex-checkbox [type=checkbox] {
		position: absolute;
		width: 0.063em;
		height: 0.063em;
		padding: 0;
		margin: -0.063em;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		border: 0;
	}

.lex-checkbox_fake {
	border: 0.063em solid #ccc;
	border-radius: .125em;
	display: inline-block;
	height: 1.25em;
	margin-right: .25em;
	position: relative;
	-webkit-transition: border-color .2s ease-in-out, box-shadow .2s ease-in-out;
	transition: border-color .2s ease-in-out, box-shadow .2s ease-in-out;
	vertical-align: middle;
	width: 1.25em;
}

.lex-checkbox label {
	margin-bottom: .5em;
}

.lex-checkbox_label {
	display: inline;
	vertical-align: bottom
}

.lex-form-element_label {
	display: inline-block;
	font-weight: 500;
	margin-bottom: .25em;
}

[type=checkbox]:checked + label .lex-checkbox_fake:after {
	background-color: transparent;
	border-bottom: .125em solid #fff;
	border-left: .125em solid #fff;
	content: "";
	display: block;
	height: .3125em;
	left: 50%;
	position: absolute;
	top: 40%;
	transform: translate3d(-49%, -45%, 0) rotate(-50deg);
	width: .875em
}

[type=checkbox]:checked + label .lex-checkbox_fake {
	background-color: #376df5;
}

[type=checkbox]:hover + label .lex-checkbox_fake {
	box-shadow: none;
	border: 0.0625em solid #376df5;
}

[type=checkbox]:focus + label .lex-checkbox_fake {
	box-shadow: 0 0 0 0.0625em #fff, 0 0 0 0.25em #376df5;
	border: 0.0625em solid #376df5;
	outline: 0;
}

/*-------------- modal-launcher --------------*/

.modal-outer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	text-align: center;
	z-index: 99998;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--backgroundColour);
}

.modal-inner {
	position: relative;
	background: transparent;
	z-index: 99999;
}

.tinyText {
	font-size: 0.4em;
}
