/**
 * Side-info module
 *
 * @author sb-development
*/

.side-info>.fwxaprkjqdi{
	height: 100vh;
	overflow: auto;

	max-width: 100%;
	min-width: 303px;
	box-sizing: border-box;
	position: fixed;
	top: 0;
	left: 100%;
	transform: translate(0);

	padding: 10px 15px;
	background-color: whitesmoke;

	/* transform is essential property open/close Events
	 triggering depends on it */
	transition-property: transform;
	transition-duration: .3s;
}

.side-info>.fwxaprkjqdi,
.side-info .fade{
	z-index: 1024;
}
.side-info .fade{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.5);

	opacity: 0;
	visibility: hidden;
	transition-property: opacity, visibility;
	transition-duration: .3s;
}
body.side-info__active {
	overflow: hidden;
}
body.side-info__active .side-info.active .fade{
	visibility: visible;
	opacity: 1;
}
body.side-info__active .side-info.active>.fwxaprkjqdi{
	box-shadow: 0px 0px 32px -10px #000;
}

.side-info .close{
	margin-bottom: 15px;
}

@media screen and (min-width: 783px){
	.admin-bar .side-info>.fwxaprkjqdi{
		top: 32px;
		height: calc(100vh - 32px);
	}
}
@media screen and (max-width: 782px) and (min-width:600px){
	.admin-bar .side-info>.fwxaprkjqdi{
		top: 46px;
		height: calc(100vh - 46px);
	}
}