/*=== BOF ===*/





/*--- css-vars ---*/

:root {
  --body_background_color:#c4c4c4;
  --onemap_margin:2px;      /*                           seek also «20200116e» in js/css; */
  --onemap_margin_dbl:4px;  /* mult 2 «--onemap_margin»; seek also «20191022d» in js/css; */
  --kmap_loginer_caption_width:65px;
  --kmap_loginer_caption_width_ext:120px;
}


/*--- sys ---*/

.kmap_row::after {
  content:"";
  clear:both;
  display:table;
}


/*--- debug ---*/

.b1 { border:1px solid red;    }
.b2 { border:1px solid blue;   }
.b3 { border:1px solid green;  }
.b4 { border:1px solid yellow; }


/*--- css ---*/

/*
html {
  position: relative;
  min-height: 100%;
  //border:1px solid red;
}
*/

body { background-color:var(--body_background_color); height_:100%;
       font-family:Verdana,Arial,sans-serif; font-size:12px; }

.kmap_mainDom { margin:0px; height:100%; display:flex; flex-direction:column; }


/* no margins in 6 main panels */

.kmap_toppanel    { border_:1px red solid; }
.kmap_middlepanel { border_:1px red solid; flex:1; display:flex; flex-wrap:wrap; flex-direction:row; }
  .kmap_midleftpanel   { border_:1px yellow solid; }
  .kmap_midcenterpanel { border_:1px yellow solid; flex:1; display:flex; flex-direction:column; }
  .kmap_midrightpanel  { border_:1px yellow solid; }
.kmap_bottompanel { border_:1px red solid;  }



.kmap_newspanel { }
  .kmap_newspanel_msg { margin:5px; }


.kmap_operpanel_collapse { background-color:#d3d3d3;    
                           border:1px solid #aaaaaa; border-radius:3px; 
                           font-size:14px; color:#aaaaaa; 
                           display:flex; justify-content:center; align-items:center;
                           cursor:pointer; cursor:hand; }

.kmap_operpanel { margin-left:2px; height:0;  
                  scrollbar-width:none;  /* for firefox */
                  overflow:hidden; overflow-y:auto; }
.kmap_operpanel::-webkit-scrollbar { width:0px; }  /* for chrome, opera */

  .kmap_title   { text-align_:center; margin:4px; letter-spacing:-0.3px;
                  font-family:Verdana,Arial,sans-serif; font-size:11px; color:#999999; }

  .kmap_loginer { text-align:center; margin:4px; }

    .kmap_loginer_loggeddata { width:120px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:9px;
                               color:#999999; overflow:hidden; margin:3px 0 3px 0; }
    .kmap_loginer_mainbutton { width:120px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px;
                               margin:0px 0px 0px 0px; padding:5px 5px; background-color:#d3d3d3;
                               border:1px solid #aaaaaa; border-radius:3px; }

    .kmap_loginer_tariffstatus { width:120px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:9px;
                                 min-height:50px; display:flex; }
    .kmap_loginer_tariffstatus_active   { margin:auto; color:green; }
    .kmap_loginer_tariffstatus_noactive { margin:auto; }
    .kmap_loginer_tariffstatus_button   { width:120px; font-family:Verdana,Arial,Helvetica,sans-serif;
                                          font-size:11px; color:green;
                               margin:0px 0px 0px 0px; padding:5px 1px; background-color:#d3d3d3;
                               border:1px solid #aaaaaa; border-radius:3px; }
    .kmap_loginer_tariffstatus_hlword { }

    .kmap_loginer_text       { width:120px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:9px;
                               color:#999999; text-align_:left; margin:5px 0 5px 0; }
/*
    .kmap_loginer_panels       { margin:0px; padding:12px; border:1px solid #777777; border-radius:3px; }
    .kmap_loginer_panels_close { position:absolute; margin:3px 6px; top:0px; right:0px; font-size:14px; }
*/
    .kmap_loginer_panels       { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12px; }
    .kmap_loginer_onepanel     { float:left; margin:10px; padding:10px 20px; background-color:#d3d3d3; }
    .kmap_loginer_paneltitle   { margin:10px 0 10px 0; text-align:center; font-weight:bold; }
    .kmap_loginer_pair         { margin:2px 0; }
      .kmap_loginer_caption    { float:left; width:var(--kmap_loginer_caption_width);     }
        .kmap_loginer_caption-ext {          width:var(--kmap_loginer_caption_width_ext); }
      .kmap_loginer_input      { float:left; width:150px; }
    .kmap_loginer_buttons      { margin:10px 0 10px 0; text-align:center; }
      .kmap_loginer_button     { height:30px; padding:0 23px; 
                                 font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12px; }

  .kmap_oldbrowser { text-align:center; margin:8px 4px; font-style:italic;
                     font-family:Verdana,Arial,sans-serif; font-size:9px; color:#999999; }
    .kmap_oldbrowser_msg { width:120px; }

  .kmap_feedback { text-align:center; margin:4px; _letter-spacing:-0.3px;
                   font-family:Verdana,Arial,sans-serif; font-size:9px; color:#999999; }
    .kmap_feedback-firefox {}
    .kmap_feedback_msg { width:120px; }
    .kmap_feedback_msg_hidm { color:var(--body_background_color); }

  .kmap_underbuttons { text-align:left; margin:4px;
                       font-family:Verdana,Arial,sans-serif; font-size:9px; color_:#999999; }
    .kmap_underbuttons-firefox {}
    .kmap_underbuttons_msg { width:120px; }

  .kmap_buyform { width:570px; }
    .kmap_buyform_text { margin:5px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12px; }
      .kmap_buyform_text_bold      { font-weight:bold; }
      .kmap_buyform_text_gray      { color:#aaaaaa; }
      .kmap_buyform_text_attention { font-style:italic; font-size:11px; }
      .kmap_buyform_text_cost      { font-weight:bold; font-size:24px; color:green; padding:0 5px; }
      .kmap_buyform_buybutton_container { text-align:center; margin:16px 5px; }
        .kmap_buyform_buybutton    { height:30px; padding:0px; width:100%; color:green;
                                     font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12px; 
                                     background-color_:#d3d3d3; font-weight_:bold;
                                     border_:1px solid #aaaaaa; border-radius_:3px;
                                   } 

  .kmap_stimulform { width:350px; }
    .kmap_stimulform_text { margin:5px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12px; }
      .kmap_stimulform_buttons_container { text-align:center; margin:16px 5px 0 5px; }
        .kmap_stimulform_button { padding:0px; width:100%; margin-bottom:10px;
                                  font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12px; 
                                  background-color_:#d3d3d3; font-weight_:bold;
                                  border_:1px solid #aaaaaa; border-radius_:3px;
                                } 
          .kmap_stimulform_button-but1 { height:50px; color:green; }
          .kmap_stimulform_button-but2 { height:24px; }

  .kmap_chooser { text-align:center; margin:12px 2px; }

  .kmap_geolocator { text-align:center; margin:12px 2px; }
    .kmap_geolocator_button { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px;
              margin:2px; padding:5px 7px 5px 7px; background-color:#d3d3d3;
              border:1px solid #aaaaaa; border-radius:3px; width:27px; width:120px; }

  .kmap_biasmanager { text-align:center; margin:12px 2px; }
    .kmap_biasmanager_mainbutton { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px;
              margin:2px; padding:5px 7px 5px 7px; background-color:#d3d3d3;
              border:1px solid #aaaaaa; border-radius:3px; width:27px; width:120px; }


  .kmap_poimanager_oper { width:120px; text-align:center; margin:12px 0px 2px 0px;
                          font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; }
  .kmap_poibank_oper { width:120px; text-align_:center; margin:0px 0px;
                       font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; }
    .kmap_poibank_oper_label    {}
    .kmap_poibank_oper_checkbox { margin:0px 3px 4px 4px; }


  .kmap_optioner_oper { width:120px; text-align_:center; margin:12px 0px 12px 0px;
                        font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; }
  .kmap_option_oper { width:120px; text-align_:center; margin:0px 0px;
                      font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; }
    .kmap_option_oper_label    {}
    .kmap_option_oper_checkbox { margin:0px 3px 4px 4px; }


  .kmap_operkit { text-align:center; margin:12px 2px; }
    .kmap_operkit_mapcounter_button { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px;
              margin:2px; padding:9px 7px 10px 7px; background-color:#d3d3d3;
              border:1px solid #aaaaaa; border-radius:3px; width:27px; }
    .kmap_operkit_stdactions_button { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px;
              margin:1px; padding:3px 7px 4px 7px; background-color:#d3d3d3;
              border:1px solid #aaaaaa; border-radius:3px; width:120px; }
      .kmap_operkit_stdactions_button-firefox { letter-spacing:-0.3px; }
      .kmap_operkit_stdactions_button-spacebefore { margin-top:8px; }


.kmap_prompanel { background-color_:#cccccc; width:200px; }


.kmap_infopanel { margin:0px 3px 2px 3px; height:15px; overflow:hidden; }
  .kmap_infopanel_rightspace    { padding-right:30px; }
  .kmap_infopanel_permanentlink { display:inline-block; font-family:Verdana,Arial,Helvetica,sans-serif;
                                  font-size:11px; }
  .kmap_infopanel_actualcoords  { display:inline-block; font-family:Verdana,Arial,Helvetica,sans-serif;
                                  font-size:11px; }
  .kmap_infopanel_geolocaccur   { display:inline-block; font-family:Verdana,Arial,Helvetica,sans-serif; 
                                  font-size:11px; }
  .kmap_infopanel_copyright     { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:11px; }


.kmap_mapspanel { 
  /* border:1px red solid; */
  margin:0px 1px 0px 1px; 
  flex:1;  
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}


.kmap_mapspanel__TEST { 
  flex:1;  
  display: grid;
  grid-gap: 1px;
  grid-template-columns: repeat(3, 1fr);
}



   /* TODO 2020-01-17 - убрать kmap_mapspanel_onepartof4 и kmap_mapspanel_onepartof1 */

  .kmap_mapspanel_onepartof4 {   
     display: flex; 
     margin: var(--onemap_margin);                  /* value1 (для margin здесь) is value2/2, см ниже */
     flex-basis: calc(50% - var(--onemap_margin_dbl));  /* value2 is то, что после минуса в скобках */
     justify-content: center;
     flex-direction: column;
   }

  .kmap_mapspanel_onepartof1 {   
     display: flex; 
     margin: var(--onemap_margin);                   /* value1 (для margin здесь) is value2/2, см ниже */
     flex-basis: calc(100% - var(--onemap_margin_dbl));  /* value2 is то, что после минуса в скобках */
     justify-content: center;
     flex-direction: column;
   }



          .kmap_aim     { position:relative; }
          .kmap_biasaim { position:relative; }

             /* seek z-index/zIndex «20191229a» */
             /* seek ширину/длину четырех частей прицела (25) в «20191231d» */
            .kmap_verttop_aim    { position:absolute; z-index:1; bottom:50%;  left:50%; width:1px; height:25px; }
            .kmap_vertbottom_aim { position:absolute; z-index:1;    top:50%;  left:50%; width:1px; height:25px; }
            .kmap_horizleft_aim  { position:absolute; z-index:1;    top:50%; right:50%;height:1px;  width:25px; }
            .kmap_horizright_aim { position:absolute; z-index:1;    top:50%;  left:50%;height:1px;  width:25px; }

          .kmap_biascontrols { position:relative; }

          .kmap_map { 
             width:100%; 
             height:100%; 
             display: flex;
             justify-content: center;
             flex-direction: row;
             /* border:1px yellow solid;  */
             /* background-color:#888888; */
          }  



/*--------------------*/
/* fix for firefox */
/*--------------------*/


@-moz-document url-prefix() {
  .kmap_underbuttons-firefox              { font-family:Arial,Verdana,sans-serif; font-size:10px; }
  .kmap_feedback-firefox                  { font-family:Arial,Verdana,sans-serif; font-size:9px;  }
  .kmap_operkit_stdactions_button-firefox { letter-spacing:-0.5px; }
}


/*--------------------*/
/* fix for mobile etc */
/*--------------------*/


@media (min-width:1px) {

}


@media (min-width:361px) {

}





/*=== EOF ===*/
