.sidebar-toggle {
	position: absolute;
	z-index: 1;
	outline: none;
	width: 60px;
	height: 60px;
	margin-top: 1em;
	cursor: pointer;
	transition: .5s;
	top: 100px;
	left: -70px;
}
.sidebar-toggle img{
	width: 100%;
}
.sidebar-close {
	z-index: 1;
	outline: none;
	width: 60px;
	height: 60px;
	cursor: pointer;
	transition: .5s;
	position: absolute;
	right: -10px;
	top: 0;
	font-size: 4rem;
}
.sidebar-toggle.is-closed {
    transform: rotate(0deg);
}
.sidebar-toggle .icon {
	font-size: 1.5rem;
	color: #fff; 
}

.sidebar {
	position: absolute;
	top: 200px;
	left: -0;
	z-index: 1;
	width: 300px;
	padding:60px 0 20px;
	background-color: #4CC3D6;
	transition: .7s;
	font-size: 1.6rem;
	color: #fff;box-shadow: 6px 0px 12px 0px rgba(0,0,0,0.6);
}
.sidebar a{
	color: #fff;
}


.sidebar.is-closed {
    transform: translateX(-340px); 
	opacity: 0;
}
.sidebar ul{
	list-style-type: none;
}
.sidebar li{
	list-style-type: none;
	margin: 0;
	padding:10px 20px 10px 36px ;
	border-top: 1px solid #fff;
	text-indent: -12px;
}
.sidebar li i{
	margin-right: 5px;
}
.sidebar li li{
	list-style-type: none;
	margin: 0;
	padding: 0;
	border-top: 0px solid #fff;
	font-size: 1.4rem;
	text-indent: 0;
}

.sidebar .bana{
	margin: auto;	
}
.sidebar .bana a{
	display: block;
	margin:5px auto;	
	width: 260px;}
.sidebar .bana a img{
	display: block;
	margin: auto;
	width: 100%;
}

@media (max-width: 1260px) {
.sidebar-btn,.sidebar{
	display: none;
}
	
	
}

@media (min-width: 1760px) {
.sidebar {
	left: calc(50vw - 510px - 340px);
}

}