/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
:root {
  /* "none"  - скрыть кнопки || "block"  - показать кнопки*/
  --display-Layout-button-add:block;

  --sbv-min-width: 592;
  --sbv-min-height: 333;

  --pr-color: #005B9C;
  --pr-color-rgb: 0, 91, 156;

  --head-color:  #005B9C;
  --text-color:  #364463;

  --pr-copyright-a: #364463;
  --pr-copyright-a-rgb: 54, 68, 99;

  --sbv-light: #f8f9fa;
  --sbv-light-rgb: 248, 249, 250;
  --sbv-white: #ffffff;
  --sbv-white-rgb: 255, 255, 255;
  --sbv-black: #000000;
  --sbv-black-rgb: 0, 0, 0;
  --sbv-dark: #3c3f41;
  --sbv-dark-rgb: 60, 63, 65;
  --sbv-red: #B22222;
  --sbv-red-rgb: 178, 34, 34;

  --sbv-app-head-hieght: 2em;
  --sbv-app-head-btn-width: 2em;

  --sbv-app-head-btn-bgcolor-rgb: 39, 45, 77;
  --sbv-app-head-btn-bgcolor-transp: 0.75;

  --sbv-app-contacts-btn-bgcolor-rgb: 39, 45, 77;
  --sbv-app-contacts-btn-bgcolor-transp: 0.75;


  --sbv-app-title-bgcolor-rgb: 255, 255, 255;
  --sbv-app-title-bgcolor-transp: 0.25;

  --sbv-app-border-color: #000000;


  --sbv-app-border-width: 0.25em;

  --scrollbar-foreground: rgba(var(--sbv-dark-rgb),0.5);
  --scrollbar-background: rgba(var(--sbv-light-rgb),0.5);
  --scrollbar-background-hover: rgba(var(--sbv-dark-rgb),0.9);
  --scrollbar-border: rgba(var(--sbv-black-rgb),0.5);
  --scrollbar-border-hover: rgba(var(--sbv-black-rgb),0.5);
  --scrollbar-size: 6px;
  --scrollbar-border-radius: 2px;

  --app_ch_ar :1;
  --app_ch_direct : column;
  --app_ch1_direct : row;
  --app_width : 100%;
  --app_height : 100%;
  --app_ch1_width : 30%;
  --app_ch1_height : 100%;
  --app_ch1_model_width : 100%;
  --app_ch1_model_height : 50%;
  --app_ch1_text_width : 100%;
  --app_ch1_text_height : 50%;
  --app_ch2_text_width : 100%;
  --app_ch2_text_height : 25%;
  --app_ch2_width : 70%;
  --app_ch2_height : 100%;
  --model-ofset-sixe: 10px;
  --model-ofset-right: var(--model-ofset-sixe);
  --model-ofset-bottom: var(--model-ofset-sixe);
}

html {
  color: var(--pr-color);
  font-size: 1em;
  line-height: 1.4;
  width: 100%;
  height: 100%;
  padding: 0;
  background-color: #ffffff;
  margin: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
  overflow: hidden;
}
body {
  width: 100%;
  height: 100%;
  font-family: "Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
  background-color: #FFFFFF;
  font-style: normal;
  font-weight: 400;
  font-size: 1rem;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.scroller {
  scrollbar-width: thin;
  scrollbar-color:  rgba(var(--pr-color-rgb),1) #DFE9EB;
}

/* Chrome, Edge and Safari */
.scroller::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}
.scroller::-webkit-scrollbar-track {
  border-radius: 5px;
  background-color: #DFE9EB;
  border: 1px solid #000000;
}

.scroller::-webkit-scrollbar-track:hover {
  background-color: #B8C0C2;
}

.scroller::-webkit-scrollbar-track:active {
  background-color: #B8C0C2;
}

.scroller::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: rgba(var(--pr-color-rgb),1);
  border: 1px solid #000000;
}

.scroller::-webkit-scrollbar-thumb:hover {
  background-color: rgba(var(--pr-color-rgb),0.75);
}

.scroller::-webkit-scrollbar-thumb:active {
  background-color: rgba(var(--pr-color-rgb),0.85);
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden,
[hidden] {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.visually-hidden {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
 * Extends the .visually-hidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visually-hidden.focusable:active,
.visually-hidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * The use of `table` rather than `block` is only necessary if using
 * `::before` to contain the top-margins of child elements.
 */

.clearfix::before,
.clearfix::after {
  content: "";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

/* ==========================================================================
Protes style start
   ========================================================================== */

p,
h1,
h2,
h3 {
  padding: 0;
  margin: 0;
}
iframe{
  border: none;
  border-width: 0;
}
.WaitingLoad{
  width: min(8em , 10vw);
  height: min(8em , 10vh);
  display: block;
  position: absolute;
  top: calc(50% - min(8em , 10vh) / 2);
  left: calc(50% - min(8em , 10vw) / 2);
  background-color:transparent;
  background-image: url('/img/pr-loader.gif');
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 2000;
}
.helper{
  width: 18em;
  height: 6em;
  display: block;
  position: absolute;
  bottom: 0.5em;
  left: calc(50% - 9em);
  background-color:transparent;
  background-image: url('/img/helper.png');
  background-size: cover;
  background-position: bottom;
  background-repeat: no-repeat;
  filter: drop-shadow(0.5em 0.5em 0.75em rgba(0,0,0,0.75));
  z-index: 21;
}
.helper.mobile{
  background-image: url('/img/helper_m.png');
}
.helper:hover{
cursor: pointer;
}
.madel-container-fullscreen{
  display: block;
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  border-radius: 0;
  box-sizing: unset;
  overflow: hidden;
  z-index: 2;

}
.madel-container-fullscreen.columns{
  width: 50vw;
}
.madel-container-fullscreen.rows{
  height: 50vh;
}
.C1 {
  display: flex;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  background-color: #ffffff;
  border-radius: 0;
  box-sizing: unset;
}

.Content_box{
  display: block;
  position: absolute;
  left: 0.25em;
  top: 2.25em;
  width: calc(100% - 0.5em);
  height: calc(100% - 2.5em);
  max-width: calc(100vw - 0.5em);
  max-height: calc(100vh - 2.5em);
  background-color:transparent;
  border: 1px solid var(--pr-color);
  border-radius: 0.25em;
  z-index: 20;
  overflow-x: hidden;
  overflow-y: auto;
}

.Content_box_max{
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  max-width: 100vw;
  max-height: 100vh;
  background-color: rgba(255,255,255,0.8);

  z-index: 19;
  overflow: hidden;
}
.Content_box_max.columns{
  width: 50%;
  left: 50%
}
.Content_box_max.rows{
  height: 50%;
  top: 50%
}
.Content_box_max.rows >.Content_box{
  left: 0.25em;
  top: 0.25em;
  width: calc(100% - 0.5em);
  height: calc(100% - 0.5em);
  max-width: calc(100vw - 0.5em);
  max-height: calc(100vh - 0.5em);
}

.Content_box_max.blur{
  filter: blur(0.25em) opacity(75%);
}
.content-body{
  width: calc(100% - 0.6em);
  height: auto;
  background-color: transparent;
  border-radius: 0.25em;
  display: block;
  padding: 0.25em;
  overflow: hidden;
  box-sizing: unset;
}
.PrLogo{
  pointer-events: none;
  width: 7em;
  height: 4.46em;
  display: flex;
  position: absolute;
  left: 0.25em;
  bottom: 0.25em;
  padding: 0;
  margin: 0;
  background-image: url('/img/s-logo-big.svg') ;
  background-size: cover;
  filter: drop-shadow(0 0 1px rgba(255,255,255,0.75));
  box-sizing: unset;
  z-index: 30;
}
.RSLogo{
  pointer-events: none;
  width: 10rem;
  height: 2.88rem;
  display: flex;
  position: absolute;
  left: calc(50% - 0.25em - 5rem);
  top: 0.25rem;
  padding: 0;
  margin: 0;
  background-image: url('/img/rs.svg') ;
  background-size: cover;
  filter: drop-shadow(1px 1px 3px rgba(255,255,255,0.75));
  box-sizing: unset;
  z-index: 30;
}
.ILCS{
  pointer-events: none;
  font-size: 25px;
  width: calc(100% - 0.5em);
  height: 1em;
  display: block;
  position: absolute;
  left: 0.25rem;
  top: 3.25rem;
  padding: 0;
  margin: 0;
  font-weight: 600;
  background: transparent;
  text-align: center;
  color: #005B9C;
  /*-webkit-text-stroke-width: 0.25px;
  -webkit-text-stroke-color: #ffffff;
   */
  filter: drop-shadow(1px 1px 3px rgba(255,255,255,0.75));

  box-sizing: unset;
  z-index: 30;
}
.PrLogo.in_app{
  top: calc(100% - 4.46em - 0.25em);
}
.main-button {
  width: 2em;
  height: 2em;
  display: flex;
  position: absolute;
  right: 0;
  top: 0;
  padding: 0;
  margin: 0;
  /*
  background-color:var(--pr-color);
   */
  background-color:rgba(0,0,0,.75);
  box-shadow: 3px 3px 3px 0 rgba(255,255,255,0.3);
  background-image: url('/img/menu-button.svg') ;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0 0 0 0.5em;
  z-index: 2000;
  box-sizing: unset;
}

.FS-button {
  width: 2em;
  height: 2em;
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
  /*
  background-color:var(--pr-color);
   */
  background-color:rgba(0,0,0,.75);
  box-shadow: 3px 3px 3px 0 rgba(255,255,255,0.3);
  background-image: url('/img/fullscreen.svg') ;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0 0 0.5em 0;
  z-index: 2000;
  box-sizing: unset;

}
.FS-button:hover {
  width: 2.5em;
  height: 2.5em;
  cursor: pointer;
  box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.3);

}

.play-button {
  width: 2em;
  height: 2em;
  display: flex;
  position: absolute;
  left: 4rem;
  top: 0;
  padding: 0;
  margin: 0;
  /*
  background-color:var(--pr-color);
   */
  background-color:rgba(0,0,0,.75);
  box-shadow: 1px 1px 3px 0 rgba(255,255,255,0.3);
  background-image: url('/img/play-btn.svg') ;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0 0 0.5em 0;
  z-index: 2000;
  box-sizing: unset;

}
.play-button:hover {
  left: 3.85rem;
  width: 2.5em;
  height: 2.5em;
  cursor: pointer;
  box-shadow: 3px 3px 5px 0 rgba(0,0,0,0.3);

}



.main-button.fill {
  background-image: url('/img/menu-button-fill.svg') ;
}
.main-button:hover {
  width: 2.5em;
  height: 2.5em;
  cursor: pointer;
  box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.3);

}
.main-menu{
  width: max(calc(21ch + 20ex + 2em), 300px);
  height: auto;
  min-height: 2em;
  max-height: calc(100% - 3.5em);
  display: flex;
  flex-direction: column;
  position: absolute;
  right: 0;
  margin: 0;
  padding: 0;
  top: 3em;
  background-color: transparent;
  /*
  background-color: rgba(0,0,0,.5);
   */
  z-index: 200;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: unset;
  pointer-events: auto;
}
.main-menu-item{
  width: calc(100% - 2em);
  height: auto;
  min-height: 1em;
  margin: 0.25em;
  padding: 0.75em;
  font-size: 100%;
  /*
  background-color:  rgba(var(--pr-color-rgb),1);
   */
  background-color: rgba(0,0,0,.75);
  border: 1px solid rgba(255,255,255,.2);
  color: rgba(var(--sbv-white-rgb),1);
  border-radius: 0.5em;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: right;
  overflow: hidden;
  box-sizing: unset;
  font-weight: normal;
  pointer-events: auto;
  box-shadow: 3px 3px 3px 0 rgba(255,255,255,.5);
}
.main-menu-item >p{
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: right;
  overflow: hidden;
  box-sizing: unset;
  font-weight: normal;
}
.main-menu-item:hover{
  cursor: pointer;
  /*
  box-shadow: 5px 5px 5px 0 rgba(var(--pr-color-rgb),0.5);
   */
  box-shadow: 5px 5px 5px 0 rgba(0,0,0,.5);
}
.main-menu-item:hover >p{
  text-decoration-line: underline;
  text-decoration-skip-ink: auto;
  text-decoration-color: rgba(var(--sbv-white-rgb),1);
  text-decoration-thickness: 1px;
  text-underline-position: under;
}
.content-btn {
  width: 2em;
  height: 2em;
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  margin: 0;
  padding: 0;
  border-radius: 0 0 0.5em 0;
  background-color: var(--pr-color);
  background-image: url('/img/close.svg') ;
  background-size: 80%;
  background-position: left 0.15em top 0.15em;
  background-repeat: no-repeat;
  box-sizing: unset;
  z-index: 2000;

}
.content-btn:hover {
  width: 2.5em;
  height: 2.5em;
  cursor: pointer;
  box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.3);
}
#Layout-button-add{
  display : var(--display-Layout-button-add);
}
.layout-button1 {
  width: 2em;
  height: 2em;
  display: flex;
  position: absolute;
  left: 2.5em;
  top: 0;
  padding: 0;
  margin: 0;
  background-color:var(--pr-color);
  background-image: url('/img/layout-box.svg') ;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0 0 0.5em 0.5em;
  z-index: 2000;
  box-sizing: unset;
}
.layout-button1:hover {
  left: 2.25em;
  width: 2.5em;
  height: 2.5em;
  cursor: pointer;
  box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.3);
}
.layout-button2 {
  width: 2em;
  height: 2em;
  display: flex;
  position: absolute;
  left: 5em;
  top: 0;
  padding: 0;
  margin: 0;
  background-color:var(--pr-color);
  background-image: url('/img/layout-box.svg') ;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0 0 0.5em 0.5em;
  z-index: 2000;
  box-sizing: unset;
}
@media only screen and (max-width: 699px){
  #layout-button2 {
    left: 2.5em;
  }
  #layout-button1 {
    display: none;
  }
}
@media only screen and (min-width: 700px){
  #layout-button2 {
    left: 5em;
  }
  #layout-button1 {
    display: flex;
  }
}
@media only screen and  (max-height: 699px) {
  #layout-button2 {
    display: none;
  }
}
@media only screen and (min-height: 700px)  {
  #layout-button2 {
    display: flex;
  }
}


.layout-button2:hover {
  left: 4.75em;
  width: 2.5em;
  height: 2.5em;
  cursor: pointer;
  box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.3);
  @media only screen and  (max-width: 799px){
    left: 2.25em;
  }

}
.layout-button1.columns {
  background-image: url('/img/layout-columns.svg') ;
}
.layout-button1.rows {
  background-image: url('/img/layout-rows.svg') ;
}
.layout-button1.box {
  background-image: url('/img/layout-box.svg') ;
}
.layout-button2.columns {
  background-image: url('/img/layout-columns.svg') ;
}
.layout-button2.rows {
  background-image: url('/img/layout-rows.svg') ;
}
.layout-button2.box {
  background-image: url('/img/layout-box.svg') ;
}
.Copyright {
  width: auto;
  max-width: calc(100% - 0.8em);
  height: auto;
  display: block;
  position: absolute;
  right: 0.25em;
  bottom: 0.25em;
  font-size: 0.75em;
  font-weight: normal;
  padding: 0.15em;
  margin: 0;
  background-color: rgba(255,255,255, 0.75);
  border-radius:0.25em;
  color: var(--pr-color);
  z-index: 10;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.Copyright > a:link { text-decoration: none;   font-weight: normal; color: var(--pr-color);}
.Copyright > a:visited { text-decoration: none;  font-weight: normal; color: var(--pr-color);}
.Copyright > a:active { text-decoration: none;  font-weight: normal; color: var(--pr-color);}
.Copyright > a:hover { text-decoration: none;  font-weight: normal; color: var(--sbv-black);}
.Copyright:hover {color: var(--sbv-black);}
.fps{
  display: block;
  width: 6em;
  height: 2em;
  background-color: black;
  color: white;
  border: 2px solid red;
  z-index: 2000;
  position: absolute;
  left: calc(50% - 3em - 1px);
  bottom: 0.5em;
}

.Info-box{
  display: flex block;
  width: 35%;
  min-width: 300px;
  height: calc(100% - 4rem);
  position: absolute;
  right: 3em;
  top: 3em;
  background-color: transparent;
  pointer-events: none;
  z-index: -1;
  align-items: center;
}
.Info-cont{
  width: calc(100% - 12px);
  height: auto;
  min-height: 300px;
  max-height: calc(100% - 1px);
  background-color: rgba(0,0,0,.65);
  border-width: 6px 6px 6px 6px;
  border-style: solid;
  border-radius: 12px 0 12px 0;
  /*
  solid dashed
  up right down left
   */
  border-color: rgba(255,255,255,0.3);
  color: rgba(255,255,255,1);
  box-shadow: 0 0 10px 1px rgba(255,255,255,0.5);
display: flex block;
  position: relative;
  flex-direction: column;
  pointer-events: auto;
}
.Info-cont-attachment{
  width: 100%;
  height: auto;
  max-height: 100%;
  padding: 0;
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
}
.Info-cont-attachment>.info-header{
  display: flex block;
  width: 100%;
  margin: 0.25rem 0.25rem 0.25rem 0.25rem;
  border-image: linear-gradient(90deg, transparent, rgba(255,255,255,1), transparent) 1;
  /*
  border-image: linear-gradient(90deg, transparent, rgba(var(--pr-color-rgb),0.95), transparent) 1;
   */
  border-bottom: 2px solid;
  text-align: center;
  align-items: center;
  color: var(--head-color);
  pointer-events: none;
}
.info-header>span{
  width: 100%;
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
  color: rgba(255,255,255,1);
  /*
  color: var(--head-color);
   */
}
.Info-cont>.Info-close{
  pointer-events: auto;
  width: 2rem;
  height: 2rem;
  background-color: rgba(150, 50, 50, 0.5);
  border-width: 2px 2px 2px 2px;
  border-style: solid;
  background-image: url('/img/close.svg') ;
  background-size: 80%;
  background-position: center;
  background-repeat: no-repeat;
  border-color: rgba(255,255,255,0.2);
  color: rgba(255,255,255,1);
  box-shadow: 0 0 10px 1px rgba(255,255,255,0.5);
position: absolute;
  right: -2rem;
  top: 0.25rem;
  border-radius: 50%;
}
.Info-cont>.Info-close:hover{
  right: -1.75rem;
  top: 0;
  width: 2.5rem;
  height: 2.5rem;
  background-color: rgba(238, 5, 5, 0.7);
  border-color: rgba(255,255,255,0.5);
cursor: pointer;
}
.Info-cont-attachment>.Info-img_cont{
  display: flex;
  width: calc(100% - 0.2rem);
  margin: 0.05rem 0.1rem 0.05rem 0.1rem;
  /*
  border: 1px dashed red;
   */
  flex-direction: row;
}
.Info-img_cont_sec{
  display: flex block;
  width: calc(100% - 0.1rem);
  margin: 0.05rem 0.05rem 0.05rem 0.05rem;
  /*
  border: 1px dashed greenyellow;
   */
  align-items: center;
}
.Info-img_cont_sec.s50{
  width: calc(50% - 0.1rem);
}
.Info-img_cont_sec.s40{
  width: calc(40% - 0.1rem);
}
.Info-img_cont_sec.s60{
  width: calc(60% - 0.1rem);
}

.Info-img_cont_sec >img{
  display: flex block;
  width: 100%;
  height: auto;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.5);
  /*
  border: 1px solid var(--pr-color);
   */
}

.Info-test_cont{
  display: flex;
  width: calc(100% - 1rem);
  margin: 0.05rem 0.5rem 0.05rem 0.5rem;
  flex-direction: column;
  font-size: 1rem;
  font-weight: 400;
}
.Info-test_cont >span{
  font-size: 1rem;
  font-weight: 400;
  display: flex;
  padding-left: 0.25rem;
}
.Info-test_cont >ul{
  display: flex;
  flex-direction: column;
  *padding: 0;
  margin: 0;

  list-style: square;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: left;
  *margin-block-start: 1rem;
  margin-block-end: 1rem;
  margin-inline-start: 1rem;
  margin-inline-end: 1rem;
  padding-inline-start: 2px;

}
.Info-test_cont >ol >li{
  font-size: 1rem;
  font-weight: 300;
  display: flex;
  padding-left: 2rem;
  /*padding-left: 1rem;
  margin-bottom: 0;

   */
}
/* ==========================================================================
Protes style end
   ========================================================================== */
.stats {
  position: absolute;
  bottom: 0.5em;
  left: 0.5em;
  z-index: 9999;
}