/*------------------------------------*\
  #Backend
\*------------------------------------*/


/* = Col Dividers Settings = */
#bhe-pane .el-col-divider{
	display: block;
	height: 5.6rem;
	width: 20.8rem;
	margin-left: 10rem;
	float: right;
}
#bhe-pane .el-col-divider input[type="radio"] {
	width: 4.6rem;
	height: 4.6rem;
	background-color: rgba(255,255,255,.2);
	margin: 3px;
	float: left;
	background-position: center center;
	background-size: 3rem;
	background-repeat: no-repeat;
}
#bhe-pane .el-col-divider input[type="radio"]:checked {
	background-color: #CAF56B;
	box-shadow: none;
}

#bhe-pane .el-col-divider input[value="bh-cols-2-2-10"] { background-image: url("assets/cols2-2-10.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-10-2"] { background-image: url("assets/cols2-10-2.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-3-9"] { background-image: url("assets/cols2-3-9.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-9-3"] { background-image: url("assets/cols2-9-3.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-4-8"] { background-image: url("assets/cols2-4-8.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-8-4"] { background-image: url("assets/cols2-8-4.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-5-7"] { background-image: url("assets/cols2-5-7.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-2-7-5"] { background-image: url("assets/cols2-7-5.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-3-3-3-6"] { background-image: url("assets/cols3-3-3-6.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-3-6-3-3"] { background-image: url("assets/cols3-6-3-3.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-3-3-6-3"] { background-image: url("assets/cols3-3-6-3.svg"); }
#bhe-pane .el-col-divider input[value="bh-cols-3-2-5-5"] { background-image: url("assets/cols3-2-5-5.svg"); }







/*------------------------------------*\
  #Frontend
\*------------------------------------*/



/* = Spalten Aufteilung = */
@media ( min-width: 768px ){
	.el-cols .bh-cols-2.bh-cols-2-2-10 .col1 {width: 16.666666666%} 
	.el-cols .bh-cols-2.bh-cols-2-2-10 .col2 {width: 83.33333334%}
	
	.el-cols .bh-cols-2.bh-cols-2-10-2 .col1 {width: 83.33333334%} 
	.el-cols .bh-cols-2.bh-cols-2-10-2 .col2 {width: 16.666666666%}
	
	.el-cols .bh-cols-2.bh-cols-2-3-9  .col1 {width: 25%} 
	.el-cols .bh-cols-2.bh-cols-2-3-9  .col2 {width: 75%}
	
	.el-cols .bh-cols-2.bh-cols-2-9-3 .col1 {width: 75%} 
	.el-cols .bh-cols-2.bh-cols-2-9-3 .col2 {width: 25%}
	
	.el-cols .bh-cols-2.bh-cols-2-4-8 .col1 {width: 33.33333333%} 
	.el-cols .bh-cols-2.bh-cols-2-4-8 .col2 {width: 66.6666666%}
	
	.el-cols .bh-cols-2.bh-cols-2-8-4 .col1 {width: 66.66666666%} 
	.el-cols .bh-cols-2.bh-cols-2-8-4 .col2 {width: 33.3333333%}
	
	.el-cols .bh-cols-2.bh-cols-2-5-7 .col1 {width: 41.66666665%} 
	.el-cols .bh-cols-2.bh-cols-2-5-7 .col2 {width: 58.3333333%}
	
	.el-cols .bh-cols-2.bh-cols-2-7-5 .col1 {width: 58.33333333%} 
	.el-cols .bh-cols-2.bh-cols-2-7-5 .col2 {width: 41.6666665%}
	
	.el-cols .bh-cols-3.bh-cols-3-3-3-6 .col1 {width: 25%} 
	.el-cols .bh-cols-3.bh-cols-3-3-3-6 .col2 {width: 25%} 
	.el-cols .bh-cols-3.bh-cols-3-3-3-6 .col3 {width: 50%}
	
	.el-cols .bh-cols-3.bh-cols-3-6-3-3 .col1 {width: 50%} 
	.el-cols .bh-cols-3.bh-cols-3-6-3-3 .col2 {width: 25%} 
	.el-cols .bh-cols-3.bh-cols-3-6-3-3 .col3 {width: 25%}
	
	.el-cols .bh-cols-3.bh-cols-3-3-6-3 .col1 {width: 25%} 
	.el-cols .bh-cols-3.bh-cols-3-3-6-3 .col2 {width: 50%} 
	.el-cols .bh-cols-3.bh-cols-3-3-6-3 .col3 {width: 25%}
	
	.el-cols .bh-cols-3.bh-cols-3-2-5-5 .col1 {width: 16.666666666%} 
	.el-cols .bh-cols-3.bh-cols-3-2-5-5 .col2 {width: 41.66666665%} 
	.el-cols .bh-cols-3.bh-cols-3-2-5-5 .col3 {width: 41.66666665%}
	
	
	/* = Trennlinie dazwischen = */
	.el-cols.cols-line-between .bh-col{
		position: relative;
	}
	.el-cols.cols-line-between .bh-col:after{
		content: '';
		width: 1px;
		
		height: 100%;
		position: absolute;
		right: 0;
		top: 0;
		background: black;
	}
	.el-cols.cols-line-between .bh-col:last-child:after{
		display: none;
	}
}



/*------------------------------------*\
  #Project
\*------------------------------------*/

@media ( min-width: 768px ){
	
	.el-cols.cols-line-between .bh-col{
		padding-top: 20px;
		padding-bottom: 20px;
	}
}