/*@media (min-width:1024px){
 * */
  .sidenav{
    float:left;
    width:200px;
  }
  .content{
    margin-left:220px;
  }
  .content.nomenu{
    margin-left:0;
  }
/*}*/
@media (max-width:1023px){
  .sidenav{
    display:none;
  }
  .content{
    margin-left:0;
  }
}
nav.inner li{padding-top:0;padding-bottom:0}
.inner input{
  padding-top:0;
  padding-bottom:0;
  height:unset;
}
.inner fieldset{
  margin-bottom:0;
}
.inner hr{margin:0.5rem;}
nav.inner hgroup{margin-bottom:0}
@media (min-width: 400px){
  .grid{
    grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
  }
}
.sidenav > article > ul{
  padding-inline-start:0;
}
.sidenav li{
  padding:0;
}
.center{text-align:center;}
.gridx{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  //gap:-1px;
  //margin-bottom:50px;
}
.gridx>div{
  min-width:0;
  flex:1 1 auto;
  border: solid 1px var(--pico-primary-border);
  align-content: center;
  padding: 0 5px;
  //border-radius: 5px;
  margin-right:-1px;
}
.gridx>div>hgroup{
  margin:0;
  text-align:center;
}
.gridx>div>hgroup>p{
  //white-space:nowrap;
  font-size:1.5rem!important ;
  font-weight:bold;
}
@media (width >600px){
  .centerbox{
    max-width:510px;
    margin:auto;
  }
  div[data-chart]>p>label{
    width:49%;
  }
  div[data-chart]>p{
    width:90px;
    height:200px;
    display:flex;
    flex-direction:column;
    flex-wrap:wrap;
    float:left;
  }
  div[data-chart]>div{
    height:250px;
    width:unset;
    margin-left:100px;
  }
}
div[data-chart]>div{
  height:250px;
}
div[data-chart]{
  margin-top:30px;
  position:relative;
}
div[data-chart]:fullscreen{
  width:100vw;
  height:100vh;
}
div[data-chart]:fullscreen>p>label{
  width:auto;
}
div[data-chart]:fullscreen>p{
  position:absolute;
  display:block;
  top:0;
  left:0;
  z-index:10;
  width:unset;
  height:unset;
  background-color:white;
}
div[data-chart]:fullscreen>div{
  width:100%;
  height:100%;
  margin:0;
}
.small{
  padding-top:5px;
  padding-bottom:5px;
}
.hgicon{
  position:relative;
  margin-left:2em;
}
.hgicon p{
  font-weight:bold;
}
.hgicon span{
  position:absolute;
  bottom:0.1em;
  left:-1em;
  font-size:2em;
}

.myRadioGroup > input[type=radio]{
  position:absolute;
  opacity:0;
  width:0;
  height:0;
}
.myRadioGroup > label{
  display:inline-block;
  padding:5px 0.5em 5px;
  border: var(--pico-border-width) solid var(--pico-primary);
  color: var(--pico-primary);
  font-weight: var(--pico-font-weight);
  font-size: 1rem;
  background-color:white;
  border-radius: var(--pico-border-radius);
  cursor:pointer;
  margin:0;
  margin-inline-end:0 !important;
  text-align:center;
}
.myRadioGroup > input[type=radio]:checked + label{
  border: var(--pico-border-width) solid var(--pico-primary-border);
  background-color: var(--pico-primary-border);
  color: var(--pico-primary-inverse);
}
.flex-sep{
  flex-basis:100%;
}