@charset "utf-8";
/* CSS Document */

.offcanvas {
	background-color: #000;

	position: absolute;
    top: 0;
    right: -315px;
	z-index: 100;

	width: 315px;
	height: 100%;

	overflow-x: hidden;
	scrollbar-color: #967a48 #000;

	transition: 0.5s;
}
	.offcanvas .row.closerow {
		padding: 30px 20px;
	}
		.offcanvas .row.closerow a {
			font-weight: 600;
			color: #967a48;
			text-decoration: none;
		}
		.offcanvas .row.closerow a:hover {
			color: #967a48;
			text-decoration: underline;
		}
	.offcanvas label {
		color: #fff;
	}
	.offcanvas .form-group {
		margin-bottom: 20px;
		padding: 0 20px;
	}
	.offcanvas .form-field {
		background: #606060;
    	color: #fff;
	}
	.offcanvas .form-select {
		background: #606060;
    	color: #fff;
	}
	.offcanvas .filter-panel-btn-submit {
		background: #000;
	    border-top: 1px solid #353535;

	    position: sticky;
	    right: 0;
	    bottom: 0;

	    display: flex;
	    align-items: center;
	    justify-content: center;

	    padding: 20px 35px;

	    width: 100%;
	    height: auto;
	}

.offcanvas.open {
	position: fixed;
    right: 0;
}
#offCanvasWrapper.open {
    opacity: 0.4;
    right: 0;
}

#offCanvasWrapper {
	transition: right 0.5s;
}
#offCanvasWrapper .sticky-element {
	background: #000;
}

@media(min-width: 320px) and (max-width: 768px) {
    .offcanvas {
        z-index: 100;
    }
    .offcanvas.open {
        width: 100%;
    }
}