
.pp-panel {
	position: relative;
	margin-bottom: 10px;

	.editable & {
		cursor: move;
	}
}

.pp-add-panel {
    padding-top: 10px;
    padding-left: 1px;
	a {
		color:#333;
	}
}

.pp-editpanel {
	position: absolute;
	/*left: 42px;*/
	/*top: 4px;*/
	display: inline-block;
	border: 1px solid #ddd;
	border-left: none;
	padding: 14px 10px;
	/*border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;*/
	width: 90%;

	a {
		color: #333;
	}

}

.pp-editpanel.selected {
	background-color: #eaeaea;
	border-bottom: 1px solid #333;
}

.pp-editpanel .pp-show, 
.pp-editpanel .pp-translationicon, 
.pp-editpanel .pp-audienceicon {
	float: right;
	margin-left: 5px;
}

.pp-title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 60%;
	float: left;
}

.pp-title,
.pp-show {
	i {
		margin-right: 5px;
		font-size: 15px;
		line-height: 16px;
		vertical-align: sub;
	}
}

.pp-icon {
	&.selected {
		border-bottom: 1px solid #333;
	}

	/*border-bottom: 1px solid #a9a9a9;*/
	border-bottom: 1px solid #333;
	font-size: 21px;
	display: inline-block;
	padding: 10px 15px;
	background-color: #eaeaea;
	color: #333;
	height: 51px;
	width: 50px;
}

.pp-paneladministration {
	border: 1px solid #ddd;
	background-color: #eaeaea;
	color: #333;
	padding: 10px;

	a {
		color: #333;
	}

	.pp-paneladministration-footer {
		padding-top: 10px;
	}
}

.pp-paneladministration-icon {
    position: relative;
    top: 3px;
}

.pp-paneladministration-heading {
    font-size: 1.6em;
    border-bottom: 1px solid gray;
    padding-bottom: 10px;
    padding-left: 10px;
}

.pp-section {
	/*border: 1px dashed gray;
    border-radius: 5px;
    padding: 10px;
    margin-top: 20px !important;
    margin: 0px;*/
	/*padding: 10px;
    padding-bottom: 20px;*/
	margin-top: 20px !important;
	margin: 0;
	background-color: #fff;
	border: 1px solid #ddd;
	border-bottom: 1px solid #333;
}

.pp-section-hidden {    
    display:none;
}

.pp-section-header {
	/*background-color: rgba(100, 100, 100, 0.4);*/
	border-radius: 5px;
	padding: 15px 15px 5px 10px;
	position: relative;

	.editable & {
		cursor: move;
	}
}

.pp-add-panel,
.pp-section-header,
.pp-section-content,
.pp-paneladministration-footer {
	i {
		font-size: 11px;
		margin-right: 5px;
	}
}

// maybe - used to show drag area
.ui-sortable-placeholder {
	border:1px solid #ddd !important;
	visibility:visible !important;
	background-color:transparent !important;
	border:1px solid #f2f2f2 !important;
}

.pp-section-header-meta {
	i {
		font-size: 13px;
		margin-left: 5px;
		margin-right: 0;
		/*color: #0078d7;*/
		color:red;
	}
}

.pp-section-header .dropdown {
	display: inline-block;
}

.pp-section-header .dropdown .btn {
    border-radius: 3px;
    height: 30px !important;
    padding-top: 3px;
    padding-bottom: 3px;
}


.pp-section-delete {
    position: absolute;
    right: 10px;
    top: 10px;
}

.pp-section-content {
	/*padding-top: 10px;
    padding-bottom: 10px;*/
}

.pp-component-zone {
    /*border: 1px dashed gray;
    border-radius: 5px;
    padding: 10px;
    margin-top: 10px !important;
    margin: 0px;*/
    
    
    padding: 10px;
    /*padding-bottom: 25px;*/
    /*margin-top: 10px !important;*/    
}

.pp-component {
	margin-bottom: 10px;
	padding-bottom: 10px;
	background-color: #f8f8f8;
	padding: 10px;
	position: relative;
	border: 1px solid #ddd;

	.editable & {
		cursor: move;
	}
}

.pp-component-add {
	//position:
	/*position:absolute;
    bottom: 6px;*/
	white-space: nowrap;
	padding: 5px 0;
	display: inline-block;
}


@media screen and (max-width: 1360px) {
	
	.pp-icon {
		padding: 20px 15px;
		height: 72px;
	}
}