/* CSS Document */
@import url("../fonts/fira.css");

*
{
	box-sizing:border-box;
}

html, body {
    height: 100%;
    overflow: hidden;
	font-family: "Fira Sans";
}

html, body
{
	margin:0;
	padding: 0;
	
}

#viewport
{
	height:100vh;
	width:100vw;
	overflow: hidden;
	background-color: #ececec;
}

#viewport.ui-center-views
{
	display:flex;
	justify-content: center;
	align-items: center;
}

iframe
{
	margin:0;
	padding: 0;
	border:0;
	height: 100vh;
	position: fixed;
	overflow-y: auto;
	top:0;
	bottom:0;
}

iframe#aside
{
	left:0;
	width:300px;
	background-color: #999;
	transition:transform 200ms ease-out;
}

#viewport.hideMenuBar iframe#aside
{
	transform:translate3d(-300px,0,0);
}

iframe#view
{
	width:calc(100% - 300px);
	left:300px;
	background-color:#f0f0f0;	
	transition: width 200ms ease-out, left 200ms ease-out;
}

#viewport.hideMenuBar iframe#view
{
	left:0;
	width:100%;
}

#menutoggler
{
	position: fixed;
	top: 16px;
	left: 10px;
	color:rgba(255,255,255,0.7);
	z-index:1000;
	cursor: pointer;
	display: none;
	pointer-events: none;
	
}

#viewport.hideMenuBar + #menutoggler
{
	display:block;
	pointer-events: all;
}


.ui.message
{
	font-family: Fira Sans !important;
}