/*
 * Style tweaks
 * --------------------------------------------------
 */
html,
body {
  overflow-x: hidden; /* Prevent scroll on narrow devices */
}

/*
footer {
  padding: 30px 0;
}

 * Off Canvas
 * --------------------------------------------------
 */

.row-offcanvas {
	position: relative;
}

/* right */

.row-offcanvas-right {
	right: 0;
}
.row-offcanvas-right .sidebar-offcanvas {
/*	right: -50%; /* 6 columns */
	right: -180px; 
}
.row-offcanvas-right.active {
	right: 180px; /* 6 columns */
}

/* left */

.row-offcanvas-left {
	left: 0;
}
.row-offcanvas-left .sidebar-offcanvas {
	left: 0; /* 6 columns */
}
.row-offcanvas-left.active {
	left: 250px; /* 6 columns */
}

.sidebar-offcanvas {
	position: fixed;
	top: 100px;
	right: 0px;
	width: 180px;
	z-index: 0;
	padding: 20px 15px ;
}

.btn.toggle {
	position: fixed;
	top: 6px;
	right: 28px;
	width: 36px;
	height: 36px;
	z-index: 2222;
	color: #fff;
	color: rgba(255,255,255,.9);
	font-size: 60px;
	line-height: .1;
	white-space: normal;
	background: transparent;
	border: none;
	cursor: pointer;
}
.btn.toggle:hover {
	color: #fff;
}
.btn.toggle span {
	display: block;
	margin-top: -28px;
}
.resize .btn.toggle {
	top: 8px;
}

.sidebar-offcanvas {
	color: #fff;
}

.sidebar-offcanvas .list-group-item, 
.sidebar-offcanvas > .ce-default
{
	padding: 7px 10px;
	font-size: 14px;
}

.sidebar-offcanvas a {
	color: #fff;
}
.sidebar-offcanvas a:hover {
	color: rgba(255,255,255,1);
}

.sidebar-offcanvas .list-group-item {
	font-size: 16px;
	text-transform: uppercase;
	border-bottom: 1px dotted rgba(255,255,255,.8);
}


@media (min-width: 480px) {
	.btn.toggle {
		top: 28px;
	}
}
@media (min-width: 768px) {
	.btn.toggle {
		top: 44px;
	}
}

@media (min-width: 1400px) {
  	.row-offcanvas-left.active {
    	left: 150px;
  	}   
}