<commit_before>div.ccm-panel {
	width: 320px;
	height: 100%;
	position: fixed;
	top: 0px;
	z-index: @index-level-panel; // has to come above the detail actions wrapper
	overflow: hidden;
}

div#ccm-panel-overlay {
	z-index: @index-level-panel-overlay;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: none;
	background: transparent;
	.transition(background-color cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s)
}

div#ccm-panel-overlay.ccm-panel-translucent {
	background-color: rgba(255,255,255,0.7);
}


html.ccm-panel-ready.ccm-panel-left {
	div.ccm-page {
		.translate3d(320px, 0, 0);
	}
}

html.ccm-panel-ready.ccm-panel-right {
	div.ccm-page {
		.translate3d(-320px, 0, 0);
	}
}

html.ccm-panel-ready.ccm-panel-transition-none {
	div.ccm-page {
		.transition(none);
	}
}

html.ccm-panel-ready {

	div.ccm-page {
		.backface-visibility(hidden);
		.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
	}

}

div.ccm-panel-transition-none.ccm-panel-left {
	left: -320px;
}

div.ccm-panel-transition-none.ccm-panel-left.ccm-panel-active {
	left: 0px;
}

div.ccm-panel-transition-slide.ccm-panel-left {
	.translate3d(-100%, 0, 0);
	left: 0px;
	.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
}

div.ccm-panel-transition-none.ccm-panel-right {
	right: -320px;
}

div.ccm-panel-transition-none.ccm-panel-right.ccm-panel-active {
	right: 0px;
}

div.ccm-panel-transition-slide.ccm-panel-right {
	.translate3d(100%, 0, 0);
	right: 0px;
	.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
}

div.ccm-panel-left.ccm-panel-transition-slide.ccm-panel-active {
	.translate3d(0, 0, 0);
}

div.ccm-panel-right.ccm-panel-transition-slide.ccm-panel-active {
	.translate3d(0, 0, 0);
}

/** 
 * Shadow layer
 */

div.ccm-panel-right div.ccm-panel-shadow-layer {
	width: 20px;
	height: 100%;
	position: absolute;
	top: 0px;
	z-index: @index-level-panel;
	.box-shadow(inset 10px 10px 10px rgba(128,128,128,0.3));
}

div.ccm-panel-left div.ccm-panel-shadow-layer {
	width: 20px;
	height: 100%;
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: @index-level-panel;
	.box-shadow(inset -10px 10px 10px rgba(128,128,128,0.3));
}

/**
 * Panel Content
 */
div.ccm-panel-content {
	padding: 48px 0px 0px 0px;
	position: absolute;
	top: 0px;
	height: 100%;
	overflow: auto;
	width: 320px;
	left: 0px;
	.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);

}

div.ccm-panel div.ccm-panel-content {}

div.ccm-panel.ccm-panel-loaded div.ccm-panel-content {}

div.ccm-panel-content {
	header {
		font-size: 16px;
		padding: 15px 15px 15px 40px;
		margin-bottom: 10px;
		font-weight: 500;

		aside {
			float: right;
			font-size: 11px;
			font-weight: lighter;
			margin-top: 4px;

			a {text-decoration: none;}
		}
	}

	ul.nav, menu {

		margin: 20px 30px 0px 20px;
		padding: 0px;

		> li {
			margin-top: 10px;
		}


		li {
			
			list-style-type: none;

			a {
				display: block; 
				text-decoration: none;
				font-size: 14px;
				font-weight: 500;
				padding: 5px 21px 5px 20px;
				.border-radius(4px);
			}

			a:hover {
				text-decoration: none;
			}

			ul {
				li {
					margin-top: 3px;
				}

				a {
					.border-radius(0px);
					display: inline;
					padding: 0px;
					font-weight: 400;

					&:hover {
						background-color: auto;
					}
				}
			}
		}

	}
}

div.ccm-panel-content-inner {
	padding: 20px 40px 40px 40px;
}


/** 
 * Dashboard Panel
 */
div#ccm-panel-dashboard {
	background-color: #dde2e7;
	color: #5d6a78;
	header {
		color: #97aabc;
		background-color: #414d59;

		aside a {
			color: #7a838e;
		}
	}

	menu, ul.nav {
		li {
			a {
				color: #4674a1;

				&:hover{ 
					color: #0c253e;
				}

				&.nav-selected, &.nav-path-selected {
					color: #0c253e;
				}
			}
		}

		> li > a:hover {	background-color: #c9d4de;}
	}

	div.ccm-panel-header-accordion {

		nav {

			ul.ccm-panel-header-accordion-dropdown:after {
				border-color: #7b8692 transparent;
			}

			li > a:hover {
				background-color: #3f4750;
			}

			li > a {
				color: #fff;
				background-color: #525d69;
			}

			span {
				color: #97aabc;
				background-color: #414d59;

				&:hover {
					background-color: #333c46;
				}
			}
		}

		&.ccm-panel-header-accordion-dropdown-visible {
			span {
				background-color: #333c46;
			}
		}
	}

	div.ccm-panel-header-accordion-dropdown-visible {
		nav {
			ul {
				height: 105px !important;
			}
		}
	}

	div.ccm-panel-dashboard-footer {
		margin-left: 40px;
		margin-top: 20px;
		border-top: 1px solid #c6cbcf;
		padding-top: 10px;
		font-size: @font-size-small;
		p {
			line-height: @line-height-small;
			margin-bottom: 5px;
		}
		color: #5d6a78;
	}

}

/** 
 * New Page
 */
div#ccm-panel-sitemap {
	background-color: #eff7fd;
}

/** 
 * Properties
 */
div#ccm-panel-page, div#ccm-panel-compose-page {
	.ccm-panel-dark();

	header {
		color: #3baaf7;
		background-color: #202226;

		aside a {
			color: #565759;
		}
	}

	menu.ccm-panel-page-basics {
		border-bottom: 1px solid #36383c;
	}

	menu {
		
		padding-bottom: 20px;

		li {
			a {
				color: #737c8e;
			}

			a:hover {
				background-color: #222427;
				color: #dce5f7;
			}

			a.ccm-panel-menu-item-active {
				background-color: #151619;
				color: #3baaf7;
			}
		}
	}

}




/** 
 * Panel Drill Down
 */
div.ccm-panel-slide-left {
	-webkit-transform: translate3d(-320px, 0, 0);
}

div.ccm-panel-slide-right {
	-webkit-transform: translate3d(320px, 0, 0);
}

div.ccm-panel-content-appearing {
	-webkit-transform: translate3d(320px, 0, 0);
}

div.ccm-panel-content.ccm-panel-content-visible {
	-webkit-transform: translate3d(0px, 0, 0);
}

a.ccm-panel-back,
a.ccm-panel-back:hover {
	font-size: 12px;
	text-decoration: none;
	margin-right: 4px;
}



/** 
 * Panel main detail areas
 */
div.ccm-panel-detail {
	z-index: @index-level-panel-detail;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	display: none;
	.box-sizing(border-box);
	background: transparent;
	padding-top: 48px;

	&.ccm-panel-detail-static {
		display: block;
	}

	&.ccm-panel-detail-static-left {
		padding-left: 321px;
	}

	&.ccm-panel-detail-static-right {
		padding-right: 321px;
	}

	fieldset {
		legend {
			border: 0px;
		}

		padding-bottom: 20px;
		border-bottom: 1px solid @legend-border-color;
		margin-bottom: 20px;
		margin-left: -40px;
		padding-left: 40px;
	}

	fieldset:last-child {
		border-bottom: 0px;
	}


}


html.ccm-panel-left div.ccm-panel-detail {
	padding-left: 321px;
}

html.ccm-panel-right div.ccm-panel-detail {
	padding-right: 321px;
}

div.ccm-panel-detail-content {
	padding: 40px 40px 90px 40px;

	div.ccm-notification-help {
		position: absolute;
		right: 0px;
		top: 110px;
	}
}

@media (min-width: @screen-medium) {
	div.ccm-panel-detail-content {
		form.ccm-panel-detail-content-form {
			width: 600px;
		}
	}
}


div.ccm-panel-detail {

	header {
		font-size: 22px;
		margin: -40px -40px 30px -95px;
		padding: 34px 80px 34px 95px;
		font-weight: 600;
	}

	hr {
		margin-left: -40px;
		margin-right: -40px;
		border-bottom-width: 1px;
		border-bottom-style: solid;
	}

}

/** 
 * Panel Detail - Properties
 */
div#ccm-panel-detail-page-properties,
div#ccm-panel-detail-page-seo,
div#ccm-panel-detail-page-composer,
div#ccm-panel-detail-page-versions,
div#ccm-panel-detail-page-attributes,
div#ccm-panel-detail-page-caching,
div#ccm-panel-detail-page-permissions,
div#ccm-panel-detail-page-location {
	
	background-color: #f3fbff;

	div.ccm-panel-detail-content {
		background-color: #f3fbff;
	}

	header {
		background-color: #e1f4ff;
		color: #105192;
	}

	hr {
		border-bottom-color: #c6d3db;
	}
}

/** 
 * Panel Detail swap
 */
div.ccm-panel-detail.ccm-panel-detail-transition-swap {
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	display: block;
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

div.ccm-panel-detail.ccm-panel-detail-transition-swap.ccm-panel-detail-transition-swap-apply {
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

div.ccm-panel-detail.ccm-panel-detail-transition-swap.ccm-panel-detail-transition-swap-remove {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

/** 
 * Panel Detail Fade
 */
div.ccm-panel-detail.ccm-panel-detail-transition-fade {
	.transition(opacity 0.5s cubic-bezier(0.190, 1.000, 0.220, 1.000));
	.opacity(0);
	display: block;
}
div.ccm-panel-detail.ccm-panel-detail-transition-fade-apply {
	.opacity(1);
}



/** 
 * Miscellaneous effects classes 
 * First we have to push the item with positioning
 * because it's going to lose its position once the new effect takes place.
 */

html.ccm-panel-left div.ccm-page.ccm-panel-detail-transition-swap {
	position: relative;
	left: 320px;
}

html.ccm-panel-right div.ccm-page.ccm-panel-detail-transition-swap {
	position: relative;
	right: 320px;
}

html.ccm-panel-ready div.ccm-page.ccm-panel-detail-transition-swap {
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

html.ccm-panel-ready div.ccm-page.ccm-panel-detail-transition-swap.ccm-panel-detail-transition-swap-apply {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

div.ccm-panel-detail.ccm-panel-detail-transition-none.ccm-panel-detail-transition-none-apply {
	display: block;
}

html.ccm-panel-ready div.ccm-page.ccm-panel-detail-disable-transition {
	.transition(none);
}

/** 
 * Panel Forms
 */

div.ccm-panel-detail-form-actions {
	.opacity(0);
	.transition(opacity 0.5s cubic-bezier(0.190, 1.000, 0.220, 1.000));
}

div#ccm-panel-detail-form-actions-wrapper {
	position: fixed;
	bottom: 0px;
	left: 0px;
	z-index: @index-level-panel-detail-form-actions;
	width: 100%;

	div.ccm-panel-detail-form-actions {
		.clearfix;
		margin: 0px 20px 20px 340px;
		background-color: #e3eaee;
		padding: 30px;
		border: 1px solid #c9ced2;
		.border-radius(2px);
	}
}

div.ccm-panel-detail-static {
	div#ccm-panel-detail-form-actions-wrapper {
		div.ccm-panel-detail-form-actions {
			.opacity(1);
		}
	}
}

/** 
 * Panel accordion
 */

div.ccm-panel-header-accordion {
	
	position: relative;
	padding-bottom: 0px !important;

	nav {
		li { 
			list-style-type: none;
		}
		ul {
			margin-bottom: 0px;
		}

		li > a, span {
		    display: block;
		    position: relative;
			line-height: 15px;
			font-size: 15px;
			font-weight: 300;
			padding: 18px 15px 19px 40px;
			font-weight: normal;
			text-decoration: none;
			cursor: pointer;
			.user-select(none);
			.transition(background-color 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000));
		}

		li a:hover {
			text-decoration: none;
		}

		ul.ccm-panel-header-accordion-dropdown {
			height: 0px;
			overflow: hidden;
			margin-left: 0px;
			padding-left: 0px;
			.transition(height 0.5s cubic-bezier(0.190, 1.000, 0.220, 1.000));

			a {
				pointer: cursor;
			}
		}

		ul.ccm-panel-header-accordion-dropdown:after {
		    content: "";
		    width: 0;
		    height: 0;
		    position: absolute;
		    top: 22px;
		    right: 15px;
		    border-width: 6px 6px 0px 6px;
		    border-style: solid;
		}


		 
	}
}

div.ccm-panel-header-accordion-dropdown-visible {
	nav {
		ul.ccm-panel-header-accordion-dropdown:after {
		    border-width: 0px 6px 6px 6px;
		}
	}
}


/** 
 * Panel check boxes
 */

.ccm-panel {	
	input[type=checkbox], input[type=radio] {
		appearance: none;
		-webkit-appearance: none;
		padding: 9px;
		margin-right: 10px;
		margin-top: -1px;
		display: inline-block;
		float: left;
		position: relative;
		.border-radius(3px);

		&:focus {
			outline: 0px;
		}

		&:checked:after {
			content: '\2714';
			font-size: 14px;
			position: absolute;
			top: 0px;
			left: 3px;
		}
	}
}

/** 
 * Panel list groups
 */
.ccm-panel {
	.list-group {
		.list-group-item {
			.transition(background-color 0.2s linear);
		}

		label.list-group-item {
			font-weight: normal;
			cursor: pointer;
		}

		div.list-group-item-collapse-wrapper {
			.transition(height 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000));
			display: none;
			overflow: hidden;
			.list-group-item:last-child {
				margin-bottom: -1px;
				.border-radius(0px);
			}
		}

		a.list-group-item-collapse {
			padding-left: 45px;
			font-size: 12px;
			position: relative;
			span {

				&:after {
				    content: "";
				    width: 0;
				    height: 0;
				    position: absolute;
				    top: 15px;
				    left: 18px;
				    border-width: 6px 6px 0px 6px;
				    border-style: solid;
				}

			}
		}

		&.ccm-panel-list-group-item-expanded {

			a.list-group-item-collapse {
				span {
					&:after {
					    border-width: 0px 6px 6px 6px;
					}
				}
			}
		}
	}
}

/** 
 * Dark panel mixin
 */
.ccm-panel-dark() {

	input[type=checkbox], input[type=radio] {
		border: 1px solid #24272c;
	}

	input[type=checkbox]:checked:after, input[type=radio]:checked:after {
		color: #3baaf7;
	}

	background-color: #2a2c30;
	div.ccm-panel-shadow-layer {
		.box-shadow(inset -10px 10px 10px rgba(20,20,20,0.3));
	}

	.ccm-panel-content-inner {
		color: #e7e7e7;
	}

	a.ccm-panel-back {
		color: #5b5c5f;
	}

	a.ccm-panel-back:hover {
		color: #3baaf7;
	}

	a {color: #2aa9dd}
	a:hover {color: #2aa9dd;}

	div.ccm-panel-content-inner {
		textarea {
			border: 1px solid #101114;
			background-color: #4c4e53;
			color: #bababa;
		}
	}

	.pager {
		li {
			a {
				background-color: transparent;
				color: #5b5c5f;
				border: 1px solid #34353a;
			}

			a:hover {
				background-color: #303136;		
			}
		}
	}
	.list-group {


		.list-group-item {
			background-color: #171c22;
			color: #7f8d90;
			border: 1px solid #0c1117;
			border-left: 0px;
			border-right: 0px;

			&.list-group-item-header {
				background-color: #000;
				&:hover {
					background-color: #000;
				}
			}

			&.list-group-item-collapse {
				color: #2e2e2e;

				span:after {
					border-color: #2e2e2e transparent transparent transparent;
				}

			}

			&.list-group-item-active, &:hover {
				background-color: #12171d;
			}

		}

		&.ccm-panel-list-group-item-expanded {

			a.list-group-item-collapse {
				span {
					&:after {
						border-color: transparent transparent #2e2e2e transparent;
					}
				}
			}
		}
	}
}


/**
 * Panel Confirmation
 */
div.ccm-panel-confirmation-wrapper {
	position: fixed;
	z-index: @index-level-panel-dialog;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;

	div.ccm-panel-confirmation {
		background-color: #000;
		color: #fff;
		.opacity(0);
		padding: 40px 60px 40px 60px;
		.border-radius(2px);
	    -webkit-filter: blur(10px);
	    -moz-filter: blur(10px);
	    -o-filter: blur(10px);
	    -ms-filter: blur(10px);
	    filter: blur(20px);
	    .opacity(0.4);
		-webkit-transform: translate3d(0, 0, 0);
		.transition(all 0.3s ease-out);

		p {
			font-size: @font-size-large;
			line-height: 32px;
			font-weight: 100;
		}
	}

	&.ccm-panel-confirmation-displayed {
		div.ccm-panel-confirmation {
			.opacity(1);
		    -webkit-filter: blur(0px);
		    -moz-filter: blur(0px);
		    -o-filter: blur(0px);
		    -ms-filter: blur(0px);
		    filter: blur(0px);			
		}
	}

	&.ccm-panel-confirmation-disappearing {
		div.ccm-panel-confirmation {
			.opacity(0);		
		}
	}
}
<commit_msg>Fix semi colon typo<commit_after>div.ccm-panel {
	width: 320px;
	height: 100%;
	position: fixed;
	top: 0px;
	z-index: @index-level-panel; // has to come above the detail actions wrapper
	overflow: hidden;
}

div#ccm-panel-overlay {
	z-index: @index-level-panel-overlay;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: none;
	background: transparent;
	.transition(background-color cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
}

div#ccm-panel-overlay.ccm-panel-translucent {
	background-color: rgba(255,255,255,0.7);
}


html.ccm-panel-ready.ccm-panel-left {
	div.ccm-page {
		.translate3d(320px, 0, 0);
	}
}

html.ccm-panel-ready.ccm-panel-right {
	div.ccm-page {
		.translate3d(-320px, 0, 0);
	}
}

html.ccm-panel-ready.ccm-panel-transition-none {
	div.ccm-page {
		.transition(none);
	}
}

html.ccm-panel-ready {

	div.ccm-page {
		.backface-visibility(hidden);
		.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
	}

}

div.ccm-panel-transition-none.ccm-panel-left {
	left: -320px;
}

div.ccm-panel-transition-none.ccm-panel-left.ccm-panel-active {
	left: 0px;
}

div.ccm-panel-transition-slide.ccm-panel-left {
	.translate3d(-100%, 0, 0);
	left: 0px;
	.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
}

div.ccm-panel-transition-none.ccm-panel-right {
	right: -320px;
}

div.ccm-panel-transition-none.ccm-panel-right.ccm-panel-active {
	right: 0px;
}

div.ccm-panel-transition-slide.ccm-panel-right {
	.translate3d(100%, 0, 0);
	right: 0px;
	.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);
}

div.ccm-panel-left.ccm-panel-transition-slide.ccm-panel-active {
	.translate3d(0, 0, 0);
}

div.ccm-panel-right.ccm-panel-transition-slide.ccm-panel-active {
	.translate3d(0, 0, 0);
}

/** 
 * Shadow layer
 */

div.ccm-panel-right div.ccm-panel-shadow-layer {
	width: 20px;
	height: 100%;
	position: absolute;
	top: 0px;
	z-index: @index-level-panel;
	.box-shadow(inset 10px 10px 10px rgba(128,128,128,0.3));
}

div.ccm-panel-left div.ccm-panel-shadow-layer {
	width: 20px;
	height: 100%;
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: @index-level-panel;
	.box-shadow(inset -10px 10px 10px rgba(128,128,128,0.3));
}

/**
 * Panel Content
 */
div.ccm-panel-content {
	padding: 48px 0px 0px 0px;
	position: absolute;
	top: 0px;
	height: 100%;
	overflow: auto;
	width: 320px;
	left: 0px;
	.transition-transform(cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s);

}

div.ccm-panel div.ccm-panel-content {}

div.ccm-panel.ccm-panel-loaded div.ccm-panel-content {}

div.ccm-panel-content {
	header {
		font-size: 16px;
		padding: 15px 15px 15px 40px;
		margin-bottom: 10px;
		font-weight: 500;

		aside {
			float: right;
			font-size: 11px;
			font-weight: lighter;
			margin-top: 4px;

			a {text-decoration: none;}
		}
	}

	ul.nav, menu {

		margin: 20px 30px 0px 20px;
		padding: 0px;

		> li {
			margin-top: 10px;
		}


		li {
			
			list-style-type: none;

			a {
				display: block; 
				text-decoration: none;
				font-size: 14px;
				font-weight: 500;
				padding: 5px 21px 5px 20px;
				.border-radius(4px);
			}

			a:hover {
				text-decoration: none;
			}

			ul {
				li {
					margin-top: 3px;
				}

				a {
					.border-radius(0px);
					display: inline;
					padding: 0px;
					font-weight: 400;

					&:hover {
						background-color: auto;
					}
				}
			}
		}

	}
}

div.ccm-panel-content-inner {
	padding: 20px 40px 40px 40px;
}


/** 
 * Dashboard Panel
 */
div#ccm-panel-dashboard {
	background-color: #dde2e7;
	color: #5d6a78;
	header {
		color: #97aabc;
		background-color: #414d59;

		aside a {
			color: #7a838e;
		}
	}

	menu, ul.nav {
		li {
			a {
				color: #4674a1;

				&:hover{ 
					color: #0c253e;
				}

				&.nav-selected, &.nav-path-selected {
					color: #0c253e;
				}
			}
		}

		> li > a:hover {	background-color: #c9d4de;}
	}

	div.ccm-panel-header-accordion {

		nav {

			ul.ccm-panel-header-accordion-dropdown:after {
				border-color: #7b8692 transparent;
			}

			li > a:hover {
				background-color: #3f4750;
			}

			li > a {
				color: #fff;
				background-color: #525d69;
			}

			span {
				color: #97aabc;
				background-color: #414d59;

				&:hover {
					background-color: #333c46;
				}
			}
		}

		&.ccm-panel-header-accordion-dropdown-visible {
			span {
				background-color: #333c46;
			}
		}
	}

	div.ccm-panel-header-accordion-dropdown-visible {
		nav {
			ul {
				height: 105px !important;
			}
		}
	}

	div.ccm-panel-dashboard-footer {
		margin-left: 40px;
		margin-top: 20px;
		border-top: 1px solid #c6cbcf;
		padding-top: 10px;
		font-size: @font-size-small;
		p {
			line-height: @line-height-small;
			margin-bottom: 5px;
		}
		color: #5d6a78;
	}

}

/** 
 * New Page
 */
div#ccm-panel-sitemap {
	background-color: #eff7fd;
}

/** 
 * Properties
 */
div#ccm-panel-page, div#ccm-panel-compose-page {
	.ccm-panel-dark();

	header {
		color: #3baaf7;
		background-color: #202226;

		aside a {
			color: #565759;
		}
	}

	menu.ccm-panel-page-basics {
		border-bottom: 1px solid #36383c;
	}

	menu {
		
		padding-bottom: 20px;

		li {
			a {
				color: #737c8e;
			}

			a:hover {
				background-color: #222427;
				color: #dce5f7;
			}

			a.ccm-panel-menu-item-active {
				background-color: #151619;
				color: #3baaf7;
			}
		}
	}

}




/** 
 * Panel Drill Down
 */
div.ccm-panel-slide-left {
	-webkit-transform: translate3d(-320px, 0, 0);
}

div.ccm-panel-slide-right {
	-webkit-transform: translate3d(320px, 0, 0);
}

div.ccm-panel-content-appearing {
	-webkit-transform: translate3d(320px, 0, 0);
}

div.ccm-panel-content.ccm-panel-content-visible {
	-webkit-transform: translate3d(0px, 0, 0);
}

a.ccm-panel-back,
a.ccm-panel-back:hover {
	font-size: 12px;
	text-decoration: none;
	margin-right: 4px;
}



/** 
 * Panel main detail areas
 */
div.ccm-panel-detail {
	z-index: @index-level-panel-detail;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	display: none;
	.box-sizing(border-box);
	background: transparent;
	padding-top: 48px;

	&.ccm-panel-detail-static {
		display: block;
	}

	&.ccm-panel-detail-static-left {
		padding-left: 321px;
	}

	&.ccm-panel-detail-static-right {
		padding-right: 321px;
	}

	fieldset {
		legend {
			border: 0px;
		}

		padding-bottom: 20px;
		border-bottom: 1px solid @legend-border-color;
		margin-bottom: 20px;
		margin-left: -40px;
		padding-left: 40px;
	}

	fieldset:last-child {
		border-bottom: 0px;
	}


}


html.ccm-panel-left div.ccm-panel-detail {
	padding-left: 321px;
}

html.ccm-panel-right div.ccm-panel-detail {
	padding-right: 321px;
}

div.ccm-panel-detail-content {
	padding: 40px 40px 90px 40px;

	div.ccm-notification-help {
		position: absolute;
		right: 0px;
		top: 110px;
	}
}

@media (min-width: @screen-medium) {
	div.ccm-panel-detail-content {
		form.ccm-panel-detail-content-form {
			width: 600px;
		}
	}
}


div.ccm-panel-detail {

	header {
		font-size: 22px;
		margin: -40px -40px 30px -95px;
		padding: 34px 80px 34px 95px;
		font-weight: 600;
	}

	hr {
		margin-left: -40px;
		margin-right: -40px;
		border-bottom-width: 1px;
		border-bottom-style: solid;
	}

}

/** 
 * Panel Detail - Properties
 */
div#ccm-panel-detail-page-properties,
div#ccm-panel-detail-page-seo,
div#ccm-panel-detail-page-composer,
div#ccm-panel-detail-page-versions,
div#ccm-panel-detail-page-attributes,
div#ccm-panel-detail-page-caching,
div#ccm-panel-detail-page-permissions,
div#ccm-panel-detail-page-location {
	
	background-color: #f3fbff;

	div.ccm-panel-detail-content {
		background-color: #f3fbff;
	}

	header {
		background-color: #e1f4ff;
		color: #105192;
	}

	hr {
		border-bottom-color: #c6d3db;
	}
}

/** 
 * Panel Detail swap
 */
div.ccm-panel-detail.ccm-panel-detail-transition-swap {
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	display: block;
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

div.ccm-panel-detail.ccm-panel-detail-transition-swap.ccm-panel-detail-transition-swap-apply {
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

div.ccm-panel-detail.ccm-panel-detail-transition-swap.ccm-panel-detail-transition-swap-remove {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

/** 
 * Panel Detail Fade
 */
div.ccm-panel-detail.ccm-panel-detail-transition-fade {
	.transition(opacity 0.5s cubic-bezier(0.190, 1.000, 0.220, 1.000));
	.opacity(0);
	display: block;
}
div.ccm-panel-detail.ccm-panel-detail-transition-fade-apply {
	.opacity(1);
}



/** 
 * Miscellaneous effects classes 
 * First we have to push the item with positioning
 * because it's going to lose its position once the new effect takes place.
 */

html.ccm-panel-left div.ccm-page.ccm-panel-detail-transition-swap {
	position: relative;
	left: 320px;
}

html.ccm-panel-right div.ccm-page.ccm-panel-detail-transition-swap {
	position: relative;
	right: 320px;
}

html.ccm-panel-ready div.ccm-page.ccm-panel-detail-transition-swap {
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

html.ccm-panel-ready div.ccm-page.ccm-panel-detail-transition-swap.ccm-panel-detail-transition-swap-apply {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	transition-easing: none;
	-webkit-transition-easing: none;
}

div.ccm-panel-detail.ccm-panel-detail-transition-none.ccm-panel-detail-transition-none-apply {
	display: block;
}

html.ccm-panel-ready div.ccm-page.ccm-panel-detail-disable-transition {
	.transition(none);
}

/** 
 * Panel Forms
 */

div.ccm-panel-detail-form-actions {
	.opacity(0);
	.transition(opacity 0.5s cubic-bezier(0.190, 1.000, 0.220, 1.000));
}

div#ccm-panel-detail-form-actions-wrapper {
	position: fixed;
	bottom: 0px;
	left: 0px;
	z-index: @index-level-panel-detail-form-actions;
	width: 100%;

	div.ccm-panel-detail-form-actions {
		.clearfix;
		margin: 0px 20px 20px 340px;
		background-color: #e3eaee;
		padding: 30px;
		border: 1px solid #c9ced2;
		.border-radius(2px);
	}
}

div.ccm-panel-detail-static {
	div#ccm-panel-detail-form-actions-wrapper {
		div.ccm-panel-detail-form-actions {
			.opacity(1);
		}
	}
}

/** 
 * Panel accordion
 */

div.ccm-panel-header-accordion {
	
	position: relative;
	padding-bottom: 0px !important;

	nav {
		li { 
			list-style-type: none;
		}
		ul {
			margin-bottom: 0px;
		}

		li > a, span {
		    display: block;
		    position: relative;
			line-height: 15px;
			font-size: 15px;
			font-weight: 300;
			padding: 18px 15px 19px 40px;
			font-weight: normal;
			text-decoration: none;
			cursor: pointer;
			.user-select(none);
			.transition(background-color 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000));
		}

		li a:hover {
			text-decoration: none;
		}

		ul.ccm-panel-header-accordion-dropdown {
			height: 0px;
			overflow: hidden;
			margin-left: 0px;
			padding-left: 0px;
			.transition(height 0.5s cubic-bezier(0.190, 1.000, 0.220, 1.000));

			a {
				pointer: cursor;
			}
		}

		ul.ccm-panel-header-accordion-dropdown:after {
		    content: "";
		    width: 0;
		    height: 0;
		    position: absolute;
		    top: 22px;
		    right: 15px;
		    border-width: 6px 6px 0px 6px;
		    border-style: solid;
		}


		 
	}
}

div.ccm-panel-header-accordion-dropdown-visible {
	nav {
		ul.ccm-panel-header-accordion-dropdown:after {
		    border-width: 0px 6px 6px 6px;
		}
	}
}


/** 
 * Panel check boxes
 */

.ccm-panel {	
	input[type=checkbox], input[type=radio] {
		appearance: none;
		-webkit-appearance: none;
		padding: 9px;
		margin-right: 10px;
		margin-top: -1px;
		display: inline-block;
		float: left;
		position: relative;
		.border-radius(3px);

		&:focus {
			outline: 0px;
		}

		&:checked:after {
			content: '\2714';
			font-size: 14px;
			position: absolute;
			top: 0px;
			left: 3px;
		}
	}
}

/** 
 * Panel list groups
 */
.ccm-panel {
	.list-group {
		.list-group-item {
			.transition(background-color 0.2s linear);
		}

		label.list-group-item {
			font-weight: normal;
			cursor: pointer;
		}

		div.list-group-item-collapse-wrapper {
			.transition(height 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000));
			display: none;
			overflow: hidden;
			.list-group-item:last-child {
				margin-bottom: -1px;
				.border-radius(0px);
			}
		}

		a.list-group-item-collapse {
			padding-left: 45px;
			font-size: 12px;
			position: relative;
			span {

				&:after {
				    content: "";
				    width: 0;
				    height: 0;
				    position: absolute;
				    top: 15px;
				    left: 18px;
				    border-width: 6px 6px 0px 6px;
				    border-style: solid;
				}

			}
		}

		&.ccm-panel-list-group-item-expanded {

			a.list-group-item-collapse {
				span {
					&:after {
					    border-width: 0px 6px 6px 6px;
					}
				}
			}
		}
	}
}

/** 
 * Dark panel mixin
 */
.ccm-panel-dark() {

	input[type=checkbox], input[type=radio] {
		border: 1px solid #24272c;
	}

	input[type=checkbox]:checked:after, input[type=radio]:checked:after {
		color: #3baaf7;
	}

	background-color: #2a2c30;
	div.ccm-panel-shadow-layer {
		.box-shadow(inset -10px 10px 10px rgba(20,20,20,0.3));
	}

	.ccm-panel-content-inner {
		color: #e7e7e7;
	}

	a.ccm-panel-back {
		color: #5b5c5f;
	}

	a.ccm-panel-back:hover {
		color: #3baaf7;
	}

	a {color: #2aa9dd}
	a:hover {color: #2aa9dd;}

	div.ccm-panel-content-inner {
		textarea {
			border: 1px solid #101114;
			background-color: #4c4e53;
			color: #bababa;
		}
	}

	.pager {
		li {
			a {
				background-color: transparent;
				color: #5b5c5f;
				border: 1px solid #34353a;
			}

			a:hover {
				background-color: #303136;		
			}
		}
	}
	.list-group {


		.list-group-item {
			background-color: #171c22;
			color: #7f8d90;
			border: 1px solid #0c1117;
			border-left: 0px;
			border-right: 0px;

			&.list-group-item-header {
				background-color: #000;
				&:hover {
					background-color: #000;
				}
			}

			&.list-group-item-collapse {
				color: #2e2e2e;

				span:after {
					border-color: #2e2e2e transparent transparent transparent;
				}

			}

			&.list-group-item-active, &:hover {
				background-color: #12171d;
			}

		}

		&.ccm-panel-list-group-item-expanded {

			a.list-group-item-collapse {
				span {
					&:after {
						border-color: transparent transparent #2e2e2e transparent;
					}
				}
			}
		}
	}
}


/**
 * Panel Confirmation
 */
div.ccm-panel-confirmation-wrapper {
	position: fixed;
	z-index: @index-level-panel-dialog;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;

	div.ccm-panel-confirmation {
		background-color: #000;
		color: #fff;
		.opacity(0);
		padding: 40px 60px 40px 60px;
		.border-radius(2px);
	    -webkit-filter: blur(10px);
	    -moz-filter: blur(10px);
	    -o-filter: blur(10px);
	    -ms-filter: blur(10px);
	    filter: blur(20px);
	    .opacity(0.4);
		-webkit-transform: translate3d(0, 0, 0);
		.transition(all 0.3s ease-out);

		p {
			font-size: @font-size-large;
			line-height: 32px;
			font-weight: 100;
		}
	}

	&.ccm-panel-confirmation-displayed {
		div.ccm-panel-confirmation {
			.opacity(1);
		    -webkit-filter: blur(0px);
		    -moz-filter: blur(0px);
		    -o-filter: blur(0px);
		    -ms-filter: blur(0px);
		    filter: blur(0px);			
		}
	}

	&.ccm-panel-confirmation-disappearing {
		div.ccm-panel-confirmation {
			.opacity(0);		
		}
	}
}

{'fraction_non_alphanumeric': 0.15983098770530862, 'fraction_numerical': 0.056485687962639385, 'mean_word_length': 2.862331288343558, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 15, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1440770', 'n_tokens_mistral': 16043, 'n_tokens_neox': 13016, 'n_words': 2171}