/* SIDE PANE START  */

.app-side-panel {
	
	display: flex;
	align-items: center;
	justify-content: center;
}

.side-panel-nav {
	
	display: flex;
	align-items: flex-start;
	justify-content: center;
	border-right: 1px solid #2a2a2a;
	width: 52px;
	height: 100%;
}


.side-panel-ul {
	
	list-style: none;
	padding: 0px;
	margin: 0px;
	padding-bottom: 15px;
}

.side-panel-li {
	
	display: flex;
	padding: 8px;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	width: 20px;
	cursor: pointer;
	margin-top: 15px;
}

.side-panel-li:hover {
	
	background: #555;
}

.side-panel-li-active {
	
	background: #555;
	
}

.side-panel-section {
	
	width: 299px;
	height: 100%;
	border-right: 1px solid #2a2a2a;
	overflow-y: auto;
}

.panel-section-ul {
	
	list-style: none;
	padding: 0px;
	margin: 0px;
	width: 100%;
}

.panel-section-li {
	
	font-size: 13px;
	min-height: 38px;
	display: flex;
	align-items: center;
	border-bottom: 1px solid #2a2a2a;
	padding-left: 30px;
	padding-right: 10px;
	cursor: pointer;
}

.panel-section-li:hover {
	
	background: #181818;
}


.panel-section-li-active {
	
	background: #222;
	border-right: 2px solid var(--main-bright-accent);
}

.panel-section-li-active:hover {
	
	background: #222;
}

.panel-section-span {
	
	margin-left: 10px;
}

.panel-section-li-template {
	
	display: flex;
	flex-direction: column;
}

.panel-section-li-template {
	
	align-items: flex-start;
	padding-left: 15px;
}

.li-template-item {
	
	border: none;
	padding: 0px;
	border-radius: 8px;
	padding-left: 15px;
}

.panel-section-li-active.li-template-item  {
	
	border-right: 2px solid var(--main-bright-accent);
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

.add-template-section,.add-footer-section {
	
	color:var(--main-bright-accent);
	font-weight: 500;
	margin-bottom: 15px;
	border-right: none !important;
	border-radius: 8px !important;
}

.add-footer-section  {
	
	margin-left: 40px;
}

.panel-section-li-active.li-template-item.add-template-section {
	
	background:#181818;
}

.template-item-holder{
	
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 38px;
}

.template-item-inner {
	
	margin-left:40px;
	
}

.template-collapse,.footer-collapse {
	
	
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 5px;
	cursor: pointer;
	margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	min-height: 38px;
	width: 10px;
}

.template-collapse:hover{
	
	background: #555;
}

.footer-collapse:hover{
	
	background: #555;
}

.template-item-collapse {
	
	padding-left: 0px;
}

.footer-parent {
	
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

.footer-inner-header  {
	
	display: flex;
	min-height: 38px;
	align-items: center;
	
}

.footer-sortable {
	
	display: flex;
	flex-direction: column;
}

.panel-page {
	
	word-break: break-word;
}

/* SIDE PANE END  */