

/* Start:/assets/css/v2/games.css?1753871804171062*/
/**************************************************/
/*         __ASSETS__                              */
/**************************************************/
.game-help.show {
  display: flex;
  max-width: 1140px;
}
.game-help {
  display: none;
  position: relative;
  bottom: 0;
  width: 70%;
  height: 53px;
  margin: 20px auto;
  border: 1px solid #ccc;
  background-color: #d9d9d9;
  border-radius: 4px;
  font-family: Calibri, Conv_Calibri;
  font-style: italic;
  font-size: 18px;
  color: #4d4d4d;
  text-align: center;
  box-shadow: inset 1px 1px 6px #b9b9b9;
  align-items: center;
  justify-content: center;
}
.game-help-icon {
  position: relative;
}
.game-help-icon::before,
.game-help::before {
  content: "";
  font-family: Calibri, Conv_Calibri;
  font-style: italic;
  font-size: 28px;
  font-weight: normal;
  color: blue;
  position: absolute;
  width: 30px;
  height: 30px;
  left: -5px;
  top: -20px;
  background: #fff url(/assets/css/v2/../game_images/i.png) no-repeat scroll 50% 50%;
  border-radius: 50%;
  line-height: 30px;
  box-shadow: 1px 1px 2px #9f9f9f;
}

/************************************************************/
/*                    COMMON                                */
/************************************************************/
.game-main .cell {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-color: transparent;
  box-sizing: border-box;
  margin: 1px;
}
.game-main .cell.m2 {
  margin: 2px;
}

.game-main .cell.letter,
.game-main .cell.letterset {
  border-radius: 6px;
  text-align: center;
  line-height: 30px;
}
.game-main .cell.letterset {
  background-color: #808080;
  color: #fff;
  font-size: 17px;
  z-index: 5;
  cursor: pointer;
  margin: 2px;
}
.game-main .cell.letterset:not(.cursor-pointer) {
  cursor: -webkit-grab;
}

.game-main .cell.letter span,
.game-main .cell.letter.inserted span {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  border-radius: 6px;
  width: 100%;
  height: 100%;
  background-color: #e5e5e5;
  border: 1px solid #c9c9c9;
  box-sizing: border-box;
  z-index: 2;
}
.game-main .cell.letter.inserted {
  position: relative;
  width: 30px;
}

.game-main .top-block-wrap {
  height: 240px;
}

.abbreviation .top-block-wrap {
  height: 280px !important;
}

.game-main .top-block {
  width: 1040px;
  height: 200px;
  text-align: center;
  font-size: 16px;
  background-color: #fff;
  margin: 20px 0;
}

.abbreviation .top-block {
  height: 240px !important;
}

.game-main .bottom-block {
  margin-top: 50px;
}
.game-main .selected {
  background-color: #1b9e59;
  color: #fff;
}
.hide {
  display: none !important;
}
.game-main .game-timer {
  display: flex;
  width: 110px;
  height: 72px;
  background: url(/assets/css/v2/../game_images/hourglass.png) no-repeat scroll 0 10px;
  font-size: 16px;
  color: #fff;
  margin-left: 30px;
}
.game-main .game-timer > div {
  width: 100%;
  height: 20px;
  text-align: right;
}
.game-main .game-timer > div:first-child {
  font-size: 11px;
}

/**************************************************/
/*         __GAMES__                              */
/**************************************************/
.game-main {
  position: relative;
  background-color: rgba(216, 216, 216, 0.5);
  min-height: 940px;
  /*height: 940px;*/
}
.game-main .error {
  background-color: #f86666;
  color: #fff;
}

.game-main .game-cancel {
  background: url(/assets/css/v2/../game_images/cancel.png) no-repeat scroll;
  cursor: pointer;
}
.game-main .game-cancel:hover {
  background: url(/assets/css/v2/../game_images/cancel_a.png) no-repeat scroll;
}

.game-main .game-prompt {
  background: url(/assets/css/v2/../game_images/qc.png) no-repeat scroll;
  cursor: pointer;
}
.game-main .game-prompt:hover {
  background: url(/assets/css/v2/../game_images/qc_a.png) no-repeat scroll;
}

.game-main .tooltip-right,
.game-main .tooltip-left {
  position: relative;
  display: inline-block;
  min-width: 53px;
  max-width: 53px;
  height: 53px;
}
.game-main .tooltip-right > span,
.game-main .tooltip-left > span {
  position: absolute;
  width: 450px;
  left: -30000px;
  top: 60px;
  padding: 10px;
  line-height: normal;
  color: #333;
  background-color: #adadad;
  font-size: 18px;
  text-align: left;
  z-index: 99999;
}
.game-main .tooltip-left > span {
  border-radius: 0px 5px 5px 5px;
}
.game-main .tooltip-right > span {
  border-radius: 5px 0px 5px 5px;
}
.game-main .tooltip-left:hover > span {
  left: 30px;
}
.game-main .tooltip-right:hover > span {
  left: -440px;
}
.game-main .tooltip-right > span:after,
.game-main .tooltip-left > span:after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  top: -10px;
}
.game-main .tooltip-left > span:after {
  left: 0px;
  border-bottom: 10px solid #adadad;
  border-right: 30px solid transparent;
}
.game-main .tooltip-right > span:after {
  right: 0px;
  border-bottom: 10px solid #adadad;
  border-left: 30px solid transparent;
}

.game-main header {
  position: relative;
  width: 100%;
  height: 72px;
  background-color: #1e9b59;
}
.game-main header:after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0px;
  width: 100%;
  height: 240px;
  z-index: -90;
  background-color: rgb(219, 219, 219);
  box-shadow: inset 0px -2px 27px 0px rgba(0, 0, 0, 0.2);
}
.game-main .game-header {
  position: relative;
  width: 1140px;
}
.game-main .game-header .right-block {
  min-width: 228px;
}
.game-main .game-header .game-header-title {
  width: 100%;
}
.game-main .game-header .game-header-title h1 {
  width: 85%;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  font-size: 23px;

  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.game-main .game-header button.save {
  margin-right: 20px;
}

.game-main .game-body {
  width: 1140px;
  margin: 0 auto;
  font-size: 16px;
}

#container_pd_guard.game-container {
  min-height: 700px;
}

.game-main .game-container {
  min-height: 782px;
  height: 100%;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  box-shadow: 4px 4px 4px #ccc;
  margin-bottom: 20px;
  background-color: rgba(255, 255, 255, 0.5);
}
.row {
  width: 100%;
}

.game-main .correct {
  background-color: #1b9e59 !important;
  color: #fff;
}
.mirrorX {
  transform: scaleX(-1);
}

/**************************************************/
/*         __TASK CONNECT__                       */
/**************************************************/
.game-body.task.connect .sequence-top {
  width: 1053px;
  padding-right: 50px;
  z-index: 10;
}
.game-body.task.connect .sequence {
  min-width: 879px;
  width: 879px;
  min-height: 466px;
  height: 466px;
  box-shadow: 0px 1px 1px #000, 0px 4px 1px #fff, 0px 5px 1px #000, 0px 8px 1px #fff, 0px 9px 1px #000, 0px 12px 1px #fff, 0px 13px 1px #000;
  background-color: #fff;
  margin-top: -54px;
  padding: 40px;
}

.game-body.task.connect .sequence ol {
  list-style: none;
  counter-reset: point;
  padding-top: 32px;
}
.game-body.task.connect .sequence ol li {
  margin-bottom: 10px;
  position: relative;
  font-size: 19px;
  padding: 10px 0 10px 25px;
}
.game-body.task.connect .sequence ol li:before {
  content: counter(point); /* выводим значение переменной */
  counter-increment: point 1; /* увеличваем счетчик на 1 */
  font-size: 19px; /* декор цифр  */
  font-weight: bold !important;
  position: absolute;
  left: 0;
  width: 20px;
  color: #f48e36;
  text-align: center;
}

/**************************************************/
/*         __ANIMATION EMAILWORK__                */
/**************************************************/
.game-body.animation.emailwork .main-block {
  position: relative;
  width: 100%;
  height: 100%;
}
.game-body.animation.emailwork .select {
  color: #f27b2e;
}
.game-body.animation.emailwork .title {
  font-size: 20px;
  margin-top: 10px;
}
.game-body.animation.emailwork .title2 {
  font-size: 16px;
}
.game-body.animation.emailwork .blue {
  font-size: 20px;
  color: #1c71b6;
}
.game-body.animation.emailwork .clicable {
  cursor: pointer;
}
.game-body.animation.emailwork .c-block:not(:last-child) {
  width: 1090px;
}
.game-body.animation.emailwork .c-block:last-child {
  width: 100%;
}
.game-body.animation.emailwork .c-block:nth-child(2) {
  margin: 20px 0;
}
.game-body.animation.emailwork .w-block {
  background-color: #fff;
}
.game-body.animation.emailwork .m-block {
  width: 525px;
  height: 352px;
}
.game-body.animation.emailwork .m-block > div {
  width: 440px;
  text-align: center;
}
.game-body.animation.emailwork .m-comp {
  width: 122px;
}
.game-body.animation.emailwork .block-top-round {
  height: 220px;
}
.game-body.animation.emailwork .block-top-round > img {
  margin: 20px 100px;
}
.game-body.animation.emailwork .msg-block {
  background: linear-gradient(to top, #f27b2e, #f5983a);
  height: 124px;
  width: 812px;
  font-size: 24px;
  color: #fff;
  margin: 10px 0;
  padding: 20px;
}
.game-body.animation.emailwork .letter-container,
.game-body.animation.emailwork svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 20;
}
.game-body.animation.emailwork .letter {
  position: absolute;
}
.game-body.animation.emailwork .tooltip-oops {
  position: relative;
  height: 50px;
  min-width: 80px;
  max-width: 100px;
  border-radius: 10px;
  background-color: #f83;
  color: #fff;
  font-size: 20px;
  line-height: 50px;
  text-align: center;
  display: inline-block;
  margin-left: 100px;
}
.game-body.animation.emailwork .tooltip-oops:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  top: 99%;
  left: -25%;
  border-width: 20px;
  border-style: solid;
  border-color: #f83 transparent transparent;
  transform: skewX(-64deg);
}

/**************************************************/
/*         __ANIMATION COMMON__                   */
/**************************************************/
.game-body.animation .person {
  position: relative;
  z-index: 10;
}
.game-body.animation .person span.R,
.game-body.animation .person span.L {
  position: absolute;
  top: 0;
  font-size: 17px;
  color: #1c71b6;
}
.game-body.animation .person span.R {
  right: 124px;
}
.game-body.animation .person span.L {
  left: 120px;
}
.game-body.animation .person img.manR,
.game-body.animation .person img.manL {
  position: absolute;
}
.game-body.animation .person img.manR {
  top: 30px;
  right: 100px;
}
.game-body.animation .person img.manL {
  top: 30px;
  right: -45px;
}
.game-body.animation .person div.R,
.game-body.animation .person div.L {
  margin: 10px 0;
  font-size: 20px;
}
.game-body.animation .person div.L {
  text-align: right;
}

.game-body.animation .person .textL {
  position: absolute;
  font-size: 10px;
  width: 80px;
  text-align: center;
  color: #fff;
  top: 30px;
  left: 28px;
  transform: rotate(-8deg);
}

.game-body.animation .person .textR {
  position: absolute;
  font-size: 10px;
  width: 80px;
  text-align: center;
  color: #fff;
  top: 28px;
  left: 59px;
  transform: rotate(8deg);
}

.message-info {
  padding-top: 20px;
  padding-bottom: 20px;
  max-height: 75vh;
  overflow-y: auto;
}

.message-info h1 {
  min-height: 0 !important;
  margin-bottom: 30px;
}

.message-info p {
  color: #000 !important;
}

.message-info ul {
  font-size: 16px !important;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.message-info ul li b {
  color: #000;
}

/**************************************************/
/*         __ANIMATION TOUCH__                    */
/**************************************************/
.game-body.animation.touch .main-block {
  position: relative;
  width: 100%;
  min-height: 782px;
}
.game-body.animation.touch .message {
  position: relative;
  min-width: 655px;
  min-height: 145px;
  font-size: 20px;
  max-width: 900px;
  padding: 20px;
  /*text-align: center;*/
  background-color: #fff;
}
.game-body.animation.touch .msg {
  position: relative;
  min-width: 655px;
  max-width: 655px;
  max-height: 45px;
  font-size: 20px;
  padding: 20px;
  background-color: #fff;
  margin: 5px 0 !important;
  z-index: 20;
}
.game-body.animation.touch .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.game-body.animation.touch .title {
  text-align: center;
  font-size: 30px;
}
.game-body.animation.touch .block {
  margin: 20px 0px;
}

.game-body.animation.touch .block-pos {
  position: relative;
  width: 900px;
  height: 500px;
}
.game-body.animation.touch .ld {
  position: absolute;
  left: 0;
  bottom: 0;
}
.game-body.animation.touch .rd {
  position: absolute;
  right: 0;
  bottom: 0;
}
.game-body.animation.touch .lt {
  position: absolute;
  left: 0;
  top: 0;
}
.game-body.animation.touch .rt {
  position: absolute;
  right: 0;
  top: 0;
}
.game-body.animation.touch .cc {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.game-body.animation .cable {
  position: relative;
  height: 10px;
  width: 254px;
  background: linear-gradient(to left, rgba(0, 0, 0, 0), #51b1d9 30%, #51b1d9 70%, rgba(0, 0, 0, 0)) no-repeat scroll;
}

.game-body.animation .cable.cld {
  top: 312px;
  transform: rotate(-30deg);
  left: 134px;
}

.game-body.animation .cable.crd {
  top: 302px;
  transform: rotate(30deg);
  left: 498px;
}

.game-body.animation .cable.clt {
  top: 100px;
  transform: rotate(210deg);
  left: 134px;
}

.game-body.animation .cable.crt {
  top: 100px;
  transform: rotate(-30deg);
  left: 498px;
}

.game-body.animation .cable img {
  position: absolute;
  top: -24px;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  /*animation-direction: alternate;*/
  animation-timing-function: linear;
}
.game-body.animation .cable img.start {
  animation-name: eflash_start;
}
.game-body.animation .cable img.finish {
  animation-name: eflash_finish;
}
@keyframes eflash_start {
  0% {
    left: 0;
    opacity: 0;
  }
  25% {
    left: 50%;
    opacity: 1;
  }
  50% {
    left: 100%;
    opacity: 0;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}
@keyframes eflash_finish {
  0% {
    left: 0;
    opacity: 0;
  }
  50% {
    left: 0%;
    opacity: 0;
  }
  75% {
    left: 50%;
    opacity: 1;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}
.game-body.animation .person .text-animation-finishL,
.game-body.animation .person .text-animation-finish,
.game-body.animation .person .text-animation-start {
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
.game-body.animation .person .text-animation-start {
  animation-name: text_start;
}
.game-body.animation .person .text-animation-finish {
  transform: scale(0);
  animation-name: text_finish;
}
.game-body.animation .person .text-animation-finishL {
  transform: scale(0);
  animation-name: text_finishL;
}
@keyframes text_start {
  0% {
    transform: scale(1) rotate(-8deg);
  }
  50% {
    transform: scale(0) rotate(-8deg);
  }
  100% {
    transform: scale(0) rotate(-8deg);
  }
}
@keyframes text_finish {
  0% {
    transform: scale(0) rotate(8deg);
  }
  50% {
    transform: scale(0) rotate(8deg);
  }
  100% {
    transform: scale(1) rotate(8deg);
  }
}
@keyframes text_finishL {
  0% {
    transform: scale(0) rotate(-8deg);
  }
  50% {
    transform: scale(0) rotate(-8deg);
  }
  100% {
    transform: scale(1) rotate(-8deg);
  }
}
.game-body.animation .person .textR img,
.game-body.animation .person .textL img {
  position: absolute;
  top: -50px;
  left: -70px;
  transform: scale(0.4);
}
.game-body.animation.animation.touch .wrap-block {
  border-radius: 10px;
  background-color: #fff;
  padding: 20px;
  background-color: rgba(230, 230, 230, 0.7);
  z-index: 20;
}
.game-body.animation.animation.touch .wrap-block img {
  vertical-align: middle;
}
.game-body.animation.animation.touch .tooltipL,
.game-body.animation.animation.touch .tooltipR {
  position: relative;
  height: 50px;
  min-width: 80px;
  border-radius: 10px;
  background-color: #fff;
  font-size: 20px;
  line-height: 50px;
  text-align: center;
  display: inline-block;
  margin: 0 60px;
  padding: 0 20px;
}
.game-body.animation.animation.touch .tooltipL:before,
.game-body.animation.animation.touch .tooltipR:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  border-width: 14px;
  border-style: solid;
  transform: scaleY(0.65);
}
.game-body.animation.animation.touch .tooltipR:before {
  border-color: transparent #fff transparent transparent;
  left: -28px;
  top: 11px;
}
.game-body.animation.animation.touch .tooltipL:before {
  border-color: transparent transparent transparent #fff;
  right: -28px;
  top: 11px;
}
.game-body.animation.animation.touch .comp-set {
  position: relative;
  display: inline-block;
}
.game-body.animation.animation.touch .comp-set .text {
  position: absolute;
  top: 55px;
  left: 256px;
  width: 155px;
  font-size: 13px;
  color: #fff;
  transform: rotate(4deg) skewY(8deg);
  line-height: 1.2;
}
/**************************************************/
/*         __TASK IPCOUNT__                       */
/**************************************************/
.game-body.task.ipcount .main-block {
  position: relative;
  width: 100%;
  min-height: 720px;
}
.game-body.task.ipcount .col-wrap {
  width: 140px;
}
.game-body.task.ipcount .col {
  width: 140px;
  border-bottom: 1px solid #b1b1b1;
}
.game-body.task.ipcount .split {
  position: relative;
  width: 20px;
  cursor: pointer;
  transition: all 0.4s linear;
}
.game-body.task.ipcount .split .hr {
  position: absolute;
  left: 50%;
  bottom: 35px;
  width: 2px;
  height: 30%;
  background-color: #b1b1b1;
}
.game-body.task.ipcount .split .error {
  font-size: 18px;
  color: #f86666;
  background-color: transparent !important;
  text-align: center;
}
.game-body.task.ipcount .split .etext {
  color: #000;
  text-align: center;
  padding-bottom: 144px;
}
.game-body.task.ipcount .seconds {
  width: 50px;
  height: 144px;
  background: linear-gradient(to top, #912aa3 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .ipv4 {
  width: 50px;
  height: 297px;
  background: linear-gradient(to top, #912aa3 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .ipv6 {
  width: 50px;
  height: 500px;
  background: linear-gradient(to top, #912aa3 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .ruspop {
  width: 50px;
  height: 182px;
  background: linear-gradient(to top, #b93787 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .distance {
  width: 50px;
  height: 260px;
  background: linear-gradient(to top, #c82b2b 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .age {
  width: 50px;
  height: 297px;
  background: linear-gradient(to top, #cbc907 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .population {
  width: 50px;
  height: 346px;
  background: linear-gradient(to top, #27c970 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .bill {
  width: 50px;
  height: 393px;
  background: linear-gradient(to top, #1b9bb5 0%, rgba(255, 255, 255, 0.1) 100%) no-repeat;
}
.game-body.task.ipcount .text {
  font-size: 18px;
  width: 160px;
}
.game-body.task.ipcount .text-wrap {
  height: 75px;
  text-align: center;
}
.game-body.task.ipcount .dig {
  font-size: 24px;
}
.game-body.task.ipcount .next.orange {
  width: 112px;
  height: 36px;
  position: relative;
}
.game-body.task.ipcount .next.orange img {
  position: absolute;
  top: -10px;
  left: 40px;
}
.game-body.task.ipcount .gap {
  padding-bottom: 114px;
  /*background: #fff;*/
  text-align: center;
}

/**************************************************/
/*         __TRAINER STRUCT__                     */
/**************************************************/
.game-body.trainer.struct .main-block {
  position: relative;
  width: 100%;
  min-height: 782px;
}
.game-body.trainer.struct .menu {
  font-size: 32px;
  margin: 20px 0;
  width: 40%;
  height: 200px;
  padding: 0 40px;
  cursor: pointer;
  background-color: #f1f1f1;
  padding: 0 20px;
}
.game-body.trainer.struct .menu img {
  vertical-align: middle;
}
.game-body.trainer.struct .s-cell {
  display: block;
  border: 1px solid #b1b1b1;
  border-collapse: collapse;
  margin-left: -1px;
  margin-top: -1px;
}
.game-body.trainer.struct .s-site {
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0);
}
.game-body.trainer.struct .s-menu,
.game-body.trainer.struct .s-header,
.game-body.trainer.struct .s-footer {
  min-width: 917px;
  height: 90px;
}
.game-body.trainer.struct .s-bag {
  min-width: 200px;
}
.game-body.trainer.struct .s-sidebar {
  width: 200px;
  height: 345px;
}
.game-body.trainer.struct .s-content {
  width: 1140px; /*716px;*/
  height: 345px;
}
.game-body.trainer.struct .s-side2 {
  width: 200px;
  height: 172px;
}
.game-body.trainer.struct .s-side3 {
  width: 200px;
  height: 114px;
}

.game-body.trainer.struct .w-block {
  display: inline-block;
  margin: 0 2px;
}
.game-body.trainer.struct .s-block {
  width: 186px;
  height: 134px;
  background-color: #fff;
}
.game-body.trainer.struct .s-block span {
  font-size: 17px;
}
.game-body.trainer.struct .in-block {
  cursor: pointer;
}
.game-body.trainer.struct .in-block img {
  vertical-align: middle;
}

.game-body.trainer.struct .h-scroll-wrap {
  /*position: relative;*/
  width: 1000px;
  height: 150px;
  overflow: hidden;
}
.game-body.trainer.struct .h-scroll-wrap:before {
  content: "";
  position: absolute;
  width: 1000px;
  height: 150px;
  background: linear-gradient(to right, #f5f5f5 0%, rgba(255, 255, 255, 0) 15%, rgba(255, 255, 255, 0) 85%, #f5f5f5 100%) no-repeat;
  z-index: 10;
  pointer-events: none;
}
.game-body.trainer.struct .quiz {
  width: 900px;
  background-color: #e1e1e1;
  margin: 0 auto;
  padding: 10px 0;
}
.game-body.trainer.struct .w-questions {
  width: 60%;
}
.game-body.trainer.struct .question,
.game-body.trainer.struct .title {
  width: 100%;
  height: 100px;
  background-color: #fff;
  margin: 5px 0;
}
.game-body.trainer.struct .question {
  font-size: 24px;
}
.game-body.trainer.struct .title {
  font-size: 32px;
  font-size: 32px;
  text-align: center;
  line-height: 1.5;
}
.game-body.trainer.struct .question img {
  vertical-align: middle;
  margin-left: 20px;
}
.game-body.trainer.struct .question label {
  width: 300px;
  cursor: pointer;
}
.game-body.trainer.struct .question input[type="checkbox"] {
  display: none;
}
.game-body.trainer.struct .question span.marker {
  position: relative;
}
.game-body.trainer.struct .question input[type="checkbox"]:checked ~ span.marker:before {
  position: absolute;
  top: -34px;
  left: -78px;
  width: 71px;
  height: 55px;
  content: "";
  background: transparent url(/assets/css/v2/../game_images/check.png) no-repeat scroll 0 0;
}
.game-body.trainer.struct .question input.error[type="checkbox"]:checked ~ span.marker:before {
  background: transparent url(/assets/css/v2/../game_images/check_error.png) no-repeat scroll 0 0;
}
.game-body.trainer.struct .question input.error[type="checkbox"] + span {
  background-color: #f86666;
}

/**************************************************/
/*         __TASK SOFTWARE__                      */
/**************************************************/
.game-body.task.software .main-block {
  position: relative;
  width: 100%;
  height: 782px;
}
.game-body.task.software .message {
  min-width: 534px;
  min-height: 150px;
  background-color: #fff;
  font-size: 24px;
  text-align: center;
  margin-bottom: 40px;
  padding: 20px;
  max-width: 690px;
}
.game-body.task.software .message.down {
  margin-bottom: -80px;
  z-index: 10;
  width: 540px;
}
.game-body.task.software .screen {
  background: transparent url("/games/v2/games/task/software/img/bg.png") no-repeat scroll 50% 50%;
}
.game-body.task.software .title h1 {
  font-size: 27px;
  color: #f48a34;
}
.game-body.task.software .title h2 {
  font-size: 24px;
  color: #000;
}
.game-body.task.software .title {
  font-size: 18px;
  color: #000;
  margin: 10px 0;
  width: 100%;
}
ul.orig.scroll {
  height: 300px;
  overflow-y: scroll;
  font-size: 18px;
}
.game-body.task.software .loadbar {
  position: relative;
  width: 450px;
  height: 46px;
  background: linear-gradient(to right, red 0%, yellow 50%, green 100%) no-repeat scroll;
  border-radius: 23px;
  overflow: hidden;
}
.game-body.task.software .loadbar > div {
  width: 4px;
  height: 100%;
  background-color: #ccc;
}
.game-body.task.software .loadbar .loadbar-veil {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 10px;
}
.game-body.task.software .w-question {
  background-color: #fff;
  padding: 0px 20px;
  width: 900px;
  margin: 10px 0;
  height: 120px;
}
.game-body.task.software .question {
  font-size: 20px;
  width: 80%;
}
.game-body.task.software .w-question img {
  cursor: pointer;
}
.game-body.task.software .w-question img:not(.checked) {
  opacity: 0.2;
}
.smw-content.info {
  height: auto !important;
  width: 60vw !important;
  max-width: 800px !important;
}

.smw-content.info.big-size {
  height: 400px;
}

.smw-content.info.true.on {
    height: auto !important;
    padding: 20px 0px !important;
}

/**************************************************/
/*         __ANIMATION PORTAL__                   */
/**************************************************/
.game-body.animation.portal .game-container {
  overflow: hidden;
}
.game-body.animation.portal .main-block {
  position: relative;
  width: 100%;
  height: 782px;
  overflow: hidden;
}
.game-body.animation.portal .block100 {
  width: 100%;
  height: 100%;
}
.game-body.animation.portal .message {
  position: relative;
  width: 520px;
  height: 145px;
  min-height: 145px;
  font-size: 20px;
  max-width: 520px;
  /*padding: 0 0 0 30px;*/
  padding: 30px;
  background-color: #f7f7f7;
  z-index: 100;
}
.game-body.animation.portal .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.game-body.animation.portal .message.c-block,
.game-body.animation.portal .message.c-block-d {
  position: absolute;
  top: 50%;
  left: 50%;
}
.game-body.animation.portal .message.c-block {
  transform: translateX(-50%) translateY(-50%);
}
.game-body.animation.portal .message.c-block-d {
  transform: translateX(-50%) translateY(50%);
}
.game-body.animation.portal .door {
  position: relative;
}
.game-body.animation.portal .site {
  background-color: #fff;
  transition: all 0.4s linear;
}
.game-body.animation.portal .site .head {
  width: 1020px;
  height: 180px;
  padding: 20px 60px;
}
.game-body.animation.portal .title {
  font-size: 30px;
  width: 100%;
}
.game-body.animation.portal .title h1 {
  font-size: 56px;
  margin-left: -15px;
}
.game-body.animation.portal .title h2 {
  font-size: 28px;
}
.game-body.animation.portal .site .body {
  width: 1020px;
  padding: 0px 60px 20px 60px;
}
.game-body.animation.portal .site .footer {
  width: 1020px;
  padding: 0px 60px;
}
.game-body.animation.portal .site .body .part {
  padding: 140px 0px;
  background-color: #e1e1e1;
  width: 85px;
}
.game-body.animation.portal .tooltip-info {
  position: relative;
  height: 56px;
  min-width: 200px;
  max-width: 200px;
  border-radius: 10px;
  background-color: #f83;
  color: #fff;
  font-size: 20px;
  line-height: 19px;
  text-align: center;
  padding: 20px;
  float: right;
}
.game-body.animation.portal .tooltip-info:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  top: 28px;
  left: -40px;
  border-width: 20px;
  border-style: solid;
  border-top-color: transparent;
  border-right-color: #f83;
  border-bottom-color: transparent;
  border-left-color: transparent;
}
.game-body.animation.portal .door-over {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.4s linear;
}
.game-body.animation.portal .door-over .d-td {
  width: 100%;
  height: 203px;
  background-color: #fff;
}
.game-body.animation.portal .door-over .d-lr {
  background-color: #fff;
  width: 476px;
  height: 376px;
  display: inline-block;
  position: relative;
}
.game-body.animation.portal .door-over img {
  display: inline-block;
}

.game-body.animation.portal .left-menu,
.game-body.animation.portal .content {
  display: inline-block;
  margin-left: 40px;
}

.game-body.animation.portal .left-menu > ul > li {
  position: relative;
  color: #f83;
  font-size: 24px;
}
.game-body.animation.portal .left-menu > ul > li:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  top: 8px;
  left: -14px;
  border-width: 7px;
  border-style: solid;
  border-color: transparent transparent transparent #f83;
}
.game-body.animation.portal .left-menu > ul > li ul li,
.game-body.animation.portal .content ul li {
  position: relative;
  color: #000;
  font-size: 18px;
  margin-left: 20px;
}

.game-body.animation.portal .left-menu > ul > li > ul > li:before,
.game-body.animation.portal .content > ul > li:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  top: 6px;
  left: -10px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent transparent #000;
}
.game-body.animation.portal .left-menu > ul > li > ul > li ul li:before,
.game-body.animation.portal .content > ul > li ul li:before {
  content: "";
  position: absolute;
  width: 0px;
  height: 0px;
  top: 10px;
  left: -10px;
  border-width: 2px;
  border-style: solid;
  border-color: #000;
}

.game-body.animation.portal .content {
  height: 300px;
}

.game-body.animation.portal .content > ul > li ul li.close:before {
  top: 6px;
  left: -10px;
  border-width: 5px;
  border-color: transparent transparent transparent #000;
}
.game-body.animation.portal .content > ul > li ul li.open:before {
  top: 6px;
  left: -10px;
  border-width: 5px;
  border-color: #000 transparent transparent transparent;
}
.game-body.animation.portal .question {
  width: 480px;
  height: 180px;
  background-color: #fff;
  color: #000;
  font-size: 26px;
  margin: 10px 40px;
  text-align: center;
}
.game-body.animation.portal .answers {
  width: 328px;
  height: 160px;
  color: #000;
  font-size: 18px;
}
.game-body.animation.portal .answers label {
  margin: 10px;
  cursor: pointer;
}
.game-body.animation.portal .answers input {
  font-size: 18px;
  width: 30px;
}

/**************************************************/
/*         __ANIMATION P2P__                      */
/**************************************************/
.game-body.animation.p2p .main-block {
  position: relative;
  width: 100%;
  height: 782px;
}
.game-body.animation.p2p .message {
  position: relative;
  width: 368px;
  height: 126px;
  font-size: 22px;
  padding: 30px;
  background-color: #fff;
  z-index: 100;
  text-align: center;
}
.game-body.animation.p2p .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.game-body.animation.p2p .info-block {
  position: absolute;
  bottom: 10px;
  border-radius: 10px;
  width: 650px;
  height: 74px;
  font-size: 26px;
  background: linear-gradient(to top, #f83 0%, #fa5 100%) no-repeat scroll;
  color: #fff;
  text-align: center;
  left: 50%;
  transform: translateX(-50%);
}
.game-body.animation.p2p .computer-block {
  position: relative;
  width: 378px;
  height: 290px;
  margin-bottom: 20px;
}
.game-body.animation.p2p .computer-block > *:not(.bg) {
  position: relative;
  z-index: 2;
}
.game-body.animation.p2p .computer-block .bg2 {
  position: absolute;
  width: 378px;
  height: 378px;
  background: linear-gradient(to top, #6d89a3 0%, #8aa2b7 100%) no-repeat scroll;
  border-radius: 50%;
  box-shadow: -2px -2px 1px #a8bac9, 1px 1px 1px #5d768d, 0px -3px 0px #8aa2b7, -3px 0px 0px #8aa2b7, 0px 3px 0px #8aa2b7, 3px 0px 0px #8aa2b7,
    2px 2px 6px #ccc;
  z-index: 1;
}
.game-body.animation.p2p .computer-block .indicator {
  width: 10%;
  height: 100%;
  border: 2px solid #96a6b3;
  border-radius: 6px;
  background-color: #fff;
}
.game-body.animation.p2p .v-block > img:nth-child(2n) {
  /*margin: 0 90px 90px 90px;*/
  height: 100%;
}
.game-body.animation.p2p .computer-block .bg {
  border-radius: 50%;
  background-image: -moz-linear-gradient(90deg, #6d89a3 0%, #8aa2b7 100%);
  background-image: -webkit-linear-gradient(90deg, #6d89a3 0%, #8aa2b7 100%);
  background-image: -ms-linear-gradient(90deg, #6d89a3 0%, #8aa2b7 100%);
  background-image: linear-gradient(90deg, #6d89a3 0%, #8aa2b7 100%);
  box-shadow: 0px 4px 6px 0px rgba(49, 49, 49, 0.216), inset 0px 3px 0px 2px rgba(255, 255, 255, 0.098);

  position: absolute;
  width: 393px;
  height: 393px;
  z-index: 1;
}
.game-body.animation.p2p .computer-mini-block {
  position: relative;
  width: 168px;
  height: 103px;
}
.game-body.animation.p2p .computer-mini-block.L {
  margin: 0 0px 90px 90px;
}
.game-body.animation.p2p .computer-mini-block.L:nth-child(2n) {
  margin: 0 0px 90px 0px;
}
.game-body.animation.p2p .computer-mini-block.R {
  margin: 0 90px 90px 0px;
}
.game-body.animation.p2p .computer-mini-block.R:nth-child(2n) {
  margin: 0 0px 90px 0px;
}
.game-body.animation.p2p .computer-mini-block .indicator {
  width: 5%;
  height: 100%;
  border: 1px solid #96a6b3;
  /*border-radius: 6px;*/
  background-color: #fff;
}
.game-body.animation.p2p .computer-mini-block .indicator.in {
  background: linear-gradient(to top, #54e580 0%, #fff 100%) no-repeat scroll;
  background-position: 0px 110px;
  transition: all 1.4s linear;
  /*background-color: #54e580;*/
}
.game-body.animation.p2p .computer-mini-block .indicator.out {
  background: linear-gradient(to top, #e83f3f 0%, rgba(255, 255, 255, 0.2) 100%) no-repeat scroll;
  background-position: 0px 110px;
  transition: all 1.4s linear;
}
.game-body.animation.p2p svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 20;
}

/**************************************************/
/*         __TASK WHOIS__                         */
/**************************************************/
.game-body.task.whois .main-block {
  position: relative;
  width: 100%;
  height: 762px;
  padding-top: 20px;
}
.game-body.task.whois .message {
  position: relative;
  width: 450px;
  min-height: 126px;
  font-size: 18px;
  padding: 30px;
  background-color: #fff;
  z-index: 100;
  text-align: justify;
  margin: 5px 0;
}
.game-body.task.whois .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.game-body.task.whois .message h1 {
  font-size: 24px;
  text-align: center;
}
.game-body.task.whois .w-info,
.game-body.task.whois .desc,
.game-body.task.whois .step {
  position: relative;
  width: 450px;
  padding: 20px;
}
.game-body.task.whois .desc {
  background-color: #e8e8e8;
  font-size: 18px;
  margin-top: -6px;
}
.game-body.task.whois .step {
  background-color: #fff;
  text-align: center;
  font-size: 24px;
  z-index: 2;
  margin: 5px 0;
  min-height: 35px;
}
.game-body.task.whois .w-info {
  background: #6eafea url("/games/v2/games/task/whois/img/question.png") no-repeat scroll 5% 50%;
  margin: 40px 0;
}
.game-body.task.whois .w-info h1,
.game-body.task.whois .w-info span {
  margin-left: 90px;
  color: #fff;
}
.game-body.task.whois .w-info span {
  font-size: 18px;
}
.game-body.task.whois .desc input {
  border: none;
  border-radius: 4px;
  height: 40px;
  font-size: 24px;
  padding-left: 4px;
  width: 450px;
  margin: 5px 0;
}
.cryptography_100 input {
  border: 1px solid #C0C0C0;
  border-radius: 8px;
  height: 40px;
  font-size: 24px;
  padding: 4px;
  width: 600px;
  margin: 0;
  text-align: center;
}
.game-body.task.whois strong {
  font-weight: bold;
}
.game-body.task.whois .no,
.game-body.task.whois .ok {
  width: 50px;
  height: 50px;
}
.game-body.task.whois .no {
  background: url(/games/v2/games/task/whois/img/no.png) no-repeat scroll;
}
.game-body.task.whois .ok {
  background: url(/games/v2/games/task/whois/img/yes.png) no-repeat scroll;
}
.game-body.task.whois .no div,
.game-body.task.whois .ok div {
  margin-left: 60px;
}

/**************************************************/
/*         __TASK WHOIS__                         */
/**************************************************/
.game-body.task.search .main-block {
  position: relative;
  width: 100%;
  height: 762px;
  padding-top: 20px;
}
.game-body.task.search .message {
  position: relative;
  width: 450px;
  min-height: 126px;
  font-size: 18px;
  padding: 30px;
  background-color: #fff;
  z-index: 100;
  text-align: justify;
  margin: 5px 0;
}
.game-body.task.search button img {
  vertical-align: middle;
}
.game-body.task.search .panel {
  width: 930px;
  height: 320px;
  background-color: #f4f257;
  margin-top: 20px;
  padding: 0px 50px;
}
.game-body.task.search .panel label {
  min-width: 160px;
  display: inline-block;
  font-size: 18px;
  font-style: italic;
  /*text-align: right;*/
  margin-right: 10px;
}
.game-body.task.search .panel strong {
  font-weight: bold;
}
.game-body.task.search .panel select,
.game-body.task.search .panel input {
  width: 224px;
  height: 30px;
  border: none;
  border-radius: 4px;
  font-size: 18px;
}
.game-body.task.search .panel hr {
  opacity: 0.5;
}

.game-body.task.search .in-results {
  width: 1030px;
  height: 336px;
  overflow-y: auto;
  overflow-x: hidden;
}

.game-body.task.search .results {
  width: 1030px;
  height: 400px;
  background-color: #fff;
  margin-top: 20px;
  border: 1px solid #ebebeb;
}
.game-body.task.search .head {
  font-size: 22px;
  height: 64px;
}
.game-body.task.search .head div {
  background-color: #f4f4f4;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 64px;
}
.game-body.task.search .head div:nth-child(2n) {
  background-color: #ebebeb;
}
.game-body.task.search .results .row > div:nth-child(2n) {
  background-color: rgba(235, 235, 235, 0.5);
}
.game-body.task.search .results .row:nth-child(2n) {
  background-color: rgb(190, 230, 255);
}
.game-body.task.search .results .row > div {
  background-color: rgba(244, 244, 244, 0.5);
  min-width: 343px;
  min-height: 88px;
  text-align: center;
  font-size: 18px;
}

/**************************************************/
/*         __ANIMATION IPADDRESS__                */
/**************************************************/
.game-body.animation.ipaddress {
  position: relative;
}
.game-body.animation.ipaddress .main-block {
  position: relative;
  width: 100%;
  height: 762px;
  padding-top: 20px;
}
.game-body.animation.ipaddress .message {
  position: relative;
  width: 450px;
  min-height: 126px;
  font-size: 18px;
  padding: 30px;
  background-color: #fff;
  z-index: 100;
  text-align: justify;
  margin: 5px 0;
}
.game-body.animation.ipaddress .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.game-body.animation.ipaddress .top img {
  margin-left: -400px;
}
.game-body.animation.ipaddress .bottom img {
  margin-top: -200px;
  margin-left: 50px;
}
.game-body.animation.ipaddress .middle img {
  margin-right: 50px;
}
.game-body.animation.ipaddress svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 20;
}
.game-body.animation.ipaddress .ipaddr,
.game-body.animation.ipaddress .letter {
  position: absolute;
  width: 150px;
  pointer-events: none;
  z-index: 21;
}
.game-body.animation.ipaddress .letter .title {
  width: 100%;
  font-size: 16px;
}
.game-body.animation.ipaddress .ipaddr .address,
.game-body.animation.ipaddress .letter .address {
  color: #0f8896;
  font-size: 16px;
  width: 100%;
}
.game-body.animation.ipaddress .ipaddr.rotate1,
.game-body.animation.ipaddress .letter.rotate1 {
  transform: rotate(40deg);
}
.game-body.animation.ipaddress .ipaddr.rotate2,
.game-body.animation.ipaddress .letter.rotate2 {
  transform: rotate(-20deg);
}

/**************************************************/
/*         __ANIMATION STACK__                    */
/**************************************************/
.game-body.animation.stack {
  position: relative;
}
.game-body.animation.stack .presentation {
  height: 900px;
}
.game-body.animation.stack .presentation,
.game-body.animation.stack .presentation .frame {
  transition: all 0.4s linear;
}
.game-body.animation.stack .main-block {
  position: relative;
}
.game-body.animation.stack .message {
  position: relative;
  width: 450px;
  min-height: 126px;
  font-size: 18px;
  padding: 30px;
  background-color: #fff;
  z-index: 100;
  text-align: justify;
  margin: 5px 0;
}
.game-body.animation.stack .message.tbl {
  width: 700px;
}
.game-body.animation.stack .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.game-body.animation.stack .number {
  position: absolute;
  top: -5px;
  left: -5px;
}
.game-body.animation.stack .icon {
  position: absolute;
  right: 60px;
  bottom: -70px;
}
.game-body.animation.stack .step {
  position: relative;
  width: 430px;
  height: 230px;
  background-color: #fff;
}
.game-body.animation.stack .bind {
  width: 190px;
  height: 100%;
}
.game-body.animation.stack .title {
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
}
.game-body.animation.stack .row {
  margin: 20px;
}
.game-body.animation.stack svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 20;
}
.game-body.animation.stack strong {
  font-weight: bold !important;
}
.game-body.animation.stack .message table {
  border: 2px solid #000;
  border-radius: 10px;
  border-collapse: collapse;
  display: block;
}
.game-body.animation.stack .message table caption,
.game-body.animation.stack .message table tr th {
  font-weight: bold;
  border: 1px solid #000;
  min-width: 200px;
}
.game-body.animation.stack .message table tr td,
.game-body.animation.stack .message table tr th {
  padding: 10px 6px;
  border: 1px solid #000;
}

/**************************************************/
/*         __ANIMATION BOOK__                     */
/**************************************************/
.game-body.animation.book {
  position: relative;
}
.game-body.animation.book .presentation {
  height: 650px;
}
.game-body.animation.book .presentation,
.game-body.animation.book .presentation .frame {
  transition: all 0.4s linear;
}
.game-body.animation.book .main-block {
  position: relative;
  margin: 0px auto;
  width: 1100px;
}

.game-body.animation.book .line {
  position: relative;
  width: 100%;
  font-size: 20px;
  color: #4b8fc4;
}
.game-body.animation.book hr {
  width: 100%;
  color: #7cbedd;
  background-color: #7cbedd;
  height: 2px;
  border: 1px solid !important;
}
.game-body.animation.book .package {
  position: absolute;
}
.game-body.animation.book .package > div {
  width: 104px;
  height: 54px;
  border-radius: 6px;
  background: linear-gradient(to top, #efd43f, #fdde75) no-repeat scroll;
  font-size: 14px;
  border: 1px solid #c89314;
  font-weight: bold;
  text-align: center;
  line-height: 54px;
  padding-left: 6px;
}
.game-body.animation.book .info {
  font-size: 22px;
}
.game-body.animation.book strong {
  font-weight: bold;
}
.game-body.animation.book .row:first-child {
  position: absolute;
  left: 0;
  top: 230px;
}
.game-body.animation.book .row {
  text-align: center;
}
.game-body.animation.book .t-block {
  position: absolute;
}
.game-body.animation.book .q-msg {
  position: absolute;
  font-size: 23px;
}

/**************************************************/
/*         __TRAINER OFFICE__                     */
/**************************************************/
.game-body.trainer.office .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-body.trainer.office {
  position: relative;
  height: 782px;
}
.game-body.trainer.office .main-block {
  position: relative;
  width: 1140px;
  height: 782px;
}
.game-body.trainer.office .storage,
.game-body.trainer.office .room {
  background-color: #fff;
}
.game-body.trainer.office .room {
  position: relative;
  box-shadow: -18px 7px 26px #ccc inset;
}
.game-body.trainer.office .storage {
  width: 30%;
  height: 100%;
}
.game-body.trainer.office .row {
  margin: 40px 0px;
}
.game-body.trainer.office .equipment,
.game-body.trainer.office .furniture {
  position: relative;
}
.game-body.trainer.office .furniture {
  margin: 0 20px;
}
.game-body.trainer.office .jack {
  z-index: 9;
  cursor: pointer;
  position: absolute;
  top: -86px;
  left: 184px;
  visibility: hidden;
}
.game-body.trainer.office .equipment {
  margin: 40px 0;
  width: 100%;
  text-align: center;
}
.game-body.trainer.office .line {
  font-size: 18px;
  line-height: 42px;
}
.game-body.trainer.office .count {
  float: right;
  width: 36px;
  height: 36px;
  margin-right: 10px;
  background: url(/games/v2/games/trainer/office/img/num_bg.png) no-repeat scroll 50% 50%;
  font-size: 21px;
  color: #fff;
  text-shadow: 1px 1px 1px #ccc;
  line-height: 32px;
}
.game-body.trainer.office .canvas_over {
  height: 100%;
}

/**************************************************/
/*         __GAME WI-FI__                         */
/**************************************************/
.game-body.game.wi_fi .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-body.game.wi_fi .main-block {
  position: relative;
  width: 1140px;
  height: 900px;
}
.game-body.game.wi_fi .main-block > div.bg,
.game-body.game.wi_fi .main-block img.map,
.game-body.game.wi_fi .main-block img.bg {
  height: 100%;
}
.game-body.game.wi_fi .main-block > div.bg {
  width: 100%;
}
.game-body.game.wi_fi .main-block canvas,
.game-body.game.wi_fi .main-block img.map,
.game-body.game.wi_fi .main-block img.bg {
  position: absolute;
  left: 50%;
  top: 0px;
  transform: translateX(-50%);
}
.game-body.game.wi_fi .main-block img.map {
  opacity: 0;
}
.game-body.game.wi_fi .main-block > div.man,
.game-body.game.wi_fi .main-block img.shadow,
.game-body.game.wi_fi .main-block img.man {
  position: absolute;
}
.game-body.game.wi_fi .main-block img.shadow {
  top: 6px;
  left: -3px;
}
.game-body.game.wi_fi .main-block img.man {
  top: 0px;
  left: 0px;
}
.game-body.game.wi_fi .main-block > div.man {
  top: 110px;
  left: 160px;
  width: 26px;
  height: 26px;
}
.game-body.game.wi_fi .main-block div.sq {
  position: absolute;
  background-color: rgba(255, 0, 0, 0.5);
  transform: translateX(-50%) translateY(-50%);
  border-radius: 50%;
  opacity: 0;
}
.game-body.game.wi_fi .main-block img.start,
.game-body.game.wi_fi .main-block img.finish {
  position: absolute;
}
.game-body.game.wi_fi .main-block img.start {
  top: 100px;
  left: 150px;
}
.game-body.game.wi_fi .main-block img.finish {
  top: 820px;
  left: 840px;
}
.game-body.game.wi_fi .main-block .mrk {
  position: absolute;
  width: 4px;
  height: 4px;
  background-color: red;
}
.game-body.game.wi_fi .main-block canvas {
  opacity: 0;
}
.game-body.game.wi_fi .main-block .tooltip {
  position: absolute;
  width: 100px;
  height: 25px;
  font-size: 13px;
  top: -34px;
  left: 5px;
  background-color: #fefefe;
  border-radius: 10px;
}

.game-body.game.wi_fi .main-block .tooltip .indicator {
  height: 100%;
}
.game-body.game.wi_fi .main-block .tooltip .indicator > div {
  width: 4px;
  height: 90%;
  margin: 3px 1px;
  opacity: 1;
  background-color: #a9a9a9;
}
.game-body.game.wi_fi .main-block .tooltip .indicator > div:nth-child(1) {
  height: 20%;
}
.game-body.game.wi_fi .main-block .tooltip .indicator > div:nth-child(2) {
  height: 35%;
}
.game-body.game.wi_fi .main-block .tooltip .indicator > div:nth-child(3) {
  height: 50%;
}
.game-body.game.wi_fi .main-block .tooltip .indicator > div:nth-child(4) {
  height: 65%;
}
.game-body.game.wi_fi .main-block .last-point {
  position: absolute;
  left: 200px;
  top: 200px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: radial-gradient(rgba(255, 255, 255, 0), rgba(255, 0, 0, 0.5)) no-repeat scroll 50% 50%;
  transform: translateX(-50%) translateY(-50%);

  -webkit-animation: pulsar 1.4s ease infinite; /* cubic-bezier(.08,.82,.57,1);*/
  animation: pulsar 1.4s ease infinite; /* cubic-bezier(.08,.82,.57,1);*/
}
@-webkit-keyframes pulsar {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes pulsar {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/**************************************************/
/*         __GAME UPDATE__                        */
/**************************************************/
.game-body.game.update .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-body.game.update .main-block {
  position: relative;
  width: 1140px;
  height: 700px;
  margin-bottom: 100px;
}
.game-body.game.update .main-block > div > img:last-child {
  margin-right: 92px;
}
.game-body.game.update .main-block .house {
  position: relative;
  width: 912px;
  height: 368px;
}
.game-body.game.update .main-block .house-wrap {
  position: absolute;
  width: 912px;
  height: 368px;
  bottom: -40px;
  left: 50%;
  transform: translateX(-55%);
}

.game-body.game.update .main-block .window-b {
  position: absolute;
  width: 78px;
  height: 107px;
}
.game-body.game.update .main-block .window-d {
  position: absolute;
  width: 111px;
  height: 158px;
}
.game-body.game.update .main-block .window-s {
  position: absolute;
  width: 111px;
  height: 259px;
  z-index: 10;
}
.game-body.game.update .main-block .window-m {
  position: absolute;
  width: 63px;
  height: 109px;
  z-index: 15;
}

.game-body.game.update .main-block .window-b-s {
  position: absolute;
  width: 75px;
  height: 52px;
}
.game-body.game.update .main-block .window-m > div > img,
.game-body.game.update .main-block .window-d > img,
.game-body.game.update .main-block .window-b-s > img,
.game-body.game.update .main-block .window-b > img {
  position: absolute;
  left: 0;
  top: 0;
}
.game-body.game.update .main-block .window-d > img:nth-child(1),
.game-body.game.update .main-block .window-b-s > img:nth-child(1),
.game-body.game.update .main-block .window-b > img:nth-child(1) {
  z-index: 5;
}
.game-body.game.update .main-block .window-d > img:nth-child(2),
.game-body.game.update .main-block .window-b-s > img:nth-child(2),
.game-body.game.update .main-block .window-b > img:nth-child(2) {
  z-index: 10;
  visibility: hidden;
}

.game-body.game.update .main-block #w11 {
  /*left: 107px;*/
  left: 62px;
  top: 198px;
}
.game-body.game.update .main-block #w12 {
  /*left: 313px;*/
  left: 280px;
  top: 198px;
}
.game-body.game.update .main-block #w13 {
  /*left: 500px;*/
  left: 478px;
  top: 198px;
}
.game-body.game.update .main-block #w14 {
  /*left: 640px;*/
  left: 595px;
  top: 198px;
}
.game-body.game.update .main-block #w21 {
  /*left: 208px;*/
  left: 170px;
  top: 76px;
}
.game-body.game.update .main-block #d1 {
  /*left: 200px;*/
  left: 158px;
  top: 199px;
}
.game-body.game.update .main-block #d2 {
  /*left: 756px;*/
  left: 750px;
  top: 198px;
}
.game-body.game.update .main-block #s1 {
  /*left: 456px;*/
  left: 411px;
  top: 116px;
}
.game-body.game.update .main-block .hole {
  position: absolute;
  width: 73px;
  height: 13px;
  border-radius: 50%;
  background-color: #000;

  left: 400px;
  top: 486px;
}

.game-body.game.update .main-block #man {
  left: 417px;
  top: 260px;
}
/**************************************************/
/*         __TRAINER MAP__                        */
/**************************************************/
.game-body.trainer.map .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-body.trainer.map .main-block {
  position: relative;
  width: 1140px;
}
.game-body.trainer.map .main-block .time {
  width: 150px;
  height: 60px;
  border: 4px solid #fff;
  background: linear-gradient(to top, #0c0c0c 0%, #858585 70%, #4d4d4d 100%) no-repeat scroll;
  color: #fff;
  font-size: 33px;
  font-family: Conv_Archive;
  font-weight: normal;
  text-align: center;
  line-height: 60px;
}

.game-body.trainer.map .main-block .top-domain {
  width: 140px;
  height: 80px;
  background-color: #fff;
  border: 2px solid transparent;
}
.game-body.trainer.map .main-block .top-domain:hover {
  border: 2px solid #ff4040;
}
.game-body.trainer.map .main-block .title {
  font-size: 16px;
  text-align: center;
  margin: 10px 0;
}
.game-body.trainer.map .main-block .map {
  width: 660px;
  height: 380px;
  border: 10px solid #fff;
  position: relative;
  overflow: hidden;
  background: linear-gradient(60deg, #00f 0%, #00f 50%, #aaf 50%, #aaf 100%) no-repeat scroll;
}
.game-body.trainer.map .main-block .col {
  width: 150px;
}
.game-body.trainer.map .main-block .tld {
  font-size: 36px;
  height: 60px;
  /*transition: all 1s linear;*/
  width: 1000px;
  overflow: hidden;
}
.game-body.trainer.map .main-block .tld > div {
  margin: 5px 10px;
  width: 60px;
  transition: all 0.8s linear 0s;
  display: inline-block;
  /*overflow: hidden;*/
}
.game-body.trainer.map .main-block .row {
  margin: 20px 0;
}
.game-body.trainer.map .main-block svg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 657px;
  left: 1300px;
  transform: scaleY(4.6) scaleX(5.2);
}
.game-body.trainer.map .main-block svg > path {
}

/**************************************************/
/*         __FILLWORD SKYPE__                        */
/**************************************************/
.game-body.fillword .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-body.fillword .main-block {
  position: relative;
  width: 1140px;
}
.game-main .fillword .question-wrap {
  height: 240px;
}
.game-main .fillword .question {
  width: 300px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 16px;
  background-color: #fff;
  margin: 4px;
  cursor: pointer;
}
.game-main .how_pc_200 .question {
  width: 360px !important;
}
.game-main .fillword .question span {
  display: inline-block;
  width: 22px;
  height: 22px;
  line-height: 22px;
  font-size: 12px;
  font-family: Conv_Junegull;
  font-style: normal;
  font-weight: normal;
}
.game-main .fillword .info {
  width: 600px;
  height: 42px;
  background-color: #fff;
  padding: 20px;
  margin: 10px;
}
.game-main .fillword .question.select {
  color: #fff;
  background-color: #0e68b1;
}
.game-main .fillword .field {
  position: relative;
  width: 400px;
  height: auto;
}

.game-main .fillword .field svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.game-main .fillword .key-word {
  height: 45px;
}
.game-main .fillword .question span,
.game-main .fillword .key-word span,
.game-main .fillword .field .letter {
  border-radius: 6px;
  text-align: center;
  margin: 1px;
  color: #fff;
  background-color: #808080;
  cursor: pointer;
  box-sizing: border-box;
}
.game-main .fillword .key-word span,
.game-main .fillword .field .letter {
  width: 38px;
  height: 38px;
  line-height: 38px;
  font-size: 20px;
}
.game-main .fillword .question span,
.game-main .fillword .key-word span,
.game-main .fillword .field .letter.fixed,
.game-main .fillword .field .letter.select {
  color: #fff;
  background-color: #1db04f;
}
.game-main .fillword .key-word span,
.game-main .fillword .field .letter.fixed {
  cursor: default;
}

.game-main .fillword .field .letter.error {
  background-color: #d74343 !important;
  border: 0px solid transparent !important;
}

/*******************************************/
/*            FORTUNE                      */
/*******************************************/
.game-main .fortune .game-container {
  font-size: 16px;
  align-content: flex-start;
  overflow: hidden;
  box-shadow: none;
}
.game-body.fortune .main-block {
  position: relative;
  width: 1140px;
}
.game-main .fortune .game-container > .row:not(:first-child) {
  margin-top: 40px;
}

.cryptography_500 .letter {
    margin: 2px !important;
}

.cryptography_500 .letter .correct {
    background-color: forestgreen !important;
    color: white !important;
}

.game-main .cryptography_400 .game-container > .row:not(:first-child), .game-main .cryptography_500 .game-container > .row:not(:first-child) {
  margin-top: 20px !important;
}
.game-main .fortune .question-wrap {
  height: 240px;
}
.game-main .cryptography_400 .question-wrap, .game-main .cryptography_500 .question-wrap {
  height: auto !important;
}
.game-main .fortune .question {
  width: 698px;
  height: 166px;
  background-color: #fff;
  margin: 37px 0px;
  padding: 0 40px;
}
.game-main .cryptography_400 .question, .game-main .cryptography_500 .question {
  font-family: Conv_Junegull !important;
  font-weight: 100 !important;
  height: auto !important;
  margin: 20px 0px !important;
  padding: 20px 40px !important;
}
.game-main .fortune .cell.letter {
  background-color: #e5e5e5;
  border: 1px solid #c9c9c9;
}
.game-main .fortune .life {
  font-size: 11px;
  text-transform: uppercase;
  color: #bababa;
  line-height: 10px;
}
.game-main .fortune .life span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #ccc;
  margin: 0 5px;
}
.game-main .fortune .life span.active {
  background-color: #1b9e59;
}
.cryptography_500{
    width: 1210px !important;
}
.cryptography_500 .task_1 #w_4, .cryptography_500 .task_1 #w_8, .cryptography_500 .task_1 #w_14,  .cryptography_500 .task_1 #w_22, .cryptography_500 .task_2 #w_5, .cryptography_500 .task_2 #w_6, .cryptography_500 .task_2 #w_9, .cryptography_500 .task_2 #w_20,
.cryptography_500 .task_3 #w_5,
.cryptography_500 .task_3 #w_6,
.cryptography_500 .task_3 #w_12,
.cryptography_500 .task_3 #w_18,
.cryptography_500 .task_3 #w_23,
.cryptography_500 .task_3 #w_26,
.cryptography_500 .task_4 #w_9,
.cryptography_500 .task_4 #w_16,
.cryptography_500 .task_4 #w_23,
.cryptography_500 .task_4 #w_29,
.cryptography_500 .task_4 #w_32,
.cryptography_500 .task_4 #w_35,
.cryptography_500 .task_4 #w_37,
.cryptography_500 .task_4 #w_38,
.cryptography_500 .task_4 #w_45 {
    margin: 2px 16px 2px 2px !important;
}
.cryptography_500 .task_6 #w_7,
.cryptography_500 .task_6 #w_8,
.cryptography_500 .task_6 #w_18,
.cryptography_500 .task_6 #w_19,
.cryptography_500 .task_6 #w_23 {
    margin: 2px 12px 2px 2px !important;
}

/*******************************************/
/*            CROSSWORD                    */
/*******************************************/
.game-main .crossword .game-container > div {
  overflow: hidden;
  box-shadow: none;
}
.game-body .crossword .main-block {
  position: relative;
  width: 1140px;
}
.game-main .crossword .cell.letterset {
  cursor: pointer;
  cursor: -webkit-grab;
}
.game-main .crossword .cell.letter.begin .num-h,
.game-main .crossword .cell.letter.begin .num-v {
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #0e68b1;
  color: #fff;
  line-height: 30px;
  text-align: center;
  font-size: 17px;
  cursor: pointer;
  z-index: 1;
}
.game-main .crossword .cell.letter.begin .num-h {
  top: -8px;
  left: -26px;
}
.game-main .crossword .cell.letter.begin .num-v {
  top: -26px;
  left: 8px;
}
.game-main .crossword .cell.entered {
  border: 1px solid #0096f0;
  box-sizing: border-box;
}
.game-main .crossword .cell.entered.active {
  animation-name: blick;
  animation-duration: 0.5s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: linear;
}
@keyframes blick {
  0% {
    border: 2px solid #fff;
  }
  100% {
    border: 2px solid #09f;
  }
}

/*******************************************/
/*            DRAG                         */
/*******************************************/
.game-main .drag .grab {
  cursor: pointer;
  cursor: -webkit-grab;
}
.game-main .drag .click {
  cursor: pointer;
}
.game-main .drag .word {
  padding: 10px 20px;
}
.game-main .drag .word.selected {
  color: #1b9e59;
  background-color: transparent !important;
}
.game-main .drag .description-wrap {
  width: 1046px;
  padding-bottom: 6px;
}
.game-main .drag .description {
  width: 320px;
  height: 132px;
  margin-top: 20px;
}
.game-main .drag .block-word {
  height: 30px;
  background-color: #fff;
  margin-bottom: 8px;
}



/*******************************************/
/*            PROTOCOL                    */
/*******************************************/
.game-main .protocol .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-body .protocol .main-block {
  position: relative;
  width: 1140px;
}
.game-main .protocol .block-word {
  width: 90px;
  height: 70px;
  margin: 0 2px;
}
.game-main .protocol .bottom-block {
  width: 700px;
}
.game-main .protocol .description-wrap {
  width: auto;
  height: auto;
  margin: 5px 0;
}
.game-main .protocol .description {
  width: 180px;
  height: 50px;
  background-color: #146cb3;
  color: #fff;
  padding: 10px;
  text-align: center;
  margin: 0 10px 0 0;
}

/*******************************************/
/*            MILLIONER                    */
/*******************************************/
.game-body .millioner .main-block {
  position: relative;
  width: 1140px;
}
.game-main .millioner .answer {
  height: 30px;
  margin-bottom: 10px;
  cursor: pointer;
}
.game-main .millioner .answer,
.game-main .millioner .answer-row {
  width: 280px;
}
.game-main .millioner .answer-wrap {
  width: 630px;
}

/*******************************************/
/*            MILLIONER                    */
/*******************************************/
.game-body .abbreviation .main-block {
  position: relative;
  width: 1140px;
}
.game-main .abbreviation .block-word {
  width: 1000px;
  padding: 0 20px;
}
.game-main .abbreviation .block-word span {
  width: 60px;
  line-height: 30px;
}

.game-main .abbreviation .bottom-block {
    margin-top: 0px !important;
}

/*******************************************/
/*            PERSONAL DATA                */
/*******************************************/
.game-body.personaldata .main-block {
  position: relative;
  width: 1140px;
}
.game-body.personaldata .game-container > div {
  height: 782px;
}
.game-body.personaldata .field {
  height: 70%;
}
.game-body.personaldata .folders {
  height: 30%;
  margin-top: -20px;
}
.game-body.personaldata .h-block {
  width: 100%;
}
.game-body.personaldata .category {
  position: relative;
  height: 276px;
  margin-top: -48px;
  background: transparent url("/games/v2/games/animation/personaldata/img/folder.png") no-repeat scroll 50% 50%;
}
.game-body.personaldata .category.full {
  background: transparent url("/games/v2/games/animation/personaldata/img/full-folder.png") no-repeat scroll 50% 50%;
}
.game-body.personaldata .category .indicator {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 50%;
  height: 28px;
  margin-left: 25%;
}
.game-body.personaldata .category .indicator .ok,
.game-body.personaldata .category .indicator .error {
  display: inline-block;
  width: 28px;
  height: 28px;
}
.game-body.personaldata .category .indicator .ok {
  background: transparent url("/games/v2/games/animation/personaldata/img/ok.png") no-repeat scroll 50% 50% !important;
}
.game-body.personaldata .category .indicator .error {
  background: transparent url("/games/v2/games/animation/personaldata/img/error.png") no-repeat scroll 50% 50% !important;
}
.game-body.personaldata .category span.title {
  height: 18px;
  margin-top: 104px;
  font-size: 18px;
  color: #000;
}
.game-body.personaldata .category span {
  width: 100%;
  height: 90px;
  text-align: center;
  font-size: 16px;
  color: #7b7b7b;
}

.game-body.personaldata .game-field {
  position: relative;
}
.game-body.personaldata .card {
  position: absolute;
  top: 0;
  left: calc(50% - 102px);
  width: 220px;
  height: 204px;
  background: transparent url("/games/v2/games/animation/personaldata/img/card.png") no-repeat scroll 50% 50%;

  /* transform: rotate(0deg); */
  /* animation-duration: 8s; */
  /* animation-iteration-count: infinite; */
  /*animation-direction: alternate;*/
  /* animation-timing-function: linear;
  animation-name: cardrotate; */
}
.game-body.personaldata .card span {
  width: 50%;
  height: 40%;
  text-align: center;
  font-size: 16px;
  color: #000;
  display: inline-block;
  margin: 20% 25%;
}
/* @keyframes cardrotate {
  0% {
    transform: rotate(0deg);
  }
  25%  {transform: rotate(120deg);}
  50%  {transform: rotate(240deg);}
  100% {
    transform: rotate(360deg);
  }
} */
.mark {
  position: absolute;
  width: 1px;
  height: 100px;
  background-color: red;
  top: 50%;
}
.game-body.personaldata .message {
  position: relative;
  width: 60%;
  padding: 32px;
  background-color: rgb(247, 247, 247);
  margin-top: 10px;
}
.game-body.personaldata .message button {
  position: absolute;
  right: 20px;
  bottom: -14px;
}
.game-body.personaldata .message-v-center {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
/*.game-body.personaldata .info {
	width: 80%;
	margin: 20px;
	position: relative;
	background-color: #fff;
	padding: 20px;
}
.game-body.personaldata .info button {
	position: absolute;
	right: 20px;
	bottom: -14px;
}
*/
/*******************************************/
/*            PD_GUARD, TRICK, PERSONAL    */
/*******************************************/
.game-body.personal .main-block,
.game-body.trick .main-block,
.game-body.pd_guard .main-block {
  position: relative;
  width: 1140px;
}
.game-body.personal .top-block,
.game-body.trick .top-block {
  height: auto;
  min-height: 200px;
}
.game-body.personal .answer-row {
  position: relative;
  height: 96px;
  width: 71px;
  cursor: pointer;
  margin: 0 35px;
}
.game-body.trick .answer,
.game-body.pd_guard .answer {
  position: relative;
  display: block !important;
  height: 30px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 18px;
  padding: 5px;
}
.game-body.trick .answer,
.game-body.trick .answer-row {
  width: 600px;
  height: auto;
}
.game-body.pd_guard .answer,
.game-body.pd_guard .answer-row {
  width: 350px;
}
.game-body.personal .answer-wrap,
.game-body.trick .answer-wrap,
.game-body.pd_guard .answer-wrap {
  width: 650px;
}

.game-body.personal .block-shadow-round:not(.info):not(.description),
.game-body.trick .block-shadow-round:not(.info):not(.description),
.game-body.pd_guard .block-shadow-round:not(.info):not(.description) {
  box-shadow: none;
  background-color: transparent;
}
.game-body.personal .error,
.game-body.personal .selected,
.game-body.trick .error,
.game-body.trick .selected,
.game-body.pd_guard .error,
.game-body.pd_guard .selected {
  position: relative;
  background-color: transparent;
  color: #000;
}
.game-body.trick .answer:before,
.game-body.pd_guard .answer:before {
  content: "";
  position: absolute;
  /*top: 50%;
	transform: translateY(-50%);*/
  top: 5px;
  left: -30px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: solid 2px #9b9b9b;
  color: #fff;
  background-color: #c4c4c4 !important;
}
.game-body.trick .error:before,
.game-body.pd_guard .error:before {
  background-color: #fe0101 !important;
}
.game-body.trick .selected:before,
.game-body.pd_guard .selected:before {
  background-color: #1b9e59 !important;
}
.game-body.pd_guard .q-text {
  color: #210896;
  text-decoration: underline;
  text-transform: lowercase;
  font-size: 20px;
}
.game-body.pd_guard .head {
  color: #000;
  text-transform: none;
  text-decoration: none !important;
  font-weight: normal;
  display: block;
  width: 100%;
  text-align: center;
  font-size: 20px;
}
.game-body.trick .description,
.game-body.pd_guard .description {
  position: relative;
  padding: 54px;
  margin-top: 0px;
  width: 932px;
  background-color: #fff;
}
.game-body.trick .q-text {
  width: 95%;
  font-size: 20px;
}
.game-body.trick .l-head {
  font-size: 20px;
  margin-top: 6px;
}
.game-body.trick .l-body {
  font-size: 16px;
  width: 50%;
  text-align: left;
  margin: 0px auto;
  padding-top: 20px;
}
.game-body.trick .l-a {
  color: #210896;
  text-decoration: underline;
  text-transform: lowercase;
  font-size: 16px;
}
.game-body.trick .description button {
  position: absolute;
  right: 20px;
  bottom: -14px;
}

.game-body.personal .answer:before {
  position: absolute;
  content: "";
  bottom: -29px;
  left: 50%;
  transform: translateX(-50%);
  width: 31px;
  height: 29px;
}
.game-body.personal .answer.selected:before {
  background: transparent url(/games/v2/games/select/personal/img/ok.png) no-repeat scroll;
}
.game-body.personal .answer.error:before {
  background: transparent url(/games/v2/games/select/personal/img/error.png) no-repeat scroll;
}
.game-body.trick .info,
.game-body.pd_guard .info,
.game-body.personal .info {
  width: 80%;
  margin: 20px;
  position: relative;
  background-color: #fff;
  padding: 20px;
}
.game-body.trick .info button,
.game-body.pd_guard .info button,
.game-body.personal .info button {
  position: absolute;
  right: 20px;
  bottom: -14px;
}

/**************************************************/
/*         __GAME OPERATOR_PD                     */
/**************************************************/
.game-body.game.operator_pd .game-container {
  overflow: hidden;
  box-shadow: none;
}
.game-main .game-body.operator_pd,
.game-body.operator_pd .main-block {
  position: relative;
  width: 1466px;
  height: 906px;
}
.game-body.game.operator_pd .main-block > div.bg,
.game-body.game.operator_pd .main-block img.map,
.game-body.game.operator_pd .main-block img.bg {
  height: 100%;
}
.game-body.game.operator_pd .main-block > div.bg {
  width: 100%;
}
.game-body.game.operator_pd .main-block canvas,
.game-body.game.operator_pd .main-block img.map,
.game-body.game.operator_pd .main-block img.bg {
  position: absolute;
  left: 50%;
  top: 0px;
  transform: translateX(-50%);
}
.game-body.game.operator_pd .main-block img.map {
  opacity: 0;
}
.game-body.game.operator_pd .main-block canvas {
  opacity: 0;
}
.game-body.game.operator_pd .main-block img.man {
  top: 0px;
  left: 0px;
}
.game-body.game.operator_pd .main-block > div.man {
  position: absolute;
  top: 282px;
  left: 260px;
  width: 19px;
  height: 66px;
  z-index: 10;
}
.game-body.game.operator_pd .main-block div.sq {
  position: absolute;
  background-color: rgba(255, 0, 0, 0.5);
  transform: translateX(-50%) translateY(-50%);
  border-radius: 50%;
  /*opacity: 0;*/
}
#m_man {
  position: absolute;
  background-color: red;
}
.game-body.game.operator_pd .tooltip {
  position: absolute;
  width: 410px;
  height: auto;
  background-color: #1b9e59;
  padding: 20px;
  color: #fff;
  text-align: justify;
}
.game-body.game.operator_pd .tooltip:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  top: 100%;
  left: 40px;
  border-top: 100px solid #1b9e59;
  border-left: 20px solid transparent;
  transform: skew(20deg, 0deg);
  box-shadow: 3px -1px 2px rgba(0, 0, 0, 0.16);
}
.game-body.game.operator_pd .tooltip.error:before {
  border-top: 100px solid #f86666;
}
.game-body.game.operator_pd .tooltip.passport {
  top: 130px;
  left: 400px;
}
.game-body.game.operator_pd .tooltip.garden {
  top: 144px;
  left: 670px;
}
.game-body.game.operator_pd .tooltip.school {
  top: 10px;
  left: 616px;
}
.game-body.game.operator_pd .tooltip.hospital {
  top: 112px;
  left: 1044px;
  width: 380px;
}
.game-body.game.operator_pd .tooltip.rectal {
  top: 448px;
  left: 816px;
}
.game-body.game.operator_pd .tooltip.gas {
  top: 44px;
  left: 120px;
}
.game-body.game.operator_pd .tooltip.park {
  top: 300px;
  left: 565px;
}
.game-body.game.operator_pd .tooltip.shop {
  top: 302px;
  left: 954px;
}
.game-body.game.operator_pd .tooltip.stadium {
  top: 484px;
  left: 384px;
}
.game-body.game.operator_pd .info {
  width: 80%;
  margin: 5px auto;
  position: relative;
  background-color: #f7f7f7;
  padding: 20px;
  font-family: Arial, sans-serif;
}
.game-body.game.operator_pd .info button {
  position: absolute;
  right: 20px;
  bottom: -14px;
}
.info-stand-alone,
.game-body.game.operator_pd .info.stand-alone {
  width: 700px;
  margin: 0;
  text-align: center;
  line-height: 2em;
  padding: 60px;
  font-size: 21px;
  background-color: rgba(216, 216, 216, 0.5);
}

.i36g300 .game-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 600px !important;
    padding-bottom: 50px;
}

.i36g300 .info {
    max-width: 700px;
    padding: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    color: black;
    background-color: #FFF;
    margin: 50px 0;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
    font-style: italic;
}

.i36g300 .info .next {
    margin-top: 50px;
}

.i36g300 .info ol, .i36g300 .info ul {
    width: 100%;
    list-style: auto !important;
    padding-left: 30px;
}

.i36g300 .info li {
    font-size: 18px;
    margin-bottom: 10px;
}

.i36g300 .info h2 {
    width: 100%;
    margin-bottom: 10px;
}

.i36g300 .info h3 {
    width: 100%;
}

.i36g300 .info p {
    width: 100%;
    font-size: 18px;
}

.i36g300 .box-title {
    margin-top: 40px;
}

.i36g300 .q-num, .i36g300 .q-head, .i36g300 .q-text {
    font-style: italic;
    text-align: center;
    max-width: 800px;
}

.i36g300 .q-num {
    font-size: 18px;
    margin-bottom: 10px;
}

.i36g300 .q-head {
    font-size: 24px;
}

.i36g300 .q-text {
    font-size: 24px;
    font-weight: 700;
    margin-top: 40px;
}

.i36g300 .answer {
    width: 100%;
    max-width: 760px;
    padding: 20px;
    height: 60px;
    color: black;
    text-align: center;
    font-size: 18px;
    background-color: #FFF;
    margin: 10px 0;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
    border: 2px solid transparent;
    cursor: pointer;
}

.i36g300 .description {
    width: 100%;
    max-width: 700px;
    padding: 50px;
    color: black;
    text-align: center;
    font-size: 24px;
    background-color: #E5F9F0;
    margin: 20px 0px 0px 0px;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
}

.i36g300 .selected {
    border: 2px solid #1b9e59 !important;
}
.i36g300 .error {
    color: black;
    border: 2px solid #f86666 !important;
}

.i36g300 .btn-margin {
    margin-top: 50px;
}

.i36g300 .btn-margin.inactive, .i36g300 .description.inactive {
    display: none !important;
}

/**************************************************/
/*         __ANIMATION COMMON__                   */
/**************************************************/
.p-block-info {
  padding: 10px 40px;
  min-height: 83px;
  width: 80%;
  background-color: #fff;
  margin-top: 5px;
  font-size: 20px;
}
.p-block-info:first-child {
  margin-top: 25px;
}
.t-green {
  color: #1db04f;
}
.t-red {
  color: #d74343;
}
.t-orange {
  color: #f2742b;
}
/**************************************************/
/*         __ANIMATION ADVERT__                   */
/**************************************************/
.animation.advert {
  height: 850px;
}
/**************************************************/
/*           __DRAG GEOADVERT__                   */
/**************************************************/
.drag.geoadvert .game-container {
  height: 815px;
}
.drag.geoadvert .geoadvert-map {
  position: relative;
  width: 600px;
}
.drag.geoadvert .questions {
  margin-left: 50px;
  min-height: 600px;
  width: 319px;
}
.drag.geoadvert .questions .title {
  color: #136bb3;
  font-size: 22px;
  text-decoration: underline;
}
.drag.geoadvert .anchor .circle,
.drag.geoadvert .questions .circle {
  width: 21px;
  height: 21px;
  border-radius: 50%;
  display: inline-block;
}
.drag.geoadvert .questions .text {
  font-size: 18px;
}
.drag.geoadvert .anchor {
  display: inline-block;
  position: absolute;
}
.drag.geoadvert .anchor .circle {
  position: absolute;
  top: 13px;
  left: 13px;
}
/*.drag.geoadvert .circle.error {
	background-color: #
}*/

/**************************************************/
/*           __DRAG cryptography_200__                   */
/**************************************************/
.drag.cryptography_200 .game-container {
  height: auto;
  
}
.drag.cryptography_200 .c {
  align-items: center;
  
}
.drag.cryptography_200 .cryptography_200-map {
  position: relative;
  width: 600px;
}
.drag.cryptography_200 .anchor .circle,
.drag.cryptography_200 .questions .circle {
  display: inline-block;
}
.drag.cryptography_200 .anchor {
    display: inline-block;
    position: absolute;
    background-color: rgba(0,0,0,.03);
    border-radius: 4px;
}
.drag.cryptography_200 .anchor .circle {
  position: absolute;
}
.drag.cryptography_200 .circle {
    border-radius: 0% !important;
}
.drag.cryptography_200 #anchor_0 {
    width: 186px;
    height: 18px;
}
.drag.cryptography_200 #anchor_1 {
    width: 210px;
    height: 18px;
}
.drag.cryptography_200 #anchor_2 {
    width: 34px;
    height: 18px;
}
.drag.cryptography_200 #anchor_3 {
    width: 68px;
    height: 18px;
}
.drag.cryptography_200 #anchor_4 {
    width: 60px;
    height: 18px;
}
.drag.cryptography_200 #anchor_5 {
    width: 150px;
    height: 34px;
}
.drag.cryptography_200 #anchor_6 {
    width: 52px;
    height: 52px;
}
.drag.cryptography_200 #anchor_7 {
    width: 48px;
    height: 34px;
}
.drag.cryptography_200 #anchor_8 {
    width: 68px;
    height: 18px;
}
/*.drag.cryptography_200 .circle.error {
	background-color: #
}*/

/**************************************************/
/*           __DRAG i44g500__                   */
/**************************************************/

.drag.i44g500 .game-container {
  height: auto;
  
}
.drag.i44g500 .game-container .questions {
    min-height: 182px;
}
.drag.i44g500 .c {
  align-items: center;
  
}
.drag.i44g500 .i44g500-map {
  position: relative;
  width: 1140px;
}
.drag.i44g500 .anchor .circle,
.drag.i44g500 .questions .circle {
  display: inline-block;
}
.drag.i44g500 .anchor {
    display: inline-block;
    position: absolute;
    background-color: rgba(0,0,0,.03);
    border-radius: 4px;
}
.drag.i44g500 .anchor .circle {
  position: absolute;
}
.drag.i44g500 .circle {
    border-radius: 0% !important;
}
.drag.i44g500 [id^="anchor_"] {
    width: 42px;
    height: 54px;
}

.drag.i44g500 [id^="container_circle_"] {
    width: 42px;
    height: 54px;
}

#i44g500-text {
    gap: 30px;
    max-width: 50%;
}

/*.drag.i44g500 .circle.error {
	background-color: #
}*/
.i44g500 .ui-draggable.ui-draggable-handle {
    filter: none;
    transition: filter 50ms ease;
}

.i44g500 .ui-draggable.ui-draggable-handle:hover {
    filter: invert(85%) sepia(5%) saturate(0%) hue-rotate(0deg) brightness(95%) contrast(90%);
}

.i44g500-tooltip {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    background: white;
    border-radius: 10px;
    padding: 20px;
    z-index: 1000;
    display: none;
    opacity: 100%;
    transition: all 50ms ease;
    gap: 20px;
    align-items: center;
    box-shadow: 4px 4px 4px #ccc;
}

.i44g500-tooltip-img {
    border-radius: 10px;
    width: 200px;
    height: 140px;
}

.i44g500-tooltip-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
}

.i44g500-tooltip-title {
    font-size: 22px;
    color: #000;
    text-transform: none;
    font-style: italic !important;
    font-weight: 400 !important;
    font-family: Calibri, Conv_Calibri !important;
    -webkit-font-smoothing: antialiased;
}

.i44g500-tooltip-description {
    font-family: Calibri, Conv_Calibri;
    font-size: 16px;
    color: #727272;
    font-style: italic !important;
    font-weight: 400 !important;
}

.i45g400-tooltip {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    background: white;
    border-radius: 10px;
    padding: 20px;
    z-index: 1000;
    display: none;
    opacity: 100%;
    transition: all 50ms ease;
    gap: 20px;
    align-items: center;
    box-shadow: 4px 4px 4px #ccc;
}

.i45g400-tooltip-img {
    border-radius: 10px;
    width: 200px;
    height: 140px;
}

.i45g400-tooltip-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
}

.i45g400-tooltip-title {
    font-size: 22px;
    color: #000;
    text-transform: none;
    font-style: italic !important;
    font-weight: 400 !important;
    font-family: Calibri, Conv_Calibri !important;
    -webkit-font-smoothing: antialiased;
}

.i45g400-tooltip-description {
    font-family: Calibri, Conv_Calibri;
    font-size: 16px;
    color: #727272;
    font-style: italic !important;
    font-weight: 400 !important;
}

/**************************************************/
/*         __ANIMATION ADVERT__                   */
/**************************************************/
.animation.infores .message {
  position: relative;
  padding-top: 20px;
  padding-bottom: 20px;
}
.animation.infores .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}

/**************************************************/
/*         __ANIMATION I36G200__                   */
/**************************************************/

.animation.i36g200 .message {
  position: relative;
  padding-top: 20px;
  padding-bottom: 20px;
}
.animation.i36g200 .message button {
  position: absolute;
  bottom: -15px;
  right: 60px;
}
.i36g200 #presentation img {
  width: 100%;
}
.i36g200 #presentation h2 {
  text-align: center;
  text-transform: uppercase;
  font-size: 20px;
  margin-bottom: 40px;
}
.i36g200 #presentation .p-block-info {
    padding: 40px !important;
    min-height: 438px;
}
/**************************************************/
/*             __DRAG KINDIR__                    */
/**************************************************/
.drag.kindir .game-container {
  height: 880px;
}
.drag.kindir .block100p {
  position: relative;
}
.drag.kindir .diagram .p-block-info {
  margin-top: 25px;
}
.drag.kindir .p-block-info {
  font-size: 26px;
}
.drag.kindir .lines50 {
  width: 40%;
}
.drag.kindir .lines100 {
  width: 100%;
}
.drag.kindir .vline {
  background-color: #1db04f;
  width: 2px;
  height: 48px;
}
.drag.kindir .hline {
  background-color: #1db04f;
  width: 100%;
  height: 2px;
}
.drag.kindir span.num {
  display: inline-block;
  color: #fff;
  background-color: #1db04f;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  font-size: 30px;
  padding: 3px;
  margin-right: 10px;
}
.drag.kindir .info {
  width: 40%;
}
.drag.kindir .p-block-info-inner {
  padding: 20px;
  background-color: #fff;
  width: 40%;
  text-align: center;
  margin-bottom: 40px;
}
.drag.kindir .p-block-info-outer {
  padding: 10px 40px;
  min-height: 83px;
  width: 80%;
  background-color: transparent;
  margin-top: 5px;
  font-size: 26px;
}
.drag.kindir .questions,
.drag.kindir .answers-wrap {
  width: 100%;
  /*padding-top: 100px;*/
  padding-top: 50px;
}
.drag.kindir .answers {
  width: 100%;
}
.drag.kindir .answers > div {
  height: 310px;
  margin: 0 40px;
}
.drag.kindir .quest,
.drag.kindir .answer {
  width: 220px;
  height: 50px;
  margin: 20px;
  text-align: center;
  line-height: 50px;
  font-size: 20px;
  background-color: #fff;
  padding: 5px 10px;
}
.drag.kindir .answer .quest {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  background-color: transparent;
}
.drag.kindir .split-questions {
  padding: 0 40px;
  font-size: 20px;
}
.drag.kindir .split-questions .word {
  padding: 10px;
}
.drag.kindir .split {
  width: 80%;
}
.drag.kindir .split .split-header {
  font-size: 26px;
  margin: 30px 0;
  width: 250px;
}
.drag.kindir .split .gr-place {
  width: 250px;
  height: 62px;
  background-color: #fff;
  margin-top: 10px;
  font-size: 20px;
  line-height: 20px;
}
.drag.kindir .split > div {
  width: 75%;
}
/**************************************************/
/*             __PUZZLE CLASSIR__                 */
/**************************************************/
.puzzle.classir .game-container {
  height: 918px;
  font-family: Calibri;
}
.puzzle.classir .blc-puzzle {
  position: relative;
  text-transform: uppercase;
}
.puzzle.classir .blc-puzzle svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.puzzle.classir .blc-puzzle .l0 {
  font-size: 22px;
}
.puzzle.classir .blc-puzzle .l1 {
  font-size: 20px;
}
.puzzle.classir .blc-puzzle .l2 {
  font-size: 15px;
}
.puzzle.classir .blc-puzzle .l3 {
  font-size: 13px;
}
.puzzle.classir .blc-puzzle .b-vertical {
  position: relative;
  width: 40px;
  height: 918px;
}
.puzzle.classir .blc-puzzle .t-vertical {
  text-align: center;
  margin: 0px -20px !important;
  width: 855px;
  position: absolute;
  top: 864px;
  left: 0;
  white-space: nowrap;
  -webkit-transform: rotate(-90deg);
  -webkit-transform-origin: 20px;
  -moz-transform: rotate(-90deg);
  -moz-transform-origin: 20px;
  -ms-transform: rotate(-90deg);
  -ms-transform-origin: 20px;
  -o-transform: rotate(-90deg);
  -o-transform-origin: 20px;
  transform: rotate(-90deg);
  transform-origin: 20px;
}
.puzzle.classir .blc-puzzle .block-shadow-round {
  padding: 10px 20px;
  margin: 5px 35px;
  background-color: #fff;
  text-align: center;
}
.puzzle.classir .blc-puzzle .block-shadow-round:not(.t-vertical) {
  width: 180px;
}
.puzzle.classir .blc-puzzle .l2 .block-shadow-round {
  width: 160px;
}
.puzzle.classir .blc-puzzle .l3 .block-shadow-round {
  width: 60px;
}
.puzzle.classir .blc-puzzle .zblock {
  z-index: 10;
}
.puzzle.classir .blc-puzzle .path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: dash 4s linear forwards;
}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
.puzzle.classir div.num {
  display: inline-block;
  color: #fff;
  background-color: #1db04f;
  width: 40px;
  min-width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  font-size: 30px;
  padding: 3px;
  margin-right: 10px;
}
.puzzle.classir .info {
  width: 100%;
  margin: 0 20px;
}
.puzzle.classir .info > div:nth-child(2) {
  text-align: left;
  width: 100%;
  margin-left: 20px;
}
/**************************************************/
/*               __DRAG FATHERS__                 */
/**************************************************/
.game-main .drag.fathers .block-word {
  width: 470px;
  padding: 0 20px;
}
.game-main .drag.fathers .block-word span {
  width: 45%;
  line-height: 30px;
}
/**************************************************/
/*               __DRAG INFORES__                 */
/**************************************************/

.game-main .game-body.drag.infores {
  height: 990px;
}
.game-main .drag.infores .h-block {
  width: 50%;
}
.game-main .drag.infores .ct-block {
  width: calc(100% - 60px);
  padding: 10px 20px;
  text-align: center;
  margin: 5px 10px;
  background-color: #efefef;
  min-height: 80px;
}
.game-main .drag.infores .ct-block > .ct-block {
  width: auto;
  padding: 0;
  text-align: center;
  margin: 0;
  background-color: transparent;
  min-height: auto;
  box-shadow: none;
}
.game-main .drag.infores .selected {
  background-color: transparent !important;
  color: #1b9e59 !important;
}

/**************************************************/
/*               __DRAG I36G200__                 */
/**************************************************/

.game-main .game-body.drag.i36g200 {
  height: 990px;
}
.game-main .drag.i36g200 .h-block {
  width: 50%;
}
.game-main .drag.i36g200 .ct-block {
  position: relative;
  width: calc(100% - 84px);
  padding: 16px 32px;
  text-align: center;
  margin: 4px 10px;
  background-color: #FFF;
  min-height: 40px;
  max-width: 232px;
}
.game-main .drag.i36g200 .ct-block > .ct-block {
  width: auto;
  padding: 0;
  text-align: center;
  margin: 0;
  background-color: transparent;
  min-height: auto;
  box-shadow: none;
}
.game-main .drag.i36g200 .selected {
  background-color: transparent !important;
  color: #1b9e59 !important;
}
.i36g200 .game-container{
    padding: 30px 100px;
}
.i36g200 .error {
    background-color: #f86666 !important;
    color: #000 !important;
    height: auto !important;
}
.i36g200 .task-title {
    font-style: italic;
    font-size: 23px;
    font-weight: 500;
    margin: 4px 10px 246px 10px;
}
.i36g200 .step-number {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    color: #7A7A7A;
    text-shadow: 1px 1px 2px rgba(122, 122, 122, .5);
    text-align: start;
    font-style: normal;
}
.i36g200 #draggable_container_right, .i36g200 #draggable_container_left {
    max-width: 400px;
}
.i36g200 .table {
    display: -ms-grid;
    display: -webkit-box;
    display: -webkit-flex;
    display: grid;
    -ms-grid-columns: 80px 1fr;
    grid-template-columns: 80px 1fr;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    gap: 4px;
    -webkit-gap: 4px;
}
.i36g200 .table > div, .i36g200 .table > span {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
}

.i36g200 .presentation-table {
    width: 100%;
    display: -ms-grid;
    display: -webkit-box;
    display: -webkit-flex;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    gap: 24px;
    -webkit-gap: 24px;
}
.i36g200 .presentation-table > div {
    width: 100%;
    max-width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
}
.i36g200 .presentation-table > div > img {
    width: 100%;
    max-width: 100%;
}
.tippy-box[data-theme~='i36g200'] {
    background-color: #E9FFF3;
    color: #000;
    padding: 20px;
    border-radius: 8px;
    font-size: 16px;
    font-style: italic;
    text-align: start;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
}
.tippy-box[data-theme~='i36g200'][data-placement^='top'] > .tippy-arrow::before {
  border-top-color: #E9FFF3;
}
.tippy-box[data-theme~='i36g200'][data-placement^='bottom'] > .tippy-arrow::before {
  border-bottom-color: #E9FFF3;
}
.tippy-box[data-theme~='i36g200'][data-placement^='left'] > .tippy-arrow::before {
  border-left-color: #E9FFF3;
}
.tippy-box[data-theme~='i36g200'][data-placement^='right'] > .tippy-arrow::before {
  border-right-color: #E9FFF3;
}
/*
.i36g200 #f_1::after, .i36g200 #m_2::after, .i36g200 #m_3::after, .i36g200 #f_4::after, .i36g200 #m_5::after, .i36g200 #m_6::after, .i36g200 #m_7::after, .i36g200 #f_8::after, .i36g200 #m_9::after, .i36g200 #f_10::after {
    content: "";
    pointer-events: none;
    position: absolute;
    width: 256px;
    left: 0; 
    bottom: 66px;
    background: #E9FFF3;
    color: #000;
    padding: 20px;
    border-radius: 8px;
    font-size: 16px;
    font-style: italic;
    text-align: start;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
    opacity: 0;
    transition: .2s;
    z-index: 10;
}

.i36g200 #f_1:hover::after, .i36g200 #m_2:hover::after, .i36g200 #m_3:hover::after, .i36g200 #f_4:hover::after, .i36g200 #m_5:hover::after, .i36g200 #m_6:hover::after, .i36g200 #m_7:hover::after, .i36g200 #f_8:hover::after, .i36g200 #m_9:hover::after, .i36g200 #f_10:hover::after {
    opacity: 1;
    bottom: 76px;
}
.i36g200 #f_1::after {
    content: "Самое главное правило: не\00A0волнуйтесь, это случается со\00A0многими. Испуганный человек может натворить больше бед, чем самый зловредный вирус";
}
.i36g200 #m_2::after {
    content: "Загрузите и\00A0установите соответствующую антивирусную программу (для\00A0домашнего компьютера или\00A0для\00A0рабочей станции, если компьютер установлен в\00A0рабочую сеть)";
}
.i36g200 #m_3::after {
    content: "В\00A0процессе удаления вируса с\00A0компьютера желательно отключаться от\00A0интернета, чтобы исключить дальнейшее распространение угрозы по\00A0сети";
}
.i36g200 #f_4::after {
    content: "Инструкция для\00A0безопасной перезагрузки: 1.\00A0Выключите компьютер и\00A0включите\00A0снова 2.\00A0Когда\00A0на\00A0экране появится изображение, нажмите F8, чтобы вызвать меню «Дополнительные параметры загрузки» 3.\00A0Выберите\00A0«Безопасный режим с\00A0сетевой поддержкой» 4.\00A0Оставайтесь\00A0отключенными от\00A0интернета";
}
.i36g200 #m_5::after {
    content: "Наберите в\00A0строке поиска Windows название утилиты «Очистка диска» и\00A0далее укажите, какие временные файлы удалить. Некоторые\00A0вирусы\00A0начинают действовать при\00A0перезагрузке компьютера. Удаление временных файлов может удалить и\00A0вирус. Однако, полагаться только на\00A0это не\00A0стоит. Чтобы\00A0убедиться,\00A0что\00A0ваш компьютер свободен от\00A0вирусов, рекомендуем выполнить шаги 6-10.";
}
.i36g200 #m_6::after {
    content: "Теперь пора открыть ваш антивирус или\00A0решение класса Internet Security для\00A0рабочих станций и\00A0запустить сканирование на\00A0вирусы. Последовательно проведите полную проверку всего компьютера, оперативной памяти и\00A0всех дисков. Вирусы так\00A0же могут быть на\00A0переносных винчестерах или\00A0флешках, их\00A0так\00A0же стоит проверить";
}
.i36g200 #m_7::after {
    content: "…с\00A0помощью опции «Удалить или\00A0Поместить в\00A0каранти». А\00A0затем\00A0– еще\00A0раз запустите проверку компьютера, чтобы убедиться, что других угроз не\00A0осталось. Если нашлись другие угрозы, также поместите их в\00A0карантин или\00A0удалите";
}
.i36g200 #f_8::after {
    content: "Теперь, после удаления вируса, вы можете перезагрузить компьютер. Просто включите его, как обычно. «Безопасный режим» больше не\00A0нужен";
}
.i36g200 #m_9::after {
    content: "Чтобы защитить компьютер от\00A0дальнейших атак, поменяйте все пароли, т.к. они могут быть скомпрометированы. Это обязательно, только если у\00A0вас есть причина считать, что ваши пароли украдены вредоносной программой, но\00A0перестраховаться не\00A0мешает в\00A0любом случае";
}
.i36g200 #f_10::after {
    content: "Обновление ПО, браузера и\00A0операционной системы снизит риск эксплуатации киберпреступниками брешей в\00A0старом коде для\00A0установки вредоносных программ на\00A0вашем компьютере";
}
*/

/**************************************************/
/*               __GAME VIRUSAD__                 */
/**************************************************/
.game-main .game.virusad .game-container {
  position: relative;
}
.game-main .game.virusad .block100p {
  height: 682px;
  padding: 50px 0;
}
.game-main .game.virusad img.error {
  border: 2px solid red;
  background-color: transparent !important;
}
.game-main .game.virusad .footer,
.game-main .game.virusad .header {
  width: 80%;
  text-transform: none;
  font-size: 26px;
}
.game-main .game.virusad .header span {
  margin: 4px 10px;
}
.game-main .game.virusad .search-line {
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 1px 1px 1px #ccc;
}
.game-main .game.virusad .search-line img {
  margin: 5px;
}
.game-main .game.virusad .link div {
  text-decoration: underline;
  color: #317ebc;
  font-size: 26px;
  padding: 5px 0;
  cursor: pointer;
}
.game-main .game.virusad .link {
  width: 80%;
}
area {
  cursor: pointer;
}
.game-main .game.virusad .banners > img {
  position: absolute;
}
.game-main .game.virusad .banners {
  position: absolute;
  width: 1140px;
  height: 782px;
  top: 0;
  left: 0;
}
/**************************************************/
/*            __TASK CONTECSTAD__                 */
/**************************************************/
/*.game-main .task.contecstad .game-container {
	position: relative;
}
*/
.game-main .task.contecstad .block100p {
  height: 682px;
  padding: 50px 0;
}
.game-main .task.contecstad .footer,
.game-main .task.contecstad .header {
  width: 80%;
  text-transform: none;
  font-size: 26px;
}
.game-main .task.contecstad .header span {
  margin: 4px 10px;
}
.game-main .task.contecstad .search-line {
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 2px 2px 2px #ccc, 1px 1px 0px #ccc;
}
.game-main .task.contecstad .search-line img {
  margin: 5px;
}
.game-main .task.contecstad .response {
  position: relative;
  width: 20%;
}
.game-main .task.contecstad .response .check {
  cursor: pointer;
}
.game-main .task.contecstad .title {
  text-align: center;
  width: 60%;
  padding: 20px;
  background-color: #efefef;
}
.game-main .task.contecstad .response.sites > div {
  position: absolute;
}
.game-main .task.contecstad .response.sites img {
  position: relative;
  border: 2px solid #1db04f;
  box-shadow: 2px 2px 4px #aaa;
}
.game-main .task.contecstad .response.sites .marker {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  top: 40px;
  right: -100px;
  background-color: #ccc;
  cursor: pointer;
  z-index: 40;
}
.game-main .task.contecstad .response.sites .marker.selected {
  background-color: #1b9e59 !important;
}
.game-main .task.contecstad .response img {
  z-index: 30;
}
.game-main .task.contecstad .response.sites img {
  z-index: 10;
}
.game-main .task.contecstad .response svg {
  position: absolute;
  z-index: 20;
}

/**************************************************/
/*                __SELECT V2__                   */
/**************************************************/
.info-img {
    max-width: 100%;
    max-height: 240px;
    margin-bottom: 10px;
}
.info-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.info-text {
    text-align: center;
    font-style: italic;
}
.game-main .selectv2 .game-container {
  padding-top: 40px;
}
.game-main .selectv2 .group-head-block {
  padding: 20px;
  height: auto;
  background-color: transparent;
  box-shadow: none;
  font-size: 22px;
  color: #000000;
  width: 600px;
  text-align: center;
}
.game-main .selectv2 .question-block {
  margin: 20px auto;
  min-width: 700px;
}
.game-main .selectv2 .question-head-block {
  padding: 20px;
  height: auto;
  background-color: transparent;
  font-size: 20px;
  color: #000000;
  width: 800px;
  text-align: center;
  margin: 0 auto;
}
.game-main .selectv2 .question-text,
.game-main .selectv2 .question-comment {
  padding: 40px;
  height: auto;
  background-color: #f7f7f7;
  font-size: 20px;
  color: #000000;
  text-align: center;
  width: 100%;
}
.game-main .selectv2 .question-text {
  padding: 40px 0;
  width: 90%;
}
.game-main .selectv2 .question-comment {
  position: relative;
  margin: 0 auto;
  width: 800px;
}
.game-main .selectv2 .presentation-block button,
.game-main .selectv2 .question-comment button, #container_cryptography_400 .presentation-block button, #container_cryptography_500 .presentation-block button {
  position: absolute;
  right: 20px;
  bottom: -10px;
}
.game-main .selectv2 .answer {
  position: relative;
  padding: 20px 40px;
  text-transform: uppercase;
  cursor: pointer;
}
.game-main .selectv2 .answer.selected,
.game-main .selectv2 .answer.error {
  background-color: transparent !important;
  color: #000000;
}

.game-main .selectv2 .list .answer::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  width: 20px;
  height: 20px;
  background-color: #bbbbbb;
  border-radius: 50%;
  transform: translateX(-50%);
}
.game-main .selectv2 .list .answer.selected::after,
.game-main .selectv2 .vlist .answer.selected::after,
.game-main .selectv2 .vlist-row .answer.selected::after {
  background-color: #1b9e59 !important;
}
.game-main .selectv2 .list .answer.error::after,
.game-main .selectv2 .vlist .answer.error::after,
.game-main .selectv2 .vlist-row .answer.error::after {
  background-color: #f86666 !important;
}
.game-main .selectv2 .presentation-block, #container_cryptography_400 .presentation-block, #container_cryptography_500 .presentation-block {
  position: relative;
  width: 80%;
  padding: 40px;
  height: auto;
  background-color: #f7f7f7;
  font-size: 20px;
  color: #000000;
  margin-bottom: 10px;
}
.game-main .selectv2 .presentation-block ol, #container_cryptography_400 .presentation-block ol, #container_cryptography_500 .presentation-block ol {
  list-style: decimal;
}
.game-main .selectv2 .presentation-block ul, #container_cryptography_400 .presentation-block ul, #container_cryptography_500 .presentation-block ul {
  list-style: disc;
  margin-left: 1em;
}
.game-main .selectv2 .q-img {
  max-width: 90%;
  border: 8px solid #ffffff;
  border-radius: 8px;
  margin: 0 auto;
  padding: 1px;
}

.game-main .selectv2 .vlist {
  flex-direction: column;
  align-items: start;
  width: 60%;
  margin: 0 auto;
  margin-top: 40px;
}

.game-main .selectv2 .vlist-row {
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 60%;
  margin: 0 auto;
  margin-top: 20px;
}

.game-main .selectv2 .mod--cur {
    width: 100%;
    max-width: 100%;
    flex-wrap: wrap;
    flex-direction: row !important;
    gap: 16px;
}

.game-main .selectv2 .vlist .answer, .game-main .selectv2 .vlist-row .answer {
  text-transform: none;
}
.game-main .selectv2 .vlist .answer::after, .game-main .selectv2 .vlist-row .answer::after {
  content: "";
  position: absolute;
  left: 0px;
  top: 50%;
  width: 20px;
  height: 20px;
  background-color: #bbbbbb;
  border-radius: 50%;
  transform: translateY(-50%);
}
.game-main .selectv2 .answer-image {
  width: 400px;
  height: 300px;
  border: 8px solid #fff;
  border-radius: 8px;
  padding: 1px;
  background-size: cover;
  margin: 4px;
}

.select-v2-info {
  min-height: 300px !important;
  padding: 10px 0;
}

.game-main .selectv2.i44g400 .answer-image {
  width: 280px;
  height: auto !important;
  border: none !important;
  border-radius: 0px!important;
  padding: 0px !important;
  margin: 0px !important;
}

.game-main .selectv2.i44g400 .answer img {
    width: 100%;
    max-width: 100%;
}

.game-main .selectv2.i44g400 .q-img {
    max-height: 320px;
}
/******************
 */
.game-main .fishing .presentation .frame {
  position: relative;
}
.game-main .fishing .presentation button {
  position: absolute;
  right: 20px;
  bottom: -10px;
}

/******************************
 *  TEST
 */
.game-main .test .presentation-block,
.game-main .test .question-comment {
  position: relative;
  width: 80%;
  padding: 40px;
  height: auto;
  background-color: #f7f7f7;
  font-size: 20px;
  color: #000000;
  margin: 70px auto;
}
.game-main .test .presentation-block ol {
  list-style: decimal;
}
.game-main .test .presentation-block ul {
  list-style: disc;
}
.game-main .test .presentation-block li {
  margin: 5px 0;
}
.game-main .test .question-comment button,
.game-main .test .presentation-block button {
  position: absolute;
  right: 20px;
  bottom: -10px;
}
.game-main .test .question-text {
  position: relative;
  width: 70%;
  padding: 40px;
  height: auto;
  background-color: #f7f7f7;
  font-size: 20px;
  color: #000000;
  margin: 50px 0 20px 0;
}
.game-main .test .answer {
  position: relative;
  width: 76%;
  padding: 20px;
  font-size: 20px;
}
.game-main .test .answer input[type="checkbox"] {
  position: absolute;
  left: -50000px;
}
.game-main .test .answer input[type="checkbox"] ~ label {
  cursor: pointer;
  margin-left: 45px;
}
.game-main .test .answer input[type="checkbox"].error ~ label {
  color: #d74343;
}
.game-main .test .answer input[type="checkbox"].correct ~ label {
  color: #1b9e59;
}
.game-main .test .answer input[type="checkbox"] ~ label::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 18px;
  width: 30px;
  height: 30px;
  border: 2px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
}
.game-main .test .answer input[type="checkbox"]:checked ~ label::before {
  content: "\2714";
  color: #1db04f;
  font-size: 24px;
  font-size: 45px;
  line-height: 25px;
}

.i36g400 .game-wrapper{
    padding: 32px 64px !important;
    font-style: italic;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 45px;
    -webkit-gap: 45px;
}

.i36g400 .game-header{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    color: black;
}

.i36g400 .game-header-title{
    text-align: center;
    font-weight: 400;
}

.i36g400 .game-header-group{
    width: calc(100% - 60px);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 30px;
    -webkit-gap: 30px;
    margin-top: 45px;
}

.i36g400 .game-header-box{
    position: relative;
    width: 100%;
    max-width: calc(33% - 60px);
    border-radius: 15px;
    border: 1px solid #B3B3B1;
    background: #F7F7F7;
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.i36g400 .game-header-name{
    font-size: 18px;
}

.i36g400 .game-header-number{
    position: absolute;
    z-index: 1;
    top: -22px;
    right: -22px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 22px;
    height: 44px;
    width: 44px;
    border-radius: 100%;
    border: 1px solid #000;
    background: #fff;
    padding: 0px 2px 0px 0px;
}

.i36g400 .group-container{
    max-width: 25%;
    min-width: calc(25% - 135px);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    -webkit-gap: 15px;
}

.i36g400 .question-head{
    font-size: 18px;
    text-align: center;
}

.i36g400 .question-box{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    -webkit-gap: 15px;
}

.i36g400 .question-img{
    border-radius: 15px;
    width: 160px;
    height: 160px;
    object-fit: cover;
}

.i36g400 .question-answer-group{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    -webkit-gap: 10px;
}

.i36g400 .answer{
    background: #FFF !important;
    padding: 0px !important;
    width: 32px;
    height: 32px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    border: 1px solid transparent;
    box-shadow: 2px 2px 2px #ccc;
}
.i36g400 .answer.game-a.selected {
    background: #9BE2FE !important;
    background-color: #9BE2FE !important;
}
.i36g400 .answer.game-a.error {
    background: #f86666 !important;
    background-color: #f86666 !important;
    border: 1px solid #f86666;
}

.i36g400 .presentation-table {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    -webkit-gap: 10px;
}

.i36g400 .frame{
    font-size: 22px;
    font-style: italic;
    position: relative;
    width: 100%;
    max-width: 800px;
    border-radius: 15px;
    border: 1px solid #F5F5F5;
    background: #F7F7F7;
    padding: 30px 45px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    box-shadow: 2px 2px 2px #ccc;
}
/*******************************************/
/*  GAME DRAG ATTACK                       */
/*******************************************/
.game-main .game-body.drag.iot500 .wrap-it-attack {
  width: 690px;
}
.game-main .game-body.drag.iot500 .attack-answer .it-attack {
  margin: 0;
  width: 100%;
  background-color: transparent;
  text-align: center;
  border-radius: 0;
  box-shadow: none;
  padding: 0px;
  display: inline-block;
}
.game-main .game-body.drag.iot500 .it-attack {
  margin: 5px 10px;
  width: 80px;
  background-color: #fff;
}
.game-main .game-body.drag.iot500 .attack-answer,
.game-main .game-body.drag.iot500 .answer .title {
  margin: 5px 10px;
  width: 80%;
  padding: 10px 20px;
}
.game-main .game-body.drag.iot500 .answer .title {
  height: 49px;
  font-size: 17px;
  background-color: #fff;
  line-height: normal;
}
.game-main .game-body.drag.iot500 .attack-answer {
  background-color: #ededed;
  height: 20px;
}
.game-main .game-body.drag.iot500 .answer {
  height: 126px;
  width: 253px;
}
.crypto_200-answer {
    padding: 4px;
    width: 280px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.crypto_200-word {
    white-space: nowrap;
}
.wrap-crypto_200 {
    margin: 0;
    width: 100%;
  background-color: transparent;
  text-align: center;
  border-radius: 0;
  box-shadow: none;
  padding: 0px;
  display: inline-block;
    gap: 16px;
}

.game-main .game-body.game.iot400 .selected-block {
  -webkit-user-select: none; /* Chrome all / Safari all */
  -moz-user-select: none; /* Firefox all */
  -ms-user-select: none; /* IE 10+ */
  user-select: none; /* Likely future */
}
.game-main .game-body.game.iot400 .selected-block * {
  pointer-events: none;
}
.game-main .game-body.game.iot400 svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 1140px;
  height: 782px;
  pointer-events: none;
  z-index: 20;
}
.game-main .game-body.game.iot400 svg > * {
  cursor: pointer;
}
.game-main .game-body.fillword.iot200 .capital-letter {
  color: #f86666;
}
.game-main .game-body.fillword.iot200 .question {
  background-color: transparent;
}
.game-main .game-body.fillword.iot200 .question.select {
  background-color: #0e68b1;
}
.game-main .game-body.fillword.iot200 .question .letter {
  background-color: #d8d8d8;
  width: 30px;
  height: 30px;
  margin: 4px;
}
.game-main .fillword.iot200 .question span {
  width: 30px;
  height: 30px;
  line-height: 30px;
  font-size: 18px;
}
/*********************************/
/*      GameDev                  */
/*********************************/
.drag.gamedev100 .word-in,
.drag.gamedev100 .word {
  width: 150px;
  height: 60px;
  text-align: center;
  background: #fff;
  margin: 5px 10px;
  padding: 0 5px;
}
.drag.gamedev100 .word.title {
  flex: 0 1 73%;
  font-size: 25px;
}
.drag.gamedev100 .word-min-in,
.drag.gamedev100 .word-min {
  width: 70px;
  height: 60px;
  margin: 5px 10px;
  padding: 0;
  text-align: center;
  background: #fff;
}
.drag.gamedev100 .head {
  margin-bottom: 10px;
  padding: 20px;
}

.drag.gamedev100 .head.title {
  text-align: center;
  width: 100%;
  font-size: 25px;
  margin-bottom: 0;
}
.drag.gamedev100 .word-min {
  padding: 20px;
  width: 30px;
  height: 20px;
}
.drag.gamedev100 .word-in .word,
.drag.gamedev100 .word-in .word-min,
.drag.gamedev100 .word-min-in .word,
.drag.gamedev100 .word-min-in .word-min {
  margin: 0;
  width: 100%;
}
.drag.gamedev100 .word-in {
  width: 160px;
  padding: 0;
}

.drag.gamedev400 .word-in,
.drag.gamedev400 .word {
  width: 95px;
  height: 40px;
  text-align: center;
  background: #fff;
  margin: 0;
  padding: 0;
}
.drag.gamedev400 .word {
  margin: 5px 10px;
  padding: 0 5px;
}
.drag.gamedev400 .title {
  width: 400px;
  height: 87px;
  font-size: 18px;
  padding: 5px 20px;
  background-color: #fff;
}
.drag.gamedev400 .title.right {
  text-align: right;
}
.drag.gamedev400 .word-in .word {
  margin: 0;
}

.game.gamedev500 .square {
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-bottom: 5px;
  margin-left: 1px;
  margin-right: 1px;
  border: 2px solid #9e9e9e;
}
.game.gamedev500 .square .square,
.game.gamedev500 .square .square.blue,
.game.gamedev500 .square .square.green,
.game.gamedev500 .square .square.orange,
.game.gamedev500 .square .square.red {
  margin: 0;
}
.game.gamedev500 .square.blue,
.game.gamedev500 .square.green,
.game.gamedev500 .square.orange,
.game.gamedev500 .square.red {
  margin-top: -15px;
  border: none;
}
.game.gamedev500 .square.blue {
  background-color: #1c71b6;
}
.game.gamedev500 .square.green {
  background-color: #1db04f;
}
.game.gamedev500 .square.red {
  background-color: #d74343;
}
.game.gamedev500 .square.orange {
  background-color: #f2742b;
}
.game.gamedev500 .square.man {
  /*background-color: #f00;*/
  transition: left 0.3s linear, top 0.3s linear;
  margin: 5px 0 0 5px;
  border: none;
}
.game.gamedev500 .square.man.full-face {
  background: transparent url("/games/v2/games/game/gamedev500/img/1.png") no-repeat scroll 50% 50%;
}
.game.gamedev500 .square.man.side-view-r {
  background: transparent url("/games/v2/games/game/gamedev500/img/2.png") no-repeat scroll 50% 50%;
}
.game.gamedev500 .square.man.side-view-l {
  background: transparent url("/games/v2/games/game/gamedev500/img/2.png") no-repeat scroll 50% 50%;
  transform: rotateY(180deg);
}
.game.gamedev500 .square.carriage {
  position: relative;
  /*border: 2px solid #00c118;*/
  /*box-shadow: 0px 0px 4px rgb(0,255,0);*/
}
.game.gamedev500 .square.carriage:before {
  content: "";
  position: absolute;
  top: 0px;
  left: 1px;
  width: 8px;
  height: 22px;
  border-left: 10px solid rgb(84, 84, 84);
  border-right: 10px solid rgb(84, 84, 84);
  border-top: 4px solid rgb(84, 84, 84);
  border-bottom: 4px solid rgb(84, 84, 84);
}
.game.gamedev500 .square.error-b {
  border: 2px solid red;
}

.drag.seo100 .word {
  width: 150px;
  height: 40px;
  text-align: center;
  background: #fff;
  margin: 5px 10px;
  padding: 0;
}
.drag.seo100 .word .word {
  margin: 0;
}
.drag.seo100 .word.title {
  flex: 0 1 73%;
  font-size: 25px;
}
.drag.seo100 .head {
  margin-bottom: 10px;
  padding: 20px;
}
.drag.seo100 .head.title {
  text-align: center;
  width: 100%;
  font-size: 25px;
  margin-bottom: 0;
}
.drag.seo100 .description {
  width: calc(60% - 60px);
  min-height: 200px;
  background: #fff;
  font-size: 20px;
  padding: 0 30px;
}

.other.seo200 h1 {
  padding: 20px 0;
  font-size: 22px;
}
.other.seo200 .presentation {
  position: relative;
  width: 80%;
  height: 75px;
  margin-bottom: 20px;
  margin-top: 20px;
}
.other.seo200 .presentation .number,
.other.seo200 .presentation .annotation {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 80px);
  height: 100%;
  font-size: 18px;
  padding: 0 40px;
  background-color: #fff;
  /*z-index: 1000;*/
}
.other.seo200 .presentation .annotation strong {
  font-size: 22px;
}
.other.seo200 .presentation .number {
  opacity: 0.2;
  font-size: 60px;
  /*z-index: 10;*/
}
.other.seo200 .presentation button {
  z-index: 20000;
  position: absolute;
  right: 10px;
  bottom: -14px;
}
.other.seo200 .search {
  position: relative;
  width: 739px;
  height: 50px;
  background: transparent url(/games/v2/games/other/seo200/img/search.png) no-repeat scroll 50% 50%;
  padding-top: 12px;
  padding-left: 150px;
  margin-top: 100px;
}
.other.seo200 .selected {
  /*background-color: transparent !important;*/
  background-color: #fff !important;
  box-sizing: border-box;
}
.other.seo200 .selected:not(.error-b) {
  border: 2px solid #00cc00;
}
.other.seo200 .img_selectable {
  margin-left: 4px;
  margin-right: 4px;
  width: 300px;
  height: 300px;
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 2px 2px 2px #ccc;
}
.other.seo200 .error-b {
  border: 2px solid red;
}
.other.seo200 .img_container {
  transform: scale(0.7, 0.7);
  -ms-transform: scale(0.7, 0.7);
  -webkit-transform: scale(0.7, 0.7);
}

.other.seo300 .block, .other.crypto_300 .block, .other.crypto_400 .block {
  position: relative;
  height: 900px;
  width: 100%;
}
.other.seo300 .block img, .other.crypto_300 .block img, .other.crypto_400 .block img {
  position: absolute;
}
.other.seo300 .block img.site, .other.crypto_300 .block img.site, .other.crypto_400 .block img.site {
  left: calc((100% - 889px) / 2);
  top: calc((80% - 585px) / 2);
}
.other.seo300 .block img.robot, .other.crypto_300 .block img.robot, .other.crypto_400 .block img.robot {
  right: 40px;
  bottom: 80px;
  z-index: 1000;
  transition: all 1s linear;
}
.other.seo300 .block .spotlight {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  box-shadow: inset -2px -2px 3px #ccc, inset 2px 2px 2px #ccc;
  z-index: 500;
  transition: all 1s linear;
}
.other.crypto_300 .block .spotlight, .other.crypto_400 .block .spotlight {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 500;
  transition: all 1s linear;
}
.other.seo300 .block .spotlight.url, .other.crypto_300 .block .spotlight.url, .other.crypto_400 .block .spotlight.url {
  border-top: 120px solid rgba(255, 255, 255, 0.8);
  border-right: 205px solid rgba(255, 255, 255, 0.8);
  border-bottom: 750px solid rgba(255, 255, 255, 0.8);
  border-left: 281px solid rgba(255, 255, 255, 0.8);
}
.other.seo300 .block .spotlight.title, .other.crypto_300 .block .spotlight.title, .other.crypto_400 .block .spotlight.title {
  border-top: 178px solid rgba(255, 255, 255, 0.8);
  border-right: 400px solid rgba(255, 255, 255, 0.8);
  border-bottom: 680px solid rgba(255, 255, 255, 0.8);
  border-left: 410px solid rgba(255, 255, 255, 0.8);
}
.other.seo300 .block .spotlight.img, .other.crypto_300 .block .spotlight.img, .other.crypto_400 .block .spotlight.img {
  border-top: 225px solid rgba(255, 255, 255, 0.8);
  border-right: 420px solid rgba(255, 255, 255, 0.8);
  border-bottom: 375px solid rgba(255, 255, 255, 0.8);
  border-left: 425px solid rgba(255, 255, 255, 0.8);
}
.other.seo300 .block .spotlight.text, .other.crypto_300 .block .spotlight.text, .other.crypto_400 .block .spotlight.text {
  border-top: 528px solid rgba(255, 255, 255, 0.8);
  border-right: 420px solid rgba(255, 255, 255, 0.8);
  border-bottom: 310px solid rgba(255, 255, 255, 0.8);
  border-left: 430px solid rgba(255, 255, 255, 0.8);
}
.other.seo300 .block .spotlight.selected, .other.crypto_300 .block .spotlight.selected, .other.crypto_400 .block .spotlight.selected {
  box-shadow: none;
  background-color: transparent !important;
}
.other.seo300 .block .spotlight.selected:not(.error-b), .other.crypto_300 .block .spotlight.selected:not(.error-b), .other.crypto_400 .block .spotlight.selected:not(.error-b) {
  border: 2px solid #1db04f;
}
.other.seo300 .block .spotlight.error-b, .other.crypto_300 .block .spotlight.error-b, .other.crypto_400 .block .spotlight.error-b {
  border: 2px solid red;
}

.other.seo300 .block .bubble, .other.crypto_300 .block .bubble, .other.crypto_400 .block .bubble {
  position: absolute;
  right: 280px;
  bottom: 110px;
  width: 165px;
  height: 60px;
  border-radius: 50px;
  box-shadow: 2px 2px 10px #ccc;
  background-color: #fff;
  border: 2px solid #ccc;
  z-index: 1000;
  text-align: center;
  padding: 20px 30px;
  font-size: 16px;
  transition: all 1s linear;
}
.other.seo300 .block .bubble:before, .other.crypto_300 .block .bubble:before, .other.crypto_400 .block .bubble:before {
  content: "";
  position: absolute;
  right: -2px;
  top: -32px;
  border-top: 16px solid rgba(0, 0, 0, 0);
  border-right: 16px solid rgba(0, 0, 0, 0);
  border-bottom: 16px solid #ccc;
  border-left: 16px solid #ccc;
  transform: skewX(-75deg);
}
.other.seo300 .block .bubble:after, .other.crypto_300 .block .bubble:after, .other.crypto_400 .block .bubble:after {
  content: "";
  position: absolute;
  right: 26px;
  top: -20px;
  border-top: 10px solid rgba(0, 0, 0, 0);
  border-right: 10px solid rgba(0, 0, 0, 0);
  border-bottom: 10px solid #fff;
  border-left: 10px solid #fff;
  transform: skewX(-75deg);
}
.other.seo300 .head, .other.crypto_300 .head, .other.crypto_400 .head {
  padding: 30px;
  width: 50%;
  font-size: 20px;
  text-align: center;
}
.other.seo300 .search, .other.crypto_300 .search, .other.crypto_400 .search {
  position: relative;
  background: transparent url("/games/v2/games/other/seo300/img/search.png") no-repeat scroll 50% 50%;
  width: 100%;
  height: 50px;
  margin: 15px 0 30px 0;
}
.other.seo300 .search span, .other.crypto_300 .search span, .other.crypto_400 .search span {
  position: absolute;
  top: 10px;
  left: 155px;
  font-size: 20px;
}

.other.seo400 .head {
  text-align: center;
  font-size: 20px;
}
.other.seo400 .win {
  /*	width: 100%;
	min-height: calc(100% - 170px);
	flex: 1 1 100%;
*/
  margin: 5px;
}
.other.seo400 .win img {
  width: 100%;
  height: 100%;
}
.other.seo400 .img-list {
  height: 170px;
  margin-bottom: 10px;
}
.other.seo400 .img-list img {
  height: 100%;
  margin: 4px;
}
.other.seo400 .order-list {
  width: 100%;
  height: 50px;
  color: #777;
  font-size: 20px;
}

.other.seo500 .head {
  font-size: 20px;
  text-align: center;
  width: 77%;
  margin: 0px auto;
  padding-top: 30px;
}
.other.seo500 .bg {
  position: relative;
  width: 1110px;
  height: 547px;
  background: transparent url("/games/v2/games/other/seo500/img/bg.png") no-repeat scroll 50% 50%;
  margin: 45px auto;
}
.other.seo500 .ireg {
  position: absolute;
}
.other.seo500 .ireg.error {
  background-color: transparent !important;
  border: 2px solid #d74343;
  color: inherit;
}
.other.seo500 .ireg.correct {
  background-color: transparent !important;
  border: 2px solid #1db04f;
  color: inherit;
}
.other.seo500 .ireg:before {
  position: absolute;
  content: "";
  top: 4px;
  left: -15px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  box-shadow: 0px 0px 8px #1db04f;
  background-color: #1db04f;
}
.other.seo500 .ireg.domain {
  top: 35px;
  left: 140px;
  height: 26px;
  min-width: 200px;
  font-size: 20px;
  padding: 0 15px;
  line-height: 24px;
}
.other.seo500 .ireg.title {
  top: 235px;
  left: 100px;
  height: 60px;
  min-width: 200px;
  font-size: 50px;
  font-weight: bold;
  color: #888;
}
.other.seo500 .ireg.text {
  top: 320px;
  left: 100px;
  height: 56px;
  width: 425px;
  min-width: 200px;
  color: #888;
  font-size: 20px;
}
/*.other.seo500 .ireg.text:before {
	top: ;
}
*/
.other.seo500 .ireg.button {
  top: 430px;
  left: 100px;
  height: 46px;
  width: 165px;
  color: #888;
  font-size: 24px;
  background-color: #ddd;
  line-height: 46px;
  text-align: center;
  border-radius: 23px;
}

/*.other.seo500 .ireg.button:before {
	top: 30%;
}
*/
.other.seo500 .ireg.image {
  top: 135px;
  left: 630px;
  height: 343px;
  width: 414px;
  color: #888;
  font-size: 20px;
  background-color: #ddd;
  border-radius: 45px;
  text-align: center;
  line-height: 343px;
}
.other.seo500 .items {
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
}
.other.seo500 .item:hover {
  background-color: #eee;
}
.other.seo500 .item img {
  height: 100px;
  box-sizing: border-box;
}
.other.seo500 .item img:hover {
  border: 2px solid #1db04f;
}
.other.seo500 .ireg.image * {
  line-height: normal;
}
.other.seo500 .ireg.image .items {
  position: absolute;
  top: 0px;
  left: -155px;
  width: 130px;
}
.other.seo500 .ireg.text .items {
  width: 600px;
}

.ai100-head {
  color: #0063aa;
  height: 40px;
  margin-top: 40px;
}

.drag.ai200 .ai-block-text {
  width: 100px;
  padding: 20px 10px;
  background-color: #fff;
  margin: 10px;
  text-align: center;
}
.drag.ai200 .ai-order {
  width: 512px;
  height: 36px;
  background-color: #fff;
  /*margin-top: 10px;*/
  padding: 10px;
}
.drag.ai200 .ai-place {
  width: 150px;
  height: 50px;
  background-color: #fff;
  margin: 10px;
  text-align: center;
}
.drag.ai200 .ai-place div {
  padding: 0 10px;
  width: auto;
  height: auto;
}
.robot-ai-wrap {
  height: 400px;
  margin-top: 25px;
}

.selectv2 .answer.vic-block {
  box-shadow: 2px 2px 2px #ccc;
  background-color: #fff !important;
  border-radius: 10px;
  margin: 4px 0;
  min-width: 510px;
}
.selectv2 .answer.vic-block.error {
  height: auto !important;
}
.selectv2 .answer.mod--cur {
  box-shadow: 2px 2px 2px #ccc;
  background-color: #fff !important;
  border-radius: 10px;
  margin: 0;
  width: auto;
  min-width: auto;
  padding: 16px;
}
.selectv2 .answer.vic-block:after {
  display: none;
}
.selectv2 .answer.vic-block.selected {
  background-color: #1db04f !important;
}
.selectv2 .answer.vic-block.error {
  background-color: #d74343 !important;
}

.game.ai500 .task-text {
  margin: 25px 0;
  width: 80%;
  background-color: #fff;
  padding: 15px;
}
.game.ai500 .block-bg {
  position: relative;
  width: 694px;
  height: 374px;
}
.game.ai500 img {
  position: absolute;
  top: 0;
  left: 0;
}
.game.ai500 input {
  position: absolute;
  width: 60px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  border: none;
}
.game.ai500 input[name="x1"] {
  top: 50px;
  left: 22px;
}
.game.ai500 input[name="x2"] {
  top: 270px;
  left: 22px;
}
.game.ai500 input[name="a1"] {
  top: 50px;
  left: 314px;
}
.game.ai500 input[name="a2"] {
  top: 270px;
  left: 314px;
}
.game.ai500 input[name="w1"] {
  top: 20px;
  left: 108px;
}
.game.ai500 input[name="w2"] {
  top: 124px;
  left: 42px;
}
.game.ai500 input[name="w3"] {
  top: 200px;
  left: 42px;
}
.game.ai500 input[name="w4"] {
  top: 300px;
  left: 108px;
}
.game.ai500 input[name="w5"] {
  top: 26px;
  left: 400px;
}
.game.ai500 input[name="w6"] {
  top: 300px;
  left: 400px;
}

.game.ai500 input[name="res"] {
  top: 182px;
  left: 610px;
}
.game.ai500 .calculator {
  width: 150px;
}
.game.ai500 .calculator .letterset {
  cursor: pointer;
}
.ai500i {
  height: auto !important;
}

.other.site500 .site, .other.crypto_400 .site {
  position: relative;
  height: 595px;
}
.other.site500 .site img,
.other.site500 .site .spotlight,
.other.crypto_400 .site img,
.other.crypto_400 .site .spotlight {
  position: absolute;
  top: 15px;
  left: calc((100% - 1100px) / 2);
  height: 565px;
}
.other.site500 .site .spotlight, .other.crypto_400 .site .spotlight {
  right: 0;
  bottom: 0;
  z-index: 500;
  transition: all 1s linear;
  box-sizing: border-box;
}
.other.site500 .d-spotlight:before,
.other.site500 .site .spotlight:before,
.other.crypto_400 .d-spotlight:before,
.other.crypto_400 .site .spotlight:before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 4px solid #f2742b;
  z-index: 1000;
  box-sizing: border-box;
  box-shadow: 2px 2px 4px #aaa;
}
.other.site500 .spotlight.menu {
  border-top: 60px solid rgba(255, 255, 255, 0.8);
  border-right: 1005px solid rgba(255, 255, 255, 0.8);
  border-bottom: 230px solid rgba(255, 255, 255, 0.8);
  border-left: 0px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fast-menu {
  border-top: 210px solid rgba(255, 255, 255, 0.8);
  border-right: 718px solid rgba(255, 255, 255, 0.8);
  border-bottom: 205px solid rgba(255, 255, 255, 0.8);
  border-left: 130px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.view-menu {
  border-top: 235px solid rgba(255, 255, 255, 0.8);
  border-right: 575px solid rgba(255, 255, 255, 0.8);
  border-bottom: 294px solid rgba(255, 255, 255, 0.8);
  border-left: 445px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.rec-menu {
  border-top: 200px solid rgba(255, 255, 255, 0.8);
  border-right: 460px solid rgba(255, 255, 255, 0.8);
  border-bottom: 330px solid rgba(255, 255, 255, 0.8);
  border-left: 125px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.rec-filter {
  border-top: 223px solid rgba(255, 255, 255, 0.8);
  border-right: 633px solid rgba(255, 255, 255, 0.8);
  border-bottom: 310px solid rgba(255, 255, 255, 0.8);
  border-left: 275px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.tools {
  border-top: 223px solid rgba(255, 255, 255, 0.8);
  border-right: 840px solid rgba(255, 255, 255, 0.8);
  border-bottom: 310px solid rgba(255, 255, 255, 0.8);
  border-left: 125px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fast-pub {
  border-top: 25px solid rgba(255, 255, 255, 0.8);
  border-right: 805px solid rgba(255, 255, 255, 0.8);
  border-bottom: 500px solid rgba(255, 255, 255, 0.8);
  border-left: 205px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-title {
  border-top: 200px solid rgba(255, 255, 255, 0.8);
  border-right: 245px solid rgba(255, 255, 255, 0.8);
  border-bottom: 315px solid rgba(255, 255, 255, 0.8);
  border-left: 123px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-record {
  border-top: 349px solid rgba(255, 255, 255, 0.8);
  border-right: 250px solid rgba(255, 255, 255, 0.8);
  border-bottom: 0px solid rgba(255, 255, 255, 0.8);
  border-left: 125px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-stile {
  border-top: 300px solid rgba(255, 255, 255, 0.8);
  border-right: 890px solid rgba(255, 255, 255, 0.8);
  border-bottom: 230px solid rgba(255, 255, 255, 0.8);
  border-left: 125px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-font {
  border-top: 300px solid rgba(255, 255, 255, 0.8);
  border-right: 845px solid rgba(255, 255, 255, 0.8);
  border-bottom: 230px solid rgba(255, 255, 255, 0.8);
  border-left: 215px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-comment {
  border-top: 300px solid rgba(255, 255, 255, 0.8);
  border-right: 775px solid rgba(255, 255, 255, 0.8);
  border-bottom: 230px solid rgba(255, 255, 255, 0.8);
  border-left: 309px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-anchor {
  border-top: 300px solid rgba(255, 255, 255, 0.8);
  border-right: 680px solid rgba(255, 255, 255, 0.8);
  border-bottom: 230px solid rgba(255, 255, 255, 0.8);
  border-left: 400px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-anons {
  border-top: 300px solid rgba(255, 255, 255, 0.8);
  border-right: 660px solid rgba(255, 255, 255, 0.8);
  border-bottom: 230px solid rgba(255, 255, 255, 0.8);
  border-left: 425px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-img {
  border-top: 270px solid rgba(255, 255, 255, 0.8);
  border-right: 855px solid rgba(255, 255, 255, 0.8);
  border-bottom: 260px solid rgba(255, 255, 255, 0.8);
  border-left: 125px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-time {
  border-top: 310px solid rgba(255, 255, 255, 0.8);
  border-right: 35px solid rgba(255, 255, 255, 0.8);
  border-bottom: 215px solid rgba(255, 255, 255, 0.8);
  border-left: 875px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.fld-button {
  border-top: 390px solid rgba(255, 255, 255, 0.8);
  border-right: 35px solid rgba(255, 255, 255, 0.8);
  border-bottom: 135px solid rgba(255, 255, 255, 0.8);
  border-left: 982px solid rgba(255, 255, 255, 0.8);
}

.other.site500 .spotlight.s-rubrica {
  border-top: 55px solid rgba(255, 255, 255, 0.8);
  border-right: 35px solid rgba(255, 255, 255, 0.8);
  border-bottom: 260px solid rgba(255, 255, 255, 0.8);
  border-left: 875px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.s-tags {
  border-top: 310px solid rgba(255, 255, 255, 0.8);
  border-right: 35px solid rgba(255, 255, 255, 0.8);
  border-bottom: 105px solid rgba(255, 255, 255, 0.8);
  border-left: 875px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.s-anons {
  border-top: 468px solid rgba(255, 255, 255, 0.8);
  border-right: 35px solid rgba(255, 255, 255, 0.8);
  border-bottom: 20px solid rgba(255, 255, 255, 0.8);
  border-left: 875px solid rgba(255, 255, 255, 0.8);
}
.other.site500 .spotlight.s-menu {
  border-top: 116px solid rgba(255, 255, 255, 0.8);
  border-right: 10px solid rgba(255, 255, 255, 0.8);
  border-bottom: 360px solid rgba(255, 255, 255, 0.8);
  border-left: 0px solid rgba(255, 255, 255, 0.8);
  width: 130px;
}
.other.site500 .spotlight.s-drag {
  border-top: 202px solid rgba(255, 255, 255, 0.8);
  border-right: 18px solid rgba(255, 255, 255, 0.8);
  border-bottom: 200px solid rgba(255, 255, 255, 0.8);
  border-left: 0px solid rgba(255, 255, 255, 0.8);
  left: 150px;
}
.other.site500 .head {
  font-size: 20px;
  width: 100%;
  text-align: center;
}

.other.site500 .d-spotlight {
  position: absolute;
  top: 15px;
  left: calc((100% - 1000px) / 2);
  height: 835px;
  width: 1000px;
  box-sizing: border-box;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.1);
  pointer-events: none;
}

.drag.www500 .date {
  width: 90px;
  margin: 15px 0;
}
.drag.www500 .block,
.drag.www500 .l-block {
  background-color: #fff;
  margin: 5px;
}
.drag.www500 .block {
  min-height: 70px;
}
.drag.www500 .l-block {
  padding: 15px;
}
.drag.www500 .date .l-block,
.drag.www500 .block .l-block {
  margin: 0;
  height: 50px;
  overflow: hidden;
}
.drag.www500 .time-scale {
  width: 20px;
  border-top: 4px solid #1c71b6;
  border-right: 6px solid #1c71b6;
  box-sizing: border-box;
}
.drag.www500 .time-scale:last-child {
  border-bottom: 4px solid #1c71b6;
}
.drag.www500 .selectable {
  position: relative;
  cursor: pointer;
  margin: 15px;
  display: inline-block;
}
.drag.www500 .selectable:before {
  content: "";
  position: absolute;
  top: 7px;
  left: -15px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #eee;
  box-shadow: inset 1px 1px 2px #ccc;
}
.drag.www500 .selectable[selected]:before {
  background-color: #1db04f;
  box-shadow: none;
}
.drag.www500 .head {
  font-size: 20px;
  width: 100%;
  text-align: center;
  margin: 15px 0;
}

.www500-info {
  border-radius: 10px;
  background-color: rgba(255, 255, 255, 0.9) !important;
  font-size: 24px;
  font-weight: bold;
  font-style: italic;
  color: #1b9e59;
}

/**********************************/
/*          2020                  */
/**********************************/
.i25g100 .termin:hover,
.i25g200 .termin:hover {
  box-shadow: 2px 2px 3px #1c71b6, -2px 2px 3px #1c71b6, 2px -2px 3px #1c71b6, -2px -2px 3px #1c71b6;
}

.i25g200 .table {
  display: flex;
  flex-direction: column;
  background-color: #d6e2ec;

  border: solid #1c71b6 2px;
  border-radius: 10px;
  width: 100%;
}
.i25g200 .tr {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
}
.i25g200 .th {
  font-weight: bold;
  text-align: center;
  color: #1c71b6;
}
.i25g200 .td,
.i25g200 .th {
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: solid #1c71b6 1px;
  border-top: solid #1c71b6 1px;
  /* width: 316px; */
  width: calc((100% - 90px) / 3);
}
.i25g200 .td {
  /* height: 90px; */
  height: auto;
  min-height: 60px;
}
.i25g200 .td:not(:first-child) {
  flex-direction: column;
}

.i25g200 .th {
  border-top: none;
  height: 50px;
}

.i25g200 .td:first-child,
.i25g200 .th:first-child {
  width: 90px;
  border-left: none;
}

.i25g300 .info,
.i25g400 .info,
.i27g100 .info {
  background-color: #f9f5dd;
  width: 550px;
  margin: 100px auto;
  padding: 2rem;
  color: #005eaf;
  font-size: 1.3rem;
}

.i25g300 .block-text {
  display: flex;
  margin: 1.5rem 1rem;
  width: calc(54% - 4rem);
  flex-wrap: wrap;
  align-items: flex-end;
  height: 60px;
}
.i25g300 .block-text.left {
  width: 46%;
}
.i25g300 .block-text br {
  content: '\A';
  display: block;
  width: 100%;
}
.game-main .i25g300 .cell {
  width: 27px;
  height: 27px;
}
.i25g300 br ~ .block-word {
  margin-left: 0;
}
.i25g300 .block-word {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto !important;
  background-color: transparent !important;
  margin-bottom: unset !important;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.i25g300 .block-word:first-child {
  margin-left: 0;
}
.i25g300 .block-word:last-child {
  margin-right: 0;
}
.i25g300 .cell {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px;
  background-color: #e7e7e7;
}

.i25g300 .error .cell {
  background-color: #f86666 !important;
  color: #fff;
}

.i25g300 .correct .cell {
  background-color: #1b9e59 !important;
  color: #fff;
}

.game-main .cell.editable.entered {
  border: 1px solid #0096f0;
  box-sizing: border-box;
}
.game-main .cell.editable.entered.active {
  animation-name: blick;
  animation-duration: 0.5s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: linear;
}

.i25g400 .variant-block {
  width: 650px;
}
.i25g400 .scale-l,
.i25g400 .scale-r {
  border-bottom: 2px solid #136bb3;
  width: 87.5px;
  height: 30px;
  box-sizing: border-box;
}
.i25g400 .scale-l {
  border-right: 2px solid #136bb3;
  margin-left: 0.25rem;
}
.i25g400 .scale-r {
  margin-right: 0.25rem;
}
.how_pc_300 .game-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.i25g500 .t-block,
.i26g100 .t-block,
.how_pc_300 .t-block,
.i35g500 .t-block,
.i36g500 .t-block,
.i44g200 .t-block,
.i46g200 .t-block{
  width: 315px;
  height: 45px;
  font-size: 1.3rem;
}
.i25g500 .t-block.top,
.i26g100 .t-block.top,
.how_pc_300 .t-block.top,
.i35g500 .t-block.top, .i36g500 .t-block.top, .i44g200 .t-block.top, .i46g200 .t-block.top {
  font-weight: bold;
}
.i25g500 .t-block .fl::first-letter,
.i26g100 .t-block .fl::first-letter,
.how_pc_300 .t-block .fl::first-letter,
.i35g500 .t-block .fl::first-letter,
.i36g500 .t-block .fl::first-letter,
.i44g200 .t-block .fl::first-letter,
.i46g200 .t-block .fl::first-letter{
  color: #f2742b;
}
.i25g500 .i-block,
.i26g100 .i-block,
.how_pc_300 .i-block,
.i35g500 .i-block, 
.i36g500 .i-block,
.i44g200 .i-block,
.i46g200 .i-block {
  text-align: center;
  font-size: 1.2rem;
  background-color: #f9f5dd !important;
}
.i25g500 .circle,
.i26g100 .circle,
.how_pc_300 .circle,
.i35g500 .circle,
.i36g500 .circle,
.i44g200 .circle,
.i46g200 .circle{
  width: 1.25rem;
  height: 1.25rem;
}
.i25g500 svg,
.i26g100 svg,
.how_pc_300 svg,
.i35g500 svg,
.i36g500 svg,
.i44g200 svg,
.i46g200 svg{
  pointer-events: none;
}
.i25g500 .head,
.i26g100 .head,
.how_pc_300 .head,
.i35g500 .head,
.i36g500 .head,
.i44g200 .head,
.i46g200 .head{
  font-weight: bold;
  height: 26px;
  text-align: center;
  font-size: 1.3rem;
}
.i26g100 .clip-ellipsis, .i35g500 .clip-ellipsis, .i36g500 .clip-ellipsis, .i44g200 .clip-ellipsis, .i46g200 .clip-ellipsis {
  display: block;
  white-space: nowrap;
  /* Запрещаем перенос строк */
  overflow: hidden;
  /* Обрезаем все, что не помещается в область */
  /* max-width: 180px; */
  /* Ширина*/
  text-overflow: ellipsis;
  /* Добавляем многоточие */
}
.i26g100 .v2-tooltip, .i35g500 .v2-tooltip, .i36g500 .v2-tooltip, .i44g200 .v2-tooltip, .i46g200 .v2-tooltip {
  display: none;
  width: 400px;
  left: -90px;
  top: 60px;
  z-index: 1000;
  white-space: normal;
  pointer-events: none;
}
.i26g100 .v2-tooltip::before, .i35g500 .v2-tooltip::before, .i36g500 .v2-tooltip::before, .i44g200 .v2-tooltip::before, .i46g200 .v2-tooltip::before {
  content: "";
  position: absolute;
  left: 100px;
  top: -22px;
  width: 0;
  height: 0px;
  border-left: 13px solid transparent;
  border-top: 13px solid transparent;
  border-right: 13px solid rgba(0, 0, 0, 0.16);
  border-bottom: 13px solid rgba(0, 0, 0, 0.16);
  transform: skew(-40deg, 0deg);
}
.i26g100 .v2-tooltip::after, .i35g500 .v2-tooltip::after, .i36g500 .v2-tooltip::after, .i44g200 .v2-tooltip::after, .i46g200 .v2-tooltip::after {
  content: "";
  position: absolute;
  left: 100px;
  top: -20px;
  width: 0;
  height: 0px;
  border-left: 12px solid transparent;
  border-top: 12px solid transparent;
  border-right: 12px solid #ffffff;
  border-bottom: 12px solid #ffffff;
  transform: skew(-40deg, 0deg);
}
.i26g100 .clip-ellipsis:hover .v2-tooltip, .i35g500 .clip-ellipsis:hover .v2-tooltip, .i36g500 .clip-ellipsis:hover .v2-tooltip, .i44g200 .clip-ellipsis:hover .v2-tooltip, .i46g200 .clip-ellipsis:hover .v2-tooltip {
  display: block;
}

.i44g200 .v2-white-block,
.i46g200 .v2-white-block {
    min-height: 110px;
    max-height: 110px;
}
.i36g500 .game-c-right, .i36g500 .game-c-left { 
    min-height: 130px;
}
.i36g500 .game-c-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.i36g500 ul, .i36g500 ol {
    list-style: initial !important;
    padding-left: 20px !important;
}

.i36g500 .game-head{
    text-align: center;
    max-width: 800px;
    font-weight: 400;
    font-style: italic;
    font-size: 22px;
}

.i36g500 .game-box-theory {
    font-style: italic;
    font-size: 22px;
    margin: 0.25rem 0rem 0rem 0rem !important;
}

.i36g500 .game-box-theory-2 {
    font-style: italic;
    font-size: 22px;
    margin: 0.25rem 0rem 0rem 0rem !important;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important;
    background-color: rgba(255, 255, 255, 0) !important;
    border-radius: 0px !important;
    text-align: center;
}


.i36g500 .game-button {
    width: 100%;
    min-height: 60px;
    padding: 1.5rem;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
    background-color: rgba(255, 255, 255, 1);
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    font-style: italic;
    font-size: 18px;
    text-align: center;
}

.i36g500 .game-button:hover {
    
}
.i36g500 .game-name {
    font-size: 22px;
    font-weight: 700;
    font-style: italic;
    text-transform: uppercase;
    text-align: center;
}

.i36g500 .drag-group{
    width: 100%;
    min-height: 245px;
    display: -ms-flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    gap: 10px;
    -webkit-gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.i36g500 .drag-draggable{
    position: relative;
    min-width: calc(220px - 1rem);
    max-width: calc(220px - 1rem);
    display: -ms-flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    gap: 10px;
    -webkit-gap: 10px;
    min-height: 80px;
    padding: 0.5rem;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
    background-color: rgba(255, 255, 255, 1);
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    font-style: italic;
    font-size: 16px;
    text-align: center;
}

.i36g500 .drag-table{
    display: -ms-flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    gap: 10px;
    -webkit-gap: 10px;
}

.i36g500 .drag-table-line{
    width: 100%;
    display: -ms-flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    gap: 0px;
    -webkit-gap: 0px;
}

.i36g500 .drag-fixed{
    width: calc(30% - 1rem);
    max-width: calc(30% - 1rem);
    min-width: calc(30% - 1rem);
    min-height: 92px;
    padding: 0.5rem;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
    background-color: rgba(255, 255, 255, 1);
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    font-style: italic;
    font-size: 16px;
    text-align: center;
    display: -ms-flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

.i36g500 .drag-line{
    width: 2%;
    max-width: 2%;
    min-width: 2%;
    height: 2px;
    min-height: 2px;
    background-color: #08A057;
}

.i36g500 .drag-box{
    position: relative;
    width: calc(29% - 1rem);
    max-width: calc(29% - 1rem);
    min-width: calc(29% - 1rem);
    min-height: 100px;
    padding: 0.5rem;
    border-radius: 10px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
    background-color: #F2F2F2;
    border: 2px solid transparent;
    transition: all 0.2s ease;
    font-style: italic;
    font-size: 16px;
    text-align: center;
    display: -ms-flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

.i36g500 .drag-box#b_1, .i36g500 .drag-box#b_4 {
    width: calc(10% - 1rem) !important;
    max-width: calc(10% - 1rem) !important;
    min-width: calc(10% - 1rem) !important;
}

.i36g500 .drag-draggable#d_1, .i36g500 .drag-draggable#d_4 {
     min-width: calc(72px - 1rem) !important;
     max-width: calc(72px - 1rem) !important;
}

.i36g500 .drag-box#b_3, .i36g500 .drag-box#b_6 {
    width: calc(48% - 1rem) !important;
    max-width: calc(48% - 1rem) !important;
    min-width: calc(48% - 1rem) !important;
}

.i36g500 .drag-draggable#d_3, .i36g500 .drag-draggable#d_6 {
     min-width: calc(374px - 1rem) !important;
     max-width: calc(374px - 1rem) !important;
}

.i36g500 .centered {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    inset: 50% 50% !important;
    color: black !important;
}

.i26g300 .item {
  width: calc(33.333% - 6rem);
  height: 2rem;
  text-align: center;
}
.i26g300 .selector {
  left: -15px;
  top: -15px;
  width: 30px;
  height: 30px;
  border: 2px solid #5581c1;
  background-color: #9ed6f4;
}
.i26g300 .menu {
  width: 150px;
  position: absolute;
  top: -50px;
  left: 20px;
}
.i26g300 .l-t0:hover,
.i26g300 .l-t1:hover,
.i26g300 .l-t2:hover {
  background-color: #ccc;
}
.i26g300 .l-t0,
.i26g300 .l-t1,
.i26g300 .l-t2 {
  height: 2.2rem;
  padding-left: 2.5rem;
  line-height: 2.2rem;
  color: #000 !important;
}
.i26g300 .l-t0::before,
.i26g300 .l-t1::before,
.i26g300 .l-t2::before {
  position: absolute;
  content: "";
  left: 0px;
  top: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 2px solid #cccccc;
}

.i26g300 .s-t0,
.i26g300 .l-t0::before {
  background-color: #e9bf25;
}
.i26g300 .s-t1,
.i26g300 .l-t1::before {
  background-color: #3377aa;
}
.i26g300 .s-t2,
.i26g300 .l-t2::before {
  background-color: #6b4c9f;
}

.i26g400 .head {
  font-size: 1.4rem;
}

.i26g400 .socket {
  width: 20px;
  height: 20px;
  background-color: #808080;
  z-index: 1;
}

.i26g400 .cable {
  width: 150px;
}

.i26g400 #info .b300 {
  justify-content: center;
  align-items: center;
  width: 300px;
  height: 300px;
  overflow: hidden;
  border: 2px solid #fff;
  background-color: #fff;
}

.i26g400 .browser {
  width: 730px;
  height: 460px;
  margin-left: 328px;
  border-radius: 20px;
  border: 2px solid #d2d3d5;
}
.i26g400 .browser .header {
  height: 60px;
  background-color: #d2d3d5;
  color: #272727;
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
}
.i26g400 .browser .form {
  height: 100%;
  margin-top: -60px;
}
.i26g400 .browser input {
  width: 170px;
  height: 1rem;
  border-radius: 15px;
  border: 2px solid #d2d3d5;
  padding: 0.5rem 1rem;
  font-size: 1.5rem;
}
.i26g400 .browser button {
  height: 3rem;
  border-radius: 30px;
  padding: 1rem 1.5rem;
  font-size: 1.4rem;
  line-height: 0.9rem;
  border: none;
  background: linear-gradient(to top, #1b9e59 0%, #48b17a 100%) no-repeat !important;
  color: #ffffff;
  cursor: pointer;
}
.i26g400 .browser .input {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border-radius: 15px;
  background-color: #d2d3d5;
}
.i26g400 .browser .form img {
  padding: 0 2rem;
}
.i26g400 .browser .form span {
  width: 130px;
  color: #929ea7;
  padding: 0 0 0 1rem;
  font-size: 0.9rem;
  text-align: center;
}
.i27g100 .head,
.i27g200 .head,
.i27g300 .head,
.i27g400 .head {
  color: #005eaf;
  font-weight: bold;
  font-style: italic;
  font-family: Calibri, Conv_Calibri;
  padding: 1.5rem 0 0 0;
}
.i27g100 ul.img,
.i27g200 ul.img {
  list-style: none;
}
.i27g100 ul.img img,
.i27g200 ul.img img {
  padding: 0.3rem 2rem;
  vertical-align: middle;
}
.i27g100 ul.img li,
.i27g200 ul.img li {
  line-height: 1rem;
  list-style: none;
  margin-left: 0;
}
.i27g100 .block .spotlight {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  box-shadow: inset -2px -2px 3px #ccc, inset 2px 2px 2px #ccc;
  z-index: 500;
  pointer-events: none;
}
.i27g100 .block {
  position: relative;
}
.i27g100 .head-2 {
  color: #000000;
  font-weight: bold;
  font-style: italic;
  font-family: Calibri, Conv_Calibri;
  text-align: center;
}
.i27g100 .block .spotlight.selected {
  border: 2px solid #1db04f !important;
  background-color: transparent !important;
}
.i27g100 .block .spotlight.error {
  border: 2px solid #d74343 !important;
  background-color: transparent !important;
}
.i27g200 .property {
  width: 176px;
  height: 60px;
  margin-left: calc(176px / -2);
  margin-top: -30px;
  text-transform: uppercase;
  color: #38ac71;
  font-weight: bold;
}

.i27g200 .block {
  width: 150px;
  height: 60px;
}
.i27g200 .block-small {
  width: 40px;
}
.i27g200 .block-small .title {
  z-index: 1000;
}

.i27g300 .num {
  min-width: 60px;
  height: 60px;
  color: #ffffff;
  text-align: center;
  line-height: 60px;
  display: inline-block;
}
.i27g300 .num.green {
  background-color: #2dc56a;
}
.i27g300 .num.blue {
  background-color: #005eaf;
}
.i27g300 .num.orange {
  background-color: #f2742b;
}
.i27g300 .feature {
  border-radius: 50%;
  display: inline-block;
  font-size: 1.3rem;
  max-width: 300px;
  font-style: italic;
  font-weight: 500;
  box-shadow: inset 2px 2px 3px rgba(0, 0, 0, 0.04), inset -3px -2px 2px rgba(0, 0, 0, 0.04), 3px 3px 3px rgba(0, 0, 0, 0.16) !important;
}
.i27g300 .feature.left {
  color: #2dc56a;
  border: 3px solid #2dc56a;
}
.i27g300 .feature.right {
  color: #f2742b;
  border: 3px solid #f2742b;
}
.i27g300 .feature.blue {
  color: #005eaf;
  border: 3px solid #005eaf;
  font-weight: bold !important;
}

.i27g300 .variant-block {
  width: 500px;
}

.i25g100 .yes,
.i27g400 .yes {
  color: #2dc56a;
}
.i25g100 .no,
.i27g400 .no {
  color: #f2742b;
}

.absolute-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.how_pc_100 rect#d_1_1, .how_pc_100 rect#d_1_2, .how_pc_100 rect#d_2_1, .how_pc_100 rect#d_2_2, .how_pc_100 rect#d_2_3, .how_pc_100 rect#d_2_4, .how_pc_100 rect#d_2_5, .how_pc_100 rect#d_2_6, .how_pc_100 rect#d_3_1, .how_pc_100 rect#d_3_2, .how_pc_100 rect#d_4_1, .how_pc_100 rect#d_4_2, .how_pc_100 rect#d_4_3, .how_pc_100 rect#d_4_4, .how_pc_100 rect#d_4_5, .how_pc_100 rect#d_4_6 {
    opacity: 0;
    cursor: pointer;
    transition: opacity 200ms ease-in-out;
}

.how_pc_100 rect#d_1_1:hover, .how_pc_100 rect#d_1_2:hover, .how_pc_100 rect#d_2_1:hover, .how_pc_100 rect#d_2_2:hover, .how_pc_100 rect#d_2_3:hover, .how_pc_100 rect#d_2_4:hover, .how_pc_100 rect#d_2_5:hover, .how_pc_100 rect#d_2_6:hover, .how_pc_100 rect#d_3_1:hover, .how_pc_100 rect#d_3_2:hover, .how_pc_100 rect#d_4_1:hover, .how_pc_100 rect#d_4_2:hover, .how_pc_100 rect#d_4_3:hover, .how_pc_100 rect#d_4_4:hover, .how_pc_100 rect#d_4_5:hover, .how_pc_100 rect#d_4_6:hover {
    opacity: 1;
}

.how_pc_100 div.tip.hidden {
    display:none;
}

.how_pc_300 .termin:hover {
  box-shadow: 2px 2px 3px #1c71b6, -2px 2px 3px #1c71b6, 2px -2px 3px #1c71b6, -2px -2px 3px #1c71b6;
}

.how_pc_300 .table {
  display: flex;
  flex-direction: column;
  background-color: #d6e2ec;

  border: solid #1c71b6 2px;
  border-radius: 10px;
  width: 100%;
}
.how_pc_300 .tr {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
}
.how_pc_300 .th {
  font-weight: bold;
  text-align: center;
  color: #1c71b6;
}
.how_pc_300 .td,
.how_pc_300 .th {
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: solid #1c71b6 1px;
  border-top: solid #1c71b6 1px;
  /* width: 316px; */
  width: calc((100% - 90px) / 3);
}
.how_pc_300 .td {
  /* height: 90px; */
  height: auto;
  min-height: 60px;
}
.how_pc_300 .td:not(:first-child) {
  flex-direction: column;
}

.how_pc_300 .th {
  border-top: none;
  height: 50px;
}

.how_pc_300 .td:first-child,
.how_pc_300 .th:first-child {
  width: 90px;
  border-left: none;
}

.fortune #container_how_pc_400 {
    min-height: 540px !important;
}

.how_pc_500 path#g2_2_1, .how_pc_500 path#g3_1, .how_pc_500 path#g3_2_1_5, .how_pc_500 path#g3_2_2_2 {
    cursor: pointer;
    position: relative;
}
.how_pc_500 path#g2_2_1::after, .how_pc_500 path#g3_1::after, .how_pc_500 path#g3_2_1_5::after, .how_pc_500 path#g3_2_2_2::after {
    content: "";
    pointer-events: none;
    position: absolute;
    width: 240px;
    left: 0; 
    bottom: 0;
    background: #3989c9;
    color: #fff;
    padding: 4px;
    border-radius: 4px;
    font-size: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
    opacity: 0;
    transition: .2s;
    z-index: 10;
}
.how_pc_500 path#g2_2_1:hover::after, .how_pc_500 path#g3_1:hover::after, .how_pc_500 path#g3_2_1_5:hover::after, .how_pc_500 path#g3_2_2_2:hover::after {
    opacity: 1;
    bottom: 1em;
}
.how_pc_500 path#g2_2_1::after {
    content: "Комплекс программ, которые обеспечивают функционирование всех устройств компьютера, а также предоставляют пользователю доступ к ресурсам компьютера. Диск, на котором установлена операционная система, называется системным. Наиболее распространенные операционные системы: Windows, Linux, Mac OS.";
}
.how_pc_500 path#g3_1::after {
    content: "Программы, с помощью которых пользователь может работать с информацией, не прибегая к программированию.";
}
.how_pc_500 path#g3_2_1_5::after {
    content: "Системы управления базами данных (например, Microsoft Access, OpenOffice Base).";
}
.how_pc_500 path#g3_2_2_2::after {
    content: "Системы автоматизированного проектирования (например, для построение сложных чертежей; среди самых известных программ такого типа - AutoCad, КОМПАС).";
}

.how_pc_500 .heyo:hover {
     fill: #CC2929;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.how_pc_500 .enabled {
  fill: #21669E;
  cursor: pointer;
}

.how_pc_500 .svg_tooltip {
  pointer-events: none;
  position: absolute;
  font-size: 14px;
  text-align: center;
  background: #fff;
  padding: 8px;
  z-index: 5;
  width: 240px;
  margin: 0 auto;
  color: #000;
  border-radius: 8px;
  box-shadow: 0 0 0 1px #eee;
  -moz-transform: translateX(-50%) translateY(-30px);
  -ms-transform: translateX(-50%) translateY(-30px);
  -webkit-transform: translateX(-50%) translateY(-30px);
  transform: translateX(-50%) translateY(-30px);
  display: none;
}
.how_pc_500 .svg_tooltip.active {
  display: block;
}
.how_pc_500 .svg_tooltip:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 0;
  height: 0;
  margin-left: -10px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid white;
}
.how_pc_500 .answer {
    min-width: 160px !important;
    margin: 8px !important;
    text-transform: uppercase !important;
    font-style: normal !important; 
    font-family: 'Conv_Junegull' !important;
}
.how_pc_500 .selected, .how_pc_500 .error {
    color: white !important;
}

/* *************** MODAL WINDOW */
.md-modal {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 876px;
	max-width: 876px;
	min-width: 300px;
	min-height: 200px;
	z-index: 2000;
	visibility: hidden;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;

/*
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
*/

	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	background-color: #fff;
}
.giInfo {
    z-index: 3001;
}
.md-show {
	visibility: visible;
}

.md-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;

	background: rgba(43,43,43,0.8);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.md-show ~ .md-overlay {
	opacity: 1;
	visibility: visible;
}

/* Content styles */
.md-content,
.md-content-info {
	position: relative;
	/*margin: 25% 0;*/
/*	border-radius: 3px;
	margin: 0 auto;
*/
}
.md-content {
	font-family: Conv_Junegull;
	font-size: 25px;
	font-weight: 100;
	text-transform: uppercase;
}

.md-content-info {
	font-family: Conv_Calibri;
	font-size: 20px;
	font-weight: 100;
}

.md-content h3 {
	margin: 0;
	padding: 0.4em;
	/*text-align: center;*/
	font-size: 2.4em;
	font-weight: 300;
	opacity: 0.8;
	background: rgba(0,0,0,0.1);
	border-radius: 3px 3px 0 0;
}

.md-content > div:first-child {
	margin: 0 75px;
	text-align: center;
}
/*
.md-content > div p {
	margin: 0;
	padding: 10px 0;
}

.md-content > div ul {
	margin: 0;
	padding: 0 0 30px 20px;
}

.md-content > div ul li {
	padding: 5px 0;
}

*/
.md-content-info >div {
	padding: 53px 78px 32px;
}

.md-content-info .auto-center {
	padding: 32px 78px 32px;
}

.md-content-info h1 {
	font-size: 20px;
	font-weight: bold;
	text-transform: uppercase;
	font-style: normal;
}
.md-content-info ul>li {
	position: relative;
	font-style: italic;
	margin-top: 10px;
}
.md-content-info ul>li::before {
	content: '';
	position: absolute;
	top: 10px;
	left: -10px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: #f38231;
}
@media screen and (min-height: 800px) {
	.md-content-info ul>li img.comp-atack {
		max-width: 50px;
		margin-right: 20px;
		vertical-align: middle;
	}
}
@media screen and (max-height: 750px) {
	.md-content-info ul>li img.comp-atack {
		max-width: 30px;
		margin-right: 20px;
		vertical-align: middle;
	}
}
.md-content-info ul>li span.comp-atack {
	display: inline-block;
	min-width: 200px;
}
.md-content button {
	display: block;
	margin: 55px auto;
	padding: 16px 43px;

	font-family: Conv_Calibri;
	font-size: 21px;
	font-weight: bold;
	text-transform: capitalize;
	color: #fff;
	border-radius: 10px;
	box-shadow: 2px 2px 4px #d7d7d7;
	border: none;
	cursor: pointer;
}

.error .md-content button {
	background: linear-gradient(to top, #d74343, #df5353);
	/*border: 1px groove #932424;*/
}

.message .md-content button {
	background: linear-gradient(to top, #18944f, #1ea963);
	/*border: 1px groove #56bf8b;*/
}
.md-content-info button {
	display: flex;
	margin: 20px auto;
	/*margin: 0px calc((100% - 180px)/2) 20px;*/
	/*width: 180px;*/
}

/* Individual modal styles with animations/transitions */

/* Effect 1: Fade in and scale up */
.md-effect-1 .md-content {
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-ms-transform: scale(0.7);
	transform: scale(0.7);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-1 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/*     END MODAL WINDOW         */
.error {
/*	background: -moz-linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
	background: -webkit-linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
	background: -o-linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
	background: linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
*/	border: 1px solid #d94747;
	color: #d94747;
	height: 321px;
}
.m-error {
	border: 1px solid #d94747;
	color: #d94747;
}
.message {
/*	background: -moz-linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
	background: -webkit-linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
	background: -o-linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
	background: linear-gradient(#FFF, #999) repeat scroll 0% 0% transparent;
*/	border: 1px solid #1b9e59;
	color: #1b9e59;
	height: 321px;
}
.msg-info-text {
    font-family: Conv_Calibri;
	font-size: 20px;
    font-style: italic;
	color: #000;
	text-transform: none;
    text-align: center;
    padding: 32px 32px 0px 32px;
}
.msg-info {
	box-shadow: 2px 2px 5px #e0e0e0;
	border-radius: 10px;
	min-width: 60%;
	/*padding: 50px;*/
}

.msg-info-auto {
	font-family: Conv_Calibri;
	font-size: 36px;
	font-weight: 100;
	box-shadow: 2px 2px 10px #e0e0e0;
	border-radius: 10px;
	min-height: 150px;
	height: 150px;
	width: auto;
}

/* Стили для fortune задания i45g300 - Термины и понятия */
.i45g300 .question-wrap {
	height: auto !important;
    min-height: 240px;
}

.i45g300 .question {
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
	display: flex !important;
	height: auto !important;
}

/* Стили для изображений в fortune i45g300 */
.i45g300 .question img {
	margin: 20px auto 10px auto !important;
	display: block !important;
	width: 300px !important;
	max-height: 280px !important;
	object-fit: contain !important;
	border-radius: 8px !important;
}

/* Стили для параграфов в описаниях fortune i45g300 */
.i45g300 .question p {
	text-align: center !important;
	margin: 10px 0 !important;
}

/* Стили для разделения длинного слова КОГЕРЕНТНОСТЬДЕКОГЕРЕНТНОСТЬ (28 букв) */
/* Используем классы long-word-first и long-word-second которые добавляются прямо к буквам */

/* Первая буква К (w_0) - добавляем "1." */
.i45g300 .long-word-first::before {
	content: attr(data-before);
	position: absolute;
	left: -25px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 14px;
	color: #666;
	font-weight: normal;
}

/* Четырнадцатая буква Д (w_13) - добавляем отступ и "2." */
.i45g300 .long-word-second::before {
	content: attr(data-before);
	position: absolute;
	left: -25px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 14px;
	color: #666;
	font-weight: normal;
}
/* End */


/* Start:/assets/css/v2/common.css?168805075823681*/
/* FONT CALIBRI */
.fnt-f-cc {
	font-family: Calibri, Conv_Calibri !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.fnt-f-c {
	font-family: Calibri, Conv_Calibri !important;
	/*font-family: bodonicitalic, Georgia, "Times New Roman", serif !important;*/
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* FONT ARCHIVE */
.fnt-f-a {
	font-family: Conv_Archive !important;
}

/* FONT ARCHIVE */
.fnt-f-j {
	font-family: Conv_Junegull !important;
}

/* FONT PROPERTY */
.fnt-n-n,
.fnt-n-i {
	font-weight: 100 !important;
}

.fnt-b-n,
.fnt-b-i {
	font-weight: bold !important;
}

.fnt-m-n,
.fnt-m-i {
	font-weight: 400 !important;
}

.fnt-n-n,
.fnt-m-n,
.fnt-b-n {
	font-style: normal !important;
}

.fnt-n-i,
.fnt-m-i,
.fnt-b-i {
	font-style: italic !important;
}

/**************************************************/
/*      __FLEX__                                  */
/**************************************************/
.flex-col:not(.hide),
.flex-row:not(.hide) {
	display: -webkit-box !important;
	/* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box !important;
	/* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox !important;
	/* TWEENER - IE 10 */
	display: -webkit-flex !important;
	display: flex !important;
}

.flex-col {
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
}

.flex-wrap {
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.flex-col.h-around,
.flex-row.h-around {
	-webkit-justify-content: space-around;
	justify-content: space-around;
}

.flex-col.h-between,
.flex-row.h-between {
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.flex-col.v-between,
.flex-row.v-between {
	-webkit-align-content: space-between;
	align-content: space-between;
}

.flex-col.between,
.flex-row.between {
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-content: space-between;
	align-content: space-between;
}

.flex-col.h-center,
.flex-row.h-center {
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
}

.flex-col.v-center,
.flex-row.v-center {
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-align-content: center;
	align-content: center;
}

.flex-col.center,
.flex-row.center {
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-align-content: center;
	align-content: center;
}

.flex-col.v-end,
.flex-row.v-end {
	-ms-flex-align: end;
	-webkit-align-items: flex-end;
	align-items: flex-end;
	-webkit-align-content: flex-end;
	align-content: flex-end;
}

.flex-col.h-end,
.flex-row.h-end {
	-ms-flex-pack: end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

.flex-col.end,
.flex-row.end {
	-ms-flex-align: end;
	-webkit-align-items: flex-end;
	align-items: flex-end;
	-webkit-align-content: flex-end;
	align-content: flex-end;
	-ms-flex-pack: end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

.flex-col.v-start,
.flex-row.v-start {
	-ms-flex-align: start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
}

.flex-col.h-start,
.flex-row.h-start {
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}

.flex-col.start,
.flex-row.start {
	-ms-flex-align: start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}

/**************************************************/
/*      __BUTTON__                                */
/**************************************************/
button.next {
	padding: 5px 15px;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	color: #fff;
	font-size: 16px;
}

button.next.orange {
	background: linear-gradient(to top, #f2742b 0%, #f48e36 100%) no-repeat;
}

.success button.next,
button.next.message,
button.next.green {
	background: linear-gradient(to top, #1db04f 0%, #2dc56a 100%) no-repeat;
}

.error button.next,
button.next.red,
button.next.error {
	background: linear-gradient(to top, #d74343, #df5353) no-repeat;
}

/**************************************************/
/*      __COLORS__                                  */
/**************************************************/
.color-orange {
	color: #f2742b !important;
}

.color-orange-light {
	color: #f48e36 !important;
}

.color-green {
	color: #2dc56a !important;
}

.color-green-light {
	color: #1db04f !important;
}

.color-blue {
	color: #0066b4 !important;
}

.color-blue-light {
	color: #0088b4 !important;
}

.color-white {
	color: #ffffff;
}

.bg-color-orange {
	background-color: rgba(242, 116, 43, 1) !important;
}

.bg-color-orange-light {
	/* background-color: rgba(242, 116, 43, 0.7) !important; */
	background-color: #f39a67 !important;
}

.bg-color-green {
	background-color: rgba(45, 197, 106, 1) !important;
}

.bg-color-green-light {
	background-color: rgba(45, 197, 106, 0.7) !important;
}

.bg-color-blue {
	background-color: rgba(0, 102, 180, 1) !important;
}

.bg-color-blue-light {
	/* background-color: rgba(0, 102, 180, 0.7) !important; */
	background-color: #4990c7 !important;
}

.bg-white {
	background-color: rgba(255, 255, 255, 1) !important;
}

.bg-white-05 {
	background-color: rgba(255, 255, 255, 0.5) !important;
}

/**************************************************/
/*      __HIDE__                                  */
/**************************************************/
.inactive {
	visibility: hidden;
}

.hidden {
	display: none;
}

/**************************************************/
/*      __BLOCK__                                 */
/**************************************************/
.block-shadow-round,
.block-shadow {
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.16);
}

.block-round,
.block-shadow-round,
.block-shadow-round-in,
.block-shadow-round-in-2,
.bsr-in2 {
	border-radius: 10px;
}

.block-shadow-round-in,
.block-shadow-in {
	box-shadow: inset 3px 3px 3px rgba(0, 0, 0, 0.16);
}

.block-shadow-round-in-2,
.block-shadow-in-2,
.bsr-in2,
.bs-in2 {
	box-shadow: inset 3px 3px 3px rgba(0, 0, 0, 0.16), inset -1px -1px 3px rgba(0, 0, 0, 0.16);
	background-color: #ebebeb !important;
}

.block-top-round {
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}

.center-block {
	position: absolute !important;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

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

.center-bottom-block {
	position: absolute !important;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(50%);
}

.center-top-block {
	position: absolute !important;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-200%);
}

.canvas_over {
	position: absolute;
	top: 0;
	left: 0;
	border: none;
	width: 100%;
}

.orient-v {
	transform: rotate(-90deg);
}

/********************** V3 ******************************/
.cursor-pointer {
	cursor: pointer;
}

.block-word-40 {
	height: 40px;
	background-color: #fff;
}

.block-word-50 {
	height: 40px;
	background-color: #fff;
}

.block-word-80-50 {
	width: 80px;
	height: 50px;
	background-color: #fff;
}

.block-word-70-50 {
	width: 70px;
	height: 50px;
	background-color: #fff;
}

.bmw160 {
	min-width: 160px;
	background-color: #fff;
}

.text-break {
	word-break: break-word !important;
	overflow-wrap: break-word !important;
	white-space: pre-wrap;
}

.w100 {
	width: 100%;
}

.w90 {
	width: 90%;
}

.w95 {
	width: 95%;
}

.w80 {
	width: 80%;
}

.w70 {
	width: 70%;
}

.w60 {
	width: 60%;
}

.w50 {
	width: 50%;
}

.w40 {
	width: 40%;
}

.w30 {
	width: 30%;
}

.w20 {
	width: 20%;
}

.h100 {
	height: 100%;
}

.h80 {
	height: 80%;
}

.h75 {
	height: 75%;
}

.h70 {
	height: 70%;
}

.h50 {
	height: 50%;
}

.b10 {
	width: 10px;
	height: 10px;
}

.b20 {
	width: 20px;
	height: 20px;
}

.b30 {
	width: 30px;
	height: 30px;
}

.b40 {
	width: 40px;
	height: 40px;
}

.mb50 {
	margin-bottom: 50px;
}

.mb15 {
	margin-bottom: 15px;
}

.mb10 {
	margin-bottom: 10px;
}

.mb5 {
	margin-bottom: 5px;
}

.mt20 {
	margin-top: 20px;
}

.mt10 {
	margin-top: 10px;
}

.mt5 {
	margin-top: 5px;
}

.mr5 {
	margin-right: 5px;
}

.m10 {
	margin: 10px;
}

.m15 {
	margin: 15px;
}

.m4 {
	margin: 4px;
}

.mb-n30 {
	margin-bottom: -30px;
}

.pt15 {
	padding-top: 15px;
}

.p10 {
	padding: 10px;
}

.p20 {
	padding: 20px;
}

.plr10 {
	padding-left: 10px;
	padding-right: 10px;
}

.p4 {
	padding: 4px;
}

.bg-grey {
	background-color: #ccc;
}

.presentation-block-v1 {
	position: relative;
	width: 80%;
	padding: 40px;
	height: auto;
	background-color: #f7f7f7;
	font-size: 20px;
	color: #000000;
	margin-bottom: 10px;
}

.presentation-block-v1 button {
	position: absolute;
	right: 20px;
	bottom: -10px;
}

.presentation-block-v1 ol {
	list-style: decimal;
}

.presentation-block-v1 ul {
	list-style: disc;
	margin-left: 1em;
}

.presentation-block-v1 p {
	padding-top: 10px;
}

.presentation-block-v1 p:first-child {
	padding-top: 0px;
}

.circle {
	border-radius: 50%;
}

.p-absolute {
	position: absolute;
}

.p-relative {
	position: relative;
}

.text-align-left {
	text-align: left !important;
}

.text-align-center {
	text-align: center !important;
}

.h-center {
	margin-left: auto;
	margin-right: auto;
}

/**************************************************/
/*      __MODAL WINDOW__                          */
/**************************************************/
.perspective {
	-webkit-perspective: 200px;
	/* Chrome, Safari, Opera  */
	perspective: 200px;
}

.smw-overlay {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	position: fixed;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1990;
}

.smw-content {
	position: fixed;
	top: 50%;
	left: 50%;

	max-width: 800px;
	min-width: 300px;
	min-height: 200px;

	z-index: 2000;
	background-color: #fff;

	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.7);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.7);
	-ms-transform: translateX(-50%) translateY(-50%) scale(0.7);
	transform: translateX(-50%) translateY(-50%) scale(0.7);

	opacity: 0;

	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	transition: all 0.4s;
}

.smw-content.on {
	opacity: 1;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1);
	-ms-transform: translateX(-50%) translateY(-50%) scale(1);
	transform: translateX(-50%) translateY(-50%) scale(1);
}

.smw-content.info {
	height: 200px;
}

.smw-content.success,
.smw-content.error {
	height: 350px;
	text-align: center;
	font-size: 30px;
}

.smw-content.success p,
.smw-content.error p {
	font-size: 22px;
	font-style: italic !important;
	font-family: Calibri, Conv_Calibri !important;
}

.smw-content.success {
	color: #1db04f;
}

.smw-content.error {
	color: #d74343;
}

.smw-content .cancel-mini {
	position: absolute;
	top: -12px;
	right: -12px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 2px solid #fff;
	box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.2) inset;
	transform: rotate(45deg);
	background-color: #31aae3;
	color: #fff;
	font-size: 40px;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
	text-align: center;
	line-height: 32px;
	cursor: pointer;
	box-sizing: border-box;
}

.smw-content .cancel-mini:before {
	content: "+";
}

.smw-content > button {
	font-family: Conv_Junegull;
	font-size: 17px;
	font-weight: 100;
	text-transform: uppercase;
	color: #fff;
	padding: 5px 25px;
	background: linear-gradient(#f48e36, #f2742b) no-repeat;
	border-radius: 11px;
	border: none;
	margin: 10px 370px;
	cursor: pointer;

	box-shadow: 2px 2px 2px #aaa, 0px 1px 2px 0px rgba(0, 0, 0, 0.3), inset 0px 1px 0px 1px rgba(255, 255, 255, 0.3);
	width: 162px;
	height: 46px;
	margin-bottom: 20px;
}

.smw-content.hidden {
	-webkit-animation: hide 0.4s ease;
	/* cubic-bezier(.08,.82,.57,1);*/
	animation: hide 0.4s ease;
	/* cubic-bezier(.08,.82,.57,1);*/
	min-width: 0px;
	min-height: 0px;
}

@-webkit-keyframes gin {
	0% {
		-webkit-transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		-moz-transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		-ms-transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		-moz-transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		-ms-transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		opacity: 0;
	}
}

@keyframes gin {
	0% {
		-webkit-transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		-moz-transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		-ms-transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		transform: translateX(-50%) translateY(-50%) rotateX(0deg) scaleX(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		-moz-transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		-ms-transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		transform: translateX(-50%) translateY(100%) rotateX(-25deg) scaleX(0);
		opacity: 0;
	}
}

@-webkit-keyframes rotate {
	0% {
		-webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		-moz-transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		-ms-transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		-moz-transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		-ms-transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		opacity: 0;
	}
}

@keyframes rotate {
	0% {
		-webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		-moz-transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		-ms-transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		transform: translateX(-50%) translateY(-50%) rotate(0deg) scale(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		-moz-transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		-ms-transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		transform: translateX(-50%) translateY(-50%) rotate(360deg) scale(0.5);
		opacity: 0;
	}
}

@-webkit-keyframes hide {
	0% {
		-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
		-moz-transform: translateX(-50%) translateY(-50%) scale(1);
		-ms-transform: translateX(-50%) translateY(-50%) scale(1);
		transform: translateX(-50%) translateY(-50%) scale(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateX(-50%) translateY(-50%) scale(0.5);
		-moz-transform: translateX(-50%) translateY(-50%) scale(0.5);
		-ms-transform: translateX(-50%) translateY(-50%) scale(0.5);
		transform: translateX(-50%) translateY(-50%) scale(0.5);
		opacity: 0;
	}
}

@keyframes hide {
	0% {
		-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
		-moz-transform: translateX(-50%) translateY(-50%) scale(1);
		-ms-transform: translateX(-50%) translateY(-50%) scale(1);
		transform: translateX(-50%) translateY(-50%) scale(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateX(-50%) translateY(-50%) scale(0.5);
		-moz-transform: translateX(-50%) translateY(-50%) scale(0.5);
		-ms-transform: translateX(-50%) translateY(-50%) scale(0.5);
		transform: translateX(-50%) translateY(-50%) scale(0.5);
		opacity: 0;
	}
}

/**************************************************/
/*      __GREETING __                          */
/**************************************************/
.game-greeting {
	min-height: 400px;
}

.game-greeting .header {
	margin-top: 20px;
	border-bottom: 1px solid #e8e8e8;
}

.game-greeting h1 {
	font-size: 25px;
	color: #f38231;
	padding-left: 57px;
	height: 116px;
	max-width: 630px;
}

.game-greeting h2,
.game-greeting h3 {
	font-size: 16px;
	color: #31aae3;
	text-transform: uppercase;
	padding-left: 57px;
}

.game-greeting h2 {
	margin-top: 5px;
}

.game-greeting h3 {
	margin-top: 50px;
}

.game-greeting h1 p,
.game-greeting h3 p {
	color: #000;
	text-transform: none;
}

.game-greeting h1 p {
	font-size: 22px;
}

.game-greeting h3 p {
	font-size: 20px;
	width: 80%;
	margin: 10px 0;
}

.game-greeting > div.circle {
	position: absolute;
	display: inline-block;
	width: 350px;
	height: 350px;
	border: 4px solid #fff;
	border-radius: 50%;
	right: -55px;
	bottom: -55px;
	box-shadow: inset 0px 0px 3px rgba(0, 0, 0, 0.3), -1px 3px 8px rgba(0, 0, 0, 0.27);
}

.game-greeting > p {
	font-family: Calibri, Conv_Calibri;
	font-size: 16px;
	color: #727272;
	width: 54%;
	padding-left: 57px;
}

.quiz .game-point,
.game-greeting .game-point {
	border-style: solid;
	border-width: 1.5px;
	border-color: #f4893d;
	border-radius: 10px;
	background-image: -moz-linear-gradient(
		52deg,
		rgb(204, 204, 204) 19%,
		rgb(217, 217, 217) 52%,
		rgb(230, 230, 230) 100%
	);
	background-image: -webkit-linear-gradient(
		52deg,
		rgb(204, 204, 204) 19%,
		rgb(217, 217, 217) 52%,
		rgb(230, 230, 230) 100%
	);
	background-image: -ms-linear-gradient(
		52deg,
		rgb(204, 204, 204) 19%,
		rgb(217, 217, 217) 52%,
		rgb(230, 230, 230) 100%
	);
	box-shadow: 2.121px 2.121px 0px 0px rgba(0, 0, 0, 0.063);
	width: 66px;
	min-width: 66px;
	height: 66px;
	text-align: center;
	line-height: 66px;
	margin-right: 22px;
	margin-top: 5px;
}

.quiz .game-point .__point,
.game-greeting .game-point .__point {
	font-family: Conv_Archive, sans-serif;
	font-size: 34px;
	font-style: normal;
	color: rgb(249, 249, 249);
	-moz-transform: matrix(0.64145321466229, 0, 0, 0.64145321466229, 0, 0);
	-webkit-transform: matrix(0.64145321466229, 0, 0, 0.64145321466229, 0, 0);
	-ms-transform: matrix(0.64145321466229, 0, 0, 0.64145321466229, 0, 0);
}

/**************************************************/
/*      __MESSAGES__                              */
/**************************************************/
.message-info {
	padding-left: 50px;
	padding-right: 50px;
	font-size: 18px;
}

.message-info h1
/* .message-info ul,
.message-info p strong */ {
	color: #f38231;
}

.message-info h1 {
	font-size: 24px;
	min-height: 116px;
}

.message-info ul {
	/* font-size: 18px; */
	/* font-weight: 600; */
	margin: 14px 0;
}
.message-info ul li {
	list-style: disc;
	margin-left: 20px;
}

.message-info h2,
.message-info h3 {
	font-size: 16px;
	color: #31aae3;
	text-transform: uppercase;
}

.message-info h2 {
	margin-top: 5px;
}

.message-info h3 {
	margin-top: 50px;
}

.message-info h1 p,
.message-info h3 p {
	color: #000;
	text-transform: none;
}

.message-info h1 p {
	font-size: 22px;
}

.message-info h3 p {
	font-size: 20px;
	width: 80%;
}

.message-info p,
.message-info ul,
.message-info p strong {
	font-size: 18px;
	color: #727272;
}

.std-head .message-info h1 {
	color: #000;
	font-size: 22px;
}

.message-info.profile h1 {
	text-align: center;
	margin-top: 20px;
	height: auto;
	min-height: auto;
}

.message-info.profile p {
	margin: 20px 0;
}

.message-info a.btn {
	display: inline-block;
	text-align: center;
	padding: 0.5rem 0;
	height: auto !important;
	width: 200px !important;
	margin: 0 !important;
}

.message-info a.btn,
.profile button {
	width: 261px;
	height: 62px;
	-webkit-border-radius: 0 1px 1px 0;
	-moz-border-radius: 0 1px 1px 0;
	border-radius: 0 1px 1px 0;
	background-color: #37a5e5;
	border: solid 1px #f1f1f1;
	font-family: Calibri, Conv_Calibri;
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	text-shadow: 1px 1px 2px rgba(43, 135, 189, 0.53);
	margin-bottom: 20px;
	margin-right: 15px;
	cursor: pointer;
}

/**************************************************/
/*      __OTHER__                                 */
/**************************************************/
.grab {
	cursor: pointer;
	cursor: -webkit-grab;
}

.pointer {
	cursor: pointer;
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.block-hide {
	-webkit-animation: block-hide 0.4s ease;
	/* cubic-bezier(.08,.82,.57,1);*/
	animation: block-hide 0.4s ease;
	/* cubic-bezier(.08,.82,.57,1);*/
}

@-webkit-keyframes block-hide {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@keyframes block-hide {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

.block-show {
	-webkit-animation: block-show 0.4s ease;
	/* cubic-bezier(.08,.82,.57,1);*/
	animation: block-show 0.4s ease;
	/* cubic-bezier(.08,.82,.57,1);*/
}

@-webkit-keyframes block-show {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes block-show {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

ul.orig {
	display: inline-block;
	width: 100%;
	text-align: left;
}

ul.orig li {
	position: relative;
	margin-left: 12px;
}

ul.orig li::before {
	position: absolute;
	display: inline-block;
	content: "";
	top: 8px;
	left: -12px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
}

ul.orig.orange li::before {
	background-color: #f48a34;
}

.warning {
	color: #f45000;
}

.instruction {
	padding: 10px;
}

.instruction p {
	margin-top: 4px;
	color: #727272;
}

.instruction h1 {
	display: block;
	width: 100%;
	text-align: left;
	text-transform: uppercase;
	color: #31aae3;
	font-size: 16px;
	font-weight: bold;
}

.ui-draggable-dragging {
	z-index: 3000;
}

/***********************************************/
/*      __V2__                                 */
/***********************************************/
.v2-head1 {
	font-size: 2rem;
	font-weight: bold;
}
.v2-head2 {
	font-size: 1.5rem;
	font-weight: bold;
}
.v2-head3 {
	font-size: 1.1rem;
	font-weight: bold;
}
.v2-head4 {
	font-size: 0.8rem;
	font-weight: bold;
}
.v2-head5 {
	font-size: 0.5rem;
	font-weight: bold;
}
.v2-white-block {
	background-color: #ffffff;
}
.v2-light-block {
	background-color: #f7f7f7;
}
.v2-dark-block {
	background-color: #727272;
}
.v2-ad-block {
	background-color: #adadad;
}
.v2-eb-block {
	background-color: #ebebeb;
}
.v2-black-block {
	background-color: #1e1e1e;
}
.v2-variant.selected:not(.error) {
	background-color: #1b9e59 !important;
	color: #ffffff;
}
.v2-transition-all {
	transition: all 0.4s linear;
}
.v2-transition-opacity {
	transition: opacity 0.4s linear;
}
.v2-opacity-0 {
	opacity: 0;
}
.v2-text-uppercase {
	text-transform: uppercase;
}
.v2-block-shadow-round,
.v2-block-shadow {
	box-shadow: inset 2px 2px 3px rgba(0, 0, 0, 0.04), inset -3px -2px 2px rgba(0, 0, 0, 0.04),
		3px 3px 3px rgba(0, 0, 0, 0.16) !important;
}
.v2-block-round,
.v2-block-shadow-round {
	border-radius: 10px;
}

.v2-presentation-block li {
	list-style-type: disc;
	margin-left: 1.5rem;
}

.fnt-s-05 {
	font-size: 0.5rem;
}
.fnt-s-08 {
	font-size: 0.8rem;
}
.fnt-s-09 {
	font-size: 0.9rem;
}
.fnt-s-10 {
	font-size: 1rem;
}
.fnt-s-11 {
	font-size: 1.1rem;
}
.fnt-s-12 {
	font-size: 1.2rem;
}
.fnt-s-13 {
	font-size: 1.3rem;
}
.fnt-s-14 {
	font-size: 1.4rem;
}
.fnt-s-15 {
	font-size: 1.5rem;
}
.fnt-s-17 {
	font-size: 1.75rem;
}
.fnt-s-2 {
	font-size: 2rem;
}
.nowrap {
	white-space: nowrap;
}

/* End */
/* /assets/css/v2/games.css?1753871804171062 */
/* /assets/css/v2/common.css?168805075823681 */
