@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:ital@0;1&display=swap");
body {
  background-image: url("../images/background.png");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100vw;
  height: 100vh;
  padding: 0px;
  margin: 0px;
  overflow-y: hidden;
  font-family: Tahoma, "Noto Sans", sans-serif;
}

.hidden {
  display: none !important;
}

.cursor-pointer {
  cursor: pointer;
}

main {
  height: 90%;
  padding: 10px;
  display: block;
}

main img {
  width: 60px;
  height: auto;
  cursor: pointer;
  padding: 5px;
  margin: 10px;
  position: absolute;
}

#image2 {
  margin-left: 100px;
}

#taskbar {
  height: 34px;
  background: #2257d6 url("../images/taskbar.png") repeat-x 0 0;
  position: absolute;
  bottom: 0;
  width: 100%;
}

#start {
  width: 100px;
  height: 34px;
  cursor: pointer;
}

#startbutton span {
  width: 102px;
  height: 34px;
  background: transparent url("../images/start_button.png") no-repeat 0 0;
  position: absolute;
  top: 0;
  left: 0;
}

#startbutton span:visited {
  background-position: 0 -69px;
}
I#startbutton span.clicked {
  background-position: 0 -69px;
}

#startbutton span:hover {
  background-position: 0 -34px;
}

#clock {
  background: #0f8ae7 url("../images/clock.png") repeat-x 0 0;
  font-weight: bold;
  display: block;
  position: absolute;
  top: -12px;
  right: 0;
  padding: 14px 10px 7px 20px;
  color: #fff;
  font-size: 12px;
}

.right-image {
  z-index: 9999;
  position: fixed;
  right: 76px;
  bottom: 0;
}

main img:hover {
  background-color: #316ccaaf;
}

/* windows start */
.windows-start {
  position: absolute;
  bottom: 33px;
  left: 1px;
  font-size: 11px;
  line-height: 14px;
  /* display: flex; */
  /* flex-direction: column; */
  -moz-box-align: center;
  /* align-items: center; */
  background-color: rgb(66, 130, 214);
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.windows-start .header {
  position: relative;
  align-self: flex-start;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  color: rgb(255, 255, 255);
  height: 54px;
  padding: 6px 5px 5px;
  /* width: 100%; */
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  background: linear-gradient(
    rgb(24, 104, 206) 0%,
    rgb(14, 96, 203) 12%,
    rgb(14, 96, 203) 20%,
    rgb(17, 100, 207) 32%,
    rgb(22, 103, 207) 33%,
    rgb(27, 108, 211) 47%,
    rgb(30, 112, 217) 54%,
    rgb(36, 118, 220) 60%,
    rgb(41, 122, 224) 65%,
    rgb(52, 130, 227) 77%,
    rgb(55, 134, 229) 79%,
    rgb(66, 142, 233) 90%,
    rgb(71, 145, 235) 100%
  );
  overflow: hidden;
}
.windows-start .header img {
  width: 42px;
  height: 42px;
  margin-right: 5px;
  border-radius: 3px;
  border: 2px solid rgba(222, 222, 222, 0.8);
}
.windows-start .header .text {
  font-size: 14px;
  font-weight: 700;
  text-shadow: rgba(0, 0, 0, 0.7) 1px 1px;
}
.windows-start .menu {
  display: flex;
  margin: 0px 2px;
  position: relative;
  border-top: 1px solid rgb(56, 93, 231);
  box-shadow: rgb(56, 93, 231) 0px 1px;
}

.windows-start .menu .orange-hr {
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  display: block;
  height: 2px;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0) 0%,
    rgb(218, 136, 74) 50%,
    rgba(0, 0, 0, 0) 100%
  );
  border: 0px none;
  margin: 0;
}

.menu .menu__left {
  background-color: rgb(255, 255, 255);
  padding: 6px 5px 0px;
  width: 190px;
  display: flex;
  flex-direction: column;
}
.menu .menu__left .menu__item {
  height: 34px;
}
.menu .menu__item {
  padding: 1px;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  margin-bottom: 4px;
}
.menu .menu__separator {
  height: 7.5px;
  background: linear-gradient(
      to right,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.1) 50%,
      rgba(0, 0, 0, 0) 100%
    )
    padding-box content-box;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
}

.menu .menu__left .menu__item__img {
  margin-right: 3px;
  width: 30px;
  height: 30px;
}
.menu .menu__item__subtext {
  color: rgba(0, 0, 0, 0.4);
  line-height: 12px;
  margin-bottom: 1px;
}

.menu .menu__right {
  background-color: rgb(203, 227, 255);
  border-left: 1px solid rgba(58, 58, 255, 0.37);
  padding: 6px 5px 5px;
  width: 190px;
  color: rgb(0, 19, 107);
}

.menu .menu__right .menu__item {
  height: 26px;
  margin-bottom: 4px;
  line-height: 13px;
}

.menu .menu__item {
  padding: 1px;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  margin-bottom: 4px;
  cursor: pointer;
}

.menu .menu__item:hover {
  color: white;
  background-color: rgb(47, 113, 205);
}

.menu .menu__right .menu__item__img {
  margin-right: 3px;
  width: 22px;
  height: 22px;
}
.menu .menu__item__texts {
  display: flex;
  flex-direction: column;
  -moz-box-pack: center;
  justify-content: center;
  height: 100%;
  position: relative;
}
.menu .menu__separator {
  height: 7.5px;
  background: linear-gradient(
      to right,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.1) 50%,
      rgba(0, 0, 0, 0) 100%
    )
    padding-box content-box;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
}

.windows-start .footer {
  display: flex;
  align-self: flex-end;
  -moz-box-align: center;
  align-items: center;
  -moz-box-pack: end;
  justify-content: flex-end;
  color: rgb(255, 255, 255);
  height: 36px;
  width: 100%;
  background: linear-gradient(
    rgb(66, 130, 214) 0%,
    rgb(59, 133, 224) 3%,
    rgb(65, 138, 227) 5%,
    rgb(65, 138, 227) 17%,
    rgb(60, 135, 226) 21%,
    rgb(55, 134, 228) 26%,
    rgb(52, 130, 227) 29%,
    rgb(46, 126, 225) 39%,
    rgb(35, 116, 223) 49%,
    rgb(32, 114, 219) 57%,
    rgb(25, 110, 219) 62%,
    rgb(23, 107, 216) 72%,
    rgb(20, 104, 213) 75%,
    rgb(17, 101, 210) 83%,
    rgb(15, 97, 203) 88%
  );
}

.windows-start .footer__item {
  padding: 3px;
  display: flex;
  margin-right: 10px;
  -moz-box-align: center;
  align-items: center;
  cursor: pointer;
}

.windows-start footer {
  color: rgb(255, 255, 255);
}

.windows-start .footer__item__img {
  border-radius: 3px;
  margin-right: 2px;
  width: 22px;
  height: 22px;
}
.windows-start .footer__item:hover {
  background-color: rgba(60, 80, 210, 0.5);
}

/* alert error */

.etljSV {
  display: flex;
  position: absolute;
  padding: 3px;
  background-color: rgb(8, 49, 217);
  flex-direction: column;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.etljSV .header__bg {
  background: linear-gradient(
    rgb(0, 88, 238) 0%,
    rgb(53, 147, 255) 4%,
    rgb(40, 142, 255) 6%,
    rgb(18, 125, 255) 8%,
    rgb(3, 111, 252) 10%,
    rgb(2, 98, 238) 14%,
    rgb(0, 87, 229) 20%,
    rgb(0, 84, 227) 24%,
    rgb(0, 85, 235) 56%,
    rgb(0, 91, 245) 66%,
    rgb(2, 106, 254) 76%,
    rgb(0, 98, 239) 86%,
    rgb(0, 82, 214) 92%,
    rgb(0, 64, 171) 94%,
    rgb(0, 48, 146) 100%
  );
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  height: 28px;
  pointer-events: none;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  overflow: hidden;
}
.etljSV .app__header {
  display: flex;
  height: 25px;
  line-height: 25px;
  font-weight: 700;
  font-size: 12px;
  font-family: "Noto Sans";
  text-shadow: rgb(0, 0, 0) 1px 1px;
  color: white;
  position: absolute;
  left: 3px;
  right: 3px;
  -moz-box-align: center;
  align-items: center;
}

.etljSV .app__header__icon {
  width: 15px;
  height: 15px;
  margin-left: 1px;
  margin-right: 3px;
}

.etljSV .app__header__title {
  flex: 1 1 0%;
  pointer-events: none;
  padding-right: 5px;
  letter-spacing: 0.5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.fqmhFb {
  opacity: 1;
  height: 22px;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  margin-top: -1px;
  margin-right: 1px;
}

.fqmhFb .header__button:hover {
  filter: brightness(120%);
}

.fqmhFb .header__button--close {
  box-shadow: rgb(218, 70, 0) 0px -1px 2px 1px inset;
  background-image: radial-gradient(
    circle at 90% 90%,
    rgb(204, 70, 0) 0%,
    rgb(220, 101, 39) 55%,
    rgb(205, 117, 70) 70%,
    rgb(255, 204, 178) 90%,
    white 100%
  );
}

.fqmhFb .header__button--close::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 2px;
  transform: rotate(-45deg);
  height: 16px;
  width: 2px;
  background-color: white;
}
.fqmhFb .header__button--minimize {
  box-shadow: rgb(70, 70, 255) 0px -1px 2px 1px inset;
  background-image: radial-gradient(
    circle at 90% 90%,
    rgb(0, 84, 233) 0%,
    rgb(34, 99, 213) 55%,
    rgb(68, 121, 228) 70%,
    rgb(163, 187, 236) 90%,
    white 100%
  );
}
.fqmhFb .header__button--minimize::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 13px;
  height: 3px;
  width: 8px;
  background-color: white;
}

.fqmhFb .header__button--close::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 2px;
  transform: rotate(45deg);
  height: 16px;
  width: 2px;
  background-color: white;
}

.fqmhFb .header__button {
  margin-right: 1px;
  position: relative;
  width: 22px;
  height: 22px;
  border: 1px solid rgb(255, 255, 255);
  border-radius: 3px;
}

.etljSV .app__content {
  flex: 1 1 0%;
  position: relative;
  margin-top: 25px;
  height: calc(100% - 25px);
}

.gLUcEj {
  background-color: rgb(245, 245, 245);
  /* width: 100%; */
  height: 100%;
  font-size: 11px;
  padding: 12px;
  display: flex;
  flex-direction: column;
}

.gLUcEj .error__top {
  display: flex;
  flex: 1 1 0%;
}

.gLUcEj .error__img {
  width: 30px;
  height: 30px;
}

.gLUcEj .error__messages {
  padding: 2px 20px 12px;
}

.gLUcEj .error__message {
  line-height: 16px;
}

.gLUcEj .error__bottom {
  display: flex;
  width: 100%;
  -moz-box-pack: center;
  justify-content: center;
}

.gLUcEj .error__button {
  width: 80px;
  height: 22px;
  display: flex;
  border: 1px solid black;
  -moz-box-pack: center;
  justify-content: center;
  -moz-box-align: center;
  align-items: center;
  box-shadow: black -1px -1px 1px inset;
  cursor: pointer;
}

.gLUcEj .error__confirm {
  line-height: 11px;
}

.taskbar-items {
  width: 100%;
  padding: 5px;
  padding-right: 5px;
  padding-right: 200px;
  z-index: 9999;
  position: fixed;
  bottom: 0;
  right: -300px;
  display: flex;
}

.footer__window {
  flex: 1 1 0%;
  max-width: 150px;
  color: rgb(255, 255, 255);
  border-radius: 2px;
  margin-top: 2px;
  padding: 0px 8px;
  height: 22px;
  font-size: 11px;
  background-color: rgb(60, 129, 243);
  box-shadow: rgba(0, 0, 0, 0.3) -1px 0px inset,
    rgba(255, 255, 255, 0.2) 1px 1px 1px inset;
  position: relative;
  display: flex;
  -moz-box-align: center;
  align-items: center;
}

.footer__window.cover:hover {
  background-color: rgb(83, 163, 255);
  box-shadow: rgba(0, 0, 0, 0.3) -1px 0px inset,
    rgba(255, 255, 255, 0.2) 1px 1px 1px inset;
}

.footer__icon {
  height: 15px;
  width: 15px;
}

.footer__text {
  position: absolute;
  left: 27px;
  right: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* my computer */
.iPYpwe {
  height: 100%;
  width: 100%;
  position: absolute;
  display: flex;
  overflow: hidden;
  flex-direction: column;
  background: linear-gradient(
    to right,
    rgb(237, 237, 229) 0%,
    rgb(237, 232, 205) 100%
  );
}

.iPYpwe .com__toolbar {
  position: relative;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  line-height: 100%;
  height: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.7);
  flex-shrink: 0;
}

.iPYpwe .com__options {
  height: 23px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  padding: 1px 0px 1px 2px;
  border-left: 0px none;
  flex: 1 1 0%;
}

.bvzUWv {
  display: inline-flex;
  height: 20px;
  line-height: 20px;
  position: relative;
}

.bvzUWv .drop-down {
  font-size: 11px;
  height: 100%;
  position: relative;
}

.bvzUWv .drop-down__label {
  padding: 0px 7px;
}

.iPYpwe .com__windows-logo {
  height: 100%;
  border-left: 1px solid white;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.iPYpwe .com__function_bar {
  height: 36px;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  font-size: 11px;
  padding: 1px 3px 0px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.iPYpwe .com__function_bar__button--disable {
  filter: grayscale(1);
  opacity: 0.7;
  display: flex;
  height: 100%;
  -moz-box-align: center;
  align-items: center;
  border: 1px solid rgba(0, 0, 0, 0);
}

.iPYpwe .com__function_bar__icon {
  height: 30px;
  width: 30px;
}

.iPYpwe .com__function_bar__text {
  margin-right: 4px;
}

.iPYpwe .com__function_bar__arrow {
  height: 100%;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  margin: 0px 4px;
}

.iPYpwe .com__function_bar__arrow::before {
  content: "";
  display: block;
  border-width: 3px 3px 0px;
  border-color: rgb(0, 0, 0) transparent;
  border-style: solid;
}

.iPYpwe .com__function_bar__button--disable {
  filter: grayscale(1);
  opacity: 0.7;
  display: flex;
  height: 100%;
  -moz-box-align: center;
  align-items: center;
  border: 1px solid rgba(0, 0, 0, 0);
}

.iPYpwe .com__function_bar__icon {
  height: 30px;
  width: 30px;
}

.iPYpwe .com__function_bar__button {
  display: flex;
  height: 100%;
  -moz-box-align: center;
  align-items: center;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 3px;
}

.iPYpwe .com__function_bar__icon--normalize {
  height: 22px;
  width: 22px;
  margin: 0px 4px 0px 1px;
}

.iPYpwe .com__function_bar__separate {
  height: 90%;
  width: 1px;
  background-color: rgba(0, 0, 0, 0.2);
  margin: 0px 2px;
}

.iPYpwe .com__address_bar {
  flex-shrink: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.7);
  height: 20px;
  font-size: 11px;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  padding: 0px 2px;
  box-shadow: rgb(176, 176, 176) 0px -2px 3px -1px inset;
}

.iPYpwe .com__address_bar__title {
  line-height: 100%;
  color: rgba(0, 0, 0, 0.5);
  padding: 5px;
}

.iPYpwe .com__address_bar__content {
  border: 1px solid rgba(122, 122, 255, 0.6);
  height: 100%;
  display: flex;
  flex: 1 1 0%;
  -moz-box-align: center;
  align-items: center;
  background-color: white;
  position: relative;
  box-shadow: rgb(176, 176, 176) 0px -2px 3px -1px inset;
}

.iPYpwe .com__address_bar__content__img {
  width: 14px;
  height: 14px;
}

.iPYpwe .com__address_bar__content__text {
  position: absolute;
  white-space: nowrap;
  left: 16px;
  right: 17px;
}

.iPYpwe .com__address_bar__content__img:last-child {
  width: 15px;
  height: 15px;
  right: 1px;
  position: absolute;
}

.iPYpwe .com__address_bar__go {
  display: flex;
  -moz-box-align: center;
  align-items: center;
  padding: 0px 18px 0px 5px;
  height: 100%;
  position: relative;
}

.iPYpwe .com__address_bar__go__img {
  height: 95%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-right: 3px;
}

.iPYpwe .com__content {
  flex: 1 1 0%;
  border-color: rgba(0, 0, 0, 0.4);
  border-style: solid;
  border-width: 0px 1px 1px;
  border-image: none 100% / 1 / 0 stretch;
  background-color: rgb(241, 241, 241);
  overflow: auto;
  font-size: 11px;
  position: relative;
}

.iPYpwe .com__content__inner {
  display: flex;
  height: 100%;
  overflow: auto;
}

.iPYpwe .com__content__left {
  width: 180px;
  height: 100%;
  background: linear-gradient(rgb(116, 138, 255) 0%, rgb(64, 87, 211) 100%);
  overflow: auto;
  padding: 10px;
}

.iPYpwe .com__content__left__card:not(:last-child) {
  margin-bottom: 12px;
}

.iPYpwe .com__content__left__card {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  width: 100%;
  overflow: hidden;
}

.iPYpwe .com__content__left__card__header {
  display: flex;
  -moz-box-align: center;
  align-items: center;
  height: 23px;
  padding-left: 11px;
  padding-right: 2px;
  cursor: pointer;
  background: linear-gradient(
    to right,
    rgb(240, 240, 255) 0px,
    rgb(240, 240, 255) 30%,
    rgb(168, 188, 255) 100%
  );
}

.iPYpwe .com__content__left__card__content {
  padding: 5px 10px;
  background: rgba(198, 211, 255, 0.87)
    linear-gradient(
      to right,
      rgb(180, 200, 251) 0%,
      rgb(164, 185, 251) 50%,
      rgb(180, 200, 251) 100%
    );
}

.iPYpwe .com__content__left__card__header__text {
  font-weight: 700;
  color: rgb(12, 50, 125);
  flex: 1 1 0%;
}

.iPYpwe .com__content__left__card__header__img {
  width: 18px;
  height: 18px;
  filter: drop-shadow(rgba(0, 0, 0, 0.3) 1px 1px 3px);
}

.iPYpwe .com__content__left__card__row {
  display: flex;
  margin-bottom: 2px;
}

.iPYpwe .com__content__left__card__text {
  font-size: 10px;
  line-height: 14px;
  color: rgb(12, 50, 125);
}

.iPYpwe .com__content__left__card__img {
  width: 14px;
  height: 14px;
  margin-right: 5px;
}

.iPYpwe .com__content__right {
  height: 100%;
  overflow: auto;
  background-color: rgb(255, 255, 255);
  flex: 1 1 0%;
}

.iPYpwe .com__content__right__card__header {
  width: 300px;
  font-weight: 700;
  padding: 2px 0px 3px 12px;
  position: relative;
}

.iPYpwe .com__content__right__card__header::after {
  content: "";
  display: block;
  background: linear-gradient(
    to right,
    rgb(112, 191, 255) 0px,
    rgb(255, 255, 255) 100%
  );
  position: absolute;
  bottom: 0px;
  left: -12px;
  height: 1px;
  width: 100%;
}

.iPYpwe .com__content__right__card__content {
  display: flex;
  -moz-box-align: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 15px 15px 0px;
}

.iPYpwe .com__content__right__card__item {
  display: flex;
  -moz-box-align: center;
  align-items: center;
  width: 200px;
  margin-bottom: 15px;
  height: auto;
  padding: 5px;
}

.iPYpwe .com__content__right__card__item:hover {
  background-color: rgba(0, 0, 255, 0.61);
  cursor: pointer;
  color: white;
}

.iPYpwe .com__content__right__card__img {
  width: 45px;
  height: 45px;
  margin-right: 5px;
  object-fit: contain;
  object-position: center;
}

.iPYpwe .com__content__right__card__text {
  white-space: nowrap;
  height: 100%;
}

.iPYpwe .com__content__right__card__item--me {
  display: flex;
  -moz-box-align: center;
  align-items: center;
  width: 200px;
  margin-bottom: 15px;
  height: auto;
}

/* Notepad */
.iuqgts {
  display: flex;
  position: absolute;
  padding: 3px;
  background-color: rgb(101, 130, 245);
  flex-direction: column;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.iuqgts .header__bg {
  background: linear-gradient(
    rgb(118, 151, 231) 0%,
    rgb(126, 158, 227) 3%,
    rgb(148, 175, 232) 6%,
    rgb(151, 180, 233) 8%,
    rgb(130, 165, 228) 14%,
    rgb(124, 159, 226) 17%,
    rgb(121, 150, 222) 25%,
    rgb(123, 153, 225) 56%,
    rgb(130, 169, 233) 81%,
    rgb(128, 165, 231) 89%,
    rgb(123, 150, 225) 94%,
    rgb(122, 147, 223) 97%,
    rgb(171, 186, 227) 100%
  );
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  height: 28px;
  pointer-events: none;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  overflow: hidden;
}

.iuqgts .header__bg::before {
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  opacity: 0.3;
  background: linear-gradient(to right, rgb(22, 56, 230) 0%, transparent 100%);
  top: 0px;
  bottom: 0px;
  width: 15px;
}

.iuqgts .header__bg::after {
  content: "";
  opacity: 0.4;
  display: block;
  position: absolute;
  right: 0px;
  background: linear-gradient(to left, rgb(22, 56, 230) 0%, transparent 100%);
  top: 0px;
  bottom: 0px;
  width: 15px;
}

.iuqgts .app__header {
  display: flex;
  height: 25px;
  line-height: 25px;
  font-weight: 700;
  font-size: 12px;
  font-family: "Noto Sans";
  text-shadow: rgb(0, 0, 0) 1px 1px;
  color: white;
  position: absolute;
  left: 3px;
  right: 3px;
  -moz-box-align: center;
  align-items: center;
}

.iuqgts .app__header__icon {
  width: 15px;
  height: 15px;
  margin-left: 1px;
  margin-right: 3px;
}

.iuqgts .app__header__title {
  flex: 1 1 0%;
  pointer-events: none;
  padding-right: 5px;
  letter-spacing: 0.5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.dCJNFM {
  opacity: 0.6;
  height: 22px;
  display: flex;
  -moz-box-align: center;
  align-items: center;
  margin-top: -1px;
  margin-right: 1px;
}

.dCJNFM .header__button--minimize {
  box-shadow: rgb(70, 70, 255) 0px -1px 2px 1px inset;
  background-image: radial-gradient(
    circle at 90% 90%,
    rgb(0, 84, 233) 0%,
    rgb(34, 99, 213) 55%,
    rgb(68, 121, 228) 70%,
    rgb(163, 187, 236) 90%,
    white 100%
  );
}

.dCJNFM .header__button {
  margin-right: 1px;
  position: relative;
  width: 22px;
  height: 22px;
  border: 1px solid rgb(255, 255, 255);
  border-radius: 3px;
}

.dCJNFM .header__button--minimize::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 13px;
  height: 3px;
  width: 8px;
  background-color: white;
}

.dCJNFM .header__button--close {
  box-shadow: rgb(218, 70, 0) 0px -1px 2px 1px inset;
  background-image: radial-gradient(
    circle at 90% 90%,
    rgb(204, 70, 0) 0%,
    rgb(220, 101, 39) 55%,
    rgb(205, 117, 70) 70%,
    rgb(255, 204, 178) 90%,
    white 100%
  );
}

.dCJNFM .header__button--close::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 2px;
  transform: rotate(45deg);
  height: 16px;
  width: 2px;
  background-color: white;
}

.dCJNFM .header__button--close::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 2px;
  transform: rotate(-45deg);
  height: 16px;
  width: 2px;
  background-color: white;
}

.iuqgts .app__content {
  flex: 1 1 0%;
  position: relative;
  margin-top: 25px;
  height: calc(100% - 25px);
}

.dcPUSR {
  height: 100%;
  background: linear-gradient(
    to right,
    rgb(237, 237, 229) 0%,
    rgb(237, 232, 205) 100%
  );
  display: flex;
  flex-direction: column;
  -moz-box-align: stretch;
  align-items: stretch;
}

.dcPUSR .np__toolbar {
  position: relative;
  height: 21px;
  flex-shrink: 0;
  border-bottom: 1px solid white;
}

.bvzUWv {
  display: inline-flex;
  height: 20px;
  line-height: 20px;
  position: relative;
}

.bvzUWv .drop-down {
  font-size: 11px;
  height: 100%;
  position: relative;
}

.bvzUWv .drop-down__label {
  padding: 0px 7px;
}

.hmQVQD {
  flex: 1 1 auto;
  outline: currentcolor none medium;
  font-family: "Lucida Console", monospace;
  font-size: 13px;
  line-height: 14px;
  resize: none;
  padding: 2px;
  white-space: nowrap;
  overflow: scroll;
  border: 1px solid rgb(150, 171, 255);
}

/* Logoff */

body .modal {
  margin-top: 30vh;
  width: 300px;
  height: 190px;
  border: 1px solid black;
  display: flex;
  flex-direction: column;
}

body .header {
  height: 42px;
  display: flex;
  padding-left: 10px;
  -moz-box-align: center;
  align-items: center;
  background: rgb(9, 33, 120);
}

body .header__text {
  font-size: 17px;
  font-family: "Noto Sans";
  color: rgb(255, 255, 255);
  flex: 1 1 0%;
}

body .header__img {
  width: auto;
  height: 30px;
  margin-right: 5px;
}

body .content {
  flex: 1 1 0%;
  background: linear-gradient(
    to right,
    rgb(51, 73, 224) 0%,
    rgb(97, 126, 230) 47%,
    rgb(97, 126, 230) 53%,
    rgb(51, 73, 224) 100%
  );
  display: flex;
  -moz-box-align: center;
  align-items: center;
  justify-content: space-around;
  padding: 0px 30px;
  position: relative;
}

body .content::before {
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  top: 0px;
  left: 0px;
  right: 0px;
  background: linear-gradient(
    to right,
    transparent 0px,
    rgba(255, 255, 255, 0.3) 40%,
    rgba(255, 255, 255, 0.3) 60%,
    transparent 100%
  );
}

body .button-container.disable {
  color: gray;
}

body .button-container {
  display: flex;
  flex-direction: column;
  -moz-box-align: center;
  align-items: center;
  color: rgb(255, 255, 255);
}
body .button-container.disable .button-img {
  opacity: 0.3;
}
body .button-img {
  height: 30px;
  width: 30px;
}
body .button-text {
  padding-top: 3px;
  font-weight: bold;
  font-size: 11px;
}

body .button-img {
  height: 30px;
  width: 30px;
}

body .button-img:hover {
  filter: brightness(1.1);
  cursor: pointer;
}

body .footer {
  height: 42px;
  background: rgb(9, 33, 120);
  display: flex;
  -moz-box-pack: end;
  justify-content: flex-end;
  -moz-box-align: center;
  align-items: center;
}

body .footer__button {
  font-size: 11px;
  padding: 0px 8px;
  line-height: 10px;
  background: rgb(240, 240, 240);
  margin-right: 10px;
  height: 16px;
  border-radius: 1px;
  box-shadow: rgb(0, 5, 176) 2px 2px 4px 1px, white 2px 2px 2px 0px,
    skyblue 0px 0px 0px 1px inset, skyblue 2px -2px inset;
  border: medium none;
  outline: none;
  cursor: pointer;
}

body .footer__button:hover {
  box-shadow: black 1px 1px, white 1px 1px 2px 0px, orange 0px 0px 0px 1px inset,
    orange 2px -2px inset;
}