.socials li {position:relative;}
.socials .qr {position:absolute;display:none;}
.socials .qr .qr__img {max-width:none; width:120px;}


.qr {
	opacity: 0;
	border: 7px solid #f5c41e;
	transition: all .3s ease-out;
}

.qr--open {
	opacity: 1;
	z-index: 100;
}

.qr--top {
	bottom: 0;
	-webkit-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.qr--top:after {
	bottom: -19px;
	-webkit-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.qr--top.qr--open {
	bottom: 49px;
}

.qr__img {
	display: block;
	width: 115px;
	height: 115px;
	max-width: 115px;
}