/* version 3 */
/* #1d1d1b; */
/* Material Icons */
@font-face {
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  /*    src: url('../fonts/MaterialIcons-Regular.eot'); /* For IE6-8 */
  src: local("Material Icons"), url("../fonts/MaterialIconsRound-Regular.otf") format("opentype");
  /*    url('../fonts/MaterialIconsRound-Regular.woff') format('woff'),*/
  /*    url('../fonts/MaterialIconsRound-Regular.ttf') format('truetype');*/
}
.material-icons {
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: "liga";
}

/* mask font */
@font-face {
  font-family: "Pass";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/Password.woff") format("woff");
}
.password-type {
  font-family: "Pass";
}

/* OpenSans - regular */
@font-face {
  font-family: "OpenSans";
  font-style: normal;
  font-weight: 400;
  src: local(""), url("../fonts/OpenSans-Regular.ttf") format("truetype");
}
/* OpenSans - bold */
@font-face {
  font-family: "OpenSans";
  font-style: normal;
  font-weight: 500;
  src: local(""), url("../fonts/OpenSans-Bold.ttf") format("truetype");
}
/* oswald-200 - latin-ext_latin */
@font-face {
  font-family: "Oswald";
  font-style: normal;
  font-weight: 200;
  src: local(""), url("../fonts/oswald-v40-latin-ext_latin-200.woff2") format("woff2"), url("../fonts/oswald-v40-latin-ext_latin-200.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* oswald-300 - latin-ext_latin */
@font-face {
  font-family: "Oswald";
  font-style: normal;
  font-weight: 300;
  src: local(""), url("../fonts/oswald-v40-latin-ext_latin-300.woff2") format("woff2"), url("../fonts/oswald-v40-latin-ext_latin-300.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* oswald-regular - latin-ext_latin */
@font-face {
  font-family: "Oswald";
  font-style: normal;
  font-weight: 400;
  src: local(""), url("../fonts/oswald-v40-latin-ext_latin-regular.woff2") format("woff2"), url("../fonts/oswald-v40-latin-ext_latin-regular.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* oswald-500 - latin-ext_latin */
@font-face {
  font-family: "Oswald";
  font-style: normal;
  font-weight: 500;
  src: local(""), url("../fonts/oswald-v40-latin-ext_latin-500.woff2") format("woff2"), url("../fonts/oswald-v40-latin-ext_latin-500.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* oswald-600 - latin-ext_latin */
@font-face {
  font-family: "Oswald";
  font-style: normal;
  font-weight: 600;
  src: local(""), url("../fonts/oswald-v40-latin-ext_latin-600.woff2") format("woff2"), url("../fonts/oswald-v40-latin-ext_latin-600.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* oswald-700 - latin-ext_latin */
@font-face {
  font-family: "Oswald";
  font-style: normal;
  font-weight: 700;
  src: local(""), url("../fonts/oswald-v40-latin-ext_latin-700.woff2") format("woff2"), url("../fonts/oswald-v40-latin-ext_latin-700.woff") format("woff");
  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* Myriad Pro Regular*/
@font-face {
  font-family: "Myriad";
  font-style: normal;
  font-weight: 400;
  src: local(""), url("../fonts/MYRIADPRO-REGULAR.woff") format("woff");
}
/* Myriad Pro */
@font-face {
  font-family: "Myriad";
  font-style: normal;
  font-weight: 200;
  src: local(""), url("../fonts/MYRIADPRO-LIGHT.woff") format("woff");
}
/* Myriad Pro */
@font-face {
  font-family: "Myriad";
  font-style: normal;
  font-weight: 500;
  src: local(""), url("../fonts/MYRIADPRO-SEMIBOLD.woff") format("woff");
}
/* Myriad Pro */
@font-face {
  font-family: "Myriad";
  font-style: italic;
  font-weight: 500;
  src: local(""), url("../fonts/MYRIADPRO-SEMIBOLDIT.woff") format("woff");
}
/* Myriad Pro */
@font-face {
  font-family: "Myriad";
  font-style: normal;
  font-weight: 600;
  src: local(""), url("../fonts/MYRIADPRO-BOLD.woff") format("woff");
}
/* Myriad Pro */
@font-face {
  font-family: "Myriad ";
  font-style: italic;
  font-weight: 600;
  src: local(""), url("../fonts/MYRIADPRO-BOLDIT.woff") format("woff");
}
/* Myriad Pro Condensed */
@font-face {
  font-family: "Myriad Condensed";
  font-style: normal;
  font-weight: 400;
  src: local(""), url("../fonts/MYRIADPRO-COND.woff") format("woff");
}
/* Myriad Pro Condensed */
@font-face {
  font-family: "Myriad Condensed";
  font-style: italic;
  font-weight: 400;
  src: local(""), url("../fonts/MYRIADPRO-CONDIT.woff") format("woff");
}
/* Myriad Pro Condensed */
@font-face {
  font-family: "Myriad Condensed";
  font-style: normal;
  font-weight: 600;
  src: local(""), url("../fonts/MYRIADPRO-BOLDCOND.woff") format("woff");
}
/* Myriad Pro Condensed */
@font-face {
  font-family: "Myriad Condensed";
  font-style: italic;
  font-weight: 600;
  src: local(""), url("../fonts/MYRIADPRO-BOLDCONDIT.woff") format("woff");
}
/* correct checked */
.btn-check[checked=checked] + .btn-outline-primary {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
}

/* bootstrap */
.modal-content {
  /*
  color: $app-color-black;
  background-color: white;
   */
  color: white;
  background-color: black;
}

.modal-header {
  border-bottom: 1px solid transparent;
}

.modal-footer {
  border-top: 1px solid transparent;
}

::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #ced4da !important;
  opacity: 1 !important;
  /* Firefox */
}

/* orientation */
@media screen and (orientation: landscape) {
  body {
    width: 100vh;
    height: 100vw;
    transform-origin: 0 0;
  }

  .offcanvas-backdrop {
    width: 100vh;
    height: 100vw;
  }
}
body.rotation-90 {
  transform: rotate(90deg) translateY(-100%);
}

body.rotation90 {
  transform: rotate(-90deg) translateX(-100%);
}

/* application */
body {
  overscroll-behavior: contain;
  /* vypnuti refresh pomoci swipe */
  background-color: black;
  /* #f3f3f3; */
  margin: 0;
  padding: 0;
  font-family: "Oswald";
  /* 'Myriad', sans-serif; 'OpenSans', sans-serif */
  transition: 0.5s;
  /* off selection */
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Old versions of Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

@-webkit-keyframes animatedBackground {
  0% {
    background-position: -1.5rem 0;
    /* -8 */
  }
  50% {
    background-position: -20rem 0;
    /* -12 */
  }
  100% {
    background-position: -1.5rem 0;
  }
}
.main {
  position: absolute;
  width: 100%;
  height: 100%;
}
.main--index {
  display: none;
  /*
  background-image: url("../img/background1.png"), url("../img/background.jpg");
  background-repeat: no-repeat, no-repeat;
  background-size: 95%, cover;
  background-position: left bottom, right top;
   */
  background-image: url("../img/background.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  animation: animatedBackground 90s linear infinite;
  -webkit-animation: animatedBackground 90s linear infinite;
  position: fixed;
}
@media screen and (orientation: landscape) {
  .main--index {
    /*
    @-webkit-keyframes animatedBackgroundLand {
        0% { background-position: 0rem 0; }
        50% { background-position: -2rem 0; }
        100% { background-position: 0rem 0; }
    }

    background-size: 105%;
    animation: animatedBackgroundLand 30s linear infinite;
    -webkit-animation: animatedBackgroundLand 30s linear infinite;
     */
  }
}
.main--index .main-connect {
  color: white;
}
.main--index .main-connect .lastconnect {
  font-size: 0.8rem;
  margin-top: 0.2rem;
  margin-left: 0.2rem;
}
.main--index .main-logo {
  /*
  width: 100%;
  height: 10rem;
  background-image: url("../img/logo.png");
  background-repeat: no-repeat;
  background-size: 50%;
  background-position: center top;
  position: absolute;
  top: 10%;
  */
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 10rem;
  height: 4rem;
  background-image: url(../img/logo.png);
  background-size: 9rem;
  background-repeat: no-repeat;
  background-position: top right;
}
.main--index .main-brand-logo {
  position: absolute;
  left: 1rem;
  top: 1rem;
  width: 4rem;
  height: 2.25rem;
  /* background-image: url(../img/vista_icon.png); */
  background-size: 3rem;
  background-repeat: no-repeat;
  background-position: center left;
}
.main--index .main-menu-item.button-disabled {
  opacity: 0.5;
}
.main--index .main-body {
  height: 100%;
  max-height: 100%;
  overflow: scroll;
  width: 100%;
  padding: 4em 1rem 5rem 1rem;
  /*margin: 4rem 0 0rem 0;*/
  position: absolute;
}
.main--indoor {
  color: white;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.62) 5%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 0)), url("../img/indoor.jpg");
  background-size: cover;
  background-position-x: -43rem;
}
.main--install {
  height: fit-content;
  min-height: 100%;
  /* background-image: url("../img/background.jpg"); */
  background-color: black;
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
  color: white;
  /* #1d1d1b; */
  padding: 1rem;
}
.main--install .language {
  position: fixed;
  bottom: 1rem;
}
.main--install .log {
  font-size: 0.8rem;
  display: none;
}
.main--install .switchLog {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
}
.main--install .switchLog .form-check-input {
  /* background-color: #6c757d; */
  /* border-color: #7e8c93; */
}
.main--install .qrcode canvas {
  border: 5px solid white;
}
.main--error {
  background-image: url("../img/logo.png");
  background-size: 100px;
  background-position: top 1rem right 1rem;
  background-repeat: no-repeat;
  color: white;
  /* #1d1d1b; */
  padding: 1rem;
}
.main--error .language {
  position: fixed;
  bottom: 1rem;
}
.main--error .log {
  font-size: 0.8rem;
  display: none;
}

.main-layout {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.62) 5%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 0));
  width: 100%;
  height: 100%;
}

.logo {
  position: fixed;
  right: 1rem;
  top: 1rem;
  width: 10rem;
  height: 4rem;
  background-image: url("../img/logo.png");
  background-size: 10rem;
  background-repeat: no-repeat;
  background-position: top right;
  z-index: 1;
}
.logo--page {
  opacity: 0.8;
  background-size: 5rem;
}

.main-title {
  display: none;
  position: absolute;
  top: 15rem;
  left: 1rem;
  color: white;
  font-size: 4rem;
  /* text-shadow: -4px 0 black, 0 4px black, 4px 0 black, 0 -4px black; */
  /* opacity: 0.9; */
}

.main-menu {
  position: relative;
  top: 55%;
  z-index: 1;
}
@media screen and (orientation: landscape) {
  .main-menu {
    position: relative;
    top: 25%;
  }
}

.main-menu-item {
  font-weight: bolder;
  font-size: 2rem;
  margin-bottom: 1.5rem;
  padding: 0.5rem 1.5rem;
  background-color: #ffff00ff;
  width: fit-content;
  text-transform: uppercase;
}

.main-header-bcg {
  position: fixed;
  z-index: 99;
  background-color: black;
  height: 3.8rem;
  width: 100%;
}

.main-header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 5rem;
  color: white;
  font-size: 3rem;
  display: inline-flex;
  text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
}
.main-header-back {
  background-color: #ffff00ff;
  width: 1rem;
  height: 3.8rem;
}

.settings {
  color: white;
  /* #1d1d1b; */
  position: fixed;
  bottom: 1rem;
  right: 0.2rem;
  opacity: 0.8;
  z-index: 1;
}
.settings__label {
  position: relative;
  top: -0.3rem;
}
.settings--indoor {
  z-index: unset;
}

.exit {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  color: white;
  /* #1d1d1b; */
  opacity: 0.8;
  z-index: 1;
}
.exit .material-icons {
  transform: rotate(180deg);
  font-size: 28px;
}
.exit__label {
  position: relative;
  top: -0.3rem;
  font-size: 1.25rem;
}
.exit--indoor {
  z-index: unset;
}

.menuSettings .offcanvas {
  color: white;
  /* color: #1d1d1b; */
  background-color: black;
  /* background: linear-gradient(to right, #f9f9f9, #f2f2f2); */
  width: 52%;
}
.menuSettings .status-item {
  font-weight: 300;
  font-size: 0.7rem;
  opacity: 0.75;
}
.menuSettings .fixed-bottom {
  left: unset;
  right: unset;
  margin-bottom: 0.5rem;
}

.menuGame .offcanvas {
  color: white;
  background-color: black;
  /* color: #1d1d1b; */
  /* background: linear-gradient(to right, #f9f9f9, #f2f2f2); */
  width: 52%;
}
.menuGame .status-item {
  font-weight: 300;
  font-size: 0.7rem;
  opacity: 0.75;
}
.menuGame .fixed-bottom {
  left: unset;
  right: unset;
  margin-bottom: 0.5rem;
}

.carousel-inner .carousel-item {
  width: 100%;
}
.carousel-inner .card {
  margin: 3.8rem 0 3rem 0;
  width: 100%;
  border: 0;
  border-radius: 0;
}
.carousel-inner .card .card-image {
  height: 20rem;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
}
@media screen and (orientation: landscape) {
  .carousel-inner .card .card-image {
    height: auto;
    min-height: 14rem;
  }
}
.carousel-inner .card .card-image-top {
  margin: 1rem;
}
.carousel-inner .card .card-image-top .icons {
  padding: 0.4rem;
  background-color: #ffff00ff;
  border-radius: 50%;
  border: 1px solid black;
}
.carousel-inner .card .card-image-bottom {
  margin: 1rem;
  position: absolute;
  bottom: 0;
}
.carousel-inner .card .card-image-bottom .icons {
  padding: 0rem;
  color: #ffff00ff;
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
.carousel-inner .card .card-param .list-group {
  border-top: 1px solid rgba(0, 0, 0, 0.125);
}
.carousel-inner .card .card-param .list-group-item {
  padding-left: 2.7rem;
}
.carousel-inner .card .card-param .text-muted {
  display: block;
  position: relative;
  left: -1.6rem;
}
.carousel-inner .card .card-param .text-muted .icons {
  zoom: 0.8;
  position: relative;
  top: 5px;
  margin-right: 0.5rem;
}

.main-bottom {
  position: fixed;
  width: 100%;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  padding: 0.5rem 0;
}
.main-bottom button {
  background-color: transparent;
  color: white;
  flex: auto;
  border: 0;
  padding: 0 1rem;
}
.main-bottom button .material-icons {
  font-size: 2rem;
}
.main-bottom button .material-icons.size {
  font-size: 1.5rem;
}
.main-bottom button:focus, .main-bottom button:focus-visible {
  box-shadow: none;
}

#profileForm {
  color: white;
  position: absolute;
  min-height: 100%;
  height: auto;
  width: 100%;
}
#profileForm .showElem {
  max-width: fit-content;
  background-color: #14387f;
  padding: 0.4rem 0.8rem;
  border-radius: 20px;
  font-size: 0.8rem;
  display: inline-block;
  margin-right: 0.1rem;
  margin-top: 0.25rem;
  color: #ffffffa1;
}
#profileForm .showElem::after {
  content: "x";
  padding-left: 0.25rem;
  opacity: 0.8;
}

.background-gradient {
  /* background: linear-gradient(to right, #14387f, #081632)!important; */
  background: linear-gradient(to right, #14387f, #182c54) !important;
}

.background-form {
  background-color: #d9d9d9;
  /* #d9d9d9; /* #ffffff40; */
  border-radius: 5px;
  color: #14387f;
}

.icon-close {
  width: 1.4rem;
  height: 1.4rem;
  border: 0.2rem solid white;
  display: inline-block;
  margin-right: 0.2rem;
}

.admin-panel {
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #d9d9d9;
  color: black;
  z-index: 1100;
  padding: 1rem;
  font-size: 0.8rem;
  overflow: scroll;
}
.admin-panel h1 {
  font-size: 0.8rem;
  color: grey;
  margin-top: 1rem;
}
.admin-panel .btn-close {
  position: fixed;
  top: 1rem;
  right: 1rem;
}
.admin-panel .txt-user-token {
  word-break: break-word;
}
.admin-panel .txt-subscription {
  padding: 0.5rem;
  background-color: white;
  color: black;
  word-break: break-word;
}

.icon-settings {
  width: 1.4rem;
  height: 1.4rem;
  border: 0.2rem solid white;
  border-radius: 50%;
  display: inline-block;
  margin-left: 0.2rem;
}

.local-warning {
  position: fixed;
  z-index: 1000;
  background-color: red;
  color: white;
  opacity: 0.7;
  margin: 0.5rem;
  padding: 0.25rem;
  border-radius: 5px;
  font-size: 0.5rem;
}

/* all game forms */
#chat-form,
#multigame-form,
#rewards-form,
#leaderboard-form,
#endgame-form,
#rules-form,
#reader-form,
#timeout-form,
#correct-form,
#fail-form,
#question-form,
#info-form,
#ar-form {
  position: absolute;
  width: 100%;
  height: 100%;
  /* background-image: url("../img/background.jpg"); */
  background-color: black;
  color: white;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right top;
}
#chat-form .btn-close,
#multigame-form .btn-close,
#rewards-form .btn-close,
#leaderboard-form .btn-close,
#endgame-form .btn-close,
#rules-form .btn-close,
#reader-form .btn-close,
#timeout-form .btn-close,
#correct-form .btn-close,
#fail-form .btn-close,
#question-form .btn-close,
#info-form .btn-close,
#ar-form .btn-close {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 10;
}
#chat-form .id,
#multigame-form .id,
#rewards-form .id,
#leaderboard-form .id,
#endgame-form .id,
#rules-form .id,
#reader-form .id,
#timeout-form .id,
#correct-form .id,
#fail-form .id,
#question-form .id,
#info-form .id,
#ar-form .id {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  font-size: 0.5rem;
}
#chat-form .type,
#multigame-form .type,
#rewards-form .type,
#leaderboard-form .type,
#endgame-form .type,
#rules-form .type,
#reader-form .type,
#timeout-form .type,
#correct-form .type,
#fail-form .type,
#question-form .type,
#info-form .type,
#ar-form .type {
  z-index: 100;
  position: fixed;
  top: 1rem;
  left: 1rem;
  color: white;
  border-radius: 50%;
  border: 2px black solid;
  font-size: 0.8rem;
  width: 2rem;
  height: 2rem;
  padding-top: 0.2rem;
  /* 0.3rem; */
  text-align: center;
}
#chat-form .type.diff-0,
#multigame-form .type.diff-0,
#rewards-form .type.diff-0,
#leaderboard-form .type.diff-0,
#endgame-form .type.diff-0,
#rules-form .type.diff-0,
#reader-form .type.diff-0,
#timeout-form .type.diff-0,
#correct-form .type.diff-0,
#fail-form .type.diff-0,
#question-form .type.diff-0,
#info-form .type.diff-0,
#ar-form .type.diff-0 {
  background-color: #167ab6;
}
#chat-form .type.diff-1,
#multigame-form .type.diff-1,
#rewards-form .type.diff-1,
#leaderboard-form .type.diff-1,
#endgame-form .type.diff-1,
#rules-form .type.diff-1,
#reader-form .type.diff-1,
#timeout-form .type.diff-1,
#correct-form .type.diff-1,
#fail-form .type.diff-1,
#question-form .type.diff-1,
#info-form .type.diff-1,
#ar-form .type.diff-1 {
  background-color: #5eb49b;
}
#chat-form .type.diff-2,
#multigame-form .type.diff-2,
#rewards-form .type.diff-2,
#leaderboard-form .type.diff-2,
#endgame-form .type.diff-2,
#rules-form .type.diff-2,
#reader-form .type.diff-2,
#timeout-form .type.diff-2,
#correct-form .type.diff-2,
#fail-form .type.diff-2,
#question-form .type.diff-2,
#info-form .type.diff-2,
#ar-form .type.diff-2 {
  background-color: #fcc100;
}
#chat-form .type.diff-3,
#multigame-form .type.diff-3,
#rewards-form .type.diff-3,
#leaderboard-form .type.diff-3,
#endgame-form .type.diff-3,
#rules-form .type.diff-3,
#reader-form .type.diff-3,
#timeout-form .type.diff-3,
#correct-form .type.diff-3,
#fail-form .type.diff-3,
#question-form .type.diff-3,
#info-form .type.diff-3,
#ar-form .type.diff-3 {
  background-color: #d4000f;
}
#chat-form .time,
#multigame-form .time,
#rewards-form .time,
#leaderboard-form .time,
#endgame-form .time,
#rules-form .time,
#reader-form .time,
#timeout-form .time,
#correct-form .time,
#fail-form .time,
#question-form .time,
#info-form .time,
#ar-form .time {
  z-index: 100;
  position: fixed;
  top: 0.7rem;
  right: 1rem;
  color: #fff;
  font-weight: 700;
  background-color: #7f9dc3;
  /*rgba(0, 60, 136, 0.5); */
  border-color: rgba(255, 255, 255, 0.4);
  border: 3px;
  border-radius: 4px;
  padding: 0.2rem 0.5rem;
}
#chat-form .content,
#multigame-form .content,
#rewards-form .content,
#leaderboard-form .content,
#endgame-form .content,
#rules-form .content,
#reader-form .content,
#timeout-form .content,
#correct-form .content,
#fail-form .content,
#question-form .content,
#info-form .content,
#ar-form .content {
  width: 100%;
  height: 100%;
  overflow: scroll;
  padding: 4rem 1rem 3rem 1rem;
}
#chat-form .body,
#multigame-form .body,
#rewards-form .body,
#leaderboard-form .body,
#endgame-form .body,
#rules-form .body,
#reader-form .body,
#timeout-form .body,
#correct-form .body,
#fail-form .body,
#question-form .body,
#info-form .body,
#ar-form .body {
  width: 100%;
  font-size: 1.1rem;
}
#chat-form .q-text,
#multigame-form .q-text,
#rewards-form .q-text,
#leaderboard-form .q-text,
#endgame-form .q-text,
#rules-form .q-text,
#reader-form .q-text,
#timeout-form .q-text,
#correct-form .q-text,
#fail-form .q-text,
#question-form .q-text,
#info-form .q-text,
#ar-form .q-text {
  font-size: 1.2rem;
  font-weight: bold;
}
#chat-form .answer div,
#multigame-form .answer div,
#rewards-form .answer div,
#leaderboard-form .answer div,
#endgame-form .answer div,
#rules-form .answer div,
#reader-form .answer div,
#timeout-form .answer div,
#correct-form .answer div,
#fail-form .answer div,
#question-form .answer div,
#info-form .answer div,
#ar-form .answer div {
  color: #fff;
  /*font-weight: 700;*/
  background-color: #7f9dc3;
  /* rgba(0, 60, 136, 0.5); */
  border-color: rgba(255, 255, 255, 0.4);
  border: 3px;
  border-radius: 4px;
  margin-bottom: 1rem;
  padding: 0.5rem;
  line-height: 1.2;
  width: fit-content;
}
#chat-form .question,
#multigame-form .question,
#rewards-form .question,
#leaderboard-form .question,
#endgame-form .question,
#rules-form .question,
#reader-form .question,
#timeout-form .question,
#correct-form .question,
#fail-form .question,
#question-form .question,
#info-form .question,
#ar-form .question {
  width: 100%;
  display: none;
  text-align: center;
}
#chat-form .question-back,
#multigame-form .question-back,
#rewards-form .question-back,
#leaderboard-form .question-back,
#endgame-form .question-back,
#rules-form .question-back,
#reader-form .question-back,
#timeout-form .question-back,
#correct-form .question-back,
#fail-form .question-back,
#question-form .question-back,
#info-form .question-back,
#ar-form .question-back {
  width: 100%;
  display: none;
  text-align: center;
}
#chat-form audio, #chat-form video, #chat-form img:not(.gameLogo),
#multigame-form audio,
#multigame-form video,
#multigame-form img:not(.gameLogo),
#rewards-form audio,
#rewards-form video,
#rewards-form img:not(.gameLogo),
#leaderboard-form audio,
#leaderboard-form video,
#leaderboard-form img:not(.gameLogo),
#endgame-form audio,
#endgame-form video,
#endgame-form img:not(.gameLogo),
#rules-form audio,
#rules-form video,
#rules-form img:not(.gameLogo),
#reader-form audio,
#reader-form video,
#reader-form img:not(.gameLogo),
#timeout-form audio,
#timeout-form video,
#timeout-form img:not(.gameLogo),
#correct-form audio,
#correct-form video,
#correct-form img:not(.gameLogo),
#fail-form audio,
#fail-form video,
#fail-form img:not(.gameLogo),
#question-form audio,
#question-form video,
#question-form img:not(.gameLogo),
#info-form audio,
#info-form video,
#info-form img:not(.gameLogo),
#ar-form audio,
#ar-form video,
#ar-form img:not(.gameLogo) {
  width: 100%;
  border-radius: 5px;
  margin: 0.5rem 0 0.5rem 0;
}
#chat-form .gameLogo,
#multigame-form .gameLogo,
#rewards-form .gameLogo,
#leaderboard-form .gameLogo,
#endgame-form .gameLogo,
#rules-form .gameLogo,
#reader-form .gameLogo,
#timeout-form .gameLogo,
#correct-form .gameLogo,
#fail-form .gameLogo,
#question-form .gameLogo,
#info-form .gameLogo,
#ar-form .gameLogo {
  width: 8rem;
  margin: 0 0 1rem 0;
}
#chat-form .reward-item,
#multigame-form .reward-item,
#rewards-form .reward-item,
#leaderboard-form .reward-item,
#endgame-form .reward-item,
#rules-form .reward-item,
#reader-form .reward-item,
#timeout-form .reward-item,
#correct-form .reward-item,
#fail-form .reward-item,
#question-form .reward-item,
#info-form .reward-item,
#ar-form .reward-item {
  border-radius: 10px;
}

#multigame-form .content {
  padding: 1rem 1rem 5rem 1rem;
}

#chat-form .content {
  padding: 1rem 1rem 5rem 1rem;
}

#rewards-form .content {
  padding: 1rem 1rem 5rem 1rem;
}
#rewards-form .status-item {
  font-weight: 300;
  font-size: 0.7rem;
  opacity: 0.75;
}

#leaderboard-form .content {
  padding: 1rem 1rem 5rem 1rem;
}

#endgame-form .content {
  padding-top: 0;
}
#endgame-form img {
  border-radius: unset;
}
#endgame-form .gameResult .material-icons {
  font-size: 1.2rem;
  position: relative;
  top: 3px;
}

#rules-form {
  z-index: 1200;
}
#rules-form img {
  border-radius: 0;
  margin: 0;
}
#rules-form .body {
  font-size: 0.9rem;
  text-align: left;
}
#rules-form .section {
  font-size: 1.1rem;
  font-weight: bold;
  text-decoration: underline;
}

/* buttons - go */
.go-chat {
  border-radius: 50%;
  font-weight: bold;
  margin: 1rem;
  width: 3rem;
  height: 3rem;
}
.go-chat .material-icons {
  font-size: 1rem;
  font-weight: bold;
  margin-top: 0.6rem;
  margin-left: 0.1rem;
}

.go-back {
  border-radius: 50%;
  font-weight: bold;
  margin: 1rem;
  width: 4rem;
  height: 4rem;
}
.go-back .material-icons {
  font-size: 2rem;
  font-weight: bold;
  margin-top: 0.5rem;
  margin-left: -0.1rem;
}

.go-ok {
  border-radius: 50%;
  font-weight: bold;
  margin: 1rem;
  width: 4rem;
  height: 4rem;
}
.go-ok .material-icons {
  font-size: 2rem;
  font-weight: bold;
  margin-top: 0.4rem;
}

/* maps */
#map .ol-attribution {
  display: none;
}

.ol-full-screen.ol-unselectable.ol-control {
  /* zkryti tlacitka fullscreen */
  display: none;
}

.ol-attribution.ol-unselectable.ol-control.ol-collapsed {
  /* zkryti info u bings map */
  zoom: 0.1;
}

.ol-close {
  border-radius: 2px !important;
  font-size: 1.5em !important;
}

.ol-menu {
  border-radius: 0 0 2px 2px !important;
  font-size: 1.5em !important;
}

.ol-style {
  border-radius: 2px 2px 0 0 !important;
  font-size: 1.5em !important;
}

.red-button {
  background-image: url("../img/button.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top left;
  width: 5rem;
  height: 7rem;
}
.red-button--small {
  margin-top: 0.8rem;
  width: 4rem;
  height: 4rem;
  color: white;
  font-weight: bold;
  font-size: 1.5rem;
  padding-left: 0.2rem;
  padding-top: 0.8rem;
  text-align: center;
}
.red-button img[for=game] {
  width: 1.8rem;
  margin-top: 1.3rem;
  margin-bottom: 1.56rem;
  position: relative;
  left: 0.3rem;
}
.red-button img[for=settings] {
  width: 2.1rem;
  margin-top: 1.3rem;
  margin-bottom: 1.575rem;
  position: relative;
}

.red-button.button-disabled {
  opacity: 0.5;
}

.red-button-label {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 1rem;
}

/** fix ol - openlayer maps **/
.ol-rotate {
  top: 0.5em !important;
  /* right: calc(2.75em + 0.25rem) !important; */
  right: 2.7rem !important;
}

.ol-rotate.is-chat {
  top: 0.5em !important;
  right: 4.8rem !important;
  /*right: 0.5em;*/
}

.ol-rotate.is-newchat {
  top: 2.6em !important;
  right: 2.7rem !important;
}

.ol-compass {
  font-family: auto;
}

.legendItem {
  clear: both;
  font-size: 0.8rem;
  line-height: 1;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
}
.legendItem img {
  width: 1.5rem;
  float: left;
  margin-right: 0.5rem;
}

/* chat */
.chat {
  border-radius: 1.15rem;
  line-height: 1.25;
  max-width: 85%;
  padding: 0.5rem 0.875rem;
  position: relative;
  word-wrap: break-word;
  margin-bottom: 0.5rem;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

.chat::before,
.chat::after {
  bottom: -0.1rem;
  content: "";
  height: 1rem;
  position: absolute;
}

.chat.other-chat {
  align-items: flex-start;
  background-color: #e5e5ea;
  color: #000;
}

.chat.other-chat:before {
  border-bottom-right-radius: 0.8rem 0.7rem;
  border-left: 1rem solid #e5e5ea;
  left: -0.35rem;
  transform: translate(0, -0.1rem);
}

.chat.other-chat::after {
  background-color: black;
  border-bottom-right-radius: 0.5rem;
  left: 20px;
  transform: translate(-30px, -2px);
  width: 10px;
}

.chat.my-chat {
  align-self: flex-end;
  background-color: #248bf5;
  color: #fff;
  margin-left: 15%;
}

.chat.my-chat::before {
  border-bottom-left-radius: 0.8rem 0.7rem;
  border-right: 1rem solid #248bf5;
  right: -0.35rem;
  transform: translate(0, -0.1rem);
}

.chat.my-chat::after {
  background-color: black;
  border-bottom-left-radius: 0.5rem;
  right: -40px;
  transform: translate(-30px, -2px);
  width: 10px;
}

.chat-text {
  text-align: left;
}

.chat-team {
  text-align: left;
  font-size: 0.7rem;
  opacity: 0.7;
}

.dialog-qr-reward canvas {
  border: 1rem solid white;
}

/*# sourceMappingURL=style.css.map */