*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family:sans-serif;}

.sheet-wrapper{
	width:100%;
	min-width:750px !important;
	position:relative;
	border:1px solid black;
}

div{
	position:relative;
}

input[type="text"], textarea {
	width:calc(100% - 75px);
	font-size:14px;
	color:#000080;
	border:1px solid gray;
	font-family:cursive;
	padding:0 5px;
	margin:0;
}

textarea{
	resize:vertical;
	padding:5px;
}

select {
	color:#000080;
	font-family:cursive;
}

input[type="text"]:focus, textarea:focus, select:focus {
	background:#D1EEEE;
}

table {
	width:calc(100% - 5px);
	border-collapse:separate;
	font-size:16px;
}

label{
	font-weight:bold;
	font-variant: small-caps;
	font-size:1.2em;
	display:block;
	font-family:serif;
}

span.sheet-span_right{
	display: inline-block;
    float: right;
	padding-top:5px;
	text-align:right;
}

span.sheet-span_left{
	display: inline-block;
    float: left;
	padding-top:5px;
	text-align:left;
}

span.sheet-info{
	float:right;
	margin:0 20px 0 0;
    font-size: 12px;
    line-height: 22px;
}

/*Tabs*/

input.sheet-tab[type=radio] {
	margin:0;
}

input.sheet-tab {
    height: 30px;
    z-index: 4;
    opacity: 0;
}

input.sheet-tab,
input.sheet-tab + span {
    position: absolute;
    right: 5px;
	height: 30px;
	text-align:center;
	font-weight:bold;
	font-variant: small-caps;
}

input.sheet-tab + span {
    display: inline-block;
    padding: 5px;
    border: 1px solid black;
    border-top: none;
    background: #ddd;
    z-index: 1;
}

input.sheet-tab + span::before {
    content: attr(title);
}

input.sheet-tab[value=dmc] {
    top: 0;
    right: -1px;
    width:calc(45% - 145px);
}
input.sheet-tab[value=dmc] + span {
    top: 0;
    right: -1px;
	width:calc(45% - 144px);
}


input.sheet-tab.sheet-dmc[value=dmc-minion] {
    top: 29px;
    right: -1px;
    width:calc(22.5% - 72px);
}
input.sheet-tab.sheet-dmc[value=dmc-minion] + span {
    top: 29px;
    right: -1px;
	width:calc(22.5% - 71px);
	border-top:1px dashed gray;
	border-radius: 0 0 4px 4px;
}


input.sheet-tab.sheet-dmc[value=dmc-dmc] {
    top: 29px;
    right:calc(22.5% - 74px);
    width:calc(22.5% - 72px);
}
input.sheet-tab.sheet-dmc[value=dmc-dmc] + span {
    top: 29px;
    right:calc(22.5% - 74px);
	width:calc(22.5% - 71px);
	border-top:1px dashed gray;
	border-radius: 0 0 4px 4px;
}


input.sheet-tab[value=character] {
    top: 0;
    right:calc(45% - 146px);
    width:calc(55% - 144px);
}
input.sheet-tab[value=character] + span {
    top: 0;
    right:calc(45% - 146px);
	width:calc(55% - 144px);
}


input.sheet-tab.sheet-char[value=character-sheet] {
    top: 30px;
    right: calc(50% - 146px);
    width:calc(50% - 144px);
}
input.sheet-tab.sheet-char[value=character-sheet] + span {
    top: 30px;
    right: calc(50% - 146px);
	width:calc(25% - 71px);
	border-top:1px dashed gray;
}


input.sheet-tab:checked + span {
    z-index: 3;
    background: #E6DD93;
}

div.sheet-tab{
	display:none;
	position: relative;
    z-index: 2;
}

input.sheet-sub, input.sheet-sub + span{
	display:none;
}

input.sheet-tab[value=dmc]:checked ~ div.sheet-dmc-wrapper,
input.sheet-tab[value=dmc]:checked ~ input.sheet-dmc,
input.sheet-tab[value=dmc]:checked ~ input.sheet-dmc + span,
input.sheet-tab[value=character]:checked ~ div.sheet-character-wrapper/*,
input.sheet-tab[value=character]:checked ~ input.sheet-char,
input.sheet-tab[value=character]:checked ~ input.sheet-char + span*/ {
	display: block;
}

input.sheet-dmc[value=dmc-dmc]:checked ~ div.sheet-dmc-wrapper div.sheet-dmcs-wrapper,
input.sheet-dmc[value=dmc-minion]:checked ~ div.sheet-dmc-wrapper div.sheet-minions-wrapper,
input.sheet-char[value=character-sheet]:checked ~ div.sheet-character-wrapper div.sheet-pc-wrapper {
	display:block;
}

/*Head*/
.sheet-head{
	border-bottom:1px solid black;
	margin:0 0 5px;
	padding:5px;
	position:relative;
	height:116px;
}

.sheet-title{
	position: absolute;
    bottom: 5px;
    right: 5px;
    text-align: right;
    margin: 0;
}

.sheet-title h2{
	font-family:serif;
	font-size:30px;
	margin:0;
	vertical-align:bottom;
	font-variant: small-caps;
}

.sheet-logo{
	float:left;
	position:relative;
	margin:-5px 0 -5px -5px;
	padding:5px;
	background:white;
	height:115px;
}

.sheet-logo img
{
	border: 0;
    outline: 0;
    color: #660000;
    font-weight: bold;
    font-family: fantasy;
    font-variant: small-caps;
    text-shadow: 1px 1px 1px #555;
    font-size: 50px;
    height: 105px;
    line-height: 105px;
    text-align: center;
}

/*Player*/

.sheet-pc-wrapper {
    min-height: 500px !important;
    padding: 5px;
}

.sheet-left_cont{
	float:left;
	width:49.5%;
	clear:left;
}

.sheet-right_cont{
	float:right;
	width:49.5%;
}

.sheet-left_cont div,
.sheet-right_cont div
{
	padding:10px 0;
}

.sheet-pc-wrapper .sheet-approaches label,
.sheet-pc-wrapper .sheet-disciplines label{
	display:inline-block;
	max-width:50%;
}

/*Left Side*/

.sheet-name label{
	display:inline-block;
	max-width:50px !important;
}

.sheet-name input[type="text"]
{
	height:35px;
	font-size:15px;
	width: calc(100% - 55px);
}

.sheet-description textarea{
	height:150px;
	width:98%;
}

.sheet-aspt_table td{
	border:1px solid gray;
	height:35px;
	padding-right:3px;
	color:#888;
	font-size:10px;
	text-transform:uppercase;
	letter-spacing: -1px;
}

.sheet-aspt_table td span{
	min-width:50px;
	margin:0;
}

.sheet-aspt_table input[type="text"]{
	height:25px;
	width:85%;
	letter-spacing: 0;
	display:inline-block;
	margin:5px -3px 5px 5px;
	border:1px solid #bbb;
}

/*Right Side*/

.sheet-top_label{
	position:absolute;
	top:0;
	left:0;
	padding:0 2px;
	margin-top:0;
	font-size:1em;
	white-space:nowrap;
	text-align:center;
}

.sheet-faith{
	margin:0 0 0 10%;
}

.sheet-faith,
.sheet-devo{
	position:relative;
	float:left;
	display:inline-block;
}

.sheet-chapter, .sheet-demon{
	position:relative;
	float:left;
	display:inline-block;
	margin:0 10px;
}

.sheet-faith input[type="text"],
.ui-dialog .tab-content .charsheet .sheet-demon button[type="roll"]{
	width: 50px;
    height: 40px;
    border: 3px solid black;
	padding:5px;
	margin:10px 0 -5px 0;
	border-radius: 10px;
	text-align:center;
}

.ui-dialog .tab-content .charsheet .sheet-demon button[type="roll"] {
	background-color: black;
	background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/refs/heads/master/Demon%20Hunters%20Beta/images/infernal.jpg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 40px;
	margin-left: 5px;
}

.sheet-chapter input[type="text"]
{
	width: 80px;
    height: 40px;
    border: 3px solid black;
	padding:5px;
	margin:10px 5px -5px -4px;
	border-radius: 10px;
	text-align:center;
}

.sheet-devo input[type="text"]{
	width: 50px;
    height: 40px;
    border: 2px solid black;
	padding:5px;
	margin:10px 10px -5px -5px;
	border-radius: 10px;
	text-align:center;
}

.sheet-spacer
{
	font-size:25px;
	font-weight:bold;
	padding:7px;
	vertical-align: middle;
}

.sheet-approaches{
	clear:left;
}

.sheet-appr_table td,
.sheet-disc_table td{
	height:40px;
	padding-right:5px;
	color:black;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing: -1px;
}

.ui-dialog .tab-content .charsheet .sheet-appr_table button,
.ui-dialog .tab-content .charsheet .sheet-disc_table button{
	height: 24px;
	display: inline-block;
}

.sheet-appr_table select,
.sheet-disc_table select{
	width: 58px;
    height: 40px;
    border: 2px solid black;
	border-radius: 5px;
}

.sheet-appr_table td {
	width:49%;
}

.sheet-appr_table td.attr_left_td select{
	margin:0 0 0 -67px;
}

.ui-dialog .tab-content .charsheet .sheet-appr_table td.attr_left_td button {
    margin: 1px 0 0 -85px;
}

.sheet-appr_table td.attr_left_td select.sheet-d2{
	margin:0 0 0 -120px;
}

.sheet-appr_table td.attr_right_td select,
.sheet-disc_table select{
	margin:0 -71px 0 10px;
}

.ui-dialog .tab-content .charsheet .sheet-appr_table td.attr_right_td button[type="roll"],
.ui-dialog .tab-content .charsheet .sheet-disc_table button[type="roll"] {
    margin: 1px -100px 0 72px;
}

.sheet-appr_table span,
.sheet-disc_table span{
	width:100%;
	border:1px solid gray;
	padding:3px;
	margin:8px 0 0;
}

.sheet-appr_table span.sheet-span_right,
.sheet-disc_table span.sheet-span_right {
	text-align:left;
	padding-left:100px;
}

.sheet-appr_table span.sheet-span_left{
	text-align:right;
	padding-right:100px;
}

.sheet-appr_table span.sheet-span_left.sheet-d2{
	text-align:right;
	padding-right:140px;
}

.sheet-disc_table span.sheet-fringe {
	margin-top:5px;
}

.sheet-disc_table input[type="text"] {
	margin:0 0 0 10px;
	border:1px solid #bbb;
}

/*Bottom*/

.sheet-bot {
	clear:both;
}

.sheet-bot div
{
	padding:5px 0 10px;
}

.sheet-conditions input[type=checkbox]{
	border:1px solid black;
}

.sheet-cond_table td{
	height:25px;
}

span.sheet-cond{
	color:#888;
	font-size: 10px;
    text-transform: uppercase;
}

.sheet-stunts textarea {
     height:35px;
	 width:100%;
	 max-width:100% !important;
	 margin: 0;
 }

 /*DM*/

 .sheet-dmcs-wrapper,
 .sheet-minions-wrapper {
	 min-height:500px !important;
	 padding:5px;
 }

 .sheet-dmc_col1
 {
	 width:33%;
	 float:left;
	 padding:10px 0;
 }

 .sheet-dmc_col2
 {
	 width:66%;
	 float:right;
	 padding:10px 0;
 }

.sheet-dmcs .sheet-bot div
 {
	 padding:5px 0 10px;
 }

 .sheet-dmcs-wrapper .sheet-aspects input[type="text"] {
     height:35px;
	 width:100%;
	 max-width:100% !important;
 }

 .sheet-dmc-disc_table{
    border-spacing:0 0 5px 0;
}

 .sheet-dmc-disc_table td{
    height: 40px;
    padding: 0 5px 0 0;
}

 .sheet-dmc-disc_table span.sheet-disc {
	margin: 2px;
    margin-left: calc(-100% + 10px);
    width: 40px;
    height: 40px;
	line-height: 35px;
    border: 2px solid black;
    border-radius: 5px;
    display: inline-block;
    background: white;
    text-align: center;
    vertical-align: middle;
}

.sheet-dmc-disc_table input[type="text"] {
	display:inline-block;
	width: calc(100% - 5px);
    border: 1px solid gray;
    padding: 3px 3px 3px 55px;
    margin: 0;
	z-index:2;
}

.sheet-notes textarea {
     height:35px;
	 width:100%;
	 max-width:100% !important;
 }

 /*Minions*/

.sheet-minions-wrapper .sheet-aspects label,
.sheet-minions-wrapper .sheet-stats label{
	display:inline-block;
	max-width:50%;
}

input.sheet-tab[value=mob] {
    top: 10px;
    right: 10px;
    width:calc(50% - 40px);
}
input.sheet-tab[value=mob] + span {
    top: 10px;
    right: 10px;
	width:calc(50% - 40px);
	border: 1px solid black;
    border-bottom: 1px dashed gray;
	border-radius: 4px 4px 0 0;
}


input.sheet-tab[value=individual] {
    top: 10px;
    right:calc(50% - 30px);
    width:calc(50% - 40px);
}
input.sheet-tab[value=individual] + span {
    top: 10px;
    right: calc(50% - 30px);
	width:calc(50% - 40px);
	border: 1px solid black;
    border-bottom: 1px dashed gray;
	border-radius: 4px 4px 0 0;
}

div.sheet-mob-wrapper, div.sheet-individual-wrapper{
	border:1px solid black;
	background:#E6DD93;
	margin-top:1px;
	padding: 5px 10px 0;
	border-radius: 4px 0;
}

input.sheet-tab[value=mob]:checked ~ div.sheet-mob-wrapper,
input.sheet-tab[value=individual]:checked ~ div.sheet-individual-wrapper {
	display:block;
}

.sheet-min_dif ul {
	padding-left:20px;
	font-size:14px;
}
.sheet-min_dif ul li{
	padding-bottom:5px;
}

/*Roll Templates, Edit Buttons & Other*/

div.repcontrol, div.repcontainer{
	padding:0 0 3px;
}

div.repitem{
	padding:3px;
}

.repcontainer.editmode[data-groupname=repeating_min_cond-mild] button,
.repcontainer.editmode[data-groupname=repeating_min_cond-mod] button,
.repcontainer.editmode[data-groupname=repeating_min_cond-sev] button,
.repcontainer.editmode[data-repeating_min_aspt] button {
    padding: 1px 6px;
    margin-top: -10px;
}

.sheet-rolltemplate-RollAll > table {
	background-color:white;
    background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/refs/heads/master/Demon%20Hunters%20Beta/images/logo_light.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    min-height: 150px;
	min-width:180px;
	border-spacing: 0;
	border:3px solid black;
	border-radius: 10px;
}

.sheet-rolltemplate-RollAll > table tr th,
.sheet-rolltemplate-Demon > table tr th{
	height:25px;
	padding:5px;
	color: #990000;
	text-align:left;
	font-style: italic;
	font-weight:bold;
}

.sheet-rolltemplate-RollAll > table tr td  {
	height:20px;
	padding:5px;
}

.sheet-rolltemplate-RollAll > table tr td:nth-child(2){
	font-weight:bold;
	text-align:center;
	font-size:1.1em;
}

.sheet-rolltemplate-RollAll > table tr td:first-child{
	font-variant:small-caps;
}

.sheet-rolltemplate-RollAll > table tr:nth-child(1) td,
.sheet-rolltemplate-RollAll > table tr:nth-child(3) td,
.sheet-rolltemplate-RollAll > table tr:nth-child(5) td{
   background-color:rgba(0, 0, 0, 0.2);
}

.sheet-rolltemplate-RollAll .inlinerollresult   {
    background-color: transparent;
    border: none;
}

.sheet-rolltemplate-RollAll .inlinerollresult.fullcrit {
	color: #3FB315;
    border: none;
}

.sheet-rolltemplate-RollAll .inlinerollresult.fullfail{
	color: #B31515;
    border: none;
}

.sheet-rolltemplate-RollAll .inlinerollresult.importantroll{
	color: #4A57ED;
    border: none;
}

.sheet-rolltemplate-Demon > table
{
	height:125px;
	width:150px;
}

.sheet-rolltemplate-Demon > table tr td {
	height: 100px;
	width: 150px;
	border-spacing: 0;
	border: 1px solid black;
	font-size: 80px;
	font-weight: 700;
	text-shadow: 0 0 5px #cc0000;
	padding: 0;
	margin: 0;
	background: black;
	text-align: center;
}

.sheet-rolltemplate-Demon .inlinerollresult,
.sheet-rolltemplate-Demon .inlinerollresult.fullcrit,
.sheet-rolltemplate-Demon .inlinerollresult.importantroll {
	display:block;
	width:100%;
	height:100%;
	padding:0 0 0 8px;
	margin:0;
	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
	line-height:100px;
	background-color:white;
    background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/refs/heads/master/Demon%20Hunters%20Beta/images/dont-panic.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position:right;
	border:none;
    color:black;
}

.sheet-rolltemplate-Demon .inlinerollresult.fullfail {
	width:100%;
	height:100%;
	background-color:black;
    background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/refs/heads/master/Demon%20Hunters%20Beta/images/blood-spatter.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position:center;
	border:none;
    color:black;
}