/* Contains the CSS styles for the home index view. */

/* Contains the common CSS constants for the whole application. */
/*#region Common colors*/
/*#endregion Common colors*/
/*#region Shadow colors*/
/*#endregion Shadow colors*/
/*#region Text*/
/* Dark color for text in the application */
/*#endregion Text*/
/*#region Content constants*/
/*#endregion*/
/*#region Z-indexes*/
/* Has to be higher than map canvas. */
/* Has to be higher than expanded map place holder. */
/* Has to be higher than expand map button. */
/* The layouts z indexes are for internal purposes only.
                                They are not for styling. */
/*#endregion Z-indexes*/
/*#region Global time picker constants*/
/*#endregion Global time picker constants*/
/* Contains mixins for the application. Mixins are methods that simplify the reuse of a block of CSS
   code with parameters. */
/* The cursor is shown as a pointer over the element */
#EntryPointRequestLoadingOverlay,
#LoadingOverlay {
  background-color: rgba(200, 200, 200, 0.7);
  background-image: url("../Shared/Images/Loading.gif");
  background-position: center center;
  background-repeat: no-repeat;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: none;
  position: absolute;
  z-index: 10000;
}
/* The entry point loading goes over the menu items in order to avoid
                                 incoherent situations in which the options of a menu are displayed
                                 with the results of another menu.*/

#EntryPointRequestLoadingOverlay {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
}
#ApplicationContent {
  background-color: #f9f7f0;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  vertical-align: top;
  width: 100%;
}
@media screen and (max-width: 800px) {
  #LoadingOverlay {
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
    position: fixed;
  }
  #EntryPointRequestLoadingOverlay {
    position: fixed;
  }
  #ApplicationContent {
    display: block;
    padding: 15px;
  }
}
@media screen and (min-width: 801px) {
  #Application {
    display: table;
    table-layout: fixed;
    width: 100%;
  }
  #ApplicationContent {
    display: table-cell;
    padding: 30px;
    width: auto;
  }
  #ApplicationLayout {
    width: 100%;
  }
  #LayoutContent {
    width: 100%;
  }
  #LoadingOverlay {
    height: -moz-calc(((100%) - (20px)));
    height: -webkit-calc(((100%) - (20px)));
    height: -o-calc(((100%) - (20px)));
    height: calc(((100%) - (20px)));
    width: -moz-calc(((100%) - (20px)));
    width: -webkit-calc(((100%) - (20px)));
    width: -o-calc(((100%) - (20px)));
    width: calc(((100%) - (20px)));
    left: 10px;
    top: 10px;
  }
}