@charset "UTF-8";

.radio-toolbar {
  margin: 10px;
  padding: 20px;
}

.radio-toolbar input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.radio-toolbar label {
    display: inline-block;
    background-color: #ddd;
    padding: 10px 20px;
    font-family: sans-serif, Arial;
    font-size: 16px;
    border: 2px solid #444;
    border-radius: 4px;
}

.radio-toolbar label:hover {
  background-color: #dfd;
}

.radio-toolbar input[type="radio"]:focus + label {
    border: 2px dashed #444;
}

.radio-toolbar input[type="radio"]:checked + label {
    background-color: #bfb;
    border-color: #4c4;
    color:rgb(0,0,0);
}

fieldset label {
 font-weight: normal;
 background-color:ghostwhite;
 color:black; 
 //padding: .1em;
 float:left;
 //border: 1px solid grey;
 text-align: center;
 line-height: 50px;
}

input[type="radio"]:checked+label {
 font-weight: bold;
 background-color:grey;
 color:white; 
}

fieldset span 
{display:inline-block; 
text-align: center;}
fieldset span input { display: none;}

.w-m {
  max-width: calc(3 * var(--width-min-container));
}

.w-s {
  max-width: calc(3 * var(--width-min-container));
}

.w-l {
  max-width: calc(3 * var(--width-min-container));
}


fieldset label img {
  height: 146px;
}

.cat {
 height:250px;
 width: 250px;
}

#nextbuttondiv {padding-top:10px;text-align:center}

.radio-toolbar-int {
  margin: 10px;
  padding: 20px;
}

.radio-toolbar-int input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.radio-toolbar-int label {
    display: block;
    background-color: #ddd;
    padding: 10px 20px;
    font-family: sans-serif, Arial;
    font-size: 16px;
    border: 2px solid #444;
    border-radius: 4px;
}

.radio-toolbar-int label:hover {
  background-color: #dfd;
}

.radio-toolbar-int input[type="radio"]:focus + label {
    border: 2px dashed #444;
}

.radio-toolbar-int input[type="radio"]:checked + label {
    background-color: #bfb;
    border-color: #4c4;
    color:rgb(0,0,0);
}