body, html{
	font-family:		Nunito,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	padding:			0;
	margin:				0;
	color:				rgb(100, 100, 100);
	font-weight:		200;
}

header{
	position:			fixed;
	top:				0px;
	width:				100%;
	height:				60px;
	background-color:	rgb(24, 24, 89);
}

header img{
	height:				35px;
	float:				left;
	padding:			10px;
}

.search-wrap {
	position: relative;
	display: inline-block;
	font-size: 0.5em;
	color: white;
	border:1px solid darkblue;
	width: 220px;
}

.search-wrap i {
	position: absolute;
	left: 8px;
	top: -12px;
	font-size: 0.95em;
	width: 12px;
	color: darkgrey;
	background: none;
	cursor: pointer;
}

.search-wrap input {
	padding-left: 2rem;
	width: 182px;
	background: none;
	border: none;
	color: darkgrey;
}

aside{
	color:				white;
	position:			fixed;
	left:				0;
	padding-left:		5px;
	top:				60px;
	bottom:				50px;
	width:				115px;
	background-color:	rgb(24, 24, 89);
}

aside ul, list ul{
	list-style:			none;
	padding:			0;
}

aside li i, list li i{
	display:			inline-block;
	width:				30px;
	font-size:			1.2rem;
	margin:				5px;
}

list{
	display:			flex;
	padding-left:		15px;
	width:				calc(100% - 15px);
	justify-content:	space-between;
}

list ul{
	width:				45%;
	text-align:			left;
}

license {
	width: 45%;
	text-align:			left;
	padding-top:		15px;
}

list ul li i{
	border-radius:		0;
	background-color:	inherit;
	font-size:			1.3rem;
	display:			inline-block;
	padding:			0;
	width:				45px;
}

list ul li input{
	height:				auto;
	width:				50px;
}

list ul li span{
	text-align:			left;
}

list ul li{
	padding-bottom:		10px;
	font-size:			14px;
	font-weight:		200;
}

aside li{
	color:				rgb(238, 238, 238);
	font-size:			14px;
	font-weight:		200;
	padding:			15px 0;
}

aside li:hover{
	color:				rgb(198, 198, 198);
	font-weight:		400;
}

list li{
	color:				inherit;
	padding:			0;
	margin:				0;
}

list li span{
	display:			inline-block;
	width:				100px;
}

footer{
	position:			fixed;
	bottom:				0px;
	width:				100%;
	height:				50px;
	padding-top:		10px;
	background-color:	rgb(24, 24, 89);
}

footer a{
	padding-top:		5px;
	color:				white;
	text-decoration:	none;
	font-size:			14px;
	font-weight:		200;
	line-height:		1.5;
	margin-left:		10px;
	margin-right:		5px;
}

footer a:first-child{
	padding-left:		200px;
	margin-left:		0px;
}

footer a:last-child{
	margin-right:		10px;
	float:				right;
}

form{
	max-width:			calc(100% - 115px);
	padding:			10px;
	display:			flex;
	flex-direction:		column;
}

form label{
	padding:			5px 0;
}

form input{
	margin:				5px 0;
}

form button, .ui-button{
	color:				#FFF;
	background-color:	rgb(17, 82, 147);
	border:				none;
	border-radius:		4px;
	line-height:		25px;
	padding:			6px 16px;
	font-size:			0.875rem;
	min-width:			64px;
	box-sizing:			border-box;
	transition:			background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
	margin-top:			10px;
}

form button:hover, .ui-button:hover{
	background-color:	rgb(110, 130, 175);
	box-shadow:			0 0 14px 0 rgba(53,64,82,.05);
}

h1{
	font-weight:		lighter;
	font-size:			2rem;
	margin-top:			0;
}

main{
	position:			fixed;
	top:				60px;
	bottom:				60px;
	left:				120px;
	width:				calc(100vw - 120px);
	display:			flex;
	flex-direction:		column;
	align-items:		left;
	overflow:			auto;
	padding:			15px;
}

main:has(article) {
	flex-wrap:			wrap;
	flex-direction:		row;
	gap:				10px;
	overflow:			auto;
	padding:			0;
}

main article{
	display:			flex;
	flex-direction:		column;
	box-sizing:			border-box;
	text-align:			center;
	border-radius:		15px;
	height:				calc(50% - 25px);
	width:				calc(50% - 25px);
	background-color:	rgb(200, 200, 210);
	margin:				10px;
	position:			relative;
	overflow-y: auto;
}

main article:hover{
	background-color:	rgb(190, 190, 205);
}

main article i{
	border-radius:		15px 15px 0 0;
}

main article h2{
	font-weight:		lighter;
	padding-bottom:		15px;
}

main article i, main article h2{
	padding-top:		15px;
	display:			block;
	width:				100%;
	background-color:	rgb(110, 130, 175);
	color:				white;
	font-size:			2rem;
	margin:				0;
}

section{
	width:				calc(100% - 30px);
	border-bottom:		1px solid lightgrey;
	padding:			5px;
}

section:hover{
	background-color:	rgb(230, 230, 230);
}

data{
	display:			inline-block;
	width:				100px;
	font-weight:		light;
	line-height:		2;
}

data:first-child{
	width:				15px;
}

data:last-child, data:nth-last-child(2){
	float:				right;
	width:				50px;
	text-align:			center;
}

data:hover{
	color:				rgb(110, 130, 175);
}

.wide-data{
	display:			inline-block;
	width:				200px;
}

.ultra-wide-data{
	display:			inline-block;
	width:				300px;
}

.heading{
	font-weight:		400;
}

.popup label{
	display:			inline-block;
	margin-top:			7px;
	margin-bottom:		3px;
}

.ui-widget-content div p{
	word-break:			break-all;
}

.ui-widget-header, .ui-dialog-buttonpane{
	border-radius:		10px 10px 0 0;
	background-color:	rgb(110, 130, 175);
	color:				white;
	font-weight:		200;
}

.ui-dialog-buttonpane{
	border-radius:		0 0 10px 10px;
	margin:				0 !important;
	padding:			0 !important;
	margin-top:			10px !important;
}

.ui-dialog-titlebar-close{
	background-color:	rgb(17, 82, 147);
}

.ui-button .ui-icon{
	background-image:	url("/service/assets/js/jquery-ui-1.13.2/images/ui-icons_ffffff_256x240.png");
}

.ui-dialog{
	background-color:	rgb(200, 200, 210);
	padding:			0px;
	border-radius:		10px;
}

.ui-dialog form{
	max-width:			100%;
	padding:			0;
}

.table-container{
    flex: 				1;
    overflow: 			auto;
    max-height:			100%;
    width: 				100%;
}

table{
	width: 				calc(100% - 30px);
    max-width: 			calc(100% - 30px);
    border-collapse: 	collapse;
    table-layout: 		fixed;
    word-wrap: 			break-word;
	margin:				15px;
}

td, tr{
	text-align:			left;
	padding:			5px;
}

.independent{
	color:				rgb(27, 143, 77);
}

.row:hover{
	background-color:	rgb(132, 147, 183);
	color:				white;
}

.selected-row{
	background-color:	rgb(155, 165, 192);
}

.action-icon {
	position:			absolute;
	top:				15px;
	right:				20px;
	padding:			0;
	margin:				0;
	border:				none;
	z-index:			1;
	text-align:			right;
	font-size:			0.9rem;
	width:				10px;
	color:				rgb(24, 24, 89);
}

.action-icon:hover{
	color:				white;
}

error{
	color:				red;
}

.forgot{
	margin-top:			10px;
	text-decoration:	underline;
}

.forgot:hover{
	text-decoration:	none;
	font-size:			1.1rem;
}

label[for='resent'] {
	background-color:	rgb(200, 200, 210);;
	padding:			5px;
}

.datepicker{
	width: 				80px;
}

.assetcount{
	width: 				35px;
}