.charsheet { background: #fff url('http://i.imgur.com/9hEQ7Qx.png') no-repeat right; padding-right: 150px; width: 1000px; } .sheet-content { width: 848px; } .sheet-5colrow, .sheet-4colrow, .sheet-3colrow, .sheet-2colrow { width: 100%; } .sheet-left { text-align: left; } .sheet-center { text-align: center; } .sheet-right { text-align: right; } .sheet-bottom { position: relative; top: 100%; -webkit-transform: translateY(160%); -ms-transform: translateY(160%); transform: translateY(160%); } .sheet-full, input[type="number"].sheet-full { display: inline-block; width: 100%; } .sheet-vspace { margin-top: 15px; } img.sheet-logo { position: relative; top: 10px; width: 100%; display: block; } div.sheet-5colrow div.sheet-col.sheet-border { width: calc(20% - 10px); margin-right: 0px; padding-left: 4px; } div.sheet-4colrow div.sheet-col.sheet-border { width: calc(25% - 20px); margin-right: 0px; padding-left: 8px; } div.sheet-3colrow div.sheet-col.sheet-border { width: calc(33% - 30px); margin-right: 15px; padding-left: 10px; } div.sheet-2colrow div.sheet-col.sheet-border { width: calc(50% - 30px); margin-right: 13px; padding-left: 12px; } div.sheet-4colrow div.sheet-2colrow div.sheet-col:first-child { width: 60%; margin-right: 0px; padding-left: 0px; } div.sheet-4colrow div.sheet-2colrow div.sheet-col:last-child { width: 35%; margin-right: 0px; padding-left: 0px; } div.sheet-col.sheet-border:not(:first-child) { border-left: 3px #ccc solid; } div.sheet-skill { position: relative; } input[type="number"] { text-align: center; } hr { border-top: 3px #ccc solid; border-bottom: none; } input[type="radio"] { opacity: 0; position: absolute; top: 25%; left: 100%; width: 16px; height: 16px; } input[type="radio"]:hover:not(:checked), div.sheet-skill:hover input[type="radio"]:not(:checked) { opacity: 0.7; } input[type="radio"]:checked { opacity: 1; } ::-webkit-input-placeholder { font-style: italic; } ::-moz-placeholder { font-style: italic; } :-ms-input-placeholder { font-style: italic; } input:-moz-placeholder { font-style: italic; }