.order-product{

	margin-top:0;
	
	h3{color:$black;}
	
	.item-price{
		font-size:1.5rem;
		border-left:solid 1px $light-gray;
		padding-top:0.125rem;
		padding-bottom:0.375rem;
		margin-left:1.5rem;padding-left:1.5rem;
		vertical-align:middle;
		color:$black;
	}
	
	#orderfeedback{
		display:inline-block;
		margin-left:1.5rem;
		margin-bottom:0;
		color:$primary-color;
		@include font-for-header(700);
	}
}


.fake-input-wrapper{
	
	position:relative;z-index:100;margin-bottom:1.5em;z-index:100;
	
	.fake-input{
		cursor:pointer;padding:0.75em;position:relative;border:solid 1px $light-gray;background:#fff;
		i{position:absolute;top:50%;transform:translateY(-50%);right:1rem;}
	}
	
}


.fake-input-wrapper{

	margin-bottom:1.5rem;
	
	.fake-input{
			
		div{vertical-align:middle;@include clearfix;}
		
		img{height:1.5em;display:block;float:left;border-radius:50%;overflow:hidden;margin-right:0.75em;vertical-align:middle;}
		span.visible{display:block;float:left;vertical-align:middle;}
	}
	
	
	.fake-input-values{
	
		border-top:none;position:absolute;background-color:#fff;left:0;right:0;top:3.75em;box-shadow:0em 0.125em 0.25em rgba(0,0,0,0.5);z-index:1000;
	
		&.hidden{z-index:0;}

		ul{margin:0;padding:0;}
		ul li{list-style:none;width:50%;display:block;float:left;position:relative;background:none;border-bottom:solid 1px $light-gray;margin:0;padding:0;}
	
		a.option{display:block;padding:0;color:#000;text-decoration:none;padding:0.5rem;@include clearfix;}
		a.option.checked{color:#cd1619;background: url(../images/icon-checked-red.svg) no-repeat 0.75em 60%;background-size: 12px 10px;}
	
		span{display:inline-block}
	
		img{height:2em;margin-right:0.75em;display:inline-block;border-radius:50%;overflow:hidden;}
		
		&.hidden{display:none;}
		
	}
}


.template-image{

	position:relative;
	z-index:10;
	overflow:hidden;
	
	.mask{
		position:relative;
		z-index:10;
		height:0;
		padding-bottom:80%;
		background: url(../images/map_template.png) no-repeat 50% 50%;
		&.schetsboek{
			background: url(../images/schetsboek-template2.png) no-repeat 50% 50%;
		}
		
		&.bullet-journal{
			background: url(../images/bulletjournal_template.png) no-repeat 50% 50%;
		}
	}

	.template{
		position:relative;
		z-index:10;		
	}
	
	.material{
		position:absolute;
		z-index:0;
		top:0;
		left:0%;
		transform: translateX(0%) perspective(160px) rotateY(-8deg) skew(0deg, 3deg);
		display:block;
		max-width:100%;
		
		
		
		//transform: matrix3d(1,0,0,-0.00075,0,1,0,0,0,0,1,0,-300,-50,0,1);
		//transform: perspective(700px) rotateY(-25deg) rotateZ(0deg) translate(-75%, -25%) scale(0.5);
	}
	
}


.related-products{
	h3{color:$black;}
}


.shopping-cart{
	
	.item{

		border-bottom:solid 1px $light-gray;
		padding:0.75rem 0;
	
		.article-image{
			margin-right:1.5rem;
			width:3rem; 
			height:3rem;
			display:block;
			position:relative;
			float:left;
			&::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;height:100%;background: url(../images/map_template.png) no-repeat 0 0;z-index:10;background-size:auto 3rem;}
			
			&.schetsboek::after{
				background-image: url(../images/schetsboek-template2.png);
			}
		
			&.bullet-journal::after{
				background-image: url(../images/bulletjournal_template.png);
			}
			
			img{
				height:3rem;
			} 
		}
		
		select{
			margin:0;
			height:auto;
		}
	}
	
	.order-sum{
		
		margin-top:3rem; 
		margin-bottom:1.5rem;		
			
		.total{border-top:solid 1px $light-gray;border-bottom:solid 1px $light-gray;font-size:1.375rem;font-weight:700;margin-top:0.75rem;margin-bottom:0.75rem;padding-top:0.5rem;padding-bottom:0.75rem}
		.tax{color:$medium-gray;}
		
	}
	
	
	label.group{
		@include font-for-header(700);
		color:$primary-color;
		font-size:1.5rem;
	}
}


/*
.fake-input.not-selected{color:#000;padding-right:1.5em}
	.fake-input.not-selected > span{min-height:1.5em;}
.fake-input.not-selected span.inlay{float:left;}
*/

//.fake-input-wrapper .error{margin-top:1.5em;left:0;font-size:0.875em !important;}


//	.fake-input-values.inlays ul a.selected::after{content:"✓";position:absolute;right:0.75em;top:0.375em;}