:root {
	--titlebar-height:50px;
	--leftbar-width:200px;
	--content-width: calc(100% - var(--leftbar-width));
	--title-font-size:18px;
	--title-min-width:75px;
	--title-signout-width:50px;
}

body {
	background-color: var(--content-color);
}
.pageContainer
{
	height:100vh;
}
.titleBar
{
	height:var(--titlebar-height);
	width:100%;
	background-color:var(--prime-color);
	padding:0px;
}
.titleBarTitle
{
	border-right-style:solid;
	border-right-width:1px;
	border-right-color: var(--secondary-color);
	height:100%;
	background-color:transparent;
	margin:0px;
	font-size:var(--title-font-size);
	font-weight:bold;
	color:black;

	padding-top:10px;
	text-align:center;

	float:left;

	width:var(--leftbar-width);
}
.titleBarRest{
	width:calc(100% - var(--leftbar-width));
	height:100%;
	float:right;
	padding: 5px 5px 5px 5px;
}
.titleBarRestSearch{
	width:calc(100% - var(--title-signout-width));
	float:left;
}
.titleBarRestSignout{
	width:var(--title-signout-width);
	float:right;
	height:100%;
	text-align: center;
	font-size:20px;
	padding-top:5px;
}
.contentRow{
	height:calc(100% - var(--titlebar-height));
}
.leftBar
{
	background-color:var(--secondary-color);
	height:100%;
	width:var(--leftbar-width);
	display:inline-block;

	border-right-style:solid;
	border-right-width:1px;
	border-right-color:var(--prime-color);

	
	padding:2px;
}
.customerDetailsPanel{
	width:100%;
	height:auto;
	margin-top:50px;
	font-size:14px;
	padding:0px;
}
.contentBlock
{
	background-color:var(--content-color);
	height:100%;
	width:calc(100% - var(--leftbar-width));
	display:inline-block;
	overflow-y:scroll;
}

.custTitle{
	font-size:14px;
	font-weight:bold;
	margin:0px;
	padding:0px;
}
.custDetails{
	font-size:14px;
	margin:0px;
	padding:0px;
}

.contentTitle{
	font-size:20px;
	font-weight:bold;
	margin-top:10px;
	margin-bottom:0px;
}
.btn-theam{
	background-color:var(--prime-color);
}
.btn-theam:hover{
	background-color:var(--secondary-color);

	border-style:solid;
	border-width:1px;
	border-color:var(--heighlight-color);
	color:var(--heighlight-color)
}
.inputRow {
	padding-top: 2px;
	padding-bottom: 2px;
}
.pageMessage {
	font-size: 25px;
	text-align: center;
	color: var(--prime-color);
	margin-top: 100px;
}
.noPadding {
	padding: 0px;
}
.groupBox {
	font-size: medium;
	font-weight: bold;
	color: var(--prime-color);
	text-decoration:underline;
}
@media (max-width: 600px) {
	.contentRow{height:auto;}
	.contentBlock{overflow-y:auto;}
	.leftBar{width:100%;height:auto;}
	.contentBlock{width:100%;height:auto;}
	.titleBarTitle{width:var(--title-min-width);}
	.titleBarRest{width:calc(100% - var(--title-min-width));}
}
