html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
  #admin.app-content {
    height: 100vh;
    width: 100vw;
    #master_view {
      height: 100%;
      width: 100%;

      #sidebar {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;

        width: 220px;
        height: 100%;

        .main-container {
          position: relative;

          height: 100%;
          width: 100%;

          .icons-container {
            position: absolute;
            top: 40%;
            left: 0;

            z-index: 1;

            transition: left 0.5s ease;
          }
        }
      }

      #view_container {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        padding-bottom: calculateRem(60);

        background-color: $background-white;

        transition: left 0.5s ease;

        .view {
          max-height: 100%;

          padding-top: calculateRem(115);
          padding-right: calculateRem(115);
          padding-bottom: calculateRem(30);
          padding-left: calculateRem(150);

          overflow: auto;
        }
      }

      #sidebar.open {
        & + #view_container {
          left: 220px;
        }

        .main-container {
          .icons-container {
            left: 100%;
          }
        }
      }
    }
  }
}
