#snackbar{visibility:hidden;min-width:250px;margin-left:-125px;background-color:#fff;color:#333;text-align:center;padding:16px;position:fixed;z-index:1;left:75%;bottom:120px;border-radius:15px 50px 30px;border:2px solid #73AD21}
#snackbar a.close-panel{font-size:20px;background-color:#f2f2f2;font-weight:100;line-height:31px;height:40px;width:40px;padding:4px 8px 5px;border-radius:15px;display:block;position:absolute;top:-20px;left:-20px;text-align: center;}
#snackbar-img {display:inline-block; width: 30%;}
#snackbar-img img {position:relative;width:100px;top:-5px;}
#snackbar-text {display:inline-block; width: 70%;}
#snackbar.show{visibility:visible;-webkit-animation:fadein 0.5s,fadeout .5s 11.5s;animation:fadein 0.5s,fadeout .5s 11.5s}
#snackbar.hide{visibility:hidden}
@-webkit-keyframes fadein {
	from{bottom:0;opacity:0}
	to{bottom:120px;opacity:1}
	}
	@keyframes fadein {
	from{bottom:0;opacity:0}
	to{bottom:120px;opacity:1}
	}
	@-webkit-keyframes fadeout {
	from{bottom:120px;opacity:1}
	to{bottom:0;opacity:0}
	}
	@keyframes fadeout {
	from{bottom:120px;opacity:1}
	to{bottom:0;opacity:0}
	}

@media (max-width: 600px) {
	#snackbar{margin: 0;min-width: 100%;padding: 10px;left: 0;border-radius: 0;	border: none;background-color: #f2f2f2;text-align: left;bottom: 0;}
	#snackbar-text { width: auto; }
	#snackbar-img{width: auto; float: left;margin-right: 20px;}
	#snackbar-img img{top: 5px;}
	#snackbar a.close-panel {left: 0;top: -30px;}
	
	@-webkit-keyframes fadein {
			from{bottom:-100px;opacity:0}
			to{bottom:0;opacity:1}
		}
		@keyframes fadein {
			from{bottom:-100px;opacity:0}
			to{bottom:0;opacity:1}
		}
		@-webkit-keyframes fadeout {
			from{bottom:-100px;opacity:0}
			to{bottom:0;opacity:1}
		}
		@keyframes fadeout {
			from{bottom:-100px;opacity:0}
			to{bottom:0;opacity:1}
		}
  }