/*----------------- MAIN CONTAINER DEFINITIONS ------------------*/ @import url('https://fonts.googleapis.com/css?family=Special+Elite&display=swap'); .sheet-main-container { min-height: 600px; min-width: 800px; max-width: 1000px; padding: 10px; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/TerraDevastada/imgs/terradevastada-background.jpg"); } /*----------------- GENERAL CSS ------------------*/ .sheet-main-font { font-family: 'Special Elite'; font-size: 17px; color: #604241; } .sheet-flex-row { display: flex; flex-direction: row; flex-wrap: wrap; } .sheet-flex-column { display: flex; flex-direction: column; flex-wrap: wrap; } .sheet-nowrap { flex-wrap: nowrap; } .sheet-main-container input[type=text] { margin: 2px; width: 100%; flex-grow: 1; border: none; border-bottom: 1.5px solid #604241; background-color: transparent; color: black; } .sheet-main-container input[type=text]:focus, .sheet-main-container textarea:focus { background-color: white; } .sheet-main-container ::placeholder { color:#604241; font-style: italic; } .sheet-main-container input[type=number] { width: 40px; } .sheet-main-container fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } .sheet-main-container textarea { margin: 2px; flex-grow: 1; min-height: 10em; border: 1.5px solid #604241; background-color: transparent; color: black; } .sheet-section { margin: 0.7em; } .sheet-section-title { margin-bottom: 10px; text-transform: uppercase; font-weight: 1000; } .sheet-button-title { margin-right: 10px; text-transform: uppercase; font-weight: 1000; } .sheet-grow { flex-grow: 1; } .sheet-center { justify-content: center; align-items: center; } .sheet-vertical-divisor { border-right: 1.5px solid #443a39; } .sheet-big-margin-bottom { margin-bottom: 20px; } .sheet-repeatable-item { margin-bottom: 5px; } /*------------- GRID SECTIONS -------------*/ .sheet-header { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-areas: ". logo buttons"; } .sheet-logo-area { grid-area: logo; } .sheet-buttons-area { grid-area: buttons; justify-content: flex-end; align-items: flex-end; } .sheet-logo { } .sheet-dice-box { justify-content: flex-end; align-items: center; margin-bottom: 10px; } .sheet-middle-section { justify-content: flex-start; } .sheet-left-column { justify-content: stretch; width: 50%; } .sheet-right-column { width: 50%; } .sheet-bottom-section { margin: 30px; } .sheet-conviction-bonus { justify-content: space-evenly; width:100%; font-style: italic; margin-top: 10px; } .sheet-footer { font-style: italic; font-size: 12px; justify-content: flex-end; } /******* conviction boxes ********/ .sheet-conviction-box { margin: 0px 10px 0px 10px; } .sheet-conviction-box-size1 { width: 25px !important; height: 25px !important; } .sheet-conviction-box-size2 { width: 30px !important; height: 30px !important; margin-top: 10px !important; } .sheet-conviction-box-size3 { width: 35px !important; height: 35px !important; margin-top: 15px !important; } .sheet-conviction-box-size4 { width: 40px !important; height: 40px !important; margin-top: 20px !important; } .sheet-conviction-box-size5 { width: 45px !important; height: 45px !important; margin-top: 25px !important; } .sheet-conviction-box-size6 { width: 50px !important; height: 50px !important; margin-top: 30px !important; } .sheet-conviction-radio { position: absolute; margin: 0px !important; z-index: 1; opacity: 0; } .sheet-circle-box { display: none; height: 100%; width: 100%; } .sheet-blank-box { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/TerraDevastada/imgs/circleblank.png"); background-size: 100%; } .sheet-checked-box { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/TerraDevastada/imgs/circle_checked.png"); background-size: 100%; } .sheet-filled-box { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/TerraDevastada/imgs/circle_filled.png"); background-size: 100%; } input.sheet-blank-radio { z-index: 2; } input.sheet-blank-radio:checked + input.sheet-checked-radio, input.sheet-checked-radio:checked + input.sheet-filled-radio { z-index: 3; } input.sheet-blank-radio:checked ~ div.sheet-blank-box, input.sheet-checked-radio:checked ~ div.sheet-checked-box, input.sheet-filled-radio:checked ~ div.sheet-filled-box { display: inline-block; } /***** end conviction boxes ****/