/*-----text-----*/ .sheet-bold{ color:black; font-size: 16px; font-weight: bold; text-shadow: 2px 2px 1px #cccccc; } .sheet-primer{ color:black; font-size: 14px; font-weight: bold; text-shadow: 2px 2px 1px #ffccaa; } .sheet-reminder{ color:#555555; font-size: 8px; font-style: italic; font-weight: bold; text-shadow: 0px 0px 8px gray; } .table-strategy { background: #ffccff; } .sheet-strategy { color:purple; font-size: 14px; font-weight: bold; text-shadow: 0px 0px 8px gray; text-align: center } .table-tactic { background: #ccffcc; } .sheet-tactic { color:green; font-size: 12px; font-style: italic; text-shadow: 0px 0px 8px gray; text-align: center } .sheet-center { text-align: center } .sheet-left { text-align: left } .sheet-right { text-align: right } .sheet-top{ vertical-align: top; text-shadow: 3px 3px 2px #cccccc; } /*-----textarea-----*/ textarea { height: 50px; } /*-----radio boxes-----*/ /* -----Hide actual radio----- */ input.sheet-normal[type="radio"] , input.sheet-reversed[type="radio"] { opacity: 0; width: 16px; height: 16px; position: relative; top: 5px; left: 6px; margin: -10px; cursor: pointer; z-index: 1; } /* -----Fake radio----- */ input.sheet-normal[type="radio"] + span::before , input.sheet-reversed[type="radio"] + span::before { margin-right: 2px; border: solid 1px #a8a8a8; line-height: 14px; text-align: center; display: inline-block; vertical-align: middle; -moz-box-shadow: 0 0 2px #ccc; -webkit-box-shadow: 0 0 2px #ccc; box-shadow: 0 0 2px #ccc; background: #f6f6f6; background: -moz-radial-gradient(#f6f6f6, #dfdfdf); background: -webkit-radial-gradient(#f6f6f6, #dfdfdf); background: -ms-radial-gradient(#f6f6f6, #dfdfdf); background: -o-radial-gradient(#f6f6f6, #dfdfdf); background: radial-gradient(#f6f6f6, #dfdfdf); color:black; width: 15px; height: 15px; font-size: 3em; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; } input.sheet-normal[type="radio"] + span::before { content: "•"; } input.sheet-reversed[type="radio"] + span::before { content: ""; } /* -----Remove dot from all radios _after_ selected one----- */ input.sheet-normal[type="radio"]:checked ~ input.sheet-normal[type="radio"] + span::before { content: ""; } /* -----Add dot to all radios _after_ (and including) selected one----- */ input.sheet-reversed[type="radio"]:checked + span::before, input.sheet-reversed[type="radio"]:checked ~ input.sheet-reversed[type="radio"] + span::before { content: "•"; } /*------------empty tactics-----------*/ input.sheet-zero[type="radio"]:checked + span::before { opacity: 0; } input.sheet-zero[type="radio"]:hover + span::before { opacity: 1; } input.sheet-zero[type="radio"] + span::before { font-size: 10px; content: "✖"; opacity: 0.25; }