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

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

  .row-offcanvas {
    position: relative;
    -webkit-transition: all .25s ease-out;
         -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
  }

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

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

  
 @media (max-width: 767px) {
	  .row-offcanvas-right
	  .sidebar-offcanvas {
		right: -65%;
	  }

	  .row-offcanvas-left
	  .sidebar-offcanvas {
		left: -65%;
	  }

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

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

	  .sidebar-offcanvas {
		position: absolute;
		top: 0;
		width: 65%;
	  }
 } 
   
 @media (min-width: 768px) and (max-width: 991px) {
	  .row-offcanvas-right
	  .sidebar-offcanvas {
		right: -35%;
	  }

	  .row-offcanvas-left
	  .sidebar-offcanvas {
		left: -35%;
	  }

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

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

	  .sidebar-offcanvas {
		position: absolute;
		top: 0;
		width: 35%;
	  }
 } 
 
 
 
 @media  (min-width: 992px) {
	  .row-offcanvas-right
	  .sidebar-offcanvas {
		right: -25%;
	  }

	  .row-offcanvas-left
	  .sidebar-offcanvas {
		left: -25%;
	  }

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

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

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