/*
  The mail container is an EXTENDER to fit all the available space of the viewport
*/
.App {
  .EXTENDER();
  background-image: @app-background-texture;
  background-color: @app-background-texture-color;
  z-index: 0;

  /*
      this wrapper allows to switch through:
     - mobile layout: controller and the body are 2 ROWS;
     - other resolutions: controller and the body are 2 COLS;
  */
  .App-wrapper {

    .COLS();
    @media @onlyScreen and @smallmobile, @mobile  {
      .ROWS();
    }

    .AppController {
      .AppController();
    }

    .AppBody {
      .AppBody();
    }
  }
}