/* hide the horizontal scrollbar */
html {
	overflow-x: hidden;
}

/* make all parent containers 100% height */
html, body, .wrapper {
	height: 100%;
}

/* move the toggle button to the left and give it
   some breathing room */
.navbar-toggle {
	float: left;
	margin-left: 5px;
}

@media screen and (max-width: 767px) {
	/* outer div
     animate changes to left positioning using CSS 3 transitions
  */
	.row-offcanvas, .navbar .container {
		position: relative;
		left: 0;
    }
	.row-offcanvas, .navbar .container, .sidebar-offcanvas {
		-webkit-transition: left .2s ease-in;
		-most-transition: left .2s ease-in;
		transition: left .2s ease-in;
	}

	/* sidebar */
	.sidebar-offcanvas {
		left: -80%;
		width: 80%;
		position: fixed;
		top: 55px;
		background-color: #F7F7F7;
		padding: 0;
		height: 100%;
        overflow: auto;
	}

    .sidebar-offcanvas.active {
        left: 0;
    }

	/* content */
	.row-offcanvas.sidebar-active, .navbar .container.sidebar-active {
		left: 80%;
	}

	/* move the toggle button to the left and give it
   some breathing room */
	.navbar-toggle {
		float: left;
		margin-left: 10px;
	}
}