#app,
.UI-dialog,
.UI-panel{
/*
	background:red !important;
*/
}
:root{
	--UI__BUTTON___ICON__height:20px;
	--UI__BUTTON___ICON__width: 20px;
	--UI__BUTTON___TEXT__font-size:16px;
	--UI__PANEL__gap:5px;
	--UI__PANEL__TITLE__font-size:16px;
	--UI__PANEL__TOOLS__gap:5px;
	--UI__TABULATION__HEAD__TAB__border-width     : 1px;
	--UI__TABULATION__HEAD__TAB__padding          : 8px 6px;
	--UI__TABULATION__HEAD__TAB__TEXT__font-size  : 15px;
	--UI__TABULATION__HEAD__TAB__ICON__size       : 18px;
	--UI__TABULATION__BODY__TAB__HEAD__padding : 8px 12px;
	--UI__TABULATION__BODY__TAB__HEAD__TITLE__TEXT__font-size : 18px;
	--UI__TABULATION__BODY__TAB__BODY__padding : 10px 5px;
	--UI__DIALOG__width:100vw;
	--UI__DIALOG__height:500px;
	--UI__DIALOG__margin-top:50px;
	--UI__DIALOG__HEAD__padding:10px 10px;
	--UI__DIALOG__HEAD__TITLE__TEXT__font-size:20px;
	--UI__DIALOG__HEAD__TOOLS__gap:5px;
	--UI__DIALOG__BODY__padding:10px 10px;
	--PANELSEARCH__width: 70vw;
	--PANELSEARCH__height:100%;
	--PANELSEARCH__padding:15px 10px;
	--MAINBAR__padding      : 5px 4px;
	--MAINBAR__gap          : 5px;
	--MAINBAR__MENU__gap    : 5px;
	--MAINCALENDAR__padding : 10px 5px;
	--MAINCALENDAR__gap     : 10px;
	--MAINCALENDAR__HEAD__padding          : 10px 5px 10px 5px;
	--MAINCALENDAR__HEAD__TITLE__font-size : 18px;
	--MAINCALENDAR__BODY__padding          : 0 0 10px 0;
}
#app__panel--search{}
#app__mainBar{
	#app__brand{
		.mini{display:none;}
		.full{
			.UI-text{display:none;}
			.UI-icon{height:38px;width:160px;}
		}
	}
	#app__menu{
		.UI-button{
			.UI-text{
				display:none;
			}
		}
	}
}
#app__switchToMain{
	position:fixed;top:calc(50vh - 20px);z-index:1001;
	transition: 0.5s;
	.UI-text{display:none}
}
#app__main__map,
#app__main__calendar{
	transition: 0.5s;
	height:100%;
	width:100vw;
}
#app__main__map{}
#app__main__calendar{
}
#app{
	grid-template-rows:max-content 1fr;
	width:100vw;
	overflow-x:hidden;
	grid-template-areas:
		"mainBar"
		"main "
	;
}
#app[data-main="map"]{
	#app__main__calendar{grid-area:main;left:-100vw;}
	#app__main__map{grid-area:main;left:0;}
	#app__switchToMain{left:0;}
}
#app[data-main="calendar"]{
	#app__main__calendar{grid-area:main;left:0;}
	#app__main__map{grid-area:main;left:100vw;}
	#app__switchToMain{left:calc(100vw - 35px);}
}
.UI-dialog{
	.UI-tools{
		.UI-text{
			display:none;
		}
	}
}