
#layoutMenu_InfoPanel_Header,
#layoutMenu_Circles_Header{
    text-align: left;
    padding-left: 5px;
    font-size: 2vmin;
    background: var(--main-color);
    color: var(--header-textColor);
}
#layoutMenu_InfoPanel_Data table,
#layoutMenu_Circles_Data table{width: 100%;text-align: left;table-layout: fixed;color: var(--text-color-sidePanel);background-color: var(--second-color-light);}

#layoutMenu_InfoPanel_Data th,
#layoutMenu_Circles_Data table th{
  background-color: var(--second-color);
  text-align: left;
  color: var(--header-textColor);
}
#layoutMenu_InfoPanel_Data td,
#layoutMenu_Circles_Data table td{

  text-align: left;
  cursor: pointer;
}

#layoutMenu_InfoPanel_Add,
#layoutMenu_Circles_Add{
  display: none;
  /* position: absolute; */
  /* top: 16vmin; */
  width: 90%;
  background: var(--background-color);
  display: flex;
  flex-direction: column;
  height: 66vh;
  margin: 0 auto;
  /* margin: 2vmin; */
  /* height: 28%; */
  /* overflow-x: hidden; */
  /* overflow-y: auto; */
  /* margin-left: 6vmin; */
  font-size: 2.2vmin;
  line-height: 1.5;
}

#layoutMenu_InfoPanel_Add_inputName,
#layoutMenu_Circles_Add_inputName{width: 14vmin;font-size: inherit;}

#layoutMenu_InfoPanel_Add_inputName,
#layoutMenu_Circles_Add_inputName:invalid {background: initial;}

#problemPanel_InfoPanel_Add_Submit,
#layoutMenu_InfoPanel_Add_Submit,
#layoutMenu_Circles_Add_Submit{
  cursor: pointer;
  height: 3vmin;
  font-size: inherit;
}

.layoutMenu_CirclePosition_highlight,
.layoutMenu_InfoPanel_highlight{
  background-color: var(--second-color);
}

#layoutMenu_InfoPanel_Add_inputName:invalid +
#layoutMenu_InfoPanel_Add_Submit{
        background-color: rgb(146, 146, 146) !important;
        pointer-events: none;
}

#layoutMenu_Circles_Add_inputName:invalid +
#layoutMenu_Circles_Add_Submit{
        background-color: rgb(146, 146, 146) !important;
        pointer-events: none;
}


#infoPanelLayoutSettingHolder{
  display: none;
  position: absolute;
  top:0;
  left:0;
  background: var(--background-color);
  width: -webkit-fill-available;
  height: -webkit-fill-available;
  background-color: white;
  overflow: auto;
  font-size: inherit;
}
.headerLabel{
  font-size:2vmin;
  color:var(--header-textColor);
}
#infoPanelLayoutSettingHolder div{
}
#infoPanelLayoutSettingHolder>div>button{
  display: -webkit-box;
  width: -webkit-fill-available;
  white-space: pre;
}

#infoPanelLayoutSetting_MatrixDiv{
  font-size: 1vmin;
}

#infoPanelLayoutSetting_MatrixDiv th{
}

#infoPanelLayoutSetting_MatrixTable{
  width:100% !important;
}

.MatrixTable_Checkbox{
  width: -webkit-fill-available;
  height: -webkit-fill-available;
  transform: scale(2.7);
}

.MatrixTable_Checkbox:checked::before{
  content: '✓';
  font-size: 3em;
  margin-top: -0.3em;
  margin-left: -0.5em;
  position: absolute;
  display: none;
  /* opacity: 1 !important; */
  color: black;
  background-color: green;
  height: 0.9em;
}

#infoPanelLayoutSetting_MatrixTable td{border-left: 1px solid;border-color: gainsboro;}
#infoPanelLayoutSetting_GeneralDiv{
    display: block;
    margin: auto;
    font-size: 1.6vmin;
}

#infoPanelLayoutSetting_GeneralDiv div{
    /* background-color:#68ad13; */
    padding: 3vmin;
}

#saveGeneralInfoPanelLayout{
  position: fixed;
  right: 4vmin;
  bottom: 4vmin;
  width: inherit !important;
}
#closelInfoPanelLayoutSettingHolder{
  position: absolute;
  right: 1vmin;
  top: 1vmin;
}
#infoPanelLayoutSetting_GeneralDiv_NameHeader{
  position: absolute;
  left: 1vmin;
  top: 1vmin;
}


