/*basket panel style*/

.bp-header {
	height: 46px;
	line-height: 46px;
	color: #338d35;
	font-size: 1.3em;
	padding-left: 40px;
	background: url(../img/bp-header.png) 2px center no-repeat;
}

.cl_basket_inner_items {
	position: relative;
	padding-bottom: 50px;
}

 .cl_basket_inner_items li:after {
	content: '';
	display: block;
	clear: both;
 }

 .cl_basket_inner_items li
{
	
	border-bottom:1px solid #ccc;
	padding: 10px 0;

}

.cl_basket_inner_items li:first-child {
	border-top:1px solid #ccc;
}

.cl_basket_inner_items_name {
	margin-left: 130px;
	display: block;
	padding-bottom: 3px;	
}

.b-total {
	display: block;
	margin-left: 130px;
	font-weight: bold;
}

.cl_basket_inner_items_name span {
	display: inline-block;
	padding-bottom: 3px;
	border-bottom:1px solid #ccc;
}

.total-cell {
	margin-left: 130px;
	display: block;
	margin-top: 20px;
}
.total-cell  span {
	background: #bfbfbf;
	display: inline-block;
	height: 30px;
	color: #fff;
	line-height: 30px;
	padding: 0 15px;
}

.cl_basket_inner_items_img {
	display: block;	
	width: 100px;
	float: left;
}

.cl_basket_inner_items_img img
{
	width: 100%;
}


a.go-to-basket {
	position: absolute;
	bottom: 0px;
	right: 0px;
	width: 215px;
	height: 36px;
	display: block;
	text-decoration: none;
	color: #fff;
	text-align: center;
	line-height: 36px;
	background:#338d35;
}
a.go-to-basket:hover{
	background:#1e741f
}



/*	--------------------------------------------------
	Reveal Modals  MODAL BASKET
	-------------------------------------------------- */
		
	.reveal-modal-bg { 
		position: fixed; 
		height: 100%;
		width: 100%;
		background: #000;
		background: rgba(0,0,0,.6);
		z-index: 100;
		display: none;
		top: 0;
		left: 0; 
		}
	
	.reveal-modal {
		visibility: hidden;
		overflow: auto;
		top: 70px !important; 
		left: 50%;
		margin-left: -266px;
		width: 450px;
		background: #eee no-repeat -200px -80px;
		position: fixed;
		z-index: 101;
		padding: 30px 40px 34px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-box-shadow: 0 0 10px rgba(0,0,0,.4);
		}
		
	.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
	.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
	.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
	.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}
	
	.reveal-modal .close-reveal-modal {
	position: relative;
	bottom:36px;
	left: 0;
	width: 210px;
	height: 36px;
	display: block;
	text-decoration: none;
	color: #fff;
	text-align: center;
	line-height: 36px;
	background:#747474;
		cursor: pointer;
		} 
		
	.reveal-modal .close-reveal-modal:hover {
		background:#4e4e4e;
	}
	/*
		
	NOTES
	
	Close button entity is ×
	
	Example markup
	
	<div id="myModal" class="reveal-modal">
		<h2>Awesome. I have it.</h2>
		<p class="lead">Your couch.  I it's mine.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ultrices aliquet placerat. Duis pulvinar orci et nisi euismod vitae tempus lorem consectetur. Duis at magna quis turpis mattis venenatis eget id diam. </p>
		<a class="close-reveal-modal">&#215;</a>
	</div>
	
	*/