roll20-character-sheets/TerraDevastada/test/test.css

/*----------------- 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 ****/