.sheet-container { width: 811px; } .sheet-row { box-sizing: border-box; width: 100%; clear: both; } .sheet-top-row label, .sheet-top-row input { float: left; } .sheet-col1 { box-sizing: border-box; width: 10%; float: left; } .sheet-col2 { box-sizing: border-box; width: 20%; float: left; } .sheet-col3 { box-sizing: border-box; width: 25%; float: left; } .sheet-col4 { box-sizing: border-box; width: 33.33%; float: left; } .sheet-col5 { box-sizing: border-box; width: 40%; float: left; } .sheet-col6 { box-sizing: border-box; width: 50%; float: left; } .sheet-col9 { box-sizing: border-box; width: 75%; float: left; } .sheet-col10 { box-sizing: border-box; width: 80%; float: left; } .sheet-col12 { box-sizing: border-box; width: 100%; } .sheet-logo-col { box-sizing: border-box; width: 50%; } .sheet-logo { box-sizing: border-box; width: 100%; } .sheet-form-row { box-sizing: border-box; width: 100%; clear: both; padding-top: 10px; } .sheet-char-details { padding: 0 10px 0 0; } input[type="number"], input[type="text"] { width: 100%; border-radius: 0px; border-color: #000; } h2 { font-size: 12px; } /* Hide actual dot/checkbox */ input[type="radio"], input[type="checkbox"] { position: absolute; opacity: 0; width: 15px; cursor: pointer; z-index: 10; margin-top: 5px; } /* Styles common to fake dot and checkbox */ input[type="radio"] + span::before, input[type="checkbox"] + span::before { border: solid 1px #000000; line-height: 11px; text-align: center; display: inline-block; vertical-align: middle; -moz-box-shadow: 0 0 0px #000; -webkit-box-shadow: 0 0 0px #000; box-shadow: 0 0 0px #000; background: #000000; 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); } /* Styles unique to fake dot (checked or left of checked) */ input[type="radio"] + span::before { content: "•"; width: 10px; height: 10px; font-size: 26px; font-family: "Arial"; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; } /* Styles unique to fake checkbox (unchecked) */ input[type="checkbox"] + span::before { position: relative; content: ""; opacity: 1; width: 10px; height: 10px; font-size: 12px; -moz-border-radius: 1px; -webkit-border-radius: 1px; border-radius: 1px; } /* Styles unique to fake checkbox (checked) */ input[type="checkbox"]:checked + span::before { content: "✖"; color: #a00; -moz-box-shadow: 0 0 2px transparent; -webkit-box-shadow: 0 0 2px transparent; box-shadow: 0 0 2px transparent; } /* Remove dot from all radios _after_ selected one */ input[type="radio"]:checked ~ input[type="radio"] + span::before { content: ""; } input.sheet-used + span::before { content: "✖"; width: 12px; height: 12px; font-size: 12px; -moz-border-radius: 0%; -webkit-border-radius: 0%; border-radius: 0%; } input.sheet-zero:checked + span::before { opacity: 0; } input.sheet-zero:hover + span::before { opacity: 1; } input.sheet-zero + span::before { font-size: 12px; content: "✖"; opacity: 0.25; } input.sheet-DP1Spec + span::before, input.sheet-DP2Spec + span::before, input.sheet-DP2Spec + span::before, input.sheet-DP3Spec + span::before, input.sheet-DP4Spec + span::before, input.sheet-DP5Spec + span::before { opacity: 1; margin-bottom: 10px; } div.sheet-DP1, div.sheet-DP2, div.sheet-DP2, div.sheet-DP3, div.sheet-DP4, div.sheet-DP5 { display: inline; } div.sheet-DP1wSpec, div.sheet-DP2wSpec, div.sheet-DP2wSpec, div.sheet-DP3wSpec, div.sheet-DP4wSpec, div.sheet-DP5wSpec { display: none; } input.sheet-DP1Spec:checked ~ div.sheet-DP1, input.sheet-DP2Spec:checked ~ div.sheet-DP2, input.sheet-DP2Spec:checked ~ div.sheet-DP2, input.sheet-DP3Spec:checked ~ div.sheet-DP3, input.sheet-DP4Spec:checked ~ div.sheet-DP4, input.sheet-DP5Spec:checked ~ div.sheet-DP5 { display: none; } input.sheet-DP1Spec:checked ~ div.sheet-DP1wSpec, input.sheet-DP2Spec:checked ~ div.sheet-DP2wSpec, input.sheet-DP2Spec:checked ~ div.sheet-DP2wSpec, input.sheet-DP3Spec:checked ~ div.sheet-DP3wSpec, input.sheet-DP4Spec:checked ~ div.sheet-DP4wSpec, input.sheet-DP5Spec:checked ~ div.sheet-DP5wSpec { display: inline; } .sheet-skills-table .sheet-table-content .sheet-row .sheet-col4:first-child { text-align: right; padding-right: 20px; } .charsheet input[type="number"], .charsheet input[type="text"] { width: 100% !important; } .sheet-skills-table input[type="number"] { width: 3.5em !important; } .sheet-ammo-table .sheet-col4 h2 { float: left; } .sheet-ammo-table .sheet-col4 .sheet-ammo-points { margin-top: 7px; } .sheet-right-resize { width: 80%; margin-left: 90px; } .sheet-woundtrauma .sheet-col12 { margin-top: 12px; } .sheet-woundtrauma h2 { float: left; line-height: 20px; width: 60px; } .sheet-woundtrauma input[type="number"] { display: none; } .sheet-ability-table input[type="text"] { width: 50% !important; float: left; } .sheet-ability-table select { width: 45%; margin-left: 15px; } .sheet-experience { margin-top: 30px; } .sheet-experience h2 { float: left; line-height: 21px; text-align: right; width: 45%; margin-right: 10px; } .sheet-boost-adv .sheet-col6 { margin-top: 20px; } .sheet-boost-adv h2 { float: left; line-height: 20px; margin-right: 10px; } .repcontainer[data-groupname="repeating_weapons"] > .repitem > .sheet-row { height: 28px; }