/* Original Dungeons & Dragons Character Sheet CSS */
/* Version 1.5.1 */


/****************
***   FONTS   ***
****************/

@import url('https://fonts.googleapis.com/css?family=Special+Elite&display=swap');

/* end Fonts */


/**************
**  Wrapper  **
**************/

.charsheet {
	padding: 0;
}

.sheet-odd {
	max-width: 800px;
	min-width: 700px;
	margin: 0;
	padding: 10px 20px 20px;
	background: #FAFCFC;
}


/*****************
**  Typography  **
*****************/

h2, span, label, .sheet-label, .sheet-text {
	margin: 0px;
	font-family: 'Special Elite';
	font-size: 16px;
	line-height: 30px;
	font-weight: bold;
	color: #7A9EAA;
}

h2, .sheet-label, .sheet-center {
	text-align: center;
}

.sheet-label, .sheet-underline {
	text-decoration: underline;
}

/******************
***   LAYAOUT   ***
******************/

/* FLEXBOX */

.sheet-flex-row {
	display: flex;
}

.sheet-label {
	justify-content: center;
}

.sheet-flex-row.sheet-misc {
	align-items: flex-start;
}

/* GRID 16 — top and middle */

.sheet-grid-16 {
	display: grid;
	grid-template-columns: repeat(16, 1fr);
	grid-template-rows: auto;
	grid-gap: 16px;
	padding-bottom: 8px;
}
.sheet-grid-16-span-1 {
	grid-column: span 1;
}
.sheet-grid-16-span-4 {
	grid-column: span 4;
}
.sheet-grid-16-span-6 {
	grid-column: span 6;
}
.sheet-grid-16-span-8 {
	grid-column: span 8;
}
.sheet-grid-16-span-16 {
	grid-column: span 16;
}

/* GRID 3 bottom */

.sheet-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: 200px auto 51px;
	grid-gap: 8px;
	padding-bottom: 8px;
}

.sheet-grid-3-item {
	padding: 0 8px 8px 0;
}

.sheet-grid-3-item1 {
	grid-row: span 3;
	border-right: 2px dashed #7A9EAA;
}
.sheet-grid-3-item2 {
	border-right: 2px dashed #7A9EAA;
}
.sheet-grid-3-item5 {
	grid-row: span 2;
	border-top: 2px dashed #7A9EAA;
	border-right: 2px dashed #7A9EAA;
}
.sheet-grid-3-item6, .sheet-grid-3-item9 {
	border-top: 2px dashed #7A9EAA;
}

/* END Layout */


/************************
***   FORM ELEMENTS  ***
************************/

.sheet-odd label {
	margin: 0;
	padding: 0 8px 0 0;
	width: auto;
	line-height: 50px;
}

.sheet-odd input, .sheet-odd textarea {
	border-radius: 0;
	border: none;
	margin: 0;
	background: transparent;
	font-family: 'Patrick Hand';
	font-size: 20px;
	line-height: 30px;
	color: #333;
	overflow: visible;
}

.sheet-odd input {
	padding: 0 8px;
	border-bottom: 2px solid #7A9EAA;
}

.sheet-odd textarea, input.sheet-fill, .sheet-fill {
	width: 100%;
	flex-grow: 1;
	overflow: auto;
}

::placeholder {
	font-family: 'Special Elite';
	font-size: 16px;
	line-height: 30px;
	text-align: center;
}

input.sheet-attr {
	text-align: center;
}

textarea.sheet-textarea-fill {
	box-sizing:border-box;
	width: 100%;
	height: 85%
}

/* END Form Elements */

/* Misc. */

.sheet-lanuages-saves-misc {
	border-top: 2px dashed #7A9EAA;
	border-bottom: 2px dashed #7A9EAA;
	padding-top: 16px;
}

.sheet-lanuages-saves-misc-group {
	padding-bottom: 16px;
}

.sheet-coin label {
	width: 55%;
}