@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

body {
  font-family: var(--el-font-family);
}

.single-spa-container {
  width: 100%;
  height: 100%;
}

body,
.fecontainer {
  width: 100%;
  height: 100vh;
}

.helvetica {
  --primary-font-face: 'HelveticaNeueCyr', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.montserrat {
  --primary-font-face: 'Montserrat', 'HelveticaNeueCyr', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}


.fecontainer {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: row;
}

.femaincontainer {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.femaincontent {
  width: 100%;
  height: 100%;
}

.feauth {
  width: 100%;
  height: 100%;
}

.feaside {
  --fe-aside-max-width: 220px;
  --fe-aside-min-width: 60px;
}

@media (max-width: 600px) {
  .fecontainer {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column-reverse;
  }

  .femaincontainer {
    width: 100%;
    height: 100%;
  }

  .feaside {
    min-width: 100%;
    width: 100%;
    height: 60px;
    max-height: 60px;
  }
}