| table, th, td { |
| border: 1px solid #ccc; |
| font-size:12px; |
| } |
| |
| td { |
| padding: 5px; |
| } |
| |
| .bit { |
| outline-style:solid; |
| outline-width:thin; |
| display:block; |
| text-align:center; |
| float:left; |
| width:16px; |
| height:16px; |
| font-size:12px; |
| } |
| |
| .tabs { |
| position: relative; |
| clear: both; |
| margin: 35px 0 25px; |
| background: #56616d; |
| } |
| |
| .tab { |
| float: left; |
| } |
| |
| .tab label { |
| background: #eee; |
| padding: 10px; |
| border: 1px solid #ccc; |
| margin-left: -1px; |
| position: relative; |
| left: 1px; |
| top: -29px; |
| } |
| |
| .tab [type=radio] { |
| display: none; |
| } |
| |
| .content { |
| position: absolute; |
| background: white; |
| border: 1px solid #ccc; |
| top: -1px; |
| left: 0; |
| right: 0; |
| bottom: 0; |
| height: 600px; |
| padding: 20px; |
| opacity: 0; |
| } |
| |
| .values { |
| position: absolute; |
| left: 250px; |
| } |
| |
| [type=radio]:checked ~ label { |
| background: white; |
| border-bottom: 1px solid white; |
| z-index: 2; |
| } |
| |
| [type=radio]:checked ~ label ~ .content { |
| z-index: 1; |
| opacity: 1; |
| } |