
.sticky-button{ top:20%; display: flex; flex-flow: column nowrap; justify-content: flex-start; align-items: flex-end; z-index: 20; }

.sticky-button a { position: relative; flex-flow: row nowrap; justify-content: flex-start; width: auto; cursor: pointer; overflow: hidden; }

.sticky-button a .sticky-img{ position: relative; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; flex: none; width: 60px; height:60px; line-height: 0;  }
.sticky-button a .sticky-img img{ position: relative; width: 100%; height:100%;  }


.sticky-button a .sticky-desc{ flex: none; max-width: 0; transition: all cubic-bezier(.38,.04,.35,.96) 400ms; }
.sticky-button a .sticky-desc .sticky-text{position: relative; display: flex; flex-flow: row nowrap; justify-content: center; align-items: flex-start; font-size: 0.875rem; width: 8rem; padding:0 1rem 0 0; color: #000000; }
.sticky-button a .show-code{ position: absolute; width: 120px; height: 137px; border:4px solid #FFFFFF; right: 60px; opacity: 0; transition: all cubic-bezier(.38,.04,.35,.96) 400ms; }
.sticky-button a .show-code img{ position: relative; width: 100%; height:100%;  }

.sticky-button a:hover{  overflow:inherit; }
.sticky-button a:hover .sticky-desc{ max-width: 999px; transition: all cubic-bezier(.38,.04,.35,.96) 600ms; }
.sticky-button a:hover .show-code{ opacity: 1; transition: all cubic-bezier(.38,.04,.35,.96) 600ms; }



.pop-img img{ width: 100%;  }

@media (max-width:768px) {
	.sticky-button{ }
	.sticky-button a:hover{  overflow: hidden; width: 60px; height:60px; }
	.sticky-button a .sticky-desc{ flex: none; max-width: 0; transition:all 0; }
	.sticky-button a:hover .sticky-desc{ max-width: 0; transition:all 0; }

}
