@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');

.navigator_wrap {
	display : none;
	position : fixed;
	width : 100%;
	height : 100%;
	z-index : 500;
	top : 0;
	left : 0;
	padding : 0;
	background : #f0f0f1;
	opacity : 0.97;
}

.navigator {
	position : relative;
	top : 0;
	left : 0;
	height : 100%;
	width : 100%;
	text-align : center;
	overflow : hidden;
}

.navigator_on_page {
	width : auto;
	height : 600px;
}

.node {
    cursor: pointer;
}

.overlay{
    overflow: hidden;
	
	background: #F0F0F6;
}

.node rect {
	fill: url(#folder-common);
    stroke: none;
}

.node rect.active {
	fill: url(#folder-active);
}

.node rect.selected {
	fill: url(#folder-selected);
}

.node rect.article {
	fill: url(#article-common);
}

.node rect.article.active {
	fill: url(#article-active);
}

.node rect.article.selected {
	fill: url(#article-selected);
}

.node text {
    font : normal 1.5rem/2rem 'Roboto Condensed', sans-serif;
    color : #3c4c53;
}

.link {
    fill: none;
    stroke: #9898CC;
    stroke-width: 1px;
}

@media (max-width: 767px) {
	.navigator_on_page {
		max-height: 80vh;
	}
}