@charset "UTF-8";

.pane.dark.transparent {
	background-color: transparent;
}

.pane.dark.side {
	margin-left: calc(40% + 24px);
}

.column.large {
	background-color: var(--lighter-bg);
	transform: translate(20px, 0px);
}

.fce-parent {
	max-height: 100%;
	top: 40px;
	left: calc(50% - 500px);
	position: fixed;
}

.fce {
	opacity: 0;
	width: 50%;
	height: auto;
	transition: opacity 0.4s ease-in;
}

#about-responsibilities {
	padding: 40px 20px 30px 20px;
	text-align: justify;
	text-justify: inter-word;
}

#about-description {
	padding: 8px 0px;
	margin: 0px -12px;
}

.more {
	left: 0px;
	bottom: 0px;
	position: relative;
}

@media screen and (max-width: 1100px) {
	.fce-parent {
		left: 40px;
	}
}


@media screen and (max-width: 800px) {
	.pane.dark.transparent {
		padding-top: 200px;
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.column.large {
		transform: translate(0px, 0px);
	}
	
	.fce-parent {
		max-height: 100%;
		top: 30px;
		left: 10px;
		position: absolute;
	}
	
	.fce {
		width: 100%;
	}
	
	.pane.dark.side {
		margin-left: 0%;
	}
}

@media screen and (max-width: 500px) {
	.navitem.mid {
		min-width: 0px;
	}
	
	.navitem.mid p {
		display: block;
	}
	
	.navitem.right {
		display: none;
	}
}