@import url('https://fonts.googleapis.com/css?family=Tangerine&display=swap|Tinos:wght@700&display=swap|Quando&display=swap');

.charsheet{
	font-family: 'Tangerine', cursive;
	font-weight:bold;
	/*font-size:xx-large;*/
	min-width: 832px;
	max-width: 832px;
	background-color:white;

}


.section-header{
	font-size:xx-large;
}



.sheet-rolltemplate-challenge .sheet-wrapper{
    height: 101px;
    width: 207px;
	padding:16px 5px 10px 5px;
	color:black;
	background-repeat:no-repeat;
	background-image: url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/roll-background25.jpg)
}

.sheet-rolltemplate-challenge div{
	text-align:center;
}


.sheet-rolltemplate-challenge hr {
    margin-top: 5px;
    margin-bottom: 5px;
}


.sheet-rolltemplate-challenge  .sheet-name{
	font-family:Tangerine;
	font-size:xx-large;
	font-weight:bold;
}

.sheet-rolltemplate-challenge  .sheet-resource{
	font-family:Tangerine;
	font-size:xx-large;
	font-weight:bold;
	margin-top: 11px;
	margin-bottom:5px;
}

.sheet-rolltemplate-challenge  .sheet-roll{
	font-family:Quando;
}

.sheet-rolltemplate-challenge  .sheet-result{
	font-family:Quando;
	text-transform:uppercase;
}

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


	.sheet-rolltemplate-challenge .inlineroll {


	}

	.sheet-rolltemplate-challenge .inlinerollresult.importantroll{
		border:none;
	}

	.sheet-rolltemplate-challenge .inlinerollresult.fullcrit{
		border:none;
	}

	.sheet-rolltemplate-challenge .inlinerollresult.fullfail {
		border:none;
	}


.headerSection{
    position: relative;
    height: 168px
}



.headerSection .section1{
	position: absolute;
    font-size: 32px;
    top: 0px;
    left: 145px
}

.headerSection .section2{
    position: absolute;
    font-size: 100px;
    top: -15px;
    left: 152px;
}

.headerSection .section3{
	position: absolute;
    font-size: 100px;
    top: 40px;
    left: 83px;
}

.main-grid-container{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0px 5px;
}


.left-grid-container{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 169px max-content  max-content   max-content ;
  gap: 5px 0px;
}


.right-grid-container{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows:  max-content max-content  max-content   max-content ;
  /*grid-template-rows: 103px 100px 100px 100px 100px;*/
  gap: 5px 0px;
}


.x1frContent{
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 13px;
    /* grid-template-rows: max-content; */
    line-height: 34px;
    align-items: center;
}

.x1frContent input{
    width: 100%;
    padding: 0px;
    border-bottom: 1px solid black;
}

.x1frContent span{
    align-self: end;
    display: block;
	Font-size: x-large;
}


.details input[type="text"]{
	font-family: Tino;
    text-transform: uppercase;
    font-size: large;
}

.sheet-quirks{
	font-size:xx-small;
}


.resource-grid{
	display: grid;
    grid-template-columns: 82px 82px 82px;
    gap: 5px;
	margin: 0px 28px 0px 63px
}

.resource-grid button{
	font-size:x-large;
}

.resource-bubble{
	position:relative;

	background-image:url("https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/resource-bubble24.png");
    height: 137px;
    width: 100px;
	background-repeat: no-repeat;
}


.resource-bubble input{
    position: absolute;
    width: 80%;
    left: 7px;
    top: 63px;
    height: 64px;
    border: none;
    background: transparent;
    font-size: xx-large;
	font-weight:bold;
    font-family: Tino;
	text-align:center;
}

.resource-bubble select{
    border-radius: 100%;
    position: absolute;
    width: 84%;
    left: 0px;
    top: 63px;
    height: 64px;
    border: none;
    background: transparent;
    font-size: xx-large;
    font-weight: bold;
    font-family: Tino;
    text-align: center;
	margin:0px;
}

.charsheet .ExpertiseAbilities{
    margin: 0px;
    width: 393px;
    height: 58px;
    font-family: Quando;
    font-size: small;
    text-transform: uppercase
}


.fortuneGrid{
	display: grid;
    grid-template-columns: max-content 1fr;
    gap: 1px;
}


.fortuneGrid span{
	display:block;
}

.fortune{
	position:relative;
	background-image:url("https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/fortune22.png");
    height: 95px;
    width: 66px;
	background-repeat: no-repeat;
}


.fortune input{
position: absolute;
    width: 80%;
    left: 6px;
    top: 16px;
    height: 64px;
    border: none;
    background: transparent;
    font-size: xxx-large;
    font-weight: bold;
    font-family: Tino;
    text-align: center;
}


.fortuneNotes{
    margin: 0px;
    width: 90%;
    height: 102px;
	font-family:Quando;
	border: 1px solid lightgray;
	text-transform:uppercase;

}

.tradecraftGrid{
	display: grid;
    grid-template-columns: max-content 1fr;
    gap: 25px;
    line-height: normal;
    padding: 0px;;
}

.tradecraftGrid textarea{
	font-family: Quando;
	font-size:small;
	width: 293px;
    height: 74px;
}


.InjuriesAfflicationGrid{
	display: grid;
    grid-template-columns: 307px 80px;
    gap: 1px;
}

.InjuriesAfflicationGrid input{
	width:100%;
	border-bottom:1px solid black;
	font-family: Quando;
}

.InjuriesAfflicationGrid select{
	width:100%;
	margin:0px;
	font-family: Quando;
	border:none;
	border-bottom: 1px solid black;
    border-radius: 0px;
	padding:0px;
}



.HitsGrid{
	display: grid;
    grid-template-columns: max-content 1fr;
    gap: 1px;
	margin-top: 10px;
}

.hits{
	position:relative;
	background-image:url("https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/hits23.png");
    height: 95px;
    width: 66px;
	background-repeat: no-repeat;
}


.hits input[type=text]{
	position: absolute;
    width: 80%;
    left: 5px;
    top: 16px;
    height: 45px;
    border: none;
    background: transparent;
    font-size: xxx-large;
    font-weight: bold;
    font-family: Tino;
    text-align: center;
}


.ArmorGrid{
	display: grid;
    grid-template-columns: max-content 1fr;
    gap: 1px;
	margin-top: 10px;
	align-items: end;
}

.ArmorGrid button[type="roll"]{
	font-weight: bold;
    font-family: Tino;
	font-size:large;
}



.ArmorGrid textarea{
}

.ArmorGrid span{
	display:block
}

.Armor{
	position:relative;
	background-image:url("https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/armor23.png");
    height:107px;
    width: 66px;
	background-repeat: no-repeat;
}


.Armor input[type=text]{
	position: absolute;
    width: 80%;
    left: 5px;
    top: 22px;
    height: 45px;
    border: none;
    background: transparent;
    font-size: 27px;
    font-weight: bold;
    font-family: Tino;
    text-align: center;
}



.Armor select{
	border-radius: 100%;
    position: absolute;
    width: 95%;
    left: 2px;
    top: 15px;
    height: 64px;
    border: none;
    background: transparent;
    font-size: x-large;
    font-weight: bold;
    font-family: Tino;
    text-align: center;
    margin: 0px
}


.possessions span{
	font-weight: bold;
    font-family: Tino;
	font-size:large;
}

.possessions textarea{
    margin: 0px;
    width: 97%;
    height:  365px;
    border: 1px solid lightgray;
	font-family: Quando;
	font-size: small;
	text-transform: uppercase;
}



.hits input[type=checkbox]{
}

.hitsFalter1{
	position: absolute;
    width: 80%;
    left: 6px;
    top: 56px;
}

.hitsFalter2{
	position: absolute;
    width: 80%;
    left: 41px;
    top: 56px;
}

.minorHdr {
	font-weight: bold;
    font-family: Tino;
	font-size:large;
}

.quirk textarea{
    margin: 0px;
    width: 97%;
    height: 27px;
    border: 1px solid lightgray;
	font-family: Quando;
	font-size: xx-small;
}

.favour span{
	font-weight: bold;
    font-family: Tino;
	font-size:large;
}


.favour input[type=text]{
	width:200px;
	font-family: Tino;
	font-size:large;
}

.charsheet .favourDtls{
    margin: 0px;
    width: 97%;
    height: 60px;
    border: 1px solid lightgray;
	font-family: Tino;
	font-size:small;
	text-transform: uppercase
}


.esoterica{
    margin: 0px;
    width: 97%;
    height: 60px;
    border: 1px solid lightgray;
	font-family: Tino;
	font-size:large;
	text-transform: uppercase


}


.unravelling{
	position:relative;
	background-image:url("https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/dice22.png");
	background-repeat:no-repeat;
	height:110px;
	width:330px;
	margin-left: 45px;
	margin-bottom: 10px;
}

.unravelling button.text_roll[type="roll"]{
	position: absolute;
    top: 8px;
    left:127px;
    font-family: Tangerine;
	font-size:32px;
}


.unravelling #d12{
	position: absolute;
	top: 71px;
    left: 25px;
}

.unravelling #d10{
	position: absolute;
	top: 74px;
    left: 92px;
}



.unravelling #d8{
	position: absolute;
	top: 74px;
    left: 159px;
}

.unravelling #d6{
	position: absolute;
	top: 72px;
    left:224px;
}


.unravelling #d4{
	position: absolute;
	top: 75px;
    left: 290px;
}




input[type="radio"].diced12{
  display:none;
}

.diced12 + label[for=d12]
{
	top: 39px;
    left: -5px;
	width:63px;
}

.diced12:checked + label[for=d12]
{
	background-repeat:no-repeat;
    background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/ring23.png);
}


.diced10{
   display:none;
}

.diced10 + label[for=d10]
{
    top: 40px;
    left: 60px;
	width:63px;

}

.diced10:checked + label[for=d10]
{
	background-repeat:no-repeat;
    background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/ring23.png);
}


.diced8{
   display:none;
}

.diced8 + label[for=d8]
{
    top: 39px;
    left: 129px;
	width:63px;
}

.diced8:checked + label[for=d8]
{
	background-repeat:no-repeat;
    background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/ring23.png);
}


.diced6{
   display:none;
}

.diced6 + label[for=d6]
{
    top: 39px;
    left: 195px;
	width:63px;
}

.diced6:checked + label[for=d6]
{
	background-repeat:no-repeat;
    background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/ring23.png);
}

.diced4{
   display:none;
}

.diced4 + label[for=d4]
{
    top: 46px;
    left: 260px;
	width:63px;
}

.diced4:checked + label[for=d4]
{
	background-repeat:no-repeat;
    background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/ring23.png);
}

.baseDieLabel{
	position: absolute;
    background-image: none;
    height: 72px;
    width: 72px;
    display: inline-block;
    padding: 0 0 0 0px;
    cursor: pointer;

}


.charsheet .AffilationContact{
    margin: 0px;
    width: 393px;
    height: 58px;
    font-family: Quando;
    font-size: small;
    text-transform: uppercase
}

.resource-selector{
	display: grid;
    grid-template-columns: 50px 79px 50px 79px 50px 79px;
    gap: 1px;
    align-items: center;
    grid-template-rows: 49px;
}



.resource-selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;
}

.systemIcon{background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/system2.png);}
.kitIcon{background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/kit22.png);}
.vigilanceIcon{background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/vigilance22.png);}
.magicIcon{background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/magic22.png);}
.accessIcon{background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/access22.png);}
.conspiracyIcon{background-image:url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/conspiracy22.png);}


.charsheet *:focus {
  outline: none;
}

.charsheet textarea {
    width: 96%;
}


.resource-selector input:active +.resource-used{opacity: .9;}
.resource-selector input:checked +.resource-used{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
}
label.resource-used{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
	width: 46px;
    height: 75px;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(1.1) grayscale(1) opacity(.4);
       -moz-filter: brightness(1.1) grayscale(1) opacity(.4);
			filter: brightness(1.1) grayscale(1) opacity(.4);

}

label.resource-used:hover{
    -webkit-filter: brightness(1.2) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1.2) grayscale(.5) opacity(.9);
            filter: brightness(1.2) grayscale(.5) opacity(.9);
}


.fixLH{
	line-height:0.5em;
    z-index: 0;
}

.TaC{
    padding-left: 137px;
	margin-top:0px;
}

.section-wrapper{
	padding:5px;
	border:1px solid black;
}

.text_input{
	border: none;
    box-shadow: none;
    /*border-bottom: 1px solid black;*/
    border-radius: 0;
	display:inline-block;
	outline:none;
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;

}




/* Text button */

.charsheet button[type=roll].text_roll::before {
    content: " ";
    background-image: none;
}

.charsheet button.text_roll[type="roll"] {
	font-size: x-large;
	font-weight:bold;
    display: inline-block;
    box-shadow: none;
	outline:none;
    margin: 0;
    text-align: center;
    cursor: pointer;
    background-image: none;
    background-color: transparent;
    white-space: nowrap;
    border: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: black;
    line-height: 11px;

}

.charsheet button.text_roll[type="roll"]:hover {
    /*background-color:rgb(230, 239, 230);*/
    /*border-color: red;*/
    color:red;
}

.charsheet button.text_roll[type="roll"] label, .charsheet button[type="roll"] input {
    height:24px;
    line-height: 24px;
    text-align:center;
    width: 100%;
    cursor: pointer;
    background: none;
    box-shadow: none;
    transition: none;
    border:none;
    font-weight:700;
}


.charsheet button.text_roll[type="roll"]:hover label, .charsheet button[type="roll"]:hover input {
    color: white;
    border: none;
}


/* End Text button end*/


/* Text Action button */

.charsheet button[type="action"] text_roll::before {
    content: " ";
	*background-image: none;
}

.charsheet button.text_roll[type="action"] {
	font-size: x-large;
	font-weight:bold;
	font-family:tangerine;
    display: inline-block;
    box-shadow: none;
	outline:none;
    margin: 0;
    text-align: left;
    cursor: pointer;
    background-image: none;
    background-color: transparent;
    white-space: nowrap;
    border: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: black;
    line-height: 11px;

}

.charsheet button.text_roll[type="action"]:hover {
    /*background-color:rgb(230, 239, 230);*/
    /*border-color: red;*/
    color:red;
}

.charsheet button.text_roll[type="action"] label, .charsheet button[type="action"] input {
    height:24px;
    line-height: 24px;
    text-align:left;
    width: 100%;
    cursor: pointer;
    background: none;
    box-shadow: none;
    transition: none;
    /*border-radius: none;*/
    border:none;
    font-weight:700;
}


.charsheet button.text_roll[type=action]:hover label, .charsheet button[type=action]:hover input {
    color: white;
    border: none;
}


/* End Text button end*/
.unravelling button.clearButt[type="action"]{
	position: absolute;
    top: 91px;
    left: 327px;
    z-index: 0;
    font-size: medium;
}


	/*Unravelling template */

.sheet-rolltemplate-unravelling .sheet-wrapper{
    height: 232px;
    width: 207px;
	padding:16px 5px 10px 5px;
	background-repeat:no-repeat;
	background-image: url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/roll-background33.jpg)
}

.sheet-rolltemplate-unravelling .sheet-immediateGrid
{
	display: grid;
    grid-template-columns: 50px 151px;
    gap: 1px;
	margin: 2px 0px 10px 0px;
}


.sheet-rolltemplate-unravelling .sheet-humour{
	font-weight:bold;
}

.sheet-rolltemplate-unravelling .sheet-dtls{
	font-size: x-small;
    line-height: 1em;
    text-align: left;
	text-transform: none;
}


.sheet-rolltemplate-unravelling div{
	text-align:center;
}


.sheet-rolltemplate-unravelling hr {
    margin-top: 5px;
    margin-bottom: 5px;
}


.sheet-rolltemplate-unravelling  .sheet-name{
	font-family:Tangerine;
	font-size:xx-large;
	font-weight:bold;
}

.sheet-rolltemplate-unravelling  .sheet-resource{
	font-family:Tangerine;
	font-size:xx-large;
	font-weight:bold;
	margin-top: 11px;
	margin-bottom:5px;
}

.sheet-rolltemplate-unravelling  .sheet-roll{
	font-family:Quando;
}

.sheet-rolltemplate-unravelling  .sheet-result{
	font-family:Quando;
	text-transform:uppercase;
	line-height: 1em;
}

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


	.sheet-rolltemplate-unravelling .inlineroll {


	}

	.sheet-rolltemplate-unravelling .inlinerollresult.importantroll{
		border:none;
	}

	.sheet-rolltemplate-unravelling .inlinerollresult.fullcrit{
		border:none;
	}

	.sheet-rolltemplate-unravelling .inlinerollresult.fullfail {
		border:none;
	}


	/*                      */

/* Armour Template */
.sheet-rolltemplate-armour .sheet-wrapper{
    height: 101px;
    width: 207px;
	padding:16px 5px 10px 5px;
	background-repeat:no-repeat;
	background-image: url(https://raw.githubusercontent.com/Lockbox313/roll20-character-sheets/master/The_Dee_Sanction/images/roll-background25.jpg)
}

.sheet-rolltemplate-armour div{
	text-align:center;
}


.sheet-rolltemplate-armour hr {
    margin-top: 5px;
    margin-bottom: 5px;
}


.sheet-rolltemplate-armour  .sheet-name{
	font-family:Tangerine;
	font-size:xx-large;
	font-weight:bold;
}

.sheet-rolltemplate-armour  .sheet-resource{
	font-family:Tangerine;
	font-size:xx-large;
	font-weight:bold;
	margin-top: 11px;
	margin-bottom:5px;
}

.sheet-rolltemplate-armour  .sheet-roll{
	font-family:Quando;
}

.sheet-rolltemplate-armour  .sheet-result{
	font-family:Quando;
	text-transform:uppercase;
}

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


	.sheet-rolltemplate-armour .inlineroll {


	}

	.sheet-rolltemplate-armour .inlinerollresult.importantroll{
		border:none;
	}

	.sheet-rolltemplate-armour .inlinerollresult.fullcrit{
		border:none;
	}

	.sheet-rolltemplate-armour .inlinerollresult.fullfail {
		border:none;
	}
	/*               */

/*-------------------------------------------*/
/*------------ Repeating Buttons ------------*/
/*-------------------------------------------*/

.repcontrol .btn {
    border: 0 solid transparent;
    color: white !important;
    background: none;
    font-size: 0px;
    box-shadow: none;
    margin-bottom: 1px;
	font-family: pictos;
	font-style: normal;
}

.repcontrol .repcontrol_edit::after {
    content: '(';
}

 .editmode ~ .repcontrol .repcontrol_edit::after {
    content: ')';
}

.repcontrol .repcontrol_add::before {
	content: '&';
}

 .repcontrol .repcontrol_add::before,
 .repcontrol .repcontrol_edit::after {
    visibility: visible;
    background-color: #fff;
    border: 1px solid #999;
    border-radius: 2px;
    font-size: 12px;
    height: 12px;
    width: 12px;
    padding: 2px 4px 2px 4px;
    color: #333;
}

.repcontrol .repcontrol_edit:hover::after,
.repcontrol .repcontrol_add:hover::before
{
    background-color: #EFEFEF;
}