/*Desktop*/
@media only screen and (min-width: 961px) {
   #pm_filter {		       
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;			
		display: none;	           	
        position: fixed; height: 100%; width: 300px; top: 0; z-index: 1002;	               

	}


	.sidenav {
		z-index: 20;
		height: 100%;
		width: 300px;
		position: fixed;
		z-index: 1;
		top: 50px;
		left: 0;
		font-family: Arial;
		padding-bottom: 100px;
		overflow-y: scroll;
		scrollbar-width: none; /* Firefox */
		overflow: -moz-scrollbars-none;
		-ms-overflow-style: none; /* IE 10+ */
	}

		.sidenav::-webkit-scrollbar { /* WebKit */
			width: 0;
			height: 0;
		}
}

/*Mobile*/
@media only screen and (max-width: 400px) {
   
    #pm_filter {
		background-color: whitesmoke;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		position: fixed; height: 100%; width: 300px; top: 0; z-index: 1002;
		-webkit-animation: backSlideOut .3s both ease;
		-moz-animation: backSlideOut .3s both ease;
		animation: backSlideOut .3s both ease;	
		display: none;			
	}

	.sidenav {
		z-index: -10;
		height: 100%;
		width: 300px;
		position: fixed;
		z-index: 1;
		top: 0;
		left: 0;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0c1d28+0,043e62+36,28343b+100 */
		background: rgb(245,245,245); /* Old browsers */
		overflow: auto;
		font-family: Arial;
	}


}

/*Tablet*/
@media only screen and (min-width: 301px) and (max-width: 960px) {
   
    #pm_filter {
		background-color: white;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		position: fixed; height: 100%; width: 300px; top: 0; z-index: 1002;
		-webkit-animation: backSlideOut .3s both ease;
		-moz-animation: backSlideOut .3s both ease;
		animation: backSlideOut .3s both ease;	
		display: none;			
	}

	.sidenav {
		z-index: -10;
		height: 100%;
		width: 300px;
		position: fixed;
		z-index: 1;
		top: 0;
		left: 0;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0c1d28+0,043e62+36,28343b+100 */
		background: rgb(245,245,245); /* Old browsers */
		overflow: auto;
		font-family: Arial;
	}


}



.sidenav_block a {    
	display: block;
	font-family:  Arial;
	font-size: 16px;
	font-weight: 300;
	color: black;
	text-decoration: none;
	height: 40px;    
       
}

.sidenav_block a:hover {    
	display: block;
	background-color: rgba(4,62,98,1);
	color: white;
	height: 40px;
    text-decoration:none;
}

.sidenav_block img {
	vertical-align: middle;
	margin: 0px 10px 0px 10px;
	width: 20px;
	height: 20px;
 }

	#pm_filter.pm_open{
		left: 0px;
		-webkit-animation: backSlideIn .5s both ease;
		-moz-animation: backSlideIn .5s both ease;
		animation: backSlideIn .5s both ease;        
		display: block;
	}
.pm_overlay_filter {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	position: fixed;
	z-index: 1001;
	background: rgba(0,0,0,0.7);
	left: 0;
	top: 0;
	-webkit-animation: fadeOut .5s both ease;
	-moz-animation: fadeOut .5s both ease;
	animation: fadeOut .5s both ease;
	display: none;
}
.pm_overlay_filter.pm_show {
	display: block;
	opacity: 1;
	-webkit-animation: fadeIn .3s both ease;
	-moz-animation: fadeIn .3s both ease;
	animation: fadeIn .3s both ease;
}
.pm_overlay_filter.pm_hide {
	display: none;
}
	/* Keyframes */
	/*empty*/
	@-webkit-keyframes empty {
	  0% {opacity: 1}
	}
	@-moz-keyframes empty {
	  0% {opacity: 1}
	}
	@keyframes empty {
	  0% {opacity: 1}
	}
	@-webkit-keyframes fadeIn {
	  0% { opacity:0; }
	  100% { opacity:1; }
	}
	@-moz-keyframes fadeIn {
	  0% { opacity:0; }
	  100% { opacity:1; }
	}
	@keyframes fadeIn {
	  0% { opacity:0; }
	  100% { opacity:1; }
	}
	@-webkit-keyframes fadeOut {
	  0% { opacity:1; }
	  100% { opacity:0; display: none; }
	}
	@-moz-keyframes fadeOut {
	  0% { opacity:1; }
	  100% { opacity:0; display: none; }
	}
	@keyframes fadeOut {
	  0% { opacity:1; }
	  100% { opacity:0; display: none; }
	}
	@-webkit-keyframes backSlideOut {
	  0% { opacity: 1; -webkit-transform: translateX(0px); }
	  50% { opacity: 1; }
	  100% { opacity: 0; -webkit-transform: translateX(-100%); }
	}
	@-moz-keyframes backSlideOut {
	  0% { opacity: 1; -webkit-transform: translateX(0px); }
	  50% { opacity: 1; }
	  100% { opacity: 0; -webkit-transform: translateX(-100%); }
	}
	@keyframes backSlideOut {
	  0% { opacity: 1; -webkit-transform: translateX(0px); }
	  50% { opacity: 1; }
	  100% { opacity: 0; -webkit-transform: translateX(-100%); }
	}
	@-webkit-keyframes backSlideIn {
	  0% { opacity: 0; -webkit-transform: translateX(-100%); }
	  100% { opacity: 1; -webkit-transform: translateX(0px); }
	}
	@-moz-keyframes backSlideIn {
	  0% { opacity: 0; -webkit-transform: translateX(-100%); }
	  100% { opacity: 1; -webkit-transform: translateX(0px); }
	}
	@keyframes backSlideIn {
	  0% { opacity: 0; -webkit-transform: translateX(-100%); }
	  100% { opacity: 1; -webkit-transform: translateX(0px); }
	}