/*
 * Style tweaks
 * --------------------------------------------------
 */

/*
 * Off Canvas
 * --------------------------------------------------
 */
@media screen and (max-width: 767px) {
	.row-offcanvas {
		position: relative;
		-webkit-transition: all .25s ease-out;
		-o-transition: all .25s ease-out;
		transition: all .25s ease-out;
	}

	.row.row-offcanvas:not(.active) {
		margin-left: -14px;
	}
	.row.row-offcanvas.active {
		margin-left: -5px;
	}

	.row-offcanvas-right {
		right: 0;
	}

	.row-offcanvas-left {
		left: 0;
	}

	.row-offcanvas-right .sidebar-offcanvas {
		right: -50%;
	}

	.row-offcanvas-left .sidebar-offcanvas {
		left: -60%;
	}
	.row-offcanvas-left.active .sidebar-offcanvas {
		left: -50%;
	}

	.row-offcanvas-right.active {
		right: 50%;
	}

	.row-offcanvas-left.active {
		left: 50%;
	}

	.sidebar-offcanvas {
		position: absolute;
		top: 0;
		width: 50%;
	}

	.offcanvas-toggle {
		background-color: transparent;
		background-image: none;
		border: 1px solid transparent;
		border-radius: 4px;
		/*float: right;*/
		/*margin-bottom: 8px;*/
		margin-left: 15px;
		margin-top: 8px;
		padding: 8px 10px;
		position: relative;
	}
	.offcanvas-toggle:focus {
		outline: 0 none;
	}
	.offcanvas-toggle .icon-bar {
		border-radius: 1px;
		display: block;
		height: 2px;
		width: 22px;
	}
	.offcanvas-toggle .icon-bar + .icon-bar {
		margin-top: 4px;
	}

	.offcanvas-default .offcanvas-toggle {
		border-color: #ddd;
	}
	.offcanvas-default .offcanvas-toggle:focus,
	.offcanvas-default .offcanvas-toggle:hover {
		background-color: #ddd;
	}
	.offcanvas-default .offcanvas-toggle .icon-bar {
		background-color: #888;
	}
}

@media screen and (min-width: 768px) {
	.offcanvas-toggle {
		display: none;
	}
}