/*******************************
* MODAL AS LEFT/RIGHT SIDEBAR
* Add "left" or "right" in modal parent div, after class="modal".
* Get free snippets on bootpen.com
*******************************/
	.modal.left .modal-dialog,
	.modal.right .modal-dialog {
		position: fixed;
		margin: auto;
		width: 600px;
		height: 100%;
		-webkit-transform: translate3d(0%, 0, 0);
		    -ms-transform: translate3d(0%, 0, 0);
		     -o-transform: translate3d(0%, 0, 0);
		        transform: translate3d(0%, 0, 0);
	}
	.modal.large.left .modal-dialog,
	.modal.large.right .modal-dialog {
		max-width: 900px;
	}
	.modal.small.left .modal-dialog,
	.modal.small.right .modal-dialog {
		max-width: 300px;
	}

	.modal.left .modal-content,
	.modal.right .modal-content {
		height: auto;
		max-height: 100%;
		overflow-y: auto;
	}
	
	.modal.left .modal-body,
	.modal.right .modal-body {
		/*padding: 15px 15px 80px;*/
	}

/*Left*/
	.modal.left.fade .modal-dialog{
		left: -600px;
		-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, left 0.3s ease-out;
		        transition: opacity 0.3s linear, left 0.3s ease-out;
	}
	.modal.large.left.fade .modal-dialog{
		left: -900px;
	}
	.modal.small.left.fade .modal-dialog{
		left: -300px;
	}
	
	.modal.left.fade.in .modal-dialog{
		left: 0;
	}
        
/*Right*/
	.modal.right.fade .modal-dialog {
		right: -600px;
		-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, right 0.3s ease-out;
		        transition: opacity 0.3s linear, right 0.3s ease-out;
	}
	.modal.large.right.fade .modal-dialog{
		right: -900px;
	}
	.modal.small.right.fade .modal-dialog{
		right: -300px;
	}
	
	.modal.right.fade.in .modal-dialog {
		right: 0;
	}